:root {
  --qs-sidebar: 264px;
  /* Faz 0 design tokens: one place to tune the look, instead of scattered literals. */
  --qs-radius-sm: 8px; --qs-radius: 12px; --qs-radius-lg: 16px;
  --qs-shadow-sm: 0 1px 2px rgba(16,24,43,.06);
  --qs-shadow: 0 4px 16px rgba(16,24,43,.08);
  --qs-border: #e6e8ec;
  --qs-text-muted: #6b7280;
  --qs-accent: #2563eb;
}
* { scrollbar-width: thin; scrollbar-color: #d5d9e2 transparent; }
body { background: #f6f7f9; color: #172033; font-family: 'DM Sans', system-ui, sans-serif; font-size: 15px; }
#layout { min-height: 100vh; }
#sidebar {
  width: var(--qs-sidebar); position: fixed; inset: 0 auto 0 0; z-index: 1040; background: #111827; color: #cfd6e4;
  display: flex; flex-direction: column; padding: 18px 14px; border-right: 1px solid rgba(255,255,255,.06);
}
#sidebar .brand { padding: 5px 10px 22px; display:flex; align-items:center; justify-content:space-between; }
#sidebar .brand img { display: block; width: 132px; height: auto; }
.sidebar-close { display:none; background:none; border:0; color:#fff; }
.workspace-kicker { color:#667085; font-size:.68rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; padding:0 12px 8px; }
.login-brand { display: inline-block; width: 164px; max-width: 100%; height: auto; }
#sidebar a.nav-link { color: #9da8ba; border-radius: 9px; padding: 10px 11px; display: flex; gap: 11px; align-items: center; font-size: .9rem; font-weight:500; }
#sidebar a.nav-link i { font-size:1.02rem; }
#sidebar a.nav-link:hover { background: rgba(255,255,255,.06); color: #f9fafb; }
#sidebar a.nav-link.active { background: #fff; color: #111827; box-shadow:0 5px 18px rgba(0,0,0,.16); }
#sidebar .nav-foot { margin-top: auto; font-size: .76rem; color: #8994a7; padding: 15px 11px 5px; border-top:1px solid rgba(255,255,255,.07); }
.status-dot { display:inline-block; width:7px; height:7px; background:#32d583; border-radius:50%; margin-right:7px; box-shadow:0 0 0 3px rgba(50,213,131,.12); }
#main { margin-left: var(--qs-sidebar); flex: 1; display: flex; flex-direction: column; }
#topbar { position:sticky; top:0; z-index:1030; background: rgba(255,255,255,.88); backdrop-filter:blur(14px); border-bottom: 1px solid #e7e9ee; min-height:68px; padding: 10px 30px; display: flex; align-items: center; gap: 14px; }
.topbar-title { font-weight:700; font-size:1rem; color:#182230; }
#view { padding: 32px; max-width:1500px; width:100%; margin:0 auto; }
.card { border:1px solid #e7e9ee; border-radius: 14px; box-shadow: 0 1px 2px rgba(16,24,40,.035); }
.kpi { min-height:116px; background:#fff; border: 1px solid #e7e9ee; border-radius: 14px; padding: 20px; display:flex; align-items:center; gap:15px; box-shadow:0 1px 2px rgba(16,24,40,.025); transition:transform .18s, box-shadow .18s; }
.kpi:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(16,24,40,.07); }
.kpi-icon { width:42px; height:42px; border-radius:11px; display:grid; place-items:center; background:#eff4ff; color:#3b6eea; font-size:1.1rem; }
.tone-violet .kpi-icon { background:#f4f0ff; color:#7f56d9; }.tone-green .kpi-icon { background:#ecfdf3;color:#079455}.tone-teal .kpi-icon{background:#eafaf7;color:#0e9384}.tone-amber .kpi-icon{background:#fff7e8;color:#dc6803}
.kpi .v { font-size: 1.72rem; font-weight: 700; line-height: 1.1; letter-spacing:-.04em; }
.kpi .l { color: #667085; font-size: .8rem; margin-top:5px; }
.page-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:28px; }
.page-heading h1 { font-size:1.75rem; font-weight:700; letter-spacing:-.035em; margin:3px 0 7px; }
.page-heading p { color:#667085; margin:0; }
.eyebrow { color:#4f6fdc; font-size:.7rem; font-weight:700; letter-spacing:.12em; }
.filter-bar { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:12px 14px; }
.search-trigger { width:280px; height:38px; border:1px solid #dfe3ea; background:#f8f9fb; color:#8a94a6; border-radius:9px; display:flex; align-items:center; gap:9px; padding:0 10px; font-size:.84rem; }
.search-trigger:hover { border-color:#b8c0ce; background:#fff; }
.workspace-select { max-width:180px; border:0; background:transparent; color:#344054; font-weight:600; font-size:.82rem; outline:none; }
.user-chip { display:flex; align-items:center; gap:8px; color:#475467; font-size:.82rem; font-weight:500; }
.user-avatar { width:31px; height:31px; display:grid; place-items:center; border-radius:50%; background:#eef2ff; color:#4f6fdc; }
.icon-button,.mobile-menu { width:36px; height:36px; border:1px solid #e1e5eb; border-radius:9px; background:#fff; color:#667085; display:grid; place-items:center; }
.mobile-menu { display:none; font-size:1.2rem; }
.ai-credit-card { background:linear-gradient(120deg,#fafaff,#f4f7ff); }
.ai-orb { width:42px;height:42px;display:grid;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(135deg,#7f56d9,#4f6fdc);box-shadow:0 7px 18px rgba(91,77,208,.24); }
.progress { height:7px!important; background:#e7eaf2; border-radius:10px; }.progress-bar{border-radius:10px;background:#5b6ee1}
.btn { border-radius:9px; font-weight:600; }.btn-primary{background:#4f63d8;border-color:#4f63d8}.btn-primary:hover{background:#4254c2;border-color:#4254c2}
.form-control,.form-select { border-color:#dfe3ea; border-radius:9px; }.form-control:focus,.form-select:focus{border-color:#8092e8;box-shadow:0 0 0 3px rgba(79,99,216,.11)}
.table>:not(caption)>*>* { padding:.85rem .9rem; border-bottom-color:#edf0f3; }.table thead th{color:#667085;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;font-weight:600;background:#fafbfc}.table tbody tr:last-child td{border-bottom:0}
.funnel-row { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.funnel-row .bar { height: 26px; background: #2563eb; border-radius: 6px; min-width: 2px; }
.funnel-row .lab { width: 190px; font-size: .9rem; color: #374151; }
.funnel-row .cnt { width: 90px; text-align: right; font-variant-numeric: tabular-nums; }
.temp-cold { color:#2563eb } .temp-warm { color:#d97706 } .temp-hot { color:#dc2626 } .temp-very_hot { color:#b91c1c; font-weight:700 }
@media (max-width: 820px) {
  #sidebar { transform:translateX(-105%); transition:transform .22s ease; width:min(86vw,300px); }
  body.sidebar-open #sidebar { transform:translateX(0); }
  .sidebar-close { display:block; }
  .sidebar-backdrop { position:fixed; inset:0; z-index:1039; background:rgba(16,24,40,.5); opacity:0; pointer-events:none; transition:opacity .2s; }
  body.sidebar-open .sidebar-backdrop { opacity:1; pointer-events:auto; }
  #main { margin-left: 0; }
  .mobile-menu { display:grid; }
  #view { padding:22px 16px; }
  #topbar { padding:10px 16px; }
  .search-trigger { width:38px; padding:0; justify-content:center; margin-left:0!important; }.search-trigger span,.search-trigger kbd{display:none}
  .workspace-select { max-width:120px; }.user-chip span:last-child{display:none}
  .page-heading { flex-direction:column; margin-bottom:20px; }.page-heading h1{font-size:1.45rem}.page-actions{width:100%}.page-actions .btn{width:100%}
}

/* stage 6 polish */
.table-hover tbody tr { transition: background .1s; }
.modal-body .invalid-feedback { display: block; }
#view > h1 { margin-bottom: 1rem; }
.card { border-color: #e6e8ec; }
.btn-link { text-decoration: none; }
@media (max-width: 820px) {
  #topbar { flex-wrap: wrap; gap: 8px; }
  #topbar .ms-auto { width: 100%; justify-content: space-between; }
}

/* Hook template gallery */
.hook-template-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.hook-template-card { display:grid; grid-template-columns:116px minmax(0,1fr); gap:10px; align-items:center; min-height:116px; padding:8px; border:1px solid #dfe5f2; border-radius:12px; background:#fff; cursor:pointer; transition:border-color .15s, box-shadow .15s; }
.hook-template-card:hover, .hook-template-card.selected { border-color:#2563eb; box-shadow:0 0 0 2px rgba(37,99,235,.12); }
.hook-template-thumbnail { display:block; min-width:0; overflow:hidden; border-radius:8px; background:#f5f7ff; }
.hook-template-card-copy { min-width:0; display:flex; flex-direction:column; gap:4px; }
.hook-template-card-copy strong { color:#17213e; font-size:.88rem; }
.hook-template-card-copy small { color:#667085; line-height:1.35; }
.hook-live-preview { overflow:hidden; border:1px solid #dfe5f2; border-radius:12px; background:#f5f7ff; }
@media (max-width: 576px) { .hook-template-gallery { grid-template-columns:1fr; } .hook-template-card { grid-template-columns:128px minmax(0,1fr); } }

/* Faz 0: grouped sidebar */
#sidebar a.nav-link { position: relative; }
#sidebar a.nav-link .badge { font-size: .68rem; }
.nav-group-header {
  background: none; border: none; width: 100%; text-align: left; color: #7c87a3;
  font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 14px 12px 6px; display: flex; align-items: center; justify-content: space-between; cursor: pointer;
}
.nav-group-header:hover { color: #cfd6e4; }
.nav-group-header i { font-size: .8rem; }
.nav-group-body { display: flex; flex-direction: column; gap: 1px; overflow: hidden; }
.nav-group-body.collapsed { display: none; }

/* Faz 1: command palette (Cmd/Ctrl+K) */
#topbar kbd { font-size: .72rem; background: #eef0f4; border-radius: 4px; padding: 1px 5px; color: #555; }
#cmdk { position: fixed; inset: 0; z-index: 2000; display: none; }
#cmdk.open { display: block; }
#cmdk-backdrop { position: absolute; inset: 0; background: rgba(16,24,43,.45); }
#cmdk-box {
  position: relative; max-width: 560px; margin: 11vh auto 0; background: #fff; border-radius: var(--qs-radius-lg);
  box-shadow: var(--qs-shadow), 0 20px 50px rgba(0,0,0,.25); overflow: hidden; display: flex; flex-direction: column; max-height: 70vh;
}
#cmdk-input-row { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--qs-border); }
#cmdk-input-row i { color: var(--qs-text-muted); }
#cmdk-input { border: none; outline: none; flex: 1; font-size: 1rem; }
#cmdk-list { overflow-y: auto; padding: 6px; }
.cmdk-item { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: var(--qs-radius-sm); cursor: pointer; }
.cmdk-item i { color: var(--qs-text-muted); width: 18px; text-align: center; }
.cmdk-item.active, .cmdk-item:hover { background: #eef2ff; }
.cmdk-item-label { font-size: .92rem; color: #17213e; }
.cmdk-item-sub { font-size: .76rem; color: var(--qs-text-muted); }
.cmdk-empty { padding: 18px; text-align: center; color: var(--qs-text-muted); font-size: .88rem; }
#cmdk-hint { display: flex; gap: 14px; padding: 8px 14px; border-top: 1px solid var(--qs-border); font-size: .74rem; color: var(--qs-text-muted); }
#cmdk-hint kbd { background: #eef0f4; border-radius: 4px; padding: 0 4px; margin-right: 2px; }
@media (max-width: 820px) { #topbar #cmdkBtn span { display: none; } }

/* Faz 2: Site Yönetimi ağacı (master-detail), modern dosya gezgini görünümü */
.site-manager { display: grid; grid-template-columns: 390px minmax(0, 1fr); gap: 22px; align-items: start; }
.site-tree-panel { overflow:hidden; background:transparent; }
.site-tree { max-height: calc(100vh - 245px); overflow-y: auto; padding: 2px 3px 12px; }
.site-detail { min-height: 420px; position: sticky; top: 84px; padding: 24px!important; }
.tree-panel-heading { display:flex;align-items:center;justify-content:space-between;padding:2px 3px 13px }.tree-panel-heading strong,.tree-panel-heading small{display:block}.tree-panel-heading strong{font-size:.9rem}.tree-panel-heading small{font-size:.72rem;color:#98a2b3;margin-top:3px}.tree-panel-heading>span{font-size:.7rem;color:#667085;background:#e9ecf1;padding:5px 9px;border-radius:999px}
.flow-page-heading { margin-bottom:20px; }
.flow-map { display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #e7e9ee;border-radius:14px;padding:14px 18px;margin-bottom:18px;overflow-x:auto }
.flow-map>div{display:flex;align-items:center;gap:10px;min-width:155px;flex:1}.flow-map>i{color:#c7ccd5}.flow-map strong,.flow-map small{display:block;white-space:nowrap}.flow-map strong{font-size:.78rem}.flow-map small{font-size:.68rem;color:#98a2b3;margin-top:2px}
.map-icon { width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:10px }.map-icon.site{background:#eaf1ff;color:#3974dc}.map-icon.widget{background:#f3ecff;color:#7f56d9}.map-icon.hook{background:#fff4e5;color:#dc6803}.map-icon.flow{background:#eafaf1;color:#079455}
.detail-placeholder { min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#98a2b3;max-width:390px;margin:auto }.detail-placeholder i{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#f2f4f7;color:#667085;font-size:1.25rem;margin-bottom:12px}.detail-placeholder strong{color:#344054;margin-bottom:5px}.detail-placeholder span{font-size:.8rem;line-height:1.55}
.detail-type { display:flex;align-items:center;gap:9px;color:#667085;font-size:.68rem;font-weight:700;letter-spacing:.08em;margin-bottom:14px }.detail-type .map-icon{width:30px;height:30px;border-radius:9px;font-size:.8rem}
.detail-title-row { display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px }.detail-title-row h2{font-size:1.35rem;font-weight:700;letter-spacing:-.025em;margin:0 0 5px}.detail-title-row p{font-size:.82rem;color:#667085;margin:0}.detail-title-row a{font-size:.8rem;color:#667085;text-decoration:none}.detail-title-row a:hover{color:#4f63d8}
.status-badge{display:flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;background:#f2f4f7;color:#667085;font-size:.72rem;font-weight:600}.status-badge i{width:6px;height:6px;border-radius:50%;background:#98a2b3}.status-badge.active{background:#ecfdf3;color:#067647}.status-badge.active i{background:#17b26a}
.detail-stats { display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:18px }.detail-stats>div{border:1px solid #e7e9ee;border-radius:11px;padding:14px;background:#fbfcfd}.detail-stats strong,.detail-stats span{display:block}.detail-stats strong{font-size:1.35rem}.detail-stats span{font-size:.72rem;color:#667085;margin-top:2px}
.detail-info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:18px}.detail-info-grid>div{position:relative;padding:13px 14px;border:1px solid #e7e9ee;border-radius:11px;background:#fbfcfd}.detail-info-grid .wide{grid-column:1/-1}.detail-info-grid span,.detail-info-grid strong{display:block}.detail-info-grid span{font-size:.68rem;color:#98a2b3;text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}.detail-info-grid strong,.detail-info-grid code{font-size:.79rem;color:#344054}.detail-info-grid .mini{position:absolute;right:8px;top:10px;width:28px;height:28px}
.next-step-card { display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px;background:linear-gradient(120deg,#f7f8ff,#f2f5ff);border:1px solid #dfe4ff;border-radius:12px;margin-bottom:18px}.next-step-card strong{font-size:.82rem}.next-step-card p{font-size:.75rem;color:#667085;margin:3px 0 0;line-height:1.45}.next-step-card .btn{white-space:nowrap}
.detail-actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:16px;border-top:1px solid #edf0f3}.detail-section-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:#667085;font-weight:700;margin:22px 0 9px}
.setup-empty{max-width:560px;margin:10vh auto;text-align:center}.setup-empty-icon{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 18px;border-radius:18px;background:linear-gradient(135deg,#eef2ff,#e7eaff);color:#4f63d8;font-size:1.5rem}.setup-empty h1{font-size:1.55rem;font-weight:700}.setup-empty p{color:#667085;line-height:1.65;margin:10px 0 24px}
.workspace-site-select{background:#fff;border:1px solid #e5e8ee;border-radius:13px;padding:11px 13px;margin-bottom:10px}.workspace-site-select label{display:block;font-size:.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#98a2b3;margin-bottom:4px}.workspace-site-select select{width:100%;border:0;background:transparent;color:#182230;font-weight:650;font-size:.86rem;outline:0;cursor:pointer}
.workspace-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;background:#e9ecf1;border-radius:11px;margin-bottom:13px}.workspace-tabs button{border:0;background:transparent;color:#667085;border-radius:8px;padding:8px 5px;font-size:.7rem;font-weight:600;white-space:nowrap}.workspace-tabs button i{margin-right:3px}.workspace-tabs button.active{background:#fff;color:#344054;box-shadow:0 1px 3px rgba(16,24,40,.1)}
.navigator-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 2px 11px}.navigator-heading strong,.navigator-heading small{display:block}.navigator-heading strong{font-size:.88rem}.navigator-heading small{font-size:.7rem;color:#98a2b3;margin-top:2px}.navigator-list{display:grid;gap:7px}.navigator-item{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #e5e8ee;background:#fff;border-radius:12px;padding:11px;color:#344054;transition:border-color .15s,box-shadow .15s,transform .15s}.navigator-item:hover{border-color:#c9d0dd;box-shadow:0 5px 14px rgba(16,24,40,.05);transform:translateY(-1px)}.navigator-item.active{border-color:#aeb9f3;background:#f7f8ff;box-shadow:0 0 0 2px rgba(79,99,216,.08)}.navigator-item>span:not(.tree-icon):not(.tree-drag-handle):not(.status-mini){min-width:0}.navigator-item strong,.navigator-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.navigator-item strong{font-size:.8rem}.navigator-item small{font-size:.68rem;color:#98a2b3;margin-top:3px}.navigator-item>i{color:#b0b7c3;font-size:.72rem}.navigator-item.compact{padding:8px;border:0;background:transparent;border-radius:9px}.navigator-item.compact:hover,.navigator-item.compact.active{background:#f4f6fb;box-shadow:none;transform:none}.navigator-item.compact .tree-icon{width:25px;height:25px}.navigator-item.compact .tree-drag-handle{opacity:.45}
.navigator-add{width:100%;border:1px dashed #d4d9e3;background:transparent;color:#667085;border-radius:11px;padding:10px;font-size:.75rem;font-weight:600}.navigator-add:hover{border-color:#aeb9f3;background:#f7f8ff;color:#4f63d8}.navigator-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 18px;border:1px dashed #d8dde6;border-radius:12px;color:#98a2b3}.navigator-empty>i{font-size:1.2rem;margin-bottom:8px}.navigator-empty strong{font-size:.8rem;color:#475467}.navigator-empty span{font-size:.7rem;line-height:1.45;margin-top:3px;max-width:240px}
.welcome-groups{display:grid;gap:10px}.welcome-group{background:#fff;border:1px solid #e5e8ee;border-radius:12px;padding:6px}.welcome-group-title{display:flex;align-items:center;justify-content:space-between;padding:7px 8px 5px;color:#667085;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.welcome-group-title button{width:25px;height:25px;border:0;border-radius:7px;background:#f0f2f5;color:#667085}.welcome-group-title button:hover{background:#e7eaff;color:#4f63d8}.welcome-empty{color:#98a2b3;font-size:.7rem;padding:10px 9px}.status-mini{width:7px;height:7px;border-radius:50%;background:#c3c8d0;margin-left:auto;flex:none}.status-mini.active{background:#17b26a;box-shadow:0 0 0 3px rgba(23,178,106,.1)}

.tree-node { margin-bottom: 10px; background:#fff; border:1px solid #e5e8ee; border-radius:14px; padding:5px; box-shadow:0 1px 2px rgba(16,24,40,.025); transition:border-color .16s,box-shadow .16s; }
.tree-node:hover { border-color:#d4d9e3; box-shadow:0 5px 16px rgba(16,24,40,.045); }
.tree-children {
  position: relative; margin: 4px 3px 3px; padding: 4px 0 2px 12px; border-top:1px solid #f0f1f4;
  animation: qs-tree-in .14s ease-out;
}
.tree-children .tree-node { border:0;box-shadow:none;margin:2px 0;padding:0;background:transparent; }
.tree-children .tree-children { margin:3px 0 5px 18px;padding:2px 0 2px 8px;border-top:0;border-left:2px solid #f0f1f5; }
@keyframes qs-tree-in { from { opacity: 0; transform: translateY(-2px); } to { opacity: 1; transform: none; } }

.tree-row {
  position: relative; display: flex; align-items: center; gap: 10px; padding: 9px 10px; margin: 1px 0;
  border-radius: 10px; cursor: pointer; font-size: .84rem; color: #344054;
  transition: background .12s ease,color .12s ease;
}
.tree-row:hover { background: #f7f8fa; }
.tree-row.active { background: #eef1ff; color: #3f51c6; font-weight: 600; box-shadow:none; }
.tree-row.active::before { content:'';position:absolute;left:0;top:9px;bottom:9px;width:3px;background:#5967d9;border-radius:0 4px 4px 0; }
.tree-row-parent { font-weight: 550; }
.tree-node>.tree-row-parent { padding:11px 10px; }

.tree-chevron { color: #aab1c2; width: 15px; text-align: center; flex-shrink: 0; font-size: .78rem; transition: transform .12s ease; }
.tree-row:hover .tree-chevron { color: #6b7280; }

.tree-icon {
  width: 28px; height: 28px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
  font-size: .78rem; flex-shrink: 0;
}
.tree-icon i { color: inherit; width: auto; }
.tree-icon-site { background: #edf3ff; color: #3974dc; }
.tree-icon-widget { background: #f4efff; color: #7f56d9; }
.tree-icon-hook { background: #fff6e9; color: #dc6803; }
.tree-icon-flow { background: #ecfaf2; color: #079455; }

.tree-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-sublabel { color: #98a2b3; font-size: .7rem; margin-left: auto; max-width:120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-count {
  font-size: .68rem; color: var(--qs-text-muted); background: #eef0f4; border-radius: 10px;
  padding: 1px 7px; margin-left: 2px;
}
.tree-empty { color: #98a2b3; font-size: .75rem; padding: 8px 10px 8px 38px; }
.tree-add { color: #667085; font-size: .78rem; border:1px dashed transparent; }
.tree-add:hover { color: #4f63d8; background: #f6f7ff; border-color:#dfe3ff; }
.tree-add .tree-chevron { color: inherit; }

.tree-row-leaf { padding-left: 5px; }
.tree-drag-handle { cursor: grab; color: #c3c9d6; opacity: 0; transition: opacity .12s ease; width: 14px; text-align: center; }
.tree-row-leaf:hover .tree-drag-handle { opacity: 1; }
.tree-row.sortable-ghost { opacity: .35; }
.tree-row.sortable-chosen { background: #eef2ff; }
.tree-flows-toggle { color: #475467; margin-top:3px; }

.tree-row:focus-visible { outline: 2px solid var(--qs-accent); outline-offset: 1px; background: #eef2ff; }
.site-detail-back { display: none; }

@media (max-width: 992px) {
  /* Mobile: one panel at a time. Selecting a node swaps the tree for the detail view with a back button. */
  .site-manager { grid-template-columns: 1fr; position: relative; }
  .site-detail { position: static; }
  .site-manager.detail-open .site-tree { display: none; }
  .site-manager:not(.detail-open) .site-detail { display: none; }
  .site-manager.detail-open .site-detail-back { display: inline-flex; align-items: center; gap: 4px; }
}

@media (max-width: 820px) {
  .flow-map{gap:8px;padding:12px}.flow-map>div{min-width:135px}.flow-map>i{display:none}.site-tree{max-height:none}.next-step-card{align-items:stretch;flex-direction:column}.detail-title-row{flex-direction:column}.detail-info-grid{grid-template-columns:1fr}.detail-info-grid .wide{grid-column:auto}
}

/* Operational workspace: inbox and leads */
.attention-pill { display:flex; align-items:center; gap:8px; padding:9px 13px; border:1px solid #fed7aa; background:#fff7ed; color:#9a3412; border-radius:999px; font-size:.8rem; font-weight:600; }
.attention-pill span { width:7px; height:7px; border-radius:50%; background:#f97316; box-shadow:0 0 0 3px rgba(249,115,22,.12); }
.attention-pill.all-clear { border-color:#abefc6; background:#ecfdf3; color:#067647; }.attention-pill.all-clear span{background:#17b26a}
.inbox-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.inbox-summary a { display:flex; align-items:center; gap:12px; padding:15px 16px; background:#fff; border:1px solid #e7e9ee; border-radius:13px; color:#344054; text-decoration:none; transition:border-color .15s,transform .15s; }
.inbox-summary a:hover { border-color:#b7c1ea; transform:translateY(-1px); }
.inbox-summary strong { display:block; font-size:1.25rem; line-height:1; color:#101828; }.inbox-summary small{display:block;color:#667085;margin-top:4px}
.summary-icon { width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#f4f0ff;color:#7f56d9 }.summary-icon.green{background:#eafaf2;color:#079455}.summary-icon.amber{background:#fff7e8;color:#dc6803}.summary-icon.red{background:#fff1f0;color:#d92d20}
.inbox-section { scroll-margin-top:90px; }.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:0 2px 12px}.section-heading h2{font-size:1rem;font-weight:700;margin:0 0 3px}.section-heading p{font-size:.8rem;color:#667085;margin:0}
.count-badge{min-width:27px;height:27px;padding:0 8px;display:grid;place-items:center;border-radius:8px;background:#f1efff;color:#6941c6;font-size:.75rem;font-weight:700}.count-badge.amber{background:#fff5e6;color:#b54708}.count-badge.red{background:#fff0ee;color:#b42318}
.empty-state { min-height:150px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px dashed #d8dde6; border-radius:14px; color:#667085; background:rgba(255,255,255,.55); }.empty-state i{font-size:1.7rem;color:#17b26a;margin-bottom:8px}.empty-state strong{color:#344054}.empty-state span{font-size:.8rem;margin-top:3px}
.filter-card { background:#fff; }.filter-card-title{display:flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;color:#344054;margin-bottom:10px}.filter-card .form-label{color:#667085;font-weight:500}
.lead-table-card { overflow:hidden; }.lead-identity{display:flex;align-items:center;gap:11px}.lead-identity strong{display:block;font-size:.88rem}.lead-identity small{display:block;color:#98a2b3;font-size:.7rem;margin-top:1px}
.lead-avatar { width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:10px;background:linear-gradient(135deg,#eef2ff,#e4e8ff);color:#4f63d8;font-weight:700;font-size:.78rem;border:1px solid #dde3ff }
.lead-avatar-lg{width:50px;height:50px;border-radius:14px;font-size:1.05rem}.table-footer{border-top:1px solid #edf0f3;background:#fbfcfd}
.lead-detail-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:24px}.lead-detail-heading h1{font-size:1.55rem;font-weight:700;letter-spacing:-.025em;margin:0}.back-link{font-size:.8rem;text-decoration:none;color:#667085}.back-link:hover{color:#4f63d8}.lead-meta{color:#667085;font-size:.82rem;margin-top:4px}.lead-meta span{margin:0 4px;color:#c1c7d0}.detail-card h2{font-weight:700;color:#344054}.detail-card dl dt{font-weight:500}.detail-card dl dd{color:#344054}

@media (max-width: 820px) {
  .inbox-summary{grid-template-columns:1fr}.inbox-summary a{padding:12px 14px}.lead-detail-heading{flex-direction:column;align-items:stretch}.lead-actions .btn{flex:1}.filter-card .col-6{width:100%}.attention-pill{align-self:flex-start}.page-heading{gap:14px}
}

/* Visual flow builder */
.flow-builder-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:20px}.flow-builder-header h1{font-size:1.55rem;font-weight:700;letter-spacing:-.03em}.flow-builder-header p{color:#98a2b3;font-size:.78rem;margin:0}.flow-name-edit{width:28px;height:28px;border:0;border-radius:8px;background:#eef0f4;color:#667085;font-size:.72rem}.flow-name-edit:hover{background:#e4e7ec;color:#344054}.flow-header-actions{display:flex;align-items:center;gap:8px}.flow-status-select{height:38px;border:1px solid #dfe3ea;border-radius:9px;padding:0 30px 0 12px;background:#fff;color:#475467;font-size:.78rem;font-weight:650}.flow-status-select.published{color:#067647;background-color:#ecfdf3;border-color:#abefc6}.flow-status-select.draft{color:#b54708;background-color:#fff8eb;border-color:#fedf89}
.flow-builder-workspace{display:grid;grid-template-columns:210px minmax(420px,1fr) 260px;gap:14px;align-items:start}.flow-palette,.flow-inspector,.flow-canvas{background:#fff;border:1px solid #e5e8ee;border-radius:14px}.flow-palette,.flow-inspector{position:sticky;top:84px;padding:14px}.builder-panel-title{padding:2px 2px 13px;border-bottom:1px solid #edf0f3;margin-bottom:12px}.builder-panel-title strong,.builder-panel-title small{display:block}.builder-panel-title strong{font-size:.82rem}.builder-panel-title small{color:#98a2b3;font-size:.67rem;margin-top:3px}
.palette-group{display:grid;gap:4px;margin-bottom:14px}.palette-group>span{color:#98a2b3;font-size:.62rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:0 4px 3px}.palette-group button{display:flex;align-items:center;gap:9px;border:1px solid transparent;background:transparent;border-radius:9px;padding:8px;color:#475467;text-align:left}.palette-group button:hover{background:#f6f7ff;border-color:#e1e5ff;color:#4f63d8}.palette-group button i{width:25px;height:25px;display:grid;place-items:center;border-radius:7px;background:#f0f2f5;color:#667085}.palette-group button:hover i{background:#e9ecff;color:#4f63d8}.palette-group button b{font-size:.73rem;font-weight:600}
.flow-canvas{position:relative;min-height:650px;background-color:#f8f9fb;background-image:radial-gradient(#d7dbe3 .75px,transparent .75px);background-size:18px 18px;overflow:hidden}.canvas-toolbar{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:14px 17px;background:rgba(255,255,255,.94);border-bottom:1px solid #e7e9ee}.canvas-toolbar strong,.canvas-toolbar small{display:block}.canvas-toolbar strong{font-size:.82rem}.canvas-toolbar small{font-size:.67rem;color:#98a2b3;margin-top:2px}.canvas-toolbar>span{font-size:.67rem;color:#98a2b3;background:#f2f4f7;border-radius:7px;padding:5px 8px}.flow-node-list{position:relative;z-index:2;max-width:620px;margin:0 auto;padding:28px 82px 80px 24px}.flow-node-card{position:relative;background:#fff;border:1px solid #dfe3ea;border-radius:13px;box-shadow:0 3px 10px rgba(16,24,40,.045);margin:22px 0;transition:box-shadow .15s,border-color .15s,transform .15s}.flow-node-card:hover{border-color:#bfc7d5;box-shadow:0 9px 25px rgba(16,24,40,.075)}.flow-node-card.dragging{opacity:.45;transform:scale(.98)}.flow-node-card.drag-over{border-color:#667eea;box-shadow:0 0 0 3px rgba(79,99,216,.13)}.flow-node-card.attention{animation:node-attention 1.4s ease}@keyframes node-attention{0%,100%{box-shadow:0 3px 10px rgba(16,24,40,.045)}35%{border-color:#f79009;box-shadow:0 0 0 5px rgba(247,144,9,.16)}}
.flow-connections{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:visible}.flow-link{fill:none;stroke:#8b97aa;stroke-width:1.7;opacity:.8}.flow-link.option{stroke:#667eea}.flow-connections marker path{fill:#667eea}.option-target{white-space:nowrap;color:#4f63d8;background:#eef1ff;border-radius:6px;padding:2px 6px;font-size:.62rem;font-weight:650}.option-target.empty{color:#b42318;background:#fff0ee}
.flow-link.score{stroke:#f79009;stroke-dasharray:6 4;stroke-width:2}.test-score{display:inline-flex;align-items:center;gap:4px;color:#667085;background:#fff;border:1px solid #e4e7ec;border-radius:7px;padding:4px 7px;font-size:.62rem;margin-bottom:9px}.test-score strong{color:#4f63d8}.test-options button{display:flex;align-items:center;justify-content:space-between;gap:8px}.test-options button small{font-size:.6rem;color:#079455}.test-multi{display:grid;gap:6px;margin-top:12px}.test-multi label{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #dbe1ff;border-radius:9px;padding:8px;font-size:.7rem;color:#475467}.test-multi label span{flex:1}.test-multi label small{color:#079455}.test-multi>button{border:0;background:#4f63d8;color:#fff;border-radius:9px;padding:8px;font-size:.72rem;font-weight:600}
.option-target.fallback{color:#667085;background:#f0f2f5;font-weight:550}
.flow-node-card.has-incoming::before{content:'';position:absolute;right:-6px;top:33px;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:#667eea;box-shadow:0 0 0 1px #667eea;z-index:4}
.flow-node-main{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:start;gap:11px;padding:14px}.node-drag-handle{border:0;background:transparent;color:#c1c7d0;padding:8px 0;cursor:grab}.node-drag-handle:active{cursor:grabbing}.node-type-icon{width:37px;height:37px;display:grid;place-items:center;border-radius:10px;background:#eef2ff;color:#4f63d8}.node-type-icon.type-single_choice,.node-type-icon.type-multi_choice{background:#f4efff;color:#7f56d9}.node-type-icon.type-phone,.node-type-icon.type-email,.node-type-icon.type-text,.node-type-icon.type-lead_form{background:#ecfaf2;color:#079455}.node-type-icon.type-action_whatsapp,.node-type-icon.type-action_phone{background:#eafaf7;color:#0e9384}.node-type-icon.type-end{background:#fff2f0;color:#d92d20}.node-content{min-width:0}.node-kicker{display:flex;align-items:center;gap:7px;color:#98a2b3;font-size:.61rem;text-transform:uppercase;letter-spacing:.05em}.node-kicker b{color:#067647;background:#ecfdf3;border-radius:5px;padding:2px 5px}.node-content h3{font-size:.88rem;font-weight:650;margin:4px 0 0;white-space:normal;line-height:1.4}.node-content p{color:#98a2b3;font-size:.67rem;margin:4px 0 0}.node-actions{display:flex;gap:3px}.node-actions button,.node-option-row button{width:28px;height:28px;border:0;background:transparent;color:#98a2b3;border-radius:7px}.node-actions button:hover,.node-option-row button:hover{background:#f0f2f5;color:#475467}.node-actions button[data-del]:hover{background:#fff0ee;color:#d92d20}
.node-options{grid-column:2/-1;border-top:1px solid #edf0f3;padding:10px 0 0;margin-top:2px}.node-option-row{position:relative;display:flex;align-items:center;gap:8px;padding:6px 7px;border-radius:8px;font-size:.72rem}.node-option-row:hover{background:#f8f9fb}.node-option-row .flex-grow-1{min-width:0}.node-option-row[data-next-node]:not([data-next-node=""])::after{content:'';position:absolute;right:-18px;top:50%;width:9px;height:9px;transform:translateY(-50%);border:2px solid #fff;border-radius:50%;background:#667eea;box-shadow:0 0 0 1px #667eea;z-index:4}.node-option-row[data-next-node]:not([data-next-node=""]):hover::after{box-shadow:0 0 0 3px rgba(102,126,234,.18)}.node-add-option{border:1px dashed #d6dbe4;background:#fafbfc;color:#667085;border-radius:8px;padding:6px 10px;margin:5px 7px 0;font-size:.68rem;font-weight:600}.node-add-option:hover{border-color:#aeb9f3;color:#4f63d8;background:#f7f8ff}
.option-drag-handle{color:#c1c7d0;cursor:grab;padding:3px 1px;display:inline-flex}.option-drag-handle:active{cursor:grabbing}.node-option-row.dragging{opacity:.4}.node-option-row.drag-over{background:#eef1ff;box-shadow:inset 0 0 0 1px #aeb9f3}
.node-option-row[data-next-node]:not([data-next-node=""])::after{display:none}.option-link-handle{width:15px;height:20px;display:grid;place-items:center;color:#667eea;cursor:crosshair;font-size:.55rem;flex:none}.option-link-handle:hover,.option-link-handle.linking{color:#3f51c6;transform:scale(1.3)}body.flow-linking .flow-node-card{cursor:crosshair}body.flow-linking .flow-node-card::after{content:'';position:absolute;right:-7px;top:31px;width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:#aeb9f3;box-shadow:0 0 0 2px #667eea;z-index:6}.flow-node-card.link-target{border-color:#667eea;box-shadow:0 0 0 4px rgba(102,126,234,.16);transform:scale(1.01)}.flow-node-card.selected{border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,.12)}
.inspector-selected-head{display:flex;align-items:center;gap:9px;padding-bottom:12px;border-bottom:1px solid #edf0f3;margin-bottom:13px}.inspector-selected-head button{width:28px;height:28px;border:0;border-radius:8px;background:#f0f2f5;color:#667085}.inspector-selected-head strong,.inspector-selected-head small{display:block}.inspector-selected-head strong{font-size:.8rem}.inspector-selected-head small{font-size:.64rem;color:#98a2b3;margin-top:1px}.inline-node-form>label,.inline-settings .form-label{display:block;color:#667085;font-size:.66rem;font-weight:650;margin:0 0 5px}.inline-node-form textarea,.inline-settings .form-control,.inline-settings .form-select{width:100%;border:1px solid #dfe3ea;border-radius:8px;background:#fff;padding:8px;font-size:.73rem;margin-bottom:10px}.inline-settings .row{--bs-gutter-x:8px}.inline-settings .form-check{font-size:.7rem}.inline-node-form>.btn{font-size:.72rem;margin-top:3px}.inspector-preview-title{display:flex;align-items:center;justify-content:space-between;color:#667085;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin:18px 2px 7px}.flow-phone{border:5px solid #202838;border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 8px 24px rgba(16,24,40,.12)}.flow-phone-bar{display:flex;align-items:center;gap:7px;background:#202838;color:#fff;padding:7px 9px;font-size:.65rem}.flow-phone-bar span{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#7f56d9,#4f63d8)}.flow-phone-bar b{flex:1}.flow-phone-body{min-height:150px;padding:13px;background:#f7f8fb}.preview-bubble{background:#fff;border:1px solid #e7e9ee;border-radius:11px 11px 11px 3px;padding:9px;font-size:.7rem;line-height:1.4;box-shadow:0 2px 6px rgba(16,24,40,.04)}.preview-options{display:grid;gap:5px;margin-top:8px}.preview-options button{border:1px solid #dfe3ff;background:#fff;color:#4f63d8;border-radius:8px;padding:6px;font-size:.65rem}.preview-input{margin-top:8px;border:1px solid #dfe3ea;background:#fff;color:#98a2b3;border-radius:8px;padding:7px;font-size:.64rem}
.flow-health{display:flex;gap:10px;padding:11px;border-radius:10px;margin-bottom:12px}.flow-health>i{font-size:1rem}.flow-health strong,.flow-health span{display:block}.flow-health strong{font-size:.72rem}.flow-health span{font-size:.64rem;margin-top:2px;line-height:1.35}.flow-health.healthy{background:#ecfdf3;color:#067647}.flow-health.warning{background:#fff8eb;color:#b54708}.flow-issues{display:grid;gap:4px;margin-bottom:12px}.flow-issues button{display:flex;gap:4px;border:0;background:#fff6f5;color:#b42318;text-align:left;border-radius:7px;padding:6px;font-size:.65rem}.flow-overview{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px}.flow-overview>div{padding:9px;background:#f8f9fb;border:1px solid #edf0f3;border-radius:9px}.flow-overview span,.flow-overview strong{display:block}.flow-overview span{font-size:.61rem;color:#98a2b3}.flow-overview strong{font-size:.84rem;margin-top:2px}.builder-tip{display:flex;gap:7px;color:#667085;font-size:.65rem;line-height:1.45;padding:12px 3px 0}.builder-tip i{color:#f79009}.flow-empty-canvas{min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#98a2b3}.flow-empty-canvas>i{width:52px;height:52px;display:grid;place-items:center;border-radius:15px;background:#fff;border:1px solid #e5e8ee;font-size:1.2rem;margin-bottom:12px}.flow-empty-canvas strong{font-size:.85rem;color:#475467}.flow-empty-canvas span{font-size:.7rem;margin-top:4px;max-width:260px;line-height:1.5}
@media (max-width:1200px){.flow-builder-workspace{grid-template-columns:190px minmax(400px,1fr)}.flow-inspector{grid-column:1/-1;position:static;display:grid;grid-template-columns:1fr 1fr;gap:12px}.flow-inspector .builder-panel-title{grid-column:1/-1}.flow-inspector>.btn,.builder-tip{align-self:center}.flow-overview{margin:0}}
@media (max-width:820px){.flow-builder-header{align-items:stretch;flex-direction:column}.flow-header-actions{overflow-x:auto}.flow-header-actions .btn{white-space:nowrap}.flow-builder-workspace{grid-template-columns:1fr}.flow-palette,.flow-inspector{position:static}.flow-palette{display:none}.flow-inspector{display:block}.flow-canvas{min-height:520px}.flow-node-list{padding:22px 10px 60px}.flow-node-main{grid-template-columns:auto auto minmax(0,1fr)}.node-actions{grid-column:2/-1;justify-content:flex-end}.node-options{grid-column:1/-1}.canvas-toolbar>span{display:none}}
.save-state{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:.68rem;font-weight:600;color:#667085;padding:6px 8px;border-radius:7px;background:#f2f4f7}.save-state.saving{color:#4f63d8;background:#eef1ff}.save-state.error{color:#b42318;background:#fff0ee}.canvas-tools{display:flex;align-items:center;gap:7px}.canvas-tools button{border:0;background:#eef1ff;color:#4f63d8;border-radius:7px;padding:5px 8px;font-size:.67rem;font-weight:600}.canvas-tools>span{font-size:.67rem;color:#98a2b3;background:#f2f4f7;border-radius:7px;padding:5px 8px}
.test-shell{display:flex;justify-content:center;padding:12px 0 22px}.test-phone{width:340px;max-width:100%;border:7px solid #1d2635;border-radius:25px;overflow:hidden;background:#fff;box-shadow:0 20px 45px rgba(16,24,40,.18)}.test-phone-head{display:flex;align-items:center;gap:9px;background:#1d2635;color:#fff;padding:11px 13px}.test-phone-head>span{width:29px;height:29px;border-radius:50%;background:linear-gradient(135deg,#7f56d9,#4f63d8)}.test-phone-head>div{flex:1}.test-phone-head strong,.test-phone-head small{display:block}.test-phone-head strong{font-size:.78rem}.test-phone-head small{font-size:.6rem;color:#aeb7c5}.test-phone-body{min-height:440px;padding:18px 14px;background:#f4f6fa}.test-progress{height:4px;background:#e2e6ed;border-radius:4px;margin-bottom:18px}.test-progress span{display:block;height:100%;background:#667eea;border-radius:4px}.test-bubble{background:#fff;border:1px solid #e4e7ec;border-radius:15px 15px 15px 4px;padding:12px;font-size:.82rem;line-height:1.5;box-shadow:0 3px 10px rgba(16,24,40,.05)}.test-options{display:grid;gap:7px;margin-top:12px}.test-options button,.test-continue,.test-lead-form button{border:1px solid #dbe1ff;background:#fff;color:#4f63d8;border-radius:10px;padding:9px;font-size:.75rem;font-weight:600}.test-options button:hover,.test-continue:hover{background:#eef1ff}.test-input{display:flex;gap:6px;margin-top:12px}.test-input input,.test-lead-form input{min-width:0;flex:1;border:1px solid #dfe3ea;border-radius:9px;padding:9px;font-size:.72rem}.test-input button{width:35px;border:0;border-radius:9px;background:#4f63d8;color:#fff}.test-lead-form{display:grid;gap:7px;margin-top:12px}.test-complete{text-align:center;color:#067647;background:#ecfdf3;border-radius:10px;padding:12px;margin-top:12px;font-size:.75rem}.test-continue{width:100%;margin-top:12px}.test-phone-foot{display:flex;align-items:center;justify-content:space-between;background:#fff;border-top:1px solid #edf0f3;padding:8px 12px;color:#98a2b3;font-size:.65rem}.test-phone-foot button{width:30px;height:30px;border:0;border-radius:8px;background:#f0f2f5;color:#667085}.test-phone-foot button:disabled{opacity:.35}
.followup-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.followup-metric{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between}.followup-metric span{color:#667085;font-size:.84rem}.followup-metric strong{font-size:1.4rem}.followup-sequence-card{border:1px solid #e5e7eb;padding:20px;border-radius:16px;background:#fff;transition:.18s ease;min-height:220px}.followup-sequence-card:hover{border-color:#8b7cf6;box-shadow:0 12px 30px rgba(45,38,108,.09);transform:translateY(-2px)}.followup-sequence-card h2{font-size:1.05rem;margin:20px 0 7px}.followup-sequence-card p{color:#667085;font-size:.9rem;min-height:42px}.followup-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#eeecff;color:#5b4ce6;font-size:1.15rem}.followup-card-meta{display:grid;gap:7px;color:#667085;font-size:.78rem}.followup-card-meta i{width:18px;color:#6c5ce7}.followup-settings{position:sticky;top:84px}.followup-step-list{position:relative}.followup-step-list:before{content:"";position:absolute;left:19px;top:34px;bottom:34px;width:2px;background:#e8e7f5}.followup-step{position:relative;display:grid;grid-template-columns:40px 1fr;gap:14px;margin-bottom:15px}.followup-step-index{position:relative;z-index:1;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#6759e8;color:#fff;font-weight:700;border:5px solid #fff}.followup-step-body{border:1px solid #e7e7ef;border-radius:14px;padding:17px;background:#fff}.followup-step-body h3{font-size:.95rem;margin:0 0 3px}.followup-step-body h3 i{color:#6253df;margin-right:5px}.followup-step-body p{font-size:.78rem;color:#7a8190;margin:0 0 14px}@media(max-width:767px){.followup-summary{grid-template-columns:1fr}.followup-settings{position:static}}

/* ============================================================
   QOSOBO 2.0 — Adım A: "Your AI Agent" görsel yenilemesi.
   Sadece var olan token/bileşenleri genişletiyor; hiçbir view
   dosyası değişmedi, hiçbir id/class kaldırılmadı.
   ============================================================ */
:root {
  --qs-accent-600: #4147c4;
  --qs-accent-soft: #eef0ff;
  --qs-ink: #101427;
  --qs-ink-soft: #5b6478;
  --qs-surface: #ffffff;
  --qs-line: #ebedf2;
  --qs-shadow-lift: 0 14px 34px rgba(16,24,43,.10);
}

body { color: var(--qs-ink); -webkit-font-smoothing: antialiased; }

/* Sidebar: deeper, softer gradient instead of flat slate; accent glow on the active item
   instead of a plain white pill, to read as an "AI platform" rather than an admin panel. */
#sidebar {
  background: linear-gradient(190deg, #12142b 0%, #15182f 55%, #171a33 100%);
  border-right: 1px solid rgba(255,255,255,.05);
}
#sidebar .brand { padding-bottom: 26px; }
.workspace-kicker { color: #6f7797; }
#sidebar a.nav-link { border-radius: 10px; letter-spacing: .01em; }
#sidebar a.nav-link:hover { background: rgba(255,255,255,.055); }
#sidebar a.nav-link.active {
  background: linear-gradient(135deg, #6a6ff0, #4147c4);
  color: #fff; box-shadow: 0 8px 20px rgba(65,71,196,.38);
}
#sidebar a.nav-link.active i { color: #fff; }
.nav-group-header { letter-spacing: .07em; }

/* Topbar: softer line, a touch more breathing room */
#topbar { border-bottom: 1px solid var(--qs-line); background: rgba(255,255,255,.92); }
.topbar-title { color: var(--qs-ink); letter-spacing: -.01em; }
.search-trigger { border-radius: 10px; }
.icon-button, .mobile-menu { border-radius: 10px; }

/* Cards: single consistent elevation language across the whole panel. */
.card, .detail-card, .kpi, .followup-metric, .followup-sequence-card, .inbox-summary a {
  border-color: var(--qs-line);
  border-radius: var(--qs-radius-lg);
}
.card { box-shadow: var(--qs-shadow-sm); transition: box-shadow .18s ease, transform .18s ease; }
.detail-card { transition: box-shadow .18s ease; }
.detail-card:hover, [data-agent]:hover { box-shadow: var(--qs-shadow-lift); }

/* Buttons: rounder, a touch bolder, a quiet lift on the primary action. */
.btn { border-radius: 10px; letter-spacing: .005em; }
.btn-primary { background: var(--qs-accent-600); border-color: var(--qs-accent-600); box-shadow: 0 6px 16px rgba(65,71,196,.22); }
.btn-primary:hover { background: #363b9e; border-color: #363b9e; box-shadow: 0 8px 20px rgba(65,71,196,.3); }
.btn-outline-primary { color: var(--qs-accent-600); border-color: #c7caf0; }
.btn-outline-primary:hover { background: var(--qs-accent-soft); color: var(--qs-accent-600); border-color: var(--qs-accent-600); }

/* Status/badges: pill-shaped everywhere, slightly bolder weight for scannability. */
.badge { border-radius: 999px; font-weight: 600; letter-spacing: .01em; padding: .4em .7em; }

/* Tables: a little more air, a little less "admin grid" starkness. */
.table>:not(caption)>*>* { padding: 1rem .9rem; }
.table thead th { background: #fafbfd; }

/* Page heading: tighter, more editorial title treatment. */
.page-heading h1 { letter-spacing: -.04em; color: var(--qs-ink); }
.page-heading p { color: var(--qs-ink-soft); }
.eyebrow { color: var(--qs-accent-600); }

/* Agent card hover affordance (renders via inline style="cursor:pointer" in agents.js). */
[data-agent] { transition: box-shadow .18s ease, transform .18s ease; }
[data-agent]:hover { transform: translateY(-2px); }
