/* ====== base.css — Sistema de diseño Chihuahua Te Amo (Brandbook 2023) ====== */
/* Paleta de marca: Negro #101820 (Pantone Black 6 C) · Rojo #ea0029 (Pantone 185 C) · Gris #e5e1e6 (Pantone 663 C)
   Tipografía: Bebas Neue (títulos) · Montserrat (texto) · Impact/Anton (logotipo)
   Regla: rojo = acción principal y énfasis · negro = estructura y selección · gris = bordes y fondos */
:root{
  --negro:#101820;--rojo:#ea0029;--rojo-h:#c9001f;--gris:#e5e1e6;
  --bg:#F6F5F7;--sf:#FFFFFF;--bd:#e5e1e6;--bd2:#cfc9d3;
  --tx:#101820;--t1:#101820;--t2:#4B5563;--t3:#8B8F98;
  --pr:#ea0029;--prh:#c9001f;--prs:rgba(234,0,41,.07);--prg:rgba(234,0,41,.18);
  --ac:#ea0029;--acs:rgba(234,0,41,.07);--acb:rgba(234,0,41,.16);
  --c1:#FFFFFF;--c2:#F6F5F7;
  --sbg:#101820;--sh:rgba(255,255,255,.07);--sa:#ea0029;--sw:256px;--hh:60px;
  --sg:#16A34A;--sgb:#DCFCE7;--sb:#2563EB;--sbb:#DBEAFE;--so:#D97706;--sob:#FEF3C7;--soe:#EA580C;--soeb:#FFF7ED;--sr:#DC2626;--srb:#FEE2E2;--sgy:#6B7280;--sgyb:#F3F4F6;
  --rd:10px;--rl:16px;--rp:999px;--tr:all .18s ease;
  --sh-sm:0 1px 2px rgba(16,24,32,.05);--sh-md:0 8px 24px rgba(16,24,32,.07);
  --ff:'Montserrat',-apple-system,'Segoe UI',sans-serif;
  --fd:'Bebas Neue','Montserrat',sans-serif;
  --fl:'Impact','Anton','Montserrat',sans-serif;
  --heart:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M24 40.5l-2.3-2.1C13.5 31 8 26 8 19.9 8 15 11.9 11 16.8 11c2.8 0 5.5 1.3 7.2 3.4 1.7-2.1 4.4-3.4 7.2-3.4 4.9 0 8.8 4 8.8 8.9 0 6.1-5.5 11.1-13.7 18.5L24 40.5z' fill='none' stroke='%23fff' stroke-width='1.2'/%3E%3C/svg%3E");
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--ff);background:var(--bg);color:var(--tx);line-height:1.55;font-size:13.5px;-webkit-font-smoothing:antialiased;overflow:hidden;height:100vh;height:100dvh}
h1,h2,h3,h4{font-family:var(--fd);font-weight:400;letter-spacing:.03em;text-transform:uppercase;line-height:1}
::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bd2);border-radius:3px}
input,select,textarea{font-family:inherit;font-size:.85rem}
button{font-family:inherit}

/* LOGOTIPO (texto en Impact/Anton + corazón SVG; escalable y recolorable, sin distorsión) */
.logo-w{font-family:var(--fl);font-weight:400;letter-spacing:0;line-height:.9;text-transform:uppercase;white-space:nowrap}
.logo-heart{display:inline-block;height:.92em;width:auto;fill:var(--rojo);vertical-align:-.1em;flex-shrink:0}
.logo-row{display:inline-flex;align-items:center;gap:.22em}
.logo-stack{display:inline-flex;flex-direction:column;align-items:center;gap:.06em}
.logo-stack .logo-te{font-size:1.32em;display:inline-flex;align-items:center;gap:.18em}

/* LOGIN */
.ls{position:fixed;inset:0;z-index:9999;display:flex;background:var(--negro)}.ls.h{display:none}
.ll{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;position:relative}
.ld{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.ld::after{content:'';position:absolute;inset:0;background-image:var(--heart);background-size:52px 52px;opacity:.045;-webkit-mask-image:radial-gradient(ellipse at center,transparent 28%,#000 75%);mask-image:radial-gradient(ellipse at center,transparent 28%,#000 75%)}
.ld::before{content:'';position:absolute;top:-30%;right:-15%;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(234,0,41,.55),transparent 68%)}
.lc{position:relative;z-index:2;width:100%;max-width:380px;text-align:center}
.li-logo{margin:0 auto 1rem;display:flex;justify-content:center}.li-logo img{height:150px;width:auto;max-width:80%;object-fit:contain}
.lbr{display:none}.lsub{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.45);margin:.2rem 0 2.2rem}
.lf{display:flex;flex-direction:column;gap:.85rem}.lig{text-align:left}.lig label{display:block;font-size:.66rem;font-weight:700;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.35rem}
.lin{width:100%;padding:.8rem 1.1rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--rd);color:#fff;font-size:.9rem;transition:var(--tr)}.lin:focus{outline:none;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.09)}.lin::placeholder{color:rgba(255,255,255,.3)}
.lbtn{padding:.85rem;background:var(--rojo);border:none;border-radius:var(--rp);color:#fff;font-size:.9rem;font-weight:700;letter-spacing:.02em;cursor:pointer;transition:var(--tr);box-shadow:0 8px 24px rgba(234,0,41,.28)}.lbtn:hover{background:var(--rojo-h);transform:translateY(-1px)}.lbtn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.ldiv{display:flex;align-items:center;gap:1rem;color:rgba(255,255,255,.35);font-size:.72rem}.ldiv::before,.ldiv::after{content:'';flex:1;height:1px;background:rgba(255,255,255,.1)}
.lgo{display:flex;align-items:center;justify-content:center;gap:.6rem;width:100%;padding:.8rem;background:transparent;border:1px solid rgba(255,255,255,.18);border-radius:var(--rp);color:#fff;font-size:.88rem;font-weight:600;cursor:pointer;transition:var(--tr)}.lgo:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.35)}.lgo svg{width:18px;height:18px}
.le{display:none;padding:.6rem 1rem;background:rgba(234,0,41,.14);border:1px solid rgba(234,0,41,.35);border-radius:var(--rd);color:#FFB3BE;font-size:.8rem}.le.show{display:block}

/* APP SHELL */
.app{display:none;height:100vh;height:100dvh}.app.on{display:flex}
.sb{width:var(--sw);background:var(--sbg);display:flex;flex-direction:column;flex-shrink:0;z-index:500;transition:transform .3s ease;position:relative}
.sb::after{content:'';position:absolute;left:0;right:0;bottom:0;height:180px;background-image:var(--heart);background-size:44px 44px;opacity:.035;pointer-events:none;-webkit-mask-image:linear-gradient(to top,#000,transparent);mask-image:linear-gradient(to top,#000,transparent)}
.sbh{padding:1.15rem 1.15rem .9rem;border-bottom:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;align-items:center;text-align:center;gap:.35rem}
.sbl{display:flex;align-items:center;justify-content:center}.sbl img{height:64px;width:auto;max-width:100%;object-fit:contain}
.sbb{color:rgba(255,255,255,.4);font-size:.58rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}.sbb small{display:none}
.sn{flex:1;padding:.7rem .6rem;overflow-y:auto;display:flex;flex-direction:column;gap:2px;position:relative;z-index:1}
.nl{font-family:var(--fd);font-size:.74rem;letter-spacing:.16em;color:rgba(255,255,255,.32);text-transform:uppercase;padding:.95rem .8rem .35rem}
.ni{display:flex;align-items:center;gap:.6rem;padding:.55rem .85rem;border-radius:var(--rp);color:rgba(255,255,255,.7);font-size:.8rem;font-weight:500;cursor:pointer;transition:var(--tr);border:none;background:none;width:100%;text-align:left}.ni:hover{background:var(--sh);color:#fff}.ni.on{background:var(--rojo);color:#fff;font-weight:600}
.nic{font-size:.95rem;width:20px;text-align:center}.nib{margin-left:auto;background:rgba(255,255,255,.14);color:#fff;font-size:.58rem;font-weight:700;padding:.1rem .4rem;border-radius:var(--rp);min-width:18px;text-align:center}.ni.on .nib{background:rgba(255,255,255,.25)}.nib-g{background:#16A34A}.nib-o{background:#D97706}.nib-r{background:var(--rojo)}.ni.on .nib-r{background:rgba(255,255,255,.25)}
.sf{padding:.6rem;border-top:1px solid rgba(255,255,255,.07);position:relative;z-index:1}.su{display:flex;align-items:center;gap:.55rem;padding:.5rem .55rem;border-radius:var(--rd);cursor:pointer;transition:var(--tr)}.su:hover{background:var(--sh)}
.ua{width:32px;height:32px;border-radius:var(--rp);background:var(--rojo);display:flex;align-items:center;justify-content:center;font-size:.78rem;color:#fff;font-weight:800;flex-shrink:0}.un{color:#fff;font-size:.78rem;font-weight:600;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.mw{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.tb{height:var(--hh);background:var(--sf);border-bottom:1px solid var(--bd);display:flex;align-items:center;padding:0 1.25rem;gap:.6rem;flex-shrink:0}
.tm{display:none;width:34px;height:34px;border-radius:var(--rp);border:1px solid var(--bd);background:var(--sf);cursor:pointer;font-size:1.1rem;align-items:center;justify-content:center;color:var(--t2)}
.ttt{font-family:var(--fd);font-size:1.55rem;letter-spacing:.03em;text-transform:uppercase;line-height:1;padding-top:.1rem;display:flex;align-items:baseline;gap:.5rem}.ttt small{font-family:var(--ff);font-weight:500;color:var(--t3);font-size:.7rem;text-transform:none;letter-spacing:0}
.ts{flex:1;max-width:340px;margin-left:auto;position:relative}.ts input{width:100%;padding:.5rem .9rem .5rem 2.1rem;background:var(--bg);border:1px solid var(--bd);border-radius:var(--rp);font-size:.78rem;color:var(--tx);transition:var(--tr)}.ts input:focus{outline:none;border-color:var(--negro);background:var(--sf)}.ts input::placeholder{color:var(--t3)}.tsi{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);color:var(--t3);font-size:.75rem}
.tbtn{width:34px;height:34px;border-radius:var(--rp);border:1px solid var(--bd);background:var(--sf);color:var(--t2);cursor:pointer;font-size:.95rem;display:flex;align-items:center;justify-content:center;transition:var(--tr);position:relative}.tbtn:hover{color:var(--negro);border-color:var(--negro)}
.notif-dd{position:absolute;top:44px;right:0;width:340px;max-height:380px;overflow-y:auto;background:var(--sf);border:1px solid var(--bd);border-radius:var(--rl);box-shadow:var(--sh-md);z-index:1001;display:none;padding:.5rem 0}
.notif-dd.on{display:block}
.notif-item{padding:.5rem .8rem;border-bottom:1px solid var(--bg);font-size:.72rem;cursor:pointer;transition:background .15s}
.notif-item:hover{background:var(--bg)}
.notif-item:last-child{border:none}
.notif-item .ni-time{font-size:.6rem;color:var(--t3)}
.notif-item .ni-msg{margin-top:.1rem;color:var(--t1)}
.notif-item.unread{background:var(--prs);border-left:3px solid var(--rojo)}
.notif-badge{position:absolute;top:-4px;right:-4px;background:var(--rojo);color:#fff;font-size:.55rem;font-weight:800;min-width:15px;height:15px;border-radius:var(--rp);display:flex;align-items:center;justify-content:center;padding:0 3px}
.pc{flex:1;overflow-y:auto;padding:1.25rem 1.35rem}

/* PÁGINAS Y BOTONES */
.pg{display:none}.pg.on{display:block}
.ph{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.15rem;flex-wrap:wrap;gap:.7rem}
.ptl{font-family:var(--fd);font-size:1.8rem;font-weight:400;letter-spacing:.03em;text-transform:uppercase;line-height:1}
.btn{padding:.5rem 1.05rem;border-radius:var(--rp);font-family:inherit;font-size:.78rem;font-weight:600;cursor:pointer;transition:var(--tr);border:none;display:inline-flex;align-items:center;gap:.35rem;line-height:1.3}
.bp{background:var(--rojo);color:#fff}.bp:hover{background:var(--rojo-h)}.bs{background:var(--sf);color:var(--tx);border:1px solid var(--bd)}.bs:hover{border-color:var(--negro)}.bsm{padding:.32rem .7rem;font-size:.72rem}
.bac{background:var(--negro);color:#fff}.bac:hover{background:#1e2937}
.badd{background:var(--sf);color:var(--sg);border:1px dashed var(--sg);font-size:.72rem;padding:.35rem .8rem}.badd:hover{background:var(--sg);color:#fff;border-style:solid}
.bwarn{background:var(--sob);color:var(--so);border:1px solid var(--so);font-size:.72rem;padding:.35rem .8rem}

/* DASHBOARD */
.sgd{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.75rem;margin-bottom:1.15rem}
.sc{background:var(--sf);border:1px solid var(--bd);border-radius:var(--rl);padding:1rem 1.15rem;display:flex;align-items:flex-start;gap:.75rem;transition:var(--tr)}.sc:hover{border-color:var(--bd2);box-shadow:var(--sh-sm)}
.si-i{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0}
.slb{font-size:.7rem;color:var(--t3);font-weight:600;text-transform:uppercase;letter-spacing:.06em}.svl{font-family:var(--ff);font-size:1.35rem;font-weight:800;line-height:1.2;margin-top:.1rem;letter-spacing:-.02em}
.ssb{font-size:.68rem;font-weight:600;margin-top:.15rem;display:inline-block;padding:.08rem .4rem;border-radius:var(--rp)}
.qa{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.6rem;margin-bottom:1.15rem}
.qi{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.9rem .65rem;background:var(--sf);border:1px solid var(--bd);border-radius:var(--rl);cursor:pointer;transition:var(--tr);font-size:.72rem;font-weight:600;color:var(--t2)}.qi:hover{border-color:var(--negro);color:var(--negro);box-shadow:var(--sh-sm)}
.qic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;background:var(--prs)}

/* NOTIFICACIONES POR PRIORIDAD */
.nf-g{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem .25rem;font-family:var(--fd);font-size:.95rem;letter-spacing:.06em;color:var(--t2)}
.nf-g i{width:8px;height:8px;border-radius:50%;display:inline-block}
.nf-g span{margin-left:auto;font-family:var(--ff);font-size:.62rem;font-weight:800;background:var(--bg);border-radius:var(--rp);padding:.05rem .45rem;color:var(--t2)}
.nf-item{padding:.5rem .8rem;border-top:1px solid var(--bg);font-size:.74rem;cursor:pointer;transition:background .15s;display:grid;gap:.1rem}
.nf-item:hover{background:var(--bg)}
.nf-item.unread{background:var(--prs);border-left:3px solid var(--rojo)}
.nf-t{font-weight:700;display:flex;justify-content:space-between;gap:.5rem}
.nf-ts{font-weight:500;color:var(--t3);font-size:.64rem;white-space:nowrap}
.nf-d{color:var(--t2);font-size:.7rem;line-height:1.35}
.nf-go{font-size:.64rem;font-weight:800;color:var(--negro);margin-top:.15rem}
.nf-empty{padding:1rem;text-align:center;color:var(--t3);font-size:.74rem}
/* PENDIENTES DE HOY (dashboard) */
.hoy{border:1.5px solid var(--sr);background:var(--srb);border-radius:var(--rl);padding:.75rem 1rem;margin-bottom:1.15rem}
.hoy.ok{border-color:#BBF7D0;background:#F0FDF4;display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
.hoy-h{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.3rem}
.hoy-t{font-family:var(--fd);font-size:1.2rem;letter-spacing:.04em;color:var(--sr);display:flex;align-items:center;gap:.4rem}
.hoy.ok .hoy-t{color:#15803D}
.hoy-n{font-family:var(--ff);font-size:.66rem;font-weight:800;background:var(--sr);color:#fff;border-radius:var(--rp);padding:.08rem .5rem}
.hoy-s{font-size:.72rem;color:var(--t2)}
.hoy-row{display:flex;gap:.5rem;align-items:center;padding:.35rem 0;font-size:.78rem;cursor:pointer;border-top:1px solid rgba(220,38,38,.12);flex-wrap:wrap}
.hoy-row b{font-weight:700}.hoy-row span{color:var(--t2);flex:1;min-width:0}.hoy-row em{font-style:normal;font-size:.66rem;font-weight:800;color:var(--sr);white-space:nowrap}
.hoy-row:hover b{color:var(--sr)}
.hoy-more{font-size:.7rem;color:var(--t3);padding-top:.3rem}

/* ---- Búsqueda inteligente: resaltado, barra de página, buscador global ---- */
mark.hl{background:rgba(234,0,41,.14);color:inherit;border-radius:3px;padding:0 .04em}
.sbar{position:relative;display:flex;align-items:center;margin-bottom:.7rem}
.sbar .sbar-ic{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);font-size:.85rem;color:var(--t3);pointer-events:none}
.sbar input{flex:1;width:100%;padding:.62rem 2.5rem .62rem 2.5rem;border:1px solid var(--bd);border-radius:var(--rp);background:var(--sf);font-size:.85rem;color:var(--tx);transition:var(--tr)}
.sbar input:focus{outline:none;border-color:var(--negro);box-shadow:0 0 0 3px rgba(16,24,32,.06)}
.sbar input::placeholder{color:var(--t3)}
.sbar .sbar-x{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:var(--rp);border:none;background:var(--bg);color:var(--t2);cursor:pointer;font-size:.7rem;display:none;align-items:center;justify-content:center}
.sbar .sbar-x:hover{background:var(--gris);color:var(--negro)}
.sbar.has .sbar-x{display:flex}
.sbar-meta{font-size:.7rem;color:var(--t3);margin:-.25rem 0 .7rem .5rem;display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.sbar-meta b{color:var(--negro)}
.sbar-meta .approx{color:#B45309;background:#FEF3C7;border-radius:var(--rp);padding:.1rem .55rem;font-weight:600}
.gs-dd{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--sf);border:1px solid var(--bd);border-radius:14px;box-shadow:0 14px 40px rgba(16,24,32,.14);z-index:120;display:none;max-height:min(70vh,520px);overflow:auto;padding:.35rem;text-align:left}
.gs-dd.on{display:block}
.gs-g{font-family:var(--fd);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--t3);padding:.5rem .7rem .2rem}
.gs-it{display:flex;align-items:center;gap:.55rem;padding:.45rem .7rem;border-radius:10px;cursor:pointer;font-size:.78rem}
.gs-it:hover,.gs-it.sel{background:var(--bg)}
.gs-ic{width:26px;height:26px;border-radius:8px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0}
.gs-it.sel .gs-ic,.gs-it:hover .gs-ic{background:var(--sf)}
.gs-t{flex:1;min-width:0}.gs-n{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gs-s{font-size:.66rem;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-b{font-size:.62rem;font-weight:700;color:var(--t2);flex-shrink:0}
.gs-all{display:flex;justify-content:space-between;align-items:center;padding:.55rem .7rem;margin-top:.25rem;border-top:1px solid var(--bd);font-size:.74rem;font-weight:700;color:var(--rojo);cursor:pointer;border-radius:0 0 10px 10px}
.gs-all:hover,.gs-all.sel{background:var(--bg)}
.gs-empty{padding:.9rem .7rem;font-size:.75rem;color:var(--t3);text-align:center}
.gs-k{font-size:.6rem;color:var(--t3);font-weight:500}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;display:none}
.tsm{display:none}
@media(max-width:768px){
 .tsm{display:flex;margin-left:auto}
 .sbar input,.ts.mob input,.pl-search,.cot-search{font-size:16px} /* evita el zoom automático de iOS al enfocar */
 .gs-it,.gs-all{min-height:44px}
 .ts.mob{display:block;position:fixed;left:.6rem;right:.6rem;top:calc(var(--hh) + .4rem);max-width:none;z-index:110}
 .ts.mob input{background:var(--sf);box-shadow:0 10px 30px rgba(16,24,32,.18);border-color:var(--negro)}
}
