/*
 * bootstrap-theme.css — Personalización de Bootstrap 5.3 solo mediante variables CSS
 * (sección 6.4 de PROMPT.md). No se compila Sass.
 */

:root,
[data-bs-theme="light"] {
  --bs-primary: var(--sus-azul);
  --bs-primary-rgb: 0, 111, 179;
  --bs-body-color: var(--tinta);
  --bs-body-color-rgb: 10, 19, 45;
  --bs-body-bg: var(--fondo);
  --bs-body-font-family: var(--fuente-texto);
  --bs-body-font-size: 1rem;
  --bs-body-line-height: var(--interlineado-texto);
  --bs-emphasis-color: var(--tinta);
  --bs-secondary-color: var(--tinta-suave);
  --bs-heading-color: var(--tinta);
  --bs-link-color: var(--sus-azul);
  --bs-link-color-rgb: 0, 111, 179;
  --bs-link-hover-color: var(--sus-azul-oscuro);
  --bs-link-hover-color-rgb: 0, 90, 145;
  --bs-border-color: var(--borde);
  --bs-border-radius: var(--radio-tarjeta);
  --bs-border-radius-sm: var(--radio-tarjeta);
  --bs-border-radius-lg: var(--radio-tarjeta);
  --bs-border-radius-pill: var(--radio-boton);
  --bs-focus-ring-color: rgba(0, 111, 179, 1);
  --bs-focus-ring-width: var(--foco-ancho);
}

/* Botones: una sola forma (redonda) y un solo relleno de acento. */
.btn {
  --bs-btn-border-radius: var(--radio-boton);
  --bs-btn-font-weight: 500;
  --bs-btn-padding-x: 1.25rem;
  --bs-btn-padding-y: 0.625rem;
  --bs-btn-focus-box-shadow: none; /* el foco lo dibuja base.css con outline + halo */
  min-height: var(--objetivo-tactil);
}

.btn-primary {
  --bs-btn-bg: var(--sus-azul);
  --bs-btn-border-color: var(--sus-azul);
  --bs-btn-color: var(--sus-blanco);
  --bs-btn-hover-bg: var(--sus-azul-oscuro);
  --bs-btn-hover-border-color: var(--sus-azul-oscuro);
  --bs-btn-hover-color: var(--sus-blanco);
  --bs-btn-active-bg: var(--sus-azul-noche);
  --bs-btn-active-border-color: var(--sus-azul-noche);
  --bs-btn-disabled-bg: var(--sus-azul);
  --bs-btn-disabled-border-color: var(--sus-azul);
}

.btn-outline-primary {
  --bs-btn-color: var(--sus-azul);
  --bs-btn-border-color: var(--sus-azul);
  --bs-btn-hover-bg: var(--sus-azul);
  --bs-btn-hover-border-color: var(--sus-azul);
  --bs-btn-hover-color: var(--sus-blanco);
  --bs-btn-active-bg: var(--sus-azul-oscuro);
  --bs-btn-active-color: var(--sus-blanco);
  --bs-btn-disabled-color: var(--sus-gris-texto);
  --bs-btn-disabled-border-color: var(--sus-borde);
  --bs-btn-border-width: 2px;
}

/* Botón deshabilitado: se mantiene legible (no depende solo de la opacidad). */
.btn:disabled,
.btn.disabled {
  --bs-btn-disabled-opacity: 1;
  cursor: not-allowed;
}
.btn-outline-primary:disabled {
  border-style: dashed;
}

/* Insignias: texto sobre fondo claro, nunca solo color (WCAG 1.4.1). */
.badge {
  --bs-badge-font-size: var(--paso-pequeno);
  --bs-badge-font-weight: 500;
  --bs-badge-padding-x: 0.625rem;
  --bs-badge-padding-y: 0.3rem;
  --bs-badge-border-radius: var(--radio-boton);
  --bs-badge-color: var(--tinta);
  background-color: var(--sus-insignia-fondo);
  white-space: normal;
  text-align: start;
  line-height: 1.3;
}

/* Modal: superficie blanca, esquinas rectas de ficha; la sombra es legítima porque flota. */
.modal {
  --bs-modal-border-radius: var(--radio-tarjeta);
  --bs-modal-inner-border-radius: var(--radio-tarjeta);
  --bs-modal-border-width: 0;
  --bs-modal-header-border-width: 0;
  --bs-modal-footer-border-width: 0;
  --bs-modal-color: var(--tinta);
  --bs-modal-bg: var(--fondo);
}
.modal-backdrop {
  --bs-backdrop-bg: var(--sus-azul-noche);
  --bs-backdrop-opacity: 0.72;
}

/* Navegación */
.navbar {
  --bs-navbar-color: var(--tinta);
  --bs-navbar-hover-color: var(--sus-azul);
  --bs-navbar-active-color: var(--sus-azul);
  --bs-navbar-toggler-border-radius: var(--radio-boton);
  --bs-navbar-toggler-focus-width: 0;
  --bs-navbar-toggler-padding-x: 1rem;
  --bs-navbar-toggler-padding-y: 0.5rem;
}

/* Botón de cierre de Bootstrap: objetivo táctil de 44 px. */
.btn-close {
  --bs-btn-close-focus-shadow: none;
  --bs-btn-close-opacity: 1;
  width: var(--objetivo-tactil);
  height: var(--objetivo-tactil);
  padding: 0;
}