/* ============================================================
   Teix — sistema visual
   Azules del logo (periwinkle → marino) · acento ámbar (upsell)
   ============================================================ */
:root{
  --ink:#1b2740;
  --ink-2:#3a4a6b;
  --ink-soft:#6b7793;
  --ink-faint:#9aa4ba;

  --blue-900:#28304a;
  --blue-800:#2b3f63;
  --blue-700:#3a5687;
  --blue-600:#4a6aa0;
  --blue-500:#5b7fb0;
  --blue-400:#6f8fbe;
  --blue-300:#93aed0;
  --blue-200:#c2d2e8;
  --blue-100:#e1e9f5;
  --blue-50:#eef3fb;

  --bg:#f5f8fc;
  --surface:#ffffff;
  --surface-2:#fafbfe;
  --border:#e4e9f2;
  --border-strong:#d4dbe8;

  --green:#1f8a5b;
  --green-bg:#e6f4ec;
  --amber:#cf8326;
  --amber-bg:#fbf0dd;
  --red:#cc4d46;
  --red-bg:#fbe9e8;
  --violet:#8a78c0;

  --shadow-sm:0 1px 2px rgba(27,39,64,.06), 0 1px 1px rgba(27,39,64,.04);
  --shadow:0 2px 8px rgba(27,39,64,.07), 0 1px 2px rgba(27,39,64,.05);
  --shadow-lg:0 18px 48px rgba(27,39,64,.16), 0 4px 12px rgba(27,39,64,.08);
  --shadow-pop:0 12px 32px rgba(27,39,64,.14);

  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:22px;
  --sb:248px;
  --topbar-bg:rgba(255,255,255,.82);
  --font:"Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
}

/* ===== Tema oscuro ===== */
[data-theme="dark"]{
  --ink:#e7ecf6;
  --ink-2:#c0cbe0;
  --ink-soft:#8d99b4;
  --ink-faint:#606c86;

  --blue-50:#1a2740;
  --blue-100:#22314c;
  --blue-200:#2c3e5e;

  --bg:#0e1320;
  --surface:#161d2c;
  --surface-2:#1c2433;
  --border:#29324599;
  --border-strong:#39435b;

  --green-bg:#123524;
  --amber-bg:#352a12;
  --red-bg:#3a1d1b;

  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow:0 2px 10px rgba(0,0,0,.45);
  --shadow-lg:0 18px 48px rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.4);
  --shadow-pop:0 12px 32px rgba(0,0,0,.5);
  --topbar-bg:rgba(18,24,38,.82);
}
[data-theme="dark"] ::selection{background:var(--blue-200);color:var(--ink);}
[data-theme="dark"] img.cal-noinvert{filter:none;}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,textarea,select{font-family:inherit;}
::selection{background:var(--blue-200);color:var(--ink);}
a{color:inherit;text-decoration:none;}

/* scrollbars */
*::-webkit-scrollbar{width:11px;height:11px;}
*::-webkit-scrollbar-thumb{background:#cfd7e6;border-radius:99px;border:3px solid transparent;background-clip:content-box;}
*::-webkit-scrollbar-thumb:hover{background:#b6c1d6;background-clip:content-box;}
*::-webkit-scrollbar-track{background:transparent;}

/* ============ App shell ============ */
.app{display:flex;min-height:100vh;width:100%;}
.main{flex:1;min-width:0;display:flex;flex-direction:column;}
.scroll{flex:1;overflow-y:auto;}
.wrap{max-width:1180px;margin:0 auto;padding:30px 40px 80px;}

/* ============ Sidebar ============ */
.sidebar{
  width:var(--sb);flex-shrink:0;background:var(--surface);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.sb-logo{padding:24px 22px 18px;display:flex;align-items:center;gap:10px;}
.sb-logo img{height:30px;width:auto;}
/* Logo: variante clara (texto oscuro) por defecto; en modo oscuro se muestra la
   variante con texto blanco + símbolo azul (assets/teix-logo-dark.png). */
.teix-logo{display:block;}
.teix-logo-dark{display:none;}
[data-theme="dark"] .teix-logo-light{display:none;}
[data-theme="dark"] .teix-logo-dark{display:block;}
.sb-nav{padding:8px 14px;display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto;min-height:0;}
.sb-section:first-child{padding-top:6px;}
.sb-section{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-faint);padding:18px 12px 7px;}
.nav-item{
  display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:10px;
  color:var(--ink-2);font-size:14px;font-weight:500;position:relative;transition:background .13s,color .13s;
}
.nav-item:hover{background:var(--blue-50);color:var(--ink);}
.nav-item.active{background:var(--blue-700);color:#fff;box-shadow:0 4px 12px rgba(58,86,135,.28);}
.nav-item.active .ic{color:#fff;}
.nav-item .ic{color:var(--blue-500);flex-shrink:0;}
.nav-badge{margin-left:auto;font-size:11px;font-weight:700;background:var(--blue-100);color:var(--blue-700);
  padding:1px 7px;border-radius:99px;min-width:18px;text-align:center;}
.nav-item.active .nav-badge{background:rgba(255,255,255,.22);color:#fff;}
.nav-badge.alert{background:var(--amber-bg);color:var(--amber);}
.sb-foot{margin-top:auto;padding:14px;border-top:1px solid var(--border);}
.sb-user{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;transition:background .13s;}
.sb-user:hover{background:var(--blue-50);}
.sb-user .nm{font-size:13.5px;font-weight:600;line-height:1.2;}
.sb-user .rl{font-size:12px;color:var(--ink-soft);}

/* ============ Topbar ============ */
.topbar{
  height:64px;background:var(--topbar-bg);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);display:flex;align-items:center;gap:16px;
  padding:0 30px;position:sticky;top:0;z-index:30;
}
.search{
  display:flex;align-items:center;gap:9px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:11px;padding:9px 14px;width:340px;transition:border .15s,box-shadow .15s,width .2s;
}
.search:focus-within{border-color:var(--blue-400);box-shadow:0 0 0 3px var(--blue-100);width:380px;background:var(--surface);}
.search input{border:none;outline:none;background:none;font-size:14px;width:100%;color:var(--ink);}
.search input::placeholder{color:var(--ink-faint);}
.topbar-spacer{flex:1;}
.kbd{font-size:11px;color:var(--ink-faint);border:1px solid var(--border-strong);border-radius:5px;padding:1px 5px;background:var(--surface);}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;
  padding:9px 15px;border-radius:10px;transition:.14s;white-space:nowrap;border:1px solid transparent;}
.btn .ic{flex-shrink:0;}
.btn-primary{background:var(--blue-700);color:#fff;box-shadow:0 3px 10px rgba(58,86,135,.25);}
.btn-primary:hover{background:var(--blue-800);box-shadow:0 5px 16px rgba(58,86,135,.32);transform:translateY(-1px);}
.btn-ghost{background:var(--surface);color:var(--ink-2);border-color:var(--border-strong);}
.btn-ghost:hover{background:var(--blue-50);border-color:var(--blue-300);color:var(--ink);}
.btn-soft{background:var(--blue-50);color:var(--blue-700);}
.btn-soft:hover{background:var(--blue-100);}
.btn-amber{background:var(--amber);color:#fff;box-shadow:0 3px 10px rgba(207,131,38,.28);}
.btn-amber:hover{background:#b8721f;transform:translateY(-1px);}
.btn-sm{padding:6px 11px;font-size:13px;border-radius:8px;}
.btn-icon{width:38px;height:38px;padding:0;justify-content:center;border-radius:10px;background:var(--surface);border:1px solid var(--border-strong);color:var(--ink-2);}
.btn-icon:hover{background:var(--blue-50);border-color:var(--blue-300);color:var(--ink);}

/* ============ Cards ============ */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);}
.card-pad{padding:22px 24px;}

/* ============ Page headers ============ */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px;}
.page-title{font-size:27px;font-weight:800;letter-spacing:-.02em;margin:0;line-height:1.2;}
.page-sub{color:var(--ink-soft);font-size:14.5px;margin:5px 0 0;}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue-500);}

/* ============ Pills / chips / badges ============ */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;
  padding:4px 10px;border-radius:99px;line-height:1.2;}
.pill .dot{width:7px;height:7px;border-radius:99px;flex-shrink:0;}
.pill-ok{background:var(--green-bg);color:var(--green);}
.pill-ok .dot{background:var(--green);}
.pill-warn{background:var(--amber-bg);color:var(--amber);}
.pill-warn .dot{background:var(--amber);}
.pill-bad{background:var(--red-bg);color:var(--red);}
.pill-bad .dot{background:var(--red);}
.pill-neutral{background:var(--blue-50);color:var(--blue-700);}
.pill-neutral .dot{background:var(--blue-400);}

/* service chip */
.svc{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;
  padding:5px 11px 5px 8px;border-radius:9px;background:var(--blue-50);color:var(--blue-800);border:1px solid var(--blue-100);}
.svc .sw{width:9px;height:9px;border-radius:3px;flex-shrink:0;}

/* avatar */
.av{border-radius:11px;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;flex-shrink:0;letter-spacing:-.01em;}

/* ============ Tables ============ */
.tbl{width:100%;border-collapse:collapse;}
.tbl thead th{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);
  text-align:left;padding:11px 16px;border-bottom:1px solid var(--border);background:var(--surface-2);position:sticky;top:0;}
.tbl tbody tr{border-bottom:1px solid var(--border);transition:background .12s;cursor:pointer;}
.tbl tbody tr:hover{background:var(--blue-50);}
.tbl tbody tr:last-child{border-bottom:none;}
.tbl td{padding:13px 16px;font-size:14px;vertical-align:middle;}

/* ============ misc ============ */
.divider{height:1px;background:var(--border);border:none;margin:0;}
.muted{color:var(--ink-soft);}
.faint{color:var(--ink-faint);}
.mono{font-variant-numeric:tabular-nums;}
.health-bar{height:6px;border-radius:99px;background:var(--blue-100);overflow:hidden;}
.health-bar > i{display:block;height:100%;border-radius:99px;}

/* segmented */
.seg{display:inline-flex;background:var(--blue-50);border:1px solid var(--border);border-radius:10px;padding:3px;gap:2px;}
.seg button{font-size:13px;font-weight:600;color:var(--ink-soft);padding:6px 13px;border-radius:7px;transition:.13s;white-space:nowrap;}
.seg button.on{background:var(--surface);color:var(--blue-700);box-shadow:var(--shadow-sm);}

/* fade/slide */
@keyframes fadeUp{from{transform:translateY(9px);}to{transform:none;}}
.fadein{animation:fadeUp .32s cubic-bezier(.2,.7,.3,1);}

/* drawer / modal */
.scrim{position:fixed;inset:0;background:rgba(20,28,46,.42);backdrop-filter:blur(2px);z-index:60;animation:scrimIn .2s ease;}
@keyframes scrimIn{from{opacity:0;}to{opacity:1;}}
.drawer{position:fixed;top:0;right:0;height:100vh;width:min(680px,94vw);background:var(--bg);
  z-index:61;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;animation:drawerIn .34s cubic-bezier(.2,.8,.25,1);}
@keyframes drawerIn{from{transform:translateX(40px);opacity:.4;}to{transform:none;opacity:1;}}
.modal{position:fixed;z-index:61;top:50%;left:50%;
  width:min(560px,92vw);background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);transform:translate(-50%,-50%);animation:modalPop .26s cubic-bezier(.2,.8,.25,1);}
@keyframes modalPop{from{transform:translate(-50%,-48%) scale(.94);opacity:0;}to{transform:translate(-50%,-50%) scale(1);opacity:1;}}

/* ===== Editor de texto enriquecido ===== */
.rte-tb{display:flex;align-items:center;gap:3px;flex-wrap:wrap;padding:7px 9px;border:1.5px solid var(--border-strong);border-bottom:none;border-radius:11px 11px 0 0;background:var(--surface-2);}
.rte-tb button{width:32px;height:32px;border-radius:7px;display:grid;place-items:center;color:var(--ink-2);font-weight:700;font-size:14px;transition:.1s;background:transparent;}
.rte-tb button:hover{background:var(--surface);color:var(--blue-700);box-shadow:var(--shadow-sm);}
.rte-tb .sep{width:1px;height:20px;background:var(--border);margin:0 4px;}
.rte-area{min-height:230px;max-height:440px;overflow-y:auto;border:1.5px solid var(--border-strong);border-radius:0 0 11px 11px;padding:14px 16px;font-size:14px;line-height:1.6;color:var(--ink);outline:none;background:var(--surface);}
.rte-area:focus{border-color:var(--blue-400);box-shadow:0 0 0 3px var(--blue-100);}
.rte-area img{max-width:100%;border-radius:8px;margin:6px 0;}
.rte-area a{color:var(--blue-600);}
.rte-area p{margin:0 0 8px;}
.rte-area:empty:before{content:attr(data-ph);color:var(--ink-faint);}
.tag-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:99px;font-family:var(--mono,monospace);font-size:12px;font-weight:600;background:var(--blue-50);color:var(--blue-700);border:1px solid var(--blue-100,#cdddf2);cursor:pointer;transition:.1s;}
.tag-chip:hover{background:var(--blue-100,#cdddf2);}

/* ===== Custom dropdown ===== */
.dd{position:relative;}
.dd-btn{width:100%;display:flex;align-items:center;gap:10px;border:1.5px solid var(--border-strong);border-radius:11px;padding:11px 13px;background:var(--surface);cursor:pointer;font-family:inherit;font-size:14px;font-weight:600;color:var(--ink);transition:.12s;text-align:left;}
.dd-btn:hover{border-color:var(--blue-400);}
.dd-btn.open{border-color:var(--blue-400);box-shadow:0 0 0 3px var(--blue-100);}
.dd-pop{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:50;background:var(--surface);border:1px solid var(--border);border-radius:13px;box-shadow:var(--shadow-lg);max-height:340px;overflow-y:auto;padding:6px;animation:fadeUp .14s;}
.dd-grp{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint);padding:9px 11px 5px;}
.dd-item{width:100%;display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:9px;text-align:left;transition:.1s;background:transparent;}
.dd-item:hover{background:var(--blue-50);}
.dd-item.sel{background:var(--blue-50);}

/* ===== Filtros (barra) ===== */
.filt-bar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:16px;}
.chipf{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:99px;font-size:13px;font-weight:600;border:1.5px solid var(--border);background:var(--surface);color:var(--ink-2);cursor:pointer;transition:.12s;}
.chipf:hover{border-color:var(--blue-400);}
.chipf.on{border-color:var(--blue-500);background:var(--blue-50);color:var(--blue-700);}

/* ===== Kanban drag&drop ===== */
.kan-card{cursor:grab;}
.kan-card.dragging{opacity:.45;}
.kan-col{transition:background .12s,box-shadow .12s;}
.kan-col.over{background:var(--blue-50)!important;box-shadow:inset 0 0 0 2px var(--blue-400);}

/* drawer animation entra desde la derecha (ya existe drawerIn) */
.drawer-h{display:flex;align-items:center;gap:12px;padding:'18px 22px';}

/* ===== Toasts ===== */
.toast-host{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:9px;align-items:center;pointer-events:none;}
.toast{pointer-events:auto;display:flex;align-items:center;gap:11px;background:#1e2738;color:#fff;border-radius:13px;padding:12px 14px 12px 16px;box-shadow:0 12px 32px rgba(20,28,46,.35);min-width:280px;max-width:440px;animation:toastIn .26s cubic-bezier(.2,.8,.25,1);}
.toast.error{background:#7a2330;}
.toast.success{background:#1c5a3e;}
@keyframes toastIn{from{transform:translateY(14px);opacity:0;}to{transform:none;opacity:1;}}
.toast-undo{background:rgba(255,255,255,.16);color:#fff;font-weight:700;font-size:13px;border-radius:8px;padding:6px 12px;transition:.1s;}
.toast-undo:hover{background:rgba(255,255,255,.28);}
.toast-x{color:rgba(255,255,255,.6);width:24px;height:24px;display:grid;place-items:center;border-radius:6px;}
.toast-x:hover{background:rgba(255,255,255,.14);color:#fff;}

/* ===== Notificaciones ===== */
.notif-pop{position:absolute;top:calc(100% + 10px);right:0;z-index:50;width:420px;max-width:calc(100vw - 32px);background:var(--surface);border:1px solid var(--border);border-radius:15px;box-shadow:var(--shadow-lg);overflow:hidden;animation:fadeUp .16s;}
/* texto de notificacion legible: hasta 2 lineas con corte limpio (nada de 1 linea con puntos suspensivos) */
.notif-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35;}
.notif-row{display:flex;align-items:stretch;border-top:1px solid var(--border);}
.notif-row:first-child{border-top:none;}
.notif-item{display:flex;align-items:flex-start;gap:12px;flex:1;min-width:0;padding:12px 6px 12px 16px;transition:.1s;background:transparent;}
.notif-item:hover{background:var(--blue-50);}
.notif-dismiss{flex-shrink:0;width:30px;min-height:30px;margin:10px 8px auto 0;display:grid;place-items:center;border-radius:7px;color:var(--ink-faint);transition:.1s;}
.notif-dismiss:hover{background:rgba(220,38,38,.1);color:var(--red);}

/* ===== Command palette ⌘K ===== */
.cmdk-scrim{position:fixed;inset:0;background:rgba(20,28,46,.4);backdrop-filter:blur(2px);z-index:95;animation:scrimIn .16s;}
.cmdk{position:fixed;top:14vh;left:50%;transform:translateX(-50%);z-index:96;width:min(620px,94vw);background:var(--surface);border:1px solid var(--border);border-radius:17px;box-shadow:var(--shadow-lg);overflow:hidden;animation:cmdkIn .2s cubic-bezier(.2,.8,.25,1);}
@keyframes cmdkIn{from{transform:translate(-50%,-10px);opacity:0;}to{transform:translate(-50%,0);opacity:1;}}
.cmdk-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:10px;transition:.08s;background:transparent;}
.cmdk-item.sel{background:var(--blue-50);}

/* ===== Calendario (vista mes) ===== */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.cal-dow{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint);text-align:center;padding-bottom:4px;}
.cal-cell{min-height:78px;border:1px solid var(--border);border-radius:10px;padding:5px 6px;background:var(--surface);cursor:pointer;transition:.1s;overflow:hidden;}
.cal-cell:hover{border-color:var(--blue-400);background:var(--blue-50);}
.cal-cell.empty{background:var(--surface-2);border-color:transparent;cursor:default;}
.cal-cell.empty:hover{background:var(--surface-2);}
.cal-cell.today{border-color:var(--blue-500);box-shadow:inset 0 0 0 1px var(--blue-500);}
.cal-num{font-size:12.5px;font-weight:700;color:var(--ink-2);}
.cal-cell.today .cal-num{color:var(--blue-700);}
.cal-ev{font-size:10.5px;font-weight:600;padding:1px 5px;border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ===== Acciones rápidas (agenda) ===== */
.qa-btn{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);transition:.12s;}
.qa-btn:hover{border-color:var(--blue-400);background:var(--blue-50);color:var(--blue-700);transform:translateY(-1px);}
.qa-btn.wa:hover{border-color:#25d366;background:#25d36618;color:#1da851;}

/* tooltip-ish reason callout */
.reason{font-size:13px;line-height:1.5;color:var(--ink-2);}

/* empty / focus rings */
.tap{cursor:pointer;}
.click-row:active{transform:scale(.997);}

/* ============ Responsive grids ============ */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px;}
.dash-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:start;}
.detail-grid{display:grid;grid-template-columns:1fr 330px;gap:18px;align-items:start;}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.task-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start;}
.tpl-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}

@media (max-width:1180px){
  .stat-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:1080px){
  .detail-grid{grid-template-columns:1fr;}
  .dash-grid{grid-template-columns:1fr;}
  .svc-grid{grid-template-columns:1fr;}
  .task-grid{grid-template-columns:1fr;}
}
@media (max-width:720px){
  .wrap{padding:22px 18px 60px;}
  .topbar{padding:0 16px;}
  .search{width:auto;flex:1;}
  .hero-actions{flex-direction:row!important;width:100%!important;flex-wrap:wrap;}
  .hero-actions .btn{flex:1;}
}

/* client detail hero */
.hero{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;}
.hero-id{display:flex;gap:18px;align-items:flex-start;flex:1;min-width:340px;}
.hero-actions{display:flex;flex-direction:column;gap:9px;width:186px;flex-shrink:0;}

/* ============ Grid / hoja editable ============ */
.grid-wrap{border:1px solid var(--border);border-radius:var(--r-lg);overflow:auto;background:var(--surface);box-shadow:var(--shadow-sm);}
.grid-tbl{width:100%;border-collapse:separate;border-spacing:0;min-width:1120px;}
.grid-tbl thead th{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);
  text-align:left;padding:10px 10px;border-bottom:1px solid var(--border-strong);background:var(--surface-2);position:sticky;top:0;z-index:5;white-space:nowrap;}
.grid-tbl tbody td{padding:3px 4px;border-bottom:1px solid var(--border);vertical-align:middle;}
.grid-tbl tbody tr:hover{background:var(--blue-50);}
.grid-tbl tbody tr.sel{background:var(--blue-100)!important;}
.gin{width:100%;border:1px solid transparent;background:transparent;padding:6px 8px;border-radius:7px;font-family:inherit;font-size:13px;color:var(--ink);transition:.1s;}
.gin:hover{border-color:var(--border-strong);background:var(--surface);}
.gin:focus{border-color:var(--blue-400);background:var(--surface);box-shadow:0 0 0 3px var(--blue-100);outline:none;}
select.gin{cursor:pointer;appearance:none;padding-right:8px;}
.gin.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;}
.gcheck{width:16px;height:16px;accent-color:#3a5687;cursor:pointer;}
.bulkbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--blue-700);color:#fff;border-radius:12px;padding:10px 16px;box-shadow:var(--shadow);margin-bottom:14px;animation:fadeUp .2s;}
.bulkbar select{appearance:none;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.12);color:#fff;font-family:inherit;font-size:13px;font-weight:600;padding:6px 12px;border-radius:8px;cursor:pointer;}
.bulkbar select option{color:#1b2740;}

/* ============ Asistente flotante ============ */
.assist-fab{position:fixed;right:24px;bottom:24px;z-index:80;width:58px;height:58px;border-radius:50%;
  background:var(--blue-700);color:#fff;display:grid;place-items:center;box-shadow:0 10px 28px rgba(40,48,74,.4);transition:.18s;}
.assist-fab::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--blue-500);animation:fabPulse 2.6s cubic-bezier(.3,0,.4,1) infinite;}
@keyframes fabPulse{0%{transform:scale(1);opacity:.6;}70%,100%{transform:scale(1.7);opacity:0;}}
.assist-fab:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 14px 34px rgba(40,48,74,.5);}
@media (prefers-reduced-motion: reduce){ .assist-fab::before{animation:none;} }
.assist-panel{position:fixed;right:24px;bottom:24px;z-index:81;width:min(400px,calc(100vw - 32px));height:min(620px,calc(100vh - 48px));
  background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:assistIn .26s cubic-bezier(.2,.8,.25,1);}
@keyframes assistIn{from{transform:translateY(20px) scale(.96);opacity:0;}to{transform:none;opacity:1;}}
.assist-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--surface-2);}
.bub{max-width:84%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.45;white-space:pre-wrap;}
.bub.me{align-self:flex-end;background:var(--blue-700);color:#fff;border-bottom-right-radius:5px;}
.bub.ai{align-self:flex-start;background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:5px;}
.bub.act{align-self:flex-start;background:var(--green-bg);border:1px solid #bfe3cd;color:var(--green);font-weight:600;font-size:12.5px;display:flex;align-items:center;gap:7px;}

/* ============ Popover (selector de columnas) ============ */
.pop{position:absolute;top:calc(100% + 8px);z-index:40;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-lg);padding:8px;display:flex;flex-direction:column;gap:1px;}
.pop-h{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint);padding:8px 10px 6px;}
.pop-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;font-size:13.5px;font-weight:500;color:var(--ink);background:none;text-align:left;transition:.1s;}
.pop-item:hover:not(:disabled){background:var(--blue-50);}
.pop-item:disabled{opacity:.6;cursor:default;}
.chk{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--border-strong);display:grid;place-items:center;color:#fff;flex-shrink:0;transition:.1s;}
.chk.on{background:var(--blue-600);border-color:var(--blue-600);}

/* ============ Filtros (labels) ============ */
.fl{display:flex;flex-direction:column;gap:6px;}
.fl>span{font-size:11.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);}
.fl select,.fl input{border:1.5px solid var(--border-strong);border-radius:9px;padding:8px 10px;font-family:inherit;font-size:13.5px;color:var(--ink);background:var(--surface);outline:none;cursor:pointer;}
.fl select:focus,.fl input:focus{border-color:var(--blue-400);box-shadow:0 0 0 3px var(--blue-100);}
.fl input{cursor:text;}

/* ============ Ajustes ============ */
.set-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow:hidden;}
.set-row{display:flex;align-items:center;gap:16px;padding:16px 20px;border-top:1px solid var(--border);}
.set-row:first-child{border-top:none;}
.set-row .lbl{flex:1;min-width:0;}
.set-row .lbl b{font-size:14.5px;font-weight:700;display:block;}
.set-row .lbl span{font-size:13px;color:var(--ink-soft);display:block;margin-top:2px;}
.toggle{width:46px;height:26px;border-radius:99px;position:relative;transition:.16s;flex-shrink:0;background:var(--border-strong);}
.toggle.on{background:var(--green);}
.toggle i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:99px;background:var(--surface);transition:.16s;box-shadow:0 1px 3px rgba(0,0,0,.25);}
.toggle.on i{left:23px;}
.navchip{display:flex;align-items:center;gap:9px;padding:9px 13px;border-radius:10px;border:1.5px solid var(--border);font-size:13.5px;font-weight:600;transition:.12s;background:var(--surface);}
.navchip.on{border-color:var(--blue-400);background:var(--blue-50);color:var(--blue-700);}
.navchip.off{opacity:.5;}
.navchip:disabled{opacity:.4;cursor:not-allowed;}

/* spinner */
.spin{width:15px;height:15px;border-radius:99px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;display:inline-block;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
/* barra de carga global (peticiones en vuelo) */
.teix-loadbar{position:fixed;top:0;left:0;height:3px;width:100%;z-index:9999;background:linear-gradient(90deg,transparent,var(--blue-500) 45%,var(--blue-700) 55%,transparent);background-size:40% 100%;background-repeat:no-repeat;animation:teixload 1.05s infinite ease-in-out;}
@keyframes teixload{0%{background-position:-45% 0;}100%{background-position:145% 0;}}

/* ============ WidgetBoard (grid + drag&drop + resize + masonry) ============ */
.wb{display:flex;flex-direction:column;gap:16px;}
.wb-grid{display:grid;grid-template-columns:repeat(var(--wb-cols,2),minmax(0,1fr));gap:20px;align-items:start;}
.wb-grid.masonry{grid-auto-rows:8px;grid-auto-flow:dense;align-items:stretch;}
.wb-item{position:relative;border-radius:var(--r-lg);min-width:0;container-type:inline-size;}
.wb-item.wb-dragging{opacity:.35;}
.wb-item.wb-over{outline:2px dashed var(--blue-400);outline-offset:4px;}
.wb-item.wb-resizing-item{outline:2px solid var(--blue-400);outline-offset:4px;}
.wb-inner{min-width:0;}
/* asa de mover: flotante arriba-centro, visible al hover */
.wb-grip{position:absolute;top:-10px;left:50%;transform:translateX(-50%);z-index:6;width:44px;height:22px;display:grid;place-items:center;border-radius:99px;
  color:var(--ink-faint);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm);cursor:grab;opacity:0;transition:opacity .13s,color .13s;touch-action:none;}
.wb-item:hover .wb-grip{opacity:1;}
.wb-grip:hover{color:var(--blue-700);}
.wb-grip:active{cursor:grabbing;}
@media (hover:none){ .wb-grip{opacity:.45;} }
/* asa de resize: borde derecho */
.wb-resize{position:absolute;top:0;right:-8px;bottom:0;width:16px;z-index:5;display:flex;align-items:center;justify-content:center;cursor:ew-resize;opacity:0;transition:opacity .13s;touch-action:none;}
.wb-item:hover .wb-resize{opacity:1;}
.wb-resize i{display:block;width:4px;height:38px;border-radius:99px;background:var(--border-strong);transition:.12s;}
.wb-resize:hover i{background:var(--blue-400);}
body.wb-resizing,body.wb-resizing *{cursor:ew-resize!important;user-select:none!important;-webkit-user-select:none!important;}
/* pie del tablero */
.wb-footer{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:8px 12px;}
.wb-hint{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--ink-faint);}
.wb-collabel{font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);}
.wb-colseg{display:inline-flex;gap:2px;background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:2px;}
.wb-colseg button{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--ink-soft);padding:5px 10px;border-radius:7px;transition:.12s;}
.wb-colseg button:hover{background:var(--blue-50);color:var(--blue-700);}
.wb-colseg button.on{background:var(--blue-700);color:#fff;}
.wb-toggle{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink-soft);background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:5px 12px 5px 6px;transition:.12s;}
.wb-toggle .wb-knob{width:26px;height:15px;border-radius:99px;background:var(--border-strong);position:relative;transition:.15s;flex-shrink:0;}
.wb-toggle .wb-knob::after{content:'';position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:99px;background:#fff;transition:.15s;}
.wb-toggle.on{color:var(--blue-700);border-color:#b9cfeb;}
.wb-toggle.on .wb-knob{background:var(--blue-600);}
.wb-toggle.on .wb-knob::after{left:13px;}
/* móvil: 1 columna, sin masonry ni controles de edición (el asa queda para reordenar) */
@media (max-width:900px){
  .wb-grid{grid-template-columns:1fr!important;grid-auto-rows:auto!important;grid-auto-flow:row!important;}
  .wb-item{grid-column:auto!important;grid-row:auto!important;}
  .wb-footer,.wb-resize{display:none!important;}
}

/* ============ Diseño Web ============ */
.design-grid{display:grid;grid-template-columns:370px 1fr;gap:18px;align-items:start;}
@media (max-width:1080px){ .design-grid{grid-template-columns:1fr;} }
.color-pick{position:relative;width:32px;height:32px;border-radius:9px;border:2px dashed var(--border-strong);display:grid;place-items:center;cursor:pointer;color:var(--ink-soft);overflow:hidden;}
.color-pick span{position:absolute;inset:0;opacity:.18;}
.color-pick input{position:absolute;inset:0;opacity:0;cursor:pointer;}

/* ============ Composer (sección) ============ */
.composer-grid{display:grid;grid-template-columns:1fr 400px;gap:18px;align-items:start;}
@media (max-width:1080px){ .composer-grid{grid-template-columns:1fr;} }
.cs-pop{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;background:var(--surface);border:1px solid var(--border);border-radius:13px;box-shadow:var(--shadow-lg);max-height:300px;overflow-y:auto;padding:6px;}
.cs-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;width:100%;text-align:left;transition:.1s;}
.cs-item:hover{background:var(--blue-50);}
.tpl-select{width:100%;appearance:none;border:1.5px solid var(--border-strong);border-radius:11px;padding:12px 38px 12px 14px;font-family:inherit;font-size:14px;font-weight:600;color:var(--ink);background:var(--surface);cursor:pointer;outline:none;}
.tpl-select:focus{border-color:var(--blue-400);box-shadow:0 0 0 3px var(--blue-100);}

/* ============ Recursos ============ */
.res-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media (max-width:840px){ .res-grid{grid-template-columns:1fr;} }
.res-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px;box-shadow:var(--shadow-sm);transition:.14s;}
.res-card.on{border-color:var(--blue-200,#cdddf2);box-shadow:0 3px 14px rgba(58,86,135,.08);}
.res-del{position:absolute;top:10px;right:10px;width:26px;height:26px;border-radius:7px;display:grid;place-items:center;color:var(--ink-faint);background:transparent;}
.res-del:hover{background:var(--red-bg);color:var(--red);}
.flbl{font-size:12px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;}

/* ============ SEO ============ */
.seo-tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:20px;}
.seo-tab{display:inline-flex;align-items:center;gap:7px;padding:11px 16px;font-size:14px;font-weight:700;color:var(--ink-soft);border-bottom:2px solid transparent;margin-bottom:-1px;transition:.12s;background:none;}
.seo-tab:hover{color:var(--ink);}
.seo-tab.on{color:var(--blue-700);border-bottom-color:var(--blue-600);}
.seo-subtabs{display:flex;gap:8px;margin:4px 0 18px;}
.seo-subtab{padding:8px 16px;border-radius:99px;font-size:13.5px;font-weight:700;color:var(--ink-soft);border:1.5px solid var(--border);background:var(--surface);transition:.12s;}
.seo-subtab.on{color:var(--blue-700);background:var(--blue-50);border-color:var(--blue-400);}
.seo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;}
.seo-card{text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--shadow-sm);transition:.14s;cursor:pointer;}
.seo-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--blue-200,#cdddf2);}
.seo-metric-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;}
.seo-2col{display:grid;grid-template-columns:1fr 1.1fr;gap:18px;align-items:start;}
@media (max-width:980px){ .seo-2col{grid-template-columns:1fr;} }
.seo-kw-tbl{width:100%;border-collapse:collapse;font-size:13px;}
.seo-kw-tbl th{text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-faint);padding:8px 12px;border-bottom:1px solid var(--border-strong);white-space:nowrap;}
.seo-kw-tbl td{padding:8px 12px;border-bottom:1px solid var(--border);vertical-align:top;}
.seo-kw-tbl tbody tr:hover{background:var(--blue-50);}
.seo-period{width:100%;text-align:left;padding:11px 13px;border-radius:11px;border:1.5px solid var(--border);background:var(--surface);transition:.12s;}
.seo-period:hover{border-color:var(--blue-400);}
.seo-period.on{border-color:var(--blue-500);background:var(--blue-50);}
.seo-stepper{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap;}
.seo-step{display:flex;align-items:center;gap:9px;padding:9px 15px;border-radius:99px;background:var(--surface-2);border:1px solid var(--border);opacity:.6;}
.seo-step.on{opacity:1;}
.seo-step.cur{background:var(--blue-50);border-color:var(--blue-400);}
.seo-step-n{width:22px;height:22px;border-radius:99px;background:var(--blue-700);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800;}
.seo-step:not(.on) .seo-step-n{background:var(--border-strong);}
.seo-step-l{font-size:13px;font-weight:700;}
.seo-pick{display:flex;align-items:center;gap:11px;padding:10px 13px;border-radius:11px;border:1.5px solid var(--border);background:var(--surface);transition:.12s;}
.seo-pick:hover{border-color:var(--blue-400);}
.seo-pick.on{border-color:var(--blue-500);background:var(--blue-50);}
.seo-check{display:flex;align-items:center;gap:10px;font-size:13.5px;padding:7px 10px;border-radius:9px;cursor:pointer;}
.seo-check:hover{background:var(--surface-2);}
.seo-check input{width:16px;height:16px;accent-color:var(--blue-600);}
.seo-drop{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:34px;border:2px dashed var(--border-strong);border-radius:14px;background:var(--surface-2);transition:.12s;cursor:pointer;}
.seo-drop:hover{border-color:var(--blue-400);background:var(--blue-50);}
.seo-edit-area{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:10px 12px;font-family:inherit;font-size:13.5px;line-height:1.55;resize:vertical;outline:none;background:var(--surface);color:var(--ink);}
.seo-edit-area:focus{border-color:var(--blue-400);box-shadow:0 0 0 3px var(--blue-100);}
.seo-indic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;}
.seo-indic{border:1px solid var(--border);border-radius:11px;padding:12px;text-align:center;display:flex;flex-direction:column;gap:3px;}
.seo-indic-n{font-size:24px;font-weight:800;text-align:center;border:none;background:transparent;width:100%;font-family:inherit;outline:none;}
.seo-indic-n:focus{background:var(--blue-50);border-radius:6px;}
.seo-rep-list{margin:0;padding-left:18px;font-size:13.5px;line-height:1.5;display:flex;flex-direction:column;gap:4px;}