/* ============================================================
   Plataforma Electoral Garzón · Sharry's Tech
   Centro de mando — identidad de la campaña (violeta / rosa)
   ============================================================ */
:root{
  /* Marca (los mismos de la landing) */
  --violeta:#7C3AED; --violeta-osc:#5B21B6; --violeta-soft:#F1EAFE;
  --rosa:#E0186C; --rosa-osc:#B0124F; --rosa-soft:#FDEBF3;
  --grad:linear-gradient(120deg,#6D28D9 0%,#7C3AED 45%,#C026D3 85%,#E0186C 120%);

  /* Nombres heredados: el resto de pantallas sigue usándolos */
  --navy:#2A1B54; --navy2:var(--violeta); --navy3:#1A0F38;
  --gold:var(--rosa); --gold-soft:var(--rosa-soft); --gold-dark:var(--rosa-osc);

  --paper:#F6F4FB; --card:#FFFFFF;
  --ok:#2E9E5B; --warn:#E8A521; --bad:#D6453D;
  --ink:#1C1630; --muted:#6B6580; --line:#E8E4F2;
  --r:16px; --shadow:0 1px 3px rgba(42,27,84,.06),0 10px 28px rgba(42,27,84,.07);
  --head:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--body);background:var(--paper);color:var(--ink);font-size:14px}
h1,h2,h3,h4{font-family:var(--head)}
a{color:var(--violeta)}
button{cursor:pointer;font-family:inherit}
input,select{font-family:inherit;font-size:16px}
:focus-visible{outline:3px solid var(--rosa);outline-offset:2px;border-radius:4px}
.muted{color:var(--muted)} .small{font-size:11.5px} .gold{color:var(--gold-dark)}
.spacer{flex:1}

/* ---------- login ---------- */
.body-auth{background:linear-gradient(140deg,#4C1D95 0%,#7C3AED 50%,#E0186C 125%)}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;gap:56px;padding:24px;flex-wrap:wrap}
.login-hero{color:#fff;max-width:430px}
.login-hero .eyebrow{color:#FFD3E7;font-weight:700;letter-spacing:2px;font-size:11px;text-transform:uppercase;margin-bottom:12px}
.login-hero h1{font-size:clamp(24px,4vw,34px);font-weight:800;line-height:1.2}
.hero-chips{margin-top:22px;display:flex;gap:8px;flex-wrap:wrap}
.hero-chips span{border:1px solid rgba(255,255,255,.28);border-radius:99px;padding:6px 13px;font-size:12px;color:#F1E9FF}
.login-card{background:var(--card);border-radius:20px;box-shadow:0 20px 50px rgba(26,15,56,.35);padding:32px;width:100%;max-width:380px}
.login-card h2{margin:20px 0 4px;font-size:20px}
.login-card .sub{color:var(--muted);font-size:13px;margin-bottom:18px}
.login-foot{margin-top:16px;font-size:11.5px;color:var(--muted);text-align:center;line-height:1.6}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--head);font-weight:800;font-size:16px;color:var(--navy)}
.brand-mark{width:36px;height:36px;border-radius:11px;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--head);font-weight:800;font-size:13px;flex:none;letter-spacing:.5px}

/* ---------- esqueleto: riel de íconos + banda ---------- */
.app-shell{display:grid;grid-template-columns:100px 1fr;min-height:100vh}
.rail{background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:stretch;padding:14px 8px;gap:6px;position:sticky;top:0;height:100vh;z-index:5}
.rail-logo{display:flex;justify-content:center;padding:2px 0 12px;margin-bottom:4px;border-bottom:1px solid var(--line);text-decoration:none}
.rail nav{display:flex;flex-direction:column;gap:4px;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#D9CFF5 transparent;margin:0 -4px;padding:0 4px}
.rail nav::-webkit-scrollbar{width:5px} .rail nav::-webkit-scrollbar-thumb{background:#D9CFF5;border-radius:9px}
.rail-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:9px 2px;border-radius:13px;color:var(--muted);text-decoration:none;font-size:10px;font-weight:600;text-align:center;line-height:1.15;letter-spacing:-.1px}
.rail-item svg{width:22px;height:22px}
.rail-item:hover{background:var(--violeta-soft);color:var(--violeta)}
.rail-item.activo{background:var(--violeta);color:#fff;box-shadow:0 6px 16px rgba(124,58,237,.32)}
.rail-salir{margin-top:6px;flex:none;border-top:1px solid var(--line);border-radius:0 0 13px 13px;padding-top:10px}

.main{min-width:0;display:flex;flex-direction:column}
.banda{background:var(--grad);color:#fff;padding:20px clamp(14px,3vw,30px) 80px}
.banda-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;max-width:1240px}
.miga{font-family:var(--head);font-weight:800;font-size:clamp(15px,2.2vw,19px);letter-spacing:.6px;text-transform:uppercase;display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.miga span{opacity:.65}
.tabs{display:flex;gap:6px;margin-top:14px;flex-wrap:wrap}
.tab{padding:8px 15px;border-radius:10px;color:#fff;text-decoration:none;font-size:13px;font-weight:600;background:rgba(255,255,255,.08)}
.tab:hover{background:rgba(255,255,255,.18)}
.tab.activo{background:#fff;color:var(--violeta-osc);box-shadow:0 4px 12px rgba(26,15,56,.18)}
.contenido{padding:0 clamp(14px,3vw,30px) 70px;margin-top:-56px;max-width:1300px;width:100%}

.user-pill{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);border-radius:99px;padding:5px 13px 5px 5px}
.avatar{width:32px;height:32px;border-radius:50%;background:#fff;color:var(--violeta-osc);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:12px}
.who{font-weight:700;font-size:12.5px;color:#fff}
.role-badge{background:#fff;color:var(--rosa-osc);font-size:10px;font-weight:800;padding:3px 9px;border-radius:99px;letter-spacing:.5px}

/* globo de ayuda de las gráficas */
.tip{position:fixed;z-index:50;background:var(--navy3);color:#fff;font-size:12px;font-weight:600;padding:6px 10px;border-radius:8px;pointer-events:none;max-width:260px;box-shadow:0 6px 18px rgba(26,15,56,.25)}
.tip[hidden]{display:none}

/* ---------- tarjetas y tablas ---------- */
.grid{display:grid;gap:16px}
.g3{grid-template-columns:repeat(3,1fr)} .g2{grid-template-columns:1.4fr 1fr}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:18px;min-width:0}
.card h3{font-size:14.5px;font-weight:700;color:var(--navy);margin-bottom:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kpi{border-top:3px solid var(--violeta)} .kpi.gold{border-top-color:var(--rosa)} .kpi.green{border-top-color:var(--ok)}
.kpi .lbl{font-size:11.5px;color:var(--muted);font-weight:600}
.kpi-num{font-family:var(--head);font-size:clamp(22px,3vw,29px);font-weight:800;color:var(--navy);margin-top:5px}

.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse}
.tbl-wrap table{min-width:640px}
th{font-size:10.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);text-align:left;padding:8px 10px;border-bottom:1.5px solid var(--line);white-space:nowrap}
td{padding:10px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle}
tr:hover td{background:#FBF9FF}
.tag{font-size:11px;font-weight:600;padding:3px 9px;border-radius:99px;display:inline-block;white-space:nowrap}
.tag-blue{background:var(--violeta-soft);color:var(--violeta-osc)} .tag-gold{background:var(--rosa-soft);color:var(--rosa-osc)}
.tag-green{background:#E9F8EF;color:#128C46} .tag-grey{background:#F0EEF6;color:var(--muted)}
.masked{font-variant-numeric:tabular-nums}

/* ---------- formularios ---------- */
.toolbar{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.toolbar input,.toolbar select{border:1.5px solid var(--line);border-radius:10px;padding:9px 12px;background:#fff}
.toolbar input[type=search]{min-width:200px;flex:1;max-width:340px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px 18px}
.form-grid .full{grid-column:1/-1}
.field{display:block}
.field span{display:block;font-size:11.5px;font-weight:700;color:var(--muted);margin-bottom:5px}
.field input,.field select{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;background:#FCFBFE}
.field input:focus,.field select:focus{border-color:var(--violeta);outline:none;background:#fff}
.field.has-error input,.field.has-error select{border-color:var(--bad);background:#FFF7F7}
.field em{display:block;color:var(--bad);font-size:11.5px;font-style:normal;font-weight:600;margin-top:4px}
.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:4px}
.card-form{max-width:860px}

.btn{border:none;border-radius:11px;padding:12px 18px;font-weight:700;font-size:13.5px;text-decoration:none;display:inline-block}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--violeta);color:#fff}
.btn-primary:hover{background:var(--violeta-osc)}
.btn-gold{background:var(--rosa);color:#fff}
.btn-gold:hover{background:var(--rosa-osc)}
.btn-ghost{background:#fff;border:1.5px solid var(--line);color:var(--ink)}
.btn-block{width:100%}

.consent{background:var(--rosa-soft);border:1px solid #F7C6DC;border-radius:10px;padding:12px 14px;font-size:12.5px;line-height:1.6;display:flex;gap:10px;align-items:flex-start}
.consent input{margin-top:3px;width:17px;height:17px;flex:none;accent-color:var(--rosa)}
.consent.has-error{border-color:var(--bad)}

.alert{border-radius:10px;padding:11px 14px;font-size:13px;font-weight:600;margin-bottom:14px}
.alert-ok{background:#E9F8EF;border:1px solid #BCE6CB;color:#128C46}
.alert-error{background:#FBE9E8;border:1px solid #F2C4C1;color:var(--bad)}

/* ---------- móvil ---------- */
@media(max-width:860px){
  .app-shell{grid-template-columns:1fr}
  .rail{position:sticky;top:0;height:auto;flex-direction:row;align-items:center;padding:8px;gap:4px;overflow-x:auto;border-right:none;border-bottom:1px solid var(--line)}
  .rail-logo{border:none;padding:0 6px 0 2px;margin:0}
  .rail nav{flex-direction:row;gap:2px;flex:none;overflow:visible;margin:0;padding:0}
  .rail-item{min-width:64px;padding:7px 4px;font-size:10px}
  .rail-salir{margin:0 0 0 auto;border-top:none;padding-top:7px}
  .g3,.g2,.form-grid{grid-template-columns:1fr}
  .contenido{padding:0 12px 60px}
  .banda{padding:16px 12px 72px}
}

/* módulo equipo */
.btn-mini{padding:7px 12px;font-size:12px;border-radius:9px}
.ref-code{background:var(--violeta-soft);border-radius:7px;padding:3px 8px;font-size:12px;color:var(--violeta-osc);font-weight:700}

/* módulo catálogos */
.cat-grid{align-items:start}
.cat-form{display:grid;gap:8px;margin-bottom:12px;padding-bottom:12px;border-bottom:1.5px dashed var(--line)}
.cat-form input,.cat-form select{border:1.5px solid var(--line);border-radius:9px;padding:9px 11px;background:#FCFBFE;font-size:13.5px;width:100%}
.cat-lista{max-height:420px;overflow-y:auto}
.cat-item{display:flex;align-items:center;gap:8px;padding:8px 2px;border-bottom:1px solid var(--line);font-size:13px}
.cat-item > span:first-child{flex:1}
.cat-uso{color:var(--muted);font-size:11.5px;white-space:nowrap}
.cat-del{border:none;background:#FBE9E8;color:var(--bad);width:24px;height:24px;border-radius:7px;font-size:11px;font-weight:800}
.cat-del:hover{background:var(--bad);color:#fff}
@media(max-width:1020px){.cat-grid{grid-template-columns:1fr}}

/* ---------- Red de Súper Promotores y mapa ---------- */
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1020px){.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.g4{grid-template-columns:1fr}}
.kpi.violet{border-top-color:#7C3AED}
.activar-red{display:flex;align-items:center;gap:14px;background:linear-gradient(100deg,var(--rosa-soft),#fff);border:1.5px solid #F7C6DC;border-radius:var(--r);padding:14px 18px;margin-bottom:16px;flex-wrap:wrap;box-shadow:var(--shadow)}
.activar-red .ar-ico{font-size:28px}
.activar-red .ar-txt{flex:1;min-width:240px;font-size:12.5px;color:var(--muted);line-height:1.5}
.activar-red .ar-txt b{display:block;color:var(--navy);font-size:14px;margin-bottom:2px}
.progreso{height:12px;background:var(--violeta-soft);border-radius:99px;overflow:hidden;margin:4px 0 6px}
.progreso i{display:block;height:100%;background:var(--violeta);border-radius:99px}
.progreso.mini{height:7px;margin:2px 0}
.progreso-txt{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted);flex-wrap:wrap;gap:6px}
.leyenda{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.leyenda i{width:12px;height:12px;border-radius:50%;display:inline-block;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.leyenda i.aro{background:#fff;border:3px solid #E0186C;box-shadow:none}
.mapa{height:calc(100vh - 260px);min-height:420px;width:100%}

/* ---------- Centro de mando (Vista rápida) ---------- */
.mando-1{grid-template-columns:1fr 1.45fr 1fr}
.mando-2{grid-template-columns:1.3fr 1fr;margin-top:16px}
.mando-3,.mando-4{margin-top:16px}
@media(max-width:1100px){.mando-1{grid-template-columns:1fr 1fr}.mando-1 > :nth-child(2){grid-column:1/-1;order:3}}
@media(max-width:860px){.mando-1,.mando-2{grid-template-columns:1fr}.mando-1 > :nth-child(2){order:0}}
.h3-link{margin-left:auto;font-size:12px;font-weight:700;text-decoration:none}
.vacio{padding:18px 0;font-size:13px}
.nota{margin-top:10px;line-height:1.5}

/* medidor de la meta */
.medidor{display:block;width:100%;max-width:240px;margin:0 auto}
.m-pista,.m-valor{fill:none;stroke-width:18;stroke-linecap:round}
.m-pista{stroke:var(--violeta-soft)}
.m-valor{stroke:var(--violeta)}
.m-num{font-family:var(--head);font-size:30px;font-weight:800;fill:var(--navy)}
.m-pct{font-size:16px;fill:var(--muted)}
.meta-cifra{text-align:center;margin-top:4px;font-family:var(--head)}
.meta-cifra b{font-size:24px;color:var(--violeta)}
.meta-cifra span{color:var(--muted);font-size:15px}
.meta-txt{text-align:center;font-size:12.5px;color:var(--muted);margin-top:2px}
.meta-extra{text-align:center;font-size:12px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);color:var(--muted)}
.hero-num{font-family:var(--head);font-size:48px;font-weight:800;color:var(--violeta);text-align:center;margin:18px 0 4px}
.editar-meta{margin-top:12px;font-size:12.5px}
.editar-meta summary{cursor:pointer;color:var(--violeta);font-weight:700;text-align:center;list-style:none}
.editar-meta summary::-webkit-details-marker{display:none}
.editar-meta form{display:flex;gap:8px;margin-top:8px}
.editar-meta input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:9px;padding:8px 10px;font-size:14px}

/* barras horizontales */
.barras{display:flex;flex-direction:column;gap:9px}
.b-fila{display:grid;grid-template-columns:62px 1fr;align-items:center;gap:10px}
.b-et{font-size:12px;font-weight:600;color:var(--muted);text-align:right}
.b-pista{display:flex;align-items:center;gap:8px;min-width:0;border-left:1px solid var(--line);padding:3px 0}
.b-pista i{display:block;height:20px;border-radius:0 4px 4px 0;flex:none;outline-offset:2px}
.b-val{font-size:12.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}

/* columnas verticales */
.columnas{display:grid;gap:6px;align-items:end;padding-top:6px}
.col{display:flex;flex-direction:column;align-items:center;min-width:0}
.col-zona{height:150px;width:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;border-bottom:1px solid var(--line)}
.col-zona i{display:block;width:min(24px,70%);border-radius:4px 4px 0 0}
.c-val{font-size:11.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.c-et{font-size:11px;font-weight:600;color:var(--muted);margin-top:6px;text-align:center;line-height:1.25;white-space:nowrap}
.c-et small{display:block;font-weight:500;font-size:10px}

/* proporción (barra apilada al 100 %) */
.prop{display:flex;gap:2px;height:42px;border-radius:10px;overflow:hidden;margin:6px 0 14px}
.prop i{display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12.5px;font-weight:800;min-width:3px;white-space:nowrap}
.prop-ley{list-style:none;display:flex;flex-direction:column;gap:7px}
.prop-ley li{display:flex;align-items:center;gap:8px;font-size:12.5px}
.prop-ley li b{margin-left:auto;font-variant-numeric:tabular-nums}
.prop-ley li .muted{min-width:44px;text-align:right;font-size:11.5px;font-variant-numeric:tabular-nums}
.sw{width:11px;height:11px;border-radius:3px;flex:none}

/* tarjetas de cifra (promotores) */
.stat{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1.5px solid var(--line);border-left:4px solid #1baf7a;border-radius:14px;padding:14px 16px;margin-bottom:10px}
.stat.violeta{border-left-color:var(--violeta)}
.stat-lbl{display:block;font-size:11.5px;color:var(--muted);font-weight:600}
.stat-num{font-family:var(--head);font-size:30px;font-weight:800;color:var(--navy);line-height:1.15}
.stat-ico{width:40px;height:40px;color:var(--violeta);flex:none}
.stat-ico.verde{color:#1baf7a}
.stat-ico svg{width:100%;height:100%}

/* lienzos: grafo y mapa pequeño */
.red-lienzo{height:330px;border:1px solid var(--line);border-radius:12px;background:#FDFCFF;overflow:hidden;position:relative}
.red-lienzo canvas{display:block;touch-action:none}
.mapa-mini{height:330px;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.mapbox-logo{display:block;line-height:0}
.mapbox-logo img{display:block;width:88px;height:23px}
/* Grupos de puntos del mapa en la marca (más oscuro = más personas), no en verde/amarillo/naranja */
.leaflet-container .marker-cluster-small,.leaflet-container .marker-cluster-medium,.leaflet-container .marker-cluster-large{background-color:rgba(124,58,237,.22)}
.leaflet-container .marker-cluster-small div{background-color:#9363ff;color:#fff;font-weight:700}
.leaflet-container .marker-cluster-medium div{background-color:#6400cf;color:#fff;font-weight:700}
.leaflet-container .marker-cluster-large div{background-color:#480099;color:#fff;font-weight:700}
.red-grande{height:calc(100vh - 230px);min-height:460px}
.red-controles{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.red-ley{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px}
.red-ley li{display:flex;align-items:center;gap:6px;font-size:12.5px}
.red-ley .muted{font-size:11.5px}

.embudo .b-fila{grid-template-columns:120px 1fr}
.calidad-fila{display:grid;grid-template-columns:150px 1fr 48px;align-items:center;gap:10px;font-size:12.5px;padding:8px 2px;border-bottom:1px solid var(--line)}
.calidad-fila b{text-align:right;font-variant-numeric:tabular-nums}
.calidad-fila.sin-barra{grid-template-columns:1fr auto}

/* ---------- Cola "Completar y verificar" ---------- */
.cola-tabs{display:flex;gap:6px;flex-wrap:wrap}
.cola-tab{padding:8px 13px;border-radius:10px;border:1.5px solid var(--line);text-decoration:none;color:var(--ink);font-size:13px;font-weight:600;background:#fff}
.cola-tab b{margin-left:4px;color:var(--violeta)}
.cola-tab.activo{background:var(--violeta);border-color:var(--violeta);color:#fff}
.cola-tab.activo b{color:#fff}
.cola td{vertical-align:top}
.cola select,.cola input.in-mesa{border:1.5px solid var(--line);border-radius:9px;padding:8px 9px;background:#FCFBFE;font-size:13px;max-width:220px}
.cola input.in-mesa{width:64px}
.cola select:focus,.cola input:focus{border-color:var(--violeta);outline:none}
.cola .chk-verif{width:20px;height:20px;accent-color:var(--violeta);margin-top:6px}
.cola .tel{font-weight:700;text-decoration:none}
.fila-msg{display:block;margin-top:4px;font-weight:700}
.fila-msg.ok{color:#128C46} .fila-msg.err{color:var(--bad)}
.cola tr.guardada td{background:#F6FBF8}
.paginacion{display:flex;gap:10px;align-items:center;justify-content:center;margin-top:14px}

/* ---------- Módulo WhatsApp ---------- */
.wa-tabs{margin-bottom:2px}
.wa-kpis{margin-top:4px}
.var-fila{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.var-fila b{font-family:var(--head);color:var(--violeta);min-width:34px}
.var-fila select{max-width:260px}
.sugerida{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-bottom:8px}
.sugerida summary{cursor:pointer;font-size:13px}
.sugerida pre{white-space:pre-wrap;font:inherit;font-size:12.5px;background:#FBF9FF;border-radius:8px;padding:10px;margin:8px 0;line-height:1.5}
.copiable{background:#FBF9FF;border:1px dashed #D4CBE8;border-radius:9px;padding:9px 11px;font-size:12px;word-break:break-all}
.pasos-wa{padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:13px;line-height:1.55}
code{font-size:.92em}

/* ---------- Acceso con Google ---------- */
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;
  background:#fff;color:var(--ink);border:1.5px solid var(--line);border-radius:11px;
  padding:12px 18px;font-weight:700;font-size:13.5px;text-decoration:none}
.btn-google:hover{background:#FBF9FF;border-color:#D4CBE8}
.btn-google:active{transform:scale(.98)}
.btn-google svg{flex:0 0 auto}
.google-hint{color:var(--muted);font-size:11.5px;text-align:center;margin-top:8px}
.divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--muted);font-size:11.5px}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}

/* ===== Tareas de la red ===== */
.kpi-mini{display:flex;flex-direction:column;gap:2px;padding:14px 16px}
.kpi-mini b{font-family:var(--head,inherit);font-size:24px;line-height:1.1}
.kpi-mini.kpi-alerta{border:1.5px solid #F2C46D;background:#FFF9EC}
.kpi-mini.activo{outline:2px solid var(--violeta)}
.txt-alerta{color:#B7791F}
.tag-red{background:#FDECEF;color:#B4123F}
.field-titulo{display:block;font-size:11.5px;font-weight:700;color:var(--muted);margin-bottom:6px}
.opciones-modo{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.op-modo{display:flex;flex-direction:column;gap:2px;border:1.5px solid var(--line);border-radius:12px;padding:12px 12px 12px 36px;position:relative;cursor:pointer;background:#FCFBFE}
.op-modo input{position:absolute;left:12px;top:14px;accent-color:var(--violeta)}
.op-modo b{font-size:13.5px}
.op-modo span{font-size:12px;color:var(--muted)}
.op-modo:has(input:checked){border-color:var(--violeta);background:#F6F1FE}
@media(max-width:720px){.opciones-modo{grid-template-columns:1fr}}
.clave-temp{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.clave-temp code{font-size:18px;font-weight:800;background:#fff;border:1px dashed var(--violeta);border-radius:8px;padding:4px 10px}
#nuevaVars .var-fila{display:flex;gap:8px;align-items:center;margin-top:6px}
#nuevaVars select{border:1.5px solid var(--line);border-radius:9px;padding:7px 10px;background:#fff;min-width:260px}
.form-sugerida{margin-top:10px}

/* ===== Página Red de contactos ===== */
.red-guia-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:6px}
.red-guia-items>div{display:flex;gap:10px;align-items:flex-start}
.red-guia-items p{font-size:12.5px;line-height:1.5;color:var(--muted,#5A6072);margin:0}
.red-guia-items b{color:var(--navy)}
.g-ico{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:9.5px;font-weight:800;color:#fff}
.g-ico.raiz{background:#1C1630}
.g-ico.punto{background:#fff;position:relative;border:1px dashed #C9C2DE}
.g-ico.punto::after{content:"";width:10px;height:10px;border-radius:50%;background:#7C3AED}
.g-ico.grande{background:#7C3AED;box-shadow:0 0 0 4px #F3EEFD}
.g-ico.capas{background:linear-gradient(120deg,#7C3AED,#E0186C);font-size:8.5px;letter-spacing:-.3px}
.red-cifras{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:16px}
.red-cifras>div{background:var(--fondo,#F8F7FC);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column}
.red-cifras span{font-size:11.5px;color:#6B6580;line-height:1.3}
.red-cifras b{font-family:var(--head);font-size:22px;font-weight:800;color:var(--navy);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.red-cifras small{font-size:11px;color:#7C3AED;font-weight:600}
.red-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start;margin:14px 0}
.red-barra{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:10px}
.red-buscar{position:relative;flex:1;min-width:200px;max-width:320px}
.red-buscar input{width:100%;padding:8px 12px;border:1.5px solid var(--line);border-radius:10px;font:inherit;font-size:13.5px}
.red-buscar input:focus{outline:none;border-color:#7C3AED;box-shadow:0 0 0 3px #F3EEFD}
.red-resultados{position:absolute;z-index:20;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(26,15,56,.14);list-style:none;margin:0;padding:4px;max-height:300px;overflow:auto}
.red-resultados a{display:flex;flex-direction:column;padding:7px 10px;border-radius:8px;color:var(--navy);text-decoration:none;font-size:13.5px;font-weight:600}
.red-resultados a:hover{background:#F3EEFD}
.red-resultados small{font-weight:500;color:#6B6580;font-size:11.5px}
.red-modos{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.red-modos .muted{margin-right:4px}
.red-panel{position:sticky;top:14px;max-height:calc(100vh - 40px);overflow:auto}
.red-panel h3{margin-bottom:6px}
.red-cerrar{float:right;border:0;background:#F3F2F8;border-radius:50%;width:28px;height:28px;cursor:pointer;color:#5A6072}
.red-nombre{font-size:18px;margin:2px 0 8px}
.red-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.red-datos{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:13px;margin:0 0 12px}
.red-datos dt{color:#6B6580}
.red-datos dd{margin:0;font-weight:600}
.red-dos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.red-dos>div{background:#F8F7FC;border-radius:12px;padding:10px;text-align:center}
.red-dos b{display:block;font-family:var(--head);font-size:22px;color:var(--navy)}
.red-dos span{font-size:11.5px;color:#6B6580}
.red-camino{font-size:13px;margin-top:12px;line-height:1.7}
.red-lista,.red-top{list-style:none;margin:0;padding:0}
.red-lista li,.red-top li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.red-top{counter-reset:t}
.red-top li{counter-increment:t}
.red-top li::before{content:counter(t);width:22px;height:22px;border-radius:50%;background:#F3EEFD;color:#7C3AED;font-weight:800;font-size:11px;display:grid;place-items:center;flex:none}
.red-top li a{flex:1}
.red-top li span{font-size:11.5px;color:#6B6580;white-space:nowrap}
.red-lista a,.red-top a,.red-arbol a{color:var(--navy);font-weight:600;text-decoration:none}
.red-lista a:hover,.red-top a:hover,.red-arbol a:hover{color:#7C3AED;text-decoration:underline}
.pt{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:middle}
.red-arbol ul{list-style:none;margin:0;padding:0}
.red-arbol .hijos{margin-left:22px;border-left:1.5px dashed #DDD8EC;padding-left:8px}
.red-arbol .fila{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13.5px;flex-wrap:wrap}
.red-arbol .abrir{width:22px;height:22px;border:0;border-radius:6px;background:#F3EEFD;color:#7C3AED;cursor:pointer;font-size:12px;flex:none}
.red-arbol .abrir.sin{display:inline-block;background:none;cursor:default}
@media (max-width:1100px){.red-layout{grid-template-columns:1fr}.red-panel{position:static;max-height:none}.red-cifras{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.red-guia-items{grid-template-columns:1fr 1fr}.red-cifras{grid-template-columns:1fr 1fr}}

/* ===== Metas y pronóstico ===== */
.cuenta .kpi-num small{font-size:14px;color:var(--muted);font-weight:700}
.cuotas-fila{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cuota{background:var(--violeta-soft);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.cuota > b{font-family:var(--head);font-size:34px;line-height:1.05;color:var(--violeta-osc)}
.cuota > span{font-weight:700;color:var(--navy);margin-bottom:6px}
.cuota small{color:var(--muted);font-size:12px}
.pron-fila{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:13px}
.pron-fila span{color:var(--muted)} .pron-fila b{color:var(--navy);white-space:nowrap}
.pron-grande{margin:14px 0 6px;background:var(--rosa-soft);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column}
.pron-grande span{font-size:12.5px;color:var(--rosa-osc);font-weight:700}
.pron-grande b{font-family:var(--head);font-size:36px;color:var(--rosa-osc);line-height:1.1}
.pron-grande small{font-size:12px;color:var(--muted)}
.txt-alerta{margin-top:10px;font-size:13px;background:#FFF9EC;border:1.5px solid #F2C46D;border-radius:12px;padding:10px 12px}
.plan tr.mes-actual td{background:#F7F3FF}
.plan tr.mes-pasado td{color:var(--muted)}
.tray{width:100%;height:auto;display:block;overflow:visible}
.tray .t-rej{stroke:var(--line);stroke-width:1}
.tray .t-eje{fill:var(--muted);font-size:11px}
.tray .t-meta{stroke:var(--rosa);stroke-width:1.2;stroke-dasharray:2 4}
.tray .t-hoy{stroke:#B9B3CC;stroke-width:1;stroke-dasharray:3 3}
.tray .t-area{fill:rgba(124,58,237,.10)}
.tray .t-real{fill:none;stroke:#7C3AED;stroke-width:2.6;stroke-linejoin:round}
.tray .t-necesario{fill:none;stroke:#E0186C;stroke-width:2.4}
.tray .t-pron{fill:none;stroke:#6B6580;stroke-width:2;stroke-dasharray:6 5}
.tray .t-punto{fill:#7C3AED;stroke:#fff;stroke-width:2}
.tray .t-punto-pron{fill:#6B6580;stroke:#fff;stroke-width:2}
.tray .t-lbl{font-size:11.5px;font-weight:700}
.tray .t-lbl-meta{fill:var(--rosa-osc)} .tray .t-lbl-pron{fill:#6B6580}
.sw.sw-linea{background:none!important;border-top:3px solid;height:0;border-radius:0;width:18px;vertical-align:middle}
.sw.sw-punteada{border-top-style:dashed}
@media(max-width:760px){.cuotas-fila{grid-template-columns:1fr}}

/* ===== Organización ===== */
a.org-kpi{text-decoration:none;color:inherit;display:block;transition:transform .12s, box-shadow .2s}
a.org-kpi:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(26,15,56,.12)}
.progreso.alerta i{background:var(--bad)}
.pago-rapido{display:inline-block;position:relative}
.pago-rapido > summary{list-style:none;cursor:pointer}
.pago-rapido > summary::-webkit-details-marker{display:none}
.pago-rapido[open] > form{position:absolute;right:0;z-index:20;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 40px rgba(26,15,56,.18);padding:12px;display:grid;gap:8px;width:250px;margin-top:6px}
.pago-rapido input,.pago-rapido select{border:1.5px solid var(--line);border-radius:9px;padding:8px 10px;font-size:13px;width:100%}
.txt-peligro{color:var(--bad)!important}
.chk{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.chk input{width:18px;height:18px;accent-color:var(--violeta)}
.solo-pago[hidden]{display:none}
.form-grid.tres{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.form-grid.tres{grid-template-columns:1fr}}
.rail-logo{flex:none}
.aviso-legal{margin-top:14px;font-size:12.5px;line-height:1.55;background:#F7F3FF;border:1.5px solid #E2D6FB;border-radius:12px;padding:11px 14px;color:var(--ink)}