/* Diseño InsuBIO: azul #00568B, celeste #02AEF0, gris oscuro #494849, gris claro #F1F1F1. Chivo (texto) y Montserrat (títulos). */
@font-face{font-family:"Chivo";src:url(fonts/Chivo.woff) format("woff");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Montserrat";src:url(fonts/Montserrat.woff) format("woff");font-weight:100 900;font-style:normal;font-display:swap}
h1,h2,h3,h4,.sec,table.lista th,.btn,.tile b,.contadores b,.side .lb,.chat-cab b{font-family:"Montserrat","Chivo",system-ui,sans-serif}
h1{font-weight:700;letter-spacing:-.01em}
.btn.primary{background:var(--az);border-color:var(--az)}.btn.primary:hover{background:#00436d}
.btn:hover{background:var(--az2)}.btn.primary:hover{color:#fff}
.tile{border-left-color:var(--cel)}.sec{background:var(--az)}
a{color:var(--az)}
.tile{color:var(--txt)}

/* ---------- estructura general (la barra lateral aparece solo en la PC) ---------- */
.app{display:block}
.side,.topbar,.contadores,.chatdock{display:none}
header.top{display:none}
.content{min-width:0}
.cols{display:block}
.col-main{min-width:0}
.mas-chk{display:none}

/* ============ TÁCTIL: tablet y celular (botones grandes, sin menú lateral) ============ */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:var(--card);border-bottom:3px solid var(--az);position:sticky;top:0;z-index:30}
.topbar .brand img{height:40px;display:block}
.topbar .avatar{width:44px;height:44px;margin:0;font-size:16px}
.app .side{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--card);border-top:3px solid var(--az);flex-direction:row;padding:0;box-shadow:0 -4px 14px rgba(0,0,0,.12)}
.side .brand{display:none}
.side nav{display:flex;flex:1;gap:0;padding:0;flex-wrap:nowrap}
.side .it{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:64px;padding:6px 2px;color:var(--txt);text-decoration:none;font-size:12px;font-weight:600;border-radius:0;position:relative;cursor:pointer}
.side .it .ic{font-size:24px;line-height:1}
.side .it:active{background:var(--az2)}
.side .badge{position:absolute;top:4px;left:calc(50% + 8px);margin:0}
.mas-panel{display:none;position:fixed;left:8px;right:8px;bottom:76px;background:var(--card);border:1px solid var(--bd);border-radius:14px;padding:8px;box-shadow:0 8px 30px rgba(0,0,0,.25);grid-template-columns:repeat(3,1fr);gap:6px}
.mas-chk:checked ~ .mas-panel{display:grid}
.mas-panel .it{min-height:76px;background:var(--bg);border-radius:12px;flex:none}
.mas-panel .it.foot .lb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.mas-panel .avatar{width:36px;height:36px;margin:0}
main{padding:14px 14px 96px}
footer{padding-bottom:90px}
.app main{margin:0 auto}
/* controles grandes para el dedo */
.app .btn{min-height:48px;padding:11px 18px}
.app input,.app select,.app textarea{min-height:48px;font-size:16px}
.app input[type=checkbox],.app input[type=radio]{width:24px;height:24px;min-height:0}
.app label.chk,.app .opt{min-height:44px}
.app table.lista td,.app table.lista th{padding:12px 10px;font-size:15px}
.app .tile{padding:18px}.app .tile .ic{font-size:32px}
.app .sticky{bottom:70px}
.app .toast-chat{bottom:84px}
.app .chat-wrap{height:auto}

/* ============ PC: dos diseños a elección de cada usuario ============ */
@media (min-width:1025px) and (hover:hover) and (pointer:fine){
  .topbar{display:none}
  .app{display:grid;grid-template-columns:var(--sidew) 1fr;min-height:100vh}
  .app .side{position:sticky;top:0;height:100vh;bottom:auto;left:auto;right:auto;flex-direction:column;border-top:0;box-shadow:none;padding:14px 10px;background:var(--sidebg);overflow:auto;gap:4px;border-right:1px solid var(--bd)}
  .side .brand{display:block;margin:2px 4px 14px}.side .brand img{width:100%;max-width:190px;height:auto}
  .side nav{display:contents}
  .mas-panel{display:contents}
  .mas-btn{display:none!important}
  .mas-panel .it{background:none;min-height:0}
  .side .it{flex:none;flex-direction:row;justify-content:flex-start;gap:12px;min-height:0;padding:10px 12px;border-radius:8px;font-size:15px;font-weight:600;color:var(--sidetxt)}
  .side .it .ic{font-size:19px;width:26px;text-align:center}
  .side .it:hover{background:var(--az2)}
  .side .it.foot{margin-top:auto}
  .side .badge{position:static;margin-left:auto}
  .side .it[aria-current]{background:var(--az);color:#fff}
  main{padding:20px 24px;max-width:1180px}footer{padding-bottom:20px}
  .app .btn{min-height:0;padding:9px 16px}.app .btn.big{padding:12px 28px}
  .app input,.app select,.app textarea{min-height:0}
  .app input[type=checkbox],.app input[type=radio]{width:auto;height:auto}
  .app .sticky{bottom:0}.app .toast-chat{bottom:16px}
  .app .chat-wrap{height:calc(100vh - 230px)}
  .app .tile{padding:14px}.app .tile .ic{font-size:26px}
  .app table.lista td,.app table.lista th{padding:8px 10px;font-size:14px}

  /* ---- Clara: menú lateral con nombres ---- */
  .app.tema-clara{--sidew:240px}
  .tema-clara .side{--sidebg:#fff}

  /* ---- Oscura: menú angosto de íconos, contadores arriba y chat a la vista ---- */
  body.tema-oscura{--bg:#16191d;--card:#20252b;--txt:#e6e8ea;--gr:#a9b0b8;--bd:#333a42;--az2:#1c3a50;--bg2:#2a3037;--mio:#14405c;--inp:#171b20;--inpbd:#3d4650;--sidebg:#101317;--sidetxt:#dfe3e7;--ok:#6fd195;--er:#ff8a80;color-scheme:dark}
  body.tema-oscura a{color:var(--cel)}
  body.tema-oscura .btn{background:var(--card);color:var(--cel);border-color:var(--az)}
  body.tema-oscura .btn.primary{background:var(--az);color:#fff}
  body.tema-oscura h1{color:var(--cel)}
  body.tema-oscura .flash.ok{background:#17301f}body.tema-oscura .flash.error{background:#3b1c1a}
  body.tema-oscura .tag{background:#2f363d;color:#dfe3e7}body.tema-oscura .tag.pendiente{background:#4a3a10;color:#ffd98a}body.tema-oscura .tag.borrador{background:#4a3a10;color:#ffd98a}
  body.tema-oscura .tag.ok,body.tema-oscura .tag.aceptado{background:#17301f;color:#8ee0ae}body.tema-oscura .tag.edit{background:#14405c;color:#bfe6fa}
  body.tema-oscura .ley,body.tema-oscura .firma-actual{background:var(--bg2)}
  body.tema-oscura .burbuja small,body.tema-oscura .chat-lista .tx small{color:var(--gr)}
  body.tema-oscura .aviso,body.tema-oscura .edicion-aviso{background:#14405c;border-color:#1f6a96;color:#d4eefb}
  .app.tema-oscura{--sidew:78px}
  .tema-oscura .side{align-items:center;padding:12px 8px}
  .tema-oscura .side .brand{margin:2px 0 12px}.tema-oscura .side .brand img{content:url(/static/logo_icono.png);width:40px;height:auto;border-radius:8px;background:#fff;padding:5px}
  .tema-oscura .side .it{width:56px;height:52px;padding:0;justify-content:center;border-radius:12px;position:relative}
  .tema-oscura .side .it .lb{display:none}
  .tema-oscura .side .it .ic{font-size:22px;width:auto}
  .tema-oscura .side .it.foot .avatar{margin:0;width:38px;height:38px}
  .tema-oscura .side .badge{position:absolute;top:4px;right:2px;margin:0}
  .tema-oscura .contadores{display:flex;gap:14px;padding:16px 24px 0;flex-wrap:wrap}
  .contadores a{display:flex;flex-direction:column;gap:2px;min-width:190px;padding:12px 18px;border-radius:12px;background:var(--card);border:1px solid var(--bd);text-decoration:none;border-left:5px solid var(--cel)}
  .contadores b{font-size:30px;line-height:1;color:var(--cel)}.contadores span{color:var(--gr);font-size:13px}
  .tema-oscura .cols{display:grid;grid-template-columns:1fr 290px;gap:0;align-items:start}
  .tema-oscura .chatdock{display:block;margin:20px 20px 20px 0;padding:14px;background:var(--card);border:1px solid var(--bd);border-radius:12px;position:sticky;top:16px}
  .chatdock h3{margin:0 0 8px;color:var(--cel)}
  .chatdock .dk{display:flex;gap:10px;align-items:center;padding:8px;border-radius:8px;text-decoration:none;color:var(--txt)}.chatdock .dk:hover{background:var(--az2)}
  .chatdock .tx{flex:1;min-width:0;display:flex;flex-direction:column}.chatdock .tx small{color:var(--gr);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chatdock .btn{margin-top:8px}
}
/* celular */
@media (max-width:600px){
  h1{font-size:21px}
  .mas-panel{grid-template-columns:repeat(2,1fr)}
  .tiles{grid-template-columns:1fr 1fr}
}