/* SANFEL plataforma — tokens del Manual de Estilo SANFEL */
:root{
  --turquesa:#25aa90;--turquesa-accion:#1a7a68;--turquesa-profundo:#1b5f5c;--turquesa-suave:#dcf3ec;--sobre-accion:#fff;
  --grafito:#33393d;--tinta:#22272a;--tinta-suave:#5d666b;
  --superficie:#fff;--superficie-tenue:#f2f6f5;--superficie-grafito:#2b3438;--linea:#e2e7e8;--linea-campo:#cfd7d8;
  --atencion:#94591a;--atencion-suave:#fbefdd;--informacion:#3a5a80;--informacion-suave:#e8eef6;--error:#b23b2c;--error-suave:#fdecea;
  --esp-1:4px;--esp-2:8px;--esp-3:12px;--esp-4:16px;--esp-6:24px;--esp-8:32px;--esp-12:48px;
  --radio-sm:8px;--radio-md:10px;--radio-lg:14px;--radio-xl:18px;--radio-pildora:999px;
  --sombra:0 18px 50px -24px rgba(27,57,60,.35);
  --font-display:"Outfit","Avenir Next",system-ui,sans-serif;--font-texto:"Source Sans 3","Segoe UI",system-ui,sans-serif;
  --lateral:248px;
}
*{box-sizing:border-box}
html{scroll-padding-top:80px}
body{margin:0;font-family:var(--font-texto);font-size:16px;line-height:1.5;color:var(--tinta);background:var(--superficie-tenue);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-display);color:var(--grafito);font-weight:600;line-height:1.2;margin:0 0 var(--esp-3);text-wrap:balance}
h1{font-size:1.75rem}h2{font-size:1.2rem}
p{margin:0 0 var(--esp-3)}
a{color:var(--turquesa-accion)}
a:hover{color:var(--turquesa-profundo)}
code{font-size:.85em;background:var(--superficie-tenue);padding:1px 5px;border-radius:4px}
small{display:block;font-size:.82rem;color:var(--tinta-suave)}
.nota{color:var(--tinta-suave);font-size:.9rem}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:-999px;top:8px;z-index:100;background:var(--grafito);color:#fff;padding:8px 14px;border-radius:8px}.saltar:focus{left:16px}
:focus-visible{outline:3px solid color-mix(in srgb,var(--turquesa) 55%,transparent);outline-offset:2px}
.antetitulo{font-family:var(--font-display);font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--turquesa-accion);margin-bottom:var(--esp-1)}
.nowrap{white-space:nowrap}.romper{overflow-wrap:anywhere}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--esp-2);font-family:var(--font-display);font-weight:600;font-size:.95rem;line-height:1.2;padding:11px 22px;border-radius:var(--radio-pildora);border:2px solid var(--turquesa-accion);background:var(--turquesa-accion);color:var(--sobre-accion);cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}
.btn:hover{background:var(--turquesa-profundo);border-color:var(--turquesa-profundo);color:#fff}
.btn--sec{background:var(--superficie);color:var(--grafito);border-color:var(--linea)}
.btn--sec:hover{background:var(--superficie-tenue);border-color:var(--turquesa);color:var(--grafito)}
.btn--peligro{background:var(--error);border-color:var(--error)}
.btn--peligro:hover{background:#8f2f23;border-color:#8f2f23}
.btn--chico{padding:7px 16px;font-size:.88rem}
.btn--bloque{width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.enlace{background:none;border:0;padding:0;font:inherit;color:var(--turquesa-accion);text-decoration:underline;cursor:pointer}

/* Etiquetas */
.tag{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;line-height:20px;font-weight:600;padding:0 10px;border-radius:var(--radio-pildora);white-space:nowrap;background:var(--informacion-suave);color:var(--informacion)}
.tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.tag--ok{background:var(--turquesa-suave);color:var(--turquesa-profundo)}
.tag--info{background:var(--informacion-suave);color:var(--informacion)}
.tag--atencion{background:var(--atencion-suave);color:var(--atencion)}
.tag--error{background:var(--error-suave);color:var(--error)}

/* Avisos */
.aviso{padding:var(--esp-3) var(--esp-4);border-radius:var(--radio-md);margin:0 0 var(--esp-4);background:var(--turquesa-suave);color:var(--turquesa-profundo);font-weight:600}
.aviso--error{background:var(--error-suave);color:var(--error)}
.aviso--info{background:var(--informacion-suave);color:var(--informacion);font-weight:400}

/* Estructura */
.lateral{position:fixed;inset:0 auto 0 0;width:var(--lateral);background:var(--superficie-grafito);color:#dfe7e6;display:flex;flex-direction:column;padding:var(--esp-6) var(--esp-4);z-index:40;overflow-y:auto}
.lateral__marca{display:block;padding:0 var(--esp-2) var(--esp-6)}
.lateral__marca img{width:150px;height:auto}
.lateral nav{display:flex;flex-direction:column;gap:2px;flex:1}
.lateral nav a{display:flex;align-items:center;gap:var(--esp-3);padding:10px var(--esp-3);border-radius:var(--radio-sm);color:#c9d4d3;text-decoration:none;font-family:var(--font-display);font-weight:500}
.lateral nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.lateral nav a[aria-current]{background:var(--turquesa-accion);color:#fff}
.lateral nav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lateral__grupo{margin:var(--esp-6) var(--esp-3) var(--esp-2);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#8fa19f;font-family:var(--font-display);font-weight:600}
.lateral__pie{border-top:1px solid rgba(255,255,255,.1);padding-top:var(--esp-4);font-size:.9rem}
.lateral__pie p{margin-bottom:var(--esp-2);color:#fff}.lateral__pie small{color:#9fb0ae}
.lateral__pie a,.lateral__pie .enlace{color:#9fe0cf;font-size:.88rem;display:block;margin-top:4px}
.contenedor{margin-left:var(--lateral);min-height:100vh}
.barra{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:var(--esp-4);padding:var(--esp-3) var(--esp-8);background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--linea)}
.barra__colegio{display:flex;align-items:baseline;gap:var(--esp-3);flex:1;min-width:0}
.barra__colegio .nota{white-space:nowrap}
.barra__colegio strong{font-family:var(--font-display);font-weight:600;color:var(--grafito);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.selector-est select{font:inherit;font-family:var(--font-display);font-weight:600;border:1px solid var(--linea);border-radius:var(--radio-md);padding:6px 10px;background:var(--superficie)}
.buscador input{width:280px;max-width:40vw;font:inherit;padding:9px 14px;border:1px solid var(--linea-campo);border-radius:var(--radio-pildora);background:var(--superficie-tenue)}
.menu-btn{display:none;background:none;border:0;width:40px;height:40px;padding:8px;cursor:pointer}
.menu-btn span{display:block;height:2px;background:var(--grafito);margin:5px 0;border-radius:2px}
.principal{padding:var(--esp-8);max-width:1240px}
.cabecera{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--esp-4);flex-wrap:wrap;margin-bottom:var(--esp-6)}
.cabecera h1{margin:0}
.cabecera__acciones{display:flex;gap:var(--esp-3);flex-wrap:wrap}

/* Tarjetas y paneles */
.tarjeta{background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio-lg);padding:var(--esp-6);margin-bottom:var(--esp-6)}
.tarjeta__cab{display:flex;justify-content:space-between;align-items:baseline;gap:var(--esp-4);flex-wrap:wrap}
.columnas{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--esp-6);align-items:start}
.columnas>.tarjeta{margin:0}
.vacio{text-align:center;padding:var(--esp-12) var(--esp-6)}

/* Indicadores */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--esp-3);margin-bottom:var(--esp-6)}
.kpis--3{grid-template-columns:repeat(3,1fr)}
.kpi{display:block;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio-lg);padding:var(--esp-4);text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s}
a.kpi:hover{border-color:var(--turquesa);box-shadow:var(--sombra);color:inherit}
.kpi b{display:block;font-family:var(--font-display);font-weight:600;font-size:2rem;line-height:1.1;color:var(--turquesa-profundo);font-variant-numeric:tabular-nums}
.kpi span{font-size:.85rem;color:var(--tinta-suave)}
.kpi--atencion b{color:var(--atencion)}

/* Listas de alertas y actividad */
.alertas,.actividad{list-style:none;margin:0;padding:0}
.alerta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-2);padding:var(--esp-3) 0;border-top:1px solid var(--linea)}
.alerta:first-child{border-top:0}
.actividad li{padding:var(--esp-2) 0;border-top:1px solid var(--linea)}
.actividad li:first-child{border-top:0}
.cambios{margin-top:4px;padding:6px 10px;background:var(--superficie-tenue);border-radius:var(--radio-sm)}

/* Tablas */
.tabla-env{position:relative;overflow-x:auto;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio-lg);margin-bottom:var(--esp-6)}
.tarjeta .tabla-env{border:0;margin:0 calc(-1 * var(--esp-6)) var(--esp-4);border-radius:0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.tabla{width:100%;border-collapse:collapse;font-size:.94rem}
.tabla th{text-align:left;font-size:.78rem;font-weight:600;color:var(--tinta-suave);text-transform:uppercase;letter-spacing:.06em;padding:10px var(--esp-4);border-bottom:1px solid var(--linea);background:var(--superficie-tenue);white-space:nowrap}
.tabla td{padding:12px var(--esp-4);border-bottom:1px solid var(--linea);vertical-align:top}
.tabla tr:last-child td{border-bottom:0}
.tabla tbody tr:hover{background:#fafcfc}
.tabla .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tabla__principal{font-weight:600;color:var(--grafito);text-decoration:none}
.tabla__principal:hover{color:var(--turquesa-accion);text-decoration:underline}
.tabla--form td{vertical-align:middle}
.tabla--form select,.tabla--form input:not([type=checkbox]){font:inherit;font-size:.9rem;padding:6px 8px;border:1px solid var(--linea-campo);border-radius:var(--radio-sm);background:var(--superficie);max-width:260px}
.fila-error{background:var(--error-suave)}.fila-atencion{background:#fffaf2}.fila-apagada{opacity:.6}
.obs-chica{color:var(--atencion)}

/* Formularios */
.form fieldset{border:0;padding:0;margin:0 0 var(--esp-6)}
.form legend{font-family:var(--font-display);font-weight:600;font-size:1.1rem;color:var(--grafito);margin-bottom:var(--esp-2)}
.campo{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--esp-4);min-width:0}
.campo label,.campo>legend{font-size:.88rem;font-weight:600;color:var(--grafito)}
.campo input,.campo select,.campo textarea{font:inherit;font-size:1rem;padding:10px 12px;border:1px solid var(--linea-campo);border-radius:var(--radio-md);background:var(--superficie);color:var(--tinta);width:100%}
.campo input[type=file]{padding:8px;background:var(--superficie-tenue)}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--turquesa-accion);box-shadow:0 0 0 3px color-mix(in srgb,var(--turquesa) 30%,transparent)}
.campo .error-rut{color:var(--error)}
.campo--crece{flex:1}
.fila2,.fila3,.fila4{display:grid;gap:0 var(--esp-4)}
.fila2{grid-template-columns:repeat(2,1fr)}.fila3{grid-template-columns:repeat(3,1fr)}.fila4{grid-template-columns:repeat(4,1fr)}
.form--angosto{max-width:460px}
.form--compacto .campo{margin-bottom:var(--esp-3)}
.form--compacto .campo input,.form--compacto .campo select{padding:8px 10px;font-size:.95rem}
.botonera{display:flex;gap:var(--esp-3);flex-wrap:wrap;align-items:center}
.check{display:flex;gap:var(--esp-2);align-items:flex-start;margin-bottom:var(--esp-4);font-weight:400}
.filtros{display:flex;gap:var(--esp-3);align-items:flex-end;flex-wrap:wrap;margin-bottom:var(--esp-4)}
.filtros .campo{margin:0}.filtros .campo input,.filtros .campo select{padding:9px 12px}

/* Desplegables */
.desplegable summary{cursor:pointer;color:var(--turquesa-accion);font-weight:600;font-size:.9rem;list-style:none;white-space:nowrap}
.desplegable summary::-webkit-details-marker{display:none}
.desplegable[open] summary{margin-bottom:var(--esp-2)}
.desplegable__panel{min-width:min(560px,80vw);padding:var(--esp-4);background:var(--superficie-tenue);border-radius:var(--radio-md);display:grid;gap:var(--esp-4)}
.agregar summary{list-style:none;display:inline-flex}
.agregar summary::-webkit-details-marker{display:none}
.agregar__panel{margin-top:var(--esp-4);padding:var(--esp-4);background:var(--superficie-tenue);border-radius:var(--radio-md)}
.roles-ayuda{margin-top:var(--esp-4)}.roles-ayuda summary{cursor:pointer;color:var(--turquesa-accion);font-weight:600}

/* Ficha */
.ficha-cab{display:flex;gap:var(--esp-4);align-items:center;flex-wrap:wrap;margin-bottom:var(--esp-4)}
.ficha-cab__txt{flex:1;min-width:240px}.ficha-cab h1{margin:0 0 var(--esp-2)}
.ficha-cab__meta{display:flex;flex-wrap:wrap;gap:var(--esp-2) var(--esp-4);align-items:center;color:var(--tinta-suave);margin:0}
.avatar{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--turquesa),var(--turquesa-profundo));color:#fff;font-family:var(--font-display);font-weight:600;font-size:1.3rem;flex:none}
.pestanas{display:flex;gap:var(--esp-2);flex-wrap:wrap;margin-bottom:var(--esp-4);position:sticky;top:62px;z-index:20;background:var(--superficie-tenue);padding:var(--esp-2) 0}
.pestanas a{padding:8px 16px;border-radius:var(--radio-pildora);background:var(--superficie);border:1px solid var(--linea);color:var(--grafito);text-decoration:none;font-family:var(--font-display);font-weight:500;font-size:.92rem}
.pestanas a:hover{border-color:var(--turquesa)}
.cuenta{display:inline-block;min-width:20px;padding:0 6px;margin-left:4px;border-radius:var(--radio-pildora);background:var(--superficie-tenue);font-size:.78rem;text-align:center}
.datos-col{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--esp-8)}
.datos{margin:0}
.dato{display:grid;grid-template-columns:180px 1fr;gap:var(--esp-3);padding:9px 0;border-bottom:1px dashed var(--linea)}
.dato dt{color:var(--tinta-suave);font-size:.9rem}.dato dd{margin:0;overflow-wrap:anywhere}
.obs{margin-top:var(--esp-4);padding:var(--esp-3) var(--esp-4);background:var(--superficie-tenue);border-radius:var(--radio-md)}

/* Pantallas simples (ingreso, instalación) */
body.simple{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--esp-6) var(--esp-4);background:linear-gradient(160deg,var(--superficie-tenue),#e3f1ed)}
.simple__caja{width:100%;max-width:420px;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio-xl);box-shadow:var(--sombra);padding:var(--esp-8)}
.simple__caja--ancha{max-width:760px}
.simple__logo{display:block;width:180px;height:auto;margin:0 auto var(--esp-6)}
.simple__titulo{font-size:1.35rem;text-align:center}
.simple__pie{margin-top:var(--esp-6);color:var(--tinta-suave);font-size:.85rem}

@media (max-width:1100px){.kpis{grid-template-columns:repeat(2,1fr)}.fila4{grid-template-columns:repeat(2,1fr)}.datos-col{grid-template-columns:1fr}}
@media (max-width:860px){
  .lateral{transform:translateX(-100%);transition:transform .2s;visibility:hidden}
  .lateral.abierto{transform:none;visibility:visible;box-shadow:0 0 40px rgba(0,0,0,.3)}
  .contenedor{margin-left:0}
  .menu-btn{display:block}
  .barra{padding:var(--esp-2) var(--esp-4)}
  .buscador{display:none}
  .principal{padding:var(--esp-6) var(--esp-4)}
  .pestanas{top:56px}
}
@media (max-width:640px){
  .fila2,.fila3,.fila4,.kpis--3{grid-template-columns:1fr}
  .dato{grid-template-columns:1fr;gap:2px}
  .simple__caja{padding:var(--esp-6)}
  h1{font-size:1.45rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.numero-cuenta{font-variant-numeric:tabular-nums;letter-spacing:.04em}
.en-linea{display:inline;margin-left:var(--esp-2)}
