@charset "UTF-8";
/* ============================================================
   SICOST v0.6 — Sistema visual corporativo
   ACOSTA IPS · Acosta Consultores Médicos S.A.S.
   Fuente: Manual de Identidad Corporativa ACOSTA IPS & HaH
   ------------------------------------------------------------
   ARCHIVO DE TOKENS. No modifica ni reemplaza estilos actuales.
   Aún NO está enlazado desde index.html.
   ============================================================ */

:root {
  /* ---------- 1. COLORES PRIMARIOS (manual 5.1) ---------- */
  --azul-navy:            #0A1B3D;  /* Confianza, estabilidad. Titulares, fondos institucionales */
  --morado-institucional: #4B0082;  /* Compasión, calidad, innovación. Destacados, CTA, acentos */
  --dorado:               #D4AF37;  /* Excelencia, prestigio. Acentos premium, detalles de lujo */
  --blanco:               #FFFFFF;  /* Pureza, higiene, claridad */

  /* ---------- 2. COLORES SECUNDARIOS (manual 5.1) ---------- */
  --azul-grisaceo:        #64748B;  /* Fondos secundarios, gráficos, elementos de apoyo */
  --lila-suave:           #E6D6F7;  /* Humanización, áreas pediátricas, campañas especiales */
  --gris-claro:           #F2F4F7;  /* Fondos neutros, diagramación, áreas de lectura */
  --grafito:              #1F2937;  /* Texto principal, información importante */

  /* ---------- 3. COLORES COMPLEMENTARIOS (manual 5.1) ---------- */
  --turquesa-medico:      #00BFA6;  /* Frescura, salud, tecnología */
  --verde-salud:          #2E7032;  /* Bienestar, vida, crecimiento */
  --coral-suave:          #FF8A65;  /* Cercanía, calidez, energía */
  --azul-cielo:           #64B5F6;  /* Comunicación, claridad, confianza ligera */

  /* ---------- 4. ROLES SEMÁNTICOS DE INTERFAZ ---------- */
  --color-marca:            var(--morado-institucional);
  --color-ejecutivo:        var(--azul-navy);
  --color-premium:          var(--dorado);
  --fondo-app:              var(--gris-claro);
  --fondo-superficie:       var(--blanco);
  --fondo-sidebar:          var(--morado-institucional);
  --fondo-header:           var(--blanco);
  --borde-sutil:            #E4E7EC;
  --texto-principal:        var(--grafito);
  --texto-secundario:       var(--azul-grisaceo);
  --texto-sobre-oscuro:     var(--blanco);

  /* ---------- 5. ESTADOS FINANCIEROS (SICOST) ---------- */
  --estado-positivo:        var(--verde-salud);     /* rentabilidad, margen sano */
  --estado-informativo:     var(--azul-cielo);
  --estado-alerta:          var(--coral-suave);     /* margen bajo, atención */
  --estado-riesgo-critico:  #C62828;                /* Aprobado. No proviene del manual: el manual no define rojo */
  --estado-neutro:          var(--azul-grisaceo);

  /* Niveles de riesgo del portafolio */
  --riesgo-bajo:            var(--verde-salud);
  --riesgo-moderado:        var(--dorado);
  --riesgo-alto:            var(--coral-suave);
  --riesgo-critico:         var(--estado-riesgo-critico);

  /* ---------- 6. TIPOGRAFÍA (manual 4.1 – 4.7) ---------- */
  --fuente-marca:     'Montserrat', 'Segoe UI', system-ui, sans-serif;        /* ACOSTA IPS / SICOST */
  --fuente-titulo:    'Montserrat', 'Segoe UI', system-ui, sans-serif;        /* H2 SemiBold, H3 Medium */
  --fuente-premium:   'Cormorant Garamond', Georgia, 'Times New Roman', serif;/* H1 premium / marca HaH */
  --fuente-texto:     'Open Sans', 'Inter', system-ui, sans-serif;            /* cuerpo de texto */

  --peso-bold:      700;
  --peso-semibold:  600;
  --peso-medium:    500;
  --peso-regular:   400;

  --tamano-h1:      2.00rem;
  --tamano-h2:      1.50rem;
  --tamano-h3:      1.175rem;
  --tamano-base:    0.9375rem;
  --tamano-small:   0.8125rem;
  --tamano-micro:   0.6875rem;

  --alto-linea-titulo: 1.25;
  --alto-linea-texto:  1.55;
  --tracking-marca:    0.06em;

  /* ---------- 7. ESPACIADO, RADIOS Y SOMBRAS ---------- */
  --esp-1: 4px;  --esp-2: 8px;  --esp-3: 12px; --esp-4: 16px;
  --esp-5: 24px; --esp-6: 32px; --esp-7: 48px; --esp-8: 64px;

  --radio-sm:  6px;
  --radio-md:  10px;
  --radio-lg:  16px;
  --radio-full: 999px;

  --sombra-sm: 0 1px 2px rgba(10, 27, 61, 0.06);
  --sombra-md: 0 4px 12px rgba(10, 27, 61, 0.08);
  --sombra-lg: 0 12px 32px rgba(10, 27, 61, 0.12);

  /* ---------- 8. LAYOUT ---------- */
  --ancho-sidebar:          248px;
  --ancho-sidebar-min:      72px;
  --alto-header:            64px;
  --ancho-panel-acosti:     320px;
  --ancho-maximo-contenido: 1440px;

  /* ---------- 9. MARCA — rutas de activos ---------- */
  /* SICOST — usar SIEMPRE sobre fondo que contraste */
  --logo-sicost:          url('../assets/brand/sicost-logo-transparente.png'); /* trazo morado, para fondo claro */
  --logo-sicost-blanco:   url('../assets/brand/sicost-logo-blanco.png');       /* trazo blanco, para fondo oscuro */
  --logo-sicost-navy:     url('../assets/brand/sicost-logo-navy.png');         /* bloque listo sobre azul navy */
  --logo-sicost-morado:   url('../assets/brand/sicost-logo-morado.png');       /* bloque listo sobre morado */
  --isotipo-sicost:       url('../assets/brand/sicost-isotipo.png');
  --favicon-sicost:       url('../assets/brand/favicon.png');

  /* ACOSTA IPS y HaH */
  --logo-acosta:        url('../assets/brand/acosta-ips-logo-alpha.png');
  --logo-acosta-neg:    url('../assets/brand/acosta-ips-logo-negativo-alpha.png');
  --logo-hah:           url('../assets/brand/hah-logo-alpha.png');
  --logo-hah-neg:       url('../assets/brand/hah-logo-negativo-alpha.png');
  --sello-supersalud:   url('../assets/brand/vigilado-supersalud-alpha.png');

  /* ---------- 10. MASCOTA — PERCIVAL ---------- */
  /* Percival es la mascota de ACOSTA IPS y el copiloto visual de SICOST. */
  --percival:            url('../assets/mascot/percival.png');            /* medio cuerpo, pulgar arriba */
  --percival-senalando:  url('../assets/mascot/percival-senalando.png');  /* medio cuerpo, senalando */
  --percival-avatar:     url('../assets/mascot/percival-avatar.png');     /* busto 512x512, para el panel copiloto */
  --percival-avatar-tam: 56px;

  /* Tamaño mínimo de reproducción digital del logo (manual 1.3): 120 px */
  --logo-ancho-minimo:  120px;
}

/* ============================================================
   PROTECCIÓN DE MARCA (manual 1.3, 5.2)
   El logotipo no se deforma, recolorea, rota ni comprime.
   ============================================================ */
.marca-logo {
  display: inline-block;
  height: auto;
  min-width: var(--logo-ancho-minimo);
  object-fit: contain;      /* nunca 'fill': evita deformación */
  image-rendering: auto;
  filter: none;             /* prohibido recolorear o aplicar efectos */
  transform: none;          /* prohibido rotar o inclinar */
}

/* Área de protección mínima alrededor del logotipo */
.marca-logo--aislado { padding: var(--esp-3); }

/* El logo SICOST siempre debe apoyarse en un fondo que contraste.
   Sobre fondo claro: --logo-sicost. Sobre fondo oscuro: --logo-sicost-blanco. */
.marca-sicost--claro  { background-color: var(--fondo-superficie); }
.marca-sicost--oscuro { background-color: var(--azul-navy); }
.marca-sicost--marca  { background-color: var(--morado-institucional); }

/* Avatar del copiloto Percival */
.percival-avatar {
  width: var(--percival-avatar-tam);
  height: var(--percival-avatar-tam);
  border-radius: var(--radio-full);
  background: var(--lila-suave) var(--percival-avatar) center/cover no-repeat;
  flex: 0 0 auto;
}

/* ============================================================
   FIN DEL ARCHIVO — sin reglas de componentes todavía.
   Los componentes se definirán en "SICOST v0.6 - REDISEÑO VISUAL COMPLETO".
   ============================================================ */