/* ─────────────────────────────────────────────────────────────
   Sofia Dashboard — Moose Design System (paper / claro)
   Reemplaza el tema oscuro anterior. Self-contained: incluye los
   tokens Moose (color, tipografía, espaciado, radii, sombras) para
   no depender de otro archivo. Anclado a Pantone:
     · Naranja  P 20-8U   #F49F00
     · Teal     P 127-14U #36B5A0
   ───────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* base */
  --paper:#F6F4ED; --paper-2:#ECE9DD; --paper-3:#E4E0CF;
  --hair:#DAD6C9; --hair-strong:#B3AE9D;
  --ink:#10110E; --ink-2:#3A3A36; --ink-3:#7C7C77; --ink-4:#B8B6A9;

  /* brand */
  --brand-orange:#F49F00; --brand-orange-press:#D88A00; --brand-orange-soft:#FBE6C4;
  --brand-teal:#36B5A0; --brand-teal-press:#2A9082; --brand-teal-soft:#D6EFE9;

  /* semantic status */
  --ok:#36B5A0;      --ok-soft:#D6EFE9;   --ok-ink:#1B6655;
  --warn:#F49F00;    --warn-soft:#FBE6C4; --warn-ink:#8A5A0E;
  --info:#2C5C8F;    --info-soft:#DDE6F0; --info-ink:#1F4567;
  --danger:#C44232;  --danger-soft:#F5DCD8;

  /* app semantic (compat con nombres previos) */
  --bg-body:var(--paper); --bg-card:var(--paper); --bg-input:var(--paper);
  --bg-hover:var(--paper-2); --border:var(--hair); --border-light:var(--hair-strong);
  --text:var(--ink); --text-sub:var(--ink-2); --text-muted:var(--ink-3); --text-label:var(--ink-3);
  --accent:var(--brand-orange); --accent-hover:var(--brand-orange-press); --accent-light:var(--brand-orange-soft);
  --success:var(--ok); --warning:var(--warn); --info-c:var(--info);
  --success-bg:var(--ok-soft); --warning-bg:var(--warn-soft); --danger-bg:var(--danger-soft); --info-bg:var(--info-soft);

  /* type */
  --font-display:'Space Grotesk','Inter Tight',system-ui,sans-serif;
  --font-sans:'Inter',-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;

  /* radii */
  --r-sm:4px; --r:6px; --r-md:10px; --r-lg:14px; --r-pill:999px;
  /* shadows (solo 2) */
  --shadow-1:0 1px 2px rgba(16,17,14,.04),0 2px 8px rgba(16,17,14,.04);
  --shadow-2:0 4px 14px rgba(16,17,14,.06),0 12px 32px rgba(16,17,14,.08);
  /* motion */
  --dur-fast:120ms; --dur:200ms; --ease:cubic-bezier(.2,.8,.2,1);
}

* { box-sizing:border-box; }

body {
  font-family:var(--font-sans);
  background:var(--paper);
  color:var(--ink);
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-wrap:pretty;
}

a { color:var(--ink); text-decoration:none; }
a:hover { color:var(--accent); }

h1,h2,h3,h4,h5,h6 { font-family:var(--font-display); color:var(--ink); font-weight:600; letter-spacing:-.02em; }
p { color:var(--ink-2); }

[data-lucide]{ width:16px; height:16px; stroke-width:1.75; vertical-align:-2px; }

/* ── Sidebar (tinta) ─────────────────────────────────── */
.sidebar {
  width:236px; min-width:236px;
  background:var(--ink); color:#EDE9DB;
  border-right:none;
  height:100vh; position:sticky; top:0; overflow-y:auto;
}
.sidebar-brand { border-bottom:1px solid rgba(237,233,219,.12); padding:20px 18px; }
.sidebar-brand .fw-bold { color:#fff !important; font-family:var(--font-display); }
.sidebar-brand .text-muted { color:#8f8b7d !important; font-family:var(--font-mono); }
.sidebar-brand .brand-logo { height:26px; display:block; }
.sidebar-brand .brand-sub { font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; margin-top:7px; }

.sidebar .nav-link {
  color:#c9c4b4; padding:8px 12px; border-radius:var(--r);
  margin-bottom:1px; display:flex; align-items:center; gap:11px;
  transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);
  font-size:13.5px; font-weight:500;
}
.sidebar .nav-link [data-lucide]{ color:#8f8b7d; width:16px; height:16px; flex-shrink:0; }
.sidebar .nav-link:hover { background:rgba(237,233,219,.06); color:#fff; }
.sidebar .nav-link.active { background:var(--accent); color:var(--ink); font-weight:600; }
.sidebar .nav-link.active [data-lucide]{ color:var(--ink); }
.sidebar .nav-section { color:#7a7668 !important; font-family:var(--font-mono); }
.sidebar .border-top,.sidebar .border-secondary { border-color:rgba(237,233,219,.12) !important; }
.sidebar .text-muted { color:#8f8b7d !important; }

.nav-icon { font-size:16px; width:20px; text-align:center; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; }

/* wordmark en el pie del sidebar */
.sidebar-wm { display:flex; align-items:center; gap:7px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; color:#7a7668; margin-bottom:8px; }
.sidebar-wm img { height:15px; }

/* ── Avatar ──────────────────────────────────────────── */
.sofia-avatar { width:48px; height:48px; border-radius:var(--r-md); background:var(--ink); color:var(--accent);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:600; font-size:24px; }
.sofia-avatar-sm { width:34px; height:34px; border-radius:var(--r); background:var(--accent); color:var(--ink);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:600; font-size:15px; flex-shrink:0; }

/* ── Main ────────────────────────────────────────────── */
main { background:var(--paper); overflow-y:auto; }

/* utility topbar (global search) */
.util-bar { display:flex; align-items:center; gap:16px; margin-bottom:22px; }
.gsearch { flex:1; max-width:440px; display:flex; align-items:center; gap:9px; background:var(--paper-2);
  border:1px solid var(--hair-strong); border-radius:var(--r); padding:9px 13px; color:var(--ink-3); cursor:text; }
.gsearch:hover { border-color:var(--ink-4); }
.gsearch [data-lucide]{ width:15px; height:15px; }
.gsearch .ph { font-size:13px; flex:1; }
.gsearch .kbd { font-family:var(--font-mono); font-size:10px; background:var(--paper); border:1px solid var(--hair-strong);
  border-radius:4px; padding:2px 6px; color:var(--ink-3); }
.util-bar .util-right { margin-left:auto; display:flex; align-items:center; gap:14px; font-family:var(--font-mono); font-size:12px; color:var(--ink-3); }

/* ── Cards ───────────────────────────────────────────── */
.card-dark, .card { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg); box-shadow:var(--shadow-1); }
.card-dark { color:var(--ink); }

/* ── KPI / stat cards ────────────────────────────────── */
.stat-card { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg);
  padding:16px 18px; display:flex; align-items:center; gap:14px; height:100%; box-shadow:var(--shadow-1); position:relative; }
.stat-card.stat-ok    { border-left:3px solid var(--ok); }
.stat-card.stat-warn  { border-left:3px solid var(--warn); }
.stat-card.stat-error { border-left:3px solid var(--danger); }
.stat-icon { color:var(--ink-3); display:inline-flex; }
.stat-icon [data-lucide]{ width:22px; height:22px; }
.stat-label { color:var(--ink-3); font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; font-weight:600; margin-bottom:4px; }
.stat-value { color:var(--ink); font-family:var(--font-display); font-weight:500; font-size:22px; letter-spacing:-.02em; line-height:1.2; }

.kpi { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg); padding:16px 18px; box-shadow:var(--shadow-1); height:100%; }
.kpi .lbl { font-family:var(--font-mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); margin-bottom:9px; display:flex; align-items:center; gap:7px; }
.kpi .lbl [data-lucide]{ width:14px; height:14px; color:var(--ink-4); }
.kpi .kn { font-family:var(--font-display); font-size:34px; font-weight:500; letter-spacing:-.04em; line-height:1; color:var(--ink); }
.kpi .kn small { font-size:18px; color:var(--ink-3); }
.kpi .dl { font-family:var(--font-mono); font-size:11px; margin-top:7px; display:flex; align-items:center; gap:4px; color:var(--ink-3); }
.kpi .dl.up { color:var(--ok-ink); } .kpi .dl.dn { color:var(--danger); }
.kpi .dl [data-lucide]{ width:12px; height:12px; }

.metric-card { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg); padding:20px 16px; text-align:center; height:100%; box-shadow:var(--shadow-1); }
.metric-num { font-family:var(--font-display); font-size:34px; font-weight:500; line-height:1; margin-bottom:6px; letter-spacing:-.04em; color:var(--ink); }
.metric-label { color:var(--ink-3); font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.08em; font-weight:600; }

/* ── Attention list (dashboard) ──────────────────────── */
.att { display:flex; align-items:center; gap:12px; padding:11px 0; border-bottom:1px solid var(--hair); }
.att:last-child { border-bottom:none; }
.att .chip { font-family:var(--font-mono); font-size:9.5px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; padding:3px 7px; border-radius:var(--r-sm); flex-shrink:0; width:74px; text-align:center; }
.chip-lead { background:var(--warn-soft); color:var(--warn-ink); }
.chip-task { background:var(--danger-soft); color:var(--danger); }
.chip-opp  { background:var(--info-soft); color:var(--info-ink); }
.att .att-tx { flex:1; font-size:13px; color:var(--ink); min-width:0; }
.att .att-tx .sm { color:var(--ink-3); font-size:12px; }
.att .when { font-family:var(--font-mono); font-size:11px; color:var(--ink-3); flex-shrink:0; }
.att .when.over { color:var(--danger); font-weight:600; }

/* ── Pipeline bars ───────────────────────────────────── */
.pl { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.pl .st { font-size:12.5px; color:var(--ink-2); width:110px; flex-shrink:0; font-weight:500; }
.pl .track { flex:1; height:8px; background:var(--paper-3); border-radius:var(--r-pill); overflow:hidden; }
.pl .fill { height:100%; background:var(--accent); border-radius:var(--r-pill); }
.pl .fill.teal { background:var(--brand-teal); } .pl .fill.ink { background:var(--ink-3); }
.pl .v { font-family:var(--font-mono); font-size:10.5px; color:var(--ink-2); width:120px; text-align:right; flex-shrink:0; }

/* ── Agenda list ─────────────────────────────────────── */
.ag { padding:8px 0; border-bottom:1px solid var(--hair); font-size:12.5px; display:flex; gap:10px; }
.ag:last-child { border-bottom:none; }
.ag .tm { font-family:var(--font-mono); font-size:11px; color:var(--accent); flex-shrink:0; width:78px; }
.ag .cl { color:var(--ink-3); }

/* ── Activity list ───────────────────────────────────── */
.activity-list { display:flex; flex-direction:column; }
.activity-item { display:flex; align-items:flex-start; gap:12px; padding:12px 0; border-bottom:1px solid var(--hair); }
.activity-item:last-child { border-bottom:none; }
.activity-icon { color:var(--ink-3); margin-top:2px; flex-shrink:0; display:inline-flex; }
.activity-icon [data-lucide]{ width:15px; height:15px; }
.activity-item .text-white { color:var(--ink) !important; }

/* ── Forms ───────────────────────────────────────────── */
.form-control, .form-control-dark, textarea.form-control, select.form-control {
  background:var(--paper) !important; border:1px solid var(--hair-strong) !important; color:var(--ink) !important;
  border-radius:var(--r); padding:10px 13px; font-size:14px; font-family:var(--font-sans);
  transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
}
.form-control:focus, .form-control-dark:focus, textarea.form-control:focus, select.form-control:focus {
  border-color:var(--accent) !important; box-shadow:0 0 0 3px var(--brand-orange-soft) !important;
  color:var(--ink) !important; background:var(--paper) !important; outline:none;
}
.form-control::placeholder, .form-control-dark::placeholder { color:var(--ink-4) !important; }
.form-label { color:var(--ink-2) !important; font-family:var(--font-mono); font-weight:500; font-size:11px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px; }
select.form-control { cursor:pointer; }

/* ── Buttons ─────────────────────────────────────────── */
.btn { border-radius:var(--r); font-weight:600; font-family:var(--font-sans); transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease); }
.btn [data-lucide]{ width:15px; height:15px; vertical-align:-3px; }
.btn-primary { background:var(--accent); border-color:var(--accent); color:var(--ink); }
.btn-primary:hover { background:var(--accent-hover); border-color:var(--accent-hover); color:var(--ink); }
.btn-outline-light, .btn-outline-secondary { color:var(--ink-2); border-color:var(--hair-strong); background:var(--paper); }
.btn-outline-light:hover, .btn-outline-secondary:hover { background:var(--paper-2); color:var(--ink); border-color:var(--hair-strong); }
.btn-outline-warning { color:var(--warn-ink); border-color:var(--warn); background:var(--paper); }
.btn-outline-warning:hover { background:var(--warn-soft); color:var(--warn-ink); }
.btn-outline-info { color:var(--info-ink); border-color:var(--info); background:var(--paper); }
.btn-outline-info:hover { background:var(--info-soft); color:var(--info-ink); }
.btn-outline-danger { color:var(--danger); border-color:var(--danger); background:var(--paper); }
.btn-outline-danger:hover { background:var(--danger-soft); color:var(--danger); }
.btn-outline-primary { color:var(--accent-hover); border-color:var(--accent); background:var(--paper); }
.btn-outline-primary:hover { background:var(--brand-orange-soft); color:var(--accent-hover); }
.btn-outline-success { color:var(--ok-ink); border-color:var(--ok); background:var(--paper); }
.btn-outline-success:hover { background:var(--ok-soft); color:var(--ok-ink); }
.btn-success { background:var(--ok); border-color:var(--ok); color:#fff; }
.btn-success:hover { background:var(--brand-teal-press); border-color:var(--brand-teal-press); color:#fff; }
.btn-danger  { background:var(--danger); border-color:var(--danger); color:#fff; }
.btn-xs { padding:3px 10px; font-size:11.5px; border-radius:var(--r-sm); font-weight:600; }

/* ── Tables ──────────────────────────────────────────── */
/* Sobrescribe TODAS las vars de Bootstrap: sin esto, .table-hover
   pinta el hover oscuro del tema dark sobre texto oscuro (ilegible). */
.table, .table-dark {
  --bs-table-bg:transparent;
  --bs-table-color:var(--ink-2);
  --bs-table-border-color:var(--hair);
  --bs-table-hover-bg:var(--paper-2);
  --bs-table-hover-color:var(--ink);
  --bs-table-striped-bg:var(--paper-2);
  --bs-table-striped-color:var(--ink);
  --bs-table-active-bg:var(--paper-3);
  --bs-table-active-color:var(--ink);
  color:var(--ink-2);
}
.table-dark th, .table th { color:var(--ink-3); font-family:var(--font-mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em; font-weight:600; border-color:var(--hair-strong); padding:10px 12px; }
.table-dark td, .table td { color:var(--ink-2); border-color:var(--hair); padding:10px 12px; vertical-align:middle; }
.table-dark tr:hover td { background:var(--paper-2); }

/* ── Badges ──────────────────────────────────────────── */
.badge { font-family:var(--font-mono); font-weight:600; font-size:11px; padding:4px 8px; border-radius:var(--r-sm); }
.bg-secondary { background:var(--paper-3) !important; color:var(--ink-2) !important; }
.bg-warning   { background:var(--warn-soft) !important; color:var(--warn-ink) !important; }
.bg-success   { background:var(--ok-soft) !important; color:var(--ok-ink) !important; }
.bg-info      { background:var(--info-soft) !important; color:var(--info-ink) !important; }
.bg-danger    { background:var(--danger-soft) !important; color:var(--danger) !important; }
.bg-primary   { background:var(--brand-orange-soft) !important; color:var(--warn-ink) !important; }

/* ── Alerts ──────────────────────────────────────────── */
.alert { border-radius:var(--r-md); font-size:13.5px; font-weight:500; border-width:1px; }
.alert-success { background:var(--ok-soft); border-color:var(--brand-teal); color:var(--ok-ink); }
.alert-danger  { background:var(--danger-soft); border-color:var(--danger); color:#8f2a1e; }
.alert-info    { background:var(--info-soft); border-color:var(--info); color:var(--info-ink); }
.alert-warning { background:var(--warn-soft); border-color:var(--warn); color:var(--warn-ink); }

/* ── Nav Tabs ────────────────────────────────────────── */
.nav-tabs { border-color:var(--hair); }
.nav-tabs .nav-link { color:var(--ink-3); border:none; border-bottom:2px solid transparent; padding:10px 16px; font-weight:600; font-size:13.5px; border-radius:0; }
.nav-tabs .nav-link:hover { color:var(--ink); background:transparent; }
.nav-tabs .nav-link.active { color:var(--ink); background:transparent; border-bottom-color:var(--accent); }

/* ── Nav pills (tabs de sección) ─────────────────────── */
.nav-pills .nav-link { color:var(--ink-2); font-weight:600; border-radius:var(--r-pill); padding:6px 14px; display:inline-flex; align-items:center; gap:7px; }
.nav-pills .nav-link:hover { color:var(--ink); background:var(--paper-2); }
.nav-pills .nav-link.active { background:var(--ink); color:var(--paper); }
.nav-pills .nav-link.active [data-lucide]{ color:var(--paper); }
.nav-pills .nav-link .badge { font-size:10px; }

/* ── Pagination ──────────────────────────────────────── */
.page-link { background:var(--paper); border-color:var(--hair-strong); color:var(--ink-2); border-radius:var(--r-sm) !important; margin:0 2px; font-family:var(--font-mono); font-size:12px; }
.page-link:hover { background:var(--paper-2); color:var(--ink); }
.page-item.active .page-link { background:var(--accent); border-color:var(--accent); color:var(--ink); }

/* ── Code & pre ──────────────────────────────────────── */
code { background:var(--info-soft); color:var(--info-ink); padding:2px 6px; border-radius:var(--r-sm); font-family:var(--font-mono); font-size:12.5px; }
pre { color:var(--ink-2); font-size:12.5px; line-height:1.6; font-family:var(--font-mono); }

/* ── Page header ─────────────────────────────────────── */
.page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; padding-bottom:16px; border-bottom:1px solid var(--hair); }
.page-header h4 { margin:0; font-size:22px; font-family:var(--font-display); letter-spacing:-.03em; }
.page-header .text-muted { color:var(--ink-3) !important; font-family:var(--font-mono); font-size:12px; }

.section-title { font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); margin-bottom:12px; }

hr { border-color:var(--hair); opacity:1; }
.border-top { border-color:var(--hair) !important; }
.border-secondary { border-color:var(--hair) !important; }

/* text utils */
.text-white   { color:var(--ink)     !important; }
.text-muted   { color:var(--ink-3)   !important; }
.text-success { color:var(--ok-ink)  !important; }
.text-warning { color:var(--warn-ink)!important; }
.text-danger  { color:var(--danger)  !important; }
.text-info    { color:var(--info-ink)!important; }

/* ── Login ───────────────────────────────────────────── */
.login-card { width:100%; max-width:360px; }
.login-card .card-dark, .login-card .card { border:1px solid var(--hair-strong); padding:36px; box-shadow:var(--shadow-2); }
.login-grid::before { content:''; position:fixed; inset:0; z-index:-1; opacity:.5;
  background-image:linear-gradient(var(--hair) 1px,transparent 1px),linear-gradient(90deg,var(--hair) 1px,transparent 1px);
  background-size:80px 80px; }

/* ── Analytics ───────────────────────────────────────── */
.acard { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg); padding:18px; box-shadow:var(--shadow-1); height:100%; }
.acard .lbl { font-family:var(--font-mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); margin-bottom:10px; }
.acard .an { font-family:var(--font-display); font-size:36px; font-weight:500; letter-spacing:-.045em; line-height:1; color:var(--ink); }
.acard.orange .an { color:var(--brand-orange); } .acard.teal .an { color:var(--brand-teal); }
.acard .an small { font-size:20px; color:var(--ink-3); }
.acard .dl { font-family:var(--font-mono); font-size:11px; margin-top:9px; display:flex; align-items:center; gap:5px; color:var(--ink-3); }
.acard .dl.up { color:var(--ok-ink); } .acard .dl.dn { color:var(--danger); }
.acard .dl [data-lucide]{ width:12px; height:12px; } .acard .dl .base { color:var(--ink-3); }

.cols { display:flex; align-items:flex-end; gap:9px; height:200px; padding-top:10px; }
.cols .col { flex:1; display:flex; flex-direction:column; align-items:center; gap:8px; height:100%; justify-content:flex-end; }
.cols .col .bar { width:70%; background:var(--accent); border-radius:3px 3px 0 0; min-height:4px; }
.cols .col .bar.proj { background:repeating-linear-gradient(45deg,var(--brand-orange-soft),var(--brand-orange-soft) 5px,var(--paper-2) 5px,var(--paper-2) 10px); border:1px solid var(--brand-orange-soft); }
.cols .col .ml { font-family:var(--font-mono); font-size:9.5px; color:var(--ink-3); }

.donut-wrap { display:flex; align-items:center; gap:20px; }
.donut { width:130px; height:130px; border-radius:50%; flex-shrink:0; position:relative; }
.donut::after { content:''; position:absolute; inset:26px; background:var(--paper); border-radius:50%; }
.donut .ctr { position:absolute; inset:26px; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:1; }
.donut .ctr .n { font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--ink); line-height:1; }
.donut .ctr .l { font-family:var(--font-mono); font-size:9px; color:var(--ink-3); text-transform:uppercase; letter-spacing:.06em; margin-top:3px; }
.leg { display:flex; flex-direction:column; gap:9px; }
.leg .li { display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink-2); }
.leg .sw { width:11px; height:11px; border-radius:3px; flex-shrink:0; }
.leg .li .vv { margin-left:auto; font-family:var(--font-mono); font-size:11px; color:var(--ink); font-weight:600; padding-left:14px; }

.fun { display:flex; flex-direction:column; gap:10px; }
.fun .frow { display:flex; align-items:center; gap:12px; }
.fun .frow .fl { font-size:12.5px; color:var(--ink-2); width:110px; flex-shrink:0; }
.fun .frow .ft { flex:1; height:26px; background:var(--paper-3); border-radius:var(--r-sm); overflow:hidden; }
.fun .frow .fb { height:100%; background:var(--accent); border-radius:var(--r-sm); display:flex; align-items:center; padding-left:10px; font-family:var(--font-mono); font-size:11px; color:var(--ink); font-weight:600; }
.fun .frow .fp { font-family:var(--font-mono); font-size:11px; color:var(--ink-3); width:42px; text-align:right; flex-shrink:0; }

.hbar { display:flex; flex-direction:column; gap:11px; }
.hbar .hrow { display:flex; align-items:center; gap:12px; }
.hbar .hrow .hl { font-size:12.5px; color:var(--ink-2); width:110px; flex-shrink:0; }
.hbar .hrow .ht { flex:1; height:9px; background:var(--paper-3); border-radius:var(--r-pill); overflow:hidden; }
.hbar .hrow .hb { height:100%; background:var(--brand-teal); border-radius:var(--r-pill); }
.hbar .hrow .hv { font-family:var(--font-mono); font-size:11px; color:var(--ink); width:34px; text-align:right; flex-shrink:0; }

/* ── Command palette (⌘K) ────────────────────────────── */
.cmd-overlay { position:fixed; inset:0; z-index:1000; background:rgba(16,17,14,.55); backdrop-filter:blur(2px); display:none; justify-content:center; align-items:flex-start; padding-top:12vh; }
.cmd-overlay.open { display:flex; }
.cmd { width:600px; max-width:92vw; background:var(--paper); border:1px solid var(--hair-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-2); overflow:hidden; }
.cmd-in { display:flex; align-items:center; gap:11px; padding:16px 18px; border-bottom:1px solid var(--hair); }
.cmd-in [data-lucide]{ width:18px; height:18px; color:var(--ink-3); }
.cmd-in input { flex:1; border:none; outline:none; background:transparent; font-family:var(--font-sans); font-size:17px; color:var(--ink); }
.cmd-in input::placeholder { color:var(--ink-4); }
.cmd-in .esc { font-family:var(--font-mono); font-size:10px; background:var(--paper-2); border:1px solid var(--hair-strong); border-radius:4px; padding:3px 7px; color:var(--ink-3); cursor:pointer; }
.cmd-body { max-height:56vh; overflow-y:auto; padding:8px; }
.cmd-grp { font-family:var(--font-mono); font-size:9.5px; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-3); padding:12px 12px 5px; }
.cmd-it { display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:var(--r); cursor:pointer; text-decoration:none; }
.cmd-it:hover, .cmd-it.sel { background:var(--paper-2); }
.cmd-it.sel { outline:1.5px solid var(--accent); outline-offset:-1.5px; }
.cmd-it .cico { width:30px; height:30px; border-radius:var(--r-sm); background:var(--paper-3); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.cmd-it .cico [data-lucide]{ width:15px; height:15px; color:var(--ink-2); }
.cmd-it .cm { flex:1; min-width:0; }
.cmd-it .ct { font-size:13.5px; color:var(--ink); }
.cmd-it .ct mark { background:var(--brand-orange-soft); color:var(--ink); border-radius:2px; padding:0 1px; }
.cmd-it .cs { font-size:11.5px; color:var(--ink-3); margin-top:1px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cmd-empty { padding:40px 20px; text-align:center; color:var(--ink-3); font-size:13px; }
.cmd-foot { display:flex; align-items:center; gap:16px; padding:10px 18px; border-top:1px solid var(--hair); font-family:var(--font-mono); font-size:10.5px; color:var(--ink-3); }
.cmd-foot .k { background:var(--paper-2); border:1px solid var(--hair-strong); border-radius:3px; padding:1px 5px; margin-right:4px; }

/* ── Modal (confirm) ─────────────────────────────────── */
.mm-overlay { position:fixed; inset:0; z-index:1010; background:rgba(16,17,14,.55); backdrop-filter:blur(2px); display:none; justify-content:center; align-items:center; padding:20px; }
.mm-overlay.open { display:flex; }
.mm { width:440px; max-width:100%; background:var(--paper); border:1px solid var(--hair-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-2); overflow:hidden; }
.mm-h { display:flex; align-items:flex-start; gap:12px; padding:22px 24px 16px; }
.mm-h .mi { width:38px; height:38px; border-radius:var(--r); background:var(--warn-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.mm-h .mi [data-lucide]{ color:var(--warn-ink); width:19px; height:19px; }
.mm-h.danger .mi { background:var(--danger-soft); } .mm-h.danger .mi [data-lucide]{ color:var(--danger); }
.mm-h h2 { font-family:var(--font-display); font-size:17px; font-weight:600; color:var(--ink); margin:0 0 4px; letter-spacing:-.02em; }
.mm-h p { font-size:13px; color:var(--ink-2); margin:0; line-height:1.5; }
.mm-f { display:flex; gap:10px; justify-content:flex-end; padding:16px 24px; border-top:1px solid var(--hair); background:var(--paper-2); }

/* ── Loading overlay ─────────────────────────────────── */
.load-overlay { position:fixed; inset:0; z-index:1020; background:rgba(16,17,14,.5); backdrop-filter:blur(2px); display:none; justify-content:center; align-items:center; }
.load-overlay.open { display:flex; }
.load-box { background:var(--paper); border:1px solid var(--hair-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-2); padding:26px 30px; display:flex; align-items:center; gap:16px; min-width:300px; }
.load-spin { width:26px; height:26px; border:3px solid var(--paper-3); border-top-color:var(--accent); border-radius:50%; animation:mm-spin .9s linear infinite; flex-shrink:0; }
.load-box .lt { font-family:var(--font-display); font-size:16px; font-weight:600; color:var(--ink); }
.load-box .ls { font-family:var(--font-mono); font-size:11px; color:var(--ink-3); margin-top:2px; }
@keyframes mm-spin { to { transform:rotate(360deg); } }

/* ── Misc ────────────────────────────────────────────── */
.min-w-0 { min-width:0; }
.gap-2 { gap:8px !important; } .gap-3 { gap:12px !important; }

::selection { background:var(--brand-orange-soft); color:var(--ink); }
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--hair-strong); border-radius:var(--r-pill); }
::-webkit-scrollbar-thumb:hover { background:var(--ink-4); }

/* ── Bootstrap modals (tema claro) ───────────────────── */
.modal-content { background:var(--paper); border:1px solid var(--hair-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-2); color:var(--ink); }
.modal-header { border-bottom:1px solid var(--hair); padding:18px 22px; }
.modal-title { font-family:var(--font-display); font-size:17px; font-weight:600; letter-spacing:-.02em; color:var(--ink); }
.modal-body { padding:20px 22px; }
.modal-footer { border-top:1px solid var(--hair); background:var(--paper-2); padding:14px 22px; border-radius:0 0 var(--r-lg) var(--r-lg); }
.modal-backdrop { background:rgba(16,17,14,.55); }
.modal .btn-close { filter:none; opacity:.55; }
.modal .btn-close:hover { opacity:1; }

/* botón de cerrar de alerts: la variante -white era invisible en tema claro */
.alert .btn-close, .alert .btn-close-white { filter:none !important; opacity:.55; }

/* toasts: los mensajes de acción flotan arriba a la derecha */
.toast-wrap { position:fixed; top:18px; right:18px; z-index:1080; display:flex; flex-direction:column; gap:10px; max-width:min(420px, calc(100vw - 36px)); }
.toast-item { margin:0 !important; box-shadow:var(--shadow-2); animation:toast-in .25s var(--ease); }
.toast-item.bye { opacity:0; transform:translateY(-6px); transition:opacity .35s, transform .35s; }
@keyframes toast-in { from { opacity:0; transform:translateY(-8px); } }

/* pre/código en bloques (reemplaza los fondos oscuros hardcodeados) */
.pre-block { background:var(--paper-2); border:1px solid var(--hair); border-radius:var(--r); color:var(--ink-2); padding:12px; font-family:var(--font-mono); font-size:12px; white-space:pre-wrap; }

/* cards bootstrap heredadas del tema oscuro (moodles) */
.card.bg-dark { background:var(--paper) !important; color:var(--ink) !important; border:1px solid var(--hair) !important; }
.card.bg-dark .text-light, .card.text-light { color:var(--ink) !important; }
.badge.bg-dark { background:var(--paper-3) !important; color:var(--ink-2) !important; border-color:var(--hair-strong) !important; }

.input-group-text { background:var(--paper-2); border:1px solid var(--hair-strong); color:var(--ink-3); font-family:var(--font-mono); }

/* dropdowns (menú de acciones en cards) */
.dropdown-menu { background:var(--paper); border:1px solid var(--hair-strong); border-radius:var(--r-md); box-shadow:var(--shadow-2); font-size:13px; padding:6px; }
.dropdown-item { color:var(--ink-2); border-radius:var(--r-sm); padding:7px 10px; display:flex; align-items:center; gap:8px; }
.dropdown-item:hover { background:var(--paper-2); color:var(--ink); }
.dropdown-item.danger { color:var(--danger); }
.dropdown-item.danger:hover { background:var(--danger-soft); }
.dropdown-divider { border-color:var(--hair); }
.dropdown-header { font-family:var(--font-mono); font-size:9.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-3); padding:6px 10px 4px; }

/* ── Kanban board ────────────────────────────────────── */
.kb-board { display:flex; gap:14px; align-items:stretch; overflow-x:auto; padding-bottom:10px; }
.kb-col { flex:1; min-width:250px; background:var(--paper-2); border:1px solid var(--hair); border-radius:var(--r-lg); padding:10px; display:flex; flex-direction:column; transition:background var(--dur-fast) var(--ease); }
.kb-col-h { display:flex; align-items:center; gap:8px; padding:4px 6px 10px; }
.kb-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; background:var(--ink-4); display:inline-block; }
.kb-col-h .t { font-family:var(--font-display); font-weight:600; font-size:14px; color:var(--ink); }
.kb-col-h .n { font-family:var(--font-mono); font-size:10.5px; background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-pill); padding:1px 8px; color:var(--ink-3); }
.kb-col-h .sum { margin-left:auto; font-family:var(--font-mono); font-size:11px; color:var(--ink-3); white-space:nowrap; }
.kb-col-h .kb-add { margin-left:auto; border:none; background:transparent; color:var(--ink-4); border-radius:var(--r-sm); padding:2px 4px; line-height:1; display:inline-flex; }
.kb-col-h .kb-add:hover { background:var(--paper); color:var(--accent-hover); }
.kb-col-h .kb-add [data-lucide]{ width:15px; height:15px; }
.kb-col-h .sum + .kb-add, .kb-col-h .n + .kb-add { margin-left:auto; }
.kb-cards { display:flex; flex-direction:column; gap:8px; min-height:60px; flex-grow:1; }
.kb-empty { color:var(--ink-4); font-size:12px; text-align:center; padding:22px 8px; border:1.5px dashed var(--hair-strong); border-radius:var(--r-md); }
.kb-more { color:var(--ink-3); font-size:11.5px; text-align:center; padding:6px; font-family:var(--font-mono); }

.kb-card { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-md); padding:11px 12px; box-shadow:var(--shadow-1); position:relative;
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.kb-card[draggable="true"] { cursor:grab; }
.kb-card:hover { border-color:var(--hair-strong); box-shadow:var(--shadow-2); }
.kb-card.dragging { opacity:.45; cursor:grabbing; }
.kb-col.dragover { outline:2px dashed var(--accent); outline-offset:-3px; background:var(--brand-orange-soft); }
.kb-card .kt { font-weight:600; font-size:13.5px; color:var(--ink); line-height:1.35; display:block; padding-right:22px; }
.kb-card .kt:hover { color:var(--accent-hover); }
.kb-card .kc { font-size:12px; color:var(--ink-3); margin-top:1px; }
.kb-card .kb-menu { position:absolute; top:7px; right:6px; }
.kb-card .kb-menu > button, .kb-card .kb-menu > a { border:none; background:transparent; color:var(--ink-4); border-radius:var(--r-sm); padding:2px 4px; line-height:1; display:inline-flex; }
.kb-card .kb-menu > button:hover, .kb-card .kb-menu > a:hover { background:var(--paper-2); color:var(--ink); }
.kb-meta { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; align-items:center; }
.kb-chip { font-family:var(--font-mono); font-size:10.5px; padding:2px 7px; border-radius:var(--r-pill); background:var(--paper-2); border:1px solid var(--hair); color:var(--ink-2); display:inline-flex; align-items:center; gap:4px; text-decoration:none; }
.kb-chip [data-lucide]{ width:11px; height:11px; }
.kb-chip.value { background:var(--ok-soft); color:var(--ok-ink); border-color:transparent; font-weight:600; }
.kb-chip.due  { background:var(--info-soft); color:var(--info-ink); border-color:transparent; }
.kb-chip.due.over { background:var(--danger-soft); color:var(--danger); }
.kb-chip.prio-alta { background:var(--danger-soft); color:var(--danger); border-color:transparent; font-weight:600; }
.kb-actions { display:flex; gap:5px; margin-top:8px; flex-wrap:wrap; }

/* acentos por etapa/estado */
.kb-dot.st-nueva, .kb-dot.st-pendiente   { background:var(--info); }
.kb-dot.st-presentado, .kb-dot.st-en_progreso { background:var(--warn); }
.kb-dot.st-ganado, .kb-dot.st-hecha      { background:var(--ok); }
.kb-dot.st-perdido, .kb-dot.st-bloqueada { background:var(--danger); }

/* ── Accesos directos (dashboard) ────────────────────── */
.qa-card { display:flex; align-items:center; gap:13px; background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg);
  padding:16px 18px; box-shadow:var(--shadow-1); text-decoration:none; height:100%;
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease); }
.qa-card:hover { border-color:var(--hair-strong); box-shadow:var(--shadow-2); transform:translateY(-1px); }
.qa-ico { width:40px; height:40px; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.qa-ico [data-lucide]{ width:19px; height:19px; }
.qa-ico.orange { background:var(--brand-orange-soft); color:var(--warn-ink); }
.qa-ico.teal   { background:var(--brand-teal-soft);   color:var(--ok-ink); }
.qa-ico.info   { background:var(--info-soft);         color:var(--info-ink); }
.qa-ico.ink    { background:var(--paper-3);           color:var(--ink-2); }
.qa-card .t { font-family:var(--font-display); font-weight:600; font-size:14.5px; color:var(--ink); line-height:1.25; }
.qa-card .s { font-size:11px; color:var(--ink-3); font-family:var(--font-mono); }
.qa-card .go { margin-left:auto; color:var(--ink-4); flex-shrink:0; }
.qa-card:hover .go { color:var(--accent); }

/* ── Sidebar: secciones colapsables ──────────────────── */
.sidebar .nav-section { cursor:pointer; user-select:none; display:flex; align-items:center; gap:6px; }
.sidebar .nav-section:hover { color:#c9c4b4 !important; }
.sidebar .nav-section .chev { margin-left:auto; display:inline-flex; transition:transform var(--dur-fast) var(--ease); }
.sidebar .nav-section .chev [data-lucide]{ width:12px; height:12px; }
.sidebar .nav-section.closed .chev { transform:rotate(-90deg); }
.sidebar .nav-section.closed .sec-badge { display:inline-block !important; }
.sidebar .nav-item.collapsed { display:none; }

/* ── Feed de alertas / automatizaciones ──────────────── */
.al-item { display:flex; align-items:flex-start; gap:13px; padding:14px 0; border-bottom:1px solid var(--hair); }
.al-item:last-child { border-bottom:none; }
.al-ico { width:34px; height:34px; border-radius:var(--r); background:var(--paper-2); border:1px solid var(--hair); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.al-ico [data-lucide]{ width:16px; height:16px; color:var(--ink-2); }
.al-ico.warn { background:var(--warn-soft); border-color:transparent; } .al-ico.warn [data-lucide]{ color:var(--warn-ink); }
.al-ico.danger { background:var(--danger-soft); border-color:transparent; } .al-ico.danger [data-lucide]{ color:var(--danger); }
.al-ico.ok { background:var(--ok-soft); border-color:transparent; } .al-ico.ok [data-lucide]{ color:var(--ok-ink); }
.al-ico.info { background:var(--info-soft); border-color:transparent; } .al-ico.info [data-lucide]{ color:var(--info-ink); }
.al-bd { flex:1; min-width:0; }
.al-hd { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:2px; }
.al-hd .when { font-family:var(--font-mono); font-size:11px; color:var(--ink-3); }
.al-tx { font-size:13px; color:var(--ink-2); white-space:pre-line; overflow-wrap:break-word; }

/* catálogo de automatizaciones */
.auto-card { background:var(--paper); border:1px solid var(--hair); border-radius:var(--r-lg); padding:16px 18px; box-shadow:var(--shadow-1); height:100%; display:flex; flex-direction:column; gap:8px; }
.auto-card .ah { display:flex; align-items:center; gap:10px; }
.auto-card .ah [data-lucide]{ width:17px; height:17px; color:var(--ink-2); flex-shrink:0; }
.auto-card .ah .t { font-family:var(--font-display); font-weight:600; font-size:14px; color:var(--ink); flex:1; }
.auto-card .desc { font-size:12.5px; color:var(--ink-2); flex-grow:1; }
.auto-card .meta { display:flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:10.5px; color:var(--ink-3); flex-wrap:wrap; }
.auto-card .meta .sched { background:var(--paper-2); border:1px solid var(--hair); border-radius:var(--r-sm); padding:2px 7px; }

/* ── Responsive ──────────────────────────────────────── */
@media (max-width:768px) {
  .sidebar { width:56px; min-width:56px; }
  .sidebar .nav-link span:not(.nav-icon) { display:none; }
  .sidebar .nav-link { justify-content:center; padding:10px; gap:0; }
  .sidebar .nav-link .badge { position:absolute; transform:translate(14px,-10px); }
  .sidebar .nav-link { position:relative; }
  .sidebar .nav-section, .sidebar-brand .fw-bold, .sidebar-brand .text-muted, .sidebar-brand p, .sidebar-wm, .sidebar-brand .brand-sub { display:none; }
  .sidebar-brand { padding:14px 8px !important; }
  .sidebar-brand .brand-logo { height:16px; margin:0 auto; }
  .sidebar-foot .usr-name { display:none; }
  .util-bar { flex-wrap:wrap; }
  .gsearch { max-width:none; order:3; flex-basis:100%; }
  .kb-board { flex-direction:column; }
  .kb-col { min-width:0; }
  /* en móvil los títulos de sección se ocultan: mostrar siempre los items */
  .sidebar .nav-item.collapsed { display:block; }
}
