:root {
  --legacy-bg: #07152d;
  --legacy-bg-2: #081224;
  --legacy-panel: #0f2347;
  --legacy-panel-2: #0d1f3f;
  --legacy-line: #213763;
  --legacy-text: #eef4ff;
  --legacy-muted: #a9badb;
  --legacy-primary: #2f6df6;
  --legacy-primary-2: #3e7cff;
  --legacy-good: #28c76f;
  --legacy-warn: #ffb020;
  --legacy-danger: #ff5d73;
  --sidebar: 252px;
  color: var(--legacy-text);
  background: var(--legacy-bg);
}

html, body { min-height: 100%; max-width: 100%; overflow-x: hidden; background: linear-gradient(180deg, var(--legacy-bg), var(--legacy-bg-2) 62%, #07111f); color: var(--legacy-text); }
body, button, input, select, textarea { font-family: Inter, Arial, sans-serif; }
body { font-size: 13px; }
.app-shell { display: block; background: transparent; }
.layout { display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; inset: auto; top: 0; z-index: 50; width: auto; height: 100vh; padding: 18px 16px; color: var(--legacy-text); background: rgba(8,19,40,.94); border-right: 1px solid var(--legacy-line); box-shadow: none; overflow: auto; }
.brand { height: auto; display: flex; align-items: flex-start; gap: 8px; padding: 4px 8px 20px; border: 0; }
.brand.brand--logo { flex-direction: column; }
.brand-home { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; color: inherit; text-decoration: none; }
.brand-logo { display: block; width: 100%; max-width: 205px; height: auto; filter: drop-shadow(0 10px 24px rgba(0,0,0,.2)); }
.brand small { color: var(--legacy-muted); font-size: 10px; letter-spacing: .1em; }
.main-nav { padding: 0; }
.nav-label { padding: 16px 11px 7px; color: #7790b7; font-size: 10px; letter-spacing: .1em; }
.nav-item { min-height: 43px; margin: 4px 0; padding: 0 13px; border: 1px solid transparent; border-radius: 13px; color: #dfe9ff; font-size: 12px; }
.nav-item svg { color: #9db4da; }
.nav-item:hover { color: #fff; background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.05); }
.nav-item.active { color: #fff; background: linear-gradient(180deg,rgba(47,109,246,.25),rgba(47,109,246,.11)); border-color: rgba(90,144,255,.34); box-shadow: none; }
.nav-item.active svg { color: #75a4ff; }
.sidebar-foot { margin-top: 16px; padding: 15px 5px 0; border-top-color: var(--legacy-line); }
.sidebar-user strong { color: #fff; }
.sidebar-user span:not(.avatar) { color: var(--legacy-muted); }
.avatar { border-radius: 50%; background: #132b56; border: 1px solid var(--legacy-line); object-fit: cover; }
.avatar-photo { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 1px solid var(--legacy-line); background: #132b56; }
.avatar-photo.tiny { width: 28px; height: 28px; }

.main-area, .main { width: auto; min-width: 0; min-height: 100vh; margin: 0; padding: 20px 24px 28px; }
.topbar { position: relative; top: auto; z-index: 30; height: auto; min-height: 54px; margin-bottom: 18px; padding: 0; border: 0; background: transparent; backdrop-filter: none; }
.topbar-title h1 { margin: 0; color: var(--legacy-text); font-size: 24px; }
.topbar-title p { margin: 3px 0 0; color: var(--legacy-muted); font-size: 11px; }
.top-actions { gap: 10px; margin-left: auto; }
.top-user { padding: 7px 11px; border: 1px solid var(--legacy-line); border-radius: 999px; background: rgba(255,255,255,.04); }
.top-user strong { color: #fff; }
.top-user small { color: var(--legacy-muted); }
.content-wrap { max-width: none; min-height: 0; margin: 0; padding: 0; }
.app-footer { border-top-color: var(--legacy-line); color: #7890b5; }

.theme-switch { display: inline-flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid var(--legacy-line); border-radius: 999px; color: var(--legacy-text); background: rgba(255,255,255,.04); cursor: pointer; }
.theme-switch__track { position: relative; width: 40px; height: 22px; padding: 2px; border-radius: 999px; background: #18345f; }
.theme-switch__thumb { display: block; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .2s; }
body[data-theme="light"] .theme-switch__thumb { transform: translateX(18px); }
.language-form select { width: auto; min-width: 105px; padding: 8px 28px 8px 10px; border-radius: 999px; }

.page-head { margin-bottom: 16px; }
.page-head h1 { color: var(--legacy-text); font-size: 23px; }
.page-head p, .muted, .quiet { color: var(--legacy-muted); }
.eyebrow { color: #68a0ff; }
.card, .toolbar, .metric-strip { border: 1px solid var(--legacy-line); border-radius: 17px; color: var(--legacy-text); background: linear-gradient(180deg,rgba(16,35,69,.94),rgba(11,24,48,.94)); box-shadow: 0 10px 30px rgba(0,0,0,.16); }
.card { overflow: visible; }
.card h1, .card h2, .card h3, .card strong { color: var(--legacy-text); }
.card-head { border-bottom-color: rgba(255,255,255,.07); }
.card-head p, .card-body p, .stat-box span, .info-row dt { color: var(--legacy-muted); }
.button, button.button { border-color: #315083; color: #fff; background: linear-gradient(180deg,var(--legacy-primary-2),var(--legacy-primary)); }
.button:hover { color: #fff; filter: brightness(1.07); }
.button.ghost, .button.dark, .icon-button { border-color: var(--legacy-line); color: var(--legacy-text); background: rgba(255,255,255,.04); }
.button.danger { background: linear-gradient(180deg,#ff6f83,#ff4d68); }
.icon-button:hover { color: #fff; border-color: #395789; background: rgba(255,255,255,.08); }
.segmented { border-color: var(--legacy-line); background: #09172f; }
.segmented a { color: var(--legacy-muted); }
.segmented a.active { color: #fff; background: var(--legacy-primary); box-shadow: none; }
.badge { color: #dce8ff; background: rgba(47,109,246,.17); border: 1px solid rgba(90,144,255,.28); }
.badge.green { color: #8df0ba; background: rgba(40,199,111,.12); }
.badge.amber { color: #ffd58b; background: rgba(255,176,32,.13); }
.badge.red { color: #ff9bab; background: rgba(255,93,115,.13); }
.badge.blue { color: #aac7ff; background: rgba(47,109,246,.17); }

input, select, textarea { color: var(--legacy-text); background: #09172f; border-color: var(--legacy-line); }
input::placeholder, textarea::placeholder { color: #7188ad; }
.field span, label { color: #dbe5fa; }
.search-field { background: #09172f; border-color: var(--legacy-line); }
.search-field input { color: var(--legacy-text); }
.autocomplete-results { border-color: var(--legacy-line); background: #09172f; }
.autocomplete-option { color: var(--legacy-text); border-bottom-color: var(--legacy-line); }
.autocomplete-option:hover { background: #142c55; }

.table-wrap { border: 1px solid var(--legacy-line); border-radius: 14px; }
.data-table { color: var(--legacy-text); }
.data-table th { color: #cdd9f5; background: #1a3568; border-bottom-color: var(--legacy-line); }
.data-table td { border-bottom-color: rgba(255,255,255,.065); }
.data-table tbody tr:hover { background: rgba(255,255,255,.04); }
.data-table tbody tr.selected { outline: 1px solid #4c8dff; outline-offset: -1px; background: rgba(76,141,255,.13); }
.data-table a { color: #f2f6ff; }
.table-empty, .empty-state { color: var(--legacy-muted); }
.info-row { border-bottom-color: rgba(255,255,255,.07); }
.contact-card { border-bottom-color: rgba(255,255,255,.07); }
.contact-card a, .card-link { color: #8db5ff; }
.stat-box { border-right-color: var(--legacy-line); }
.task-card, .task-line, .opportunity-line { border-color: var(--legacy-line); background: rgba(255,255,255,.025); }
.next-action { color: #dce7fb; background: rgba(255,255,255,.04); }
.flash-success { color: #b7f5d3; background: rgba(40,199,111,.12); border-color: rgba(40,199,111,.35); }
.flash-error { color: #ffd0d7; background: rgba(255,93,115,.12); border-color: rgba(255,93,115,.35); }
.modal { background: rgba(1,7,18,.76); }
.modal-card { color: var(--legacy-text); background: #0d1f3f; border: 1px solid var(--legacy-line); }
.modal-head, .modal-foot { border-color: var(--legacy-line); background: #0d1f3f; }
.modal-card-wide { width: min(900px,94vw); }
.permission-grid { display: grid; grid-template-columns: repeat(3,minmax(160px,1fr)); gap: 8px; padding: 12px; border: 1px solid var(--legacy-line); border-radius: 12px; }
.permission-grid legend { padding: 0 7px; color: var(--legacy-muted); }
.permission-grid label { display: flex; gap: 8px; align-items: flex-start; padding: 8px; border: 1px solid rgba(255,255,255,.06); border-radius: 9px; background: rgba(255,255,255,.025); }
.permission-grid small { display: block; color: var(--legacy-muted); font-size: 9px; }

.crm-workbench { display: grid; gap: 12px; }
.crm-filter-grid { display: grid; grid-template-columns: minmax(260px,2fr) repeat(6,minmax(130px,1fr)) auto; gap: 9px; align-items: end; }
.sales-filter-grid { display: grid; grid-template-columns: minmax(260px,2fr) repeat(4,minmax(130px,1fr)) auto; gap: 9px; align-items: end; margin-bottom: 12px; padding: 12px; }
.crm-filter-grid .field { min-width: 0; }
.sales-filter-grid .field { min-width: 0; }
.crm-filter-grid label, .crm-filter-grid .field > span { font-size: 10px; }
.crm-filter-grid input, .crm-filter-grid select { min-height: 39px; padding: 9px 10px; }
.crm-list-card, .crm-detail-card { padding: 12px; }
.crm-list-scroll { max-height: 510px; overflow: auto; }
.crm-detail-scroll { max-height: 420px; overflow: auto; }
.crm-list-scroll thead th, .crm-detail-scroll thead th { position: sticky !important; top: 0; z-index: 12; box-shadow: 0 1px 0 var(--legacy-line); }
.crm-table { table-layout: fixed; font-size: 11px; }
.crm-table th, .crm-table td { box-sizing: border-box; padding: 8px 9px; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-table td > small { display: block; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; }
.crm-table th.sortable, .crm-table th a { cursor: pointer; user-select: none; }
.crm-table th a { display: flex; align-items: center; justify-content: space-between; gap: 5px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.data-table[data-resizable-table] { table-layout: fixed; }
.crm-list-scroll .data-table[data-resizable-table] th { position: sticky; top: 0; z-index: 12; overflow: visible; }
.column-resizer { position: absolute; top: 0; right: 0; z-index: 30; width: 13px; height: 100%; cursor: col-resize; pointer-events: auto; touch-action: none; }
.column-resizer::after { content: ""; position: absolute; top: 18%; bottom: 18%; right: 1px; width: 2px; border-radius: 2px; background: rgba(123,157,211,.72); opacity: .58; transition: opacity .15s, background .15s; }
.column-resizer:hover::after, body.is-resizing-columns .column-resizer::after { background: #4c8dff; opacity: 1; }
body.is-resizing-columns, body.is-resizing-columns * { cursor: col-resize !important; user-select: none !important; }
.open-button { min-width: 36px; padding: 6px 9px; border: 0; border-radius: 9px; color: #fff; background: linear-gradient(180deg,var(--legacy-primary-2),var(--legacy-primary)); font-weight: 750; }
.crm-topline, .section-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 9px; }
.crm-topline .muted { font-size: 10px; }
.detail-stats { display: grid; grid-template-columns: repeat(4,minmax(130px,1fr)); gap: 9px; margin-bottom: 11px; }
.detail-stat, .detail-meta-item { padding: 10px 11px; border: 1px solid rgba(255,255,255,.07); border-radius: 11px; background: rgba(255,255,255,.025); }
.detail-stat span, .detail-meta-item span { display: block; color: var(--legacy-muted); font-size: 9px; }
.detail-stat strong { display: block; margin-top: 3px; font-size: 16px; }
.detail-meta { display: grid; grid-template-columns: repeat(4,minmax(150px,1fr)); gap: 9px; margin-bottom: 14px; }
.detail-meta-item strong, .detail-meta-item a { display: block; margin-top: 3px; overflow-wrap: anywhere; }
.detail-section { margin-top: 14px; padding: 14px; border: 1px solid var(--legacy-line); border-radius: 12px; background: rgba(255,255,255,.025); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
.detail-section h2 { margin: 0; font-size: 13px; }
.chance { display: inline-flex; align-items: center; justify-content: center; min-width: 54px; padding: 5px 8px; border-radius: 999px; color: #fff; background: linear-gradient(90deg,#2f6df6,#28a3f5); font-weight: 850; }
.reason-help { position: relative; display: inline-grid; place-items: center; width: 18px; height: 18px; margin-left: 5px; border: 1px solid #6684b3; border-radius: 50%; color: #d9e6ff; cursor: help; font-weight: 850; }
.reason-help::after { content: attr(data-reason); position: absolute; left: 50%; bottom: calc(100% + 8px); z-index: 100; width: min(340px,70vw); padding: 10px 12px; border: 1px solid #385487; border-radius: 10px; color: #fff; background: #061328; box-shadow: 0 14px 34px rgba(0,0,0,.38); opacity: 0; pointer-events: none; transform: translate(-50%,5px); transition: .16s; white-space: normal; font-weight: 500; line-height: 1.45; }
.reason-help:hover::after, .reason-help:focus::after { opacity: 1; transform: translate(-50%,0); }
.interaction-grid { display: grid; grid-template-columns: repeat(4,minmax(150px,1fr)) minmax(220px,1.7fr) auto; gap: 9px; align-items: end; }
.interaction-history-head { margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--legacy-line); }
.interaction-list { display: grid; gap: 7px; }
.interaction-line { display: grid; grid-template-columns: 120px 140px minmax(160px,1fr) 120px; gap: 10px; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.07); }
.interaction-line small { color: var(--legacy-muted); }
.score-bar { height: 7px; min-width: 90px; overflow: hidden; border-radius: 999px; background: #23385f; }
.score-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#2f6df6,#31d59b); }
.sales-rank-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.sales-rank-grid .leader-row { grid-template-columns: 28px minmax(150px,1fr) minmax(80px,1fr) auto; }
.sales-metrics progress { display: block; width: 100%; margin-top: 7px; }
.load-more-wrap { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 14px 17px 3px; color: var(--legacy-muted); }
.load-more-wrap > span { font-size: 10px; }
.multi-select { position: relative; min-width: 0; }
.multi-select-trigger { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 39px; padding: 9px 10px; border: 1px solid var(--legacy-line); border-radius: 8px; color: var(--legacy-text); background: #09172f; font: inherit; text-align: left; cursor: pointer; }
.multi-select-trigger > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; }
.multi-select-panel { position: absolute; top: calc(100% + 5px); left: 0; z-index: 90; width: max(100%,280px); max-width: min(420px,80vw); padding: 8px; border: 1px solid var(--legacy-line); border-radius: 10px; background: #09172f; box-shadow: 0 18px 42px rgba(0,0,0,.35); }
.multi-select-search { width: 100%; min-height: 34px !important; margin-bottom: 7px; }
.multi-select-options { max-height: 260px; overflow: auto; }
.multi-select-option { display: flex; align-items: center; gap: 8px; min-height: 31px; padding: 5px 7px; border-radius: 7px; color: var(--legacy-text); cursor: pointer; }
.multi-select-option:hover { background: rgba(255,255,255,.07); }
.multi-select-option[hidden], .multi-select-option.search-hidden { display: none; }
.multi-select-option input { flex: none; width: 15px; height: 15px; min-height: 15px; margin: 0; padding: 0; }
.multi-select-option span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; font-size: 10px; }
.crm-list-card .crm-table tbody tr:nth-child(even) td { background: rgba(255,255,255,.025); }
.crm-list-card .crm-table tbody tr.selected td { background: rgba(47,109,246,.16); }
.inline-editable { display: block; min-height: 18px; padding: 2px 4px; margin: -2px -4px; border: 1px dashed transparent; border-radius: 5px; cursor: text; transition: border-color .15s, background .15s, box-shadow .15s; }
.inline-editable:hover { border-color: #5f7ba8; background: rgba(255,255,255,.05); }
.inline-edit-input { width: 100%; min-width: 80px; height: 28px; padding: 4px 7px; border: 1px solid #4c8dff; border-radius: 6px; color: var(--legacy-text); background: #08162e; font: inherit; font-weight: 650; outline: 2px solid rgba(76,141,255,.2); }
.inline-saved { border-color: #31b887 !important; background: rgba(49,184,135,.12) !important; }
.product-row-actions, .product-open-head { display: flex; align-items: center; gap: 8px; }
.product-row-actions input, .product-open-head input { flex: none; width: 16px; height: 16px; margin: 0; accent-color: var(--legacy-primary); cursor: pointer; }
.product-merge-form { width: min(680px,94vw); }
.merge-selected-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin: 12px 0; }
.merge-selected-item { display: grid; gap: 2px; min-width: 0; padding: 9px 10px; border: 1px solid var(--legacy-line); border-radius: 8px; background: rgba(255,255,255,.035); }
.merge-selected-item strong, .merge-selected-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.merge-selected-item small { color: var(--legacy-muted); }
.opportunity-customer-link { color: inherit; text-decoration: none; }
.opportunity-customer-link:hover { color: #8db5ff; text-decoration: underline; }
.opportunity-history { display: grid; gap: 3px; margin: 10px 0; padding: 9px 10px; border: 1px solid var(--legacy-line); border-radius: 9px; background: rgba(255,255,255,.035); }
.opportunity-history strong { font-size: 10px; }
.opportunity-history span { color: #dce7fb; font-size: 10px; }
.opportunity-history small { color: var(--legacy-muted); font-size: 10px; line-height: 1.4; }

.celebration-overlay.hidden { display: none; }
.celebration-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 24px; }
.celebration-backdrop { position: absolute; inset: 0; background: rgba(1,7,18,.76); backdrop-filter: blur(7px); }
.celebration-modal { position: relative; width: min(940px,94vw); overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 28px; background: #081223; box-shadow: 0 25px 70px rgba(0,0,0,.45); }
.celebration-media-wrap { position: relative; min-height: 520px; background: #050b16; }
.celebration-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.celebration-info { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 40px; text-align: center; background: linear-gradient(180deg,rgba(3,7,18,.16),rgba(3,7,18,.72)); }
.celebration-photo { width: 120px; height: 120px; border: 5px solid #fff; border-radius: 50%; object-fit: cover; }
.celebration-info h2 { margin: 0; color: #fff; font-size: clamp(32px,6vw,64px); }
.celebration-customer { color: #fff; font-size: 23px; font-weight: 750; }
.celebration-amount { color: #4cf2d1; font-size: 46px; font-weight: 900; }
.celebration-progress { width: min(420px,80%); height: 12px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.18); }
.celebration-progress-fill { width: 0; height: 100%; background: linear-gradient(90deg,var(--legacy-good),#5de8a1); }
.celebration-target { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; width: min(420px,80%); color: #fff; font-size: 12px; text-align: left; }
.celebration-target .celebration-progress { grid-column: 1 / -1; width: 100%; }
.celebration-timer { width: min(420px,80%); height: 3px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.14); }
.celebration-timer > div { width: 0; height: 100%; background: rgba(255,255,255,.72); }

body[data-theme="light"] { --legacy-bg:#edf2f6; --legacy-bg-2:#dbe7f0; --legacy-panel:#fff; --legacy-panel-2:#f5f9fc; --legacy-line:#d7e2eb; --legacy-text:#17304f; --legacy-muted:#5f6f84; background: linear-gradient(180deg,#edf2f6,#dbe7f0); color: var(--legacy-text); }
body[data-theme="light"] .sidebar { background: linear-gradient(180deg,#fff,#f4f9fc); box-shadow: 0 18px 36px rgba(18,38,63,.08); }
body[data-theme="light"] .nav-item { color: #35506e; }
body[data-theme="light"] .nav-item.active { color: #0f4b78; background: rgba(15,109,136,.12); border-color: rgba(15,109,136,.18); }
body[data-theme="light"] .card, body[data-theme="light"] .toolbar, body[data-theme="light"] .metric-strip { color: var(--legacy-text); background: linear-gradient(180deg,#fff,#f7fbfe); box-shadow: 0 14px 30px rgba(18,38,63,.08); }
body[data-theme="light"] .card h1, body[data-theme="light"] .card h2, body[data-theme="light"] .card h3, body[data-theme="light"] .card strong, body[data-theme="light"] .page-head h1, body[data-theme="light"] .topbar-title h1 { color: var(--legacy-text); }
body[data-theme="light"] input, body[data-theme="light"] select, body[data-theme="light"] textarea, body[data-theme="light"] .search-field { color: var(--legacy-text); background: #fff; }
body[data-theme="light"] .data-table { color: var(--legacy-text); }
body[data-theme="light"] .data-table th { color: #46607b; background: #eaf2f8; }
body[data-theme="light"] .data-table a { color: #17304f; }
body[data-theme="light"] .detail-stat, body[data-theme="light"] .detail-meta-item { border-color: #d7e2eb; background: #f8fbfe; }
body[data-theme="light"] .detail-section { border-color: #d7e2eb; background: #f8fbfe; box-shadow: 0 8px 18px rgba(18,38,63,.045); }
body[data-theme="light"] .crm-list-card .crm-table tbody tr:nth-child(odd) td { background: #fff; }
body[data-theme="light"] .crm-list-card .crm-table tbody tr:nth-child(even) td { background: #f2f6f9; }
body[data-theme="light"] .crm-list-card .crm-table tbody tr:hover td { background: #e7f1f8; }
body[data-theme="light"] .crm-list-card .crm-table tbody tr.selected td { background: #dceaff; }
body[data-theme="light"] .inline-editable:hover { border-color: #8aa1b8; background: #eef5fa; }
body[data-theme="light"] .inline-edit-input { color: #17304f; border-color: #2f6df6; background: #fff; }
body[data-theme="light"] .merge-selected-item { border-color: #d7e2eb; background: #f5f9fc; }
body[data-theme="light"] .top-user strong { color: var(--legacy-text); }
body[data-theme="light"] .field span, body[data-theme="light"] label { color: #35506e; }
body[data-theme="light"] .sidebar-user strong { color: #17304f; }
body[data-theme="light"] .sidebar-user span:not(.avatar) { color: #5f6f84; }
body[data-theme="light"] .column-resizer::after { background: #8aa1b8; }

.kpi-grid { grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 12px; width: 100%; }
.kpi { min-width: 0; overflow: hidden; }
.kpi::before, .kpi::after { display: none !important; content: none !important; }
.kpi-icon { display: grid !important; place-items: center !important; width: 32px !important; height: 32px !important; padding: 0 !important; }
.kpi-icon svg { display: block; width: 16px !important; height: 16px !important; margin: 0 !important; }

.mobile-menu, .sidebar-close, .mobile-scrim { display: none; }
@media (max-width: 1420px) { :root { --sidebar: 215px; } .crm-filter-grid, .sales-filter-grid { grid-template-columns: repeat(4,minmax(145px,1fr)); } }
@media (max-width: 980px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { position: fixed; width: 260px; transform: translateX(-105%); transition: transform .2s; }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .mobile-menu, .sidebar-close { display: grid; }
  .mobile-scrim { position: fixed; inset: 0; z-index: 45; background: rgba(1,7,18,.65); }
  body.sidebar-open .mobile-scrim { display: block; }
  .crm-filter-grid, .sales-filter-grid { grid-template-columns: repeat(2,minmax(145px,1fr)); }
  .detail-stats, .detail-meta { grid-template-columns: repeat(2,minmax(130px,1fr)); }
  .interaction-grid { grid-template-columns: 1fr 1fr; }
  .sales-rank-grid { grid-template-columns: 1fr; }
  .permission-grid { grid-template-columns: repeat(2,minmax(150px,1fr)); }
}
@media (max-width: 650px) {
  .main-area, .main { padding: 13px; }
  .topbar { align-items: flex-start; flex-wrap: wrap; }
  .top-actions { width: 100%; flex-wrap: wrap; }
  .crm-filter-grid, .sales-filter-grid, .detail-stats, .detail-meta, .interaction-grid { grid-template-columns: 1fr; }
  .interaction-line { grid-template-columns: 1fr; }
  .permission-grid { grid-template-columns: 1fr; }
}

/* V2.8: compact work lists, old-CRM table rhythm and sales intelligence */
.crm-table { font-size: 12px; }
.crm-table th, .crm-table td { padding: 7px 9px; }
.crm-table thead th:not(:last-child) {
  border-right: 3px solid transparent;
  background-image: linear-gradient(90deg,transparent calc(100% - 3px),rgba(125,151,177,.12) calc(100% - 3px),rgba(125,151,177,.34) calc(100% - 2px),rgba(255,255,255,.32) calc(100% - 1px));
}
body[data-theme="dark"] .crm-table thead th:not(:last-child) {
  background-image: linear-gradient(90deg,transparent calc(100% - 3px),rgba(255,255,255,.03) calc(100% - 3px),rgba(122,153,196,.22) calc(100% - 2px),rgba(255,255,255,.08) calc(100% - 1px));
}
.column-resizer { width: 7px; right: -3px; }
.detail-section--sellable { border-color: #18a8c8 !important; background: linear-gradient(180deg,rgba(24,168,200,.11),rgba(255,255,255,.025) 110px) !important; }
.detail-section--sellable > .section-head:first-child { background: rgba(24,168,200,.12); }
.detail-section--product-history { border-color: #8b5cf6 !important; background: linear-gradient(180deg,rgba(139,92,246,.11),rgba(255,255,255,.025) 110px) !important; }
.detail-section--product-history > .section-head:first-child { background: rgba(139,92,246,.12); }
body[data-theme="light"] .detail-section--sellable { background: linear-gradient(180deg,#eaf9fc,#fff 120px) !important; }
body[data-theme="light"] .detail-section--sellable > .section-head:first-child { background: #dcf3f8; border-bottom-color: #b7e2eb; }
body[data-theme="light"] .detail-section--product-history { background: linear-gradient(180deg,#f3efff,#fff 120px) !important; }
body[data-theme="light"] .detail-section--product-history > .section-head:first-child { background: #eae2ff; border-bottom-color: #d3c4f6; }

.opportunity-filter-grid, .branch-filter-grid, .task-filter-grid {
  position: relative; z-index: 25; display: grid; gap: 8px; align-items: end;
  margin-bottom: 12px; padding: 11px; overflow: visible;
}
.opportunity-filter-grid { grid-template-columns: minmax(190px,1.45fr) minmax(190px,1.45fr) repeat(7,minmax(105px,1fr)); }
.branch-filter-grid { grid-template-columns: minmax(190px,1.45fr) repeat(7,minmax(115px,1fr)); }
.task-filter-grid { grid-template-columns: minmax(210px,1.7fr) repeat(6,minmax(112px,1fr)); }
.opportunity-filter-grid .field, .branch-filter-grid .field, .task-filter-grid .field { min-width: 0; }
.opportunity-filter-grid input, .opportunity-filter-grid select, .opportunity-filter-grid .multi-select-trigger,
.branch-filter-grid input, .branch-filter-grid select, .branch-filter-grid .multi-select-trigger,
.task-filter-grid input, .task-filter-grid select { min-width: 0; min-height: 36px; padding: 7px 8px; font-size: 11px; }
.opportunity-filter-grid .filter-actions, .branch-filter-grid .filter-actions, .task-filter-grid .filter-actions { grid-column: 1 / -1; justify-content: flex-start; }
.range-field > span:last-child { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.table-actions { display: flex; flex-wrap: nowrap; gap: 4px; }
.button.tiny { min-height: 25px; padding: 4px 7px; border-radius: 7px; font-size: 9px; }
.opportunity-customer-dossier { margin-top: 14px; }
.compact-interaction-list { display: grid; gap: 6px; }
.interaction-line { display: grid; grid-template-columns: minmax(170px,.7fr) minmax(150px,.7fr) minmax(220px,1.6fr); gap: 12px; padding: 7px 9px; border-bottom: 1px solid var(--legacy-line); font-size: 11px; }
.interaction-line:last-child { border-bottom: 0; }
.interaction-line span, .interaction-line small { color: var(--legacy-muted); }

.task-list-card { overflow: hidden; }
.task-status-summary { display: flex; flex-wrap: wrap; gap: 6px; }
.task-count { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; border-radius: 999px; color: var(--legacy-muted); background: rgba(255,255,255,.05); font-size: 9px; }
.task-count b { color: inherit; }
.task-count.open { color: #5aa2ff; }.task-count.in-progress { color: #f8c35b; }.task-count.done { color: #58d79a; }.task-count.cancelled { color: #ff777d; }
.task-compact-list { max-height: calc(100vh - 285px); min-height: 430px; overflow: auto; }
.task-compact-row {
  display: grid; grid-template-columns: 24px 9px minmax(240px,2fr) minmax(115px,.8fr) minmax(115px,.8fr) 90px 72px 90px;
  gap: 8px; align-items: center; min-height: 39px; padding: 5px 10px; border-bottom: 1px solid var(--legacy-line);
}
.task-compact-row:nth-of-type(4n+1) { background: rgba(255,255,255,.022); }
.task-expand { width: 23px; height: 23px; padding: 0; border: 1px solid var(--legacy-line); border-radius: 6px; color: inherit; background: transparent; cursor: pointer; }
.task-expand:hover { color: #fff; border-color: #4f86e7; background: #2f6df6; }
.task-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #6d7d91; }
.status-open .task-status-dot { background: #2f7df6; }.status-in_progress .task-status-dot { background: #ffb020; }.status-waiting .task-status-dot { background: #9b7cff; }.status-done .task-status-dot { background: #28c76f; }.status-cancelled .task-status-dot { background: #ef4d57; }
.task-compact-title { min-width: 0; color: inherit; text-decoration: none; }
.task-compact-title strong, .task-compact-title small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-compact-title strong { font-size: 11px; }.task-compact-title small { margin-top: 1px; color: var(--legacy-muted); font-size: 9px; }
.task-person, .task-due { min-width: 0; }
.task-person small, .task-person strong, .task-due small, .task-due strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-person small, .task-due small { color: var(--legacy-muted); font-size: 8px; }.task-person strong, .task-due strong { font-size: 10px; }
.task-due.overdue strong { color: #ef4d57; }
.task-status-badge.cancelled { color: #ff7379; border-color: rgba(239,77,87,.35); background: rgba(239,77,87,.12); }
.task-compact-detail { display: grid; grid-template-columns: minmax(250px,1fr) minmax(420px,1.4fr); gap: 16px; padding: 9px 42px; border-bottom: 1px solid var(--legacy-line); background: rgba(47,109,246,.055); }
.task-detail-copy p { margin: 0 0 4px; font-size: 11px; }.task-detail-copy small { display: block; color: var(--legacy-muted); font-size: 9px; }
.task-status-form { display: grid; grid-template-columns: 130px minmax(170px,1fr) auto; gap: 7px; align-items: center; }
.task-status-form input, .task-status-form select { min-height: 30px; padding: 5px 7px; font-size: 10px; }
body[data-theme="light"] .task-compact-row:nth-of-type(4n+1) { background: #f4f7fa; }
body[data-theme="light"] .task-compact-detail { background: #eef4fc; }
body[data-theme="light"] .task-expand:hover { color: #fff; }

.celebration-unmute { margin-top: 2px; }
.celebration-audio-note { max-width: 520px; color: #dce7f5; font-size: 11px; }

@media (max-width: 1600px) {
  .opportunity-filter-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
  .branch-filter-grid, .task-filter-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media (max-width: 1050px) {
  .opportunity-filter-grid, .branch-filter-grid, .task-filter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .task-compact-row { grid-template-columns: 24px 9px minmax(220px,1fr) 110px 90px; }
  .task-compact-row .task-person:nth-of-type(2), .task-compact-row > .badge.high, .task-compact-row > .badge.normal, .task-compact-row > .badge.low, .task-compact-row > .badge.urgent { display: none; }
  .task-compact-detail { grid-template-columns: 1fr; padding-left: 42px; }
}
@media (max-width: 650px) {
  .opportunity-filter-grid, .branch-filter-grid, .task-filter-grid { grid-template-columns: 1fr; }
  .interaction-line, .task-status-form { grid-template-columns: 1fr; }
}

/* HasyCRM 2.3 interface alignment */
[hidden] { display: none !important; }

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--sidebar);
  height: 100dvh;
  overflow: hidden;
}
.main-nav { min-height: 0; overflow-y: auto; }
.brand small { letter-spacing: 0; text-transform: none; }

/* A fixed sidebar is removed from the grid flow. Keep the application content
   in its own full-width area instead of letting it collapse into column one. */
@media (min-width: 981px) {
  .layout { display: block; }
  .main {
    width: calc(100% - var(--sidebar));
    margin-left: var(--sidebar);
  }
}

.button, button.button {
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid #315083;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(180deg,var(--legacy-primary-2),var(--legacy-primary));
  box-shadow: none;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.15;
  transform: none;
  transition: color .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.button.small, button.button.small { min-height: 31px; padding: 6px 10px; font-size: 10px; }
.button:hover, button.button:hover {
  color: #fff;
  border-color: #4c82eb;
  background: linear-gradient(180deg,#4b86ff,#2f6df6);
  box-shadow: 0 4px 12px rgba(47,109,246,.18);
  filter: none;
  transform: none;
}
.button.ghost, .button.dark {
  color: var(--legacy-text);
  border-color: var(--legacy-line);
  background: rgba(255,255,255,.04);
}
.button.ghost:hover, .button.dark:hover {
  color: #fff;
  border-color: #395789;
  background: rgba(255,255,255,.10);
}
.button.disabled, .button:disabled { opacity: .46; pointer-events: none; }
.icon-button:hover { color: #fff; border-color: #4b6592; background: rgba(255,255,255,.11); }
.open-button {
  min-width: 44px;
  min-height: 29px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 9px;
  border: 1px solid #315083;
  border-radius: 8px;
  color: #fff !important;
  background: linear-gradient(180deg,var(--legacy-primary-2),var(--legacy-primary));
  font-size: 10px;
  font-weight: 750;
  transition: background .15s ease, border-color .15s ease;
}
.open-button:hover { color: #fff !important; border-color: #4c82eb; background: linear-gradient(180deg,#4b86ff,#2f6df6); }

.crm-filter-grid {
  grid-template-columns: minmax(0,1.7fr) repeat(7,minmax(0,1fr));
  gap: 8px;
  padding: 12px;
}
.sales-filter-grid { grid-template-columns: minmax(0,1.7fr) repeat(4,minmax(0,1fr)); gap: 8px; }
.crm-filter-grid .filter-actions, .sales-filter-grid .filter-actions { grid-column: 1 / -1; justify-content: flex-start; }
.crm-filter-grid input, .crm-filter-grid select, .sales-filter-grid input, .sales-filter-grid select {
  min-width: 0;
  min-height: 36px;
  padding: 8px 9px;
  font-size: 11px;
}

.crm-table th, .crm-table td, .crm-table .num { text-align: left !important; }
.crm-table .table-empty { text-align: center !important; }
.crm-table th, .crm-table td { padding: 8px 10px; }
.crm-table td:first-child, .crm-table th:first-child { padding-left: 10px; }
.data-table[data-resizable-table] { min-width: 100%; }
.data-table[data-resizable-table] th[hidden], .data-table[data-resizable-table] td[hidden] { display: none !important; }

.reason-help {
  position: relative;
  z-index: 1;
  width: 19px;
  height: 19px;
  padding: 0;
  overflow: visible;
  border: 1px solid #6684b3;
  color: #d9e6ff;
  background: rgba(255,255,255,.04);
  line-height: 17px;
  vertical-align: middle;
}
.reason-help::after { content: none !important; display: none !important; }
.reason-help:hover, .reason-help:focus, .reason-help[aria-expanded="true"] {
  color: #fff;
  border-color: #75a4ff;
  background: #244d91;
  outline: none;
}
.reason-popover {
  position: fixed;
  z-index: 10000;
  max-width: calc(100vw - 24px);
  padding: 10px 12px;
  border: 1px solid #385487;
  border-radius: 9px;
  color: #fff;
  background: #061328;
  box-shadow: 0 14px 34px rgba(0,0,0,.38);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.45;
  white-space: normal;
  pointer-events: none;
}

.column-picker-popover {
  position: fixed;
  z-index: 10020;
  max-height: min(430px,calc(100vh - 24px));
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--legacy-line);
  border-radius: 10px;
  color: var(--legacy-text);
  background: #0d1f3f;
  box-shadow: 0 18px 42px rgba(0,0,0,.35);
}
.column-picker-title { display: block; margin-bottom: 9px; font-size: 11px; }
.column-picker-options { display: grid; gap: 3px; }
.column-picker-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 31px;
  padding: 5px 7px;
  border-radius: 7px;
  color: var(--legacy-text);
  cursor: pointer;
}
.column-picker-option:hover { background: rgba(255,255,255,.07); }
.column-picker-option input { width: 15px; min-height: 15px; height: 15px; margin: 0; padding: 0; }
.column-picker-option span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.column-picker-reset {
  width: 100%;
  margin-top: 9px;
  padding: 8px 10px;
  border: 1px solid var(--legacy-line);
  border-radius: 7px;
  color: var(--legacy-text);
  background: rgba(255,255,255,.04);
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}
.column-picker-reset:hover { color: #fff; border-color: #395789; background: rgba(255,255,255,.10); }

body[data-theme="light"] .modal { background: rgba(23,48,79,.28); }
body[data-theme="light"] .modal-card,
body[data-theme="light"] .modal-head,
body[data-theme="light"] .modal-foot {
  color: #17304f;
  border-color: #d7e2eb;
  background: #fff;
}
body[data-theme="light"] .modal-card { box-shadow: 0 24px 65px rgba(18,38,63,.22); }
body[data-theme="light"] .modal-head h2,
body[data-theme="light"] .modal-card strong { color: #17304f; }
body[data-theme="light"] .modal-foot { background: #f7fbfe; }
body[data-theme="light"] .permission-grid { border-color: #d7e2eb; }
body[data-theme="light"] .permission-grid legend,
body[data-theme="light"] .permission-grid small { color: #5f6f84; }
body[data-theme="light"] .permission-grid label { color: #17304f; border-color: #d7e2eb; background: #f7fbfe; }
body[data-theme="light"] .button, body[data-theme="light"] button.button {
  color: #fff;
  border-color: #2f6df6;
  background: linear-gradient(180deg,#3e7cff,#2f6df6);
}
body[data-theme="light"] .button:hover, body[data-theme="light"] button.button:hover {
  color: #fff;
  border-color: #245bd5;
  background: linear-gradient(180deg,#3774ea,#245fdc);
}
body[data-theme="light"] .button.ghost,
body[data-theme="light"] .button.dark,
body[data-theme="light"] .icon-button {
  color: #17304f;
  border-color: #cad9e5;
  background: #fff;
}
body[data-theme="light"] .button.ghost:hover,
body[data-theme="light"] .button.dark:hover,
body[data-theme="light"] .icon-button:hover {
  color: #123f68;
  border-color: #9eb5c9;
  background: #eaf3f9;
}
body[data-theme="light"] .reason-help { color: #38506b; border-color: #8aa1b8; background: #eef4fa; }
body[data-theme="light"] .reason-help:hover,
body[data-theme="light"] .reason-help:focus,
body[data-theme="light"] .reason-help[aria-expanded="true"] { color: #fff; border-color: #2f6df6; background: #2f6df6; }
body[data-theme="light"] .reason-popover { color: #17304f; border-color: #b9ccdc; background: #fff; box-shadow: 0 15px 38px rgba(18,38,63,.22); }
body[data-theme="light"] .column-picker-popover { color: #17304f; border-color: #d7e2eb; background: #fff; box-shadow: 0 18px 38px rgba(18,38,63,.18); }
body[data-theme="light"] .column-picker-option { color: #17304f; }
body[data-theme="light"] .column-picker-option:hover { background: #eef5fa; }
body[data-theme="light"] .column-picker-reset { color: #17304f; border-color: #cad9e5; background: #f7fbfe; }
body[data-theme="light"] .column-picker-reset:hover { color: #123f68; border-color: #9eb5c9; background: #eaf3f9; }
body[data-theme="light"] .multi-select-trigger,
body[data-theme="light"] .multi-select-panel { color: #17304f; border-color: #cad9e5; background: #fff; }
body[data-theme="light"] .multi-select-option { color: #17304f; }
body[data-theme="light"] .multi-select-option:hover { background: #eef5fa; }
body[data-theme="light"] .opportunity-card p,
body[data-theme="light"] .opportunity-card .hero-meta,
body[data-theme="light"] .opportunity-card .hero-meta span { color: #52677e; }
body[data-theme="light"] .opportunity-customer-link,
body[data-theme="light"] .opportunity-card .hero-meta a { color: #17304f; }
body[data-theme="light"] .opportunity-customer-link:hover,
body[data-theme="light"] .opportunity-card .hero-meta a:hover { color: #1f63b5; }
body[data-theme="light"] .next-action { color: #27445f; border: 1px solid #d7e2eb; background: #eef5fa; }
body[data-theme="light"] .next-action strong { color: #17304f; }
body[data-theme="light"] .opportunity-card .badge.blue { color: #174f93; border-color: #9fc3f6; background: #dceaff; }
body[data-theme="light"] .opportunity-card .badge.amber { color: #7b4a00; border-color: #e9c176; background: #fff0cf; }
body[data-theme="light"] .opportunity-history { border-color: #d7e2eb; background: #f5f9fc; }
body[data-theme="light"] .opportunity-history span { color: #27445f; }
body[data-theme="light"] .opportunity-history small,
body[data-theme="light"] .interaction-line small { color: #52677e; }

@media (max-width: 1420px) {
  .crm-filter-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .sales-filter-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 980px) {
  .sidebar { width: 260px; }
  .main { width: 100%; margin-left: 0; }
  .crm-filter-grid, .sales-filter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 650px) {
  .crm-filter-grid, .sales-filter-grid { grid-template-columns: 1fr; }
  .crm-topline .page-actions, .page-head .page-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
}

/* HasyCRM 2.7 – legacy interaction fidelity and contrast */
html, body, button, input, select, textarea { font-family: Inter, Arial, sans-serif !important; }

.button, button.button,
.open-button,
.inline-edit-action {
  border-color: #315083;
  color: #fff !important;
  background: linear-gradient(180deg,#3e7cff,#2f6df6);
  font-family: Inter, Arial, sans-serif;
  font-weight: 700;
}
.button:hover, button.button:hover,
.open-button:hover,
.inline-edit-action:hover {
  border-color: #4c82eb;
  color: #fff !important;
  background: linear-gradient(180deg,#4b86ff,#2f6df6);
  box-shadow: 0 4px 12px rgba(47,109,246,.18);
}
.button.ghost, .button.dark, .inline-edit-cancel {
  border-color: var(--legacy-line);
  color: var(--legacy-text) !important;
  background: rgba(255,255,255,.04);
}
.button.ghost:hover, .button.dark:hover, .inline-edit-cancel:hover {
  border-color: #395789;
  color: #fff !important;
  background: rgba(255,255,255,.10);
  box-shadow: none;
}
.button.danger, .button.danger:hover { border-color: #ff5d73; background: linear-gradient(180deg,#ff6f83,#ff4d68); }

.crm-filter-grid { grid-template-columns: minmax(230px,1.7fr) repeat(7,minmax(115px,1fr)); }
.products-filter-grid { grid-template-columns: minmax(230px,1.7fr) repeat(6,minmax(115px,1fr)); }
.crm-filter-grid.card { position: relative; z-index: 25; overflow: visible; }
.crm-list-card { position: relative; z-index: 1; }
.autocomplete { position: relative; isolation: isolate; }
.autocomplete.autocomplete-open { z-index: 500; }
.autocomplete-results {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  left: 0;
  z-index: 5000;
  width: max(100%,440px);
  max-width: min(680px,calc(100vw - 32px));
  max-height: 340px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 4px;
  border: 1px solid #294776;
  border-radius: 10px;
  color: #eef4ff;
  background: #09172f;
  box-shadow: 0 20px 48px rgba(0,0,0,.42);
}
.autocomplete-option {
  position: relative;
  width: 100%;
  min-height: 54px;
  display: flex;
  align-items: center;
  padding: 9px 11px;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid #1e345b;
  border-radius: 7px;
  color: #eef4ff;
  background: #09172f;
  text-align: left;
  cursor: pointer;
}
.autocomplete-option:last-child { border-bottom-color: transparent; }
.autocomplete-option > span { display: block; min-width: 0; width: 100%; }
.autocomplete-option strong,
.autocomplete-option small { display: block; overflow: hidden; color: inherit; text-overflow: ellipsis; white-space: nowrap; }
.autocomplete-option strong { font-size: 11px; line-height: 1.35; }
.autocomplete-option small { margin-top: 4px; color: #a9badb; font-size: 9px; }
.autocomplete-option:hover,
.autocomplete-option:focus-visible,
.autocomplete-option.is-active { color: #fff; background: #173c76; outline: none; }
.autocomplete-option:hover small,
.autocomplete-option:focus-visible small,
.autocomplete-option.is-active small { color: #dbe7ff; }
.multi-select-trigger:hover { border-color: #3d5d90; background: #0d2344; }
.card-link:hover { color: #8db5ff !important; text-decoration: underline; }

.inline-editable, .branch-editable { cursor: text; }
.branch-editable { transition: border-color .15s, background .15s, box-shadow .15s; }
.branch-editable:hover { border-color: #5f7ba8; background: rgba(255,255,255,.05); }
.inline-edit-editor,
.branch-edit-editor { display: grid; gap: 6px; width: 100%; min-width: 190px; }
.branch-edit-editor { grid-template-columns: repeat(2,minmax(135px,1fr)); }
.inline-edit-input {
  width: 100%;
  min-width: 110px;
  height: 32px;
  padding: 5px 8px;
  border: 1px solid #4c8dff;
  border-radius: 7px;
  color: var(--legacy-text);
  background: #08162e;
  font: inherit;
  font-weight: 650;
  outline: 2px solid rgba(76,141,255,.18);
}
.inline-edit-actions { display: flex; align-items: center; gap: 6px; }
.branch-edit-editor .inline-edit-actions { grid-column: 1 / -1; }
.inline-edit-action {
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid #315083;
  border-radius: 7px;
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
}
.inline-edit-action:disabled { opacity: .55; pointer-events: none; }

.crm-detail-card > .detail-section { position: relative; margin-top: 22px; padding: 16px; border-width: 1px 1px 1px 5px; border-style: solid; border-radius: 13px; box-shadow: 0 12px 26px rgba(0,0,0,.14); }
.crm-detail-card > .detail-section > .section-head:first-child { margin: -16px -16px 14px; padding: 12px 15px; border-bottom: 1px solid rgba(255,255,255,.10); border-radius: 8px 12px 0 0; }
.detail-section--recommendations { border-color: #2f6df6 !important; background: linear-gradient(180deg,rgba(47,109,246,.12),rgba(255,255,255,.025) 110px) !important; }
.detail-section--recommendations > .section-head:first-child { background: rgba(47,109,246,.13); }
.detail-section--interaction { border-color: #ffb020 !important; background: linear-gradient(180deg,rgba(255,176,32,.11),rgba(255,255,255,.025) 110px) !important; }
.detail-section--interaction > .section-head:first-child { background: rgba(255,176,32,.12); }
.detail-section--purchases, .detail-section--buyers { border-color: #28c76f !important; background: linear-gradient(180deg,rgba(40,199,111,.10),rgba(255,255,255,.025) 110px) !important; }
.detail-section--purchases > .section-head:first-child,
.detail-section--buyers > .section-head:first-child { background: rgba(40,199,111,.11); }
.detail-section--history { border-color: #8b7cf6 !important; background: linear-gradient(180deg,rgba(139,124,246,.10),rgba(255,255,255,.025) 110px) !important; }
.detail-section--history > .section-head:first-child { background: rgba(139,124,246,.11); }

.buyer-filter-grid {
  position: relative;
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(4,minmax(125px,1fr)) auto;
  gap: 8px;
  align-items: end;
  margin: 0 0 12px;
  padding: 10px;
  overflow: visible;
  border: 1px solid var(--legacy-line);
  border-radius: 10px;
  background: rgba(255,255,255,.035);
}
.buyer-filter-grid .field { min-width: 0; }
.buyer-filter-grid input, .buyer-filter-grid select, .buyer-filter-grid .multi-select-trigger { min-height: 34px; padding: 7px 8px; font-size: 10px; }
.buyer-filter-actions { align-self: end; flex-wrap: nowrap; }

body[data-theme="light"] .autocomplete-results { color: #17304f; border-color: #b9ccdc; background: #fff; box-shadow: 0 20px 46px rgba(18,38,63,.24); }
body[data-theme="light"] .autocomplete-option { color: #17304f; border-bottom-color: #dfe7ee; background: #fff; }
body[data-theme="light"] .autocomplete-option small { color: #5f6f84; }
body[data-theme="light"] .autocomplete-option:hover,
body[data-theme="light"] .autocomplete-option:focus-visible,
body[data-theme="light"] .autocomplete-option.is-active { color: #123f68; background: #e6f0f8; }
body[data-theme="light"] .autocomplete-option:hover small,
body[data-theme="light"] .autocomplete-option:focus-visible small,
body[data-theme="light"] .autocomplete-option.is-active small { color: #46607b; }
body[data-theme="light"] .multi-select-trigger:hover { border-color: #9eb5c9; background: #f1f6fa; }
body[data-theme="light"] .card-link:hover { color: #1f63b5 !important; }
body[data-theme="light"] .button.ghost,
body[data-theme="light"] .button.dark,
body[data-theme="light"] .inline-edit-cancel { color: #17304f !important; border-color: #cad9e5; background: #fff; }
body[data-theme="light"] .button.ghost:hover,
body[data-theme="light"] .button.dark:hover,
body[data-theme="light"] .inline-edit-cancel:hover { color: #123f68 !important; border-color: #9eb5c9; background: #eaf3f9; }
body[data-theme="light"] .branch-editable:hover { border-color: #8aa1b8; background: #eef5fa; }
body[data-theme="light"] .inline-edit-input { color: #17304f; border-color: #2f6df6; background: #fff; }
body[data-theme="light"] .buyer-filter-grid { border-color: #ccdbe7; background: #f4f8fb; }
body[data-theme="light"] .crm-detail-card > .detail-section { box-shadow: 0 12px 25px rgba(18,38,63,.08); }
body[data-theme="light"] .detail-section--recommendations { background: linear-gradient(180deg,#eef4ff,#fff 120px) !important; }
body[data-theme="light"] .detail-section--recommendations > .section-head:first-child { background: #e3edff; border-bottom-color: #c8dafb; }
body[data-theme="light"] .detail-section--interaction { background: linear-gradient(180deg,#fff8e9,#fff 120px) !important; }
body[data-theme="light"] .detail-section--interaction > .section-head:first-child { background: #fff1d3; border-bottom-color: #f0d69e; }
body[data-theme="light"] .detail-section--purchases,
body[data-theme="light"] .detail-section--buyers { background: linear-gradient(180deg,#eefaf4,#fff 120px) !important; }
body[data-theme="light"] .detail-section--purchases > .section-head:first-child,
body[data-theme="light"] .detail-section--buyers > .section-head:first-child { background: #e2f6ec; border-bottom-color: #bfe6d1; }
body[data-theme="light"] .detail-section--history { background: linear-gradient(180deg,#f4f1ff,#fff 120px) !important; }
body[data-theme="light"] .detail-section--history > .section-head:first-child { background: #ece7ff; border-bottom-color: #d5ccfa; }

@media (max-width: 1420px) {
  .crm-filter-grid, .products-filter-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .buyer-filter-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .buyer-filter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .autocomplete-results { width: min(680px,calc(100vw - 40px)); }
}
@media (max-width: 650px) {
  .buyer-filter-grid, .branch-edit-editor { grid-template-columns: 1fr; }
  .branch-edit-editor .inline-edit-actions { grid-column: auto; }
  .autocomplete-results { width: 100%; max-width: 100%; }
}

/* HasyCRM 2.9 – product naming, compact tables and task contrast */
.product-name-link {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  color: var(--legacy-text) !important;
  font-weight: 750;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}
.product-name-link:hover { color: #8db5ff !important; text-decoration: underline; }
body[data-theme="light"] .product-name-link { color: #102d50 !important; }
body[data-theme="light"] .product-name-link:hover { color: #1f63b5 !important; }

.products-main-table th,
.products-main-table td { height: 38px; padding: 5px 8px !important; line-height: 1.25; }
.products-main-table thead th { height: 39px; }
.products-main-table .table-title { max-width: 310px; }
.products-main-table .product-row-actions { min-height: 27px; }
.products-main-table .open-button { min-height: 26px; padding: 4px 7px; }

.task-compact-row {
  grid-template-columns: 24px 9px minmax(150px,2fr) minmax(92px,.9fr) minmax(92px,.9fr) minmax(80px,.72fr) minmax(68px,.58fr) minmax(86px,.72fr);
  width: 100%;
  min-width: 0;
  overflow: hidden;
}
.task-compact-row > * { min-width: 0; }
.task-compact-row > .badge {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.task-status-badge { color: #dce8ff; border-color: rgba(90,144,255,.35); background: rgba(47,109,246,.20); }
.task-status-badge.in_progress { color: #ffd783; border-color: rgba(255,176,32,.42); background: rgba(255,176,32,.14); }
.task-status-badge.waiting { color: #d8ccff; border-color: rgba(155,124,255,.42); background: rgba(155,124,255,.15); }
.task-status-badge.done { color: #8df0ba; border-color: rgba(40,199,111,.40); background: rgba(40,199,111,.13); }
.task-status-badge.cancelled { color: #ff9fa4; border-color: rgba(239,77,87,.40); background: rgba(239,77,87,.13); }

body[data-theme="light"] .badge { color: #284965; border-color: #c4d5e3; background: #edf4f9; }
body[data-theme="light"] .badge.green { color: #087342; border-color: #a9dfc3; background: #e2f6ec; }
body[data-theme="light"] .badge.amber { color: #805000; border-color: #ebc87f; background: #fff0cf; }
body[data-theme="light"] .badge.red,
body[data-theme="light"] .badge.cancelled { color: #a52731; border-color: #efb3b8; background: #ffe8ea; }
body[data-theme="light"] .badge.blue,
body[data-theme="light"] .task-status-badge.open { color: #174f93; border-color: #a8c9f3; background: #dceaff; }
body[data-theme="light"] .task-status-badge.in_progress { color: #805000; border-color: #ebc87f; background: #fff0cf; }
body[data-theme="light"] .task-status-badge.waiting { color: #5b3e9d; border-color: #cfbff3; background: #eee7ff; }
body[data-theme="light"] .task-status-badge.done { color: #087342; border-color: #a9dfc3; background: #e2f6ec; }
body[data-theme="light"] .task-status-badge.cancelled { color: #a52731; border-color: #efb3b8; background: #ffe8ea; }
body[data-theme="light"] .task-compact-row,
body[data-theme="light"] .task-compact-title,
body[data-theme="light"] .task-person strong,
body[data-theme="light"] .task-due strong { color: #17304f; }
body[data-theme="light"] .task-compact-title small,
body[data-theme="light"] .task-person small,
body[data-theme="light"] .task-due small { color: #52677e; }

@media (max-width: 1050px) {
  .task-compact-row { grid-template-columns: 24px 9px minmax(180px,1fr) 100px 90px; }
}

/* HasyCRM 3.0 – old SalesScreen dashboard + AI sales command */
.legacy-sales-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.legacy-sales-kpi { min-width:0; min-height:92px; display:flex; align-items:center; gap:12px; padding:15px; overflow:hidden; }
.legacy-sales-kpi .kpi-icon { position:static; flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; color:#8fb6ff; background:rgba(47,109,246,.12); }
.legacy-sales-kpi .kpi-icon::after { display:none; }
.legacy-sales-kpi .kpi-icon svg { width:18px; height:18px; }
.legacy-sales-kpi > span:last-child { min-width:0; display:grid; gap:3px; flex:1; }
.legacy-sales-kpi small,.legacy-sales-kpi em { overflow:hidden; color:var(--legacy-muted); font-size:9px; font-style:normal; letter-spacing:.06em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.legacy-sales-kpi strong { overflow:hidden; font-size:17px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.legacy-sales-kpi progress { width:100%; height:6px; margin-top:4px; }
.legacy-ranking-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.legacy-ranking-grid .card { min-width:0; }
.legacy-ranking-grid .card-head { padding:12px 14px; }
.legacy-ranking-grid .card-body { padding:7px 12px 11px; }
.legacy-ranking-grid .leader-row { grid-template-columns:24px minmax(125px,1.4fr) minmax(58px,1fr) auto; min-height:38px; padding:5px 0; }
.legacy-ranking-grid .leader-value { min-width:75px; font-size:10px; text-align:right; }
.dashboard-command-grid,.dashboard-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.dashboard-command-grid > .card,.dashboard-detail-grid > .card { min-width:0; }
.dashboard-daily { max-height:355px; overflow:auto; padding:8px 12px 12px; }
.dashboard-missions { display:grid; gap:4px; padding:8px 13px 13px; }
.dashboard-mission { min-width:0; display:grid; grid-template-columns:minmax(160px,1fr) minmax(90px,.8fr) 42px; align-items:center; gap:10px; min-height:45px; padding:7px 4px; border-bottom:1px solid rgba(255,255,255,.07); color:inherit; text-decoration:none; }
.dashboard-mission span,.dashboard-mission strong,.dashboard-mission small { min-width:0; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-mission small { margin-top:3px; color:var(--legacy-muted); font-size:9px; }
.dashboard-mission progress { width:100%; }
.dashboard-mission b { text-align:right; }

.command-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(310px,.8fr); gap:12px; }
.command-panel { min-width:0; overflow:hidden; }
.daily-action-list { display:grid; padding:8px 12px 12px; }
.daily-action { min-width:0; display:grid; grid-template-columns:28px 82px minmax(160px,1fr) minmax(90px,auto); align-items:center; gap:9px; min-height:47px; padding:6px 3px; border-bottom:1px solid rgba(255,255,255,.07); color:inherit; text-decoration:none; }
.daily-action:hover { background:rgba(47,109,246,.07); }
.daily-rank { display:grid; place-items:center; width:24px; height:24px; border-radius:7px; color:#fff; background:#173c76; font-weight:800; }
.daily-type { overflow:hidden; color:#8db5ff; font-size:9px; font-weight:750; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.daily-copy,.daily-score { min-width:0; }
.daily-copy strong,.daily-copy small,.daily-score b,.daily-score small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.daily-copy small,.daily-score small { margin-top:2px; color:var(--legacy-muted); font-size:9px; }
.daily-score { text-align:right; }
.ai-brief-copy { min-height:180px; padding:15px; color:var(--legacy-text); font-size:11px; line-height:1.65; white-space:pre-wrap; }
.ai-brief-card > small { display:block; padding:0 15px 15px; }
.mission-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; }
.mission-progress-card { min-width:0; display:grid; gap:7px; padding:12px; color:inherit; text-decoration:none; }
.mission-progress-card:hover,.mission-progress-card.selected { border-color:#4c8dff; background:linear-gradient(180deg,rgba(47,109,246,.16),rgba(11,24,48,.94)); }
.mission-progress-card > strong,.mission-progress-card > small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mission-progress-card > small { color:var(--legacy-muted); }
.mission-card-head,.mission-card-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mission-progress-card progress { width:100%; }
.mission-workbench { padding:13px; overflow:visible; }
.mission-workbench h2 { margin:3px 0; }
.mission-target-scroll { max-height:570px; }
.mission-target-scroll .crm-table { font-size:11px; }
.target-coach-panel { margin-top:13px; padding:15px; border:1px solid #31b887; border-radius:13px; background:linear-gradient(180deg,rgba(40,199,111,.10),rgba(255,255,255,.025)); }
.target-coach-panel header { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.target-coach-panel h3 { margin:3px 0 0; }
.target-coach-panel p,.target-coach-panel li { line-height:1.55; }
.target-coach-panel ol { padding-left:20px; }
.coach-opening { padding:11px 12px; border-left:3px solid #31b887; background:rgba(40,199,111,.07); font-weight:700; }
.coach-facts { display:flex; gap:10px; margin:10px 0; }
.coach-facts > span { min-width:130px; padding:9px 11px; border:1px solid var(--legacy-line); border-radius:9px; }
.coach-facts small,.coach-facts strong { display:block; }
.coach-facts small { color:var(--legacy-muted); font-size:9px; }

.campaign-layout { display:grid; grid-template-columns:270px minmax(0,1fr); gap:12px; align-items:start; }
.campaign-target-filter-grid {
  position:relative; z-index:25; display:grid;
  grid-template-columns:minmax(260px,2fr) repeat(5,minmax(125px,1fr)) minmax(190px,1.2fr) auto;
  gap:9px; align-items:end; margin-bottom:12px; padding:12px; overflow:visible;
}
.campaign-target-filter-grid .field { min-width:0; }
.campaign-target-filter-grid input,.campaign-target-filter-grid .multi-select-trigger { min-width:0; min-height:36px; padding:7px 8px; font-size:11px; }
.campaign-target-filter-grid .filter-actions { align-self:end; flex-wrap:nowrap; }
.campaign-email-filter .check-line { min-height:36px; display:flex; align-items:center; gap:8px; padding:7px 9px; border:1px solid var(--legacy-line); border-radius:8px; background:#09172f; }
.campaign-email-filter .check-line input[type="hidden"] { display:none; }
.campaign-email-filter .check-line input[type="checkbox"] { width:15px; height:15px; min-height:15px; margin:0; padding:0; }
.campaign-email-filter .check-line b { min-width:0; overflow:hidden; color:var(--legacy-text); font-size:10px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.campaign-target-list .crm-list-scroll { max-height:620px; }
.campaign-target-list .card-link { color:var(--legacy-text); }
.campaign-management { scroll-margin-top:90px; }
.section-title-row { display:flex; justify-content:space-between; gap:14px; margin:0 0 10px; }
.section-title-row h2 { margin:0; font-size:18px; }
.section-title-row p { margin:3px 0 0; color:var(--legacy-muted); font-size:10px; }
.campaign-list { position:sticky; top:12px; min-width:0; overflow:hidden; }
.campaign-list-body { max-height:calc(100vh - 210px); overflow:auto; padding:6px; }
.campaign-list-item { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) 64px; align-items:center; gap:8px; min-height:58px; padding:8px 9px; border:1px solid transparent; border-radius:9px; color:inherit; text-decoration:none; }
.campaign-list-item:hover,.campaign-list-item.selected { border-color:#4c8dff; background:rgba(47,109,246,.10); }
.campaign-list-item span,.campaign-list-item strong,.campaign-list-item small { min-width:0; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.campaign-list-item small { margin-top:3px; color:var(--legacy-muted); font-size:9px; }
.campaign-list-item > span:last-child { text-align:right; }
.campaign-workspace { min-width:0; }
.campaign-summary { min-width:0; display:grid; grid-template-columns:minmax(230px,1fr) auto auto; align-items:center; gap:16px; padding:15px; }
.campaign-summary h2 { margin:3px 0; }
.campaign-summary p { margin:0; color:var(--legacy-muted); }
.campaign-kpis { display:flex; gap:8px; }
.campaign-kpis > span { min-width:105px; padding:9px; border:1px solid var(--legacy-line); border-radius:9px; }
.campaign-kpis strong,.campaign-kpis small { display:block; }
.campaign-kpis small { margin-top:3px; color:var(--legacy-muted); font-size:9px; }
.campaign-copy-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:12px; }
.campaign-copy-card { min-width:0; min-height:170px; padding:12px; border:1px solid var(--legacy-line); border-radius:11px; background:rgba(255,255,255,.025); }
.campaign-copy-card > strong { display:block; margin:9px 0; }
.campaign-copy-card p { max-height:180px; overflow:auto; color:var(--legacy-muted); line-height:1.55; white-space:pre-wrap; }
.campaign-recipients { padding:12px; }
.campaign-item-excluded { opacity:.62; }
.campaign-language-picks { display:flex; gap:20px; padding:12px; border:1px solid var(--legacy-line); border-radius:9px; }
.campaign-language-picks legend { padding:0 6px; color:var(--legacy-muted); }
.campaign-language-picks label { display:flex; align-items:center; gap:7px; }
.campaign-language-picks input { width:16px; height:16px; min-height:16px; }

.team-chat-layout { display:grid; grid-template-columns:260px minmax(420px,1fr) 210px; gap:12px; align-items:stretch; min-height:620px; }
.chat-channel-list,.chat-thread,.chat-member-list { min-width:0; overflow:hidden; }
.chat-channel-list > div,.chat-member-list > div { max-height:555px; overflow:auto; padding:7px; }
.chat-channel { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; min-height:52px; padding:8px 9px; border:1px solid transparent; border-radius:9px; color:inherit; text-decoration:none; }
.chat-channel:hover,.chat-channel.selected { border-color:#4c8dff; background:rgba(47,109,246,.11); }
.chat-channel span,.chat-channel strong,.chat-channel small { min-width:0; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-channel small { margin-top:3px; color:var(--legacy-muted); font-size:9px; }
.chat-channel > b { min-width:22px; padding:4px; border-radius:999px; color:#fff; background:#ef4d57; font-size:9px; text-align:center; }
.chat-thread { display:flex; flex-direction:column; }
.chat-messages { flex:1; min-height:470px; max-height:555px; overflow:auto; padding:14px; }
.chat-message { display:grid; grid-template-columns:30px minmax(0,1fr); gap:9px; max-width:82%; margin:0 0 11px; }
.chat-message.mine { margin-left:auto; }
.chat-message > span:last-child { min-width:0; padding:9px 11px; border:1px solid var(--legacy-line); border-radius:4px 12px 12px; background:rgba(255,255,255,.035); }
.chat-message.mine > span:last-child { border-radius:12px 4px 12px 12px; background:rgba(47,109,246,.12); }
.chat-message strong { display:flex; justify-content:space-between; gap:10px; font-size:10px; }
.chat-message strong small { color:var(--legacy-muted); font-size:8px; font-weight:500; }
.chat-message p { margin:5px 0 0; overflow-wrap:anywhere; line-height:1.5; white-space:pre-wrap; }
.chat-compose { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:10px; border-top:1px solid var(--legacy-line); }
.chat-compose textarea { min-height:54px; max-height:130px; resize:vertical; }
.chat-member { display:grid; grid-template-columns:30px minmax(0,1fr); grid-template-rows:auto auto; gap:0 8px; align-items:center; min-height:43px; padding:6px; }
.chat-member .avatar,.chat-member img { grid-row:1 / 3; }
.chat-member strong,.chat-member small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-member small { color:var(--legacy-muted); font-size:9px; }

/* Light is the default and mirrors the original HasyCRM light palette. */
body[data-theme="light"] { --legacy-primary:#0f6d88; --legacy-primary-2:#123f68; color:#13263f; background:linear-gradient(180deg,#edf2f6,#dfe7ee); }
body[data-theme="light"] .sidebar { background:#fff; }
body[data-theme="light"] .nav-item { color:#294764; }
body[data-theme="light"] .nav-item:hover { color:#123f68; border-color:#d7e2eb; background:#edf5f8; }
body[data-theme="light"] .nav-item.active { color:#0f5d79; border-color:#b9dbe4; background:#e3f1f5; }
body[data-theme="light"] .nav-item.active svg { color:#0f6d88; }
body[data-theme="light"] .button,body[data-theme="light"] button.button,body[data-theme="light"] .open-button { border-color:#0f6d88; color:#fff !important; background:linear-gradient(180deg,#0f7895,#0c627c); }
body[data-theme="light"] .button:hover,body[data-theme="light"] button.button:hover,body[data-theme="light"] .open-button:hover { border-color:#0b5269; color:#fff !important; background:linear-gradient(180deg,#116e88,#0a536b); box-shadow:0 4px 12px rgba(15,109,136,.18); }
body[data-theme="light"] .legacy-sales-kpi .kpi-icon { color:#0f6d88; background:#e2f2f5; }
body[data-theme="light"] .daily-action,body[data-theme="light"] .dashboard-mission { border-bottom-color:#e2e9ef; }
body[data-theme="light"] .daily-action:hover { background:#eef6f8; }
body[data-theme="light"] .daily-rank { background:#0f6d88; }
body[data-theme="light"] .daily-type { color:#0f6d88; }
body[data-theme="light"] .mission-progress-card:hover,body[data-theme="light"] .mission-progress-card.selected { border-color:#0f6d88; background:linear-gradient(180deg,#e7f4f7,#fff); }
body[data-theme="light"] .target-coach-panel { background:linear-gradient(180deg,#ebf8f2,#fff); }
body[data-theme="light"] .coach-opening { background:#e8f7ef; }
body[data-theme="light"] .campaign-list-item:hover,body[data-theme="light"] .campaign-list-item.selected { border-color:#0f6d88; background:#e7f4f7; }
body[data-theme="light"] .campaign-email-filter .check-line { border-color:#cad9e5; background:#fff; }
body[data-theme="light"] .campaign-email-filter .check-line b { color:#17304f; }
body[data-theme="light"] .campaign-target-list .card-link { color:#17304f; }
body[data-theme="light"] .campaign-copy-card { background:#f7fafc; }
body[data-theme="light"] .chat-channel:hover,body[data-theme="light"] .chat-channel.selected { border-color:#0f6d88; background:#e7f4f7; }
body[data-theme="light"] .chat-message > span:last-child { background:#f7fafc; }
body[data-theme="light"] .chat-message.mine > span:last-child { background:#e7f4f7; }
body[data-theme="light"] .dashboard-mission { border-bottom-color:#e2e9ef; }

@media (max-width:1400px) {
  .legacy-sales-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .campaign-summary { grid-template-columns:1fr; }
  .campaign-kpis { flex-wrap:wrap; }
}
@media (max-width:1120px) {
  .legacy-ranking-grid { grid-template-columns:1fr; }
  .command-grid,.dashboard-command-grid,.dashboard-detail-grid { grid-template-columns:1fr; }
  .campaign-layout { grid-template-columns:1fr; }
  .campaign-list { position:static; }
  .campaign-list-body { max-height:250px; }
  .campaign-copy-grid { grid-template-columns:1fr; }
  .team-chat-layout { grid-template-columns:220px minmax(0,1fr); }
  .chat-member-list { display:none; }
}
@media (max-width:1700px) {
  .campaign-target-filter-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .campaign-target-filter-grid .filter-actions { grid-column:1 / -1; }
}
@media (max-width:900px) {
  .campaign-target-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
  .campaign-target-filter-grid { grid-template-columns:1fr; }
}
@media (max-width:650px) {
  .legacy-sales-kpis { grid-template-columns:1fr; }
  .daily-action { grid-template-columns:26px minmax(0,1fr) 78px; }
  .daily-type { display:none; }
  .campaign-kpis { display:grid; grid-template-columns:1fr; }
  .team-chat-layout { grid-template-columns:1fr; }
  .chat-channel-list > div { max-height:180px; }
}