:root {
  --bg: #f4f6fb;
  --bg-soft: #eef1fa;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --text: #0f1e3c;
  --muted: #667085;
  --border: #e5e9f0;
  --navy: #0f1e3c;
  --navy-2: #14264d;
  --purple: #5b46e8;
  --purple-2: #7b61ff;
  --purple-soft: #eef1ff;
  --green: #10b981;
  --green-soft: #eafaf2;
  --orange: #f59e0b;
  --orange-soft: #fff7e6;
  --red: #ef4444;
  --red-soft: #fff0f0;
  --blue: #2563eb;
  --blue-soft: #eaf1ff;
  --shadow: 0 14px 34px -22px rgba(15, 30, 60, .55);
  --shadow-soft: 0 6px 18px -12px rgba(15, 30, 60, .45);
  --radius: 18px;
  --radius-sm: 12px;
  --sidebar: 78px;
  --topbar: 72px;
}

[data-theme="dark"] {
  --bg: #0b1020;
  --bg-soft: #0e162a;
  --surface: #111a2f;
  --surface-2: #16213a;
  --text: #f4f7fb;
  --muted: #a8b3c7;
  --border: rgba(255,255,255,.09);
  --navy: #070d1b;
  --navy-2: #101a31;
  --purple-soft: rgba(123, 97, 255, .14);
  --green-soft: rgba(16,185,129,.14);
  --orange-soft: rgba(245,158,11,.14);
  --red-soft: rgba(239,68,68,.14);
  --blue-soft: rgba(37,99,235,.16);
  --shadow: 0 20px 50px -30px rgba(0,0,0,.9);
  --shadow-soft: 0 10px 26px -20px rgba(0,0,0,.75);
}

* { box-sizing: border-box; }
html { min-height: 100%; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Arial, sans-serif;
  background:
    radial-gradient(circle at 18% 8%, rgba(123, 97, 255, .13), transparent 28%),
    radial-gradient(circle at 82% 18%, rgba(37, 99, 235, .11), transparent 24%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);
  color: var(--text);
  min-height: 100vh;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.app-shell { min-height: 100vh; padding-top: var(--topbar); padding-left: var(--sidebar); }

.topbar {
  position: fixed; inset: 0 0 auto 0; height: var(--topbar);
  z-index: 20;
  display: flex; align-items: center; gap: 22px;
  padding: 0 24px;
  color: #fff;
  background: linear-gradient(135deg, var(--navy), #151f43 62%, #2a1f6c);
  box-shadow: 0 10px 30px -22px #000;
}
.brand { display: flex; align-items: center; gap: 12px; min-width: 178px; }
.brand-mark {
  width: 38px; height: 38px; border-radius: 11px;
  background: linear-gradient(135deg, var(--purple), var(--purple-2));
  display:flex; align-items:center; justify-content:center;
  font-weight: 900; letter-spacing: -.04em;
  box-shadow: 0 8px 18px -8px rgba(123,97,255,.8);
}
.brand-word { font-size: 18px; font-weight: 850; letter-spacing: -.04em; }
.topnav { display: flex; align-items: center; gap: 4px; flex: 1; }
.topnav a {
  color: rgba(255,255,255,.78);
  padding: 10px 13px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 650;
  white-space: nowrap;
}
.topnav a:hover, .topnav a.active { background: rgba(255,255,255,.10); color: #fff; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.top-pill, .icon-pill, .select-pill {
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: white;
  border-radius: 999px;
  min-height: 38px;
  padding: 0 13px;
  display:flex; align-items:center; gap: 8px;
  font-size: 13px; font-weight: 700;
  cursor: pointer;
}
.icon-pill { width: 38px; justify-content:center; padding: 0; }
.select-pill { appearance: none; outline: none; color: white; }
.select-pill option { color: #111827; }
.avatar {
  width: 38px; height: 38px; border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--purple), var(--purple-2));
  color:#fff; font-size: 12px; font-weight: 850;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.14);
}

.sidebar {
  position: fixed; top: var(--topbar); left: 0; bottom: 0; width: var(--sidebar); z-index: 15;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 18px 12px;
  background: linear-gradient(180deg, #0b1531, #091124);
  border-right: 1px solid rgba(255,255,255,.06);
}
.side-link {
  width: 46px; height: 46px; border-radius: 15px;
  display:flex; align-items:center; justify-content:center;
  color: rgba(255,255,255,.72);
  font-size: 20px;
  transition: .16s ease;
}
.side-link:hover, .side-link.active { background: linear-gradient(135deg, var(--purple), var(--purple-2)); color: #fff; box-shadow: 0 8px 18px -9px rgba(123,97,255,.9); }
.side-spacer { flex: 1; }

.main { padding: 30px; max-width: 1680px; margin: 0 auto; }
.page-head { display:flex; justify-content:space-between; align-items:flex-start; gap: 18px; margin-bottom: 22px; }
.eyebrow { font-size: 11px; font-weight: 850; color: var(--purple); text-transform: uppercase; letter-spacing: .11em; margin-bottom: 8px; }
h1 { margin: 0; font-size: 32px; letter-spacing: -.045em; line-height: 1.12; }
.subtitle { margin-top: 8px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.head-actions { display:flex; gap: 10px; align-items:center; flex-wrap: wrap; justify-content:flex-end; }

.card {
  background: color-mix(in srgb, var(--surface) 97%, transparent);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}
.card-pad { padding: 20px; }
.card-title { margin: 0 0 12px; font-size: 17px; letter-spacing: -.02em; }
.card-subtitle { color: var(--muted); font-size: 13px; line-height: 1.5; margin: -6px 0 16px; }
.grid { display:grid; gap: 18px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.btn {
  border: 1px solid var(--border); background: var(--surface); color: var(--text);
  min-height: 42px; padding: 0 16px; border-radius: 12px;
  font-weight: 750; cursor: pointer; display:inline-flex; align-items:center; gap: 8px; justify-content:center;
  box-shadow: none;
}
.btn-primary { border: 0; color: #fff; background: linear-gradient(135deg, var(--purple), var(--purple-2)); box-shadow: 0 10px 24px -15px rgba(91,70,232,.8); }
.btn-danger { border: 0; color:#fff; background: var(--red); }
.btn-sm { min-height: 34px; padding: 0 12px; border-radius: 10px; font-size: 13px; }
.input, .select, .textarea {
  width: 100%; min-height: 42px;
  border: 1px solid var(--border); border-radius: 12px;
  background: var(--surface); color: var(--text);
  padding: 0 13px; outline: none;
}
.textarea { min-height: 110px; padding: 12px 13px; resize: vertical; }
.input:focus, .select:focus, .textarea:focus { border-color: rgba(91,70,232,.55); box-shadow: 0 0 0 4px rgba(91,70,232,.10); }
label { display:block; font-size: 11px; font-weight: 850; color: var(--muted); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 7px; }
.form-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }

.badge {
  display:inline-flex; align-items:center; gap: 6px;
  min-height: 26px; padding: 0 10px; border-radius: 999px;
  font-size: 12px; font-weight: 800;
  background: var(--purple-soft); color: var(--purple); border: 1px solid rgba(91,70,232,.16);
  white-space: nowrap;
}
.badge.green { background: var(--green-soft); color: #079569; border-color: rgba(16,185,129,.22); }
.badge.orange { background: var(--orange-soft); color: #b76b00; border-color: rgba(245,158,11,.24); }
.badge.red { background: var(--red-soft); color: #d12d2d; border-color: rgba(239,68,68,.20); }
.badge.blue { background: var(--blue-soft); color: var(--blue); border-color: rgba(37,99,235,.18); }
.badge.gray { background: var(--surface-2); color: var(--muted); border-color: var(--border); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; display:inline-block; }

.table-card { overflow:hidden; }
table { width: 100%; border-collapse: collapse; }
th { text-align:left; font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; padding: 14px 16px; background: var(--surface-2); }
td { padding: 15px 16px; border-top: 1px solid var(--border); color: color-mix(in srgb, var(--text) 90%, var(--muted)); font-size: 14px; vertical-align: middle; }
.table-actions { color: var(--muted); text-align:right; font-size: 20px; }
.avatar-mini {
  width: 34px; height: 34px; border-radius: 50%;
  display:inline-flex; align-items:center; justify-content:center;
  background: var(--purple-soft); color: var(--purple); font-weight:850; font-size: 12px; margin-right: 9px;
}
.person { display:flex; align-items:center; min-width: 0; }
.person strong { display:block; color: var(--text); }
.person small { display:block; color: var(--muted); margin-top: 2px; }

.kpi { padding: 18px; position: relative; overflow:hidden; }
.kpi::after { content:""; position:absolute; right:-26px; top:-32px; width:96px; height:96px; border-radius:50%; background: var(--purple-soft); }
.kpi-label { color: var(--muted); font-weight: 750; font-size: 13px; }
.kpi-value { margin-top: 8px; font-size: 34px; line-height:1; font-weight: 900; letter-spacing:-.05em; color: var(--purple); }
.kpi-note { color: var(--muted); font-size: 12px; margin-top: 8px; }

.filter-row { display:flex; align-items:center; gap: 10px; margin-bottom: 16px; }
.filter-row .input { flex: 1; }

.login-page { min-height: 100vh; display:grid; grid-template-columns: 1fr 520px; align-items:center; gap: 54px; padding: 80px 11vw; }
.login-brand { display:flex; flex-direction:column; gap: 14px; align-items:flex-start; }
.login-logo { width: 92px; height: 92px; border-radius: 26px; font-size: 44px; }
.login-brand h1 { font-size: 56px; }
.login-card { padding: 34px; }
.login-card h2 { margin:0; font-size: 28px; letter-spacing:-.035em; }
.login-foot { margin-top: 22px; display:flex; gap: 14px; justify-content:center; color: var(--muted); font-size: 13px; }

.profile-grid { display:grid; grid-template-columns: 340px 1fr; gap: 18px; }
.detail-list { display:grid; gap: 12px; margin: 18px 0; }
.detail-item { display:flex; gap: 10px; align-items:flex-start; color: var(--muted); font-size: 14px; }
.detail-item strong { color: var(--text); }
.tabs { display:flex; gap: 6px; border-bottom:1px solid var(--border); margin: -20px -20px 20px; padding: 0 16px; }
.tab { padding: 16px 10px 14px; color: var(--muted); font-weight: 750; font-size: 14px; border-bottom: 3px solid transparent; }
.tab.active { color: var(--purple); border-bottom-color: var(--purple); }

.calendar-layout { display:grid; grid-template-columns: minmax(0,1.5fr) minmax(360px,.8fr); gap:18px; }
.week-grid { display:grid; grid-template-columns: repeat(7, 1fr); gap: 10px; }
.day { min-height: 250px; border:1px solid var(--border); border-radius: 15px; padding: 10px; background: var(--surface-2); }
.day.active { background: var(--purple-soft); border-color: rgba(91,70,232,.25); }
.day-head { font-size: 12px; color: var(--muted); font-weight:850; text-transform:uppercase; display:flex; justify-content:space-between; align-items:center; margin-bottom: 8px; }
.event { border-left: 3px solid var(--purple); background: var(--surface); border-radius: 10px; padding: 8px; font-size: 12px; margin-bottom: 7px; box-shadow: var(--shadow-soft); }
.event.green { border-left-color: var(--green); }
.event.orange { border-left-color: var(--orange); }
.event.blue { border-left-color: var(--blue); }
.event strong { display:block; color:var(--text); }
.timeline { display:grid; gap: 10px; }
.timeline-item { display:grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items:center; padding: 12px; border:1px solid var(--border); border-radius: 14px; background: var(--surface-2); }
.timeline-time { color: var(--purple); font-weight: 900; }

.steps { display:grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 18px; }
.step { display:flex; align-items:center; gap: 10px; padding: 14px; border:1px solid var(--border); border-radius: 14px; background: var(--surface); color: var(--muted); font-weight: 750; }
.step b { width: 28px; height: 28px; border-radius: 50%; display:flex; align-items:center; justify-content:center; background: var(--surface-2); color: var(--muted); }
.step.active { color: var(--purple); border-color: rgba(91,70,232,.23); background: var(--purple-soft); }
.step.active b { color:#fff; background: linear-gradient(135deg,var(--purple),var(--purple-2)); }
.dropzone { min-height: 180px; border: 2px dashed rgba(91,70,232,.35); border-radius: 16px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap: 10px; background: var(--purple-soft); }
.upload-icon { width: 58px; height:58px; border-radius: 18px; background: linear-gradient(135deg,var(--purple),var(--purple-2)); color:#fff; display:flex; align-items:center; justify-content:center; font-size: 26px; box-shadow: 0 12px 24px -16px rgba(91,70,232,.95); }

.ai-box { min-height: 190px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 16px; padding: 14px; color: var(--muted); line-height: 1.65; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; }
.credit-card { display:flex; align-items:center; justify-content:space-between; gap: 18px; padding: 18px; background: linear-gradient(135deg, var(--navy), #2a1f6c); color: #fff; border-radius: var(--radius); box-shadow: var(--shadow); }
.credit-card .num { font-size: 34px; font-weight: 900; letter-spacing:-.05em; }

.super-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap:18px; }
.module-card { padding: 18px; display:flex; gap: 14px; align-items:flex-start; }
.module-icon { width: 44px; height: 44px; border-radius: 14px; display:flex; align-items:center; justify-content:center; background:var(--purple-soft); color:var(--purple); font-size: 22px; flex:none; }
.metric-line { display:flex; align-items:center; justify-content:space-between; gap: 12px; padding: 13px 0; border-bottom:1px solid var(--border); }
.metric-line:last-child { border-bottom:0; }

.placeholder { min-height: 560px; display:flex; align-items:center; justify-content:center; text-align:center; padding: 40px; }
.placeholder-inner { max-width: 560px; }
.placeholder-icon { width: 86px; height:86px; border-radius: 30px; margin: 0 auto 18px; display:flex; align-items:center; justify-content:center; background: var(--purple-soft); color: var(--purple); font-size: 42px; }

.status-banner { display:flex; align-items:flex-start; gap: 14px; border:1px solid rgba(91,70,232,.18); background: var(--purple-soft); padding: 16px 18px; border-radius: var(--radius); color: var(--text); margin-bottom: 18px; }
.status-banner b { color: var(--purple); }

[dir="rtl"] .topnav, [dir="rtl"] .top-actions, [dir="rtl"] .brand, [dir="rtl"] .filter-row, [dir="rtl"] .person, [dir="rtl"] .detail-item { flex-direction: row-reverse; }
[dir="rtl"] .app-shell { padding-left: 0; padding-right: var(--sidebar); }
[dir="rtl"] .sidebar { left: auto; right: 0; border-right: 0; border-left: 1px solid rgba(255,255,255,.06); }
[dir="rtl"] th, [dir="rtl"] td { text-align: right; }
[dir="rtl"] .table-actions { text-align: left; }
[dir="rtl"] .event { border-left: 0; border-right: 3px solid var(--purple); }
[dir="rtl"] .event.green { border-right-color: var(--green); }
[dir="rtl"] .event.orange { border-right-color: var(--orange); }
[dir="rtl"] .event.blue { border-right-color: var(--blue); }

@media (max-width: 1100px) {
  .topnav { display:none; }
  .grid-4 { grid-template-columns: repeat(2,1fr); }
  .grid-3 { grid-template-columns: repeat(2,1fr); }
  .profile-grid, .calendar-layout, .super-grid, .login-page { grid-template-columns: 1fr; }
  .login-page { padding: 60px 24px; }
}
@media (max-width: 760px) {
  :root { --sidebar: 0px; }
  .sidebar { display:none; }
  .main { padding: 20px 14px; }
  .grid-4, .grid-3, .grid-2, .form-grid { grid-template-columns: 1fr; }
  .page-head, .filter-row { flex-direction: column; align-items: stretch; }
  .steps { grid-template-columns: 1fr; }
  table { min-width: 860px; }
  .table-card { overflow:auto; }
}

/* === NOVEX v2 — circuit dialer, stock, rappels et analyse appels === */
.workflow-map { display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 12px; }
.workflow-step { position:relative; padding: 15px; border:1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-soft); }
.workflow-step::after { content:'→'; position:absolute; right:-12px; top:50%; transform:translateY(-50%); color:var(--muted); font-weight:900; }
.workflow-step:last-child::after { display:none; }
.workflow-num { width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--purple),var(--purple-2)); color:#fff; font-weight:900; margin-bottom:10px; }
.workflow-title { font-weight:850; color:var(--text); margin-bottom:5px; }
.workflow-desc { color:var(--muted); font-size:12px; line-height:1.45; }
.dialer-layout { display:grid; grid-template-columns: minmax(320px,.85fr) minmax(0,1.15fr) minmax(340px,.9fr); gap:18px; }
.call-card { background: linear-gradient(135deg, var(--surface), color-mix(in srgb, var(--purple-soft) 38%, var(--surface))); border:1px solid var(--border); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow); }
.call-number { font-size: 30px; letter-spacing:-.03em; font-weight:900; color:var(--purple); margin: 8px 0 4px; }
.call-actions { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px; margin-top: 15px; }
.status-grid { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:10px; }
.status-btn { min-height:72px; border:1px solid var(--border); border-radius:16px; background:var(--surface); padding:12px; cursor:pointer; text-align:left; box-shadow:var(--shadow-soft); }
.status-btn b { display:block; color:var(--text); margin-bottom:4px; }
.status-btn span { font-size:12px; color:var(--muted); line-height:1.35; }
.status-btn.purple { border-color:rgba(91,70,232,.24); background:var(--purple-soft); }
.status-btn.green { border-color:rgba(16,185,129,.24); background:var(--green-soft); }
.status-btn.orange { border-color:rgba(245,158,11,.24); background:var(--orange-soft); }
.status-btn.red { border-color:rgba(239,68,68,.20); background:var(--red-soft); }
.status-btn.blue { border-color:rgba(37,99,235,.20); background:var(--blue-soft); }
.route-list { display:grid; gap:10px; }
.route-item { display:grid; grid-template-columns: 42px 1fr auto; align-items:center; gap:12px; padding:12px; border:1px solid var(--border); background:var(--surface-2); border-radius:14px; }
.route-icon { width:42px; height:42px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:var(--purple-soft); color:var(--purple); font-size:20px; }
.stock-grid { display:grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap:14px; }
.stock-card { padding:16px; border:1px solid var(--border); background:var(--surface); border-radius:16px; box-shadow:var(--shadow-soft); }
.stock-card b { display:block; font-size:26px; letter-spacing:-.04em; margin:4px 0; }
.distribution-layout { display:grid; grid-template-columns: minmax(0,1.25fr) minmax(360px,.75fr); gap:18px; }
.rule-box { display:grid; grid-template-columns: 1fr auto; gap:10px; align-items:center; padding:12px 0; border-bottom:1px solid var(--border); }
.rule-box:last-child { border-bottom:0; }
.alert-call { animation: pulseAlert 1.7s infinite; border-color: rgba(245,158,11,.55) !important; background: var(--orange-soft) !important; }
@keyframes pulseAlert { 0%,100%{ box-shadow:0 0 0 0 rgba(245,158,11,.24);} 50%{ box-shadow:0 0 0 8px rgba(245,158,11,0);} }
.recording-row { display:grid; grid-template-columns: 80px 1.2fr 1fr .9fr .8fr auto; gap:12px; align-items:center; padding:14px 0; border-bottom:1px solid var(--border); }
.recording-row:last-child { border-bottom:0; }
.audio-pill { height:34px; min-width:140px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); display:flex; align-items:center; gap:8px; padding:0 10px; color:var(--muted); font-size:12px; }
.audio-bars { display:flex; gap:2px; align-items:end; height:14px; }
.audio-bars span { width:3px; border-radius:99px; background:var(--purple); opacity:.85; }
.audio-bars span:nth-child(1){height:7px}.audio-bars span:nth-child(2){height:12px}.audio-bars span:nth-child(3){height:9px}.audio-bars span:nth-child(4){height:14px}.audio-bars span:nth-child(5){height:6px}
@media (max-width: 1200px) {
  .workflow-map { grid-template-columns: repeat(3,1fr); }
  .dialer-layout, .distribution-layout { grid-template-columns: 1fr; }
  .stock-grid { grid-template-columns: repeat(2,1fr); }
  .recording-row { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .workflow-map, .stock-grid, .call-actions, .status-grid { grid-template-columns: 1fr; }
  .workflow-step::after { display:none; }
}
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.badge.red { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }
@media (max-width: 980px) { .grid-3 { grid-template-columns: 1fr; } }

.clean-list { margin: 0; padding-left: 18px; color: var(--muted); line-height: 1.8; }
.status-banner { display:flex; gap:14px; align-items:flex-start; padding:16px 18px; border-radius:var(--radius); border:1px solid rgba(16,185,129,.22); background:var(--green-soft); color:var(--text); }
.status-banner > span { width:34px; height:34px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:var(--surface); box-shadow:var(--shadow-soft); flex:none; }
@media (max-width: 1100px) { .topnav { overflow-x:auto; } .grid-4 { grid-template-columns: repeat(2,minmax(0,1fr)); } .grid-3, .grid-2 { grid-template-columns: 1fr; } }


/* ══════════════════════════════════════════════════════════════════════
   NOVEX v5 — Dialer flottant, accordéons intelligents, roue thème
   ════════════════════════════════════════════════════════════════════ */
.workspace-shell{position:relative;min-height:760px;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.25));border:1px solid var(--border)}
[data-theme="dark"] .workspace-shell{background:linear-gradient(180deg,rgba(17,26,47,.88),rgba(14,22,42,.62))}
.prospect-board{padding:18px}
.board-row{display:grid;grid-template-columns:44px 1.2fr .8fr .8fr 1fr 260px;align-items:center;gap:14px;padding:13px 16px;border-top:1px solid var(--border);background:color-mix(in srgb,var(--surface) 88%,transparent)}
.board-row:first-child{border-top:0;border-radius:18px 18px 0 0}.board-row:last-child{border-radius:0 0 18px 18px}.board-row:hover{background:var(--surface)}
.phone-mask{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--purple-soft);color:var(--purple);padding:5px 9px;border-radius:999px;font-size:12px;font-weight:850}
.float-window{position:absolute;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:0 30px 80px -38px rgba(15,30,60,.65);overflow:hidden;z-index:3}
.float-dialer{width:350px;right:42px;top:96px}.float-qualif{width:430px;left:46px;top:118px}.float-ai{width:380px;left:500px;top:150px}
.float-head{height:56px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:white;background:linear-gradient(135deg,var(--purple),var(--purple-2))}
.float-head.orange{background:linear-gradient(135deg,#ff7844,#ed5ea5)}.float-head.ai{background:linear-gradient(135deg,#654ce5,#9b5ae5)}
.float-title{font-weight:900;letter-spacing:-.02em}.float-sub{font-size:11px;opacity:.84;margin-top:2px}.float-tools{display:flex;gap:8px}.float-tool{width:28px;height:28px;border-radius:9px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.14);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900}
.float-body{padding:16px}.call-timer{font-size:46px;font-weight:950;text-align:center;color:var(--purple);letter-spacing:-.05em;margin:10px 0}.call-status{font-size:12px;text-align:center;color:var(--muted);margin-top:-6px;margin-bottom:16px}
.dialer-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.dialer-actions .status-btn{min-height:54px;padding:8px}.status-btn.compact b{font-size:12px}.status-btn.compact span{font-size:10px;margin-top:2px}
.floating-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.step-dots{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-bottom:14px}.step-dot{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--surface-2);border:1px solid var(--border);color:var(--muted);font-weight:900}.step-dot.active{background:linear-gradient(135deg,#ff7844,#ed5ea5);color:white;border:0}.mini-script{padding:12px;border-radius:14px;background:var(--blue-soft);border-left:4px solid var(--blue);font-size:12px;color:var(--text);font-style:italic;text-align:center;margin-bottom:14px}.soft-field{background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:10px 14px;margin-bottom:9px;text-align:center;font-weight:750}.ai-chat{height:310px;overflow:auto;background:var(--surface-2);border:1px solid var(--border);border-radius:16px;padding:14px}.ai-msg{padding:10px 12px;border-radius:14px;margin-bottom:10px;font-size:12px;line-height:1.45}.ai-msg.bot{background:var(--purple-soft);color:var(--text);border:1px solid rgba(91,70,232,.12)}.ai-msg.user{background:var(--surface);border:1px solid var(--border);margin-left:30px}.quick-chips{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.chip-btn{border:1px solid rgba(91,70,232,.24);color:var(--purple);background:var(--surface);border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}.ai-input-row{display:grid;grid-template-columns:1fr auto;gap:9px;margin-top:10px}
.confirmateur-pop{position:absolute;right:416px;top:432px;width:330px;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:0 30px 80px -42px rgba(15,30,60,.78);padding:16px;z-index:4}.confirmateur-pop h3{margin:0 0 8px}.confirmateur-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid var(--border)}
.reminder-panel{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.alarm-popup{position:relative;border:2px solid rgba(245,158,11,.38);background:linear-gradient(135deg,var(--orange-soft),var(--surface));border-radius:22px;padding:18px;box-shadow:0 18px 44px -28px rgba(245,158,11,.75)}.alarm-bell{width:54px;height:54px;border-radius:18px;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;font-size:26px;box-shadow:0 10px 22px -14px var(--orange)}
.nvx-accordion{display:grid;gap:10px}.acc-item{border:1px solid var(--border);background:var(--surface);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-soft)}.acc-title{width:100%;border:0;background:transparent;color:var(--text);display:flex;align-items:center;justify-content:space-between;padding:16px 18px;cursor:pointer;font-weight:900;text-align:left}.acc-title small{display:block;color:var(--muted);font-weight:600;margin-top:3px}.acc-chevron{transition:.18s ease;color:var(--purple)}.acc-item.open .acc-chevron{transform:rotate(90deg)}.acc-content{display:none;padding:0 18px 18px;color:var(--muted);line-height:1.65}.acc-item.open .acc-content{display:block}.acc-content strong{color:var(--text)}
.archive-month-grid{display:grid;gap:10px}.filter-box{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:16px}.filter-box .input,.filter-box .select{min-height:38px}.month-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}
.theme-wheel-card{display:grid;grid-template-columns:320px 1fr;gap:26px;align-items:center}.color-wheel{width:260px;height:260px;border-radius:50%;background:conic-gradient(#7c2831,#a01e2f,#c8681f,#dcc590,#2d5f3f,#0bbdb0,#4a90e2,#0066ff,#6b4594,#c2577a,#7c2831);box-shadow:0 25px 64px -36px rgba(15,30,60,.85);position:relative;margin:auto;cursor:pointer}.color-wheel:before{content:"";position:absolute;inset:34px;border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}.color-wheel:after{content:"NOVEX";position:absolute;inset:87px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--purple),var(--purple-2));color:#fff;font-weight:950;letter-spacing:-.04em}.theme-dot{width:18px;height:18px;border-radius:50%;position:absolute;box-shadow:0 0 0 4px var(--surface),0 8px 18px -8px #000}.theme-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.theme-choice{display:flex;align-items:center;gap:10px;border:1px solid var(--border);background:var(--surface);border-radius:14px;padding:10px;cursor:pointer}.theme-swatch{width:30px;height:30px;border-radius:10px}.theme-choice.active{border-color:rgba(91,70,232,.45);background:var(--purple-soft)}
@media(max-width:1100px){.float-window{position:static;width:auto!important;margin:14px}.workspace-shell{min-height:auto}.board-row{grid-template-columns:36px 1fr;}.board-row>*:nth-child(n+3){display:none}.reminder-panel,.theme-wheel-card{grid-template-columns:1fr}.filter-box{grid-template-columns:1fr 1fr}.month-details{grid-template-columns:1fr}}
