/* ============================================================
   CARRASCO · Administración — tokens del sistema
   Fuente: Poppins (elegida por Gustavo 24/10/2026)
   Paleta: 8 tonos medidos del logo real.
   Regla: CERO elementos nativos. Nada que el navegador ponga.
   ============================================================ */

@font-face{font-family:"Poppins";src:url("fonts/Poppins-SemiBold.ttf") format("truetype");font-weight:600;font-display:block}
@font-face{font-family:"Poppins";src:url("fonts/Poppins-Bold.ttf") format("truetype");font-weight:700;font-display:block}

:root{
  /* marca */
  --navy:#2D3571; --navy-medio:#2D4477; --azul:#2A5780; --azul-tur:#25728E;
  --tur-osc:#1F6E7D; --tur-medio:#43A1A6; --tur:#4CC1AF; --tur-claro:#66C1B7;

  /* superficie y tinta */
  --fondo:#F4F6FA; --card:#FFFFFF; --linea:#E3E8F0;
  --tinta:#2D3571; --tinta2:#5C6784; --tinta3:#667086;

  /* semáforo (funcional, no es color de marca) */
  --rojo:#C0353F; --ambar:#9A6512; --verde:#157A3E;

  --r:18px; --r-sm:12px;
  --fuente:"Poppins",system-ui,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}

html,body{
  background:#E9EDF4; color:var(--tinta);
  font-family:var(--fuente); font-weight:500;
  -webkit-font-smoothing:antialiased;
}

/* ---- scrollbars: invisibles (criterio 24/10/2026) ---- */
*{scrollbar-width:none; -ms-overflow-style:none}
*::-webkit-scrollbar{width:0;height:0;display:none}

/* ---- controles: nada nativo ---- */
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;
  appearance:none;-webkit-appearance:none;border-radius:0;background:none;border:0;outline:none}
button{cursor:pointer}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}
input:-webkit-autofill,input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--tinta);
  -webkit-box-shadow:0 0 0 100px var(--card) inset;
  transition:background-color 9999s ease-out}

/* foco propio: se reemplaza, no se elimina */
:focus-visible{outline:2px solid var(--tur);outline-offset:2px;border-radius:6px}

/* ---- piezas base ---- */
.marco{width:100%;max-width:390px;min-height:100vh;background:var(--fondo);
  position:relative;padding:0 0 118px;margin:0 auto}

header{padding:16px 20px 6px;display:flex;align-items:center;gap:10px}
header img{height:46px;width:auto;display:block}
.yo{margin-left:auto;font-size:13px;color:var(--tinta2);background:var(--card);
  border:1px solid var(--linea);border-radius:999px;padding:6px 12px}

h1{font-size:28px;letter-spacing:-.02em;font-weight:700;padding:6px 20px 2px}
.fecha{font-size:14px;color:var(--tinta2);padding:0 20px 14px;font-weight:500}

h2{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tinta3);
  font-weight:600;padding:6px 22px 8px}

.lista{margin:0 16px 14px;background:var(--card);border-radius:var(--r);
  border:1px solid var(--linea);overflow:hidden}
.it{display:flex;align-items:center;gap:12px;padding:14px 16px;position:relative}
.it+.it{border-top:1px solid var(--linea)}
.barra{width:3px;height:34px;border-radius:2px;flex:none}
.b-hoy{background:var(--rojo)} .b-sem{background:var(--ambar)} .b-ok{background:var(--tur)}
.tx{min-width:0;flex:1}
.emp{font-size:15px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.ob{font-size:13px;color:var(--tinta2);margin-top:2px;font-weight:500}

.btn{flex:none;font-size:13px;font-weight:600;border-radius:999px;padding:9px 15px;
  border:1px solid var(--tur);background:var(--tur);color:#fff}
.btn:active{transform:scale(.97)}
.btn.hecho{background:var(--card);color:var(--tur-osc);border-color:#CBE6E1}

.pie{position:fixed;bottom:0;left:0;right:0;max-width:390px;margin:0 auto;
  background:rgba(255,255,255,.96);border-top:1px solid var(--linea);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  display:flex;align-items:center;gap:10px}
.pie b{font-size:14px;font-weight:600} .pie span{font-size:13px;color:#4C5876}
.pie a{margin-left:auto;font-size:13px;font-weight:600;color:var(--navy);text-decoration:none}

/* ---- sección definida (patrón aprobado 24/10/2026, variante A + cabecera de B) ---- */
.sec-card{margin:0 16px 14px;background:var(--card);border:1px solid var(--linea);
  border-radius:var(--r);overflow:hidden}
.sec-cab{display:flex;align-items:baseline;gap:10px;padding:14px 16px 10px;
  border-bottom:1px solid var(--linea)}
.sec-cab b{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--tinta)}
.sec-cab span{margin-left:auto;font-size:12px;font-weight:600;color:var(--tinta3)}
.sec-card .it{padding:12px 16px;min-height:52px}
.hair{height:1px;background:var(--linea);margin-left:16px}
.num{font-variant-numeric:tabular-nums}
.rojo{color:var(--rojo)}
.ok{color:var(--tur-osc)}