/*
  Kandu · UX upgrade (touch-first)
  - Botones grandes (una mano)
  - Colores por estado (verde/amarillo/rojo)
  - Jerarquía visual: menos texto, más acción
*/

body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#020617;color:#e5e7eb;}
a{color:#22c55e;text-decoration:none;}a:hover{text-decoration:underline;}
.layout{display:flex;min-height:100vh;}
.sidebar{width:230px;background:#020617;border-right:1px solid rgba(148,163,184,.3);padding:16px 14px;display:flex;flex-direction:column;}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:20px;}
.brand-logo{width:42px;height:42px;border-radius:999px;background:radial-gradient(circle at 20% 20%,#22d3ee,#1d4ed8);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:22px;}
.brand-text{display:flex;flex-direction:column;}
.brand-title{font-size:12px;font-weight:600;}
.brand-subtitle{font-size:12px;color:#9ca3af;}
.menu{display:flex;flex-direction:column;gap:6px;}
.menu-item{border:none;background:transparent;color:#e5e7eb;text-align:left;padding:12px 12px;border-radius:12px;cursor:pointer;font-size:14px;line-height:1.1;}
.menu-item span.emoji{margin-right:8px;}
.menu-item:hover{background:rgba(148,163,184,.18);}
.menu-item.active{background:linear-gradient(90deg,#22c55e,#16a34a);color:#fff;}
.main{flex:1;padding:18px 22px 24px 22px;display:flex;flex-direction:column;}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.topbar-left h1{margin:0;font-size:20px;}
.topbar-left p{margin:2px 0 0 0;font-size:12px;color:#9ca3af;}
.topbar-right{display:flex;align-items:center;gap:8px;}
.chip{padding:4px 10px;border-radius:999px;font-size:12px;}
.chip-outline{border:1px solid #4b5563;}
.chip-success{background:#16a34a;}
.btn{
  pointer-events:auto;

  border-radius:14px;
  border:none;
  background:#1f2937;
  color:#e5e7eb;
  padding:12px 14px;
  font-size:14px;
  font-weight:800;
  min-height:52px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.btn:focus{outline:none;box-shadow:0 0 0 3px rgba(34,197,94,.22);}
.btn:disabled{opacity:.65;cursor:not-allowed;}
.btn-primary{background:linear-gradient(90deg,#22c55e,#16a34a);}
.btn-outline{background:transparent;border:1px solid rgba(148,163,184,.45);}
.btn-sm{padding:4px 10px;font-size:12px;}
.btn-sm{min-height:34px;border-radius:999px;gap:6px;}
.btn-block{width:100%;}
.btn-lg{min-height:60px;font-size:14px;border-radius:16px;}
.btn:hover{opacity:.9;}

/* Variantes */
.btn-danger{background:rgba(248,113,113,.18);border:1px solid rgba(248,113,113,.35);color:#f87171;}
.btn-success{background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.35);color:#4ade80;}
.btn-warning{background:rgba(245,158,11,.18);border:1px solid rgba(245,158,11,.45);color:#fde68a;}
.btn-success:disabled{opacity:.85;cursor:default;}
.view{display:none;}
.view.active{display:block;}
.cards-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.semaforo{display:flex;flex-direction:column;gap:10px;}
.semaforo-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:14px;border:1px solid rgba(148,163,184,.25);background:rgba(2,6,23,.55);}
.semaforo-left{display:flex;align-items:center;gap:10px;}
.semaforo-dot{width:10px;height:10px;border-radius:999px;background:#6b7280;box-shadow:0 0 0 3px rgba(107,114,128,.12);}
.semaforo-dot.green{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.15);}
.semaforo-dot.yellow{background:#facc15;box-shadow:0 0 0 3px rgba(250,204,21,.12);}
.semaforo-dot.red{background:#f87171;box-shadow:0 0 0 3px rgba(248,113,113,.12);}
.muted{color:#6b7280;margin-left:6px;}
.mini-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.segmented{display:flex;gap:6px;}
.segmented-btn{border-radius:14px;border:1px solid rgba(148,163,184,.25);background:transparent;color:#e5e7eb;padding:10px 14px;font-size:12px;min-height:44px;cursor:pointer;}
.segmented-btn.active{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.35);color:#4ade80;}
.badge.bronce{background:rgba(156,163,175,.18);color:#e5e7eb;border:1px solid rgba(156,163,175,.25);}
.badge.plata{background:rgba(96,165,250,.12);color:#60a5fa;border:1px solid rgba(96,165,250,.25);}
.badge.oro{background:rgba(250,204,21,.12);color:#facc15;border:1px solid rgba(250,204,21,.25);}
.card{background:#020617;border-radius:16px;padding:14px 16px;box-shadow:0 18px 40px rgba(15,23,42,.9);border:1px solid rgba(148,163,184,.25);}
.kpi{display:flex;flex-direction:column;gap:2px;}
.card-label{font-size:12px;color:#9ca3af;}
.card-value{font-size:24px;font-weight:600;}
.card-caption{font-size:12px;color:#6b7280;}
.tip{margin-top:10px;font-size:12px;color:#9ca3af;}
.table{width:100%;border-collapse:collapse;font-size:12px;}
.table th,.table td{text-align:left;padding:6px 8px;border-bottom:1px solid rgba(55,65,81,.7);}
.table td.right{white-space:normal;}
.table td.right .btn{min-height:44px;font-size:12px;padding:10px 12px;border-radius:14px;margin:2px 4px 2px 0;}
.table th{color:#9ca3af;font-weight:500;font-size:12px;}
.badge{padding:2px 8px;border-radius:999px;font-size:11px;}
.badge.ok{background:rgba(34,197,94,.15);color:#4ade80;border:1px solid rgba(34,197,94,.35);}
.badge.warn{background:rgba(245,158,11,.18);color:#fde68a;border:1px solid rgba(245,158,11,.45);}
.badge.danger{background:rgba(239,68,68,.18);color:#fecaca;border:1px solid rgba(239,68,68,.45);}
.badge-azul{background:rgba(59,130,246,.15);color:#60a5fa;}
.badge-verde{background:rgba(34,197,94,.15);color:#4ade80;}
.badge-amarillo{background:rgba(250,204,21,.12);color:#facc15;}
.badge-rojo{background:rgba(248,113,113,.12);color:#f87171;}
.badge-n1{background:rgba(234,179,8,.15);color:#facc15;}
.badge-n2{background:rgba(249,115,22,.15);color:#fb923c;}
.badge-n3{background:rgba(248,113,113,.15);color:#f87171;}
.form-card{margin-bottom:14px;}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
label{display:flex;flex-direction:column;font-size:12px;gap:4px;}
input,select,textarea{background:#020617;border-radius:12px;border:1px solid rgba(148,163,184,.4);padding:12px 12px;color:#e5e7eb;font-size:14px;min-height:44px;}
input:focus,select:focus,textarea:focus{outline:none;border-color:#22c55e;}
textarea{resize:vertical;}
.input{min-width:200px;}
.form-actions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;}
.form-actions .btn{flex:1;min-width:160px;}
@media (max-width:600px){
  .form-actions{flex-direction:column;}
  .form-actions .btn{width:100%;}
}
.table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.list{padding-left:18px;margin:0;}
.list li{margin-bottom:4px;}
.login-page{display:flex;min-height:100vh;align-items:center;justify-content:center;background:#020617;}
.login-card{background:#020617;border-radius:18px;padding:22px 24px 20px 24px;width:100%;max-width:380px;border:1px solid rgba(148,163,184,.4);box-shadow:0 18px 40px rgba(15,23,42,.9);}
.login-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.login-header h1{margin:0;font-size:16px;}
.login-header p{margin:0;font-size:12px;color:#9ca3af;}
.login-footer{margin-top:10px;font-size:11px;color:#9ca3af;}
.error{margin-top:6px;font-size:12px;color:#f97316;}
.rep-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.rep-header h1{margin:0;font-size:16px;}
.rep-header p{margin:2px 0 0 0;font-size:12px;color:#9ca3af;}
.badge-small{font-size:11px;padding:2px 8px;border-radius:999px;background:rgba(34,197,94,.1);color:#4ade80;}

.modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2000;
}
.modal-inner{
  background:#0f172a;
  padding:24px;
  border-radius:16px;
  max-width:360px;
  width:90%;
  text-align:center;
  box-shadow:0 20px 40px rgba(0,0,0,.5);
}
#qr-container{
  margin:16px auto;
}
#qr-container img{
  max-width:260px;
  border-radius:12px;
}
.badge-n1{
  background:#f59e0b;
  color:#020617;
}
.badge-n2{
  background:#ef4444;
  color:white;
}


.repartidor-form{
  margin-bottom:16px;
  padding:12px 14px;
  border-radius:12px;
  background:rgba(15,23,42,0.6);
}
.repartidor-form h4{
  margin:0 0 8px;
}
.form-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.form-group{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.form-group input{
  padding:6px 8px;
  border-radius:8px;
  border:1px solid rgba(148,163,184,0.4);
  background:#020617;
  color:#e5e7eb;
}
.form-group-button{
  align-self:end;
}
.form-group-button .btn{
  width:100%;
}
@media (max-width:900px){
  .form-grid{
    grid-template-columns:1fr 1fr;
  }
}

/* Mobile: navegación rápida y botones cómodos */
@media (max-width:900px){
  .layout{flex-direction:column;}
  .sidebar{
    width:auto;
    border-right:none;
    border-bottom:1px solid rgba(148,163,184,.25);
    padding:12px 12px;
  }
  .brand{margin-bottom:12px;}
  .menu{flex-direction:row;gap:8px;overflow-x:auto;padding-bottom:6px;}
  .menu-item{white-space:nowrap;padding:12px 12px;border-radius:14px;}
  .main{padding:12px 12px 20px;}
  .cards-row{grid-template-columns:repeat(2,minmax(0,1fr));}
  .grid-2{grid-template-columns:1fr;}
}



/* Estados de ciclo de consumo */
.badge-normal{
  background:rgba(34,197,94,.12);
  color:#4ade80;
}
.badge-por-vencer{
  background:rgba(250,204,21,.12);
  color:#facc15;
}
.badge-critico{
  background:rgba(248,113,113,.15);
  color:#f87171;
}
.badge-perdido{
  background:rgba(148,163,184,.18);
  color:#e5e7eb;
}


/* Banner grande para mostrar el nombre del cliente en Logística de despacho */
.cliente-banner{
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(34,197,94,.15);
  border:1px solid #22c55e;
  color:#bbf7d0;
  font-size:12px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
.cliente-banner-label{
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.cliente-banner-nombre{
  font-weight:700;
  font-size:14px;
}
.cliente-banner-id{
  color:#a7f3d0;
  font-size:12px;
}


.view-inner{min-height:75vh;}


/* Badges estados (alertas) */
.badge-success{background:rgba(16,185,129,.18);border:1px solid rgba(16,185,129,.5);color:#a7f3d0;}
.badge-warning{background:rgba(245,158,11,.18);border:1px solid rgba(245,158,11,.5);color:#fde68a;}
.badge-orange{background:rgba(249,115,22,.18);border:1px solid rgba(249,115,22,.55);color:#fed7aa;}
.badge-danger{background:rgba(239,68,68,.18);border:1px solid rgba(239,68,68,.5);color:#fecaca;}
.badge-dark{background:rgba(148,163,184,.14);border:1px solid rgba(148,163,184,.45);color:#e2e8f0;}

.badge-morado{ background:#6c5ce7; color:#fff; }
.badge-rojo{ background:#c0392b; color:#fff; }
/* Kandu: asegurar clic en menú */
.sidebar, .menu, .menu-item, .menu * { pointer-events: auto !important; }

/* vistas: solo la activa recibe clic y se muestra */
.view { display:none; pointer-events:none; }
.view.active { display:block; pointer-events:auto; }


/* Botones verdes (inicio/finalizar) */
.chip-green{
  background:#22c55e;
  border:1px solid rgba(34,197,94,.45);
  color:#06260f;
  font-weight:800;
}
.chip-green:hover{filter:brightness(1.05);}
.chip-green:active{transform:translateY(1px);}


/* --- Kandu: semáforo visual para "Clientes por contactar" --- */
.badge{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  border:1px solid rgba(0,0,0,.08);
  white-space:nowrap;
}
.badge-green{ background:#e8fff0; color:#0f7a2a; }
.badge-yellow{ background:#fff7db; color:#8a6a00; }
.badge-red{ background:#ffe8e8; color:#9b111e; }
.badge-gray{ background:#f2f2f2; color:#555; }

.table td .btn.btn-sm{
  padding:6px 10px;
  border-radius:10px;
  font-weight:800;
}


/* Inline field alerts (validación final) */
.field-alert{
  margin-top:6px;
  padding:8px 10px;
  border-radius:12px;
  font-size:12px;
  font-weight:700;
  background:rgba(239,68,68,.12);
  border:1px solid rgba(239,68,68,.35);
  color:#fecaca;
}


/* ====== STATUS CHIP ====== */
.status-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  letter-spacing:.3px;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  backdrop-filter: blur(6px);
  white-space:nowrap;
}

.status-dot{
  width:10px; height:10px;
  border-radius:50%;
  box-shadow:0 0 0 3px rgba(255,255,255,.06);
}

.status-note{
  margin-top:6px;
  font-size:12px;
  opacity:.82;
  line-height:1.2;
}

.status-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:6px;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 8px;
  border-radius:999px;
  font-size:11px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
  opacity:.92;
}

/* ====== VARIANTS ====== */
.st-critical{ background:rgba(255, 58, 58, .16); border-color:rgba(255,58,58,.35); }
.st-critical .status-dot{ background:#ff3a3a; box-shadow:0 0 0 3px rgba(255,58,58,.18); }

.st-urgent{ background:rgba(255, 145, 0, .16); border-color:rgba(255,145,0,.35); }
.st-urgent .status-dot{ background:#ff9100; box-shadow:0 0 0 3px rgba(255,145,0,.18); }

.st-warning{ background:rgba(255, 214, 0, .14); border-color:rgba(255,214,0,.35); }
.st-warning .status-dot{ background:#ffd600; box-shadow:0 0 0 3px rgba(255,214,0,.18); }

.st-ok{ background:rgba(0, 200, 83, .14); border-color:rgba(0,200,83,.35); }
.st-ok .status-dot{ background:#00c853; box-shadow:0 0 0 3px rgba(0,200,83,.18); }

.st-learning{ background:rgba(123, 97, 255, .14); border-color:rgba(123,97,255,.35); }
.st-learning .status-dot{ background:#7b61ff; box-shadow:0 0 0 3px rgba(123,97,255,.18); }

tr.row-critical{
  outline:1px solid rgba(255,58,58,.25);
  background:rgba(255,58,58,.05);
}


/* ===== Reabastecer Modal (PRO) ===== */
.modal{ position:fixed; inset:0; background:rgba(0,0,0,.55); display:none; align-items:center; justify-content:center; padding:18px; z-index:9999; }
.modal.show{ display:flex; }
.modal-card{ width:min(860px, 96vw); background:#0f172a; border:1px solid rgba(255,255,255,.08); border-radius:14px; box-shadow:0 12px 34px rgba(0,0,0,.35); overflow:hidden; }
.modal-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 14px; border-bottom:1px solid rgba(255,255,255,.08); }
.modal-title{ font-weight:700; font-size:16px; }
.modal-body{ padding:14px; }
.reb-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:14px; }
@media (max-width: 720px){ .reb-grid{ grid-template-columns:1fr; } }
.reb-info{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:12px; line-height:1.45; }
.reb-flags{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.reb-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }

/* ===== Status chips (ajustes solicitados) ===== */
.status-chip.st-blue{ border-color: rgba(59,130,246,.55); }
.status-chip.st-blue .status-dot{ background: #3b82f6; }

.status-chip.st-urgent{ border-color: rgba(249,115,22,.55); }
.status-chip.st-urgent .status-dot{ background: #f97316; }

.status-chip.st-critical{ border-color: rgba(239,68,68,.55); }
.status-chip.st-critical .status-dot{ background: #ef4444; }

.status-chip.st-learning{ border-color: rgba(168,85,247,.55); }
.status-chip.st-learning .status-dot{ background: #a855f7; }

.status-chip.st-contacted{ border-color: rgba(234,179,8,.55); }
.status-chip.st-contacted .status-dot{ background: #eab308; }

.status-chip.st-done{ border-color: rgba(34,197,94,.55); }
.status-chip.st-done .status-dot{ background: #22c55e; }
.status-chip.st-reb{ border-color: rgba(34,197,94,.35); }
.status-chip.st-reb .status-dot{ background: #22c55e; }

.status-chip.st-muted{ opacity:.9; border-color: rgba(255,255,255,.16); }
.pill-ok{ border-color: rgba(34,197,94,.55) !important; }


/* ===== Modal Premium (Eliminar cliente) ===== */
.modal-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,.62);
  backdrop-filter: blur(8px);
  display:flex; align-items:center; justify-content:center;
  z-index:9999;
  opacity:0;
  transition: opacity .18s ease;
}
.modal-overlay.hidden{ display:none; }
.modal-overlay.show{ opacity:1; }
.modal-box{
  width:min(460px, 92vw);
  background: rgba(14, 20, 34, .98);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:18px 18px 16px;
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
  transform: translateY(10px) scale(.99);
  transition: transform .18s ease, opacity .18s ease;
}
.modal-overlay.show .modal-box{ transform: translateY(0) scale(1); }
.modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }



/* =========================================================
   Kandu · Visual polish pass (premium)
   - Background gradient + subtle noise
   - Glass cards, softer shadows, smoother motion
   - Better tables, inputs, spacing, mobile
   ========================================================= */
:root{
  --bg0:#020617;
  --bg1:#0b1224;
  --card:rgba(2,6,23,.72);
  --stroke:rgba(148,163,184,.28);
  --stroke2:rgba(148,163,184,.18);
  --txt:#e5e7eb;
  --muted:#9ca3af;
  --good:#22c55e;
  --warn:#f59e0b;
  --bad:#f87171;
  --shadow: 0 18px 48px rgba(0,0,0,.45);
}

/* Background that feels "app" not "website" */
body{
  background:
    radial-gradient(1200px 800px at 12% 0%, rgba(34,197,94,.18), transparent 55%),
    radial-gradient(900px 700px at 88% 12%, rgba(34,211,238,.14), transparent 55%),
    radial-gradient(900px 700px at 70% 95%, rgba(29,78,216,.14), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 70%, var(--bg0));
  color:var(--txt);
}

.layout{gap:0;}
.sidebar{
  background:rgba(2,6,23,.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-right:1px solid var(--stroke);
}
.brand-logo{
  box-shadow:0 10px 28px rgba(34,211,238,.18), 0 12px 36px rgba(29,78,216,.18);
}
.menu-item{
  transition: transform .10s ease, background .15s ease, opacity .15s ease;
}
.menu-item:active{transform:scale(.98);}
.menu-item.active{
  box-shadow:0 10px 28px rgba(34,197,94,.18);
}

/* Top bar */
.topbar{position:sticky; top:0; z-index:5; padding:10px 0; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}
.topbar:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(2,6,23,.78), rgba(2,6,23,.35));
  border-bottom:1px solid var(--stroke2);
  z-index:-1;
}

/* Cards */
.card{
  background:var(--card) !important;
  border:1px solid var(--stroke) !important;
  box-shadow: var(--shadow);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: transform .12s ease, box-shadow .18s ease;
}
.card:hover{transform: translateY(-1px); box-shadow: 0 22px 60px rgba(0,0,0,.55);}

/* Inputs */
input, select, textarea{
  background:rgba(15,23,42,.55) !important;
  border:1px solid var(--stroke) !important;
  border-radius:14px !important;
}
input:focus, select:focus, textarea:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(34,197,94,.18) !important;
  border-color: rgba(34,197,94,.55) !important;
}

/* Buttons feel more tactile */
.btn{transition: transform .10s ease, opacity .15s ease, box-shadow .18s ease;}
.btn:active{transform:scale(.98);}
.btn-primary{box-shadow:0 14px 30px rgba(34,197,94,.18);}
.btn-outline{backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);}

/* Tables: clearer, more premium */
.table-wrap{
  background:rgba(2,6,23,.55);
  border:1px solid var(--stroke);
  border-radius:18px;
  box-shadow: var(--shadow);
  overflow:hidden;
}
table{border-collapse:separate; border-spacing:0;}
thead th{
  position:sticky; top:0;
  background:rgba(2,6,23,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom:1px solid var(--stroke2);
}
tbody tr:nth-child(2n){background:rgba(148,163,184,.06);}
tbody tr:hover{background:rgba(34,197,94,.08);}

/* Modal polish */
.modal-card{
  background:rgba(2,6,23,.78) !important;
  border:1px solid var(--stroke) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* Mobile: sidebar to bottom-nav style feel */
@media (max-width: 920px){
  .sidebar{width:86px}
  .brand-text{display:none}
  .menu-item{padding:12px 10px; font-size:12px}
  .menu-item span.emoji{margin-right:0}
}
@media (max-width: 560px){
  .main{padding:14px 12px 18px 12px}
  .topbar-left h1{font-size:18px}
}


/* ===========================
   Kandu · Premium UI v19
   - Fondo elegante + "glass"
   - Sidebar móvil con overlay
   - Botones icono + tema claro/oscuro
   =========================== */

:root{
  --bg:#020617;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --surface:rgba(2,6,23,.55);
  --surface2:rgba(15,23,42,.65);
  --border:rgba(148,163,184,.25);
  --accent:#22c55e;
  --accent2:#16a34a;
  --danger:#ef4444;
  --shadow:0 18px 45px rgba(0,0,0,.35);
  --shadowSoft:0 10px 25px rgba(0,0,0,.22);
}

html[data-theme="light"]{
  --bg:#f8fafc;
  --text:#0f172a;
  --muted:#475569;
  --surface:rgba(255,255,255,.72);
  --surface2:#ffffff;
  --border:rgba(15,23,42,.12);
  --shadow:0 18px 45px rgba(2,6,23,.12);
  --shadowSoft:0 10px 25px rgba(2,6,23,.08);
}

body{
  background:var(--bg) !important;
  color:var(--text) !important;
}

/* fondo "premium": blobs + grid sutil */
body::before{
  content:"";
  position:fixed;
  inset:-20vh -20vw;
  z-index:-2;
  background:
    radial-gradient(1200px 700px at 20% 10%, rgba(34,197,94,.18), transparent 60%),
    radial-gradient(900px 600px at 80% 20%, rgba(34,211,238,.12), transparent 60%),
    radial-gradient(900px 600px at 60% 85%, rgba(29,78,216,.16), transparent 60%);
  filter:saturate(1.05);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(to right, rgba(148,163,184,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148,163,184,.06) 1px, transparent 1px);
  background-size: 44px 44px;
  opacity:.28;
  pointer-events:none;
}

/* barra superior más “app” */
.topbar{
  position:sticky;
  top:0;
  z-index:5;
  padding:12px 12px;
  margin:-6px -6px 14px -6px;
  border-radius:18px;
  background:linear-gradient(180deg, var(--surface2), rgba(255,255,255,0));
  backdrop-filter: blur(10px);
  border:1px solid var(--border);
  box-shadow: var(--shadowSoft);
}

/* icon buttons */
.iconbtn{
  width:44px;
  height:44px;
  border-radius:14px;
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  transition: transform .12s ease, background .12s ease;
}
.iconbtn:hover{ transform: translateY(-1px); background:var(--surface2); }
.iconbtn:active{ transform: translateY(0px) scale(.98); }
.mobile-only{ display:none; }

/* sidebar glass */
.sidebar{
  background:linear-gradient(180deg, var(--surface2), rgba(255,255,255,0)) !important;
  backdrop-filter: blur(12px);
}
.menu-item{
  border:1px solid transparent;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.menu-item:hover{
  transform: translateY(-1px);
  border-color: var(--border);
}
.menu-item.active{
  background:linear-gradient(90deg, var(--accent), var(--accent2)) !important;
}

/* cards más premium */
.card, .table-wrap, .semaforo-item{
  background:var(--surface) !important;
  border:1px solid var(--border) !important;
  box-shadow: var(--shadowSoft);
}
.card:hover{ box-shadow: var(--shadow); transform: translateY(-1px); transition: .15s ease; }

/* tablas: header sticky + hover suave */
table thead th{
  position:sticky;
  top:0;
  background:var(--surface2);
  backdrop-filter: blur(10px);
  z-index:2;
}
tbody tr:hover{ background:rgba(148,163,184,.12) !important; }

/* overlay + sidebar móvil */
.sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(2,6,23,.55);
  backdrop-filter: blur(2px);
  z-index:20;
}
@media (max-width: 900px){
  .mobile-only{ display:inline-flex; }
  .layout{ position:relative; }
  .sidebar{
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    z-index:30;
    width:min(86vw, 290px);
    transform: translateX(-105%);
    transition: transform .18s ease;
    box-shadow: var(--shadow);
  }
  body.sidebar-open .sidebar{ transform: translateX(0); }
  body.sidebar-open .sidebar-overlay{ display:block; }
  .main{ padding:14px; }
  .cards-row{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* botones: sensación táctil */
.btn{
  background:var(--surface2) !important;
  border:1px solid var(--border) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
  transition: transform .12s ease, box-shadow .12s ease;
}
.btn:hover{ transform: translateY(-1px); box-shadow: var(--shadowSoft); }
.btn:active{ transform: translateY(0) scale(.99); }
.btn-primary{
  background:linear-gradient(90deg, var(--accent), var(--accent2)) !important;
  border:none !important;
}
.btn-danger{ background:linear-gradient(90deg,#ef4444,#b91c1c) !important; border:none !important; }
a{ color: var(--accent) !important; }

/* inputs más pro */
input, select, textarea{
  background:var(--surface2) !important;
  border:1px solid var(--border) !important;
  color:var(--text) !important;
}
input:focus, select:focus, textarea:focus{
  outline:none;
  box-shadow: 0 0 0 3px rgba(34,197,94,.18);
}


/* --- v20 Premium dashboard additions --- */
.hero{
  display:flex; gap:14px; align-items:center; justify-content:space-between;
  padding:14px 14px 6px 14px;
}
.hero-title{font-weight:800; letter-spacing:.2px; font-size:18px;}
.hero-sub{color:rgba(229,231,235,.72); font-size:12.5px; margin-top:2px;}
.hero-actions{display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end;}
.spark-card{margin-top:10px;}
.sparkline{
  display:flex; align-items:flex-end; gap:6px; height:72px; padding:10px 6px 2px 6px;
}
.sparkline .bar{
  flex:1; border-radius:10px; background:rgba(34,197,94,.18);
  border:1px solid rgba(34,197,94,.25);
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  transform-origin:bottom;
  animation:barUp .55s ease-out both;
}
@keyframes barUp{from{transform:scaleY(.2); opacity:.35;} to{transform:scaleY(1); opacity:1;}}
/* nicer kpi */
.card.kpi{position:relative; overflow:hidden;}
.card.kpi:before{
  content:""; position:absolute; inset:-2px;
  background:radial-gradient(700px 200px at 20% 0%, rgba(34,197,94,.22), transparent 60%),
             radial-gradient(700px 200px at 80% 0%, rgba(59,130,246,.18), transparent 60%);
  opacity:.9; pointer-events:none;
}
.card.kpi > *{position:relative;}
.table thead th{position:sticky; top:0; background:rgba(2,6,23,.92); backdrop-filter:blur(8px); z-index:2;}
.table tbody tr:hover{background:rgba(255,255,255,.03);}
@media (max-width:720px){
  .hero{align-items:flex-start; flex-direction:column;}
  .hero-actions{justify-content:flex-start;}
}


/* ===== Modal (pro) ===== */
.modal-backdrop{
  position:fixed; inset:0;
  display:none;
  align-items:center; justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
  z-index: 9999;
}
.modal-backdrop.show{ display:flex; }

.modal{
  width:min(560px, 100%);
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(10,14,26,.92);
  box-shadow: 0 30px 80px rgba(0,0,0,.55);
  overflow:hidden;
  transform: translateY(8px) scale(.98);
  opacity:0;
  animation: modalIn .18s ease forwards;
}
@keyframes modalIn{
  to{ transform: translateY(0) scale(1); opacity:1; }
}
.modal-head{
  display:flex; align-items:flex-start; justify-content:space-between;
  padding:16px 16px 10px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.modal-kicker{ font-size:12px; opacity:.75; }
.modal-title{ margin:2px 0 0 0; font-size:18px; }
.modal-body{ padding:14px 16px; }
.modal-text{ margin:0 0 12px 0; line-height:1.35; opacity:.95; }
.danger-note{ display:inline-block; margin-left:6px; color:#f87171; font-weight:600; }
.modal-confirm{ display:flex; flex-direction:column; gap:8px; }
.modal-label{ font-size:13px; opacity:.85; }
.modal-input{ font-size:16px; letter-spacing:.5px; }
.modal-help{ font-size:12px; opacity:.65; }
.modal-actions{
  display:flex; gap:10px; justify-content:flex-end;
  padding:12px 16px 16px 16px;
  border-top:1px solid rgba(255,255,255,.08);
}
.modal-shake{ animation: shake .28s ease; }
@keyframes shake{
  0%,100%{ transform: translateX(0); }
  20%{ transform: translateX(-8px); }
  40%{ transform: translateX(8px); }
  60%{ transform: translateX(-6px); }
  80%{ transform: translateX(6px); }
}

/* Danger button (strong) */
.btn-danger-strong{
  background: linear-gradient(135deg, rgba(248,113,113,.95), rgba(239,68,68,.85));
  border:1px solid rgba(255,255,255,.14);
  color:#0b1020;
  font-weight:800;
  box-shadow: 0 10px 24px rgba(239,68,68,.25);
}
.btn-danger-strong:disabled{ opacity:.55; filter:saturate(.7); cursor:not-allowed; box-shadow:none; }
.btn-danger-strong:not(:disabled):hover{ transform: translateY(-1px); }


/* ===== FIX v22: Modal RESET inventario no debe dejar la página borrosa =====
   Antes: .modal tenía position:fixed + display:none (regla genérica) y el backdrop mostraba blur sin mostrar la caja.
   Ahora: cuando el backdrop está en .show, mostramos la caja y la hacemos position:relative. */
.modal-backdrop .modal{ display:none; }
.modal-backdrop.show .modal{
  display:block;
  position:relative;
  inset:auto;
  margin:0 auto;
}



/* Mini tabla dashboard */
.mini-table-wrap{ overflow:auto; border-radius:14px; border:1px solid rgba(255,255,255,.08); }
.table.mini th, .table.mini td{ padding:10px 12px; font-size:12.5px; }
.table.mini thead th{ position: sticky; top: 0; z-index: 1; backdrop-filter: blur(10px); }
.badge{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; font-weight:700; font-size:12px; border:1px solid rgba(255,255,255,.12); }
.badge.red{ background: rgba(255,59,59,.14); }
.badge.orange{ background: rgba(255,159,10,.14); }
.badge.blue{ background: rgba(0,122,255,.14); }
.badge .dot{ width:8px; height:8px; border-radius:999px; background: currentColor; opacity:.9; }


.brand-logo img{width:100%;height:100%;object-fit:cover;border-radius:999px;display:block;}


/* Kandu MENSAJES admin */
.mensajes-admin-wrap{overflow:auto; border-radius:18px;}
.msg-admin-text{max-width:520px; white-space:pre-wrap; line-height:1.35;}
.msg-admin-client b{display:block;}
.msg-admin-client small{opacity:.72;}
.msg-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.08);font-size:12px;font-weight:800;}

/* KANDU MENSAJES ADMIN PRO */
#view-mensajes .table-header{align-items:flex-start; gap:14px;}
#view-mensajes [data-msg-filter].active{background:rgba(34,197,94,.18);border-color:rgba(34,197,94,.55);color:#fff;}
.msg-empty{padding:22px;text-align:center;color:var(--muted,#a9b3c7);}
.msg-row-new{background:linear-gradient(90deg,rgba(34,197,94,.12),rgba(59,130,246,.04));}
.msg-admin-client b{display:block;font-size:13px;}
.msg-admin-client small{display:block;opacity:.72;margin-top:3px;font-size:11px;}
.msg-admin-text{max-width:520px;white-space:pre-wrap;line-height:1.35;font-weight:600;}
.msg-pill{display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;border:1px solid rgba(148,163,184,.25);background:rgba(15,23,42,.55);font-size:12px;}
.msg-badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:900;border:1px solid rgba(148,163,184,.28)}
.msg-badge.new{background:rgba(34,197,94,.16);border-color:rgba(34,197,94,.45);color:#bbf7d0;}
.msg-badge.read{background:rgba(148,163,184,.10);color:#cbd5e1;}
.msg-actions{display:flex;gap:6px;flex-wrap:wrap;}
.mensajes-admin-wrap{overflow:auto;}
#tabla-mensajes th:last-child,#tabla-mensajes td:last-child{min-width:170px;}

/* ===== KANDU MENSAJES PRO — ADMIN ⇄ CLIENTE EN TIEMPO REAL ===== */
.messages-pro-shell{display:flex;flex-direction:column;gap:18px;min-height:calc(100vh - 120px)}
.messages-pro-top{display:flex;justify-content:space-between;gap:16px;align-items:center;border:1px solid rgba(93,156,236,.22);background:linear-gradient(135deg,rgba(9,20,42,.96),rgba(4,12,25,.92));border-radius:18px;padding:18px 22px;box-shadow:0 16px 40px rgba(0,0,0,.24)}
.messages-pro-top h2{margin:0;color:#f7fbff;font-size:25px;letter-spacing:.2px}.messages-pro-top p{margin:4px 0 0;color:#9db2cf}.messages-pro-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.msg-select{background:#081426;color:#fff;border:1px solid rgba(116,156,220,.28);border-radius:12px;padding:12px 16px;font-weight:800;outline:0}.messages-pro-grid{display:grid;grid-template-columns:390px minmax(520px,1fr) 310px;gap:16px;align-items:stretch}.msg-conversations,.msg-chat,.msg-side-card{border:1px solid rgba(95,147,220,.22)!important;background:linear-gradient(180deg,rgba(12,25,48,.92),rgba(6,13,28,.92))!important;box-shadow:0 20px 50px rgba(0,0,0,.20)}.msg-panel-title{display:flex;align-items:center;justify-content:space-between}.msg-panel-title h3{margin:0 0 12px;color:#fff}.msg-panel-title span,.menu-item[data-view="mensajes"] .msg-menu-bubble{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:#ff3158;color:#fff;font-size:12px;margin-left:6px}.msg-search-row{display:flex;gap:10px;margin-bottom:12px}.msg-search-row input{flex:1;background:#081426;border:1px solid rgba(118,158,220,.28);color:#dfeaff;border-radius:12px;padding:13px 14px;outline:0}.msg-search-row button{width:48px;border:1px solid rgba(118,158,220,.28);background:#132238;color:#fff;border-radius:12px}.msg-conversation-list{display:flex;flex-direction:column;max-height:calc(100vh - 285px);overflow:auto;border:1px solid rgba(96,142,208,.10);border-radius:14px}.msg-conv{display:grid;grid-template-columns:54px 1fr auto;gap:12px;align-items:center;padding:14px;border:0;background:transparent;color:#dce9ff;text-align:left;border-bottom:1px solid rgba(120,160,220,.12);cursor:pointer;transition:.15s}.msg-conv:hover,.msg-conv.active{background:linear-gradient(135deg,rgba(26,123,255,.22),rgba(16,209,112,.10));outline:1px solid rgba(33,134,255,.55)}.msg-conv .msg-avatar{width:42px;height:42px;font-size:15px}.msg-conv b{display:block;color:#fff;font-size:15px}.msg-conv small{display:block;color:#9fb0ca;margin-top:3px;max-width:215px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.msg-conv-time{font-size:12px;color:#bdc8d9}.msg-unread{display:inline-flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 6px;border-radius:999px;background:#ff3158;color:white;font-size:12px;font-weight:900;margin-top:8px}.msg-read-ok{display:inline-flex;color:#20db75;font-weight:900;margin-top:8px}.msg-list-footer{padding:12px 4px 2px;color:#9eb0ca;font-size:13px}.msg-empty-pro,.msg-chat-empty{padding:28px;text-align:center;color:#9db2cf}.msg-chat-empty{height:100%;min-height:450px;display:flex;flex-direction:column;align-items:center;justify-content:center}.msg-chat-empty-icon{font-size:48px;margin-bottom:12px}.msg-chat-active{display:flex;flex-direction:column;gap:14px;min-height:720px}.hidden{display:none!important}.msg-client-head{display:grid;grid-template-columns:54px 1fr auto auto;gap:14px;align-items:center}.msg-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#49d45f,#2375ff);color:#fff;font-weight:950}.msg-client-head h3{margin:0;color:#fff}.msg-client-head p{margin:4px 0 0;color:#aab9d2}.msg-last-order{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border:1px solid rgba(106,154,224,.2);border-radius:14px;padding:14px;background:rgba(8,18,35,.72);color:#dce8ff}.msg-order-icon{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:10px;background:rgba(129,89,255,.16);margin-right:8px}.msg-status-pill{padding:5px 9px;border-radius:999px;background:rgba(22,212,113,.16);color:#20db75;font-weight:950;font-size:12px}.msg-money{color:#14e27b}.msg-order-progress{border:1px solid rgba(106,154,224,.16);border-radius:14px;padding:16px;background:rgba(6,15,31,.58)}.msg-order-progress h4{margin:0 0 14px;color:#fff}.msg-progress-line{display:grid;grid-template-columns:repeat(4,1fr);position:relative;gap:10px}.msg-progress-line:before{content:"";position:absolute;left:8%;right:8%;top:13px;height:3px;background:#1a304b;border-radius:999px}.msg-progress-line:after{content:"";position:absolute;left:8%;top:13px;height:3px;width:var(--progress,0%);background:linear-gradient(90deg,#15e477,#217bff);border-radius:999px}.msg-step{position:relative;z-index:1;text-align:center;color:#8f9db5;font-weight:850}.msg-step i{display:block;width:24px;height:24px;border-radius:50%;margin:0 auto 9px;background:#243752;border:5px solid #0b1629}.msg-step.active,.msg-step.done{color:#13e276}.msg-step.active i,.msg-step.done i{background:#13e276;box-shadow:0 0 0 8px rgba(19,226,118,.14)}.msg-step span{display:block;font-size:13px}.msg-step small{display:block;margin-top:4px}.msg-day-divider{text-align:center;color:#bdc7db;font-size:13px;position:relative}.msg-day-divider:before,.msg-day-divider:after{content:"";display:inline-block;width:42%;height:1px;background:rgba(138,171,218,.14);vertical-align:middle;margin:0 10px}.msg-thread{flex:1;min-height:260px;max-height:420px;overflow:auto;padding:4px 8px;display:flex;flex-direction:column;gap:12px}.msg-bubble{max-width:62%;padding:14px 16px;border-radius:16px;background:#18263a;color:#fff;box-shadow:0 10px 25px rgba(0,0,0,.18)}.msg-bubble.admin{align-self:flex-end;background:linear-gradient(135deg,#0e5cff,#043a8e)}.msg-bubble.system{align-self:center;max-width:72%;border:1px solid rgba(20,226,123,.32);background:rgba(5,40,39,.55)}.msg-bubble small{display:block;color:#b7c4d8;margin-top:8px;font-size:12px}.msg-reply-box{border:1px solid rgba(106,154,224,.16);border-radius:16px;background:rgba(9,18,34,.86);padding:12px}.msg-tabs{display:flex;gap:20px;border-bottom:1px solid rgba(118,158,220,.14);margin-bottom:12px}.msg-tabs button{background:transparent;border:0;color:#9eb0ca;padding:0 0 11px;cursor:pointer;font-weight:850}.msg-tabs .active{color:#1d7bff;border-bottom:2px solid #1d7bff}.msg-reply-box textarea{width:100%;min-height:86px;resize:vertical;background:#071326;color:#fff;border:1px solid rgba(118,158,220,.28);border-radius:12px;padding:13px;outline:0}.msg-reply-actions{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.msg-reply-icons{color:#aebbd1;letter-spacing:10px}.msg-client-side{display:flex;flex-direction:column;gap:14px}.msg-side-card h3{margin:0 0 16px;color:#ddecff}.msg-side-card dl{margin:0}.msg-side-card dt{color:#8ea2bd;font-size:12px;margin-top:12px}.msg-side-card dd{margin:4px 0 0;color:#fff;font-weight:750}.msg-quick{width:100%;display:flex;justify-content:space-between;align-items:center;margin-bottom:9px;border:0;border-radius:12px;background:rgba(255,255,255,.06);color:#f4f8ff;padding:13px 14px;font-weight:850;cursor:pointer}.msg-quick:hover{background:rgba(30,123,255,.16)}.msg-summary-row{display:flex;justify-content:space-between;color:#dce8ff;margin:13px 0}.msg-summary-row b{color:#fff}.msg-menu-bubble{float:right;margin-left:auto!important}@media(max-width:1180px){.messages-pro-grid{grid-template-columns:340px 1fr}.msg-client-side{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr)}}@media(max-width:820px){.messages-pro-top,.msg-client-head,.msg-last-order{display:flex;flex-direction:column;align-items:stretch}.messages-pro-grid{grid-template-columns:1fr}.msg-conversation-list{max-height:320px}.msg-client-side{display:flex}.msg-bubble{max-width:86%}}

/* ===== KANDU FACTURA EXACTA — agregado no invasivo ===== */
.kandu-invoice-backdrop{position:fixed;inset:0;background:rgba(2,6,23,.76);backdrop-filter:blur(8px);z-index:9999;display:none;align-items:center;justify-content:center;padding:18px}.kandu-invoice-backdrop.open{display:flex}.kandu-invoice-modal{width:min(1480px,98vw);height:min(900px,95vh);background:#0b1220;border:1px solid rgba(139,92,246,.55);border-radius:18px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.55)}.kandu-invoice-head{height:58px;background:linear-gradient(90deg,#451078,#8a20dd);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 20px}.kandu-invoice-head small{display:block;opacity:.86;font-size:12px;margin-top:3px}.kandu-invoice-close{width:40px;height:40px;border:0;border-radius:999px;background:rgba(255,255,255,.18);color:white;font-size:28px;cursor:pointer}.kandu-invoice-body{height:calc(100% - 58px);display:grid;grid-template-columns:285px minmax(690px,1fr) 330px;gap:16px;padding:16px;overflow:hidden;background:#080f1d}.kandu-invoice-controls,.kandu-order-details{background:linear-gradient(180deg,#111a2d,#0d1527);border:1px solid rgba(148,163,184,.18);border-radius:16px;padding:14px;overflow:auto;box-shadow:0 16px 38px rgba(0,0,0,.25)}.kandu-invoice-controls h3,.kandu-order-details h3{margin:0 0 12px;color:#f8fafc;font-size:16px}.kandu-invoice-controls label{display:block;font-weight:800;color:#e5e7eb;font-size:12px;margin:9px 0 0}.kandu-invoice-controls input,.kandu-invoice-controls textarea{width:100%;box-sizing:border-box;border:1px solid rgba(148,163,184,.22);border-radius:12px;background:#1f2937;color:#fff;padding:11px;margin-top:6px;font-weight:800}.kandu-invoice-controls input[readonly]{background:#374151;color:#fff}.kandu-invoice-controls input:focus,.kandu-invoice-controls textarea:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}.kandu-invoice-controls textarea{min-height:58px;resize:vertical}.kandu-invoice-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.kandu-invoice-controls .btn{width:100%;margin-top:10px}.kandu-invoice-preview-wrap{overflow:auto;background:#f8fafc;border-radius:16px;padding:14px;box-shadow:0 12px 35px rgba(0,0,0,.20)}.kandu-invoice-preview{position:relative;width:760px;margin:0 auto;background:white}.kandu-invoice-preview img{width:100%;display:block}.ki{position:absolute;font-family:Arial,Helvetica,sans-serif;color:#141347;font-weight:800;font-size:11.6px;white-space:nowrap;line-height:1.15}.ki-num-mask{left:72.6%;top:13.0%;width:14.2%;height:4.2%;background:#fff;z-index:2}.ki-num{left:73.1%;top:12.8%;width:13.3%;text-align:center;font-size:26px;letter-spacing:1px;color:#dc2626;z-index:3}.ki-fecha{left:72.4%;top:22.1%;width:15.5%;text-align:center;font-size:12px;letter-spacing:5px}.ki-nombre{left:19.2%;top:31.6%;width:31%;overflow:hidden;text-overflow:ellipsis}.ki-direccion{left:20.2%;top:35.4%;width:32%;overflow:hidden;text-overflow:ellipsis}.ki-cc{left:48.6%;top:39.0%;width:22%;overflow:hidden;text-overflow:ellipsis;text-align:center}.ki-ciudad{left:66.7%;top:31.6%;width:25%;overflow:hidden;text-overflow:ellipsis}.ki-telefono{left:72.0%;top:35.4%;width:20%;overflow:hidden;text-overflow:ellipsis}.ki-cant{left:33.6%;top:46.5%;text-align:center;width:9%}.ki-unit{left:52.1%;top:46.5%;width:16%;text-align:center}.ki-line-total{left:75.7%;top:46.5%;width:17%;text-align:center}.ki-subtotal{left:76.0%;top:71.6%;width:16%;font-size:12.2px;text-align:center}.ki-total{left:76.0%;top:75.3%;width:16%;font-size:12.8px;text-align:center}.ki-letras{left:18.2%;top:72.1%;width:33%;overflow:hidden;text-overflow:ellipsis;font-size:10.8px}.ki-obs{left:16.5%;top:79.2%;width:76%;overflow:hidden;text-overflow:ellipsis;font-size:10.8px}.ki-repartidor{left:13.8%;top:86.2%;width:29%;overflow:hidden;text-overflow:ellipsis;font-size:11.6px;text-align:center}.kod-row{border-bottom:1px solid rgba(148,163,184,.16);padding:10px 0}.kod-row span,.kod-product>span{display:block;color:#94a3b8;font-size:12px;margin-bottom:4px}.kod-row b,.kod-product b,.kod-total b{color:#fff;font-size:13px}.kod-product{padding:12px 0;border-bottom:1px solid rgba(148,163,184,.16)}.kod-product div{display:flex;align-items:center;justify-content:space-between;background:#131e33;border:1px solid rgba(148,163,184,.15);border-radius:12px;padding:10px;margin-top:8px}.kod-product em{font-style:normal;color:#e5e7eb;font-weight:900}.kod-total{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid rgba(148,163,184,.16);color:#fff}.kod-status{display:inline-block;background:#0f8f4e;color:#bbf7d0!important;border-radius:999px;padding:3px 9px}.kandu-invoice-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.kandu-invoice-actions .btn{width:100%;min-height:38px}.kandu-invoice-actions #kandu-inv-wa{grid-column:1/3;background:#22c55e;color:#fff;border-color:#22c55e}.kod-history{margin-top:14px;background:#0b1220;border:1px solid rgba(148,163,184,.15);border-radius:14px;padding:12px}.kod-history-head{display:flex;align-items:center;justify-content:space-between;color:#fff;margin-bottom:8px}.kod-history-head button{border:1px solid rgba(148,163,184,.25);background:#111a2d;color:#fff;border-radius:8px;padding:5px 8px;cursor:pointer}.kod-history-list{display:grid;gap:8px;color:#cbd5e1;font-size:12px}.kod-history-item{display:grid;grid-template-columns:1fr auto;gap:6px;border-bottom:1px solid rgba(148,163,184,.12);padding-bottom:8px}.kod-history-item b{color:#fff}.kod-history-item em{font-style:normal;color:#22c55e;font-weight:900}@media(max-width:1180px){.kandu-invoice-body{grid-template-columns:280px 1fr}.kandu-order-details{display:none}.kandu-invoice-preview{width:740px}}@media(max-width:900px){.kandu-invoice-body{grid-template-columns:1fr}.kandu-invoice-controls{max-height:280px}.kandu-invoice-modal{height:94vh}.kandu-invoice-preview{width:720px}}

/* ===== KANDU DETALLES DEL CLIENTE OPERABLE ===== */
.cliente-row{cursor:pointer;transition:.16s ease}.cliente-row:hover{background:rgba(34,197,94,.08)!important;box-shadow:inset 3px 0 0 rgba(34,197,94,.85)}.row-ref{display:block;color:#9fb0ca;font-size:11px;margin-top:4px;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cliente-actions{white-space:nowrap}.client-detail-backdrop{position:fixed;inset:0;z-index:9998;background:rgba(2,6,23,.42);backdrop-filter:blur(3px);display:none;justify-content:flex-end}.client-detail-backdrop.open{display:flex}.client-detail-panel{width:min(540px,96vw);height:100vh;background:linear-gradient(180deg,#0b1326,#071020);border-left:1px solid rgba(148,163,184,.28);box-shadow:-28px 0 70px rgba(0,0,0,.45);padding:22px;overflow:auto;position:relative;color:#f8fafc}.client-detail-close{position:absolute;right:18px;top:14px;width:38px;height:38px;border-radius:999px;border:1px solid rgba(148,163,184,.25);background:rgba(15,23,42,.75);color:#fff;font-size:28px;cursor:pointer}.client-detail-head{display:flex;gap:16px;align-items:center;margin:18px 0 18px}.client-detail-head h2{margin:0;font-size:25px}.client-detail-head p{margin:7px 0 0;color:#a8b4c8}.client-avatar{width:74px;height:74px;border-radius:22px;display:flex;align-items:center;justify-content:center;font-size:38px;background:linear-gradient(135deg,#86efac,#22c55e);box-shadow:0 16px 40px rgba(34,197,94,.22)}.client-detail-card,.client-metric{border:1px solid rgba(148,163,184,.18);border-radius:18px;background:linear-gradient(180deg,rgba(15,23,42,.9),rgba(8,16,32,.88));padding:16px;margin-bottom:16px}.client-detail-card h3{margin:0 0 12px}.client-detail-card p{margin:9px 0;color:#dbeafe}.client-metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}.client-metric span{display:block;color:#9fb0ca;font-weight:800;font-size:12px}.client-metric b{display:block;font-size:23px;margin:8px 0;color:#fff}.client-metric small{color:#94a3b8}.client-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.client-detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:sticky;bottom:0;background:linear-gradient(180deg,rgba(7,16,32,.2),#071020);padding-top:12px}.badge.ok{background:rgba(34,197,94,.16);border-color:rgba(34,197,94,.45);color:#bbf7d0}.multi-cylinders{border:1px dashed rgba(148,163,184,.25);border-radius:16px;padding:12px;background:rgba(15,23,42,.35)}.multi-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px}.pedido-items-list{display:grid;gap:8px;margin-bottom:8px}.pedido-extra-item{display:grid;grid-template-columns:1fr 120px auto;gap:8px;align-items:center}.pedido-extra-item select,.pedido-extra-item input{background:#0f172a;color:#fff;border:1px solid rgba(148,163,184,.25);border-radius:12px;padding:10px}@media(max-width:720px){.client-metrics-grid{grid-template-columns:1fr}.client-detail-actions{grid-template-columns:1fr}.pedido-extra-item{grid-template-columns:1fr}}

/* ==========================================================
   KANDU ULTRA PRO UI · Integración visual funcional
   Mantiene IDs, clases y lógica JS existente. Solo mejora capa visual.
   ========================================================== */
:root{
  --gdb-bg:#050816;
  --gdb-panel:#091426;
  --gdb-panel-2:#0b1730;
  --gdb-line:rgba(133,170,255,.20);
  --gdb-line-strong:rgba(61,137,255,.42);
  --gdb-text:#f5f8ff;
  --gdb-muted:#95a8c8;
  --gdb-green:#14e67f;
  --gdb-blue:#1f8cff;
  --gdb-cyan:#20e6ff;
  --gdb-purple:#8b4dff;
  --gdb-pink:#ff3c7d;
  --gdb-card-shadow:0 22px 58px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.035);
}
html,body{min-height:100%;background:
  radial-gradient(1100px 420px at 76% -8%, rgba(41,101,255,.36), transparent 58%),
  radial-gradient(780px 420px at 12% 5%, rgba(120,64,255,.16), transparent 55%),
  linear-gradient(180deg,#060a19 0%,#030615 58%,#02040e 100%) !important;color:var(--gdb-text)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:
  linear-gradient(115deg,transparent 0 62%,rgba(60,83,255,.08) 64%,transparent 78%),
  radial-gradient(circle at 70% 12%,rgba(45,255,207,.08),transparent 22%);z-index:-1}
.layout{background:transparent}.main{padding:18px 26px 26px;min-width:0}.sidebar{width:250px;background:linear-gradient(180deg,rgba(5,10,26,.96),rgba(4,8,20,.98));border-right:1px solid rgba(100,135,210,.22);box-shadow:18px 0 60px rgba(0,0,0,.20);position:sticky;top:0;height:100vh;box-sizing:border-box}
.brand{padding:4px 2px 18px;margin-bottom:8px;border-bottom:1px solid rgba(135,170,255,.11)}.brand-logo{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,#7c39ff,#0fe6ff);box-shadow:0 12px 32px rgba(89,75,255,.36);overflow:hidden}.brand-logo img{width:100%;height:100%;object-fit:contain}.brand-title{font-weight:950;letter-spacing:.25px}.brand-subtitle,.topbar-left p{color:var(--gdb-muted)}
.menu{gap:10px}.menu-item{min-height:50px;border:1px solid transparent;border-radius:15px;color:#dce7ff;background:transparent;display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.05px;transition:transform .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease}.menu-item span.emoji{margin-right:0;width:24px;text-align:center;filter:drop-shadow(0 0 8px rgba(255,255,255,.12))}.menu-item:hover{background:rgba(82,126,216,.13);border-color:rgba(122,160,238,.18);transform:translateX(2px);text-decoration:none}.menu-item.active{background:linear-gradient(135deg,rgba(29,140,255,.96),rgba(135,60,255,.92));border-color:rgba(151,198,255,.42);box-shadow:0 12px 32px rgba(55,102,255,.30),inset 0 1px 0 rgba(255,255,255,.14)}.menu-item[data-view="mensajes"].active{background:linear-gradient(135deg,#1c8dff,#823cff)}.msg-menu-bubble{margin-left:auto!important;float:none!important;background:linear-gradient(135deg,#ff3269,#8b4dff)!important;box-shadow:0 7px 18px rgba(255,48,105,.28)}
.topbar{min-height:72px;margin:-2px -8px 18px;padding:10px 10px 16px;border-bottom:1px solid rgba(125,160,230,.14);background:linear-gradient(90deg,rgba(8,15,34,.82),rgba(8,16,38,.52),rgba(15,17,45,.76));border-radius:0 0 22px 22px}.topbar-left h1{font-size:26px;font-weight:950;letter-spacing:.2px}.topbar-left h1:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:10px;background:var(--gdb-cyan);box-shadow:0 0 16px var(--gdb-cyan)}.iconbtn,.topbar .chip{border:1px solid rgba(125,160,230,.26);background:rgba(7,14,31,.70);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.iconbtn{border-radius:16px;min-width:46px;min-height:46px}.chip{padding:10px 14px;font-weight:850}
.card,.msg-conversations,.msg-chat,.msg-side-card{border:1px solid var(--gdb-line)!important;background:linear-gradient(180deg,rgba(13,27,54,.86),rgba(7,14,31,.91))!important;box-shadow:var(--gdb-card-shadow)!important;border-radius:20px!important;backdrop-filter:blur(16px)}.card:hover{border-color:rgba(90,147,255,.28)}
.btn{border-radius:14px;font-weight:950;letter-spacing:.05px;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 22px rgba(0,0,0,.18);transition:transform .13s ease,filter .13s ease,box-shadow .13s ease,border-color .13s ease}.btn:hover{transform:translateY(-1px);filter:brightness(1.06);opacity:1}.btn-primary{background:linear-gradient(135deg,#1c8cff,#16e182)!important;color:#fff}.btn-success{background:linear-gradient(135deg,#12c86e,#15e58a)!important;color:#032012;border-color:rgba(91,255,173,.5)}.btn-outline{background:rgba(11,22,45,.64)!important;border:1px solid rgba(133,170,255,.28)!important;color:#f6f9ff}.btn-danger{background:rgba(255,69,107,.14)!important;border:1px solid rgba(255,69,107,.35)!important;color:#ff9bb2}
input,select,textarea,.input,.msg-select{background:rgba(6,15,32,.82)!important;border:1px solid rgba(133,170,255,.28)!important;color:#f5f8ff!important;border-radius:15px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}input:focus,select:focus,textarea:focus{border-color:rgba(32,230,255,.68)!important;box-shadow:0 0 0 4px rgba(32,230,255,.10),inset 0 1px 0 rgba(255,255,255,.05)!important}
.badge,.chip,.msg-status-pill{font-weight:950}.badge.ok,.badge-verde,.msg-status-pill{background:rgba(20,230,127,.14)!important;color:#36ff9a!important;border:1px solid rgba(20,230,127,.32)}.badge.warn,.badge-amarillo{background:rgba(255,190,56,.14)!important;color:#ffd56b!important;border:1px solid rgba(255,190,56,.32)}.badge.danger,.badge-rojo{background:rgba(255,69,107,.14)!important;color:#ff9bb2!important;border:1px solid rgba(255,69,107,.32)}
.hero{border:1px solid rgba(78,141,255,.22);background:linear-gradient(135deg,rgba(10,29,62,.85),rgba(16,18,49,.78));box-shadow:var(--gdb-card-shadow);border-radius:24px;padding:20px;margin-bottom:16px}.hero-title{font-size:30px;font-weight:950}.hero-sub{color:var(--gdb-muted);font-weight:700}.cards-row{gap:16px}.kpi{position:relative;overflow:hidden}.kpi:after{content:"";position:absolute;right:-24px;top:-30px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,rgba(32,230,255,.18),transparent 68%)}.card-value{font-size:30px;font-weight:950;color:#fff}.card-label{color:#a6b8d5;font-weight:800}.card-caption{color:#7f92b1}
.table{border-collapse:separate;border-spacing:0 8px}.table th{border:0;color:#96aac8;font-weight:900;text-transform:uppercase;letter-spacing:.5px}.table td{border:0;background:rgba(8,17,36,.64);padding:12px 10px}.table tr td:first-child{border-radius:14px 0 0 14px}.table tr td:last-child{border-radius:0 14px 14px 0}
/* MENSAJES PRO */
.messages-pro-shell{position:relative}.messages-pro-top{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 18px;padding:0 2px}.messages-pro-top h2{font-size:28px!important;font-weight:950;letter-spacing:.3px;margin:0}.messages-pro-top p{font-weight:650;color:var(--gdb-muted)!important}.messages-pro-actions .btn,.messages-pro-actions .iconbtn,.messages-pro-actions select{min-height:48px}.messages-pro-grid{grid-template-columns:minmax(330px,410px) minmax(560px,1fr) minmax(285px,350px)!important;gap:18px!important}.msg-conversations,.msg-chat,.msg-side-card{position:relative;overflow:hidden}.msg-conversations:before,.msg-chat:before,.msg-side-card:before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(37,220,255,.65),rgba(147,80,255,.55),transparent)}.msg-panel-title h3,.msg-side-card h3,.msg-order-progress h4{font-size:19px;font-weight:950;color:#fff!important}.msg-panel-title span{background:linear-gradient(135deg,#ff3c7d,#8b4dff)!important;box-shadow:0 8px 18px rgba(255,60,125,.25)}.msg-search-row{gap:10px}.msg-search-row input{height:50px;font-weight:750}.msg-search-row button{height:50px;border-radius:15px!important;background:rgba(13,30,58,.86)!important}.msg-conversation-list{border:1px solid rgba(133,170,255,.14)!important;border-radius:18px!important;max-height:calc(100vh - 315px)!important;background:rgba(3,8,20,.28)}.msg-conv{grid-template-columns:56px 1fr auto!important;padding:15px!important;border-bottom:1px solid rgba(133,170,255,.12)!important;border-radius:14px;margin:4px;position:relative}.msg-conv:hover,.msg-conv.active{background:linear-gradient(135deg,rgba(31,140,255,.25),rgba(20,230,127,.10))!important;outline:1px solid rgba(32,230,255,.38)!important;box-shadow:0 12px 28px rgba(9,80,180,.18)}.msg-conv.active:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:999px;background:linear-gradient(180deg,#20e6ff,#14e67f)}.msg-avatar{background:linear-gradient(135deg,#14e67f,#1f8cff 55%,#8b4dff)!important;box-shadow:0 12px 28px rgba(32,230,255,.20),inset 0 1px 0 rgba(255,255,255,.18);font-weight:950}.msg-conv b{font-weight:950}.msg-conv small{font-weight:650;color:#a5b8d7!important}.msg-read-ok{color:#17f58d!important}.msg-unread{background:linear-gradient(135deg,#ff3c7d,#ff6c43)!important;box-shadow:0 8px 18px rgba(255,60,125,.28)}.msg-list-footer{padding:14px 8px 0!important;color:#91a6c7!important;font-weight:650}
.msg-chat-active{min-height:735px!important}.msg-client-head{grid-template-columns:62px 1fr auto auto!important;padding-bottom:4px}.msg-client-head .msg-avatar{width:58px;height:58px;font-size:22px}.msg-client-head h3{font-size:22px!important;font-weight:950}.msg-client-head p{font-weight:650;color:#a5b8d7!important}.msg-last-order{border-radius:17px!important;border-color:rgba(133,170,255,.18)!important;background:linear-gradient(135deg,rgba(24,20,58,.68),rgba(8,21,44,.76))!important;padding:16px!important}.msg-order-icon{width:44px!important;height:44px!important;border-radius:15px!important;background:linear-gradient(135deg,rgba(139,77,255,.28),rgba(31,140,255,.16))!important;border:1px solid rgba(139,77,255,.34)}.msg-money{font-size:18px;color:#26ff99!important}.msg-order-progress{border-radius:18px!important;background:linear-gradient(180deg,rgba(6,15,34,.68),rgba(5,11,25,.78))!important;border:1px solid rgba(133,170,255,.17)!important;padding:20px!important}.msg-progress-line:before{top:18px!important;height:4px!important;background:#213853!important}.msg-progress-line:after{top:18px!important;height:4px!important;background:linear-gradient(90deg,#14e67f,#20e6ff,#8b4dff)!important;box-shadow:0 0 18px rgba(32,230,255,.26)}.msg-step i{width:32px!important;height:32px!important;border-width:6px!important;background:#192842!important;border-color:#071326!important}.msg-step.done i:after,.msg-step.active i:after{content:"✓";display:flex;align-items:center;justify-content:center;color:#062013;font-style:normal;font-size:18px;font-weight:950}.msg-step.active i,.msg-step.done i{background:linear-gradient(135deg,#14e67f,#20e6ff)!important;box-shadow:0 0 0 9px rgba(20,230,127,.12),0 0 22px rgba(32,230,255,.28)!important}.msg-step.active span,.msg-step.done span{color:#31ff9e!important}.msg-step span{font-size:13px!important;font-weight:950}.msg-day-divider{font-weight:750;color:#9fb2cf!important}.msg-thread{max-height:430px!important;scrollbar-width:thin;scrollbar-color:rgba(32,230,255,.45) rgba(7,14,31,.7)}.msg-bubble{border-radius:19px!important;background:linear-gradient(135deg,rgba(26,39,65,.92),rgba(16,29,52,.92))!important;border:1px solid rgba(133,170,255,.15);line-height:1.45}.msg-bubble.admin{background:linear-gradient(135deg,#176dff,#063f9f)!important;border-color:rgba(81,154,255,.36)}.msg-bubble.system{background:linear-gradient(135deg,rgba(10,67,54,.72),rgba(7,35,45,.72))!important;border-color:rgba(20,230,127,.34)!important}.msg-reply-box{border-radius:18px!important;background:linear-gradient(180deg,rgba(7,15,31,.92),rgba(5,11,25,.94))!important;border:1px solid rgba(133,170,255,.18)!important}.msg-tabs button{font-weight:950}.msg-tabs .active{color:#20e6ff!important;border-color:#20e6ff!important}.msg-reply-actions{gap:10px;flex-wrap:wrap}.msg-reply-actions .btn-primary{min-width:140px}.msg-side-card{padding:18px!important}.msg-side-card h3{display:flex;align-items:center;gap:8px}.msg-side-card:first-child h3:before{content:"🪪"}.msg-side-card:nth-child(2) h3:before{content:"⚡"}.msg-side-card:nth-child(3) h3:before{content:"📊"}.msg-side-card dt{color:#91a6c7!important;font-weight:800}.msg-side-card dd{font-weight:950!important}.msg-info-avatar{width:88px;height:88px}.msg-quick{border:1px solid rgba(133,170,255,.18)!important;background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(31,140,255,.06))!important;border-radius:16px!important;min-height:54px}.msg-quick:hover{background:linear-gradient(135deg,rgba(31,140,255,.22),rgba(139,77,255,.14))!important;border-color:rgba(32,230,255,.34)!important}.msg-summary-row{border-bottom:1px solid rgba(133,170,255,.10);padding-bottom:10px}.msg-summary-row:last-child{border-bottom:0;padding-bottom:0}.msg-summary-row b{color:#fff!important}.msg-summary-row:last-child b{color:#67a7ff!important}
/* Limpieza y estabilidad visual */
.sidebar-overlay{backdrop-filter:blur(6px)}*{box-sizing:border-box}.hidden{display:none!important}.view{animation:gdbFade .18s ease both}@keyframes gdbFade{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(max-width:1280px){.messages-pro-grid{grid-template-columns:360px 1fr!important}.msg-client-side{grid-column:1/-1;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}@media(max-width:900px){.sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;transform:translateX(-105%);transition:.22s ease;width:280px}.sidebar.open{transform:translateX(0)}.main{padding:12px}.topbar{margin:0 0 14px}.messages-pro-top{flex-direction:column;align-items:stretch}.messages-pro-grid{grid-template-columns:1fr!important}.msg-client-head{display:flex!important;flex-direction:column;align-items:stretch}.msg-chat-active{min-height:auto!important}.msg-client-side{display:flex!important}.cards-row{grid-template-columns:1fr}.grid-2{grid-template-columns:1fr}}

/* =========================================================
   KANDU ULTRA PRO VISUAL FINAL - Mensajes / CRM
   Diseño integrado sin cambiar IDs ni lógica JS
   ========================================================= */
:root{
  --k-bg:#030814;
  --k-panel:rgba(8,18,35,.78);
  --k-panel-2:rgba(11,24,46,.88);
  --k-stroke:rgba(102,154,255,.24);
  --k-stroke-strong:rgba(36,211,255,.42);
  --k-text:#f7fbff;
  --k-muted:#9fb0ca;
  --k-green:#19e884;
  --k-cyan:#16d9ff;
  --k-blue:#2563ff;
  --k-purple:#8b3dff;
  --k-pink:#ff3174;
  --k-shadow:0 24px 70px rgba(0,0,0,.48);
}
html{background:#030814!important;}
body{
  background:
    radial-gradient(circle at 74% 6%, rgba(38,72,255,.34), transparent 32%),
    radial-gradient(circle at 18% 14%, rgba(0,220,255,.12), transparent 24%),
    linear-gradient(135deg,#020510 0%,#071328 48%,#030713 100%)!important;
  color:var(--k-text)!important;
  font-feature-settings:"ss01" on,"cv01" on;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:linear-gradient(120deg,transparent 0 58%,rgba(58,98,255,.12) 67%,transparent 78%),
             radial-gradient(circle at 82% 12%,rgba(10,255,199,.08),transparent 18%);
  opacity:.95;
}
.layout,.main,.sidebar{position:relative;z-index:1;}
.sidebar{
  width:260px!important;
  padding:20px 16px!important;
  background:linear-gradient(180deg,rgba(2,6,20,.96),rgba(5,14,31,.98))!important;
  border-right:1px solid rgba(82,135,255,.22)!important;
  box-shadow:18px 0 55px rgba(0,0,0,.34)!important;
}
.brand{padding:4px 0 18px;margin-bottom:18px!important;border-bottom:1px solid rgba(133,170,230,.16);}
.brand-logo{
  width:54px!important;height:54px!important;border-radius:16px!important;
  background:linear-gradient(135deg,#1af0c3,#2381ff 55%,#8b3dff)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.16),0 12px 30px rgba(37,99,255,.36)!important;
}
.brand-title{font-size:13px!important;font-weight:950!important;color:#fff!important;}
.brand-subtitle{font-size:12px!important;color:#93a9ca!important;}
.menu{gap:11px!important;}
.menu-item{
  min-height:52px!important;padding:13px 14px!important;border-radius:16px!important;
  color:#e7f0ff!important;background:transparent!important;
  border:1px solid transparent!important;font-weight:850!important;
  transition:.18s ease!important;
}
.menu-item:hover{background:rgba(31,109,255,.14)!important;border-color:rgba(92,150,255,.22)!important;transform:translateX(3px)!important;}
.menu-item.active,
.menu-item[data-view="mensajes"].active{
  background:linear-gradient(135deg,#1d8cff 0%,#7d3cff 72%)!important;
  border-color:rgba(167,205,255,.46)!important;
  box-shadow:0 16px 38px rgba(71,86,255,.38),inset 0 1px 0 rgba(255,255,255,.18)!important;
}
#btn-exportar{background:rgba(14,30,55,.8)!important;border:1px solid rgba(118,169,255,.34)!important;box-shadow:0 10px 28px rgba(0,0,0,.22)!important;}
#btn-logout{background:rgba(105,14,45,.55)!important;border:1px solid rgba(255,74,124,.5)!important;color:#ffd8e5!important;}
.main{padding:0 22px 26px!important;}
.topbar,
.messages-pro-top{
  min-height:82px!important;margin:0 -4px 22px!important;padding:0 18px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  background:linear-gradient(180deg,rgba(7,16,35,.90),rgba(7,16,35,.50))!important;
  border:1px solid rgba(100,152,255,.18)!important;border-top:0!important;
  border-radius:0 0 24px 24px!important;box-shadow:var(--k-shadow)!important;
  backdrop-filter:blur(18px)!important;
}
.topbar-left h1,.messages-pro-top h2{font-size:26px!important;letter-spacing:.2px!important;color:#fff!important;text-shadow:0 0 20px rgba(80,140,255,.24)!important;}
.topbar-left p,.messages-pro-top p{font-size:13px!important;color:#9fb0ca!important;}
.messages-pro-grid{
  grid-template-columns:380px minmax(590px,1fr) 330px!important;
  gap:18px!important;align-items:stretch!important;
}
.card,.msg-conversations,.msg-chat,.msg-side-card{
  background:linear-gradient(180deg,rgba(12,27,52,.86),rgba(5,13,29,.86))!important;
  border:1px solid var(--k-stroke)!important;
  border-radius:20px!important;box-shadow:var(--k-shadow)!important;
  backdrop-filter:blur(18px)!important;
}
.card:hover,.msg-conversations:hover,.msg-chat:hover,.msg-side-card:hover{border-color:rgba(36,211,255,.32)!important;}
.msg-panel-title h3,.msg-side-card h3{font-size:20px!important;color:#fff!important;font-weight:950!important;}
.msg-panel-title span,.menu-item[data-view="mensajes"] .msg-menu-bubble{
  background:linear-gradient(135deg,#ff3479,#8f45ff)!important;box-shadow:0 10px 22px rgba(255,49,116,.34)!important;
}
.msg-search-row{gap:12px!important;}
.msg-search-row input,.msg-reply-box textarea,.input,select,textarea{
  background:rgba(4,12,28,.76)!important;border:1px solid rgba(118,168,255,.25)!important;
  color:#eaf3ff!important;border-radius:16px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.msg-search-row input:focus,.msg-reply-box textarea:focus{border-color:var(--k-cyan)!important;box-shadow:0 0 0 4px rgba(22,217,255,.08)!important;}
.msg-search-row button{border-radius:16px!important;background:rgba(12,28,55,.85)!important;border-color:rgba(118,168,255,.30)!important;}
.msg-conversation-list{border:0!important;border-radius:16px!important;gap:8px!important;padding-right:4px!important;}
.msg-conv{
  border-bottom:0!important;border-radius:16px!important;margin:0 2px!important;padding:14px!important;
  background:rgba(6,17,34,.42)!important;border:1px solid rgba(116,158,220,.08)!important;
}
.msg-conv:hover,.msg-conv.active{
  background:linear-gradient(135deg,rgba(0,205,255,.20),rgba(84,56,255,.20))!important;
  border-color:rgba(24,221,255,.55)!important;outline:0!important;
  box-shadow:0 15px 30px rgba(0,0,0,.24), inset 4px 0 0 #14f0d2!important;
}
.msg-avatar{
  background:linear-gradient(135deg,#18f0b3 0%,#2490ff 55%,#8b3dff 100%)!important;
  box-shadow:0 12px 30px rgba(23,141,255,.32),0 0 0 1px rgba(255,255,255,.12)!important;
}
.msg-client-head{
  grid-template-columns:64px 1fr auto auto!important;padding-bottom:14px!important;
}
.msg-client-head .msg-avatar{width:62px!important;height:62px!important;font-size:26px!important;}
.msg-client-head h3{font-size:24px!important;font-weight:950!important;}
.btn,.btn-primary,.btn-outline,.msg-quick{
  border-radius:14px!important;font-weight:950!important;letter-spacing:.02em!important;
}
.btn-primary,#msg-send-btn,.msg-client-head .btn-primary{
  background:linear-gradient(135deg,#238cff,#15e57e)!important;color:#fff!important;border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 14px 34px rgba(23,141,255,.28),0 0 24px rgba(25,232,132,.14)!important;
}
.btn-primary:hover,#msg-send-btn:hover{transform:translateY(-1px)!important;filter:brightness(1.08)!important;}
.btn-outline{background:rgba(7,16,34,.76)!important;border:1px solid rgba(118,168,255,.30)!important;color:#f6fbff!important;}
.msg-last-order{
  padding:18px!important;border-radius:18px!important;
  background:linear-gradient(90deg,rgba(117,48,255,.18),rgba(8,21,44,.72))!important;
  border:1px solid rgba(119,80,255,.34)!important;
}
.msg-order-icon{width:46px!important;height:46px!important;border-radius:15px!important;background:linear-gradient(135deg,rgba(130,61,255,.35),rgba(20,217,255,.10))!important;color:#b68cff!important;box-shadow:0 0 28px rgba(139,61,255,.22)!important;}
.msg-status-pill{background:rgba(25,232,132,.14)!important;color:#19e884!important;border:1px solid rgba(25,232,132,.28)!important;}
.msg-money{font-size:18px!important;color:#18ff97!important;text-shadow:0 0 18px rgba(25,232,132,.25)!important;}
.msg-order-progress{
  padding:22px!important;border-radius:20px!important;background:rgba(4,12,27,.64)!important;border:1px solid rgba(102,154,255,.22)!important;
}
.msg-order-progress h4{font-size:19px!important;margin-bottom:22px!important;}
.msg-progress-line:before{top:21px!important;height:4px!important;left:7%!important;right:7%!important;background:rgba(42,69,112,.90)!important;}
.msg-progress-line:after{top:21px!important;height:4px!important;left:7%!important;background:linear-gradient(90deg,#19e884,#16d9ff,#8b3dff)!important;box-shadow:0 0 22px rgba(22,217,255,.35)!important;}
.msg-step i{width:42px!important;height:42px!important;border:5px solid #08162e!important;margin-bottom:11px!important;position:relative!important;}
.msg-step.done i,.msg-step.active i{background:linear-gradient(135deg,#19e884,#16d9ff)!important;box-shadow:0 0 0 8px rgba(25,232,132,.13),0 0 28px rgba(22,217,255,.36)!important;}
.msg-step.done i:after,.msg-step.active i:after{content:"✓";color:#031325;font-style:normal;font-size:22px;font-weight:950;line-height:32px;}
.msg-step span{font-size:14px!important;color:inherit!important;text-shadow:0 0 14px rgba(25,232,132,.20)!important;}
.msg-step small{font-size:12px!important;color:#c0ccdd!important;font-weight:500!important;}
.msg-thread{min-height:270px!important;max-height:430px!important;padding:8px!important;}
.msg-bubble{
  border-radius:18px!important;background:linear-gradient(135deg,rgba(26,43,72,.96),rgba(10,25,48,.96))!important;
  border:1px solid rgba(118,168,255,.18)!important;box-shadow:0 18px 38px rgba(0,0,0,.25)!important;
}
.msg-bubble.admin{background:linear-gradient(135deg,#115dff,#062d8a)!important;border-color:rgba(66,151,255,.45)!important;}
.msg-reply-box{border-radius:20px!important;background:rgba(4,12,28,.70)!important;border:1px solid rgba(102,154,255,.20)!important;padding:16px!important;}
.msg-tabs .active{color:#19e8ff!important;border-bottom-color:#19e8ff!important;}
.msg-client-side{gap:18px!important;}
.msg-side-card{padding:20px!important;overflow:hidden;position:relative;}
.msg-side-card:before{content:"";position:absolute;right:-45px;top:40px;width:145px;height:145px;border-radius:50%;background:radial-gradient(circle,rgba(25,232,132,.22),rgba(37,99,255,.10),transparent 70%);filter:blur(1px);pointer-events:none;}
.msg-quick{padding:15px 16px!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.08)!important;}
.msg-quick:hover{background:linear-gradient(135deg,rgba(37,99,255,.23),rgba(139,61,255,.17))!important;border-color:rgba(103,156,255,.34)!important;transform:translateY(-1px)!important;}
.msg-summary-row{padding:3px 0!important;border-bottom:1px solid rgba(132,168,224,.10)!important;}
.msg-summary-row:last-child{border-bottom:0!important;}
.msg-summary-row b{color:#fff!important;font-size:15px!important;}
::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#238cff,#8b3dff);border-radius:999px}::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}
@media(max-width:1320px){.messages-pro-grid{grid-template-columns:350px minmax(520px,1fr) 300px!important}.sidebar{width:240px!important}}
@media(max-width:1100px){.messages-pro-grid{grid-template-columns:1fr!important}.msg-client-side{display:grid!important;grid-template-columns:repeat(3,1fr)!important}.sidebar{width:220px!important}}

/* =========================================================
   KANDU LOGISTICA ULTRA PRO - módulo despacho
   Conserva los IDs funcionales originales y solo eleva UX/UI.
   ========================================================= */
#view-pedidos{background:radial-gradient(circle at 18% 0%,rgba(14,165,233,.16),transparent 28%),radial-gradient(circle at 82% 14%,rgba(34,197,94,.12),transparent 30%),#020617;min-height:100vh;padding:0!important;color:#e5e7eb;}
.logistica-pro-shell{padding:18px 22px 28px;display:flex;flex-direction:column;gap:18px;}
.logistica-pro-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:2px;}
.logistica-title-wrap{display:flex;align-items:center;gap:16px;}
.logistica-icon{width:68px;height:68px;border-radius:20px;display:grid;place-items:center;font-size:34px;background:linear-gradient(135deg,#064e3b,#16a34a 55%,#22c55e);box-shadow:0 0 34px rgba(34,197,94,.38),inset 0 1px 0 rgba(255,255,255,.18);}
.logistica-title-wrap h2{margin:0;font-size:30px;line-height:1;font-weight:950;letter-spacing:-.04em;color:#f8fafc;text-shadow:0 0 18px rgba(255,255,255,.12);}
.logistica-title-wrap p{margin:8px 0 0;color:#94a3b8;font-size:14px;}
.logistica-head-actions{display:flex;gap:12px;align-items:center;}
.logistica-mode,.logistica-admin{border:1px solid rgba(148,163,184,.22);background:rgba(15,23,42,.68);color:#f8fafc;border-radius:14px;padding:12px 16px;font-weight:850;box-shadow:0 10px 30px rgba(0,0,0,.28);}
.logistica-admin{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1;min-width:145px;}
.logistica-admin small{color:#94a3b8;font-size:11px;margin-top:3px;}
.logistica-pro-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start;}
.logistica-main,.logistica-form-pro{display:flex;flex-direction:column;gap:14px;}
.log-card{background:linear-gradient(180deg,rgba(15,23,42,.86),rgba(3,7,18,.82));border:1px solid rgba(148,163,184,.16);border-radius:20px;box-shadow:0 22px 60px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(16px);padding:18px;position:relative;overflow:hidden;}
.log-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(34,211,238,.08),transparent 42%,rgba(168,85,247,.08));opacity:.85;}
.log-card>*{position:relative;z-index:1;}
.log-section-title{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.log-section-title span{width:25px;height:25px;border-radius:999px;display:grid;place-items:center;background:linear-gradient(135deg,#16a34a,#22c55e);color:#052e16;font-weight:950;box-shadow:0 0 18px rgba(34,197,94,.38);}
.log-section-title h3{margin:0;font-size:18px;font-weight:950;color:#f8fafc;}
.log-client-row{display:grid;grid-template-columns:minmax(280px,1fr) minmax(230px,.65fr) minmax(250px,.85fr);gap:12px;align-items:stretch;}
.log-search-field{min-height:66px;border:1px solid rgba(148,163,184,.22);border-radius:16px;background:rgba(2,6,23,.68);display:flex!important;align-items:center;gap:12px;padding:0 14px!important;color:#94a3b8;box-shadow:inset 0 0 18px rgba(0,0,0,.34);}
.log-search-field input{flex:1;border:0!important;background:transparent!important;color:#f8fafc!important;font-size:15px!important;outline:none;box-shadow:none!important;padding:0!important;}
.log-search-field kbd{border:1px solid rgba(148,163,184,.26);background:rgba(15,23,42,.95);border-radius:8px;padding:5px 8px;color:#cbd5e1;font-size:11px;}
.log-hidden-field{position:absolute!important;left:-9999px!important;opacity:0!important;height:0!important;width:0!important;overflow:hidden!important;}
.log-client-card{display:flex;gap:12px;align-items:center;border:1px solid rgba(34,197,94,.25);background:linear-gradient(135deg,rgba(6,78,59,.72),rgba(2,6,23,.7));border-radius:16px;padding:12px;min-height:66px;}
.log-avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:30px;background:linear-gradient(135deg,#22c55e,#0ea5e9);box-shadow:0 0 26px rgba(34,197,94,.35);}
.log-client-card strong{font-size:16px;color:#fff;}.log-client-meta{color:#94a3b8;font-size:12px;margin-top:3px}.log-mini-row{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap;}
.log-contact-card{border:1px solid rgba(148,163,184,.16);background:rgba(15,23,42,.55);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:8px;color:#cbd5e1;font-size:13px;}
.log-contact-card b{font-weight:750;color:#f8fafc;}
.log-ai-suggestion{margin-top:14px;border:1px solid rgba(34,197,94,.25);background:linear-gradient(135deg,rgba(6,78,59,.58),rgba(2,6,23,.72));border-radius:16px;padding:14px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;box-shadow:0 0 24px rgba(34,197,94,.10);}
.log-ai-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(34,197,94,.16);font-size:26px;color:#22c55e;}.log-ai-suggestion b{color:#22c55e}.log-ai-suggestion p{margin:3px 0 0;color:#cbd5e1;font-size:14px;}
.log-cylinders{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;}
.log-cylinder{min-height:126px;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.72);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;position:relative;cursor:pointer;transition:.22s ease;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 16px 32px rgba(0,0,0,.22);}
.log-cylinder:hover{transform:translateY(-4px) scale(1.025);box-shadow:0 22px 45px rgba(0,0,0,.36),0 0 28px var(--glow,rgba(255,255,255,.12));}
.log-cylinder i{font-style:normal;font-size:38px;filter:drop-shadow(0 0 12px var(--glow,rgba(255,255,255,.25)));}.log-cylinder b{font-size:22px;font-weight:950}.log-cylinder small{color:#cbd5e1;font-size:13px}.log-cylinder em{position:absolute;right:0;top:0;width:44px;height:44px;border-radius:0 16px 0 24px;display:grid;place-items:center;background:#4ade80;color:#052e16;font-style:normal;font-weight:950;}
.log-cylinder.green{--glow:rgba(34,197,94,.48);border-color:rgba(34,197,94,.35)}.log-cylinder.blue{--glow:rgba(14,165,233,.48);border-color:rgba(14,165,233,.35)}.log-cylinder.yellow{--glow:rgba(250,204,21,.48);border-color:rgba(250,204,21,.35)}.log-cylinder.purple{--glow:rgba(168,85,247,.56);border-color:rgba(168,85,247,.45)}.log-cylinder.orange{--glow:rgba(249,115,22,.48);border-color:rgba(249,115,22,.35)}.log-cylinder.active{background:linear-gradient(135deg,rgba(88,28,135,.55),rgba(15,23,42,.8));box-shadow:0 0 34px var(--glow),inset 0 1px 0 rgba(255,255,255,.09);transform:translateY(-2px);}
.log-native-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px;}.log-native-fields label{font-size:12px;color:#94a3b8;display:flex;flex-direction:column;gap:5px}.log-native-fields input,.log-native-fields select{border:1px solid rgba(148,163,184,.2);background:rgba(2,6,23,.75);border-radius:12px;padding:11px 12px;color:#f8fafc;}
#view-pedidos .multi-cylinders{margin-top:14px;border:1px dashed rgba(148,163,184,.22);border-radius:16px;padding:14px;background:rgba(2,6,23,.38);}#view-pedidos .pedido-items-list{display:flex;flex-direction:column;gap:8px;margin:10px 0;}
.log-points-card{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:0;overflow:hidden}.log-stat{padding:18px;border-right:1px solid rgba(148,163,184,.12);display:flex;flex-direction:column;gap:6px;min-height:92px}.log-stat:last-child{border-right:0}.log-stat span{font-size:12px;color:#94a3b8}.log-stat b{font-size:17px;color:#f8fafc}.log-stat small{color:#94a3b8;font-size:12px}.log-hidden-points{display:none!important}.log-form-actions{display:flex;justify-content:flex-end;gap:12px}.log-submit{min-width:260px;display:flex!important;flex-direction:column;align-items:center;gap:3px;border-radius:18px!important;padding:16px!important;font-size:17px!important;box-shadow:0 0 35px rgba(34,197,94,.38)!important}.log-submit small,.log-side-submit small{display:block;font-size:12px;font-weight:700;color:#dcfce7;margin-top:4px;}
.logistica-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:14px}.log-summary h3,.log-delivery-card h3{margin:0 0 16px;font-size:18px;color:#f8fafc}.log-summary-line{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid rgba(148,163,184,.12);gap:12px}.log-summary-line span{display:flex;align-items:center;gap:9px;color:#e5e7eb}.dot{width:14px;height:14px;border-radius:50%;display:inline-block}.dot.purple{background:#a855f7;box-shadow:0 0 16px #a855f7}.muted-line{color:#cbd5e1}.log-total-row{display:flex;justify-content:space-between;align-items:end;padding:18px 0 12px}.log-total-row span{font-size:13px;font-weight:950;color:#22c55e}.log-total-row b{font-size:34px;letter-spacing:-.04em;color:#22c55e;text-shadow:0 0 24px rgba(34,197,94,.5)}.log-points-glow{display:flex;align-items:center;gap:14px;border:1px solid rgba(168,85,247,.28);border-radius:16px;background:linear-gradient(135deg,rgba(88,28,135,.55),rgba(30,41,59,.65));padding:18px;font-size:30px;box-shadow:0 0 28px rgba(168,85,247,.16)}.log-points-glow div{font-size:13px;color:#cbd5e1}.log-points-glow b{display:block;font-size:22px;color:#facc15;margin-top:6px}.log-delivery-row{display:grid;grid-template-columns:24px 82px 1fr;gap:8px;align-items:center;background:rgba(15,23,42,.55);border:1px solid rgba(148,163,184,.10);border-radius:12px;padding:12px;margin-bottom:8px;color:#cbd5e1}.log-delivery-row b{color:#f8fafc;text-align:right;font-size:13px}.log-side-submit{width:100%;border-radius:18px!important;padding:18px!important;margin-top:12px;font-size:19px!important;box-shadow:0 0 38px rgba(34,197,94,.42)!important}.log-active-orders{margin-top:4px;overflow-x:auto}.log-active-orders .table{min-width:850px;}
@media(max-width:1200px){.logistica-pro-grid{grid-template-columns:1fr}.logistica-side{position:static}.log-client-row{grid-template-columns:1fr}.log-cylinders{grid-template-columns:repeat(2,minmax(0,1fr))}.log-points-card{grid-template-columns:repeat(2,minmax(0,1fr))}.log-native-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.logistica-pro-shell{padding:12px}.logistica-pro-head{flex-direction:column;align-items:flex-start}.logistica-head-actions{width:100%}.logistica-mode,.logistica-admin{flex:1}.log-cylinders{grid-template-columns:1fr}.log-points-card{grid-template-columns:1fr}.log-native-fields{grid-template-columns:1fr}.log-total-row b{font-size:28px}}

/* =========================================================
   KANDU LOGISTICA PERFECTA - UX intuitiva conservando diseño
   ========================================================= */
body.view-pedidos-active .topbar{display:none!important;}
body.view-pedidos-active .main{padding-top:0!important;}
body.view-pedidos-active #view-pedidos{border-radius:0!important;}
body.view-pedidos-active .sidebar{position:sticky;top:0;height:100vh;}
#view-pedidos .logistica-pro-shell{padding:24px 26px 30px;gap:20px;}
#view-pedidos .logistica-pro-head{padding:8px 4px 4px;}
#view-pedidos .logistica-title-wrap h2{font-size:32px;text-shadow:0 0 24px rgba(255,255,255,.16),0 0 30px rgba(34,197,94,.10);}
#view-pedidos .logistica-icon{background:linear-gradient(135deg,#052e16,#16a34a 48%,#0ea5e9);box-shadow:0 0 42px rgba(34,197,94,.42),0 0 80px rgba(14,165,233,.13),inset 0 1px 0 rgba(255,255,255,.2);}
#view-pedidos .log-card{border-color:rgba(125,160,230,.22);background:linear-gradient(180deg,rgba(16,24,45,.9),rgba(4,10,24,.86));}
#view-pedidos .log-card:hover{border-color:rgba(34,211,238,.28);}
#view-pedidos .log-section-title span{width:28px;height:28px;font-size:15px;color:#052e16;}
#view-pedidos .log-search-field{min-height:72px;border-color:rgba(125,160,230,.28);}
#view-pedidos .log-search-field:focus-within{border-color:rgba(34,211,238,.55);box-shadow:0 0 0 3px rgba(34,211,238,.08),inset 0 0 18px rgba(0,0,0,.34);}
#view-pedidos .log-ai-suggestion{border-color:rgba(34,197,94,.38);background:linear-gradient(135deg,rgba(5,80,62,.72),rgba(3,11,26,.78));}
#view-pedidos .log-ai-suggestion .btn{min-width:170px;font-weight:950;border-color:rgba(34,197,94,.4);}
#view-pedidos .log-cylinders{gap:16px;}
#view-pedidos .log-cylinder{min-height:138px;isolation:isolate;overflow:hidden;}
#view-pedidos .log-cylinder i{font-size:0;width:44px;height:58px;border-radius:10px 10px 14px 14px;display:block;background:linear-gradient(90deg,rgba(255,255,255,.22),transparent 35%),var(--cyl,#22c55e);box-shadow:inset -8px 0 18px rgba(0,0,0,.22),0 10px 22px var(--glow);position:relative;}
#view-pedidos .log-cylinder i:before{content:"";position:absolute;left:11px;right:11px;top:-8px;height:12px;border-radius:6px 6px 2px 2px;background:inherit;filter:brightness(1.1);}
#view-pedidos .log-cylinder.green{--cyl:linear-gradient(180deg,#4ade80,#16a34a)}
#view-pedidos .log-cylinder.blue{--cyl:linear-gradient(180deg,#38bdf8,#0284c7)}
#view-pedidos .log-cylinder.yellow{--cyl:linear-gradient(180deg,#fde047,#eab308)}
#view-pedidos .log-cylinder.purple{--cyl:linear-gradient(180deg,#c084fc,#7e22ce)}
#view-pedidos .log-cylinder.orange{--cyl:linear-gradient(180deg,#fb923c,#ea580c)}
#view-pedidos .log-cylinder.active{border-width:2px;}
#view-pedidos .log-cylinder b{font-size:24px;letter-spacing:-.03em;}
#view-pedidos .log-native-fields input:not([disabled]),#view-pedidos .log-native-fields select{min-height:46px;font-weight:800;}
#view-pedidos .log-native-fields input:focus,#view-pedidos .log-native-fields select:focus{outline:none;border-color:rgba(34,211,238,.55);box-shadow:0 0 0 3px rgba(34,211,238,.08);}
#view-pedidos .multi-cylinders{background:linear-gradient(180deg,rgba(2,6,23,.62),rgba(15,23,42,.36))!important;}
#view-pedidos .pedido-items-list .pedido-item,.pedido-items-list>div{border-radius:14px!important;background:rgba(15,23,42,.68)!important;border:1px solid rgba(148,163,184,.14)!important;}
#view-pedidos .log-form-actions{position:sticky;bottom:0;z-index:4;padding:12px 0;background:linear-gradient(180deg,transparent,#020617 42%);}
#view-pedidos .log-submit,#view-pedidos .log-side-submit{background:linear-gradient(135deg,#0ea5e9,#22c55e)!important;border:1px solid rgba(255,255,255,.14)!important;color:#fff!important;text-shadow:0 1px 0 rgba(0,0,0,.24);}
#view-pedidos .log-submit:hover,#view-pedidos .log-side-submit:hover{transform:translateY(-2px) scale(1.015);box-shadow:0 0 55px rgba(34,197,94,.55)!important;}
#view-pedidos .log-summary{border-color:rgba(168,85,247,.27);}
#view-pedidos .log-total-row b{font-size:38px;}
#view-pedidos .log-delivery-card{border-color:rgba(34,197,94,.22);}
#view-pedidos .log-active-orders{padding:20px;}
#view-pedidos .log-active-orders .table{border-collapse:separate;border-spacing:0 10px;background:transparent!important;}
#view-pedidos .log-active-orders .table thead th{background:rgba(2,6,23,.88);color:#aab8d6;text-transform:uppercase;font-size:11px;letter-spacing:.06em;border:0!important;padding:12px;}
#view-pedidos .log-active-orders .table tbody tr{background:linear-gradient(180deg,rgba(15,23,42,.76),rgba(7,12,28,.9));box-shadow:0 12px 28px rgba(0,0,0,.22);}
#view-pedidos .log-active-orders .table tbody td{border-top:1px solid rgba(148,163,184,.10)!important;border-bottom:1px solid rgba(148,163,184,.10)!important;padding:15px 12px;vertical-align:middle;}
#view-pedidos .log-active-orders .table tbody td:first-child{border-left:1px solid rgba(148,163,184,.10)!important;border-radius:16px 0 0 16px;}
#view-pedidos .log-active-orders .table tbody td:last-child{border-right:1px solid rgba(148,163,184,.10)!important;border-radius:0 16px 16px 0;}
#view-pedidos .log-active-orders .btn{margin:2px;border-radius:11px!important;}
#view-pedidos .log-active-orders .badge{padding:7px 10px;border-radius:999px;font-weight:950;letter-spacing:.02em;}
@media(max-width:1380px){#view-pedidos .logistica-pro-grid{grid-template-columns:minmax(0,1fr) 340px;}#view-pedidos .log-cylinders{grid-template-columns:repeat(5,minmax(118px,1fr));}#view-pedidos .log-cylinder{min-height:125px}}

/* =========================================================
   KANDU AJUSTE FINAL: logística + inventario + pedidos
   Más intuitivo: datos grandes, pipetas balanceadas, tablas pro.
   ========================================================= */
#view-pedidos .log-client-row{grid-template-columns:minmax(360px,1.15fr) minmax(250px,.72fr) minmax(360px,1fr)!important;gap:16px!important;}
#view-pedidos .log-contact-card{padding:16px 18px!important;gap:12px!important;background:linear-gradient(180deg,rgba(8,20,42,.82),rgba(4,10,24,.88))!important;border-color:rgba(73,122,201,.28)!important;}
#view-pedidos .log-contact-card span{display:grid!important;grid-template-columns:26px 1fr!important;align-items:start!important;font-size:15.5px!important;line-height:1.25!important;color:#dce8ff!important;}
#view-pedidos .log-contact-card b{font-size:16.5px!important;color:#fff!important;font-weight:950!important;letter-spacing:.01em!important;}
#view-pedidos .log-delivery-row{grid-template-columns:26px 86px minmax(0,1fr)!important;padding:14px 15px!important;font-size:14.5px!important;}
#view-pedidos .log-delivery-row b{font-size:15.5px!important;text-align:left!important;line-height:1.2!important;overflow-wrap:anywhere!important;}
#view-pedidos .log-cylinders{grid-template-columns:repeat(5,minmax(142px,1fr))!important;gap:12px!important;}
#view-pedidos .log-cylinder{min-height:106px!important;padding:12px 10px!important;border-radius:16px!important;gap:5px!important;}
#view-pedidos .log-cylinder i{width:34px!important;height:44px!important;border-radius:8px 8px 12px 12px!important;}
#view-pedidos .log-cylinder i:before{left:9px!important;right:9px!important;top:-7px!important;height:10px!important;}
#view-pedidos .log-cylinder b{font-size:19px!important;}
#view-pedidos .log-cylinder small{font-size:12px!important;}
#view-pedidos .log-cylinder em{width:32px!important;height:32px!important;border-radius:0 14px 0 18px!important;font-size:14px!important;}
#view-pedidos .log-cylinder:after{content:"";position:absolute;right:10px;top:10px;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.65);background:rgba(2,6,23,.42);box-shadow:inset 0 0 0 3px rgba(2,6,23,.55);}
#view-pedidos .log-cylinder.active:after{background:linear-gradient(135deg,#22c55e,#15e8ff);border-color:rgba(255,255,255,.9);box-shadow:0 0 18px rgba(34,197,94,.45);}
#view-pedidos .log-cylinder.purple.active:before{content:"⭐ Más vendido";position:absolute;left:10px;bottom:8px;padding:3px 8px;border-radius:999px;background:rgba(88,28,135,.92);border:1px solid rgba(192,132,252,.55);font-size:10px;font-weight:950;color:#fff;}
#view-pedidos .log-native-fields{grid-template-columns:190px 150px minmax(260px,1fr) minmax(220px,.7fr)!important;align-items:end!important;}
#view-pedidos .log-native-fields label{font-size:13px!important;font-weight:850!important;}
#view-pedidos .log-native-fields input,#view-pedidos .log-native-fields select{font-size:15px!important;}
#view-pedidos .log-active-orders .kandu-address{font-size:14.5px!important;color:#f8fafc!important;line-height:1.25!important;}
#view-pedidos .kandu-lb-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:rgba(168,85,247,.16);border:1px solid rgba(168,85,247,.28);font-weight:950;color:#f5e8ff;}
#view-pedidos .kandu-actions{min-width:310px!important;}
#view-pedidos .kandu-actions .btn{font-size:12px!important;padding:8px 10px!important;}

#view-inventario{background:radial-gradient(circle at 22% 0%,rgba(14,165,233,.13),transparent 32%),radial-gradient(circle at 84% 12%,rgba(34,197,94,.10),transparent 30%),#020617;min-height:100vh;padding:20px!important;}
#view-inventario>.card{background:linear-gradient(180deg,rgba(15,23,42,.88),rgba(4,10,24,.9))!important;border-color:rgba(116,158,220,.22)!important;border-radius:22px!important;box-shadow:0 22px 60px rgba(0,0,0,.36)!important;}
#view-inventario>.card>.table-header h3{font-size:24px!important;font-weight:950!important;letter-spacing:-.03em!important;}
#view-inventario .table-header{align-items:center!important;padding-bottom:14px!important;}
.inv-kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 18px;}
.inv-kpi-row>div{min-height:112px;border-radius:18px;padding:20px 22px;background:linear-gradient(145deg,rgba(15,23,42,.88),rgba(3,12,26,.92));border:1px solid rgba(116,158,220,.18);box-shadow:0 18px 45px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.05);position:relative;overflow:hidden;}
.inv-kpi-row>div:after{content:"";position:absolute;right:-35px;top:-35px;width:115px;height:115px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.16),transparent 65%);}
.inv-kpi-row span{display:block;color:#bac7dc;font-weight:850;font-size:14px;margin-bottom:8px;}
.inv-kpi-row b{display:block;color:#fff;font-size:32px;line-height:1;font-weight:950;letter-spacing:-.04em;}
.inv-kpi-row small{display:block;margin-top:10px;color:#95a3b9;font-size:13px;}
.inv-table-pro{border-collapse:separate!important;border-spacing:0!important;overflow:hidden;border-radius:18px!important;}
.inv-table-pro thead th{background:rgba(2,6,23,.86)!important;color:#b8c5dc!important;text-transform:uppercase;font-size:12px!important;letter-spacing:.06em!important;padding:15px 16px!important;border:0!important;}
.inv-table-pro tbody td{font-size:15px!important;padding:15px 16px!important;border-bottom:1px solid rgba(148,163,184,.11)!important;}
.inv-table-pro tbody tr:hover td{background:rgba(14,165,233,.06)!important;}
.ok-num{color:#19e884!important;font-weight:950!important;}.purple-num{color:#b278ff!important;font-weight:950!important;}
#view-inventario .btn{min-height:44px!important;padding:10px 16px!important;}
#view-inventario .btn-primary{background:linear-gradient(135deg,#16a34a,#22c55e)!important;box-shadow:0 0 24px rgba(34,197,94,.25)!important;}
#view-inventario .btn-danger-strong{background:linear-gradient(135deg,#991b1b,#ef4444)!important;box-shadow:0 0 24px rgba(239,68,68,.2)!important;}
#view-inventario #tabla-inv-movs,#view-inventario .card .table{font-size:14px!important;}

/* Vista Pedidos: limpieza tipo dashboard de rutas */
#view-pedidos_hoy{background:radial-gradient(circle at 18% 0%,rgba(34,197,94,.12),transparent 32%),#020617;min-height:100vh;padding:20px!important;}
#view-pedidos_hoy .card{border-radius:22px!important;background:linear-gradient(180deg,rgba(15,23,42,.88),rgba(4,10,24,.9))!important;border-color:rgba(116,158,220,.20)!important;box-shadow:0 22px 60px rgba(0,0,0,.33)!important;}
#view-pedidos_hoy .table thead th{background:rgba(2,6,23,.86)!important;text-transform:uppercase;font-size:12px!important;letter-spacing:.06em!important;color:#b8c5dc!important;}
#view-pedidos_hoy .table tbody td{font-size:14.5px!important;padding:15px!important;}

@media(max-width:1420px){#view-pedidos .log-client-row{grid-template-columns:1fr 280px!important;}#view-pedidos .log-contact-card{grid-column:1 / -1!important;}#view-pedidos .log-cylinders{grid-template-columns:repeat(5,minmax(120px,1fr))!important}.inv-kpi-row{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:900px){#view-pedidos .log-cylinders{grid-template-columns:repeat(2,minmax(0,1fr))!important}#view-pedidos .log-native-fields{grid-template-columns:1fr!important}.inv-kpi-row{grid-template-columns:1fr;}}

/* =========================================================
   KANDU PANEL ULTRA PREMIUM 2026
   Mejora visual global sin tocar IDs ni lógica funcional.
   ========================================================= */
:root{
  --k-bg:#050816;
  --k-bg2:#07111f;
  --k-card:rgba(12,18,34,.78);
  --k-card2:rgba(5,10,24,.92);
  --k-border:rgba(155,180,220,.18);
  --k-text:#f8fbff;
  --k-muted:#9fb0c9;
  --k-green:#20e070;
  --k-green2:#0fbf64;
  --k-blue:#21b9ff;
  --k-purple:#a855f7;
  --k-gold:#f8c84a;
  --k-red:#ff5b6b;
  --k-shadow:0 24px 70px rgba(0,0,0,.42);
  --k-soft:0 14px 38px rgba(0,0,0,.28);
}
html{background:#030712;}
body{
  color:var(--k-text)!important;
  background:
    radial-gradient(circle at 10% -8%,rgba(32,224,112,.16),transparent 32%),
    radial-gradient(circle at 76% 2%,rgba(33,185,255,.14),transparent 34%),
    radial-gradient(circle at 50% 105%,rgba(168,85,247,.10),transparent 38%),
    linear-gradient(135deg,#030712 0%,#06101f 48%,#020617 100%)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:38px 38px;
  mask-image:radial-gradient(circle at 50% 8%,#000 0%,transparent 72%);
}
.layout{background:transparent!important;}
.sidebar{
  width:265px!important;
  background:linear-gradient(180deg,rgba(3,7,18,.96),rgba(7,12,26,.94))!important;
  border-right:1px solid rgba(148,163,184,.18)!important;
  box-shadow:18px 0 60px rgba(0,0,0,.26)!important;
  backdrop-filter:blur(22px);
  position:relative;
  overflow:hidden;
}
.sidebar:before{
  content:"";
  position:absolute;
  inset:-160px -80px auto auto;
  width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,rgba(32,224,112,.22),transparent 68%);
  pointer-events:none;
}
.brand{
  padding:12px;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 35px rgba(0,0,0,.22);
}
.brand-logo{
  width:54px!important;height:54px!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#0f172a,#123c32 48%,#20e070)!important;
  box-shadow:0 0 32px rgba(32,224,112,.28),inset 0 1px 0 rgba(255,255,255,.16)!important;
  overflow:hidden;
}
.brand-logo img{width:100%;height:100%;object-fit:cover;transform:scale(1.16);}
.brand-title{font-size:14px!important;font-weight:950!important;letter-spacing:-.02em;color:#fff!important;}
.brand-subtitle{font-size:11px!important;text-transform:uppercase;letter-spacing:.12em;color:#9fb0c9!important;margin-top:3px;}
.menu{gap:8px!important;}
.menu-item{
  position:relative;
  min-height:48px;
  border-radius:16px!important;
  padding:13px 14px!important;
  color:#dbe7ff!important;
  font-weight:820;
  letter-spacing:-.01em;
  border:1px solid transparent!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.menu-item:hover{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.10)!important;transform:translateX(3px);}
.menu-item.active{
  background:linear-gradient(135deg,rgba(32,224,112,.94),rgba(15,185,255,.82))!important;
  color:#04110b!important;
  box-shadow:0 16px 34px rgba(32,224,112,.24),inset 0 1px 0 rgba(255,255,255,.32)!important;
  font-weight:950!important;
}
.menu-item.active:after{
  content:"";position:absolute;right:10px;top:50%;width:7px;height:7px;border-radius:50%;
  transform:translateY(-50%);background:#04110b;box-shadow:0 0 0 5px rgba(4,17,11,.10);
}
.main{padding:22px 28px 30px!important;}
.topbar{
  min-height:76px;
  padding:12px 16px;
  border-radius:24px;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:var(--k-soft);
  backdrop-filter:blur(18px);
  margin-bottom:20px!important;
}
.topbar-left h1{font-size:26px!important;font-weight:950!important;letter-spacing:-.04em;color:#fff!important;}
.topbar-left p{font-size:13px!important;color:var(--k-muted)!important;margin-top:5px!important;}
.chip,.badge{
  font-weight:900!important;
  border-radius:999px!important;
}
.chip-outline{border-color:rgba(255,255,255,.14)!important;background:rgba(5,10,24,.58)!important;color:#dbe7ff!important;}
.iconbtn{
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.07)!important;
  color:#fff!important;
  border-radius:16px!important;
  min-width:46px!important;height:46px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.btn{
  border-radius:16px!important;
  font-weight:950!important;
  letter-spacing:-.01em;
  border:1px solid rgba(255,255,255,.12)!important;
  background:linear-gradient(180deg,rgba(30,41,59,.88),rgba(15,23,42,.92))!important;
  box-shadow:0 12px 25px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.08)!important;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease!important;
}
.btn:hover{opacity:1!important;transform:translateY(-2px);filter:saturate(1.12);}
.btn-primary,.menu-item.active,.btn-success{
  background:linear-gradient(135deg,#20e070,#0fbf64 48%,#21b9ff)!important;
  color:#03140c!important;
  border-color:rgba(255,255,255,.20)!important;
  box-shadow:0 18px 38px rgba(32,224,112,.24),inset 0 1px 0 rgba(255,255,255,.32)!important;
}
.btn-outline{background:rgba(255,255,255,.055)!important;color:#eaf2ff!important;border-color:rgba(255,255,255,.14)!important;}
.btn-danger{background:linear-gradient(135deg,rgba(239,68,68,.28),rgba(127,29,29,.58))!important;color:#ffd8dd!important;border-color:rgba(255,91,107,.32)!important;}
.card,.login-card,.modal-inner{
  background:linear-gradient(180deg,var(--k-card),var(--k-card2))!important;
  border:1px solid var(--k-border)!important;
  border-radius:24px!important;
  box-shadow:var(--k-shadow),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(18px);
  position:relative;
  overflow:hidden;
}
.card:before,.login-card:before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(135deg,rgba(33,185,255,.08),transparent 35%,rgba(32,224,112,.075));
}
.card>*{position:relative;z-index:1;}
.hero{
  border-radius:30px!important;
  padding:30px!important;
  background:
    radial-gradient(circle at 88% 12%,rgba(32,224,112,.22),transparent 28%),
    linear-gradient(135deg,rgba(9,20,42,.92),rgba(5,11,26,.95))!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 28px 75px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08)!important;
  margin-bottom:18px!important;
}
.hero-title{font-size:36px!important;font-weight:1000!important;letter-spacing:-.055em;color:#fff!important;line-height:.95!important;}
.hero-sub{font-size:15px!important;color:#b8c7df!important;margin-top:10px!important;}
.hero-actions{gap:12px!important;}
.cards-row{gap:16px!important;}
.kpi{min-height:116px!important;padding:20px!important;}
.card-label{font-size:12px!important;text-transform:uppercase;letter-spacing:.09em;color:#9fb0c9!important;font-weight:900!important;}
.card-value{font-size:34px!important;font-weight:1000!important;letter-spacing:-.045em;color:#fff!important;text-shadow:0 0 22px rgba(32,224,112,.18);}
.card-caption{font-size:13px!important;color:#8ea2bf!important;}
.table-header{margin-bottom:14px!important;gap:12px!important;}
.table-header h3{font-size:19px!important;font-weight:950!important;letter-spacing:-.025em;color:#fff!important;}
.tip{color:#92a6c4!important;font-weight:700!important;}
.table{border-collapse:separate!important;border-spacing:0 8px!important;}
.table th{
  border:0!important;
  color:#a9bad3!important;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:11px!important;
  font-weight:900!important;
  padding:11px 12px!important;
}
.table td{
  background:rgba(255,255,255,.035);
  border-top:1px solid rgba(255,255,255,.07)!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
  padding:13px 12px!important;
  color:#eaf2ff!important;
}
.table tbody tr td:first-child{border-left:1px solid rgba(255,255,255,.07)!important;border-radius:16px 0 0 16px!important;}
.table tbody tr td:last-child{border-right:1px solid rgba(255,255,255,.07)!important;border-radius:0 16px 16px 0!important;}
.table tbody tr:hover td{background:rgba(33,185,255,.065)!important;}
input,select,textarea,.input{
  background:rgba(2,6,23,.72)!important;
  border:1px solid rgba(180,205,240,.18)!important;
  border-radius:16px!important;
  color:#f8fbff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(32,224,112,.58)!important;
  box-shadow:0 0 0 4px rgba(32,224,112,.10),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
label{font-weight:850!important;color:#cbd8ef!important;}
.form-card,.form-section{border-radius:24px!important;}
.sparkline{border-radius:18px!important;background:rgba(2,6,23,.55)!important;border:1px solid rgba(255,255,255,.08)!important;}
.muted{color:#91a4c1!important;}
.badge.ok,.badge-verde{background:rgba(32,224,112,.16)!important;color:#76ffb0!important;border:1px solid rgba(32,224,112,.32)!important;}
.badge.warn,.badge-amarillo{background:rgba(248,200,74,.15)!important;color:#ffe28c!important;border:1px solid rgba(248,200,74,.30)!important;}
.badge.danger,.badge-rojo{background:rgba(255,91,107,.15)!important;color:#ffb3bd!important;border:1px solid rgba(255,91,107,.30)!important;}
.badge-azul{background:rgba(33,185,255,.15)!important;color:#8fdfff!important;border:1px solid rgba(33,185,255,.30)!important;}
/* Vistas principales con aire premium */
.view{animation:kanduFade .22s ease both;}
@keyframes kanduFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
#view-dashboard,#view-clientes,#view-alertas,#view-repartidores,#view-ajustes,#view-precios,#view-mensajes,#view-contabilidad{
  background:transparent!important;
}
#view-clientes .card,#view-alertas .card,#view-repartidores .card,#view-precios .card,#view-ajustes .card,#view-mensajes .card{margin-bottom:16px;}
/* Responsive premium */
@media(max-width:1100px){
  .main{padding:16px!important;}
  .cards-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .hero{padding:22px!important;}
  .hero-title{font-size:30px!important;}
}
@media(max-width:900px){
  .sidebar{width:auto!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.10)!important;}
  .brand{margin-bottom:10px!important;}
  .menu-item:hover{transform:none;}
  .topbar{border-radius:20px!important;align-items:flex-start!important;gap:12px!important;}
  .topbar-right{flex-wrap:wrap;justify-content:flex-start!important;}
}
@media(max-width:620px){
  .cards-row{grid-template-columns:1fr!important;}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;width:100%;}
  .hero{display:flex!important;flex-direction:column!important;gap:16px!important;}
  .table{font-size:12px!important;}
}

/* =========================================================
   KANDU FIX DIRECTO v24 - Pedido compacto + datos visibles
   Objetivo: cilindros menos grandes, dirección/teléfono prioritarios.
   ========================================================= */
#view-pedidos .log-card:has(.log-cylinders){
  position:relative;
  overflow:hidden;
  padding:18px!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(7,15,31,.96),rgba(3,8,20,.98))!important;
  border:1px solid rgba(148,163,184,.20)!important;
}
#view-pedidos .log-card:has(.log-cylinders)::before{
  content:"";
  position:absolute;
  inset:-80px -120px auto auto;
  width:300px;
  height:180px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(34,211,238,.16),transparent 68%);
  pointer-events:none;
}
#view-pedidos .log-card:has(.log-cylinders) > *{position:relative;z-index:1;}

/* Selector de cilindros: compacto, empresarial, sin bloquear la vista */
#view-pedidos .log-cylinders{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(104px,1fr))!important;
  gap:8px!important;
  margin-top:12px!important;
}
#view-pedidos .log-cylinder{
  min-height:76px!important;
  height:76px!important;
  padding:10px 12px 10px 42px!important;
  border-radius:16px!important;
  gap:1px!important;
  align-items:flex-start!important;
  justify-content:center!important;
  text-align:left!important;
  background:linear-gradient(180deg,rgba(15,23,42,.74),rgba(2,6,23,.82))!important;
  box-shadow:0 10px 22px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05)!important;
  transform:none!important;
}
#view-pedidos .log-cylinder:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 14px 26px rgba(0,0,0,.28),0 0 16px var(--glow,rgba(255,255,255,.10))!important;
}
#view-pedidos .log-cylinder i{
  position:absolute!important;
  left:12px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:18px!important;
  height:30px!important;
  border-radius:5px 5px 8px 8px!important;
  box-shadow:inset -5px 0 10px rgba(0,0,0,.22),0 7px 14px var(--glow)!important;
}
#view-pedidos .log-cylinder i:before{
  left:5px!important;
  right:5px!important;
  top:-5px!important;
  height:7px!important;
  border-radius:4px 4px 2px 2px!important;
}
#view-pedidos .log-cylinder b{
  font-size:16px!important;
  line-height:1!important;
  letter-spacing:-.02em!important;
}
#view-pedidos .log-cylinder small{
  font-size:12.5px!important;
  line-height:1.1!important;
  color:#dbeafe!important;
  font-weight:800!important;
}
#view-pedidos .log-cylinder em{
  width:24px!important;
  height:24px!important;
  right:7px!important;
  top:7px!important;
  border-radius:999px!important;
  font-size:12px!important;
  background:linear-gradient(135deg,#22c55e,#67e8f9)!important;
  color:#031019!important;
}
#view-pedidos .log-cylinder:after{display:none!important;}
#view-pedidos .log-cylinder.purple.active:before{display:none!important;}
#view-pedidos .log-cylinder.active{
  border:1.5px solid rgba(34,211,238,.70)!important;
  background:linear-gradient(135deg,rgba(6,95,70,.50),rgba(30,41,59,.78))!important;
  box-shadow:0 0 0 3px rgba(34,211,238,.08),0 14px 28px rgba(0,0,0,.26)!important;
}

/* Campos del pedido: Dirección y teléfono grandes, claros y operables */
#view-pedidos .log-native-fields{
  display:grid!important;
  grid-template-columns:120px 120px minmax(340px,1.5fr) minmax(230px,.9fr)!important;
  gap:10px!important;
  align-items:end!important;
  margin-top:14px!important;
}
#view-pedidos .log-native-fields label{
  color:#b7c6df!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
}
#view-pedidos .log-native-fields input,
#view-pedidos .log-native-fields select{
  min-height:48px!important;
  border-radius:15px!important;
  padding:12px 14px!important;
  font-size:15px!important;
  font-weight:850!important;
  background:rgba(2,6,23,.72)!important;
  border:1px solid rgba(148,163,184,.28)!important;
}
#view-pedidos .log-native-fields label:has(#pedido-direccion),
#view-pedidos .log-native-fields label:has(#pedido-telefono-view){
  color:#f8fafc!important;
}
#view-pedidos #pedido-direccion,
#view-pedidos #pedido-telefono-view{
  min-height:58px!important;
  font-size:17px!important;
  color:#ffffff!important;
  background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,18,36,.96))!important;
  border:1px solid rgba(34,211,238,.30)!important;
  box-shadow:0 12px 26px rgba(0,0,0,.18)!important;
  opacity:1!important;
  -webkit-text-fill-color:#fff!important;
}
#view-pedidos label:has(#pedido-direccion)::before{content:"📍 Dirección del pedido";display:block;margin-bottom:5px;color:#e8f2ff;font-size:13px;font-weight:950;}
#view-pedidos label:has(#pedido-telefono-view)::before{content:"📞 Teléfono";display:block;margin-bottom:5px;color:#e8f2ff;font-size:13px;font-weight:950;}
#view-pedidos label:has(#pedido-direccion),
#view-pedidos label:has(#pedido-telefono-view){font-size:0!important;gap:0!important;}

/* Resumen del pedido más limpio */
#view-pedidos .multi-cylinders{
  margin-top:12px!important;
  padding:12px!important;
  border-radius:18px!important;
  border:1px solid rgba(34,211,238,.16)!important;
  background:linear-gradient(180deg,rgba(2,6,23,.58),rgba(15,23,42,.42))!important;
}
#view-pedidos .multi-head{
  margin-bottom:8px!important;
  align-items:center!important;
}
#view-pedidos .multi-head b{
  font-size:15px!important;
  color:#fff!important;
}
#view-pedidos .multi-head .muted{
  font-size:12px!important;
  color:#9fb0ca!important;
}
#view-pedidos .pedido-extra-item{
  grid-template-columns:minmax(120px,1fr) 92px auto!important;
}
#view-pedidos #btn-add-pedido-item{
  min-height:38px!important;
  border-radius:14px!important;
}

@media(max-width:1250px){
  #view-pedidos .log-cylinders{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  #view-pedidos .log-native-fields{grid-template-columns:1fr 1fr!important;}
  #view-pedidos .log-native-fields label:has(#pedido-direccion){grid-column:1 / -1!important;}
  #view-pedidos .log-native-fields label:has(#pedido-telefono-view){grid-column:1 / -1!important;}
}
@media(max-width:700px){
  #view-pedidos .log-cylinders{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-pedidos .log-cylinder{height:70px!important;min-height:70px!important;padding-left:40px!important;}
  #view-pedidos .log-native-fields{grid-template-columns:1fr!important;}
  #view-pedidos .multi-head{align-items:flex-start!important;flex-direction:column!important;gap:3px!important;}
}

/* KANDU FINAL: Logística integrada al diseño premium exacto de referencia */
#view-pedidos .logistica-premium-final{padding:26px 34px 34px;max-width:1680px;margin:0 auto;}
#view-pedidos .logistica-premium-final .logistica-pro-head{padding:4px 0 22px;border-bottom:1px solid rgba(34,211,238,.16);}
#view-pedidos .logistica-premium-final .logistica-icon{width:82px;height:82px;border-radius:24px;background:linear-gradient(135deg,#16a34a,#22d3ee);box-shadow:0 0 46px rgba(34,211,238,.32), inset 0 1px 0 rgba(255,255,255,.22);font-size:35px;}
#view-pedidos .logistica-premium-final h2{font-size:34px;letter-spacing:-.04em;margin:0;color:#f8fafc;text-shadow:0 8px 28px rgba(0,0,0,.45)}
#view-pedidos .live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 18px #22c55e;margin-right:8px;vertical-align:middle;}
#view-pedidos .logistica-mode{width:56px;height:56px;border-radius:18px;font-size:20px;padding:0;justify-content:center;}
#view-pedidos .logistica-admin{min-width:132px;height:56px;border-radius:18px;}
#view-pedidos .logistica-form-pro{display:flex;flex-direction:column;gap:18px;}
#view-pedidos .log-order-card{padding:28px 30px;background:radial-gradient(circle at 12% 0%,rgba(34,211,238,.11),transparent 36%),linear-gradient(180deg,rgba(13,25,49,.94),rgba(3,8,22,.92));border:1px solid rgba(56,189,248,.24);border-radius:22px;}
#view-pedidos .log-order-title h3{margin:0 0 8px;font-size:22px;color:#f8fafc;}
#view-pedidos .log-order-title p{margin:0 0 22px;color:#94a3b8;font-size:13px;}
#view-pedidos .log-premium-fields{display:grid;grid-template-columns:1.1fr 1.1fr .9fr .9fr;gap:18px 26px;}
#view-pedidos .log-premium-fields label,#view-pedidos .log-points-grid label{display:flex;flex-direction:column;gap:8px;color:#cbd5e1;font-size:13px;font-weight:800;}
#view-pedidos .log-premium-fields input,#view-pedidos .log-premium-fields select,#view-pedidos .log-points-grid input,#view-pedidos .log-points-grid select,#view-pedidos .log-notes-final textarea{height:58px;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:linear-gradient(180deg,rgba(15,23,42,.85),rgba(2,6,23,.74));color:#f8fafc;font-size:16px;padding:0 18px;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.03);}
#view-pedidos .log-premium-fields input:focus,#view-pedidos .log-premium-fields select:focus,#view-pedidos .log-points-grid input:focus,#view-pedidos .log-points-grid select:focus,#view-pedidos .log-notes-final textarea:focus{border-color:rgba(34,211,238,.55);box-shadow:0 0 0 3px rgba(34,211,238,.10);}
#view-pedidos .log-client-card-wide{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;margin-top:20px;border:1px solid rgba(148,163,184,.18);border-radius:22px;background:linear-gradient(90deg,rgba(15,23,42,.72),rgba(8,13,31,.84));padding:18px 20px;}
#view-pedidos .log-avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 0 24px rgba(34,197,94,.35);font-weight:950;color:#fff;font-size:18px;}
#view-pedidos .log-client-main strong{font-size:17px;letter-spacing:.02em;color:#f8fafc;}
#view-pedidos .log-client-meta{margin-top:6px;color:#94a3b8;font-size:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
#view-pedidos .badge{background:rgba(34,197,94,.15);color:#86efac;border:1px solid rgba(34,197,94,.25);padding:4px 10px;border-radius:999px;font-size:11px;font-weight:950;}
#view-pedidos .log-client-kpis{display:flex;align-items:center;gap:0;border-left:1px solid rgba(148,163,184,.13);}
#view-pedidos .log-client-kpis>div{min-width:120px;padding:0 22px;border-right:1px solid rgba(148,163,184,.13);}
#view-pedidos .log-client-kpis span{display:block;font-size:12px;color:#94a3b8;margin-bottom:4px;}
#view-pedidos .log-client-kpis b{display:inline-flex;align-items:center;min-height:25px;color:#f8fafc;font-size:16px;}
#view-pedidos .log-dot-btn{width:44px;height:44px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.65);border-radius:50%;color:#fff;font-weight:950;}
#view-pedidos .log-hidden-points{display:block!important;}
#view-pedidos .log-points-card-final{padding:22px 24px;background:radial-gradient(circle at 18% 0%,rgba(34,211,238,.12),transparent 35%),linear-gradient(180deg,rgba(10,28,52,.92),rgba(6,13,30,.93));}
#view-pedidos .log-points-card-final h3{margin:0 0 14px;font-size:20px;color:#f8fafc;}
#view-pedidos .log-points-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
#view-pedidos .log-points-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;color:#a8b3c7;font-size:13px;}
#view-pedidos .log-points-foot b{color:#22c55e;}
#view-pedidos #log-points-gain{color:#facc15;font-size:20px;text-shadow:0 0 20px rgba(250,204,21,.32);}
#view-pedidos .log-notes-final{padding:20px 24px;background:linear-gradient(180deg,rgba(11,24,45,.9),rgba(4,10,24,.92));}
#view-pedidos .log-notes-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
#view-pedidos .log-notes-head h3{margin:0;font-size:19px;}
#view-pedidos .log-notes-head span{font-size:11px;color:#67e8f9;text-transform:uppercase;font-weight:950;letter-spacing:.08em;}
#view-pedidos .log-notes-final textarea{height:88px;width:100%;resize:vertical;padding:14px 16px;line-height:1.45;}
#view-pedidos .log-reference-preview{margin-top:12px;border:1px solid rgba(34,197,94,.18);background:rgba(20,83,45,.14);border-radius:13px;padding:12px 14px;color:#cbd5e1;}
#view-pedidos .log-reference-preview b{color:#86efac;margin-right:8px;}
#view-pedidos .log-form-actions-final{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
#view-pedidos .log-form-actions-final .btn{height:56px;border-radius:16px!important;font-size:16px!important;font-weight:950;}
#view-pedidos .log-form-actions-final .log-submit{box-shadow:0 0 36px rgba(34,197,94,.34)!important;}
#view-pedidos .log-active-orders{padding:22px 24px;}
#view-pedidos .table-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
#view-pedidos .table-header h3{margin:0;font-size:20px;display:flex;gap:10px;align-items:center;}
#view-pedidos .counter-pill{display:inline-grid;place-items:center;min-width:32px;height:28px;padding:0 10px;border-radius:999px;background:rgba(30,41,59,.95);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);font-size:13px;color:#e2e8f0;}
#view-pedidos .log-empty-premium{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;color:#94a3b8;border-top:1px solid rgba(148,163,184,.12);}
#view-pedidos .log-empty-premium div{font-size:42px;filter:drop-shadow(0 0 18px rgba(34,211,238,.25));}
#view-pedidos .log-empty-premium b{color:#f8fafc;font-size:17px;}
#view-pedidos .log-empty-premium span{font-size:13px;}
@media(max-width:1200px){#view-pedidos .log-premium-fields{grid-template-columns:1fr 1fr}#view-pedidos .log-points-grid{grid-template-columns:1fr 1fr}#view-pedidos .log-client-card-wide{grid-template-columns:auto 1fr}#view-pedidos .log-client-kpis{grid-column:1/-1;border-left:0;border-top:1px solid rgba(148,163,184,.13);padding-top:14px;overflow:auto}}
@media(max-width:700px){#view-pedidos .logistica-premium-final{padding:14px}#view-pedidos .log-premium-fields,#view-pedidos .log-points-grid,#view-pedidos .log-form-actions-final{grid-template-columns:1fr}#view-pedidos .log-client-kpis{display:grid;grid-template-columns:1fr 1fr}#view-pedidos .log-client-kpis>div{min-width:0}}

/* ===== KANDU IA CONSUMO MÁXIMO ===== */
.kandu-ai-consumo{margin-top:16px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border:1px solid rgba(34,211,238,.28);border-radius:20px;background:linear-gradient(135deg,rgba(8,47,73,.62),rgba(15,23,42,.82));box-shadow:0 18px 55px rgba(34,211,238,.08),inset 0 1px 0 rgba(255,255,255,.05);padding:14px 16px}.kandu-ai-consumo .ai-icon{width:46px;height:46px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#22c55e,#06b6d4);box-shadow:0 12px 28px rgba(34,197,94,.22);font-size:24px}.kandu-ai-consumo .ai-main b{display:block;color:#f8fafc;font-size:15px}.kandu-ai-consumo .ai-main span{display:block;color:#a7b6cc;font-size:12px;margin-top:4px}.ai-libras-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.ai-libras-chips button,.ai-libras-chips span{border:1px solid rgba(34,211,238,.28);background:rgba(2,6,23,.45);color:#dff9ff;border-radius:999px;padding:7px 10px;font-weight:900;font-size:12px;cursor:pointer}.ai-libras-chips button:hover{background:rgba(34,211,238,.14)}.kandu-multi-libras-card{margin-top:14px}.kandu-multi-libras-card .multi-head h3{margin:0}.kandu-multi-libras-card .multi-head p{margin:4px 0 0;color:#9fb0ca;font-size:12px}.ai-combo-preview{margin-top:10px;border:1px solid rgba(34,197,94,.25);background:rgba(20,83,45,.18);border-radius:14px;padding:10px 12px;color:#bbf7d0;font-weight:900}.pedido-extra-item{display:grid;grid-template-columns:1fr 110px auto;gap:10px;align-items:center}.pedido-extra-item select,.pedido-extra-item input{height:42px;border-radius:13px;border:1px solid rgba(148,163,184,.22);background:rgba(2,6,23,.72);color:#fff;padding:0 12px;font-weight:800}@media(max-width:900px){.kandu-ai-consumo{grid-template-columns:1fr}.pedido-extra-item{grid-template-columns:1fr}}

/* KANDU puntos premium */
.kandu-redeem-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0 4px;padding:10px;border:1px solid rgba(34,211,238,.22);border-radius:16px;background:linear-gradient(135deg,rgba(34,211,238,.09),rgba(34,197,94,.08));}
.kandu-redeem-bar #pedido-puntos-after{margin-left:auto;font-weight:900;color:#facc15;background:rgba(250,204,21,.09);border:1px solid rgba(250,204,21,.18);padding:8px 12px;border-radius:12px;}
#btn-canjear-puntos{box-shadow:0 0 22px rgba(34,211,238,.25)}
#pedido-puntos-tip{border-left:3px solid #22c55e;padding-left:10px;color:#cbd5e1;}

/* =========================================================
   KANDU 2026 — ADMIN MENSAJES ULTRA PRO CRM
   Mejora visual sin romper la lógica existente
========================================================= */
#view-mensajes{background:radial-gradient(circle at top left,rgba(103,58,183,.20),transparent 34%),radial-gradient(circle at top right,rgba(0,168,255,.16),transparent 30%)}
.messages-pro-shell{display:flex;flex-direction:column;gap:18px;padding-bottom:24px}.messages-pro-top{border:1px solid rgba(137,171,255,.18);border-radius:24px;padding:18px 20px;background:linear-gradient(135deg,rgba(10,19,39,.96),rgba(18,12,44,.92));box-shadow:0 22px 65px rgba(0,0,0,.30);position:relative;overflow:hidden}.messages-pro-top:before{content:"";position:absolute;inset:-80px -120px auto auto;width:260px;height:260px;background:radial-gradient(circle,rgba(141,92,246,.36),transparent 65%);pointer-events:none}.messages-pro-top h2{font-size:28px!important;font-weight:950!important;letter-spacing:.4px}.messages-pro-top p{font-size:14px;color:#b8c7df!important}.messages-pro-actions .btn,.messages-pro-actions .iconbtn,.msg-select{height:42px;border-radius:14px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.msg-crm-kpis{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:12px}.msg-crm-kpi{border:1px solid rgba(124,162,255,.18);border-radius:18px;padding:14px 16px;background:linear-gradient(180deg,rgba(13,27,53,.92),rgba(8,15,31,.86));box-shadow:0 14px 36px rgba(0,0,0,.18)}.msg-crm-kpi span{display:block;color:#9fb3d2;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.45px}.msg-crm-kpi b{display:block;color:#fff;font-size:25px;margin-top:4px}.msg-crm-kpi small{color:#14e27b;font-weight:800}
.messages-pro-grid{grid-template-columns:minmax(340px,410px) minmax(520px,1fr) minmax(290px,330px)!important}.msg-conversations,.msg-chat,.msg-side-card{border-radius:24px!important;backdrop-filter:blur(12px)}.msg-panel-title h3{font-weight:950;letter-spacing:.2px}.msg-search-row input{height:46px;border-radius:15px!important;background:#061122!important}.msg-search-row button{height:46px}.msg-conversation-list{gap:8px;padding:8px;background:rgba(3,10,24,.46);border-radius:18px!important}.msg-conv{border-radius:16px!important;border-bottom:0!important;background:rgba(255,255,255,.035)!important;grid-template-columns:50px 1fr auto!important}.msg-conv:hover,.msg-conv.active{transform:translateY(-1px);box-shadow:0 12px 30px rgba(22,97,255,.18);background:linear-gradient(135deg,rgba(30,126,255,.24),rgba(140,70,255,.16))!important}.msg-conv b{font-size:15.5px!important}.msg-conv small{max-width:245px!important}.msg-avatar{box-shadow:0 10px 24px rgba(32,124,255,.25),inset 0 1px 0 rgba(255,255,255,.2)}.msg-unread{background:linear-gradient(135deg,#ff2e62,#8e45ff)!important;box-shadow:0 8px 20px rgba(255,46,98,.28)}.msg-list-footer{padding:12px;color:#b7c7e2!important;text-align:center}.msg-chat-active{min-height:690px!important}.msg-client-head{border:1px solid rgba(124,162,255,.15);border-radius:20px;padding:14px;background:linear-gradient(135deg,rgba(11,24,47,.8),rgba(18,16,46,.64))}.msg-client-head h3{font-size:20px}.msg-last-order{border-radius:19px!important;background:linear-gradient(135deg,rgba(10,20,39,.94),rgba(16,27,55,.72))!important}.msg-status-pill{background:linear-gradient(135deg,rgba(22,212,113,.2),rgba(36,128,255,.16))!important;border:1px solid rgba(22,212,113,.28)}.msg-order-progress{border-radius:20px!important}.msg-thread{border:1px solid rgba(124,162,255,.12);border-radius:20px;background:radial-gradient(circle at top,rgba(26,72,145,.20),transparent 32%),rgba(2,8,20,.45);padding:16px!important;max-height:455px!important}.msg-bubble{border-radius:18px 18px 18px 6px!important;line-height:1.42;box-shadow:0 10px 30px rgba(0,0,0,.24)!important}.msg-bubble.admin{border-radius:18px 18px 6px 18px!important;background:linear-gradient(135deg,#1b73ff,#6b35f6)!important}.msg-bubble.system{border-radius:16px!important}.msg-bubble small{opacity:.86}.msg-reply-box{border-radius:22px!important;background:linear-gradient(180deg,rgba(8,16,34,.96),rgba(6,13,28,.92))!important}.msg-reply-box textarea{min-height:98px!important;border-radius:16px!important;font-size:15px}.msg-reply-actions{gap:10px;flex-wrap:wrap}.msg-reply-actions .btn-primary{border-radius:14px;padding-inline:22px}.msg-template-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 12px}.msg-template{border:1px solid rgba(130,164,230,.22);background:rgba(255,255,255,.055);color:#dce8ff;border-radius:999px;padding:8px 11px;font-weight:850;font-size:12px;cursor:pointer}.msg-template:hover{background:rgba(30,126,255,.18);border-color:rgba(30,126,255,.5)}.msg-side-card{padding:18px!important}.msg-side-card h3{font-size:16px;font-weight:950}.msg-side-card dt{text-transform:uppercase;letter-spacing:.35px}.msg-quick{border:1px solid rgba(130,164,230,.14)!important;border-radius:15px!important}.msg-empty-pro,.msg-chat-empty{border-radius:18px;background:rgba(255,255,255,.035);border:1px dashed rgba(137,171,255,.18)}.kandu-admin-note{border-left:3px solid #8b5cf6;padding:10px 12px;background:rgba(139,92,246,.09);border-radius:12px;color:#cbd7ef;font-size:13px;margin-top:10px}.msg-priority-chip{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:950;background:rgba(255,185,35,.14);color:#ffd782;border:1px solid rgba(255,185,35,.22);margin-left:8px}
@media(max-width:1050px){.msg-crm-kpis{grid-template-columns:repeat(2,1fr)}.messages-pro-grid{grid-template-columns:1fr!important}.msg-client-side{display:grid!important;grid-template-columns:1fr 1fr 1fr!important}}@media(max-width:760px){.msg-crm-kpis,.msg-client-side{grid-template-columns:1fr!important}.messages-pro-top{padding:15px}.msg-client-head{display:flex!important}.msg-reply-actions{align-items:stretch}.msg-reply-actions .btn{width:100%}}