:root {
  --bg: #080a0f;
  --bg-soft: #0d1018;
  --panel: #111520;
  --panel-2: #161b28;
  --panel-3: #1c2231;
  --border: rgba(255,255,255,.075);
  --border-strong: rgba(255,255,255,.13);
  --text: #f5f5f8;
  --muted: #858b9c;
  --muted-2: #5e6577;
  --purple: #a855f7;
  --purple-2: #7c3aed;
  --pink: #ec4899;
  --cyan: #22d3ee;
  --blue: #3b82f6;
  --green: #2dd4a7;
  --yellow: #fbbf24;
  --red: #fb7185;
  --sidebar: 248px;
  --shadow: 0 24px 60px rgba(0,0,0,.28);
}

/* Marketplace light theme — 2026 refresh */
:root {
  --bg: #eef1f7;
  --bg-soft: #f7f8fc;
  --panel: #ffffff;
  --panel-2: #f8f9fc;
  --panel-3: #eef1f7;
  --border: rgba(51, 43, 95, 0.1);
  --border-strong: rgba(78, 62, 153, 0.22);
  --text: #1d1933;
  --muted: #74798b;
  --muted-2: #a0a6b6;
  --purple: #7658e6;
  --purple-2: #4c369f;
  --pink: #ef6a91;
  --cyan: #35b9c8;
  --blue: #4d8af0;
  --green: #1ca47a;
  --yellow: #f2b544;
  --red: #df5e73;
  --shadow: 0 18px 50px rgba(49, 43, 82, 0.1);
}

body {
  color: var(--text);
  background: linear-gradient(135deg, #f8f9fc 0%, #eef2f8 62%, #f8f2ff 100%);
}

.ambient { display: none; }

.sidebar {
  background: linear-gradient(180deg, #352779 0%, #292064 55%, #21194f 100%);
  border-right: 0;
  box-shadow: 12px 0 38px rgba(42, 31, 101, 0.16);
}

.brand strong,
.sidebar .nav-item,
.sidebar .workspace strong { color: #fff; }
.brand span,
.sidebar .nav p,
.sidebar .workspace span { color: #c9c2f5; }
.sidebar .workspace,
.sidebar .upgrade-card {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.14);
}
.sidebar .nav-item { color: #dcd8f7; }
.sidebar .nav-item:hover { background: rgba(255, 255, 255, 0.09); color: #fff; }
.sidebar .nav-item.active {
  background: #fff;
  color: #5b42c4;
  box-shadow: 0 12px 30px rgba(15, 10, 48, 0.22);
}

.topbar {
  background: rgba(255, 255, 255, 0.92);
  border-bottom-color: var(--border);
  box-shadow: 0 8px 28px rgba(48, 43, 76, 0.06);
  backdrop-filter: blur(18px);
}
.topbar-title strong,
.profile strong { color: var(--text); }
.search,
.icon-button,
.period-select,
.period-button {
  background: #fff;
  border-color: var(--border);
  color: var(--text);
}
.search input { color: var(--text); }
.profile-avatar { background: linear-gradient(135deg, #ffad4d, #f66f70); }
.period-button.active { background: #eee9ff; color: #5b42c4; }

.card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.source-chip,
.storefront-logo-upload,
.summary-card,
.metric-card {
  background: #fff !important;
  border-color: var(--border) !important;
  box-shadow: var(--shadow);
}

.card h1,
.card h2,
.card h3,
.card strong,
.metric-card strong,
.summary-card strong,
.category-compact-card strong,
.channel-item-card strong,
.ranking-offer-card strong { color: var(--text); }

.strategy-tabs {
  background: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(16px);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  background: #f7f8fc !important;
  color: var(--text) !important;
  border-color: #dfe3ed !important;
}
input::placeholder,
textarea::placeholder { color: #a0a6b6; }

button:not(.primary):not(.danger),
.button:not(.primary):not(.danger) {
  color: var(--text);
  border-color: var(--border-strong);
}

table thead th { color: #808698; }
table tbody tr { border-color: #edf0f5; }
table tbody tr:hover { background: #faf9ff; }

.modal { background: #fff; color: var(--text); border-color: var(--border); }
.modal-actions { background: rgba(255, 255, 255, 0.96); border-color: var(--border); }
.highlight-row,
.choice-pill,
.category-picker label { background: #f7f5ff !important; border-color: #ddd5ff !important; }
.choice-pill.selected,
.category-picker label:has(input:checked) { background: #eee9ff !important; border-color: #9279ef !important; }

.storefront-mini-preview,
.storefront-preview-card { background: #f5f7fb !important; }
.storefront-mini-preview article,
.storefront-preview-card article { background: #fff !important; color: var(--text); }
.funnel-bar { background: #e9edf5; }
.donut::after { background: #fff; color: var(--text); }

@media (max-width: 860px) {
  .sidebar { box-shadow: none; }
  .topbar { background: #fff; }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  background:
    radial-gradient(circle at 70% 0%, rgba(124,58,237,.08), transparent 30%),
    var(--bg);
  font: 14px/1.45 "DM Sans", sans-serif;
}
button, input, select { font: inherit; }
button { color: inherit; }
.ambient { position: fixed; pointer-events: none; filter: blur(80px); opacity: .2; z-index: -1; }
.ambient-a { width: 420px; height: 420px; border-radius: 50%; background: #7c3aed; top: -250px; right: 15%; }
.ambient-b { width: 280px; height: 280px; border-radius: 50%; background: #0891b2; bottom: -160px; left: 12%; opacity: .1; }

.sidebar {
  position: fixed; inset: 0 auto 0 0; width: var(--sidebar);
  padding: 23px 16px 18px; display: flex; flex-direction: column;
  background: rgba(10,12,18,.94); border-right: 1px solid var(--border);
  backdrop-filter: blur(24px); z-index: 20; overflow-y: auto;
}
.brand { display: flex; gap: 11px; align-items: center; padding: 0 8px 22px; }
.brand-mark {
  display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px;
  font: 800 21px "Manrope"; background: linear-gradient(145deg, var(--purple), var(--pink));
  box-shadow: 0 10px 30px rgba(168,85,247,.32);
}
.brand-mark.brand-logo {
  width: 58px;
  height: 58px;
  padding: 2px;
  overflow: hidden;
  flex: 0 0 58px;
  background: #ff6a00;
  border: 1px solid rgba(255, 160, 36, .72);
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(255, 106, 0, .3);
}
.brand-mark.brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.brand strong, .brand span { display: block; }
.brand strong { font: 800 17px "Manrope"; letter-spacing: -.4px; }
.brand span { color: var(--muted); font-size: 11px; margin-top: -2px; }
.workspace {
  display: grid; grid-template-columns: 34px 1fr auto; gap: 9px; align-items: center;
  padding: 10px; margin-bottom: 15px; background: var(--panel); border: 1px solid var(--border);
  border-radius: 13px;
}
.workspace-avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: #23293a; color: #d8ccff; font-size: 11px; font-weight: 700; }
.workspace strong, .workspace span { display: block; }
.workspace strong { font-size: 12px; }
.workspace span { color: var(--muted); font-size: 10px; }
.workspace button { border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.nav p { color: #4f5667; font-size: 9px; letter-spacing: 1.5px; margin: 18px 12px 7px; font-weight: 700; }
.nav-item {
  width: 100%; height: 37px; display: flex; gap: 11px; align-items: center;
  padding: 0 11px; margin: 2px 0; border: 0; border-radius: 10px;
  background: transparent; color: #8d93a5; cursor: pointer; text-align: left;
  font-size: 12px; transition: .2s ease;
}
.nav-item span { width: 18px; text-align: center; color: #697084; font-size: 15px; }
.nav-item:hover { background: rgba(255,255,255,.035); color: #fff; }
.nav-item.active { color: #fff; background: linear-gradient(90deg, rgba(168,85,247,.2), rgba(168,85,247,.04)); box-shadow: inset 2px 0 var(--purple); }
.nav-item.active span { color: #c084fc; }
.sidebar-bottom { margin-top: auto; padding-top: 20px; }
.upgrade-card {
  margin-top: 15px; padding: 14px; border: 1px solid rgba(168,85,247,.2);
  border-radius: 14px; background: linear-gradient(145deg, rgba(168,85,247,.14), rgba(236,72,153,.05));
}
.upgrade-card .eyebrow { color: #c084fc; font-size: 9px; letter-spacing: 1.2px; }
.upgrade-card strong { display: block; font-size: 12px; margin: 5px 0 11px; }
.upgrade-card button { border: 0; background: transparent; color: #d8b4fe; padding: 0; cursor: pointer; font-size: 11px; }

.main { margin-left: var(--sidebar); min-height: 100vh; }
.topbar {
  position: sticky; top: 0; z-index: 15; height: 72px; padding: 0 30px;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(8,10,15,.78); border-bottom: 1px solid var(--border); backdrop-filter: blur(20px);
}
.breadcrumb span, .breadcrumb strong { display: block; }
.breadcrumb span { color: var(--muted-2); font-size: 10px; }
.breadcrumb strong { font: 700 14px "Manrope"; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.search { width: min(320px, 30vw); height: 38px; border: 1px solid var(--border); border-radius: 11px; background: var(--panel); display: flex; align-items: center; gap: 8px; padding: 0 10px; color: var(--muted); }
.search input { flex: 1; min-width: 0; border: 0; outline: 0; color: #ddd; background: transparent; font-size: 11px; }
.search kbd { border: 1px solid var(--border); border-radius: 5px; padding: 2px 5px; font-size: 9px; color: var(--muted-2); }
.icon-button { position: relative; width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 11px; background: var(--panel); cursor: pointer; }
.icon-button i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--pink); top: 8px; right: 8px; border: 2px solid var(--panel); }
.profile-button { border: 0; background: transparent; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 0 3px; }
.profile-avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(145deg,#2dd4a7,#0f766e); font-size: 10px; font-weight: 800; }
.profile-button strong, .profile-button small { display: block; text-align: left; }
.profile-button strong { font-size: 11px; }
.profile-button small { font-size: 9px; color: var(--muted); }
.profile-button b { color: var(--muted); font-size: 11px; }
.menu-toggle { display: none; border: 0; background: transparent; font-size: 20px; }

.page-shell { max-width: 1600px; margin: 0 auto; padding: 29px 30px 60px; animation: pageIn .35s ease; }
@keyframes pageIn { from { opacity: 0; transform: translateY(5px); } }
.page-head { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; margin-bottom: 23px; }
.page-head h1 { margin: 0 0 5px; font: 800 clamp(23px,2vw,30px) "Manrope"; letter-spacing: -.8px; }
.page-head p { margin: 0; color: var(--muted); font-size: 12px; }
.head-actions { display: flex; gap: 8px; align-items: center; }
.button, .period-button {
  display:inline-flex; align-items:center; justify-content:center;
  min-height: 36px; border: 1px solid var(--border); border-radius: 10px; padding: 0 13px;
  background: var(--panel); cursor: pointer; font-size: 11px; font-weight: 600; color: #f8fafc;
  text-decoration:none;
}
.button:hover, .period-button:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.button.primary { border-color: transparent; background: linear-gradient(135deg,var(--purple-2),var(--purple)); box-shadow: 0 9px 25px rgba(124,58,237,.22); color: #fff; font-weight: 800; text-shadow: 0 1px 0 rgba(0,0,0,.16); }
.button.soft { color: #d8b4fe; background: rgba(168,85,247,.08); border-color: rgba(168,85,247,.18); }
.period-select { display: flex; padding: 3px; border-radius: 11px; background: var(--panel); border: 1px solid var(--border); }
.period-button { min-height: 29px; border: 0; color: var(--muted); background: transparent; padding: 0 10px; }
.period-button.active { color: #fff; background: var(--panel-3); }

.grid { display: grid; gap: 14px; }
.kpi-grid { grid-template-columns: repeat(6, minmax(130px,1fr)); margin-bottom: 14px; }
.grid-12 { grid-template-columns: repeat(12,1fr); }
.span-12 { grid-column: span 12; }
.span-8 { grid-column: span 8; } .span-7 { grid-column: span 7; } .span-6 { grid-column: span 6; }
.span-5 { grid-column: span 5; } .span-4 { grid-column: span 4; } .span-3 { grid-column: span 3; }
.card {
  position: relative; overflow: hidden; background: linear-gradient(155deg,rgba(20,25,37,.98),rgba(14,18,27,.98));
  border: 1px solid var(--border); border-radius: 15px; padding: 17px; box-shadow: 0 16px 42px rgba(0,0,0,.12);
}
.card.clickable { cursor: pointer; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.card.clickable:hover { border-color: rgba(168,85,247,.45); transform: translateY(-1px); }
.card.selected { border-color: rgba(168,85,247,.72); box-shadow: 0 16px 46px rgba(124,58,237,.18); }
.category-compact-card {
  min-height: 68px; width: 100%; padding: 13px 15px; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  color: var(--text); text-align: left; font: inherit; cursor: pointer; border: 1px solid var(--border); border-radius: 14px;
  background: linear-gradient(155deg,rgba(20,25,37,.98),rgba(14,18,27,.98)); transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.category-compact-card:hover { border-color: rgba(168,85,247,.48); transform: translateY(-1px); }
.category-compact-card.selected { border-color: rgba(168,85,247,.78); background: linear-gradient(145deg,rgba(83,35,125,.3),rgba(16,20,30,.98)); }
.category-compact-main, .category-compact-main strong, .category-compact-main small { display: block; }
.category-compact-main strong { font: 700 12px "Manrope"; }
.category-compact-main small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.category-compact-status { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.category-chevron { color: #c084fc; font-size: 16px; line-height: 1; }
.strategy-tabs { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 14px; padding:10px; border:1px solid var(--border); border-radius:14px; background:rgba(14,18,27,.82); position:sticky; top:72px; z-index:5; backdrop-filter:blur(14px); }
.strategy-preview-card { align-self:start; position:sticky; top:142px; }
.message-phone-preview { max-width:420px; margin:auto; padding:16px; border-radius:20px; background:#efeae2; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); }
.message-phone-preview > img { display:block; width:100%; max-height:280px; object-fit:contain; border-radius:12px 12px 0 0; background:#fff; }
.message-product-placeholder { min-height:220px; display:grid; place-items:center; align-content:center; gap:8px; border-radius:12px 12px 0 0; background:#fff; color:#6b7280; font-size:44px; }
.message-product-placeholder span { font-size:11px; }
.message-bubble-preview { padding:14px; border-radius:0 0 12px 12px; background:#d9fdd3; color:#17211b; font-size:12px; line-height:1.55; white-space:normal; box-shadow:0 4px 18px rgba(0,0,0,.1); }
.message-phone-preview > small { display:block; margin-top:12px; color:#66746b; font-size:9px; line-height:1.4; }
.approval-offer-list { display:grid; gap:10px; }
.approval-offer-card { display:grid; grid-template-columns:82px 1fr; gap:12px; padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(12,16,25,.72); }
.approval-offer-card > img,.approval-image-placeholder { width:82px; height:82px; border-radius:10px; object-fit:contain; background:#fff; }
.approval-image-placeholder { display:grid; place-items:center; font-size:28px; }
.approval-offer-copy { min-width:0; }
.approval-offer-copy > strong { display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:10px; line-height:1.35; }
.approval-offer-copy > small { display:block; margin:4px 0 8px; color:var(--muted); font-size:8px; }
.approval-offer-metrics { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.approval-offer-metrics b { font-size:11px; }
.empty-approval-state { min-height:220px; display:grid; place-items:center; align-content:center; gap:7px; color:var(--muted); text-align:center; }
.empty-approval-state b { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:rgba(16,185,129,.14); color:var(--green); font-size:20px; }
.empty-approval-state strong { color:var(--text); }
.agenda-filter-actions { margin-bottom:12px; }
.channel-summary-grid { grid-template-columns:repeat(3,1fr); }
.channel-item-list { display:grid; gap:9px; }
.channel-item-card { display:grid; grid-template-columns:38px minmax(0,1fr) auto auto; align-items:center; gap:11px; padding:11px 12px; border:1px solid var(--border); border-radius:12px; background:rgba(12,16,25,.72); }
.channel-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:rgba(168,85,247,.13); color:#c084fc; font-size:17px; }
.channel-item-card strong,.channel-item-card small { display:block; }
.channel-item-card strong { font-size:10px; }
.channel-item-card small { margin-top:3px; color:var(--muted); font-size:8px; overflow-wrap:anywhere; }
.channel-empty { padding:24px; border:1px dashed var(--border); border-radius:12px; color:var(--muted); text-align:center; font-size:10px; }
.channel-form-card { margin-top:14px; border-color:rgba(168,85,247,.55); scroll-margin-top:150px; }
.storefront-mini-preview { max-width:360px; margin:auto; overflow:hidden; border:1px solid var(--border); border-radius:16px; background:#090b12; }
.storefront-mini-preview header { display:grid; gap:4px; padding:18px; background:linear-gradient(135deg,var(--preview-accent),#171522); }
.storefront-mini-preview header img { width:40px; height:40px; margin-bottom:5px; object-fit:contain; border-radius:9px; background:#fff; }
.storefront-mini-preview header strong { font-size:14px; }
.storefront-mini-preview header small { color:rgba(255,255,255,.78); font-size:8px; }
.storefront-mini-preview article { display:grid; gap:8px; margin:14px; padding:10px; border:1px solid var(--border); border-radius:12px; background:#151925; }
.storefront-mini-preview article > img,.storefront-preview-placeholder { width:100%; aspect-ratio:16/10; object-fit:contain; border-radius:9px; background:#fff; }
.storefront-preview-placeholder { display:grid; place-items:center; font-size:38px; }
.storefront-mini-preview article small { color:var(--muted); font-size:7px; }
.storefront-mini-preview article b { font-size:9px; line-height:1.35; }
.storefront-mini-preview article strong { font-size:15px; }
.storefront-mini-preview article span { padding:9px; border-radius:8px; background:var(--preview-button,var(--preview-accent)); text-align:center; font-size:9px; font-weight:800; }
.ranking-summary-grid { grid-template-columns:repeat(3,1fr); }
.ranking-kpi-caption { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.ranking-filters { margin-bottom:14px; }
.ranking-offer-list { display:grid; gap:9px; }
.ranking-offer-card { display:grid; grid-template-columns:34px 70px minmax(220px,1fr) 58px minmax(210px,auto); align-items:center; gap:11px; padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(12,16,25,.72); }
.ranking-position { color:#c084fc; font-size:11px; font-weight:800; text-align:center; }
.ranking-offer-card > img,.ranking-image-placeholder { width:70px; height:70px; border-radius:9px; object-fit:contain; background:#fff; }
.ranking-image-placeholder { display:grid; place-items:center; font-size:24px; }
.ranking-offer-main { min-width:0; }
.ranking-offer-main > strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
.ranking-offer-main > small { display:block; margin:4px 0 7px; color:var(--muted); font-size:8px; }
.ranking-signals { display:flex; gap:5px; flex-wrap:wrap; }
.ranking-signals span { padding:4px 6px; border-radius:6px; background:rgba(168,85,247,.1); color:#d8b4fe; font-size:7px; }
.ranking-score { text-align:center; }
.ranking-score b,.ranking-score small { display:block; }
.ranking-score b { color:var(--green); font-size:20px; }
.ranking-score small { color:var(--muted); font-size:7px; }
.ranking-numbers { display:grid; grid-template-columns:repeat(2,minmax(80px,1fr)); gap:6px 12px; color:var(--muted); font-size:8px; }
.ranking-numbers b { color:var(--text); }
.category-detail-card { scroll-margin-top: 92px; border-color: rgba(168,85,247,.6); box-shadow: 0 18px 52px rgba(124,58,237,.15); }
.category-detail-content .stat-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
.category-detail-content .stat-row:first-child { grid-column: 1 / -1; }
.card.glow:after { content:""; position:absolute; width:140px; height:140px; border-radius:50%; filter:blur(45px); opacity:.1; background:var(--purple); right:-70px; top:-70px; }
.card-head { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-bottom: 17px; }
.card-head h2 { margin: 0; font: 700 13px "Manrope"; }
.card-head p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.card-head button:not(.button) { border: 0; color: var(--muted); background: transparent; cursor: pointer; }
.kpi { min-height: 115px; }
.kpi-label { color: var(--muted); font-size: 10px; display: flex; justify-content: space-between; }
.kpi-label i { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; font-style: normal; background: rgba(168,85,247,.09); color: #c084fc; }
.kpi-value { margin: 10px 0 9px; font: 800 22px "Manrope"; letter-spacing: -.7px; }
.kpi-value-text { font-size: clamp(16px, 1.5vw, 22px); line-height: 1.15; overflow-wrap: anywhere; }
.trend { color: var(--green); font-size: 9px; }
.trend.down { color: var(--red); }
.trend.neutral { color: var(--muted); }
.micro-bars { position: absolute; inset: auto 16px 13px auto; width: 58px; height: 24px; display: flex; gap: 3px; align-items: flex-end; opacity: .65; }
.micro-bars i { flex:1; min-height: 4px; border-radius: 3px 3px 0 0; background: linear-gradient(var(--purple),transparent); }

.chart-wrap { height: 245px; }
.chart-svg { width: 100%; height: 100%; overflow: visible; }
.chart-grid line { stroke: rgba(255,255,255,.055); stroke-width: 1; }
.chart-line { fill: none; stroke: url(#lineGradient); stroke-width: 3; stroke-linecap: round; filter: drop-shadow(0 8px 10px rgba(168,85,247,.18)); }
.chart-line.secondary { stroke: var(--cyan); stroke-width: 2; opacity: .55; }
.chart-area { fill: url(#areaGradient); }
.chart-dot { fill: var(--purple); stroke: #fff; stroke-width: 2; }
.chart-labels { display: flex; justify-content: space-between; color: var(--muted-2); font-size: 9px; margin: -12px 5px 0; }
.legend { display: flex; gap: 13px; color: var(--muted); font-size: 9px; }
.legend span:before { content:""; display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--purple); margin-right:5px; }
.legend span:last-child:before { background: var(--cyan); }

.funnel-row { display:grid; grid-template-columns: 150px 1fr 72px 65px; gap:12px; align-items:center; margin:12px 0; font-size:10px; }
.funnel-row b { font-size:11px; }
.funnel-bar { height:8px; border-radius:10px; background:#202637; overflow:hidden; }
.funnel-bar i { display:block; height:100%; border-radius:10px; background:linear-gradient(90deg,var(--purple-2),var(--pink)); }
.funnel-row small { color: var(--muted); text-align:right; }
.funnel-explanation { margin: 20px 0 0; padding: 12px 14px; border-radius: 11px; background: rgba(121,86,216,.08); color: var(--muted); font-size: 11px; line-height: 1.55; }
.funnel-diagnostics { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 11px; }
.funnel-diagnostic { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 10px; align-items: start; padding: 13px; border: 1px solid var(--border); border-radius: 12px; background: rgba(121,86,216,.04); }
.funnel-diagnostic > i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; color: #7956d8; background: rgba(121,86,216,.12); font-size: 18px; }
.funnel-diagnostic strong,.funnel-diagnostic span { display: block; }
.funnel-diagnostic strong { color: var(--text); font-size: 11px; }
.funnel-diagnostic span { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.funnel-diagnostic.warning > i { color: #d97706; background: rgba(245,158,11,.13); }
.funnel-diagnostic.success > i { color: #14866b; background: rgba(40,167,133,.13); }

.donut-wrap { display:flex; align-items:center; justify-content:center; gap:22px; min-height:210px; }
.donut { width:136px; height:136px; border-radius:50%; background:conic-gradient(var(--purple) 0 34%, var(--cyan) 34% 57%, var(--pink) 57% 76%, var(--blue) 76% 90%, #303648 90%); display:grid; place-items:center; box-shadow:inset 0 0 35px rgba(0,0,0,.25); }
.donut:after { content:"11.780\\A acessos"; white-space:pre; text-align:center; display:grid; place-items:center; width:86px; height:86px; border-radius:50%; background:var(--panel); font:700 12px "Manrope"; color:#fff; }
.donut-legend { display:grid; gap:10px; font-size:10px; }
.donut-legend div { display:flex; align-items:center; justify-content:space-between; min-width:130px; gap:15px; }
.donut-legend span { color:var(--muted); }
.donut-legend i { width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:6px; }

.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th { padding:10px 10px; color:var(--muted-2); font-size:9px; text-align:left; font-weight:600; border-bottom:1px solid var(--border); }
td { padding:13px 10px; border-bottom:1px solid rgba(255,255,255,.045); font-size:10px; white-space:nowrap; }
.commission-table th:first-child { min-width:260px; }
.commission-order-cell { white-space:normal; }
.commission-order-cell > div { display:grid; gap:5px; min-width:240px; max-width:430px; }
.commission-order-cell b { color:#f7f8fc; font-size:10px; line-height:1.3; }
.commission-order-cell small { display:block; color:var(--muted); font-size:9px; line-height:1.45; overflow-wrap:anywhere; }
.commission-pagination { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:16px; padding-top:14px; border-top:1px solid var(--border); }
.commission-pagination p { margin:0; color:var(--muted); font-size:9px; }
.commission-explainer { margin-bottom:14px; border-color:#dcd5f4 !important; background:linear-gradient(135deg,#fff 0%,#f8f6ff 100%) !important; }
.commission-explainer .card-head .button { display:inline-flex; align-items:center; gap:6px; }
.commission-flow { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; margin-top:16px; }
.commission-flow-step { position:relative; display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:8px; min-width:0; padding:12px; border:1px solid #e2def0; border-radius:13px; background:#fff; }
.commission-flow-step > span { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#6d50d5; color:#fff; font-size:8px; font-weight:800; }
.commission-flow-step > i { color:#6d50d5; font-size:19px; }
.commission-flow-step > div { min-width:0; display:flex; flex-direction:column; gap:2px; }
.commission-flow-step strong { color:#27203f; font-size:10px; }
.commission-flow-step small { color:#767b8a; font-size:8px; }
.commission-origin-note { display:flex; align-items:flex-start; gap:7px; margin:12px 0 0; padding:11px 13px; border-radius:11px; background:#f0ecff; color:#5f5777; font-size:9px; line-height:1.45; }
.commission-origin-note .material-symbols-rounded { color:#6d50d5; font-size:17px; }
.commission-origin-note b { flex:0 0 auto; color:#3a2e68; }
.commission-quick-actions { display:flex; align-items:center; gap:8px; margin:0 0 14px; }
.commission-quick-actions > span { color:#73798a; font-size:9px; font-weight:700; }
.commission-quick-actions .button { min-height:34px; padding:0 12px; }
.commission-source { display:flex; flex-direction:column; gap:2px; }
.commission-source b { color:#29233f; font-size:9px; }
.commission-source small { color:#7b8090; font-size:8px; }
.awin-finance-card { margin:14px 0; border-color:#ffd3bc !important; background:linear-gradient(135deg,#fff 0%,#fff7f1 100%) !important; }
.awin-finance-status { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; gap:10px; align-items:stretch; margin-top:16px; }
.awin-finance-status > div { display:flex; flex-direction:column; justify-content:center; gap:3px; padding:12px 14px; border:1px solid #eadff7; border-radius:12px; background:#fff; }
.awin-finance-status strong { color:#27203f; font-size:16px; }
.awin-finance-status small { color:#777d8d; font-size:8px; }
.awin-finance-status .button { align-self:stretch; }
.button:disabled { opacity:.42; cursor:not-allowed; transform:none; }
tr:last-child td { border-bottom:0; }
tbody tr:hover { background:rgba(255,255,255,.018); }
.cell-main { display:flex; align-items:center; gap:9px; }
.cell-main strong, .cell-main small { display:block; }
.cell-main strong { font-size:10px; }
.cell-main small { color:var(--muted); font-size:8px; margin-top:2px; }
.mini-logo { display:grid; place-items:center; width:29px; height:29px; border-radius:8px; font-size:10px; font-weight:800; color:#fff; background:#2a3040; }
.tag { display:inline-flex; align-items:center; min-height:21px; padding:0 8px; border-radius:20px; color:#b5bac8; background:#232938; border:1px solid transparent; font-size:8px; }
.tag.success { color:#7ce8c9; background:rgba(45,212,167,.1); border-color:rgba(45,212,167,.2); }
.tag.warning, .tag.pending { color:#ffd27a; background:rgba(245,158,11,.16); border-color:rgba(245,158,11,.28); }
.tag.network { color:#a9c7ff; background:rgba(59,130,246,.13); border-color:rgba(59,130,246,.24); }
.tag.available { color:#c7cfdf; background:rgba(148,163,184,.12); border-color:rgba(148,163,184,.16); }
.tag.manual { color:#fca5a5; background:rgba(248,113,113,.12); border-color:rgba(248,113,113,.24); }
.tag.danger { color:#ff9aac; background:rgba(251,113,133,.1); border-color:rgba(251,113,133,.2); }
.tag.purple { color:#d5b2ff; background:rgba(168,85,247,.11); border-color:rgba(168,85,247,.2); }
.progress { width:100%; height:5px; border-radius:8px; background:#272d3c; overflow:hidden; }
.progress i { display:block; height:100%; border-radius:8px; background:linear-gradient(90deg,var(--purple-2),var(--purple)); }

.insight { padding:14px; display:flex; gap:11px; border-radius:12px; background:rgba(168,85,247,.07); border:1px solid rgba(168,85,247,.14); }
.insight-icon { flex:0 0 auto; display:grid; place-items:center; width:31px; height:31px; border-radius:9px; background:linear-gradient(145deg,var(--purple-2),var(--pink)); box-shadow:0 8px 22px rgba(168,85,247,.25); }
.insight strong { font-size:10px; display:block; margin-bottom:3px; }
.insight p { color:var(--muted); margin:0; font-size:9px; }
.insight button { border:0; background:transparent; color:#c084fc; font-size:9px; padding:7px 0 0; cursor:pointer; }

.store-section { margin-bottom:16px; }
.store-catalog-intro { margin:30px 0 18px; }
.store-section.muted-section { padding:14px; border:1px dashed rgba(148,163,184,.18); border-radius:16px; background:rgba(15,23,42,.22); }
.store-section.muted-section .store-section-head { margin-bottom:0; }
.store-section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin:0 0 10px; }
.store-section-head h2 { margin:0 0 4px; font:800 14px "Manrope"; }
.store-section-head p { margin:0; color:var(--muted); font-size:9px; }
.store-grid { display:grid; grid-template-columns:repeat(4,minmax(190px,1fr)); gap:13px; }
.shopee-special-card { border:1px solid rgba(238,77,45,.38)!important; background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,244,240,.96))!important; }
.shopee-special-brand { display:flex; align-items:center; gap:13px; margin-bottom:14px; }
.shopee-special-brand h3 { margin:0 0 4px; font-size:17px; }
.shopee-special-brand p { margin:0; color:var(--muted); }
.shopee-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:14px; }
.shopee-mode-card { display:flex; gap:11px; padding:14px; border:1px solid rgba(100,116,139,.3); border-radius:14px; background:#fff; }
.shopee-mode-card>span { display:grid; place-items:center; flex:0 0 34px; height:34px; border-radius:10px; background:#ee4d2d; color:#fff; font-weight:800; }
.shopee-mode-card strong { display:block; color:#17132f; font-size:13px; }
.shopee-mode-card p { margin:4px 0 0; color:#5f6578; font-size:10px; line-height:1.45; }
.shopee-link-tool { margin-top:14px; padding:14px; border:1px solid rgba(238,77,45,.3); border-radius:14px; background:#fff8f5; }
.shopee-link-tool h3 { margin:0 0 4px; }
.shopee-import-preview { display:flex; gap:12px; align-items:center; margin-top:12px; }
.shopee-import-preview img { width:72px; height:72px; object-fit:cover; border-radius:12px; border:1px solid rgba(100,116,139,.3); }
.store-card { min-height:190px; display:flex; flex-direction:column; }
.store-legend { display:flex; flex-wrap:wrap; gap:9px 14px; margin-top:13px; color:var(--muted); font-size:8px; }
.store-legend p { display:inline-flex; align-items:center; gap:6px; margin:0; }
.store-top { display:flex; justify-content:space-between; align-items:flex-start; }
.store-logo { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; overflow:hidden; background:#fff; color:#111; font:800 13px "Manrope"; box-shadow:0 10px 25px rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.12); }
.store-logo img { width:28px; height:28px; object-fit:contain; }
.store-logo b { display:none; }
.store-logo.failed { background:linear-gradient(145deg,var(--purple-2),var(--pink)); color:#fff; }
.store-logo.failed img { display:none; }
.store-logo.failed b, .store-logo-fallback b { display:block; }
.store-logo-fallback { background:linear-gradient(145deg,var(--purple-2),var(--pink)); color:#fff; }
.store-card h3 { margin:13px 0 3px; font:700 12px "Manrope"; }
.store-card p { margin:0 0 14px; color:var(--muted); font-size:9px; }
.store-guide { display:block; color:#9aa3b7; font-size:8px; line-height:1.35; margin:-6px 0 12px; }
.store-actions { margin-top:auto; display:flex; gap:7px; flex-wrap:wrap; }
.store-actions button, .store-action-link { flex:1 1 90px; min-width:0; height:31px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; border:1px solid var(--border); background:#1b2130; color:#f8fafc; cursor:pointer; font-size:9px; font-weight:600; text-decoration:none; }
.store-actions button:first-child, .store-actions .store-action-link:first-child { background:rgba(168,85,247,.13); color:#d6b4ff; border-color:rgba(168,85,247,.2); }
.stat-list { display:grid; gap:10px; }
.stat-row { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.045); }
.stat-row:last-child { border-bottom:0; }
.stat-row strong { font-size:10px; }
.stat-row span { display:block; color:var(--muted); font-size:8px; margin-top:2px; }
.stat-row b { font:700 11px "Manrope"; }
.quick-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.quick-action { padding:13px; border:1px solid var(--border); border-radius:11px; background:rgba(255,255,255,.018); cursor:pointer; text-align:left; transition:.2s; }
.quick-action:hover { border-color:rgba(168,85,247,.35); transform:translateY(-2px); }
.quick-action i { display:grid; place-items:center; width:29px; height:29px; border-radius:8px; color:#d8b4fe; background:rgba(168,85,247,.1); font-style:normal; margin-bottom:9px; }
.quick-action strong { display:block; font-size:10px; }
.quick-action span { color:var(--muted); font-size:8px; }

.empty-state { min-height:300px; display:grid; place-items:center; text-align:center; }
.empty-state-icon { width:60px; height:60px; display:grid; place-items:center; margin:0 auto 14px; border-radius:17px; background:linear-gradient(145deg,rgba(168,85,247,.2),rgba(34,211,238,.08)); font-size:25px; }
.empty-state h3 { margin:0 0 6px; font:700 15px "Manrope"; }
.empty-state p { max-width:360px; margin:0 auto 15px; color:var(--muted); font-size:10px; }

.wallet-hero { padding:23px; background:radial-gradient(circle at 85% 10%,rgba(236,72,153,.15),transparent 35%),linear-gradient(145deg,#201333,#141827); }
.wallet-amount { font:800 38px "Manrope"; letter-spacing:-1.5px; margin:12px 0 5px; }
.wallet-meta { display:flex; flex-wrap:wrap; gap:9px 20px; color:var(--muted); font-size:9px; }
.wallet-actions { display:flex; gap:8px; margin-top:18px; }
.wallet-actions .button { min-width:130px; }
.balance-grid { grid-template-columns:repeat(4,1fr); }
.balance-card b { display:block; font:700 17px "Manrope"; margin:8px 0 4px; }
.balance-card span { color:var(--muted); font-size:9px; }

.automation-card { display:grid; grid-template-columns:auto 1fr auto; gap:13px; align-items:center; }
.toggle { width:35px; height:20px; border:0; border-radius:20px; background:#2d3445; padding:2px; cursor:pointer; }
.toggle:after { content:""; display:block; width:16px; height:16px; border-radius:50%; background:#737b8e; transition:.2s; }
.toggle.on { background:rgba(45,212,167,.25); }
.toggle.on:after { transform:translateX(15px); background:var(--green); }
.automation-card h3 { margin:0 0 3px; font-size:11px; }
.automation-card p { margin:0; color:var(--muted); font-size:9px; }

.toast { position:fixed; right:22px; bottom:22px; z-index:100; transform:translateY(20px); opacity:0; pointer-events:none; padding:12px 15px; border-radius:11px; background:#1d2433; border:1px solid var(--border-strong); box-shadow:var(--shadow); font-size:10px; transition:.25s; }
.toast.show { opacity:1; transform:translateY(0); }
.modal-backdrop { position:fixed; inset:0; z-index:90; background:rgba(0,0,0,.65); backdrop-filter:blur(8px); display:grid; place-items:center; padding:20px; }
.modal-backdrop[hidden] { display:none; }
.modal { position:relative; width:min(520px,100%); max-height:calc(100vh - 40px); overflow-y:auto; overscroll-behavior:contain; border-radius:18px; background:#141925; border:1px solid var(--border-strong); padding:25px; box-shadow:var(--shadow); }
.modal-close { position:absolute; right:13px; top:11px; width:30px; height:30px; border:0; border-radius:8px; background:#202635; color:var(--muted); cursor:pointer; font-size:19px; }
.modal h2 { margin:0 0 6px; font:800 20px "Manrope"; }
.modal p { color:var(--muted); font-size:10px; }
.connect-steps { display:grid; gap:10px; margin:20px 0; }
.connect-step { display:flex; gap:10px; align-items:center; padding:11px; border-radius:10px; background:#1a202d; border:1px solid var(--border); }
.connect-step b { display:grid; place-items:center; width:24px; height:24px; border-radius:7px; background:rgba(168,85,247,.12); color:#d8b4fe; font-size:9px; }
.connect-step strong, .connect-step span { display:block; }
.connect-step strong { font-size:10px; }.connect-step span { color:var(--muted); font-size:8px; }

/* Melhor contraste nos cards de fluxo e métricas do Instagram */
.connect-step strong { color:#f7f5ff; font-size:13px; font-weight:800; }
.connect-step span { color:#b9c0d2; font-size:11px; line-height:1.35; }
.connect-step { min-height:72px; padding:14px 16px; }
.connect-step b { width:32px; height:32px; font-size:13px; }
.insight strong { color:#292342; font-size:13px; }
.insight p { color:#596078; font-size:12px; line-height:1.4; }
.instagram-kpi small { color:#596078; font-size:11px; }
.instagram-kpi strong { color:#24203b; font-size:28px; }
.instagram-kpi p { color:#596078; font-size:11px; }
.instagram-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:14px; }
.instagram-toolbar h2 { margin:4px 0; }
.instagram-toolbar p { margin:0; }
.instagram-kpis { grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:14px; }
.instagram-kpi { display:flex; align-items:center; gap:14px; min-height:112px; }
.instagram-kpi>span { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border-radius:13px; background:#f2edff; color:var(--purple-2); }
.instagram-kpi small,.instagram-kpi strong,.instagram-kpi p { display:block; }
.instagram-kpi small { color:var(--muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.instagram-kpi strong { margin:3px 0; font:800 25px "Manrope"; }
.instagram-kpi p { margin:0; color:var(--muted); font-size:9px; }
.instagram-kpi.has-error>span { background:#fff0f0; color:#d64b4b; }
.instagram-config-grid,.instagram-media-section,.instagram-events { margin-bottom:14px; }
.instagram-switch { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:10px; font-weight:800; }
.instagram-switch input { accent-color:var(--orange); }
.instagram-media-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:15px; }
.instagram-media-card { min-width:0; overflow:hidden; border:1px solid var(--border); border-radius:14px; background:#f8f9fc; }
.instagram-media-thumb { position:relative; height:150px; display:grid; place-items:center; overflow:hidden; background:#eef0f5; }
.instagram-media-thumb img { width:100%; height:100%; object-fit:cover; }
.instagram-media-thumb>span:last-child { position:absolute; right:8px; top:8px; padding:5px 7px; border-radius:7px; background:rgba(22,16,38,.82); color:#fff; font-size:8px; font-weight:800; }
.instagram-media-card>div:nth-child(2) { min-height:70px; padding:11px 11px 5px; }
.instagram-media-card strong,.instagram-media-card small { display:block; }
.instagram-media-card strong { min-height:30px; font-size:10px; line-height:1.45; }
.instagram-media-card small { margin-top:5px; color:var(--muted); font-size:8px; }
.instagram-media-card>.button { margin:7px 11px 11px; width:calc(100% - 22px); }
.instagram-empty { grid-column:1/-1; display:grid; justify-items:center; padding:34px; color:var(--muted); text-align:center; border:1px dashed var(--border-strong); border-radius:14px; }
.instagram-empty>span { font-size:34px; color:var(--purple-2); }
.instagram-empty strong { margin:8px 0 3px; }
.instagram-empty p { margin:0; }
.instagram-table-thumb { width:46px; height:46px; object-fit:cover; border-radius:9px; }
.instagram-events { margin-top:14px; }
.affiliate-path { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:11px; margin:9px 0; border:1px solid var(--border); border-radius:12px; background:#101522; }
.affiliate-path strong, .affiliate-path span { display:block; }
.affiliate-path strong { font-size:10px; }
.affiliate-path span { color:var(--muted); font-size:8px; margin-top:3px; }
.affiliate-path button, .affiliate-path a { flex:0 0 auto; }
.selected-store-card { display:flex; align-items:center; gap:12px; padding:12px; margin:13px 0; border:1px solid rgba(168,85,247,.22); border-radius:14px; background:linear-gradient(135deg,rgba(168,85,247,.12),rgba(16,185,129,.05)); }
.selected-store-card strong, .selected-store-card span { display:block; }
.selected-store-card strong { font-size:12px; }
.selected-store-card span { color:var(--muted); font-size:8px; margin-top:3px; }
.form-row { display:grid; gap:5px; margin:12px 0; }
.form-row label { color:var(--muted); font-size:9px; }
.form-row input, .form-row select { width:100%; height:40px; border-radius:10px; border:1px solid var(--border); background:#0f131c; color:#fff; padding:0 12px; outline:0; font-size:10px; }
.form-row small, .muted-note { color:var(--muted); font-size:8px; margin:0; }
.highlight-row { padding:12px; border:1px solid rgba(45,212,167,.2); border-radius:14px; background:rgba(45,212,167,.055); }
.highlight-row label { color:#7ce8c9; font-weight:800; }
.advanced-fields { margin-top:12px; padding:0; border:1px solid var(--border); border-radius:13px; background:#101522; overflow:hidden; }
.advanced-fields summary { list-style:none; cursor:pointer; padding:12px; color:#d8b4fe; font-size:10px; font-weight:800; }
.advanced-fields summary::-webkit-details-marker { display:none; }
.advanced-fields summary:after { content:'+'; float:right; color:var(--muted); }
.advanced-fields[open] summary:after { content:'-'; }
.advanced-fields .form-row { margin:0; padding:10px 12px; border-top:1px solid rgba(255,255,255,.045); }
.category-picker { display:grid; gap:8px; padding:10px; border:1px solid var(--border); border-radius:12px; background:#0f131c; }
.choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.choice-pill { display:flex; align-items:center; gap:7px; min-height:34px; padding:8px 10px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#141925; color:#fff!important; cursor:pointer; }
.choice-pill input { width:14px!important; height:14px!important; accent-color:#a855f7; padding:0; }
.choice-pill span { color:#fff; font-size:9px; line-height:1.2; }
.choice-pill:has(input:checked) { border-color:rgba(168,85,247,.45); background:rgba(168,85,247,.16); box-shadow:0 0 0 1px rgba(168,85,247,.08) inset; }
.choice-pill:has(input:disabled) { opacity:.7; cursor:not-allowed; }
.choice-pill-all { background:rgba(16,185,129,.09); border-color:rgba(16,185,129,.2); }
.category-store-list { display:flex; flex-wrap:wrap; gap:9px; margin:12px 0 8px; }
.source-chip { display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--border); border-radius:999px; background:#101522; color:#fff; }
.source-chip .store-logo { width:24px; height:24px; border-radius:8px; }
.source-chip strong { font-size:9px; }
.modal-actions { position:sticky; bottom:-25px; z-index:2; display:flex; justify-content:flex-end; gap:8px; margin-top:18px; padding:14px 0 4px; background:#141925; }

.group-profile-editor { display:flex; align-items:center; gap:16px; padding:14px; border:1px solid #d8d3e6; border-radius:16px; background:#fff; }
.group-profile-preview { width:88px; height:88px; flex:0 0 88px; display:grid; place-items:center; overflow:hidden; border:3px solid #ff7900; border-radius:50%; background:#f3effa; font-size:30px; box-shadow:0 8px 22px rgba(43,24,82,.13); }
.group-profile-preview img { width:100%; height:100%; object-fit:cover; }
.group-list-avatar { padding:0; overflow:hidden; border-radius:50%; }
.group-list-avatar img { width:100%; height:100%; object-fit:cover; }
.group-picture-button { display:inline-flex; margin-bottom:6px; cursor:pointer; }
.group-profile-editor small { display:block; color:#5e6472; font-size:11px; }
.group-permission-list { display:grid; gap:10px; }
.group-setting { display:flex; align-items:flex-start; gap:11px; padding:13px 14px; border:1px solid #d8d3e6; border-radius:13px; background:#fff; color:#21163a; cursor:pointer; }
.group-setting:has(input:checked) { border-color:#ff7900; background:#fff8f1; box-shadow:0 0 0 1px rgba(255,121,0,.12); }
.group-setting input { width:18px!important; height:18px!important; margin-top:2px; padding:0; accent-color:#ff7900; }
.group-setting span { display:grid; gap:3px; }
.group-setting strong { color:#21163a; font-size:13px; }
.group-setting small { color:#626979!important; font-size:10px!important; }
.group-sync-warning { display:block; margin-top:8px; color:#9a5b00!important; font-weight:700; }
.whatsapp-connect-box { display:grid; justify-items:center; gap:12px; margin-top:18px; text-align:center; }
.whatsapp-connect-box .connect-steps { width:100%; text-align:left; }
.whatsapp-qr { width:min(280px,80vw); aspect-ratio:1; object-fit:contain; padding:12px; border-radius:16px; background:#fff; }
.qr-loading { display:grid; place-items:center; width:260px; max-width:80vw; aspect-ratio:1; border:1px dashed var(--border-strong); border-radius:16px; color:var(--muted); }

@media (max-width: 1280px) {
  .kpi-grid { grid-template-columns:repeat(3,1fr); }
  .store-grid { grid-template-columns:repeat(3,1fr); }
  .span-8,.span-7 { grid-column:span 12; }
  .span-5,.span-4 { grid-column:span 6; }
  .instagram-kpis,.instagram-media-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .sidebar { transform:translateX(-102%); transition:.25s; box-shadow:var(--shadow); }
  .sidebar.open { transform:translateX(0); }
  .main { margin-left:0; }
  .menu-toggle { display:block; }
  .breadcrumb { margin-right:auto; margin-left:12px; }
  .profile-button > span:nth-child(2), .profile-button b, .search { display:none; }
  .topbar, .page-shell { padding-left:18px; padding-right:18px; }
  .grid-12 { grid-template-columns:1fr; }
  .span-3,.span-4,.span-5,.span-6,.span-7,.span-8,.span-12 { grid-column:auto; }
  .store-grid { grid-template-columns:repeat(2,1fr); }
  .category-detail-content .stat-list { grid-template-columns:1fr; }
  .category-detail-content .stat-row:first-child { grid-column:auto; }
  .strategy-tabs { position:static; overflow-x:auto; flex-wrap:nowrap; }
  .strategy-tabs .button { flex:0 0 auto; }
  .strategy-preview-card { position:static; }
  .ranking-offer-card { grid-template-columns:34px 62px minmax(0,1fr) 50px; }
  .ranking-offer-card > img,.ranking-image-placeholder { width:62px; height:62px; }
  .ranking-numbers { grid-column:2 / -1; }
  .instagram-toolbar { align-items:flex-start; flex-direction:column; }
  .instagram-toolbar .head-actions { width:100%; }
}
@media (max-width: 580px) {
  .kpi-grid, .balance-grid, .store-grid { grid-template-columns:1fr; }
  .page-head { flex-direction:column; }
  .head-actions { width:100%; overflow:auto; }
  .profile-button { display:none; }
  .funnel-row { grid-template-columns:100px 1fr 50px; }
  .funnel-row small:last-child { display:none; }
  .donut-wrap { flex-direction:column; }
  .commission-pagination { align-items:flex-start; flex-direction:column; }
  .channel-summary-grid { grid-template-columns:1fr; }
  .channel-item-card { grid-template-columns:38px minmax(0,1fr) auto; }
  .channel-item-card .button { grid-column:2 / -1; }
  .ranking-summary-grid { grid-template-columns:1fr; }
  .ranking-offer-card { grid-template-columns:28px 54px minmax(0,1fr); }
  .ranking-offer-card > img,.ranking-image-placeholder { width:54px; height:54px; }
  .ranking-score { grid-column:2; }
  .ranking-numbers { grid-column:3; grid-template-columns:1fr; }
  .instagram-kpis,.instagram-media-grid { grid-template-columns:1fr; }
}

.storefront-logo-upload { display:flex; align-items:center; gap:14px; padding:14px; border:1px dashed var(--border); border-radius:14px; background:rgba(255,255,255,.02); }
.storefront-logo-upload > img,.storefront-logo-placeholder { width:76px; height:76px; flex:0 0 76px; border-radius:16px; object-fit:contain; background:#fff; padding:6px; color:#7c8498; display:grid; place-items:center; text-align:center; font-size:12px; }
.storefront-logo-upload > div:last-child { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.storefront-logo-upload small { width:100%; color:var(--muted); }
.storefront-background-upload { display:grid; grid-template-columns:minmax(180px,1fr) auto; gap:14px; align-items:center; padding:14px; border:1px dashed var(--border); border-radius:14px; background:rgba(255,255,255,.02); }
.storefront-background-upload > div:first-child { min-height:110px; display:grid; place-items:center; border-radius:12px; background-color:#171522; background-size:cover; background-position:center; color:var(--muted); font-size:11px; text-align:center; }
.storefront-background-upload > div:last-child { display:flex; max-width:230px; gap:8px; flex-wrap:wrap; }
.storefront-background-upload small { width:100%; color:var(--muted); line-height:1.4; }
.storefront-address-input { display:flex; align-items:center; overflow:hidden; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); }
.storefront-address-input span { flex:0 0 auto; padding:0 0 0 13px; color:var(--muted); font-size:13px; white-space:nowrap; }
.storefront-address-input input { min-width:120px; border:0; background:transparent; box-shadow:none; }
@media (max-width:620px) { .storefront-logo-upload { align-items:stretch; flex-direction:column; } .storefront-logo-upload > img,.storefront-logo-placeholder { width:88px; height:88px; flex-basis:88px; } .storefront-background-upload { grid-template-columns:1fr; } .storefront-background-upload > div:last-child { max-width:none; } }

/* Nexly Marketplace dashboard — reference-led refresh */
:root {
  --sidebar: 264px;
  --market-ink: #241c3a;
  --market-purple: #493594;
  --market-purple-deep: #2e235f;
  --market-orange: #ff9f2f;
  --market-canvas: #f4f6fb;
  --market-line: #e8eaf2;
}

.material-symbols-rounded {
  font-family: "Material Symbols Rounded";
  font-weight: normal;
  font-style: normal;
  font-size: 20px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

body { background: var(--market-canvas); color: var(--market-ink); }
.main { background: var(--market-canvas); }
.sidebar {
  padding: 24px 18px 20px;
  background: var(--market-purple-deep);
  box-shadow: 14px 0 40px rgba(46,35,95,.14);
}
.brand { padding: 0 10px 22px; }
.brand-mark { background: var(--market-orange); box-shadow: 0 10px 24px rgba(255,159,47,.25); }
.workspace { margin-bottom: 18px; padding: 11px; background: rgba(255,255,255,.09); border-color: rgba(255,255,255,.12); }
.workspace-avatar { background: #fff; color: var(--market-purple); }
.nav p { margin: 19px 12px 7px; color: #9f95d1; }
.sidebar button.nav-item { height: 40px; gap: 12px; border-radius: 11px; color: #d8d3ee; font-size: 12px; }
.nav-item > .material-symbols-rounded { width: 19px; color: #a99fd5; font-size: 18px; }
.sidebar button.nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.sidebar button.nav-item.active { background: #fff; color: var(--market-purple); box-shadow: 0 10px 24px rgba(20,13,53,.22); }
.nav-item.active > .material-symbols-rounded { color: var(--market-purple); }
.upgrade-card { background: #3b2c78; border-color: rgba(255,255,255,.12); }
.upgrade-card button { color: #ffd39b; }

.topbar { height: 78px; padding: 0 34px; background: rgba(255,255,255,.94); border-color: var(--market-line); box-shadow: 0 8px 28px rgba(48,43,76,.045); }
.search { width: min(360px,32vw); height: 42px; border-radius: 13px; background: #f5f6fa; border-color: transparent; }
.search input { color: var(--market-ink); }
.icon-button { width: 42px; height: 42px; border-radius: 13px; background: #fff; }
.profile-avatar { border-radius: 12px; background: var(--market-orange); color: #fff; }
.page-shell { max-width: 1540px; padding: 30px 34px 64px; }

.market-hero {
  min-height: 174px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  margin-bottom: 28px;
  padding: 30px 34px;
  border-radius: 24px;
  background: var(--market-purple);
  color: #fff;
  box-shadow: 0 18px 42px rgba(73,53,148,.2);
  overflow: hidden;
}
.market-hero-copy { max-width: 720px; }
.hero-kicker, .section-eyebrow { display: block; margin-bottom: 7px; color: #ffcf8f; font-size: 9px; font-weight: 800; letter-spacing: 1.35px; }
.market-hero h1 { margin: 0 0 10px; font: 800 clamp(24px,2.4vw,36px)/1.18 "Manrope"; letter-spacing: -1.15px; }
.market-hero h1 span { color: #ffd39b; }
.market-hero p { max-width: 590px; margin: 0; color: #ddd8f3; font-size: 12px; }
.hero-actions { display: flex; gap: 10px; flex: 0 0 auto; }
.hero-actions .button { min-height: 44px; gap: 7px; padding: 0 16px; border-radius: 12px; }
.hero-actions .material-symbols-rounded { font-size: 18px; }
.hero-primary { background: var(--market-orange) !important; border-color: var(--market-orange) !important; color: #fff !important; }
.hero-secondary { background: rgba(255,255,255,.1) !important; border-color: rgba(255,255,255,.2) !important; color: #fff !important; }

.dashboard-section-title { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 13px; }
.dashboard-section-title > div > span { color: #8b90a2; font-size: 10px; }
.dashboard-section-title h2 { margin: 2px 0 0; font: 800 18px "Manrope"; letter-spacing: -.45px; }
.metrics-only-title { align-items: center; }
.metrics-only-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metrics-only-grid .kpi-value { font-size: clamp(25px, 2.1vw, 36px); }
.metrics-chart-card { margin-top: 14px; }
.metric-chart-legend { display: flex; gap: 16px; flex-wrap: wrap; color: var(--muted); font-size: 12px; font-weight: 700; }
.metric-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.metric-chart-legend i { width: 9px; height: 9px; border-radius: 3px; }
.metric-chart { height: 280px; display: flex; align-items: stretch; gap: 5px; padding: 24px 4px 0; border-top: 1px solid var(--border); overflow: hidden; }
.metric-chart-column { min-width: 0; flex: 1; display: grid; grid-template-rows: 1fr 20px; gap: 7px; text-align: center; }
.metric-chart-bars { min-height: 0; display: flex; align-items: end; justify-content: center; gap: 2px; }
.metric-chart-bars i { width: min(9px, 30%); min-height: 2px; border-radius: 5px 5px 2px 2px; transition: height .35s ease, filter .2s ease; }
.metric-chart-column:hover .metric-chart-bars i { filter: brightness(1.18); }
.metric-chart-column small { overflow: hidden; color: var(--muted); font-size: 9px; white-space: nowrap; }
.metric-chart-legend .publications, .metric-chart-bars .publications { background: var(--orange); }
.metric-chart-legend .clicks, .metric-chart-bars .clicks { background: #7956d8; }
.metric-chart-legend .orders, .metric-chart-bars .orders { background: #28a785; }
.dashboard-insights-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 14px; }
.dashboard-ranking { min-width: 0; }
.dashboard-ranking-row { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; align-items: center; padding: 11px 0; border-top: 1px solid var(--border); }
.dashboard-ranking-row > b { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; background: rgba(121,86,216,.13); color: #7956d8; font-size: 11px; }
.dashboard-ranking-row strong,.dashboard-ranking-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-ranking-row strong { color: var(--text); font-size: 12px; }
.dashboard-ranking-row small,.dashboard-empty { margin-top: 3px; color: var(--muted); font-size: 10px; }
.dashboard-clicks-card { margin-top: 14px; }
.dashboard-clicks-card td b { display: block; max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-pill { display: inline-flex; align-items: center; gap: 7px; color: #7b8191; font-size: 9px; }
.live-pill i { width: 7px; height: 7px; border-radius: 50%; background: #21ae83; box-shadow: 0 0 0 4px rgba(33,174,131,.1); }

.marketplace-kpis { grid-template-columns: repeat(6,minmax(120px,1fr)); gap: 12px; margin-bottom: 18px; }
.market-kpi { min-height: 130px; padding: 17px; border: 0 !important; border-radius: 17px; box-shadow: 0 10px 28px rgba(51,43,95,.07) !important; }
.market-kpi .kpi-label { align-items: center; }
.market-kpi .kpi-label > span { color: #777c8e; font-weight: 600; }
.market-kpi .kpi-label i { width: 34px; height: 34px; border-radius: 11px; font-size: 18px; }
.market-kpi .kpi-value { margin: 13px 0 5px; font-size: 25px; }
.market-kpi .trend { color: #858a9b; }
.market-kpi .kpi-accent { position: absolute; inset: auto 17px 0; height: 3px; border-radius: 3px 3px 0 0; background: #755ddd; }
.market-kpi.orange .kpi-label i, .market-kpi.orange .kpi-accent { color: #e97e17; background: #fff1df; }
.market-kpi.orange .kpi-accent { background: #f39a3f; }
.market-kpi.blue .kpi-label i, .market-kpi.blue .kpi-accent { color: #397ad5; background: #eaf3ff; }
.market-kpi.blue .kpi-accent { background: #5d99e9; }
.market-kpi.rose .kpi-label i, .market-kpi.rose .kpi-accent { color: #d9536e; background: #fff0f3; }
.market-kpi.rose .kpi-accent { background: #e56d83; }
.market-kpi.teal .kpi-label i, .market-kpi.teal .kpi-accent { color: #198f7d; background: #e7f7f3; }
.market-kpi.teal .kpi-accent { background: #3bb39f; }
.market-kpi.gold .kpi-label i, .market-kpi.gold .kpi-accent { color: #b78317; background: #fff7db; }
.market-kpi.gold .kpi-accent { background: #dfb23e; }

.marketplace-dashboard-grid { gap: 16px; }
.marketplace-dashboard-grid > .card { padding: 22px; border: 1px solid var(--market-line) !important; border-radius: 19px; box-shadow: 0 12px 34px rgba(51,43,95,.065) !important; }
.marketplace-dashboard-grid .card-head h2 { font-size: 15px; }
.marketplace-dashboard-grid .section-eyebrow { margin-bottom: 5px; color: #7a61d4; }
.readiness-layout { display: grid; grid-template-columns: 170px 1fr; align-items: center; gap: 26px; }
.readiness-meter { align-self: stretch; display: flex; flex-direction: column; justify-content: center; padding: 18px; border-radius: 15px; background: #f6f3ff; }
.readiness-meter strong { font: 800 31px "Manrope"; color: var(--market-purple); }
.readiness-meter span { margin: -2px 0 14px; color: #686d7c; font-size: 9px; }
.readiness-meter progress { width: 100%; height: 7px; border: 0; border-radius: 10px; overflow: hidden; appearance: none; }
.readiness-meter progress::-webkit-progress-bar { background: #e5e0f4; }
.readiness-meter progress::-webkit-progress-value { background: var(--market-purple); }
.readiness-meter small { margin-top: 8px; color: #8b90a2; font-size: 8px; }
.operation-health-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 20px; margin-top: 18px; }
.health-window { display: flex; flex-direction: column; gap: 2px; margin-top: 15px; padding-top: 13px; border-top: 1px solid #dfd8f2; }
.health-window b { color: var(--market-ink); font-size: 12px; }
.health-window span { margin: 0; color: #73798a; font-size: 9px; }
.operation-health-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.operation-health-step { min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 14px; border: 1px solid var(--market-line); border-radius: 14px; background: #fbfcfe; color: var(--market-ink); text-align: left; cursor: pointer; transition: .18s ease; }
.operation-health-step:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(51,43,95,.08); }
.operation-health-step > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.operation-health-step strong { font: 750 11px "Manrope"; }
.operation-health-step small { color: #747a8a; font-size: 8px; line-height: 1.35; }
.operation-health-step > i { color: #9ca1af; font-size: 17px; }
.health-step-icon { font-size: 20px; }
.operation-health-step.healthy { border-color: #cce9df; background: #f3fbf8; }
.operation-health-step.healthy .health-step-icon { color: #198b70; }
.operation-health-step.attention { border-color: #f1d49d; background: #fff9ed; }
.operation-health-step.attention .health-step-icon { color: #b47416; }
.operation-health-step.blocked { border-color: #efcbd2; background: #fff6f7; }
.operation-health-step.blocked .health-step-icon { color: #cf4f67; }
.operation-links button { display: inline-flex; align-items: center; gap: 6px; }
.operation-links button .material-symbols-rounded { font-size: 17px; }
.operation-links button.primary { background: var(--market-purple); border-color: var(--market-purple); color: #fff; }
.rotating { animation: operation-spin .8s linear infinite; }
@keyframes operation-spin { to { transform: rotate(360deg); } }
.operation-test-summary { display: flex; align-items: baseline; gap: 8px; margin: 16px 0; padding: 14px; border-radius: 13px; background: #f3f0ff; }
.operation-test-summary strong { color: var(--market-purple); font: 800 24px "Manrope"; }
.operation-test-summary span { color: #686d7c; font-size: 11px; }
.operation-test-list { display: grid; gap: 8px; }
.operation-test-item { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid #dde2ea; border-radius: 12px; background: #fff; }
.operation-test-item > span { font-size: 20px; }
.operation-test-item > div { display: flex; flex-direction: column; gap: 3px; }
.operation-test-item strong { color: #24203a; font-size: 11px; }
.operation-test-item small { color: #686d7c; font-size: 9px; line-height: 1.4; }
.operation-test-item.healthy { border-color: #cce9df; background: #f3fbf8; }
.operation-test-item.healthy > span { color: #198b70; }
.operation-test-item.blocked { border-color: #efcbd2; background: #fff6f7; }
.operation-test-item.blocked > span { color: #cf4f67; }
.marketplace-dashboard-grid .stat-list { gap: 0; }
.marketplace-dashboard-grid .stat-row { border-color: var(--market-line); }
.marketplace-dashboard-grid .stat-row strong { color: var(--market-ink); font-size: 10px; }
.marketplace-dashboard-grid .stat-row b { max-width: 230px; color: var(--market-ink); text-align: right; overflow: hidden; text-overflow: ellipsis; }
.operation-links { padding-top: 15px; border-top: 1px solid var(--market-line); }
.operation-links button, .store-actions button { background: #f7f5fc; color: var(--market-purple); border-color: #e5e0f4; }
.latest-order-card { background: #fffaf3 !important; }
.attributed-results .stat-list { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 26px; }
.quick-grid { gap: 10px; }
.quick-action { min-height: 102px; padding: 15px; border-color: var(--market-line); background: #fafbfe; }
.quick-action i { width: 35px; height: 35px; border-radius: 11px; background: #ede9fb; color: var(--market-purple); font-size: 19px; }
.quick-action:hover { border-color: #cfc6ef; background: #f7f4ff; box-shadow: 0 9px 22px rgba(73,53,148,.08); }
.quick-action strong { color: var(--market-ink); font-size: 11px; }

.tag.success { color: #177e63; background: #e8f7f2; border-color: #c8ebdf; }
.tag.warning, .tag.pending { color: #a86a0c; background: #fff4dd; border-color: #f7dca7; }
.tag.purple { color: #644bbd; background: #f0ecff; border-color: #ddd5ff; }
.button.soft { color: var(--market-purple); background: #f3f0ff; border-color: #e3ddf8; }
.toast { background: var(--market-purple-deep); color: #fff; }

@media (max-width: 1280px) {
  .marketplace-kpis { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 980px) {
  .market-hero { align-items: flex-start; flex-direction: column; }
  .readiness-layout { grid-template-columns: 1fr; }
  .readiness-meter { min-height: 130px; }
  .operation-health-layout { grid-template-columns: 1fr; }
  .operation-health-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .commission-flow { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .awin-finance-status { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .shopee-mode-grid { grid-template-columns:1fr; }
  .page-shell { padding: 20px 16px 48px; }
  .topbar { padding: 0 16px; }
  .market-hero { min-height: 0; padding: 24px 20px; border-radius: 18px; }
  .market-hero h1 { font-size: 25px; }
  .hero-actions { width: 100%; }
  .hero-actions .button { flex: 1; }
  .marketplace-kpis { grid-template-columns: repeat(2,1fr); }
  .attributed-results .stat-list { grid-template-columns: 1fr; }
  .operation-health-steps { grid-template-columns: 1fr; }
  .commission-flow { grid-template-columns:1fr; }
  .awin-finance-status { grid-template-columns:1fr; }
  .commission-quick-actions { align-items:flex-start; flex-wrap:wrap; }
}
@media (max-width: 460px) {
  .marketplace-kpis { grid-template-columns: 1fr; }
  .dashboard-section-title { align-items: flex-start; flex-direction: column; }
  .hero-actions { flex-direction: column; }
}
@media (max-width: 980px) { .dashboard-insights-grid { grid-template-columns: 1fr; } }

/* Accessibility contrast pass: category editor and marketplace store cards */
.modal .form-row > label {
  color: #c9c3e6;
  font-weight: 700;
}

.modal .choice-grid {
  gap: 9px;
}

.modal .choice-pill {
  min-height: 40px;
  background: #ffffff !important;
  border: 1.5px solid #c8c3d8 !important;
  color: #29233f !important;
  box-shadow: 0 3px 10px rgba(20, 13, 53, .08);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.modal .choice-pill span {
  color: #29233f !important;
  font-size: 10px;
  font-weight: 700;
}

.modal .choice-pill:hover {
  border-color: #8a72dc !important;
  background: #faf8ff !important;
  box-shadow: 0 5px 14px rgba(83, 61, 165, .16);
  transform: translateY(-1px);
}

.modal .choice-pill:has(input:checked),
.modal .choice-pill.selected {
  background: #eee9ff !important;
  border-color: #7658e6 !important;
  box-shadow: 0 0 0 2px rgba(118, 88, 230, .14), 0 6px 16px rgba(75, 53, 151, .14);
}

.modal .choice-pill:has(input:checked) span,
.modal .choice-pill.selected {
  color: #4c369f !important;
}

.modal .choice-pill input {
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  accent-color: #7658e6;
}

.store-grid .store-card {
  border: 1.5px solid #d6dae5 !important;
  box-shadow: 0 12px 30px rgba(42, 36, 75, .11) !important;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.store-grid .store-card:hover {
  border-color: #a99bda !important;
  box-shadow: 0 17px 38px rgba(62, 48, 121, .16) !important;
  transform: translateY(-2px);
}

.store-card .store-logo,
.source-chip .store-logo {
  background: #ffffff;
  border: 1.5px solid #d2d6e0;
  box-shadow: 0 7px 18px rgba(38, 33, 65, .14);
}

.store-card h3 {
  color: #211b38;
  font-weight: 800;
}

.store-card p,
.store-card .store-guide {
  color: #666c7e;
}

.store-card .tag.success,
.source-chip .tag.success,
.store-section .tag.success {
  color: #075f49;
  background: #d9f4ea;
  border-color: #85d8bd;
  font-weight: 800;
}

.store-card .tag.available,
.store-section .tag.available {
  color: #526072;
  background: #edf1f6;
  border-color: #cdd5e0;
  font-weight: 700;
}

/* Global readability pass — keep the light marketplace theme above legacy rules */
:root {
  --border: #d9dce7;
  --border-strong: #b9b5ca;
  --text: #211a38;
  --muted: #62687a;
  --muted-2: #858b9c;
  --shadow: 0 13px 34px rgba(43, 34, 82, .11);
}

body { font-size: 15px; }

.sidebar {
  border-right: 1px solid rgba(255,255,255,.12);
}

.brand strong { font-size: 19px; }
.brand span { color: #d7d1f5; font-size: 12px; }
.workspace strong { color: #fff; font-size: 14px; }
.workspace span { color: #d7d1f5; font-size: 11px; }
.nav p { color: #b9b0e1; font-size: 10px; letter-spacing: 1.6px; }
.sidebar button.nav-item {
  min-height: 44px;
  color: #ece9fb;
  font-size: 14px;
  font-weight: 650;
}
.sidebar .nav-item > .material-symbols-rounded {
  color: #c8c0ed;
  font-size: 20px;
}
.sidebar button.nav-item:hover {
  background: rgba(255,255,255,.12);
  color: #fff;
}
.sidebar button.nav-item.active {
  color: #4c369f;
  border: 1px solid #e0daf5;
}

.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.storefront-logo-upload {
  border: 1.5px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
}

.card h1,
.card h2,
.card h3,
.card strong,
.metric-card strong,
.summary-card strong,
.category-compact-card strong,
.channel-item-card strong,
.ranking-offer-card strong {
  color: var(--text) !important;
}
.card h2 { font-size: 17px; }
.card h3 { font-size: 15px; }
.card p,
.card small,
.metric-card span,
.summary-card span { color: var(--muted); }
.kpi-label { color: #656b7e; font-size: 12px; font-weight: 700; }
.kpi-value { color: var(--text); font-weight: 850; }
.trend { color: #188565; font-weight: 700; }

.choice-grid .choice-pill,
.category-picker label,
.highlight-row {
  background: #fff !important;
  border: 1.5px solid #c9c4d9 !important;
  color: #2b2441 !important;
  box-shadow: 0 3px 10px rgba(35, 27, 67, .07);
}
.choice-grid .choice-pill,
.choice-grid .choice-pill span,
.category-picker label,
.category-picker label span,
.highlight-row,
.highlight-row span {
  color: #2b2441 !important;
  font-size: 12px;
  font-weight: 750;
}
.choice-grid .choice-pill:hover,
.category-picker label:hover,
.highlight-row:hover {
  background: #f8f5ff !important;
  border-color: #8066df !important;
  box-shadow: 0 6px 16px rgba(76, 54, 159, .14);
}
.choice-grid .choice-pill.selected,
.choice-grid .choice-pill:has(input:checked),
.category-picker label:has(input:checked),
.highlight-row:has(input:checked) {
  background: #eae4ff !important;
  border-color: #6f50dd !important;
  color: #432c99 !important;
  box-shadow: 0 0 0 2px rgba(111,80,221,.13);
}
.choice-grid .choice-pill.selected span,
.choice-grid .choice-pill:has(input:checked) span,
.category-picker label:has(input:checked) span,
.highlight-row:has(input:checked) span { color: #432c99 !important; }

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  background: #fff !important;
  border: 1.5px solid #cfd3df !important;
  color: #211a38 !important;
}
input::placeholder,
textarea::placeholder { color: #858b9c !important; opacity: 1; }

table thead th { color: #676d80; font-size: 11px; font-weight: 800; }
table tbody td { color: #302a44; }
table tbody tr { border-color: #dfe2ea; }

.tag.success {
  color: #08664e;
  background: #dff5ed;
  border-color: #92d8c2;
  font-weight: 800;
}
.tag.purple {
  color: #5136aa;
  background: #ede8ff;
  border-color: #c7bafa;
  font-weight: 800;
}

.button,
button:not(.nav-item) { font-weight: 700; }

@media (max-width: 860px) {
  .sidebar button.nav-item { font-size: 13px; }
}

/* Premium marketplace theme — reference: compact purple/orange dashboard */
:root {
  --premium-ink: #251f3d;
  --premium-muted: #6f7285;
  --premium-purple: #46348f;
  --premium-purple-soft: #eeeafd;
  --premium-orange: #ff9e1b;
  --premium-orange-soft: #fff2db;
  --premium-coral: #f46878;
  --premium-coral-soft: #fff0f2;
  --premium-cyan: #48c7d4;
  --premium-cyan-soft: #e9fafc;
  --premium-green: #22a884;
  --premium-green-soft: #e8f8f2;
  --premium-line: #cbc7d8;
  --premium-shadow: 0 14px 34px rgba(47, 38, 91, .12);
}

body {
  color: var(--premium-ink);
  background: #f1f2f8;
}

.sidebar {
  background: #372676;
  box-shadow: 10px 0 32px rgba(42, 29, 96, .2);
}

.brand-mark,
.profile-avatar {
  background: var(--premium-orange) !important;
  color: #312255 !important;
  box-shadow: 0 8px 20px rgba(255, 158, 27, .28);
}

.sidebar button.nav-item {
  min-height: 46px;
  border-radius: 13px;
  font-size: 14.5px;
  font-weight: 750;
  letter-spacing: -.1px;
}

.sidebar button.nav-item.active {
  color: var(--premium-purple);
  border-color: #fff;
  box-shadow: 0 10px 25px rgba(19, 11, 58, .2);
}

.topbar {
  border-bottom: 1px solid #dedbe8;
  box-shadow: 0 8px 24px rgba(43, 36, 76, .07);
}

.page-shell {
  position: relative;
  padding-top: 34px;
}

.page-head {
  align-items: center;
  margin-bottom: 26px;
}

.page-head > div:first-child {
  position: relative;
  padding-left: 15px;
}

.page-head > div:first-child::before {
  content: "";
  position: absolute;
  inset: 3px auto 2px 0;
  width: 5px;
  border-radius: 5px;
  background: var(--premium-orange);
}

.page-head h1 {
  color: var(--premium-ink);
  font-size: clamp(27px, 2.4vw, 37px);
  letter-spacing: -1.35px;
}

.page-head p {
  color: var(--premium-muted);
  font-size: 13px;
  font-weight: 560;
}

.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.storefront-logo-upload {
  border: 1.5px solid var(--premium-line) !important;
  border-radius: 19px !important;
  box-shadow: var(--premium-shadow) !important;
}

.card {
  overflow: hidden;
}

.card-head h2,
.store-section-head h2 {
  color: var(--premium-ink) !important;
  font-size: 18px !important;
  font-weight: 850 !important;
  letter-spacing: -.35px;
}

.card-head p,
.store-section-head p {
  color: var(--premium-muted) !important;
  font-size: 11px !important;
  line-height: 1.55;
}

.section-eyebrow {
  color: var(--premium-purple) !important;
  font-weight: 850;
  letter-spacing: 1.2px;
}

.button.primary,
button.primary {
  background: var(--premium-purple) !important;
  border-color: var(--premium-purple) !important;
  color: #fff !important;
  box-shadow: 0 9px 20px rgba(70, 52, 143, .23) !important;
}

.button.primary:hover,
button.primary:hover {
  background: #382671 !important;
}

.period-select,
.strategy-tabs {
  border-color: #c9c4dc !important;
  background: #fff !important;
}

.period-button.active,
.strategy-tab.active {
  background: var(--premium-purple) !important;
  color: #fff !important;
  border-color: var(--premium-purple) !important;
}

.strategy-tab:not(.active):hover,
.period-button:not(.active):hover {
  background: var(--premium-purple-soft) !important;
  color: var(--premium-purple) !important;
}

.kpi-grid > .kpi,
.balance-grid > .balance-card {
  position: relative;
  min-height: 126px;
  border-top-width: 5px !important;
}

.kpi-grid > .kpi:nth-child(6n+1),
.balance-grid > .balance-card:nth-child(6n+1) { border-top-color: var(--premium-purple) !important; background: #fbfaff !important; }
.kpi-grid > .kpi:nth-child(6n+2),
.balance-grid > .balance-card:nth-child(6n+2) { border-top-color: var(--premium-orange) !important; background: #fffdf8 !important; }
.kpi-grid > .kpi:nth-child(6n+3),
.balance-grid > .balance-card:nth-child(6n+3) { border-top-color: var(--premium-cyan) !important; background: #f9feff !important; }
.kpi-grid > .kpi:nth-child(6n+4),
.balance-grid > .balance-card:nth-child(6n+4) { border-top-color: var(--premium-coral) !important; background: #fffafb !important; }
.kpi-grid > .kpi:nth-child(6n+5),
.balance-grid > .balance-card:nth-child(6n+5) { border-top-color: var(--premium-green) !important; background: #f9fefc !important; }
.kpi-grid > .kpi:nth-child(6n+6),
.balance-grid > .balance-card:nth-child(6n+6) { border-top-color: #8672d8 !important; background: #fcfbff !important; }

.kpi-label {
  color: #565a70 !important;
  font-size: 12px;
  font-weight: 800;
}

.kpi-label i {
  background: var(--premium-purple-soft);
  color: var(--premium-purple);
}

.kpi-value,
.balance-card b {
  color: var(--premium-ink) !important;
  font-size: 25px;
}

.trend { color: #148466 !important; }
.trend.down { color: #cf4f67 !important; }

.store-grid { gap: 16px; }

.store-grid .store-card {
  border-top: 5px solid var(--premium-orange) !important;
  border-radius: 20px !important;
  background: #fff !important;
}

.store-grid .store-card:nth-child(4n+2) { border-top-color: var(--premium-purple) !important; }
.store-grid .store-card:nth-child(4n+3) { border-top-color: var(--premium-cyan) !important; }
.store-grid .store-card:nth-child(4n+4) { border-top-color: var(--premium-coral) !important; }

.store-card h3 {
  color: var(--premium-ink) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
}

.store-card .store-logo,
.source-chip .store-logo {
  border: 2px solid #d7d3e1;
}

.category-compact-card {
  background: #fff !important;
  color: var(--premium-ink) !important;
}

.category-compact-card:hover,
.category-compact-card.selected {
  border-color: #7d69cc !important;
  background: var(--premium-purple-soft) !important;
  transform: translateY(-1px);
}

.category-compact-card strong,
.category-compact-card small {
  color: var(--premium-ink) !important;
}

.tag.success {
  color: #08634d !important;
  background: var(--premium-green-soft) !important;
  border-color: #75cdb2 !important;
}

.tag.warning,
.tag.pending {
  color: #8c5700 !important;
  background: var(--premium-orange-soft) !important;
  border-color: #efbd68 !important;
}

.tag.purple,
.tag.network {
  color: #4b359e !important;
  background: var(--premium-purple-soft) !important;
  border-color: #b7a9ea !important;
}

.table-wrap {
  border: 1.5px solid #d4d0df;
  border-radius: 15px;
  background: #fff;
}

table thead {
  background: #f0edf9;
}

table thead th {
  color: #443a68 !important;
  font-weight: 850;
}

table tbody tr:hover {
  background: #fff8ed !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  border: 1.5px solid #bbb7c9 !important;
  border-radius: 11px !important;
  background: #fff !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #745fca !important;
  box-shadow: 0 0 0 3px rgba(116, 95, 202, .14) !important;
  outline: 0;
}

.modal {
  border: 1.5px solid #8175aa;
  border-top: 6px solid var(--premium-orange);
  border-radius: 22px;
  box-shadow: 0 30px 90px rgba(18, 12, 48, .34);
}

.modal h2 {
  color: var(--premium-ink);
  font-size: 23px;
}

.quick-action:nth-child(4n+1) i { background: var(--premium-orange-soft); color: #b56b00; }
.quick-action:nth-child(4n+2) i { background: var(--premium-purple-soft); color: var(--premium-purple); }
.quick-action:nth-child(4n+3) i { background: var(--premium-cyan-soft); color: #16818c; }
.quick-action:nth-child(4n+4) i { background: var(--premium-coral-soft); color: #c84459; }

@media (max-width: 860px) {
  .page-head h1 { font-size: 28px; }
  .sidebar button.nav-item { font-size: 14px; }
}

.upgrade-recommendation {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 16px;
  padding: 15px 16px;
  border: 1.5px solid #efbd68;
  border-radius: 14px;
  background: var(--premium-orange-soft);
  color: var(--premium-ink);
}

.upgrade-recommendation > .material-symbols-rounded {
  color: #b56b00;
  font-size: 24px;
}

.upgrade-recommendation strong { font-size: 13px; }
.upgrade-recommendation p { margin: 4px 0 0; color: #6d5940; font-size: 11px; line-height: 1.5; }

/* High-contrast typography — prominent names and labels on every page */
.form-row > label,
.stack-form .form-row > label,
.grid .form-row > label,
.field-label,
label.field-label {
  color: #201936 !important;
  font-size: 15.5px !important;
  font-weight: 850 !important;
  letter-spacing: -.15px;
}

.form-row > small,
.stack-form .form-row > small,
.muted-note,
.field-help {
  color: #4e5366 !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.5;
}

.card-head h2,
.store-section-head h2,
.card > h2,
.card > h3 {
  color: #211a38 !important;
  font-size: 21px !important;
  font-weight: 850 !important;
}

.card-head p,
.store-section-head p {
  color: #505568 !important;
  font-size: 13px !important;
  font-weight: 620;
}

.choice-grid .choice-pill,
.choice-grid .choice-pill span,
.category-picker label,
.category-picker label span,
.highlight-row,
.highlight-row span {
  color: #29223f !important;
  font-size: 15px !important;
  font-weight: 820 !important;
}

.category-compact-main strong,
.category-compact-card strong {
  color: #211a38 !important;
  font-size: 15.5px !important;
  font-weight: 850 !important;
}

.category-compact-main small,
.category-compact-card small,
.store-card p,
.store-card .store-guide {
  color: #555b6f !important;
  font-size: 12.5px !important;
  font-weight: 620;
}

.sidebar button.nav-item {
  min-height: 49px;
  color: #f4f1ff;
  font-size: 16px;
  font-weight: 780;
}

.nav p {
  color: #d6cff4;
  font-size: 11px;
  font-weight: 850;
}

.kpi-label {
  color: #4b5064 !important;
  font-size: 13.5px !important;
  font-weight: 820 !important;
}

.kpi-value,
.balance-card b {
  color: #7a7f8d !important;
  font-size: 28px !important;
}

.store-card h3 {
  color: #211a38 !important;
  font-size: 17px !important;
  font-weight: 850 !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  color: #211a38 !important;
  font-size: 14px !important;
  font-weight: 650;
}

table thead th {
  color: #40375f !important;
  font-size: 12px !important;
}

table tbody td {
  color: #2b253e !important;
  font-size: 13px;
  font-weight: 600;
}

/* Keep the shared surface system and the dashboard hero above legacy theme rules. */
.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.storefront-logo-upload {
  border-color: var(--surface-border) !important;
  box-shadow: var(--surface-shadow) !important;
}

.card.dashboard-sales-card {
  border: 0 !important;
  background: linear-gradient(135deg, #ff6900 0%, #ff8430 56%, #ff9f46 100%) !important;
  box-shadow: 0 18px 38px rgba(232, 102, 10, .24) !important;
}

.card.dashboard-sales-card > p,
.card.dashboard-sales-card small,
.card.dashboard-sales-card b,
.card.dashboard-sales-card > strong {
  color: #fff !important;
}

/* Dashboard design system — CRM clarity with Nexly marketplace identity */
:root {
  --surface-border: #ded9e8;
  --surface-shadow: 0 8px 24px rgba(47, 37, 83, .075), 0 1px 2px rgba(47, 37, 83, .04);
  --surface-radius: 20px;
  --dashboard-orange: #ff7900;
  --dashboard-orange-2: #ff9b38;
  --dashboard-purple: #4b2a88;
  --dashboard-purple-2: #7654bd;
}

.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.storefront-logo-upload {
  border: 1px solid var(--surface-border) !important;
  border-radius: var(--surface-radius) !important;
  box-shadow: var(--surface-shadow) !important;
}

.kpi-grid > .kpi,
.balance-grid > .balance-card {
  border-top-width: 1px !important;
}

.dashboard-toolbar {
  margin-bottom: 18px;
  padding: 16px 18px;
  border: 1px solid var(--surface-border);
  border-radius: 18px;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 5px 18px rgba(47, 37, 83, .045);
}

.dashboard-toolbar h2 { color: #211a38; font-size: 20px; }
.dashboard-toolbar p { margin: 4px 0 0; color: #707487; font-size: 12px; }
.dashboard-toolbar .period-selector { padding: 4px; border: 1px solid #ddd8e8; border-radius: 13px; background: #f6f4f9; }
.dashboard-toolbar .period-button { min-height: 36px; border-radius: 9px; padding: 0 15px; }
.dashboard-toolbar .period-button.active { background: var(--dashboard-purple) !important; box-shadow: 0 7px 16px rgba(75, 42, 136, .22); }

.dashboard-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.dashboard-sales-card {
  position: relative;
  grid-column: span 2;
  grid-row: span 2;
  min-height: 292px;
  display: flex;
  flex-direction: column;
  padding: 24px;
  overflow: hidden;
  border: 0 !important;
  background: linear-gradient(135deg, #ff6900 0%, #ff8430 56%, #ff9f46 100%) !important;
  box-shadow: 0 18px 38px rgba(232, 102, 10, .24) !important;
  color: #fff;
}

.dashboard-sales-card::before,
.dashboard-sales-card::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 50%;
}

.dashboard-sales-card::before { width: 280px; height: 280px; right: -105px; top: -135px; }
.dashboard-sales-card::after { width: 190px; height: 190px; right: -50px; top: -90px; }
.dashboard-sales-head,
.dashboard-metric-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dashboard-sales-head span { color: rgba(255, 255, 255, .88); font-size: 13px; font-weight: 800; }
.dashboard-sales-head i { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: rgba(255, 255, 255, .17); font-size: 20px; }
.dashboard-sales-card > strong { position: relative; z-index: 1; margin-top: 18px; color: #fff; font: 850 clamp(30px, 3vw, 43px)/1.05 "Manrope"; letter-spacing: -1.3px; }
.dashboard-sales-card > p { position: relative; z-index: 1; margin: 7px 0 0; color: rgba(255, 255, 255, .8) !important; font-size: 12px; }
.dashboard-sales-card .dashboard-sparkline { position: relative; z-index: 1; width: 100%; height: 64px; margin: 14px 0 12px; }
.dashboard-sales-footer { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: auto; }
.dashboard-sales-footer span { padding: 11px 12px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 12px; background: rgba(110, 37, 0, .12); backdrop-filter: blur(4px); }
.dashboard-sales-footer small,
.dashboard-sales-footer b { display: block; color: #fff !important; }
.dashboard-sales-footer small { margin-bottom: 3px; opacity: .78; font-size: 9px !important; }
.dashboard-sales-footer b { font-size: 13px; }

.dashboard-metric-card {
  position: relative;
  min-height: 139px;
  padding: 17px;
  overflow: hidden;
  background: #fff !important;
}
.dashboard-metric-card.orange { background: linear-gradient(145deg, #fff 20%, #fff8f1 100%) !important; }
.dashboard-metric-card.purple { background: linear-gradient(145deg, #fff 20%, #f8f5ff 100%) !important; }
.dashboard-metric-head span { color: #555a6c; font-size: 11.5px; font-weight: 800; }
.dashboard-metric-head i { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 10px; font-size: 18px; }
.dashboard-metric-card.orange .dashboard-metric-head i { color: #d96500; background: #ffead6; }
.dashboard-metric-card.purple .dashboard-metric-head i { color: var(--dashboard-purple); background: #ece6f8; }
.dashboard-metric-card > strong { position: relative; z-index: 2; display: block; margin-top: 10px; color: #211a38 !important; font: 850 24px/1.1 "Manrope"; letter-spacing: -.7px; }
.dashboard-metric-card > small { position: relative; z-index: 2; display: block; margin-top: 4px; color: #7a7f8e !important; font-size: 9.5px !important; }
.dashboard-sparkline { overflow: visible; }
.dashboard-sparkline polyline { fill: none; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.dashboard-sparkline.orange polyline { stroke: var(--dashboard-orange); }
.dashboard-sparkline.purple polyline { stroke: var(--dashboard-purple-2); }
.dashboard-sparkline.light polyline { stroke: rgba(255, 255, 255, .9); }
.dashboard-metric-card .dashboard-sparkline { position: absolute; right: 14px; bottom: 12px; width: 45%; height: 38px; opacity: .72; }
.dashboard-card-orbit { position: absolute; width: 82px; height: 82px; right: -31px; bottom: -36px; border: 11px solid #f1ecf9; border-radius: 50%; }
.dashboard-metric-card.orange .dashboard-card-orbit { border-color: #fff0df; }

.dashboard-status-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 14px;
  overflow: hidden;
  border: 1px solid var(--surface-border);
  border-radius: 16px;
  background: var(--surface-border);
  box-shadow: 0 5px 18px rgba(47, 37, 83, .045);
}
.dashboard-status-strip > span { display: flex; align-items: center; gap: 7px; min-height: 48px; padding: 10px 14px; background: #fff; color: #666b7c; font-size: 10.5px; }
.dashboard-status-strip i { color: var(--dashboard-purple); font-size: 18px; }
.dashboard-status-strip b { color: #211a38; font-size: 12px; }
.dashboard-status-strip .attention i { color: #c47a08; }
.dashboard-status-strip .danger i { color: #d04e64; }

.metrics-chart-card,
.dashboard-ranking,
.dashboard-clicks-card { background: #fff !important; }
.metrics-chart-card { margin-top: 14px; padding: 22px; }
.metric-chart { border-top-color: #e4e0eb; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 54px, rgba(89, 75, 128, .075) 55px); }
.metric-chart-bars .publications { background: linear-gradient(to top, #ff7900, #ffaf62); }
.metric-chart-bars .clicks { background: linear-gradient(to top, #4b2a88, #876bca); }
.metric-chart-bars .orders { background: linear-gradient(to top, #25153f, #684899); }
.metric-chart-bars i { min-width: 3px; box-shadow: 0 3px 8px rgba(63, 40, 111, .09); }

.dashboard-insights-grid { grid-template-columns: 1.35fr 1fr 1fr; }
.dashboard-ranking { padding: 20px; }
.dashboard-ranking-row { grid-template-columns: 32px minmax(0, 1fr) auto; min-height: 59px; }
.dashboard-ranking-row > em { color: #a09bae; font-size: 9px; font-style: normal; font-weight: 800; }
.dashboard-product-thumb { display: grid; place-items: center; width: 34px; height: 34px; overflow: hidden; border: 1px solid #e6e1eb; border-radius: 10px; background: #fff; }
.dashboard-product-thumb img { width: 100%; height: 100%; object-fit: contain; }
.dashboard-product-thumb i { color: #8d7cb6; font-size: 17px; }
.dashboard-ranking-row > b { background: #eee9f8; color: var(--dashboard-purple); }
.dashboard-ranking-row strong { color: #29213e; font-size: 11.5px; }
.dashboard-ranking-row small { color: #777b89 !important; font-size: 9.5px !important; }

@media (max-width: 1180px) {
  .dashboard-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-sales-card { grid-column: span 2; }
  .dashboard-insights-grid { grid-template-columns: 1fr 1fr; }
  .dashboard-products-ranking { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .dashboard-toolbar { align-items: stretch; flex-direction: column; }
  .dashboard-toolbar .period-selector { display: grid; grid-template-columns: repeat(4, 1fr); }
  .dashboard-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-sales-card { grid-column: 1 / -1; grid-row: auto; }
  .dashboard-status-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-insights-grid { grid-template-columns: 1fr; }
  .dashboard-products-ranking { grid-column: auto; }
}

@media (max-width: 520px) {
  .dashboard-summary-grid { grid-template-columns: 1fr; }
  .dashboard-sales-card { min-height: 280px; }
  .dashboard-status-strip { grid-template-columns: 1fr; }
  .dashboard-sales-footer { grid-template-columns: 1fr; }
}

/* Instagram destinations: keep both alternatives aligned when a label wraps. */
.modal .instagram-destination-grid {
  align-items: start;
  column-gap: 14px;
}

.modal .instagram-destination-grid > .form-row {
  grid-template-rows: 44px 48px auto;
  align-content: start;
  margin-block: 12px;
}

.modal .instagram-destination-grid > .form-row > label {
  display: flex;
  align-items: flex-end;
  min-height: 44px;
  margin: 0;
}

.modal .instagram-destination-grid > .form-row > input,
.modal .instagram-destination-grid > .form-row > select,
.modal .instagram-select-control {
  height: 48px !important;
  margin: 0;
  border-radius: 14px !important;
}

.modal .instagram-select-control {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
  background: #fff;
}

.modal .instagram-select-control > select {
  width: 100%;
  height: 100%;
  padding: 0 42px 0 12px;
  border: 0;
  border-radius: inherit;
  outline: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
}

.modal .instagram-select-control > .material-symbols-rounded {
  position: absolute;
  top: 50%;
  right: 12px;
  color: #8991a3;
  font-size: 20px;
  pointer-events: none;
  transform: translateY(-50%);
}

.modal .instagram-select-control:focus-within {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(255,121,0,.12);
}

.modal .instagram-destination-grid > .form-row > small {
  min-height: 40px;
  padding-top: 3px;
}

@media (max-width: 640px) {
  .modal .instagram-destination-grid > .form-row {
    grid-template-rows: auto 48px auto;
  }

  .modal .instagram-destination-grid > .form-row > label {
    min-height: 0;
  }
}

/* Dark modal contrast — keep modal copy readable over the navy surface */
.modal {
  color: #f8f7ff !important;
}

.modal h2,
.modal > h3,
.modal .stack-form > h3,
.modal .modal-section-title {
  color: #ffffff !important;
  font-size: 23px !important;
  font-weight: 850 !important;
}

.modal > p,
.modal .stack-form > p,
.modal .affiliate-path span,
.modal .selected-store-card span,
.modal .connection-copy,
.modal .connection-copy p {
  color: #c4c8d5 !important;
  font-size: 12.5px !important;
  font-weight: 620 !important;
  line-height: 1.55;
}

.modal .insight {
  background: #211b38 !important;
  border-color: #493271 !important;
}

.modal .insight strong,
.modal .affiliate-path strong,
.modal .selected-store-card strong,
.modal .connect-step strong,
.modal .whatsapp-connect-box > strong {
  color: #ffffff !important;
  font-size: 13.5px !important;
  font-weight: 820 !important;
}

.modal .insight p,
.modal .insight small,
.modal .connect-step span,
.modal .whatsapp-connect-box > p {
  color: #c8c4d5 !important;
  font-size: 12px !important;
  font-weight: 620 !important;
}

.modal .form-row > label,
.modal .stack-form .form-row > label,
.modal .field-label,
.modal summary {
  color: #f2effb !important;
}

.modal .form-row > small,
.modal .stack-form .form-row > small,
.modal > .muted-note,
.modal .advanced-fields > .muted-note {
  color: #bec3d0 !important;
}

.modal-close {
  background: #252b3b !important;
  color: #ffffff !important;
  border: 1px solid #3b4356 !important;
}

.modal-close:hover {
  background: #ff7900 !important;
  color: #ffffff !important;
}

.modal button:disabled,
.modal .button:disabled {
  color: #aeb4c2 !important;
  opacity: .78;
}

/* Planos e cobrança */
.plans-current{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.8fr);gap:28px;border-top:5px solid #ff7900;background:linear-gradient(125deg,#fff 0%,#fff8f0 58%,#f5efff 100%)}
.plans-current-main{display:flex;flex-direction:column;gap:14px}.plans-current-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.plans-current-title h2{font-size:30px;margin:2px 0 3px}.plans-current-title p{color:#555b6f;font-weight:650}.plans-current-price{display:flex;align-items:baseline;gap:5px}.plans-current-price strong{font-size:31px;color:#ff6500}.plans-current-price span{color:#6b6579;font-weight:700}.usage-heading{display:flex;justify-content:space-between;color:#29223f;font-size:14px;font-weight:800}.plans-usage{height:11px;background:#e9e4ef}.plans-usage i{background:linear-gradient(90deg,#ff7900,#5b21b6)}
.capacity-alert{display:flex;gap:14px;align-items:flex-start;padding:20px;border-radius:18px;border:1px solid}.capacity-alert>.material-symbols-rounded{font-size:27px}.capacity-alert strong{display:block;font-size:15px;margin-bottom:5px}.capacity-alert p{color:#555b6f;font-size:12.5px;font-weight:620;line-height:1.55}.capacity-alert.healthy{background:#edfff7;border-color:#91dfbd;color:#087757}.capacity-alert.attention{background:#fff7e8;border-color:#ffc768;color:#9b5b00}.capacity-alert.full{background:#fff0f1;border-color:#ff9aa3;color:#b42336}
.upgrade-banner{display:flex;align-items:center;gap:15px;margin:14px 0;padding:18px 20px;border-radius:18px;background:linear-gradient(110deg,#30165f,#5b21b6 65%,#ff7900);color:#fff;box-shadow:0 14px 35px rgba(65,32,125,.2)}.upgrade-banner>div{flex:1}.upgrade-banner strong{font-size:16px}.upgrade-banner p{font-size:12px;opacity:.9;margin-top:4px}.upgrade-banner .button{background:#fff;color:#3b176f}
.plans-section-head{margin:28px 0 15px}.plans-section-head h2{font-size:24px;margin:3px 0}.plans-section-head p{color:#555b6f;font-size:13px;font-weight:620}.plans-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.plan-card{display:flex;flex-direction:column;gap:16px;padding:22px;border:1.5px solid #d7d0e2;border-radius:22px;background:#fff;box-shadow:0 12px 32px rgba(42,28,75,.08);position:relative;overflow:hidden}.plan-card:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:#5b21b6}.plan-card.featured:before{background:#ff7900}.plan-card.current{border-color:#ff7900;box-shadow:0 16px 40px rgba(255,121,0,.14)}.plan-card-top{display:flex;justify-content:space-between;gap:10px}.plan-kicker{display:block;color:#ff6500;font-size:10px;font-weight:900;letter-spacing:.11em}.plan-card h2{font-size:23px;margin:4px 0}.plan-card p{color:#555b6f;font-size:12px;font-weight:620;line-height:1.5}.plan-price{display:flex;align-items:baseline;gap:5px}.plan-price strong{font-size:30px;color:#25183e}.plan-price span{color:#747080;font-weight:700}.plan-capacity{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;background:#f7f3ff;color:#4d2297}.plan-capacity>.material-symbols-rounded{font-size:25px}.plan-capacity strong,.plan-capacity small{display:block}.plan-capacity strong{font-size:14px}.plan-capacity small{color:#5e5a69;margin-top:3px;font-size:11px;font-weight:650}.plan-channel-limits{display:flex;gap:8px;flex-wrap:wrap}.plan-channel-limits span{padding:7px 9px;border:1px solid #ded7e8;border-radius:9px;color:#4e465a;font-size:11px;font-weight:700}.channel-usage{margin:10px 0 0;color:#61596d;font-size:12px;font-weight:650}.plan-features{display:grid;gap:9px;margin:0;padding:0;list-style:none}.plan-features li{display:flex;align-items:center;gap:8px;color:#3e394b;font-size:12px;font-weight:700}.plan-features .material-symbols-rounded{font-size:17px;color:#0b9369}.plan-action{width:100%;margin-top:auto}.plan-action:disabled{opacity:1;background:#f0edf4;color:#6c6578;border-color:#d5cfdd}
.capacity-section{margin-top:24px}.capacity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.capacity-card{padding:16px;border:1.5px solid #d8d2e0;border-radius:15px;background:#fbfafc}.capacity-card-head,.capacity-numbers{display:flex;justify-content:space-between;align-items:center;gap:10px}.capacity-card-head strong,.capacity-card-head small{display:block}.capacity-card-head strong{color:#29223f;font-size:14px}.capacity-card-head small{color:#666174;margin-top:3px;font-size:11px;font-weight:650}.capacity-numbers{margin:13px 0 7px}.capacity-numbers b{color:#302745;font-size:13px}.capacity-numbers span{color:#6a6573;font-size:11px;font-weight:700}.capacity-card .progress{height:8px}.capacity-card .progress i.success{background:#11a879}.capacity-card .progress i.warning{background:#f3a316}.capacity-card .progress i.danger{background:#e94d61}.billing-explainer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:16px}.billing-explainer>div{display:flex;gap:13px;padding:5px}.billing-explainer .material-symbols-rounded{color:#ff6500;font-size:25px}.billing-explainer strong{display:block;color:#29223f;font-size:14px;margin-bottom:4px}.billing-explainer p{color:#5b5668;font-size:12px;font-weight:620;line-height:1.55}.plans-empty{grid-column:1/-1;padding:24px;text-align:center;border:1px dashed #cfc6dc;border-radius:15px}.plans-empty p{color:#686274;margin-top:4px}
@media(max-width:1250px){.plans-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:1050px){.plans-current{grid-template-columns:1fr}.capacity-grid,.billing-explainer{grid-template-columns:1fr}}@media(max-width:700px){.plans-grid{grid-template-columns:1fr}}

/* Sidebar interaction and logo contrast */
.sidebar .brand {
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 2px 4px 26px;
  text-align: center;
}

.sidebar .brand > div:last-child {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.sidebar .brand strong {
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -.8px;
}

.sidebar .brand span {
  margin-top: 5px;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 650;
}

.brand-mark.brand-logo {
  width: 150px;
  max-width: calc(100% - 60px);
  height: auto;
  aspect-ratio: 820 / 700;
  flex: none;
  padding: 0;
  background: transparent !important;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 16px 38px rgba(255, 121, 0, .3);
}

.brand-mark.brand-logo img {
  object-fit: fill;
  border-radius: 24px;
}

.sidebar button.nav-item:hover {
  color: #fff !important;
  background: rgba(255, 121, 0, .2) !important;
  border-color: rgba(255, 173, 79, .42) !important;
}

.sidebar button.nav-item:hover > .material-symbols-rounded {
  color: #fff !important;
}

.sidebar button.nav-item.active,
.sidebar button.nav-item.active:hover {
  color: #fff !important;
  background: #ff7900 !important;
  border-color: #ff9a2b !important;
  box-shadow: 0 12px 28px rgba(255, 121, 0, .32) !important;
}

.sidebar button.nav-item.active > .material-symbols-rounded,
.sidebar button.nav-item.active:hover > .material-symbols-rounded {
  color: #fff !important;
}

/* OptiFlow-inspired brand palette — keep this block last */
:root {
  --brand-purple-deep: #281650;
  --brand-purple: #3b1f78;
  --brand-navy: #101a35;
  --brand-orange: #ff7900;
  --brand-orange-bright: #ff9418;
  --brand-surface: #f6f5f2;
  --brand-value: #7a7f8d;
  --brand-ink: #19162a;
  --brand-border: #d8d6df;
}

body,
.app-main,
.page-shell {
  background: var(--brand-surface) !important;
}

.sidebar {
  background: var(--brand-purple-deep) !important;
  border-right-color: rgba(255,255,255,.14) !important;
}

.brand-mark,
.profile-avatar {
  background: var(--brand-orange) !important;
  color: var(--brand-navy) !important;
}

.page-head > div:first-child::before {
  background: var(--brand-orange) !important;
}

.page-head h1,
.card-head h2,
.store-section-head h2,
.card > h2,
.card > h3,
.store-card h3 {
  color: var(--brand-ink) !important;
}

.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.ranking-offer-card,
.advanced-fields,
.category-picker {
  background: #fff !important;
  border-color: var(--brand-border) !important;
}

.button.primary,
button.primary,
.strategy-tab.active,
.period-button.active {
  background: var(--brand-orange) !important;
  border-color: var(--brand-orange) !important;
  color: #fff !important;
  box-shadow: 0 9px 20px rgba(255,121,0,.22) !important;
}

.button.primary:hover,
button.primary:hover {
  background: #e96f00 !important;
  border-color: #e96f00 !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--brand-orange) !important;
  box-shadow: 0 0 0 3px rgba(255,121,0,.14) !important;
}

.choice-grid .choice-pill.selected,
.choice-grid .choice-pill:has(input:checked),
.category-picker label:has(input:checked),
.highlight-row:has(input:checked) {
  background: #fff2e5 !important;
  border-color: var(--brand-orange) !important;
  color: #9b4900 !important;
  box-shadow: 0 0 0 2px rgba(255,121,0,.12) !important;
}

.choice-grid .choice-pill.selected span,
.choice-grid .choice-pill:has(input:checked) span,
.category-picker label:has(input:checked) span,
.highlight-row:has(input:checked) span {
  color: #9b4900 !important;
}

.tag.purple,
.tag.network {
  color: var(--brand-purple) !important;
  background: #eee9f8 !important;
  border-color: #b8abd2 !important;
}

.kpi-grid > .kpi:nth-child(odd),
.balance-grid > .balance-card:nth-child(odd) {
  border-top-color: var(--brand-purple) !important;
}

.kpi-grid > .kpi:nth-child(even),
.balance-grid > .balance-card:nth-child(even),
.store-grid .store-card {
  border-top-color: var(--brand-orange) !important;
}

.form-row > label,
.field-label,
.kpi-label {
  color: var(--brand-ink) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea,
.card .kpi-value,
.metric-card strong,
.summary-card strong,
.balance-card b,
.stat-row > b,
.stat-row > strong,
.market-stat-value {
  color: var(--brand-value) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  font-weight: 500 !important;
}

input::placeholder,
textarea::placeholder {
  color: #a0a4af !important;
}

a,
.link-button {
  color: var(--brand-purple);
}

/* Field content hierarchy — values are softer than their labels */
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  color: #6b7280 !important;
  font-weight: 550 !important;
}

input::placeholder,
textarea::placeholder {
  color: #9297a7 !important;
  opacity: 1;
}

select option {
  color: #6b7280;
  background: #fff;
}

/* Secondary card content — separate values from dark titles everywhere */
.card input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
.card select,
.card textarea,
.metric-card input,
.summary-card input {
  color: #858b9a !important;
  font-weight: 500 !important;
}

.card input::placeholder,
.card textarea::placeholder {
  color: #9ba0ae !important;
  font-weight: 500 !important;
}

.card .kpi-value,
.metric-card strong,
.summary-card strong,
.balance-card b,
.stat-row > b,
.stat-row > strong,
.market-stat-value {
  color: #6f7585 !important;
  font-weight: 700 !important;
}

.card .kpi-label,
.metric-card span,
.summary-card span,
.balance-card span,
.stat-row > span {
  color: #777d8d !important;
}

.card select option {
  color: #858b9a;
  font-weight: 500;
}

/* Global legibility pass — stronger hierarchy across every dashboard page */
.sidebar button.nav-item {
  min-height: 48px;
  font-size: 15.5px;
  font-weight: 780;
}

.nav p {
  color: #d2cbf1;
  font-size: 10.5px;
  font-weight: 850;
}

.card-head h2,
.store-section-head h2,
.card > h2,
.card > h3 {
  color: #211a38 !important;
  font-size: 19px !important;
  font-weight: 850 !important;
  line-height: 1.25;
}

.card-head p,
.store-section-head p,
.card p,
.card small {
  color: #555b6f !important;
}

.card-head p,
.store-section-head p {
  font-size: 12.5px !important;
  font-weight: 620;
}

.form-row > label,
.field-label,
label.field-label {
  color: #403951 !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  line-height: 1.35;
}

.form-row small,
.muted-note,
.field-help {
  color: #666b7c !important;
  font-size: 11px !important;
  font-weight: 560;
  line-height: 1.5;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  color: #211a38 !important;
  font-size: 13.5px !important;
  font-weight: 650;
}

.choice-grid .choice-pill,
.category-picker label,
.highlight-row {
  min-height: 48px;
  padding: 11px 13px;
}

.choice-grid .choice-pill,
.choice-grid .choice-pill span,
.category-picker label,
.category-picker label span,
.highlight-row,
.highlight-row span {
  color: #29223f !important;
  font-size: 14px !important;
  font-weight: 820 !important;
  line-height: 1.3;
}

.modal .choice-pill span {
  color: #29223f !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
}

.category-compact-main strong,
.category-compact-card strong {
  color: #211a38 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

.category-compact-main small,
.category-compact-card small {
  color: #606578 !important;
  font-size: 11px !important;
  font-weight: 600;
}

.strategy-tab,
.period-button,
.button,
button {
  font-size: 12.5px;
  font-weight: 800;
}

.kpi-label {
  color: #4e5368 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.kpi-value,
.balance-card b {
  font-size: 27px !important;
  line-height: 1.1;
}

.store-card h3 {
  font-size: 16.5px !important;
}

.store-card p,
.store-card .store-guide {
  color: #575d70 !important;
  font-size: 12px !important;
  line-height: 1.5;
}

table thead th {
  color: #443a68 !important;
  font-size: 11.5px !important;
}

table tbody td {
  color: #2d2740 !important;
  font-size: 12.5px;
  font-weight: 600;
}

.tag {
  font-size: 10.5px;
  font-weight: 800;
}

@media (max-width: 860px) {
  .sidebar button.nav-item { font-size: 15px; }
  .choice-grid .choice-pill,
  .choice-grid .choice-pill span,
  .category-picker label,
  .category-picker label span { font-size: 13px !important; }
}

/* Definitive global type scale — must remain last to override legacy rules */
.form-row > label,
.stack-form .form-row > label,
.grid .form-row > label,
.field-label,
label.field-label {
  color: #201936 !important;
  font-size: 15.5px !important;
  font-weight: 850 !important;
}

.form-row > small,
.stack-form .form-row > small,
.muted-note,
.field-help {
  color: #4e5366 !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

.card-head h2,
.store-section-head h2,
.card > h2,
.card > h3 {
  color: #211a38 !important;
  font-size: 21px !important;
  font-weight: 850 !important;
}

.card-head p,
.store-section-head p {
  color: #505568 !important;
  font-size: 13px !important;
  font-weight: 620 !important;
}

.choice-grid .choice-pill,
.choice-grid .choice-pill span,
.category-picker label,
.category-picker label span,
.highlight-row,
.highlight-row span {
  color: #29223f !important;
  font-size: 15px !important;
  font-weight: 820 !important;
}

.category-compact-main strong,
.category-compact-card strong {
  color: #211a38 !important;
  font-size: 15.5px !important;
  font-weight: 850 !important;
}

.category-compact-main small,
.category-compact-card small,
.store-card p,
.store-card .store-guide {
  color: #555b6f !important;
  font-size: 12.5px !important;
  font-weight: 620 !important;
}

.sidebar button.nav-item {
  min-height: 49px;
  color: #f4f1ff;
  font-size: 16px;
  font-weight: 780;
}

.nav p {
  color: #d6cff4;
  font-size: 11px;
  font-weight: 850;
}

.kpi-label {
  color: #4b5064 !important;
  font-size: 13.5px !important;
  font-weight: 820 !important;
}

.kpi-value,
.balance-card b {
  color: #7a7f8d !important;
  font-size: 28px !important;
}

.store-card h3 {
  color: #211a38 !important;
  font-size: 17px !important;
  font-weight: 850 !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  color: #7a7f8d !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

table thead th {
  color: #40375f !important;
  font-size: 12px !important;
}

table tbody td {
  color: #2b253e !important;
  font-size: 13px;
  font-weight: 600;
}