/* DOMED checkbox
   Fuente visual única para checkbox cuadrados visibles.
   Se carga después del CSS de página para neutralizar Bootstrap y estilos
   de módulo sin modificar posicionamiento, labels ni lógica JavaScript. */

:root {
  --dg-checkbox-size: 18px;
  --dg-checkbox-bg: #ffffff;
  --dg-checkbox-border: #111827;
  --dg-checkbox-disabled-bg: #f3f4f6;
  --dg-checkbox-disabled-border: #9ca3af;
  --dg-checkbox-disabled-mark: #4b5563;
  --dg-checkbox-focus: rgba(245, 158, 11, 0.45);
  --dg-checkbox-check-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.2l3.1 3.1L13 4.5' fill='none' stroke='%23111827' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --dg-checkbox-check-disabled-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.2l3.1 3.1L13 4.5' fill='none' stroke='%234b5563' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --dg-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10' fill='none' stroke='%23111827' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Exclusiones:
   - .dg-checkbox-exempt: escape hatch explícito.
   - wrappers/clases switch|toggle y role=switch: conservan su UI.
   - dg-hide/hidden y proxies custom: el input técnico sigue oculto.
   La especificidad deliberada permite que esta capa final gane únicamente
   en apariencia frente a reglas legacy con !important. */
:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide,
      input[hidden],
      input[aria-hidden="true"],
      input.visually-hidden,
      input[class*="switch"],
      input[class*="toggle"],
      input[style*="display:none"],
      input[style*="display: none"],
      input[style*="opacity:0"],
      input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
) {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  display: inline-block;
  width: var(--dg-checkbox-size) !important;
  height: var(--dg-checkbox-size) !important;
  min-width: var(--dg-checkbox-size) !important;
  min-height: var(--dg-checkbox-size) !important;
  max-width: var(--dg-checkbox-size) !important;
  max-height: var(--dg-checkbox-size) !important;
  padding: 0 !important;
  vertical-align: middle;
  flex-shrink: 0;
  background: var(--dg-checkbox-bg) none center / 14px 14px no-repeat !important;
  border: 2px solid var(--dg-checkbox-border) !important;
  border-radius: 4px !important;
  color: var(--dg-checkbox-border) !important;
  box-shadow: none !important;
  filter: none !important;
  cursor: pointer;
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):hover {
  background-color: #ffffff !important;
  border-color: #000000 !important;
  box-shadow: 0 0 0 1px rgba(17, 24, 39, 0.12) !important;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):checked {
  background: #ffffff var(--dg-checkbox-check-image) center / 14px 14px no-repeat !important;
  border-color: #111827 !important;
  color: #111827 !important;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):indeterminate {
  background: #ffffff var(--dg-checkbox-indeterminate-image) center / 14px 14px no-repeat !important;
  border-color: #111827 !important;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):focus {
  outline: none !important;
  box-shadow: none !important;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):focus-visible {
  outline: 2px solid #f59e0b !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 3px var(--dg-checkbox-focus) !important;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):disabled {
  background: var(--dg-checkbox-disabled-bg) none center / 14px 14px no-repeat !important;
  border-color: var(--dg-checkbox-disabled-border) !important;
  color: var(--dg-checkbox-disabled-mark) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):checked:disabled {
  background: var(--dg-checkbox-disabled-bg) var(--dg-checkbox-check-disabled-image) center / 14px 14px no-repeat !important;
  border-color: var(--dg-checkbox-disabled-border) !important;
}

/* Los estados añaden especificidad para neutralizar incluso overrides
   temáticos scoped de Presupuestos que también usan !important. */
:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):checked::after,
:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
):indeterminate::after {
  content: none !important;
  display: none !important;
}

/* Evita marcas dobles creadas por estilos legacy con ::after. */
:is(
  :root body input[type="checkbox"]:not([role="switch"]):not(.dg-checkbox-exempt):not([hidden]):not([aria-hidden="true"]):not(
    :where(
      input.dg-hide, input[hidden], input[aria-hidden="true"], input.visually-hidden,
      input[class*="switch"], input[class*="toggle"],
      input[style*="display:none"], input[style*="display: none"],
      input[style*="opacity:0"], input[style*="opacity: 0"],
      .form-switch input[type="checkbox"],
      [class*="switch"] input[type="checkbox"],
      [class*="toggle"] input[type="checkbox"],
      .secure-checkbox input[type="checkbox"],
      .crt-check-label input[type="checkbox"],
      .bd-checkbox-wrap input[type="checkbox"]
    )
  )
)::after {
  content: none !important;
  display: none !important;
}

/* Proxies visuales existentes: el input continúa oculto y conserva su lógica. */
.bd-checkbox-box,
.crt-check-box,
.secure-checkbox {
  box-sizing: border-box !important;
  width: var(--dg-checkbox-size) !important;
  height: var(--dg-checkbox-size) !important;
  min-width: var(--dg-checkbox-size) !important;
  min-height: var(--dg-checkbox-size) !important;
  background: #ffffff none center / 14px 14px no-repeat !important;
  border: 2px solid #111827 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

.bd-checkbox-wrap input[type="checkbox"]:checked + .bd-checkbox-box,
.crt-check-label input[type="checkbox"]:checked + .crt-check-box,
.secure-checkbox:has(input[type="checkbox"]:checked) {
  background: #ffffff var(--dg-checkbox-check-image) center / 14px 14px no-repeat !important;
  border-color: #111827 !important;
}

.bd-checkbox-box::after,
.crt-check-box::after,
.secure-checkbox .checkmark {
  content: none !important;
  display: none !important;
}

.bd-checkbox-wrap input[type="checkbox"]:focus-visible + .bd-checkbox-box,
.crt-check-label input[type="checkbox"]:focus-visible + .crt-check-box,
.secure-checkbox:has(input[type="checkbox"]:focus-visible) {
  outline: 2px solid #f59e0b !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 3px var(--dg-checkbox-focus) !important;
}

.bd-checkbox-wrap input[type="checkbox"]:disabled + .bd-checkbox-box,
.crt-check-label input[type="checkbox"]:disabled + .crt-check-box,
.secure-checkbox:has(input[type="checkbox"]:disabled) {
  background-color: var(--dg-checkbox-disabled-bg) !important;
  border-color: var(--dg-checkbox-disabled-border) !important;
  opacity: 1 !important;
}
