/* ═══════════════════════════════════════════════════════════════════════════
   IMAGEN CORPORATIVA SGS — capa común de TODAS las pantallas de la app (2-oct-2026).
   La misma de la propuesta comercial y del Informe de gestión en PDF:
   petróleo #22414a · verde #3fa981 · menta #8fc4b1 · crema #f5f2ea;
   texto en Libre Franklin y títulos en Source Serif 4 (servidas desde /marca/fuentes,
   la CSP solo permite fuentes de 'self'). Nada de Artium ni Mesa de Soporte.
   Se carga de ÚLTIMA en cada página: solo cambia tokens, tipografía y la marca
   (ingreso, barra superior); no cambia el funcionamiento de ningún módulo.
   Para cambiar el look: editar este archivo y subir el ?v= donde se enlaza.
   ═══════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:'SGS Franklin';src:url(/marca/fuentes/franklin-400.ttf) format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'SGS Franklin';src:url(/marca/fuentes/franklin-500.ttf) format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'SGS Franklin';src:url(/marca/fuentes/franklin-600.ttf) format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'SGS Franklin';src:url(/marca/fuentes/franklin-700.ttf) format('truetype');font-weight:700 900;font-display:swap}
@font-face{font-family:'SGS Serif';src:url(/marca/fuentes/serif-600.ttf) format('truetype');font-weight:400 600;font-display:swap}
@font-face{font-family:'SGS Serif';src:url(/marca/fuentes/serif-700.ttf) format('truetype');font-weight:700 900;font-display:swap}

:root{
  /* Marca */
  --sgs-petroleo:#22414a;--sgs-petroleo-osc:#173036;--sgs-petroleo-2:#365a63;
  --sgs-verde:#3fa981;--sgs-verde-osc:#2e8b69;--sgs-menta:#8fc4b1;--sgs-menta-cl:#e7f2ec;
  --sgs-crema:#f5f2ea;--sgs-linea:#e4dfd3;
  --sgs-sans:'SGS Franklin','Libre Franklin','Segoe UI',system-ui,-apple-system,Roboto,Arial,sans-serif;
  --sgs-serif:'SGS Serif','Source Serif 4',Georgia,'Times New Roman',serif;
  /* Tokens del panel y de las páginas públicas, re-apuntados a la marca */
  --azul:#22414a;--azul-osc:#173036;--azul-cl:#e7f2ec;--azul-sutil:#e7f2ec;--azul-borde:#c4dccf;
  --gris:#5f6e70;--gris-cl:#f0eee7;--borde:#dcd8cc;--texto:#26332f;--fondo:#f7f5ef;
  --ok:#2e8b69;--ok-cl:#e7f4ee;
  --foco:0 0 0 3px rgba(63,169,129,.28);
}
body{font-family:var(--sgs-sans);color:var(--texto);background-color:var(--fondo)}
:is(input,select,textarea,button){font-family:inherit}
::selection{background:#cfe7db}
h1,h2,h3,.seccion-titulo h2,.py-head h2,.home-wrap>h2,#homeSaludo{font-family:var(--sgs-serif);font-weight:600;color:var(--sgs-petroleo);letter-spacing:-.005em}
h4{color:var(--sgs-petroleo)}
a{color:var(--sgs-verde-osc)}

/* Botón principal petróleo; foco y casillas en verde de marca */
.btn-primary{background:var(--sgs-petroleo);color:#fff}
.btn-primary:hover:not(:disabled){background:var(--sgs-petroleo-osc)}
.btn-secundario:hover:not(:disabled){background:var(--sgs-menta-cl)}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--sgs-verde-osc)}
:is(input,select,textarea):focus{border-color:var(--sgs-verde)!important}

/* ── Ingreso (panel) ── */
.login-wrap{background:
  radial-gradient(1200px 600px at 85% 110%,rgba(63,169,129,.35),transparent 60%),
  linear-gradient(135deg,#173036 0%,#22414a 55%,#2f5a5f 100%)}
.login-card{border-radius:18px;box-shadow:0 18px 50px rgba(10,25,28,.35);padding:34px 30px 28px;border-top:4px solid var(--sgs-verde)}
.login-logo{width:auto;height:auto;background:none;border-radius:0;margin:0 auto 16px;display:block}
.login-logo img{display:block;width:170px;height:auto;margin:0 auto}
.login-card h1{font-family:var(--sgs-serif);font-size:22px;color:var(--sgs-petroleo)}
.login-card p{color:var(--gris)}

/* ── Barra superior y menú lateral ── */
.topbar{border-bottom:1px solid var(--sgs-linea);box-shadow:inset 0 -3px 0 var(--sgs-verde)}
.brand{font-family:var(--sgs-serif);font-weight:600;color:var(--sgs-petroleo);letter-spacing:-.005em}
.brand-logo{background:var(--sgs-petroleo);border-radius:10px;padding:0 5px}
.brand-logo img{display:block;width:100%;height:auto}
.sidebar{border-right-color:var(--sgs-linea)}
.sidebar .modulo.activo{background:var(--sgs-menta-cl);color:var(--sgs-petroleo);box-shadow:inset 3px 0 0 var(--sgs-verde)}
.sidebar .modulo:hover{background:#f1efe7}
.tab.activo,.subtabs .tab.activo{background:var(--sgs-menta-cl);color:var(--sgs-petroleo)}
@media(max-width:900px){
  #sidebar #subnav .modulo{background:#efece3}
  #sidebar #subnav .modulo.activo{background:var(--sgs-petroleo);color:#fff}
}

/* ── Tarjetas y tablas: bordes cálidos, encabezados en crema ── */
.home-card{border-color:var(--sgs-linea)}
.home-card:hover{border-color:var(--sgs-menta)}
.home-card .hc-ico{background:var(--sgs-menta-cl)}
.home-card.admin{background:linear-gradient(180deg,#fff,var(--sgs-crema));border-color:var(--sgs-linea)}
.card,.tabla-wrap{border-color:var(--sgs-linea)}
.tabla th,table.tabla thead th{background:var(--sgs-crema);color:var(--sgs-petroleo)}

/* ── Páginas públicas (formulario, firma, verificación): cabecera con la marca ── */
.sgs-cabecera-pub{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 16px;background:var(--sgs-petroleo);border-bottom:3px solid var(--sgs-verde)}
.sgs-cabecera-pub img{height:34px;width:auto;display:block}
.sgs-pie-pub{text-align:center;font-size:12px;color:var(--gris);padding:18px 16px 26px}