/* ============================================================
   ORION — ETOAEOZ Design System (extraido de admin_login/index
   de ETOAEOZ, jul-2026). Este archivo se carga AL FINAL del
   <head> de cada template y re-vesta todo el producto.
   ============================================================ */
@import url('/static/fonts/fonts.css');   /* fonts are served by ORION itself (block 3E) */

:root{
  /* paleta ETOAEOZ oficial */
  --et-navy:#0F1B3D; --et-navy-deep:#0A1430;
  --et-amber:#EF9F27; --et-purple:#7B5FA8; --et-teal:#13C3B3;
  --et-bg:#F4F6FA; --et-bg-soft:#EDF1F7; --et-surface:#FFFFFF;
  --et-border:#E4E9F2; --et-border-soft:#EDF1F7;
  --et-text:#0F1B3D; --et-text-mute:#6B7691; --et-text-soft:#9DA6BC;
  --et-success:#10B981; --et-danger:#EF4444; --et-pink:#D4537E;
  --et-r-md:10px; --et-r-lg:14px;
  --et-shadow-md:0 4px 14px rgba(15,27,61,0.06);
  --et-ease:cubic-bezier(0.16,1,0.3,1);

  /* remapeo de las variables internas de ORION -> ETOAEOZ */
  --navy:var(--et-navy); --navy2:var(--et-navy-deep);
  --teal:var(--et-teal); --blue:var(--et-purple); --purple:var(--et-purple);
  --bg:var(--et-bg); --line:var(--et-border); --muted:var(--et-text-mute);
  --ink:var(--et-text); --ok:var(--et-success); --amber:#B45309;
}
body{font-family:'DM Sans',system-ui,sans-serif !important}

/* ---------- header estilo ETOAEOZ (claro, como el index) ---------- */
header{background:var(--et-surface) !important;color:var(--et-text) !important;
  border-bottom:1px solid var(--et-border-soft);box-shadow:var(--et-shadow-md)}
header a{color:var(--et-text-mute) !important}
header a:hover{color:var(--et-navy) !important}
.tabs a{color:var(--et-text-mute) !important}
.tabs a.on{background:var(--et-bg-soft) !important;color:var(--et-navy) !important}
.tabs a .n{background:var(--et-amber) !important;color:#fff}
.rolebadge{background:var(--et-bg-soft) !important;color:var(--et-text-mute) !important}
header .sp a{color:var(--et-purple) !important;font-weight:600}
.brand-name{color:var(--et-navy);font-weight:800;letter-spacing:-.3px;display:inline-flex;flex-direction:column;line-height:1.1}
.brand-row{display:flex;align-items:baseline;font-size:1rem}
.brand-name .accent{color:var(--et-amber)}
.brand-tag{color:var(--et-text-mute) !important;font-size:.55rem;letter-spacing:1.6px}
.et-logo{width:34px;height:15px;margin-right:10px;flex:none}
.brand-logo{height:26px;border-radius:5px;margin-right:8px}

/* ---------- acciones: primaria ambar, secundaria purpura ---------- */
.savebtn,.btn.case,.btn.primary,.btn-signin{
  background:linear-gradient(135deg,var(--et-amber) 0%,#E08F1F 100%) !important;
  color:#fff !important;box-shadow:0 4px 12px rgba(239,159,39,.25);
  transition:transform .15s,box-shadow .2s,filter .15s}
.savebtn:hover,.btn.case:hover,.btn.primary:hover{transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(239,159,39,.35);filter:brightness(1.05)}
.btn.sms{background:var(--et-purple) !important;color:#fff !important}
.btn.here{background:var(--et-teal) !important;color:#04332e !important}
.fubtn{background:var(--et-pink) !important;color:#fff !important}
.kstrip .hot b{color:var(--et-purple)} .kstrip .good b{color:var(--et-success)}
.tile:hover,.tile.on{border-color:var(--et-amber) !important}
.loccard .tot{color:var(--et-amber) !important}
input:focus,select:focus,textarea:focus{border-color:var(--et-purple) !important;
  box-shadow:0 0 0 3px rgba(123,95,168,.12) !important;outline:none}
.powered{font-size:.68rem;color:var(--et-text-soft);text-align:center;padding:18px 0 8px}
.powered b{color:var(--et-navy);letter-spacing:1px}

/* footer siempre anclado abajo */
body{display:flex;flex-direction:column;min-height:100vh}
body>header,.kstrip{flex:none}
.wrap{flex:1 0 auto}
.powered{margin-top:auto}

/* ===== ORION v20 — shell minimalista (sidebar + disciplina de color) ===== */
.app{display:flex;min-height:100vh;background:#F6F7FA}
.snav{width:214px;flex:none;background:#fff;border-right:1px solid #E7EAF2;display:flex;
  flex-direction:column;position:sticky;top:0;height:100vh}
.snav-brand{display:flex;align-items:center;gap:9px;padding:16px 14px 10px;border-bottom:1px solid #F0F2F7}
.snav-brand svg{width:38px;height:16px;flex:none}
.snav-brand .bn{font-weight:800;color:#0F1B3D;font-size:.95rem;letter-spacing:-.2px;line-height:1.15;display:flex;flex-direction:column}
.snav-brand .bn i{display:none}
.snav-brand .bn em{font-style:normal;font-weight:600;font-size:.56rem;color:#9AA3B8;letter-spacing:.2px}
.snav nav{padding:6px 10px;flex:1;overflow-y:auto}
.sg{font-size:.6rem;letter-spacing:1.4px;text-transform:uppercase;color:#A6AFC3;font-weight:800;margin:16px 10px 5px}
.snav nav a{display:flex;justify-content:space-between;align-items:center;padding:8px 11px;margin:1px 0;
  border-radius:9px;color:#3A4763;text-decoration:none;font-size:.845rem;font-weight:600;transition:background .12s}
.snav nav a:hover{background:#F2F5FA}
.snav nav a.on{background:#0F1B3D;color:#fff}
.snav .b{background:#EEF1F7;color:#3A4763;border-radius:99px;padding:1px 8px;font-size:.66rem;font-weight:800;font-variant-numeric:tabular-nums}
.snav nav a.on .b{background:rgba(255,255,255,.22);color:#fff}
.snav-user{border-top:1px solid #F0F2F7;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.snav-user .u{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.snav-user .u b{font-size:.78rem;color:#0F1B3D;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.snav-user .u span{font-size:.64rem;color:#9AA3B8}
.snav-user > a{font-size:.7rem;font-weight:700;color:#9AA3B8;text-decoration:none;flex:none}
.snav-user > a:hover{color:#D4537E}
/* Sign out is a form with a button (block 3B), styled to look like the link it replaced */
.snav-user > form{flex:none;margin:0}
.snav-user > form > button{background:none;border:0;padding:0;margin:0;font-family:inherit;font-size:.7rem;font-weight:700;color:#9AA3B8;cursor:pointer}
.snav-user > form > button:hover{color:#D4537E}
.mainc{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{background:#fff;border-bottom:1px solid #E7EAF2;padding:13px 24px;display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:30}
.topbar h1{font-size:1rem;font-weight:800;color:#0F1B3D;letter-spacing:-.2px}
.topbar .sub2{font-size:.74rem;color:#8B94AB;font-weight:600}
.mainc .wrap{max-width:1180px;width:100%;margin:0 auto;padding:20px 24px 60px}
/* Home mission control */
.hgreet{margin:2px 0 16px}
.hgreet h2{font-size:1.25rem;color:#0F1B3D;letter-spacing:-.3px}
.hgreet p{font-size:.8rem;color:#8B94AB;margin-top:3px}
.hgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px;margin-bottom:22px}
.hcard{background:#fff;border:1px solid #E7EAF2;border-radius:14px;padding:16px 16px 14px;
  text-decoration:none;color:inherit;display:block;transition:box-shadow .15s,transform .15s,border-color .15s}
.hcard:hover{box-shadow:0 8px 22px rgba(15,27,61,.08);transform:translateY(-1px);border-color:#D7DCE8}
.hcard b{display:block;font-size:2rem;font-weight:800;color:#0F1B3D;font-variant-numeric:tabular-nums;line-height:1.05}
.hcard span{display:block;font-size:.68rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#8B94AB;margin-top:5px}
.hcard.acc b{color:#E08F1F}
.hcard .dot{margin-right:6px}
/* semaforo: el UNICO color de estado */
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none;vertical-align:middle}
.dot.g{background:#18B7A5}.dot.y{background:#EF9F27}.dot.r{background:#D4537E}.dot.n{background:#C7CEDC}
/* chips neutrales */
.chip{display:inline-block;border-radius:99px;padding:2px 9px;font-size:.66rem;font-weight:800;
  letter-spacing:.3px;background:#EEF1F7;color:#3A4763;white-space:nowrap}
.chip.hot{background:#0F1B3D;color:#fff}
.hint{background:#fff;border:1px solid #E7EAF2;border-radius:12px;padding:10px 14px;
  font-size:.76rem;color:#8B94AB;margin-bottom:14px;line-height:1.6}
@media(max-width:880px){
  .app{flex-direction:column}
  .snav{width:100%;height:auto;position:static;flex-direction:column}
  .snav nav{display:flex;overflow-x:auto;padding:4px 8px}
  .snav nav .sg{display:none}
  .snav nav a{flex:none}
  .snav-user{display:none}
}

.snav .b.red{background:#D4537E;color:#fff}
.linkpanel{background:#F6F7FA;border:1px solid #E7EAF2;border-radius:12px;padding:12px 14px;margin:10px 0}
.linkpanel .steps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:9px}
.linkpanel .st{font-size:.62rem;font-weight:800;letter-spacing:.4px;padding:3px 10px;border-radius:99px;background:#fff;border:1px solid #E7EAF2;color:#B4BBCB}
.linkpanel .st.on{background:#0F1B3D;border-color:#0F1B3D;color:#fff}
.linkpanel .lrow{display:flex;gap:6px}
.linkpanel input{flex:1;padding:8px 10px;border:1px solid #E7EAF2;border-radius:8px;font-family:inherit;font-size:.74rem;background:#fff;color:#3A4763}

/* Home board */
.board{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-top:18px}
.bcol{background:#fff;border:1px solid #E7EAF2;border-radius:14px;padding:12px 12px 10px;display:flex;flex-direction:column;gap:6px}
.bhead{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 8px;border-bottom:1px solid #F0F2F7;margin-bottom:4px}
.bhead span:first-child{font-size:.72rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#3A4763}
.bn2{background:#EEF1F7;border-radius:99px;padding:1px 9px;font-size:.68rem;font-weight:800;color:#3A4763}
.bcard{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:9px;text-decoration:none;
  border:1px solid #F0F2F7;background:#FBFCFE;transition:border-color .12s, transform .12s}
.bcard:hover{border-color:#C9D2E3;transform:translateX(2px)}
.bnm{font-size:.8rem;font-weight:700;color:#0F1B3D;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bsub{font-size:.64rem;color:#9AA3B8;font-weight:600;white-space:nowrap}
.bempty{font-size:.7rem;color:#B4BBCB;padding:14px 8px;text-align:center}
.ball{margin-top:auto;padding:7px 4px 2px;font-size:.7rem;font-weight:800;color:#8B94AB;text-decoration:none;text-align:right}
.ball:hover{color:#0F1B3D}
.snav-brand:hover{background:#F8FAFD}

/* v24 — botones unificados */
.actrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0 10px}
.actrow .ecwbtn, .ecwbtn{padding:9px 14px !important;border:1px solid #DCE2EE !important;
  background:#fff !important;color:#0F1B3D !important;border-radius:9px !important;
  font-weight:700 !important;font-size:.76rem !important;line-height:1 !important;
  cursor:pointer;text-decoration:none !important;display:inline-flex;align-items:center;gap:6px;
  transition:border-color .12s, box-shadow .12s}
.ecwbtn:hover{border-color:#0F1B3D !important;box-shadow:0 2px 8px rgba(15,27,61,.08)}
.linkpanel .lrow input{min-width:220px}
/* v24 — Home hero + quick access */
.hero{margin:14px 0 20px}
.hero h2{font-size:1.7rem;font-weight:800;letter-spacing:-.6px;color:#0F1B3D}
.hero .hac{color:#EF9F27}
.hero p{font-size:.82rem;color:#8B94AB;margin-top:4px;font-weight:600}
.qgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.qt{position:relative;background:#fff;border:1px solid #E7EAF2;border-radius:16px;
  padding:18px 18px 16px;text-decoration:none;color:#0F1B3D;overflow:hidden;
  transition:transform .16s, box-shadow .16s, border-color .16s}
.qt::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,#EF9F27,transparent 70%);opacity:0;transition:opacity .16s}
.qt:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(15,27,61,.10);border-color:#D7DCE8}
.qt:hover::after{opacity:1}
.qk{display:block;font-size:.66rem;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#8B94AB}
.qt b{display:block;font-size:2.3rem;font-weight:800;font-variant-numeric:tabular-nums;
  letter-spacing:-1px;margin:8px 0 2px;line-height:1}
.qs{display:block;font-size:.7rem;color:#9AA3B8;font-weight:600}
.qa{position:absolute;right:16px;bottom:12px;font-size:1rem;color:#C7CEDC;transition:color .16s, transform .16s}
.qt:hover .qa{color:#EF9F27;transform:translateX(3px)}
.qt.dark{background:#0F1B3D;border-color:#0F1B3D;color:#fff}
.qt.dark .qk{color:#93A0C4}.qt.dark .qs{color:#7C89AF}.qt.dark b{color:#fff}
.qt.dark:hover .qa{color:#EF9F27}
.qt.line b{display:none}
.qt.line{display:flex;flex-direction:column;justify-content:center;min-height:86px}
/* v24 — calendario a pantalla completa */
.calwrap{height:calc(100vh - 176px);display:flex;flex-direction:column}
.calwrap table{height:100%}
.calwrap td, .calwrap th{border-color:#EFF2F8 !important}

.beta{display:inline-block;font-size:.52rem;font-weight:800;letter-spacing:1.5px;color:#7B5FA8;border:1px solid #D9CDEB;border-radius:99px;padding:1px 7px;vertical-align:middle;margin-left:2px}

.beta-top{position:absolute;right:22px;top:50%;transform:translateY(-50%)}