/* public/css/marcas/aguasdelmonte.css — Tema de Resort Aguas del Monte.
 *
 * Colores tomados de aguasdelmonte.cl midiendo lo que la pagina pinta de
 * verdad, no de ojo: verde bosque #005041 en las franjas grandes, #004439 en
 * las oscuras y #008D7B como acento. La tipografia de titulares de la landing
 * es Gilda Display sobre Open Sans.
 *
 * Se carga DESPUES de custom.css y solo redefine variables. No se copia ni una
 * regla de la hoja base: asi un cambio de maquetacion sigue llegando a todos
 * los clientes y este archivo no se queda atras sin que nadie lo note.
 */

@import url('https://fonts.googleapis.com/css2?family=Gilda+Display&family=Open+Sans:wght@400;500;600;700&display=swap');

:root {
    /* ── Menu lateral ─────────────────────────────────────────────────── */
    --bg:            #00382F;   /* mas oscuro que la landing: es fondo de menu,
                                   no una franja, y compite con el contenido */
    --surface:       #004439;
    --surface-hover: rgba(0, 141, 123, .30);
    --border:        rgba(255, 255, 255, .10);
    --accent:        #6FC9B6;   /* aclarado para que se lea sobre el verde */
    --accent-soft:   rgba(0, 141, 123, .26);
    --text:          #E9F2EF;
    --text-muted:    #9DBAB2;
    --text-faint:    #8FA9A2;   /* aclarado: a #5E7C74 el subtitulo del menu
                                   quedaba en 2,95:1 sobre el verde, ilegible */

    /* ── Contenido ────────────────────────────────────────────────────── */
    --sp-primary:      #004439;
    --sp-accent:       #005041;
    --sp-accent-hover: #008D7B;
    --sp-bg-light:     #F4F8F6;
    --sp-card-border:  #DDE8E4;

    /* ── Bootstrap ────────────────────────────────────────────────────── */
    /* Son 85 text-primary y 36 btn-primary repartidos por las vistas. Teñirlos
       por variable los alcanza todos de una vez; a mano habria sido tocar
       cientos de sitios y olvidar unos cuantos. */
    --bs-primary:       #005041;
    --bs-primary-rgb:   0, 80, 65;
    --bs-link-color:    #005041;
    --bs-link-hover-color: #008D7B;
    --bs-link-color-rgb: 0, 80, 65;

    /* Los graficos leen estos dos. Verde contra rojo -la pareja por omision-
       es justo la que no distingue quien tiene daltonismo rojo-verde, asi que
       la segunda serie va a terracota, que se separa del verde por tono y por
       luminosidad a la vez. */
    /* Ojo: NO son los colores exactos de la marca, y es a proposito. El verde
       corporativo (#005041) es demasiado oscuro para una barra -queda fuera de
       la banda de luminosidad util y con tan poco croma que se lee gris-, y el
       dorado original daba 2,96:1 contra el blanco, por debajo del minimo. Son
       el mismo verde y el mismo dorado subidos hasta que pasan las cinco
       comprobaciones: banda de luminosidad, croma, separacion en daltonismo,
       separacion en vision normal y contraste contra el fondo.
       El verde oscuro sigue mandando en botones y titulos, donde si funciona. */
    --grafico-serie-1: #12876d;
    --grafico-serie-2: #B07A22;

    --marca-tipo-titulo: 'Gilda Display', Georgia, 'Times New Roman', serif;
    --marca-tipo-texto:  'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

body { font-family: var(--marca-tipo-texto); }

/* Los botones de Bootstrap 5.3 se pintan por variables propias, asi que basta
   con redefinirlas en lugar de pelear a golpe de !important. */
.btn-primary {
    --bs-btn-bg: #005041;            --bs-btn-border-color: #005041;
    --bs-btn-hover-bg: #008D7B;      --bs-btn-hover-border-color: #008D7B;
    --bs-btn-active-bg: #00382F;     --bs-btn-active-border-color: #00382F;
    --bs-btn-disabled-bg: #6E9990;   --bs-btn-disabled-border-color: #6E9990;
}
.btn-outline-primary {
    --bs-btn-color: #005041;         --bs-btn-border-color: #005041;
    --bs-btn-hover-bg: #005041;      --bs-btn-hover-border-color: #005041;
    --bs-btn-active-bg: #00382F;     --bs-btn-active-border-color: #00382F;
}
/* NO se redefinen .bg-primary, .text-primary ni .border-primary a mano.
   Bootstrap 5.3 las calcula con rgba(var(--bs-primary-rgb), --bs-*-opacity), y
   pisarlas con un color plano rompe las utilidades de opacidad: bg-opacity-10
   pasaba de ser un 10% de tinte a verde macizo, y el icono verde de la tarjeta
   de "Valor de Stock" desaparecía dentro de su propio recuadro. Basta con
   --bs-primary-rgb, que ya está arriba. */

/* El azul de foco de Bootstrap desentonaba con el verde en cada campo. */
.form-control:focus, .form-select:focus, .btn:focus-visible {
    border-color: #6FC9B6;
    box-shadow: 0 0 0 .2rem rgba(0, 141, 123, .22);
}
.form-check-input:checked { background-color: #005041; border-color: #005041; }

/* ── El nombre, con la tipografia del resort ──────────────────────────── */
.brand-name {
    font-family: var(--marca-tipo-titulo);
    letter-spacing: .01em;
}
/* En el menu plegado el nombre se oculta, asi que el icono carga con la marca. */
.brand-icon {
    background: linear-gradient(140deg, #008D7B 0%, #005041 100%);
    color: #fff;
}

/* ── Acceso ───────────────────────────────────────────────────────────── */
/* La pantalla de entrada es lo primero que ve el cliente cada dia. */
.login-card-brand { font-family: var(--marca-tipo-titulo); color: #004439; }
.login-fondo {
    background: linear-gradient(150deg, #00382F 0%, #005041 55%, #008D7B 100%);
}
