/* NexoHub + Stitch integrated visual system
   Derived from the supplied Stitch design tokens and layouts.
   Functional behavior remains in public/app.js and NexoHub APIs. */
:root{
  --st-bg:#0b1326;
  --st-surface-lowest:#060e20;
  --st-surface-low:#131b2e;
  --st-surface:#171f33;
  --st-surface-high:#222a3d;
  --st-surface-highest:#31394d;
  --st-primary:#4edea3;
  --st-primary-strong:#10b981;
  --st-secondary:#c0c1ff;
  --st-tertiary:#ffb95f;
  --st-danger:#ffb4ab;
  --st-text:#dae2fd;
  --st-muted:#bbcabf;
  --st-outline:#86948a;
  --bg:var(--st-bg);
  --panel:var(--st-surface-low);
  --ink:var(--st-text);
  --muted:var(--st-muted);
  --line:rgba(187,202,191,.14);
  --accent:var(--st-primary);
  --accent2:rgba(78,222,163,.12);
  --dark:var(--st-surface-lowest);
  --success:var(--st-primary);
  --warn:var(--st-tertiary);
  --danger:var(--st-danger);
  --shadow:0 10px 30px rgba(0,0,0,.18);
  --radius:12px;
}
html{background:var(--st-bg)}
body.stitch-theme{background:var(--st-bg);color:var(--st-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
body.stitch-theme ::selection{background:rgba(78,222,163,.28);color:#fff}
body.stitch-theme a{color:var(--st-primary)}
body.stitch-theme .muted{color:var(--st-muted)!important}

/* Login */
body.stitch-theme .login-shell{background:var(--st-bg);grid-template-columns:1.1fr .9fr}
body.stitch-theme .login-visual{background:radial-gradient(circle at 20% 12%,rgba(78,222,163,.15),transparent 28%),radial-gradient(circle at 78% 74%,rgba(192,193,255,.10),transparent 30%),linear-gradient(145deg,var(--st-surface-lowest),var(--st-bg));border-right:1px solid var(--line)}
body.stitch-theme .login-visual:after{border-color:rgba(78,222,163,.14);box-shadow:0 0 0 70px rgba(78,222,163,.025),0 0 0 140px rgba(192,193,255,.018)}
body.stitch-theme .login-visual h1{font-size:clamp(42px,5vw,72px);letter-spacing:-.045em}
body.stitch-theme .login-visual p{color:var(--st-muted)}
body.stitch-theme .eyebrow{color:var(--st-primary)}
body.stitch-theme .pill-row span{background:var(--st-surface-low);border-color:var(--line);color:var(--st-text)}
body.stitch-theme .login-card{background:var(--st-surface-low);border-color:var(--line);box-shadow:var(--shadow)}
body.stitch-theme .login-card h2{color:var(--st-text)}
body.stitch-theme .login-card input{background:var(--st-surface-lowest);border-color:var(--line);color:var(--st-text)}
body.stitch-theme .login-card input:focus{border-color:var(--st-primary);box-shadow:0 0 0 3px rgba(78,222,163,.12)}
body.stitch-theme .demo-note{background:var(--st-surface);color:var(--st-muted);border:1px solid var(--line)}
.stitch-logo{height:36px;width:auto;object-fit:contain;display:block}
.stitch-logo.login-logo{height:42px;margin-bottom:12px}
.stitch-logo.sidebar-logo{height:31px;max-width:190px}

/* Main shell / navigation mirrors supplied Stitch sidebar and top bar */
body.stitch-theme .app-shell{grid-template-columns:256px minmax(0,1fr);background:var(--st-bg)}
body.stitch-theme .sidebar{background:var(--st-surface-lowest);border-right:1px solid rgba(187,202,191,.08);padding:14px 12px}
body.stitch-theme .side-brand{min-height:58px;padding:6px 8px 18px;border-bottom:1px solid rgba(187,202,191,.08);margin-bottom:8px}
body.stitch-theme .sidebar nav{gap:3px;overflow:auto;padding-right:2px}
body.stitch-theme .sidebar nav button{color:var(--st-muted);padding:10px 12px;border-radius:9px;font-size:13px;font-weight:600;letter-spacing:.005em}
body.stitch-theme .sidebar nav button span{color:#819086}
body.stitch-theme .sidebar nav button:hover{background:var(--st-surface);color:var(--st-text)}
body.stitch-theme .sidebar nav button.active{background:var(--st-surface-high);color:var(--st-primary)}
body.stitch-theme .sidebar nav button.active span{color:var(--st-primary)}
body.stitch-theme .badge{background:var(--st-primary-strong);color:#002113}
body.stitch-theme .sidebar-bottom{border-color:rgba(187,202,191,.12)}
body.stitch-theme .avatar{background:var(--st-surface-high);color:var(--st-primary);border:1px solid var(--line)}
body.stitch-theme .org-chip small{color:var(--st-muted)}
body.stitch-theme .text-btn{color:var(--st-muted)}
body.stitch-theme .text-btn:hover{color:var(--st-text)}
body.stitch-theme .main{background:var(--st-bg)}
body.stitch-theme .topbar{height:68px;background:rgba(23,31,51,.88);backdrop-filter:blur(14px);border-color:var(--line);padding:0 24px}
body.stitch-theme .topbar h2{color:var(--st-text);font-size:18px;letter-spacing:-.015em}
body.stitch-theme .breadcrumb{color:var(--st-muted)}
body.stitch-theme .view{max-width:1800px;padding:22px 24px}
body.stitch-theme .icon-btn{background:var(--st-surface-low);border-color:var(--line);color:var(--st-muted)}
body.stitch-theme .icon-btn:hover{background:var(--st-surface-high);color:var(--st-text)}

/* Stitch controls */
body.stitch-theme .btn{border-radius:9px;transition:.16s ease;box-shadow:none}
body.stitch-theme .btn.primary{background:var(--st-primary-strong);color:#002113}
body.stitch-theme .btn.primary:hover{background:var(--st-primary);transform:translateY(-1px)}
body.stitch-theme .btn.secondary{background:var(--st-surface-high);color:var(--st-text);border:1px solid var(--line)}
body.stitch-theme .btn.ghost{background:var(--st-surface-low);border-color:var(--line);color:var(--st-text)}
body.stitch-theme .btn.danger{background:rgba(255,180,171,.10);color:var(--st-danger);border:1px solid rgba(255,180,171,.16)}
body.stitch-theme input,body.stitch-theme select,body.stitch-theme textarea{background:var(--st-surface-lowest);color:var(--st-text);border-color:var(--line)!important}
body.stitch-theme input::placeholder,body.stitch-theme textarea::placeholder{color:#77867c}
body.stitch-theme input:focus,body.stitch-theme select:focus,body.stitch-theme textarea:focus{outline:none;border-color:rgba(78,222,163,.72)!important;box-shadow:0 0 0 3px rgba(78,222,163,.08)!important}
body.stitch-theme option{background:var(--st-surface-lowest);color:var(--st-text)}

/* KPI / panels */
body.stitch-theme .metric,body.stitch-theme .panel,body.stitch-theme .table-wrap,body.stitch-theme .automation-card,body.stitch-theme .channel-card,body.stitch-theme .agenda-card,body.stitch-theme .task,body.stitch-theme .summary-card,body.stitch-theme .plan-card,body.stitch-theme .department-card{background:var(--st-surface-low);border-color:var(--line);box-shadow:0 1px 0 rgba(255,255,255,.01)}
body.stitch-theme .metric:hover,body.stitch-theme .panel:hover{border-color:rgba(78,222,163,.18)}
body.stitch-theme .metric .label{color:var(--st-muted);text-transform:uppercase;letter-spacing:.06em;font-size:10px}
body.stitch-theme .metric .value{font-variant-numeric:tabular-nums;color:var(--st-text);letter-spacing:-.025em}
body.stitch-theme .metric .foot{color:#8e9b91}
body.stitch-theme .metric.accent{background:linear-gradient(135deg,rgba(16,185,129,.20),var(--st-surface-low));border-color:rgba(78,222,163,.28)}
body.stitch-theme .metric.accent .value{color:var(--st-primary)}
body.stitch-theme .panel h3{color:var(--st-text);letter-spacing:-.01em}
body.stitch-theme .bar{background:var(--st-surface-high)}
body.stitch-theme .bar i{background:linear-gradient(90deg,var(--st-primary-strong),var(--st-primary))}
body.stitch-theme .recent-item{border-color:var(--line)}
body.stitch-theme .recent-item p{color:var(--st-muted)}
body.stitch-theme .circle-avatar{background:rgba(78,222,163,.12);color:var(--st-primary);border:1px solid rgba(78,222,163,.12)}
body.stitch-theme .status-dot{background:var(--st-tertiary)}

/* Tables / CRM */
body.stitch-theme .search{background:var(--st-surface-lowest);border-color:var(--line);color:var(--st-text)}
body.stitch-theme .table-wrap{overflow:auto}
body.stitch-theme .data-table th{background:var(--st-surface);color:var(--st-muted);border-color:var(--line)}
body.stitch-theme .data-table td{border-color:var(--line);color:var(--st-text)}
body.stitch-theme .data-table tr:hover td{background:rgba(78,222,163,.035)}
body.stitch-theme .tag{background:var(--st-surface-high);color:var(--st-muted)}
body.stitch-theme .tag.green{background:rgba(78,222,163,.12);color:var(--st-primary)}
body.stitch-theme .tag.red{background:rgba(255,180,171,.10);color:var(--st-danger)}
body.stitch-theme .tag.yellow{background:rgba(255,185,95,.11);color:var(--st-tertiary)}
body.stitch-theme .kanban-col{background:var(--st-surface-lowest);border-color:var(--line)}
body.stitch-theme .kanban-head{color:var(--st-muted)}
body.stitch-theme .kanban-head span{background:var(--st-surface-high);color:var(--st-text)}
body.stitch-theme .opp-card{background:var(--st-surface-low);border-color:var(--line);box-shadow:0 4px 14px rgba(0,0,0,.10)}
body.stitch-theme .opp-card:hover{border-color:rgba(78,222,163,.35);box-shadow:0 8px 24px rgba(0,0,0,.16)}
body.stitch-theme .opp-card p{color:var(--st-muted)}
body.stitch-theme .kanban-col.dragover{background:rgba(78,222,163,.05);outline-color:var(--st-primary)}

/* Conversation center: Stitch central_de_conversaciones / customer 360 visual language */
body.stitch-theme .inbox-layout,body.stitch-theme .walo-layout{background:var(--st-surface-low);border-color:var(--line);box-shadow:var(--shadow)}
body.stitch-theme .conversation-list{background:var(--st-surface-lowest);border-color:var(--line)}
body.stitch-theme .conversation-list .list-head,body.stitch-theme .walo-list-head{background:var(--st-surface-lowest)!important;border-color:var(--line)!important}
body.stitch-theme .conv-item,body.stitch-theme .walo-conv{border-color:var(--line)!important;color:var(--st-text)}
body.stitch-theme .conv-item:hover,body.stitch-theme .conv-item.active,body.stitch-theme .walo-conv:hover,body.stitch-theme .walo-conv.active{background:var(--st-surface-high)!important}
body.stitch-theme .conv-item p,body.stitch-theme .conv-meta{color:var(--st-muted)!important}
body.stitch-theme .chat-pane{background:var(--st-bg)}
body.stitch-theme .chat-head,body.stitch-theme .walo-chat-head{background:var(--st-surface)!important;border-color:var(--line)!important}
body.stitch-theme .messages,body.stitch-theme .walo-messages{background:radial-gradient(circle at 50% 10%,rgba(78,222,163,.025),transparent 34%),var(--st-bg)!important}
body.stitch-theme .bubble.contact{background:var(--st-surface-low);border-color:var(--line);color:var(--st-text)}
body.stitch-theme .bubble.agent{background:#123f35;color:#eafff6;border:1px solid rgba(78,222,163,.15)}
body.stitch-theme .bubble small{color:var(--st-muted)}
body.stitch-theme .composer-dock,body.stitch-theme .composer,body.stitch-theme .walo-composer{background:var(--st-surface-low)!important;border-color:var(--line)!important}
body.stitch-theme .composer input{background:var(--st-surface-lowest)!important;color:var(--st-text)!important}
body.stitch-theme .composer-icon,body.stitch-theme .chat-action,body.stitch-theme .list-icon-btn{background:var(--st-surface-high)!important;border-color:var(--line)!important;color:var(--st-muted)!important}
body.stitch-theme .composer-icon:hover,body.stitch-theme .chat-action:hover,body.stitch-theme .list-icon-btn:hover{color:var(--st-primary)!important;border-color:rgba(78,222,163,.3)!important}
body.stitch-theme .ai-suggest-btn{color:var(--st-secondary)!important;border-color:rgba(192,193,255,.25)!important}
body.stitch-theme .customer-pane,body.stitch-theme .customer-drawer{background:var(--st-surface-lowest)!important;border-color:var(--line)!important;color:var(--st-text)}
body.stitch-theme .customer-stat div,body.stitch-theme .workspace-card,body.stitch-theme .workspace-section{background:var(--st-surface-low)!important;border-color:var(--line)!important}
body.stitch-theme .conversation-state-banner{background:rgba(78,222,163,.08);border-color:rgba(78,222,163,.14);color:var(--st-primary)}
body.stitch-theme .composer-mode-tab.active{background:rgba(78,222,163,.11);color:var(--st-primary)}
body.stitch-theme .slash-menu,body.stitch-theme .emoji-picker{background:var(--st-surface-low);border-color:var(--line);box-shadow:var(--shadow)}
body.stitch-theme .slash-menu button{background:transparent;color:var(--st-text)}
body.stitch-theme .slash-menu button:hover{background:var(--st-surface-high)}
body.stitch-theme .slash-menu span{color:var(--st-text)}
body.stitch-theme .slash-menu small{color:var(--st-muted)}
body.stitch-theme .internal-note-card{background:#332f1c;border-color:#655d2b;color:#fff2bd}
body.stitch-theme .timeline-date span{background:var(--st-surface);color:var(--st-muted);border-color:var(--line)}

/* Marketing / channels / automation */
body.stitch-theme .channel-hero,body.stitch-theme .booking-banner,body.stitch-theme .today-command{background:linear-gradient(135deg,#10352f,var(--st-surface-low) 68%,#1a2340)!important;border:1px solid rgba(78,222,163,.18);box-shadow:none}
body.stitch-theme .today-copy p,body.stitch-theme .today-actions small{color:var(--st-muted)}
body.stitch-theme .today-actions button{background:rgba(255,255,255,.035);border-color:var(--line);color:var(--st-text)}
body.stitch-theme .today-actions button:hover{background:rgba(78,222,163,.07);border-color:rgba(78,222,163,.22)}
body.stitch-theme .flow-step,body.stitch-theme .quick-reply-manager,body.stitch-theme .permission-item,body.stitch-theme .check-label{background:var(--st-surface)!important;border-color:var(--line)!important;color:var(--st-text)}

/* Modals */
body.stitch-theme .modal{background:rgba(2,8,20,.72);backdrop-filter:blur(6px)}
body.stitch-theme .modal-card{background:var(--st-surface-low);border:1px solid var(--line);box-shadow:0 30px 90px rgba(0,0,0,.45);color:var(--st-text)}
body.stitch-theme .modal-head{background:var(--st-surface);border-color:var(--line)}
body.stitch-theme .modal-head button{color:var(--st-muted)}
body.stitch-theme .info-list>div{border-color:var(--line)}

/* Stitch utility elements added to shell */
.stitch-api-pill{display:flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid var(--line);border-radius:999px;background:var(--st-surface-low);color:var(--st-muted);font-size:11px;font-weight:650}
.stitch-api-pill i{width:7px;height:7px;border-radius:50%;background:var(--st-primary);box-shadow:0 0 0 4px rgba(78,222,163,.08)}
.stitch-version{color:var(--st-primary);font-size:10px;padding:3px 6px;border-radius:5px;background:rgba(78,222,163,.08);font-weight:800}

@media(max-width:900px){
  body.stitch-theme .app-shell{grid-template-columns:68px minmax(0,1fr)}
  body.stitch-theme .sidebar{padding:10px 6px}
  body.stitch-theme .side-brand{justify-content:center;padding-inline:2px}
  body.stitch-theme .stitch-logo.sidebar-logo{width:42px;height:auto;object-fit:cover;object-position:left}
  body.stitch-theme .sidebar nav button{font-size:0;justify-content:center;padding:10px 7px}
  body.stitch-theme .sidebar nav button span{font-size:17px}
  body.stitch-theme .sidebar-bottom .org-chip>div:nth-child(2),body.stitch-theme #logoutBtn{display:none}
  body.stitch-theme .topbar{padding:0 12px}
  .stitch-api-pill{display:none}
}
@media(max-width:700px){
  body.stitch-theme .login-shell{grid-template-columns:1fr}
  body.stitch-theme .login-visual{display:none}
  body.stitch-theme .login-card{width:min(440px,92vw);margin:8vh auto}
}