:root{
  /* ---- Marble / neutral base (área principal) ---- */
  --bg:#f8f8f6;
  --panel:#ffffff;
  --border:#e7e4de;
  --border-soft:#eeece7;
  --text:#161923;
  --text-soft:#3a3f4d;
  --muted:#7a7f8c;

  /* ---- Navy / negro azulado (marca Mercumex - anillo del logo) ---- */
  --primary:#10182b;
  --primary-dark:#0a0f1c;
  --primary-soft:#e9ebf3;

  /* ---- Verde metálico (marca Mercumex - swoosh del logo) ---- */
  --green:#1b5e20;
  --green-mid:#4c8c3b;
  --green-soft:#e8f3e1;
  --green-bright:#aeea00;

  /* ---- Acento cálido / dorado (detalles de iluminación) ---- */
  --gold:#c9a227;
  --gold-soft:#f7efd9;

  --amber:#b8790f;
  --amber-soft:#fdf1dc;
  --red:#d1414a;
  --red-soft:#fbe9ea;
  --sidebar-bg:#0a0f1c;
  --sidebar-bg-2:#10182b;
  --sidebar-text:#a7abbd;
  --sidebar-text-active:#ffffff;
  --teal:#0d9488;
  --teal-soft:#e2f6f4;
  --imp-alta-bg:#fbe4e4;
  --imp-alta-text:#a94444;
  --imp-media-bg:#fdf1dc;
  --imp-media-text:#b8790f;
  --imp-normal-bg:#eef1f6;
  --imp-normal-text:#5b6270;
  --violet:#7c3aed;
  --violet-soft:#f1e9fd;
  --radius:14px;
  --radius-sm:9px;
  --radius-pill:999px;
  /* Sombras más suaves (menos "caja flotante", más plano y aireado) */
  --shadow-sm:0 1px 2px rgba(10,15,28,.035);
  --shadow-md:0 2px 10px rgba(10,15,28,.05), 0 1px 2px rgba(10,15,28,.04);
  --shadow-lg:0 16px 40px rgba(10,15,28,.13), 0 3px 10px rgba(10,15,28,.06);
  --font-display:"Manrope","Inter",-apple-system,BlinkMacSystemFont,sans-serif;
  --font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family:var(--font-body);
  background:
    linear-gradient(rgba(248,248,246,.94),rgba(248,248,246,.94)),
    url("data:image/jpeg;base64,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") center 30% / cover no-repeat fixed;
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
@media (max-width:880px){
  body{background-attachment:scroll;}
}
#layout{display:flex;min-height:100vh;}

/* ================= Sidebar ================= */
#sidebar{
  width:248px;
  background:linear-gradient(180deg,var(--sidebar-bg-2) 0%,var(--sidebar-bg) 100%);
  color:var(--sidebar-text);
  display:flex;
  flex-direction:column;
  flex-shrink:0;
  padding:22px 16px;
  position:sticky;
  top:0;
  height:100vh;
}
.brand{display:flex;align-items:center;gap:11px;padding:4px 8px 22px;margin-bottom:4px;position:relative;}
.brand::after{
  content:"";position:absolute;left:8px;right:8px;bottom:0;height:1px;
  background:linear-gradient(90deg,var(--gold) 0%,rgba(201,162,39,.15) 55%,transparent 100%);
  opacity:.55;
}
.brand-mark{
  width:40px;height:40px;flex-shrink:0;object-fit:contain;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.35));
}
.brand-text{display:flex;flex-direction:column;line-height:1.25;}
.brand-name{font-family:var(--font-display);font-weight:800;color:#fff;font-size:15px;letter-spacing:-.01em;}
.brand-sub{font-size:10.5px;color:#7f849b;letter-spacing:.04em;text-transform:uppercase;font-weight:600;}

#nav{display:flex;flex-direction:column;gap:2px;flex:1;margin-top:6px;}
#nav a{
  display:flex;align-items:center;gap:11px;
  color:var(--sidebar-text);
  text-decoration:none;
  padding:10px 12px;
  border-radius:10px;
  font-size:13.5px;
  font-weight:500;
  position:relative;
  transition:background .18s ease, color .18s ease;
}
#nav a svg{
  width:17px;height:17px;flex-shrink:0;
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
  opacity:.85;
}
#nav a:hover{background:rgba(255,255,255,.05);color:#e4e6f0;}
#nav a.active{background:linear-gradient(90deg,rgba(174,234,0,.16) 0%,rgba(174,234,0,.05) 100%);color:var(--sidebar-text-active);}
#nav a.active svg{opacity:1;stroke:var(--green-bright);}
#nav a.active::before{
  content:"";position:absolute;left:-16px;top:50%;transform:translateY(-50%);
  width:3px;height:18px;border-radius:0 3px 3px 0;background:var(--green-bright);
  box-shadow:0 0 8px rgba(174,234,0,.6);
}

.sidebar-footer{
  display:flex;flex-direction:column;gap:6px;
  font-size:11.5px;color:#767b90;padding:12px 10px 4px;
  border-top:1px solid rgba(201,162,39,.14);margin-top:10px;
}
.save-line{display:flex;align-items:center;gap:7px;}
.folder-line a{opacity:.9;}
.folder-line a:hover{opacity:1;}
.save-dot{width:6px;height:6px;border-radius:50%;background:#3ecf8e;box-shadow:0 0 0 3px rgba(62,207,142,.18);flex-shrink:0;}
code{background:#f0f1f6;padding:2px 6px;border-radius:5px;font-size:11.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;}

/* ================= Main ================= */
/* Antes el contenido quedaba encerrado en 1180px con un montón de espacio
   vacío a la derecha en pantallas anchas — daba la sensación de que la
   página estaba "encogida". Ahora #app usa todo el ancho disponible junto
   al sidebar (gracias a flex:1 en #layout), con un tope generoso solo para
   que las tablas no se vean absurdamente largas en monitores ultra anchos. */
/* min-width:0 es el arreglo clásico del "flexbox min-width:auto bug": sin
   esto, un hijo con overflow-x:auto (como el tablero Kanban) no logra
   contener su propio scroll, y en vez de eso empuja a #app —y por lo tanto
   a toda la página— a crecer más allá del viewport. Resultado: aparecía una
   segunda barra de desplazamiento horizontal abajo del todo, además de la
   propia del Kanban. Con min-width:0 el Kanban vuelve a ser el único que
   se desplaza. */
#app{flex:1;min-width:0;padding:36px 44px 48px;max-width:1900px;width:100%;animation:fadeUp .35s ease;}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(6px);}
  to{opacity:1;transform:translateY(0);}
}
h1{
  font-family:var(--font-display);font-size:26px;font-weight:800;margin:0 0 4px;
  letter-spacing:-.02em;color:var(--text);
}
h2{font-family:var(--font-display);font-size:15.5px;font-weight:700;margin:0 0 14px;letter-spacing:-.01em;}
.subtitle{color:var(--muted);font-size:13.5px;margin:0 0 20px;}
/* Línea fina bajo el título de cada sección, al estilo de un panel de
   reportes: separa el encabezado del contenido sin necesitar una caja. Solo
   aplica cuando el subtítulo va justo después del h1 (la mayoría de las
   vistas de lista), así que no afecta a las fichas de detalle, donde el h1
   va acompañado de una insignia de estado en vez de un subtítulo. */
h1 + .subtitle{padding-bottom:20px;border-bottom:1px solid var(--border-soft);}

.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:10px;flex-wrap:wrap;}
.search-input{
  padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13px;width:270px;
  background:#fff;transition:border-color .15s, box-shadow .15s;font-family:inherit;
}
.search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft);}

/* ================= Buttons ================= */
button, .btn{
  border:none;background:linear-gradient(135deg,var(--primary) 0%,var(--green) 100%);color:#fff;
  padding:10px 16px;border-radius:var(--radius-sm);
  font-size:13px;cursor:pointer;font-weight:600;font-family:inherit;
  box-shadow:0 1px 3px rgba(10,15,28,.25);
  transition:background .2s ease, transform .1s ease, box-shadow .2s ease;
}
button:hover, .btn:hover{
  background:linear-gradient(135deg,var(--primary-dark) 0%,#12401a 100%);
  box-shadow:0 4px 14px rgba(10,15,28,.32), 0 0 0 1px rgba(174,234,0,.18);
  transform:translateY(-1px);
}
button:active{transform:translateY(0);}
button.secondary{background:#fff;color:var(--text-soft);border:1px solid var(--border);box-shadow:var(--shadow-sm);}
button.secondary:hover{background:#f7f8fb;box-shadow:var(--shadow-sm);transform:none;}
button.danger{background:#fff;color:var(--red);border:1px solid var(--border);box-shadow:var(--shadow-sm);}
button.danger:hover{background:var(--red-soft);border-color:#f3c3c6;transform:none;box-shadow:var(--shadow-sm);}
button.small{padding:7px 11px;font-size:12px;}

/* ================= Cards / grid ================= */
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:28px;}
.grid-cards-5{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.metric-card{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:18px 20px 20px;
  box-shadow:var(--shadow-sm);transition:transform .18s ease, box-shadow .18s ease;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
/* Franja de color abajo, al estilo de las gráficas del video de referencia:
   cada métrica lleva la firma de color de su categoría (verde=activos,
   ámbar=negociación, rojo=atrasados...) en vez de un ícono en caja de color. */
.metric-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--primary);opacity:.3;}
.metric-card:has(.icon-green)::after{background:var(--green);opacity:.55;}
.metric-card:has(.icon-amber)::after{background:var(--amber);opacity:.55;}
.metric-card:has(.icon-teal)::after{background:var(--teal);opacity:.55;}
.metric-card:has(.icon-violet)::after{background:var(--violet);opacity:.55;}
.metric-card:has(.icon-red)::after{background:var(--red);opacity:.7;}
.metric-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.metric-card .val{font-family:var(--font-display);font-size:32px;font-weight:800;letter-spacing:-.03em;order:1;font-variant-numeric:tabular-nums;}
.metric-card .label{font-size:11px;color:var(--muted);margin:0 0 8px;font-weight:700;text-transform:uppercase;letter-spacing:.045em;order:0;padding-right:30px;}
.metric-card-link{cursor:pointer;}
.metric-card-link:hover{border-color:var(--primary);}
.metric-card-link:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.metric-card-link:active{transform:translateY(0);box-shadow:var(--shadow-md);}

.filter-chip{
  display:inline-flex;align-items:center;gap:8px;background:var(--primary-soft);color:var(--primary);
  font-size:12.5px;font-weight:700;padding:6px 8px 6px 14px;border-radius:20px;margin-bottom:14px;
}
.filter-chip-x{
  background:rgba(255,255,255,.6);border:none;border-radius:50%;width:20px;height:20px;line-height:1;
  cursor:pointer;color:inherit;font-size:14px;font-weight:800;
}
.filter-chip-x:hover{background:#fff;}
.row-link-inline{cursor:pointer;}
.row-link-inline:hover{text-decoration:underline;}

.panel{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);
  padding:22px 24px;box-shadow:var(--shadow-sm);margin-bottom:22px;
}

/* ================= Table / list ================= */
table{width:100%;border-collapse:collapse;font-size:13px;}
th{
  text-align:left;color:var(--muted);font-weight:700;padding:10px 12px;border-bottom:1px solid var(--border-soft);
  font-size:11px;text-transform:uppercase;letter-spacing:.05em;
}
td{padding:13px 12px;border-bottom:1px solid var(--border-soft);color:var(--text-soft);}
tr:last-child td{border-bottom:none;}
tr.row-link{cursor:pointer;transition:background .12s;}
tr.row-link:hover{background:#f8f9fc;}
tr.row-link td:first-child{color:var(--text);}

.empty-state{text-align:center;color:var(--muted);padding:48px 10px;font-size:13.5px;}
.empty-icon{width:38px;height:38px;margin:0 auto 12px;color:#c7c9d4;}
.empty-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.4;}
.empty-state a.plain{display:inline-block;margin-top:8px;}

/* Entity rows (avatar + name) */
.row-entity{display:flex;align-items:center;gap:11px;}
.avatar{
  width:32px;height:32px;border-radius:9px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--primary-soft);color:var(--primary);
  font-family:var(--font-display);font-weight:800;font-size:11.5px;letter-spacing:.01em;
}
.avatar-alt{background:var(--green-soft);color:var(--green);}

/* Metric card icon: acento pequeño en la esquina, sin caja de color pesada
   (el color principal de cada métrica ahora vive en la franja de abajo). */
.metric-icon{
  width:22px;height:22px;margin-bottom:0;
  display:flex;align-items:center;justify-content:center;
  background:transparent;color:var(--muted);
  position:absolute;top:18px;right:18px;order:2;
}
.metric-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.metric-icon.icon-green{color:var(--green);}
.metric-icon.icon-amber{color:var(--amber);}
.metric-icon.icon-teal{color:var(--teal);}
.metric-icon.icon-red{color:var(--red);}
.metric-icon.icon-violet{color:var(--violet);}
.avatar-venta{background:var(--violet-soft);color:var(--violet);}
.metric-card-alert{border-color:#f3caca;}

/* ================= Badges ================= */
.badge{display:inline-block;padding:4px 11px;border-radius:20px;font-size:10.5px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;}
.badge-nuevo{background:var(--primary-soft);color:var(--primary);}
.badge-contactado{background:#e6f1ff;color:#1c6fd6;}
.badge-negociando{background:var(--amber-soft);color:var(--amber);}
.badge-en_pausa{background:var(--violet-soft);color:var(--violet);}
.badge-no_responde{background:var(--red-soft);color:var(--red);}
.badge-cliente{background:var(--green-soft);color:var(--green);}
.badge-inactivo{background:#f0f1f4;color:var(--muted);}

/* ================= Forms ================= */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-grid.full, .field.full{grid-column:1/-1;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:11.5px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em;}
.field input, .field select, .field textarea{
  padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13.5px;
  font-family:inherit;background:#fff;color:var(--text);transition:border-color .15s, box-shadow .15s;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft);
}
.field textarea{resize:vertical;min-height:78px;}
.field select{width:100%;appearance:auto;}
.form-actions{
  display:flex;gap:10px;margin-top:22px;justify-content:flex-end;
  position:sticky;bottom:0;background:var(--panel);
  padding:14px 0 2px;border-top:1px solid var(--border-soft);
}

/* ================= Detail page ================= */
.detail-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;gap:14px;}
.back-link{
  color:var(--muted);text-decoration:none;font-size:12.5px;display:inline-flex;align-items:center;gap:5px;
  margin-bottom:14px;font-weight:600;transition:color .15s;
}
.back-link:hover{color:var(--primary);}
.info-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px;margin-bottom:6px;}
.info-item .k{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700;}
.info-item .v{font-size:14.5px;margin-top:4px;font-weight:500;color:var(--text);}

.list-item{
  border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:14px 16px;margin-bottom:10px;
  background:#fbfbfd;transition:border-color .15s, background .15s;
}
.list-item:hover{border-color:var(--border);background:#fff;}
.list-item .meta{font-size:11px;color:var(--muted);margin-bottom:5px;font-weight:600;letter-spacing:.02em;}
.list-item-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}

/* ================= Modal ================= */
.modal-overlay{
  position:fixed;inset:0;background:rgba(12,13,20,.55);backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;z-index:50;padding:20px;
  animation:overlayIn .15s ease;
}
@keyframes overlayIn{from{opacity:0;}to{opacity:1;}}
.modal-box{
  background:#fff;border-radius:16px;padding:26px 28px;width:100%;max-width:520px;max-height:88vh;
  overflow-y:auto;overflow-x:hidden;
  box-shadow:var(--shadow-lg);animation:modalIn .18s ease;
}
.modal-box-lg{max-width:680px;}
.modal-box .form-grid{gap:14px 18px;}
.modal-box .field select, .modal-box .field input{min-width:0;}
@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.98);}to{opacity:1;transform:translateY(0) scale(1);}}
.modal-box h3{font-family:var(--font-display);margin:0 0 18px;font-size:17px;font-weight:800;letter-spacing:-.01em;}

/* ================= Calendar ================= */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.cal-day-head{font-size:10.5px;color:var(--muted);text-align:center;padding:4px 0;font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
.cal-cell{min-height:82px;border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:7px;font-size:11px;background:#fff;transition:border-color .15s;}
.cal-cell:not(.other-month){cursor:pointer;}
.cal-cell:not(.other-month):hover{border-color:var(--primary);box-shadow:0 0 0 1px rgba(31,63,120,.15);}
.cal-cell.other-month{background:#fafafc;color:#d3d5dd;border-color:transparent;}
.cal-cell.today{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary);}
.cal-daynum{font-weight:700;margin-bottom:5px;font-size:12px;}
.cal-cell.today .cal-daynum{
  display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;
  background:var(--primary);color:#fff;border-radius:50%;font-size:11px;
}
.cal-event{
  background:var(--imp-normal-bg);color:var(--imp-normal-text);
  border-radius:6px;padding:2.5px 6px 2.5px 7px;margin-bottom:3px;font-size:10.5px;font-weight:600;
  cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  border-left:3px solid #c9cddb;transition:filter .15s;
}
.cal-event:hover{filter:brightness(0.97);}
.cal-event.imp-alta{background:var(--imp-alta-bg);color:var(--imp-alta-text);}
.cal-event.imp-media{background:var(--imp-media-bg);color:var(--imp-media-text);}
.cal-event.imp-normal{background:var(--imp-normal-bg);color:var(--imp-normal-text);}
.cal-event.entity-cliente{border-left-color:var(--primary);}
.cal-event.entity-proveedor{border-left-color:var(--teal);}
.cal-event.entity-venta{border-left-color:var(--violet);}
.cal-event.done{background:#eef0f3 !important;color:var(--muted);text-decoration:line-through;border-left-color:#d5d7de;}

/* Puntos indicadores (leyenda, listas) */
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:middle;flex-shrink:0;}
.dot.entity-cliente{background:var(--primary);}
.dot.entity-proveedor{background:var(--teal);}
.dot.entity-venta{background:var(--violet);}
.dot.imp-alta{background:#d97a7a;}
.dot.imp-media{background:var(--amber);}
.dot.imp-normal{background:#9aa1b3;}

.cal-legend{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:14px;font-size:11.5px;color:var(--muted);}
.cal-legend span{display:inline-flex;align-items:center;}
.cal-legend-sep{width:1px;height:14px;background:var(--border);margin:0 -6px;}

/* Barra superior: navegación + Hoy + selector de vista */
.cal-toolbar{flex-wrap:wrap;gap:10px;}
.cal-view-toggle{display:flex;gap:2px;background:var(--bg-soft,#f1f2f6);border-radius:var(--radius-pill);padding:3px;}
.cal-view-btn{border:none;background:transparent;color:var(--muted);font-size:12px;font-weight:700;padding:6px 14px;border-radius:var(--radius-pill);cursor:pointer;transition:background .15s,color .15s;}
.cal-view-btn:hover{color:var(--text);}
.cal-view-btn.active{background:var(--primary);color:#fff;box-shadow:none;}

/* Buscador y filtros del calendario */
.cal-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.cal-filters input[type="search"]{flex:1;min-width:180px;padding:8px 11px;border:1px solid var(--border);border-radius:8px;font-size:12.5px;font-family:inherit;}
.cal-filters select{padding:8px 11px;border:1px solid var(--border);border-radius:8px;font-size:12.5px;font-family:inherit;background:#fff;}
.cal-filters input[type="search"]:focus,.cal-filters select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft);}

.cal-event-hora{opacity:.75;font-weight:700;}
.cal-event.dragging{opacity:.4;}
.cal-cell.drag-over,.cal-week-body.drag-over{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-soft);}
.cal-more-link{font-size:10px;font-weight:700;color:var(--primary);cursor:pointer;padding:1px 2px;}
.cal-more-link:hover{text-decoration:underline;}

/* Vista semana: 7 columnas más altas que las celdas del mes, para caber más eventos por día */
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.cal-week-col{border:1px solid var(--border-soft);border-radius:var(--radius-sm);overflow:hidden;background:#fff;}
.cal-week-head{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-bottom:1px solid var(--border-soft);cursor:pointer;font-size:10.5px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em;}
.cal-week-head strong{font-size:15px;color:var(--text);font-family:var(--font-display);}
.cal-week-head.today{background:var(--primary-soft);}
.cal-week-head.today strong{color:var(--primary);}
.cal-week-body{min-height:260px;padding:7px;cursor:pointer;transition:border-color .15s;}

/* Vista agenda: lista cronológica agrupada por día */
.cal-agenda-group{margin-bottom:18px;}
.cal-agenda-group:last-child{margin-bottom:0;}
.cal-agenda-date{font-family:var(--font-display);font-weight:800;font-size:13.5px;color:var(--text);margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border-soft);}
.cal-agenda-date.today{color:var(--primary);}
.cal-agenda-item{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:8px;cursor:pointer;border-left:3px solid #c9cddb;}
.cal-agenda-item:hover{background:#f8f9fc;}
.cal-agenda-item.entity-cliente{border-left-color:var(--primary);}
.cal-agenda-item.entity-proveedor{border-left-color:var(--teal);}
.cal-agenda-item.entity-venta{border-left-color:var(--violet);}
.cal-agenda-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;}
.cal-agenda-sub{font-size:11.5px;color:var(--muted);}
.cal-agenda-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap;}

.day-events-list{max-height:60vh;overflow-y:auto;margin-bottom:14px;}

.notif-item-days.hoy{color:var(--amber);}

.badge-country{background:var(--teal-soft);color:var(--teal);}
.badge-proveedor{background:var(--primary-soft);color:var(--primary);}
.badge-distribuidor{background:var(--violet-soft);color:var(--violet);}

/* Estados de venta */
.badge-venta-cotizando{background:var(--primary-soft);color:var(--primary);}
.badge-venta-esperando_transitario{background:var(--amber-soft);color:var(--amber);}
.badge-venta-confirmado{background:#e6f1ff;color:#1c6fd6;}
.badge-venta-en_transito{background:var(--violet-soft);color:var(--violet);}
.badge-venta-entregado{background:var(--green-soft);color:var(--green);}
.badge-venta-cancelado{background:var(--red-soft);color:var(--red);}

/* Estado de pago de una venta */
.badge-pago-pendiente{background:var(--red-soft);color:var(--red);}
.badge-pago-parcial{background:var(--amber-soft);color:var(--amber);}
.badge-pago-pagado{background:var(--green-soft);color:var(--green);}

/* ================= Cotizaciones: tabla de items editable ================= */
#cf-items-tbody input{
  padding:7px 9px;border:1px solid var(--border);border-radius:7px;font-size:12.5px;font-family:inherit;width:100%;background:#fff;
}
#cf-items-tbody input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft);}
#cf-items-tbody td{padding:6px 8px;}
.cot-total-row{text-align:right;margin-top:12px;font-size:13.5px;color:var(--muted);}
.cot-total-row strong{color:var(--text);font-family:var(--font-display);font-size:17px;margin-left:6px;}
.cal-nav{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.cal-nav .month-label{font-family:var(--font-display);font-weight:800;font-size:15.5px;min-width:170px;text-align:center;letter-spacing:-.01em;}

.upcoming-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border-soft);font-size:13px;}
.upcoming-item:last-child{border-bottom:none;}
.upcoming-date{color:var(--muted);font-size:12px;min-width:100px;text-align:right;font-weight:500;}

.hint{font-size:12px;color:var(--muted);margin-top:6px;}
.status-ok{color:var(--green);}
.status-warn{color:var(--amber);}
a.plain{color:var(--primary);text-decoration:none;font-weight:600;}
a.plain:hover{text-decoration:underline;}

/* Scrollbar polish */
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:#d9d6cf;border-radius:10px;}
::-webkit-scrollbar-thumb:hover{background:#c3c0b8;}

/* ================= Barra de nueva versión disponible ================= */
#update-banner{
  position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:300;
  display:flex;align-items:center;gap:14px;
  background:linear-gradient(135deg,var(--primary) 0%,var(--green) 100%);color:#fff;
  padding:12px 14px 12px 18px;border-radius:14px;box-shadow:var(--shadow-lg);
  font-size:13px;font-weight:600;animation:updateBannerIn .25s ease;max-width:92vw;
}
@keyframes updateBannerIn{from{opacity:0;transform:translateX(-50%) translateY(10px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}
#update-banner button{box-shadow:none;padding:8px 13px;font-size:12.5px;}
#update-banner #update-banner-btn{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);}
#update-banner #update-banner-btn:hover{background:rgba(255,255,255,.26);transform:none;}
#update-banner #update-banner-dismiss{
  background:transparent;padding:0;width:22px;height:22px;font-size:18px;line-height:1;
  display:flex;align-items:center;justify-content:center;color:#fff;opacity:.7;box-shadow:none;
}
#update-banner #update-banner-dismiss:hover{opacity:1;background:transparent;transform:none;}
@media (max-width:600px){
  #update-banner{flex-wrap:wrap;justify-content:center;text-align:center;bottom:12px;}
}

/* ================= Campana de notificaciones ================= */
.notif-bell{
  position:relative;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  color:#c7cade;width:34px;height:34px;padding:0;border-radius:9px;flex-shrink:0;margin-left:auto;
  display:flex;align-items:center;justify-content:center;box-shadow:none;
}
.notif-bell:hover{background:rgba(255,255,255,.14);color:#fff;transform:none;box-shadow:none;}
.notif-bell svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.notif-count{
  position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:20px;
  background:var(--red);color:#fff;font-size:10px;font-weight:800;
  display:flex;align-items:center;justify-content:center;line-height:1;
  box-shadow:0 0 0 2px var(--sidebar-bg);
}
#mobile-topbar .notif-bell{color:#c7cade;margin-left:8px;}
#mobile-topbar .notif-count{box-shadow:0 0 0 2px var(--sidebar-bg-2);}

/* ================= Colapsar sidebar (escritorio) ================= */
/* Botón fijo arriba, junto a la campana: permite encoger el menú a solo
   íconos sin tener que desplazar/deslizar nada — así el usuario elige
   mostrarlo u ocultarlo con un clic en vez de tener que "correr" la barra. */
.sidebar-toggle-btn{
  position:relative;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  color:#c7cade;width:30px;height:30px;padding:0;border-radius:9px;flex-shrink:0;margin-left:6px;
  display:flex;align-items:center;justify-content:center;box-shadow:none;
}
.sidebar-toggle-btn:hover{background:rgba(255,255,255,.14);color:#fff;transform:none;box-shadow:none;}
.sidebar-toggle-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s ease;}
#sidebar.collapsed .sidebar-toggle-btn svg{transform:rotate(180deg);}

#sidebar{transition:width .18s ease, padding .18s ease;}
#sidebar.collapsed{
  width:76px;padding-left:10px;padding-right:10px;
}
#sidebar.collapsed .brand{flex-wrap:wrap;justify-content:center;gap:8px;padding:4px 0 18px;}
#sidebar.collapsed .brand-text{display:none;}
#sidebar.collapsed .notif-bell,
#sidebar.collapsed .sidebar-toggle-btn{margin-left:0;}
#sidebar.collapsed #nav a{justify-content:center;padding:10px;}
#sidebar.collapsed #nav a span{display:none;}
#sidebar.collapsed #nav a.active::before{display:none;}
#sidebar.collapsed .sidebar-footer{align-items:center;padding-left:0;padding-right:0;}
#sidebar.collapsed .save-line{justify-content:center;}
#sidebar.collapsed .save-line span:not(.save-dot),
#sidebar.collapsed .folder-line{display:none;}
@media (max-width:880px){.sidebar-toggle-btn{display:none;}}

/* ================= Asistente IA (botón flotante) ================= */
.ai-fab{
  position:fixed;right:22px;bottom:22px;z-index:250;width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,var(--violet) 0%,var(--primary) 100%);color:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(124,58,237,.35);
  padding:0;
}
.ai-fab:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 8px 22px rgba(124,58,237,.45);}
.ai-fab svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.ai-panel{
  position:fixed;right:22px;bottom:86px;z-index:250;width:380px;max-width:92vw;height:min(560px,70vh);
  background:#fff;border-radius:16px;box-shadow:var(--shadow-lg);border:1px solid var(--border-soft);
  display:flex;flex-direction:column;overflow:hidden;animation:modalIn .15s ease;
}
.ai-panel-head{
  display:flex;justify-content:space-between;align-items:center;padding:14px 16px;
  background:linear-gradient(135deg,#f3f0ff 0%,#eef7f4 100%);border-bottom:1px solid var(--border-soft);
}
.ai-panel-head strong{font-family:var(--font-display);font-size:13.5px;color:var(--violet);}
.ai-panel-close{background:transparent;box-shadow:none;color:var(--muted);width:26px;height:26px;padding:0;border-radius:8px;font-size:18px;line-height:1;}
.ai-panel-close:hover{background:rgba(0,0,0,.06);transform:none;box-shadow:none;}
.ai-panel-msgs{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px;}
.ai-msg{font-size:13px;line-height:1.5;padding:9px 12px;border-radius:12px;max-width:88%;white-space:pre-wrap;}
.ai-msg-bot{background:#f4f4f8;color:var(--text);align-self:flex-start;border-bottom-left-radius:4px;}
.ai-msg-user{background:var(--primary);color:#fff;align-self:flex-end;border-bottom-right-radius:4px;}
.ai-msg-error{background:var(--red-soft);color:var(--red);align-self:flex-start;border-bottom-left-radius:4px;}
.ai-panel-input-row{display:flex;gap:8px;padding:12px;border-top:1px solid var(--border-soft);}
.ai-panel-input-row textarea{
  flex:1;resize:none;padding:9px 11px;border:1px solid var(--border);border-radius:10px;font-size:13px;
  font-family:inherit;max-height:80px;
}
.ai-panel-input-row textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft);}
.ai-panel-input-row button{padding:9px 14px;}
@media (max-width:480px){
  .ai-panel{right:10px;left:10px;width:auto;bottom:80px;}
  .ai-fab{right:16px;bottom:16px;}
}

.notif-panel{
  position:fixed;top:64px;right:20px;z-index:260;width:340px;max-width:92vw;max-height:70vh;overflow-y:auto;
  background:#fff;border-radius:14px;box-shadow:var(--shadow-lg);border:1px solid var(--border-soft);
  animation:modalIn .15s ease;
}
.notif-panel-head{
  display:flex;justify-content:space-between;align-items:center;padding:14px 16px;
  border-bottom:1px solid var(--border-soft);font-size:13.5px;
}
.notif-panel-head strong{font-family:var(--font-display);}
.notif-panel-list{display:flex;flex-direction:column;}
.notif-empty{padding:26px 16px;text-align:center;color:var(--muted);font-size:13px;}
.notif-item{
  display:flex;align-items:center;gap:2px;padding:0 6px 0 0;
  border-bottom:1px solid var(--border-soft);transition:background .12s;
}
.notif-item:last-child{border-bottom:none;}
.notif-item:hover{background:#f8f9fc;}
.notif-item-link{
  display:flex;align-items:flex-start;gap:9px;padding:11px 10px 11px 16px;text-decoration:none;color:inherit;flex:1;min-width:0;
}
.notif-item .dot{margin-top:5px;}
.notif-item-body{flex:1;min-width:0;}
.notif-item-title{font-size:13px;font-weight:600;color:var(--text);}
.notif-item-sub{font-size:11.5px;color:var(--muted);margin-top:1px;}
.notif-item-days{font-size:11px;color:var(--red);font-weight:700;white-space:nowrap;flex-shrink:0;margin-top:1px;}
/* Botón para marcar la notificación como leída sin salir del panel: quita
   el evento de la lista al instante (marcándolo como completado por dentro). */
.notif-item-read{
  background:transparent;box-shadow:none;color:var(--muted);border:1px solid transparent;
  width:26px;height:26px;padding:0;border-radius:8px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
.notif-item-read:hover{background:var(--green-soft);color:var(--green);border-color:transparent;transform:none;box-shadow:none;}
.notif-item-read svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}

@media (max-width:600px){
  .notif-panel{top:60px;right:10px;left:10px;width:auto;}
}

/* ================= Botón de WhatsApp ================= */
.btn-whatsapp{
  display:inline-flex;align-items:center;gap:6px;text-decoration:none;
  background:#25D366;color:#fff;border:1px solid #1fb958;
  padding:10px 16px;border-radius:var(--radius-sm);font-size:13px;font-weight:600;
  box-shadow:0 1px 3px rgba(10,15,28,.15);transition:background .2s ease, transform .1s ease;
}
.btn-whatsapp:hover{background:#1fb958;transform:translateY(-1px);}
.btn-whatsapp:active{transform:translateY(0);}

/* ================= Hero (Inicio) ================= */
.hero{
  position:relative;overflow:hidden;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;
  background:linear-gradient(135deg,var(--sidebar-bg) 0%,var(--primary) 55%,var(--green) 130%);
  border-radius:18px;padding:30px 32px;margin-bottom:26px;
  box-shadow:var(--shadow-lg);
  border:1px solid rgba(201,162,39,.16);
}
.hero::before{
  content:"";position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(174,234,0,.22),transparent 70%);
}
.hero::after{
  content:"";position:absolute;bottom:-80px;left:20%;width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,162,39,.16),transparent 70%);
}
.hero-text{position:relative;z-index:1;}
.hero-date{color:#8b91ad;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;}
.hero-title{
  font-family:var(--font-display);color:#fff;font-size:27px;font-weight:800;letter-spacing:-.02em;margin:0 0 6px;
}
.hero-subtitle{color:#b6bad0;font-size:13.5px;margin:0;}
.hero-actions{position:relative;z-index:1;display:flex;gap:10px;flex-wrap:wrap;}
.hero-btn{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.14);
  padding:10px 15px;border-radius:10px;font-size:13px;font-weight:600;backdrop-filter:blur(6px);
  box-shadow:none;
}
.hero-btn:hover{background:rgba(255,255,255,.16);transform:translateY(-1px);box-shadow:none;}
.hero-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;}

/* ================= Gráfica de tendencia (Inicio) ================= */
.chart-panel{padding:24px 26px 18px;}
.chart-panel-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:14px;margin-bottom:4px;}
.chart-panel-sub{font-size:12px;color:var(--muted);font-weight:600;}
.chart-panel-big{text-align:right;}
.chart-panel-big-val{font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums;}
.chart-panel-big-label{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
.trend-chart-svg{width:100%;height:180px;display:block;margin-top:4px;}
.trend-chart-labels{display:flex;justify-content:space-between;padding:0 4px;}
.trend-chart-labels span{font-size:11px;color:var(--muted);font-weight:600;text-transform:capitalize;}
@media (max-width:640px){.chart-panel-head{flex-direction:column;}.chart-panel-big{text-align:left;}}

/* ================= Finanzas: caja de sugerencia con IA ================= */
.sugerencia-ia-box{
  background:linear-gradient(135deg,#f3f0ff 0%,#eef7f4 100%);border:1px solid #ded6fb;
}
.sugerencia-ia-box strong{font-family:var(--font-display);font-size:13.5px;color:var(--violet);display:block;margin-bottom:6px;}
.sugerencia-ia-box p{margin:0;font-size:13.5px;color:var(--text-soft);line-height:1.5;}

/* ================= Finanzas: barras de gasto por categoría ================= */
.gasto-cat-bars{display:flex;flex-direction:column;gap:12px;}
.gasto-cat-row{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:10px;}
.gasto-cat-label{font-size:12.5px;font-weight:600;color:var(--text-soft);}
.gasto-cat-bar-track{height:8px;border-radius:6px;background:var(--border-soft);overflow:hidden;}
.gasto-cat-bar-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--red) 0%,var(--amber) 100%);}
.gasto-cat-val{font-size:12.5px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;}
@media (max-width:640px){.gasto-cat-row{grid-template-columns:90px 1fr auto;}}

/* ================= Dashboard layout ================= */
.dashboard-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:22px;align-items:start;}
.dashboard-main .panel:last-child,
.dashboard-side .panel:last-child{margin-bottom:0;}
@media (max-width:920px){.dashboard-grid{grid-template-columns:1fr;}}

/* Pipeline */
.pipeline-row{display:flex;align-items:center;gap:10px;padding:9px 0;}
.pipeline-badge{width:92px;flex-shrink:0;text-align:center;}
.pipeline-bar{flex:1;height:7px;border-radius:20px;background:var(--border-soft);overflow:hidden;}
.pipeline-fill{height:100%;border-radius:20px;transition:width .3s ease;}
.pipeline-fill.fill-nuevo{background:var(--primary);}
.pipeline-fill.fill-contactado{background:#1c6fd6;}
.pipeline-fill.fill-negociando{background:var(--amber);}
.pipeline-fill.fill-en_pausa{background:var(--violet);}
.pipeline-fill.fill-no_responde{background:var(--red);}
.pipeline-fill.fill-cliente{background:var(--green);}
.pipeline-fill.fill-inactivo{background:#c3c6d1;}
.pipeline-count{font-size:12.5px;font-weight:700;color:var(--text-soft);width:20px;text-align:right;flex-shrink:0;}

/* Activity feed */
.activity-feed{display:flex;flex-direction:column;}
.activity-item{display:flex;align-items:flex-start;gap:0;padding:10px 0;border-bottom:1px solid var(--border-soft);}
.activity-item:last-child{border-bottom:none;}
.activity-item .dot{margin-top:5px;}
.activity-text{font-size:13px;color:var(--text-soft);}

/* ================= View switch (Kanban / Lista) ================= */
.view-switch{display:inline-flex;background:#eceef4;border-radius:var(--radius-pill);padding:3px;gap:2px;}
.view-switch-btn{
  background:transparent;color:var(--muted);box-shadow:none;padding:8px 14px;font-size:12.5px;font-weight:600;
  display:inline-flex;align-items:center;gap:6px;border-radius:var(--radius-pill);transition:background .15s,color .15s;
}
.view-switch-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.view-switch-btn:hover{background:rgba(255,255,255,.6);color:var(--text-soft);transform:none;box-shadow:none;}
.view-switch-btn.active{background:var(--primary);color:#fff;box-shadow:none;}

/* ================= Kanban board (Clientes) ================= */
.kanban-board{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;align-items:flex-start;}
.kanban-col{
  flex:0 0 268px;width:268px;background:#eef0f4;border-radius:14px;padding:10px;
  display:flex;flex-direction:column;max-height:calc(100vh - 240px);
}
.kanban-col-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:9px 12px;border-radius:10px;font-size:12.5px;font-weight:700;letter-spacing:.01em;margin-bottom:10px;
}
.kanban-count{background:rgba(255,255,255,.55);border-radius:20px;padding:1px 9px;font-size:11px;}
.kanban-col-head.head-nuevo{background:var(--primary-soft);color:var(--primary);}
.kanban-col-head.head-contactado{background:#e6f1ff;color:#1c6fd6;}
.kanban-col-head.head-negociando{background:var(--amber-soft);color:var(--amber);}
.kanban-col-head.head-en_pausa{background:var(--violet-soft);color:var(--violet);}
.kanban-col-head.head-no_responde{background:var(--red-soft);color:var(--red);}
.kanban-col-head.head-cliente{background:var(--green-soft);color:var(--green);}
.kanban-col-head.head-inactivo{background:#f0f1f4;color:var(--muted);}

.kanban-col-head.head-venta-cotizando{background:var(--primary-soft);color:var(--primary);}
.kanban-col-head.head-venta-esperando_transitario{background:var(--amber-soft);color:var(--amber);}
.kanban-col-head.head-venta-confirmado{background:#e6f1ff;color:#1c6fd6;}
.kanban-col-head.head-venta-en_transito{background:var(--violet-soft);color:var(--violet);}
.kanban-col-head.head-venta-entregado{background:var(--green-soft);color:var(--green);}
.kanban-col-head.head-venta-cancelado{background:var(--red-soft);color:var(--red);}

.kanban-col-body{
  display:flex;flex-direction:column;gap:9px;overflow-y:auto;padding:2px 2px 40px;flex:1;
  min-height:70px;
  border-radius:10px;transition:background .12s;
}
.kanban-col-body.drag-over{background:rgba(31,63,120,.06);outline:2px dashed rgba(31,63,120,.3);outline-offset:-2px;}
.kanban-empty{font-size:11.5px;color:#a7abbb;text-align:center;padding:18px 6px;border:1.5px dashed #d7d9e2;border-radius:10px;}

.kanban-card{
  background:#fff;border:1px solid var(--border-soft);border-left:4px solid var(--border-soft);border-radius:11px;padding:12px 13px;
  box-shadow:var(--shadow-sm);cursor:grab;transition:box-shadow .15s, transform .15s, opacity .15s, border-color .15s;
}
.kanban-card:hover{box-shadow:var(--shadow-md);}
/* El transform de arriba (levantar la tarjeta al pasar el mouse) se separa a
   propósito: mientras hay un drag activo (body.kanban-dnd-active), pasar el
   cursor sobre OTRA tarjeta de la misma columna dispara este :hover, y un
   transform en un elemento dentro del área de un drag nativo de HTML5 hace
   que Chrome pierda la posición de destino y cancele el drop — la tarjeta
   arrastrada "regresa sola". Sin transform durante el drag, el drop nunca se
   pierde; el resto del tiempo la tarjeta se sigue levantando igual que antes. */
body:not(.kanban-dnd-active) .kanban-card:hover{transform:translateY(-1px);}
.kanban-card.dragging{opacity:.4;}

/* Color de tarjeta según etapa (clientes) */
.kanban-card.card-nuevo{border-left-color:var(--primary);}
.kanban-card.card-contactado{border-left-color:#1c6fd6;}
.kanban-card.card-negociando{border-left-color:var(--amber);}
.kanban-card.card-en_pausa{border-left-color:var(--violet);}
.kanban-card.card-no_responde{border-left-color:var(--red);}
.kanban-card.card-cliente{border-left-color:var(--green);}
.kanban-card.card-inactivo{border-left-color:var(--muted);}

/* Color de tarjeta según etapa (ventas) */
.kanban-card.card-venta-cotizando{border-left-color:var(--primary);}
.kanban-card.card-venta-esperando_transitario{border-left-color:var(--amber);}
.kanban-card.card-venta-confirmado{border-left-color:#1c6fd6;}
.kanban-card.card-venta-en_transito{border-left-color:var(--violet);}
.kanban-card.card-venta-entregado{border-left-color:var(--green);}
.kanban-card.card-venta-cancelado{border-left-color:var(--red);}
.kanban-card-top{display:flex;align-items:center;gap:9px;margin-bottom:7px;}
.kanban-card-top strong{font-size:13px;line-height:1.25;}
.kanban-card-line{font-size:12px;color:var(--muted);margin-bottom:3px;padding-left:41px;}
.kanban-card-date{
  font-size:11px;color:var(--text-soft);margin-top:7px;padding-top:7px;border-top:1px solid var(--border-soft);
  display:flex;align-items:center;gap:5px;font-weight:600;
}
.kanban-card-date svg.cal-mini{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;}

/* ---------- LOGIN / ARRANQUE ---------- */
.login-screen{
  min-height:calc(100vh - 60px);display:flex;align-items:center;justify-content:center;padding:40px 20px;
}
.login-card{
  position:relative;overflow:hidden;
  width:100%;max-width:360px;background:var(--panel);border:1px solid var(--border-soft);
  border-radius:16px;padding:36px 32px;box-shadow:var(--shadow-lg);
}
.login-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--primary) 0%,var(--green) 55%,var(--gold) 100%);
}
.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:26px;}
.login-mark{
  width:38px;height:38px;object-fit:contain;
  filter:drop-shadow(0 3px 8px rgba(16,24,43,.3));
}
.login-title{font-family:var(--font-display);font-weight:800;font-size:15px;color:var(--text);}
.login-sub{font-size:12px;color:var(--muted);}
.login-card h1{font-family:var(--font-display);font-size:19px;margin:0 0 20px;}
.login-card label{display:block;font-size:12.5px;color:var(--muted);margin:14px 0 6px;font-weight:600;}
.login-card input{
  width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13.5px;
}
.login-card input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft);}
.login-card button{width:100%;margin-top:22px;}
.login-error{margin-top:14px;font-size:12.5px;color:var(--red);background:var(--red-soft);padding:9px 11px;border-radius:8px;}
.boot-loading{
  min-height:calc(100vh - 60px);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;color:var(--muted);font-size:13.5px;
}
.boot-spinner{
  width:30px;height:30px;border-radius:50%;border:3px solid var(--border-soft);border-top-color:var(--primary);
  animation:boot-spin .8s linear infinite;
}
@keyframes boot-spin{to{transform:rotate(360deg);}}

/* ================= Mobile topbar + off-canvas sidebar ================= */
#mobile-topbar{display:none;}
#sidebar-backdrop{display:none;}
body.auth-pending #sidebar,
body.auth-pending #mobile-topbar,
body.auth-pending #sidebar-backdrop,
body.auth-pending #ai-fab,
body.auth-pending #ai-panel{display:none !important;}

@media (max-width: 880px){
  #mobile-topbar{
    display:flex;align-items:center;justify-content:space-between;
    position:fixed;top:0;left:0;right:0;height:56px;z-index:220;
    background:linear-gradient(180deg,var(--sidebar-bg-2) 0%,var(--sidebar-bg) 100%);
    padding:0 14px;box-shadow:0 1px 0 rgba(255,255,255,.06);
  }
  #btn-hamburger{
    background:transparent;box-shadow:none;padding:8px;width:38px;height:38px;
    display:flex;align-items:center;justify-content:center;color:#fff;
  }
  #btn-hamburger:hover{background:rgba(255,255,255,.08);transform:none;box-shadow:none;}
  #btn-hamburger svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}
  .mobile-topbar-brand{display:flex;align-items:center;gap:9px;}
  .mobile-topbar-brand .brand-mark{width:30px;height:30px;}
  .mobile-topbar-name{font-family:var(--font-display);font-weight:800;color:#fff;font-size:14.5px;}

  body:not(.auth-pending) #layout{padding-top:56px;}

  #sidebar{
    position:fixed;top:0;left:0;height:100vh;width:250px;z-index:230;
    transform:translateX(-100%);transition:transform .22s ease;box-shadow:none;
  }
  #sidebar.open{transform:translateX(0);box-shadow:10px 0 30px rgba(0,0,0,.3);}

  #sidebar-backdrop{
    display:block;position:fixed;inset:0;background:rgba(10,11,18,.5);z-index:210;
    opacity:0;pointer-events:none;transition:opacity .2s ease;
  }
  #sidebar-backdrop.show{opacity:1;pointer-events:auto;}

  #app{padding:18px 16px 40px;max-width:100%;}

  .login-screen{min-height:100vh;padding:24px 16px;}
  .boot-loading{min-height:100vh;}

  .hero{flex-direction:column;align-items:flex-start;padding:20px;gap:16px;}
  .hero-actions{width:100%;}
  .hero-btn{flex:1 1 auto;justify-content:center;}

  .grid-cards,.grid-cards-5{grid-template-columns:repeat(2,1fr);}
  .dashboard-grid{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .info-grid{grid-template-columns:repeat(2,1fr);}

  .toolbar{flex-direction:column;align-items:stretch;}
  .toolbar > *{width:100%;}
  .search-input{width:100%;}
  .view-switch{justify-content:center;}

  .panel{padding:16px;overflow-x:auto;}
  table{font-size:12px;}

  .detail-header{flex-direction:column;align-items:stretch;}
  .detail-header > div:last-child{display:flex;gap:8px;}
  .detail-header > div:last-child button{flex:1;}

  .kanban-col{flex:0 0 250px;width:250px;max-height:calc(100vh - 220px);}

  .modal-box, .modal-box-lg{padding:20px;max-width:92vw;}
  .modal-box .form-grid{grid-template-columns:1fr;}

  .cal-grid{gap:4px;}
  .cal-cell{min-height:52px;padding:4px;font-size:9.5px;}
  .cal-daynum{font-size:10.5px;}
  .cal-nav .month-label{min-width:auto;}

  .cal-week{grid-template-columns:1fr;}
  .cal-week-body{min-height:auto;}
  .cal-view-toggle{width:100%;justify-content:center;}
  .cal-filters input[type="search"]{width:100%;}
}

@media (max-width: 480px){
  .grid-cards,.grid-cards-5,.info-grid{grid-template-columns:1fr;}
  .hero-title{font-size:22px;}
  h1{font-size:21px;}
}