/*
 * Altexsa — hoja de estilos de marca para el panel de clientes (FOSSBilling, tema Huraga).
 *
 * Vive en themes/huraga/assets/css/altexsa.css y se carga DESPUES de huraga.css
 * desde layout_default.html.twig y layout_public.html.twig. No se toca huraga.css:
 * asi una actualizacion del tema no borra esto (y si lo hiciera, este archivo se
 * vuelve a copiar y a enganchar en un minuto: ver instalar.sh).
 *
 * Los colores son los del logo: azul marino #002259 y dorado #EDA000. Regla de
 * la marca (decidida por Bacho, "opcion B"): el dorado queda reservado para los
 * botones de accion; todo lo demas es azul marino, blanco y grises azulados.
 */

/* Letra: Inter (2026-10-11, elegida por Bacho en vez de Lexend). La sirve la propia tienda desde
   themes/huraga/assets/fonts/inter/ (bajada de Google Fonts, licencia libre OFL en esa carpeta): no depende de
   Google ni de nadie. Grosores 300 a 800 en un solo archivo por idioma (letra variable). */
@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/inter/inter-latin-ext-normal.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/inter/inter-latin-normal.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:italic;font-weight:300 800;font-display:swap;src:url('../fonts/inter/inter-latin-ext-italic.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:italic;font-weight:300 800;font-display:swap;src:url('../fonts/inter/inter-latin-italic.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root,
[data-bs-theme="light"] {
  --altexsa-azul: #002259;
  --altexsa-azul-medio: #123A7A;
  --altexsa-azul-claro: #EEF3FB;
  --altexsa-oro: #EDA000;
  --altexsa-oro-oscuro: #C98700;
  --altexsa-gris: #526078;
  --altexsa-borde: #E3E9F2;

  --bs-primary: var(--altexsa-azul);
  --bs-primary-rgb: 0, 34, 89;
  --bs-link-color: var(--altexsa-azul);
  --bs-link-color-rgb: 0, 34, 89;
  --bs-link-hover-color: var(--altexsa-oro-oscuro);
  --bs-link-hover-color-rgb: 201, 135, 0;
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-body-bg: #F6F8FB;
  --bs-body-color: #26324A;
  --bs-border-color: var(--altexsa-borde);
}

body {
  font-family: var(--bs-body-font-family);
  letter-spacing:normal;
}

h1, h2, h3, h4, h5, h6,
.card-header, .card-title, .page-header, .h6 {
  color: var(--altexsa-azul);
  font-weight: 600;
}

/* ---------------------------------------------------------------- botones */
.btn-primary {
  --bs-btn-bg: var(--altexsa-oro);
  --bs-btn-border-color: var(--altexsa-oro);
  --bs-btn-color: var(--altexsa-azul);
  --bs-btn-hover-bg: var(--altexsa-oro-oscuro);
  --bs-btn-hover-border-color: var(--altexsa-oro-oscuro);
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--altexsa-oro-oscuro);
  --bs-btn-active-border-color: var(--altexsa-oro-oscuro);
  --bs-btn-active-color: #fff;
  --bs-btn-focus-shadow-rgb: 237, 160, 0;
  font-weight: 600;
}
.btn-dark, .btn-secondary {
  --bs-btn-bg: var(--altexsa-azul);
  --bs-btn-border-color: var(--altexsa-azul);
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: var(--altexsa-azul-medio);
  --bs-btn-hover-border-color: var(--altexsa-azul-medio);
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--altexsa-azul-medio);
  --bs-btn-active-border-color: var(--altexsa-azul-medio);
}
.btn-outline-primary {
  --bs-btn-color: var(--altexsa-azul);
  --bs-btn-border-color: var(--altexsa-azul);
  --bs-btn-hover-bg: var(--altexsa-azul);
  --bs-btn-hover-border-color: var(--altexsa-azul);
  --bs-btn-hover-color: #fff;
}
.btn { border-radius: 10px; }
.btn-sm { border-radius: 8px; }

/* ---------------------------------------------------------------- tarjetas */
.card {
  border: 1px solid var(--altexsa-borde);
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(0, 34, 89, 0.06);
  overflow: hidden;
}
.card-header {
  background: #fff;
  border-bottom: 1px solid #EEF2F7;
  padding-top: .85rem;
  padding-bottom: .85rem;
}
.card-header h6, .card-header .h6 { font-size: 1rem; }
.card-body { color: var(--bs-body-color); }
dt.text-muted { color: var(--altexsa-gris) !important; }

/* el aviso de bienvenida del escritorio */
.alert-info {
  --bs-alert-bg: var(--altexsa-azul-claro);
  --bs-alert-border-color: #D5E0F2;
  --bs-alert-color: var(--altexsa-azul);
  --bs-alert-link-color: var(--altexsa-oro-oscuro);
  border-radius: 14px;
}
.alert-info h1, .alert-info h2, .alert-info h3 { color: var(--altexsa-azul); }

/* ---------------------------------------------------------------- menú lateral */
#sidebarMenu .nav-link {
  color: #3C4A5E;
  border-radius: 10px;
  padding: .55rem .8rem;
  margin-bottom: 2px;
}
#sidebarMenu .nav-link:hover { background: #F0F4FA; color: var(--altexsa-azul); }
#sidebarMenu .nav-link.active,
#sidebarMenu .offcanvas-item.active .nav-link {
  background: var(--altexsa-azul-claro);
  color: var(--altexsa-azul);
  font-weight: 600;
}
#sidebarMenu .nav-link .icon { color: currentColor; }
#sidebarMenu .nav-item { border: 0 !important; }

/* ---------------------------------------------------------------- cabecera */
header .nav-link, .navbar .nav-link { color: #3C4A5E; }
header .nav-link.active, .navbar .nav-link.active { color: var(--altexsa-azul); font-weight: 600; }
header img[alt], .navbar img[alt] { max-height: 44px; width: auto; }

/* ---------------------------------------------------------------- etiquetas, tablas, migas */
.badge.bg-primary, .badge.text-bg-primary {
  background-color: var(--altexsa-oro) !important;
  color: var(--altexsa-azul) !important;
}
.badge.bg-success, .badge.text-bg-success { background-color: #1E9E62 !important; }
.table thead th { color: var(--altexsa-azul); font-weight: 600; border-bottom-color: var(--altexsa-borde); }
.breadcrumb a { color: var(--altexsa-azul); }
.breadcrumb .active { color: var(--altexsa-gris); }
.list-group-item.active {
  background: var(--altexsa-azul);
  border-color: var(--altexsa-azul);
}

/* ---------------------------------------------------------------- formularios */
.form-control:focus, .form-select:focus {
  border-color: var(--altexsa-azul-medio);
  box-shadow: 0 0 0 .2rem rgba(0, 34, 89, .12);
}
.form-check-input:checked { background-color: var(--altexsa-azul); border-color: var(--altexsa-azul); }

/* ---------------------------------------------------------------- inicio de sesion */
/* los dos botones de abajo ("Crear cuenta" / "¿Olvidaste tu contraseña?") se
   partian en dos lineas; que respiren y no se corten */
.login-page .btn, body:has(form[action*="login"]) .btn-outline-primary,
.card form .d-flex .btn { white-space: nowrap; }
.card .btn-outline-primary { font-size: .9rem; padding: .45rem .9rem; }

/* ---------------------------------------------------------------- pie */
#footer { color: var(--altexsa-gris); }
#footer a { color: var(--altexsa-azul); }

/* el botón "Arriba" flotante */
.btn.position-fixed, #to-top, .back-to-top {
  background: var(--altexsa-azul) !important;
  border-color: var(--altexsa-azul) !important;
  color: #fff !important;
}

/* Espaciado entre letras: el normal de la letra en todo (pedido de Bacho, 11-10). */
/* Inter: cifras del mismo ancho en los montos de la compra, para que los precios queden alineados (2026-10-11) */
/* solo en los MONTOS: en fechas el ancho fijo de Inter separa los números ("11 - 10 - 2027"), revisado el 11-10 */
.ac-item .p, .ac-cuenta .f > span:last-child, .ac-tabla .p, .ac-precio b{ font-variant-numeric: tabular-nums; }