/* SGS CRM — firma canónica (FIRMA.md). Solo var(--token). */
:root{
  --bg-deep:#0a0e13;--bg:#0f1419;--bg2:#151b23;--bg3:#1c2530;--bg4:#232d3b;
  --panel:#111820;--surface:#18202b;--surface2:#1e2836;
  --text:#e4e8ee;--text2:#c0c8d4;--dim:#7a8694;--muted:#525e6c;
  --accent:#00d67e;--accent2:#00f28e;--accent-dim:rgba(0,214,126,0.08);--accent-border:rgba(0,214,126,0.15);
  --blue:#38a3f8;--blue-dim:rgba(56,163,248,0.08);--blue-border:rgba(56,163,248,0.15);
  --orange:#f5a623;--orange-dim:rgba(245,166,35,0.08);
  --red:#f04848;--red-dim:rgba(240,72,72,0.08);--red-border:rgba(240,72,72,0.15);
  --purple:#a78bfa;--purple-dim:rgba(167,139,250,0.10);--gold:#ffd700;
  --border:rgba(255,255,255,0.06);--border2:rgba(255,255,255,0.1);--hover:rgba(255,255,255,0.04);
  --shadow:0 4px 24px rgba(0,0,0,0.3);--radius:10px;--radius-sm:6px;--radius-lg:14px;
  --transition:all .2s cubic-bezier(.4,0,.2,1);--mono:'JetBrains Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);height:100vh;overflow:hidden;display:flex;flex-direction:column;font-size:.9rem}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-thumb{background:var(--muted);border-radius:3px}

/* Contenedor principal: topbar arriba, shell abajo (columna, no fila) */
#view-main{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}

/* Shell */
.shell{flex:1;display:flex;overflow:hidden;min-height:0}
.content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.content-body{flex:1;overflow-y:auto;padding:8px;min-width:0;display:flex;flex-direction:column}
/* .rightpanel/.rp-* los inyecta left-nav.js (CSS canónico con el chevron dinámico) */

/* Componentes base (FIRMA) */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.9rem;margin-bottom:.7rem}
.card-title{font-size:.72rem;font-weight:800;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.btn{padding:.42rem .8rem;border:none;border-radius:6px;font-size:.82rem;font-weight:700;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;transition:var(--transition);text-decoration:none}
.btn-accent{background:linear-gradient(135deg,var(--accent),#00b368);color:#000}
.btn-accent:hover{transform:translateY(-1px);box-shadow:0 0 16px rgba(0,214,126,.25)}
.btn-sec{background:var(--surface);border:1px solid var(--border);color:var(--text)}
.btn-sec:hover{border-color:var(--border2)}
.btn-red{background:var(--red-dim);border:1px solid var(--red-border);color:var(--red)}
.btn.full{width:100%}
label{font-size:.66rem;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.04em;display:block;margin:.5rem 0 .2rem}
input,select,textarea{width:100%;min-width:0;box-sizing:border-box;padding:.5rem .65rem;background:var(--bg);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:.88rem;font-family:inherit;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
textarea{resize:vertical;min-height:60px}
/* Editor de texto enriquecido (negrita/cursiva/subrayado) */
.rte{border:1px solid var(--border);border-radius:5px;background:var(--bg);overflow:hidden}
.rte:focus-within{border-color:var(--accent)}
.rte-bar{display:flex;gap:.2rem;padding:.3rem;background:var(--bg2);border-bottom:1px solid var(--border)}
.rte-btn{background:none;border:1px solid transparent;border-radius:4px;color:var(--dim);cursor:pointer;font-size:.95rem;width:28px;height:26px;display:inline-flex;align-items:center;justify-content:center;transition:var(--transition)}
.rte-btn:hover{background:var(--surface2);color:var(--text)}
.rte-btn:active{background:var(--accent-dim);color:var(--accent)}
.rte-editor{padding:.5rem .65rem;min-height:80px;font-size:.88rem;color:var(--text);line-height:1.5;outline:none;white-space:pre-wrap;word-wrap:break-word;cursor:text}
.badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;padding:.15rem .55rem;border-radius:99px}
.badge.green{background:var(--accent-dim);color:var(--accent)}
.badge.blue{background:var(--blue-dim);color:var(--blue)}
.badge.orange{background:var(--orange-dim);color:var(--orange)}
.badge.red{background:var(--red-dim);color:var(--red)}
.badge.purple{background:var(--purple-dim);color:var(--purple)}
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--dim);gap:.5rem;padding:2rem}
.mono{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}

/* Login */
.login-view{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 100% at 0% 0%,rgba(0,214,126,.12),transparent 55%),radial-gradient(90% 80% at 100% 100%,rgba(56,163,248,.08),transparent 60%),var(--bg)}
.login-card{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:2.2rem;box-shadow:var(--shadow)}
.login-brand{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.15rem;margin-bottom:.4rem}
.login-brand i{font-size:1.5rem;color:var(--accent)}
.login-card h1{font-size:1.6rem;font-weight:800;letter-spacing:-.02em}
.login-sub{color:var(--dim);font-size:.86rem;margin:.2rem 0 1.2rem}
.login-card input{margin-bottom:.4rem;padding:.7rem .9rem;border-radius:10px}
.login-sep{display:flex;align-items:center;gap:.7rem;margin:1rem 0;color:var(--muted);font-size:.7rem}
.login-sep::before,.login-sep::after{content:"";flex:1;height:1px;background:var(--border)}
.login-err{color:var(--red);font-size:.78rem;margin-top:.6rem;min-height:1em}

/* KPI */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.7rem;margin-bottom:1rem}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.9rem}
.kpi .k-label{font-size:.64rem;font-weight:800;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;display:flex;align-items:center;gap:.4rem}
.kpi .k-label i{color:var(--accent)}
.kpi .k-val{font-family:var(--mono);font-weight:800;font-size:1.5rem;margin:.3rem 0 .1rem}
.kpi .k-sub{font-size:.7rem;color:var(--muted)}

/* Tablas */
table{width:100%;border-collapse:collapse;font-size:.82rem}
th{text-align:left;font-size:.62rem;font-weight:800;color:var(--dim);text-transform:uppercase;letter-spacing:.04em;padding:.5rem .6rem;border-bottom:1px solid var(--border)}
td{padding:.55rem .6rem;border-bottom:1px solid var(--border);color:var(--text2)}
tr:hover td{background:var(--hover)}
tr.clickable{cursor:pointer}
.tbl-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:auto;flex:1;min-height:0}
.pager{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;padding:.5rem .7rem;border-top:1px solid var(--border);font-size:.75rem;color:var(--dim);flex-shrink:0}
.pager .btn{font-size:.7rem;padding:.28rem .6rem}

/* Kanban */
.board{display:flex;gap:.6rem;flex:1;min-height:0;overflow-x:auto;overflow-y:hidden;padding-bottom:.4rem}
.kcol{width:264px;min-width:264px;flex-shrink:0;display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.kcol-head{display:flex;align-items:center;justify-content:space-between;gap:.4rem;padding:.55rem .7rem;border-bottom:1px solid var(--border);font-size:.74rem;font-weight:800}
.kcol-head .cnt{font-family:var(--mono);font-weight:700;font-size:.68rem;background:var(--surface2);border-radius:99px;padding:.1rem .45rem}
.kcol-head .sum{font-family:var(--mono);font-size:.62rem;color:var(--dim)}
.kcol-body{flex:1;overflow-y:auto;padding:.5rem;display:flex;flex-direction:column;gap:.5rem;min-height:60px}
.kcol-body.over{background:var(--accent-dim)}
.pcard{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.6rem .7rem;cursor:grab;transition:var(--transition)}
.pcard:hover{border-color:var(--border2);box-shadow:var(--shadow)}
.pcard.dragging{opacity:.4}
.pcard .pc-name{font-weight:700;font-size:.82rem}
.pcard .pc-meta{font-size:.7rem;color:var(--dim);margin-top:.2rem;display:flex;flex-direction:column;gap:.15rem}
.pcard .pc-money{font-family:var(--mono);font-weight:800;font-size:.78rem;color:var(--accent)}
.pcard .pc-asesor{font-size:.64rem;color:var(--muted);margin-top:.3rem}

/* Vista (toggle) + semáforo de seguimiento */
.view-toggle{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
.view-toggle .btn{font-size:.72rem;padding:.36rem .5rem}
.pcard .pc-sem{margin-top:.3rem;display:flex;align-items:center}
.sem{display:inline-flex;align-items:center;gap:.3rem;font-size:.64rem;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.sem i{font-size:.5rem}
.sem.green{color:var(--accent)}
.sem.yellow{color:var(--gold)}
.sem.orange{color:var(--orange)}
.sem.red{color:var(--red)}
.sem.blink{animation:blink 1s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}

/* Modal */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:500;display:flex;align-items:center;justify-content:center;padding:1rem}
.modal{background:var(--panel);border:1px solid var(--border);border-radius:14px;width:100%;max-width:520px;max-height:90vh;display:flex;flex-direction:column;box-shadow:var(--shadow)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:1px solid var(--border)}
.modal-head h3{font-size:1rem;font-weight:800}
.modal-close{background:none;border:none;color:var(--dim);cursor:pointer;font-size:1.1rem;font-family:inherit}
.modal-body{padding:1.1rem;overflow-y:auto}
.modal-foot{display:flex;gap:.6rem;padding:1rem 1.1rem;border-top:1px solid var(--border)}

/* Toast */
.toast-wrap{position:fixed;top:1rem;right:1rem;z-index:9999}
.toast{padding:.5rem .85rem;border-radius:6px;font-size:.82rem;font-weight:700;margin-bottom:.3rem;box-shadow:var(--shadow);animation:slidein .2s}
.toast.ok{background:var(--accent);color:#000}
.toast.err{background:var(--red);color:#fff}
.toast.nfo{background:var(--blue);color:#000}
@keyframes slidein{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
@media(max-width:900px){.grid2{grid-template-columns:1fr}.rightpanel{position:fixed;right:0;top:48px;bottom:22px;z-index:200}}

/* Calendario de citas (estilo Outlook) */
.cal-wrap{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.cal-period{display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;border-bottom:1px solid var(--border);font-weight:800;font-size:.9rem}
.cal-grid{display:grid;min-width:0}
.cal-grid.day{grid-template-columns:52px minmax(0,1fr)}
.cal-grid.week{grid-template-columns:52px repeat(7,minmax(0,1fr))}
.cal-guthead{position:sticky;top:0;z-index:2;background:var(--surface2);border-bottom:1px solid var(--border)}
.cal-dayhead{position:sticky;top:0;z-index:2;background:var(--surface2);border-bottom:1px solid var(--border);border-left:1px solid var(--border);padding:.4rem .3rem;text-align:center}
.cal-dayhead .cal-dow{font-size:.62rem;font-weight:800;color:var(--dim);text-transform:uppercase;letter-spacing:.04em}
.cal-dayhead .cal-dnum{font-family:var(--mono);font-weight:800;font-size:1.05rem;color:var(--text)}
.cal-dayhead .cal-mon{font-size:.58rem;color:var(--muted);text-transform:uppercase}
.cal-dayhead.today .cal-dnum{color:var(--accent)}
.cal-gut{font-family:var(--mono);font-size:.62rem;color:var(--muted);text-align:right;padding:.2rem .4rem 0 0;border-bottom:1px solid var(--border);height:46px}
.cal-slot{border-bottom:1px solid var(--border);border-left:1px solid var(--border);min-height:46px;padding:2px 3px;display:flex;flex-direction:column;gap:2px}
.cal-slot.today{background:var(--accent-dim)}
.cal-appt{font-size:.68rem;line-height:1.25;border-radius:5px;padding:3px 5px;cursor:pointer;border:1px solid var(--border);background:var(--surface2);overflow:hidden}
.cal-appt:hover{border-color:var(--border2);box-shadow:var(--shadow)}
.cal-appt .cal-appt-time{font-family:var(--mono);font-weight:800;font-size:.6rem;color:var(--dim)}
.cal-appt .cal-appt-name{font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-appt .cal-appt-asesor{font-size:.6rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-appt.realizada{border-left:3px solid var(--accent);background:var(--accent-dim)}
.cal-appt.no-realizada{border-left:3px solid var(--red);background:var(--red-dim)}
.cal-appt.programada{border-left:3px solid var(--blue);background:var(--blue-dim)}
/* Mes */
.cal-month-head{display:grid;grid-template-columns:repeat(7,1fr);position:sticky;top:0;z-index:2;background:var(--surface2);border-bottom:1px solid var(--border)}
.cal-month-head .cal-dow{font-size:.62rem;font-weight:800;color:var(--dim);text-transform:uppercase;letter-spacing:.04em;text-align:center;padding:.4rem}
.cal-month{display:grid;grid-template-columns:repeat(7,1fr)}
.cal-mcell{min-height:96px;border-bottom:1px solid var(--border);border-left:1px solid var(--border);padding:3px;display:flex;flex-direction:column;gap:2px;overflow:hidden}
.cal-mcell.outside{background:var(--bg2);opacity:.55}
.cal-mcell.today .cal-mnum{color:var(--accent);font-weight:800}
.cal-mnum{font-family:var(--mono);font-size:.72rem;color:var(--text2);font-weight:700}
.cal-appt.mini{display:flex;align-items:center;gap:3px;font-size:.6rem;padding:1px 4px}
.cal-appt.mini .cal-appt-time{font-size:.56rem}
/* Detalle y panel */
.cal-appt-detail{margin-bottom:.8rem}
.cal-appt-detail .cal-appt-name{font-size:.95rem;font-weight:800}
.cal-appt-meta{font-size:.76rem;color:var(--dim);margin-top:.2rem}
.cal-status-btns{display:flex;flex-direction:column;gap:.4rem;margin-top:.3rem}
.cal-status-btns .btn{justify-content:flex-start}
.citas-view{grid-template-columns:repeat(3,1fr)}
.cal-nav{display:grid;grid-template-columns:auto 1fr auto;gap:.4rem}
.cal-nav .btn{font-size:.78rem}