/* Opt-in presentation shared by Sales, Goals, SEO analysis and Sellerboard. */
.dashboard-design-toolbar { display: flex; align-items: center; justify-content: flex-end; gap: 20px; min-width: 0; }
.dashboard-design-toolbar[hidden], .dashboard-design-toolbar [hidden] { display: none !important; }
.dashboard-design-toggle {
  display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px;
  min-height: 36px; border: 1px solid var(--n6); border-radius: 6px; padding: 7px 12px;
  color: var(--n12); background: var(--n3); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer;
}
.dashboard-design-toggle:hover { border-color: var(--sky); color: var(--n14); }
.dashboard-design-toggle:focus-visible { outline: 2px solid var(--sky); outline-offset: 3px; }
.dashboard-design-toggle[aria-pressed="true"] { border-color: var(--sky); color: var(--sky); background: var(--n4); }
.dashboard-design-track { display: inline-flex; align-items: center; width: 28px; height: 16px; border-radius: 12px; padding: 3px; background: var(--n7); }
.dashboard-design-track::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--n13); transition: transform .15s; }
.dashboard-design-toggle[aria-pressed="true"] .dashboard-design-track { background: var(--sky-strong); }
.dashboard-design-toggle[aria-pressed="true"] .dashboard-design-track::after { transform: translateX(12px); background: var(--sky-fill); }

body.dashboard-design-modern {
  --design-bg: var(--n1);
  --design-panel: var(--n2);
  --design-raised: var(--n3);
  --design-border: var(--n6);
  --design-line: var(--n5);
  --design-text: var(--n14);
  --design-muted: var(--n11);
  --design-accent: var(--sky);
  --design-good: var(--teal);
  --design-warn: var(--amber);
  --design-bad: var(--red);
  min-width: 320px; padding: 0; color: var(--design-text); background: var(--design-bg);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.dashboard-design-modern .dashboard { width: 100%; max-width: none; gap: 16px; padding: 0 26px 32px; }
body.dashboard-design-modern .dashboard-design-toolbar { margin-top: 7px; }
body.dashboard-design-modern .dashboard-design-heading { margin-right: auto; }
body.dashboard-design-modern .dashboard-design-heading h1 { font-size: 31px; line-height: 1.1; letter-spacing: -.03em; }
body.dashboard-design-modern .dashboard-design-heading p { margin-top: 7px; color: var(--design-muted); font-size: 14px; line-height: 1.5; }
body.dashboard-design-modern :is(#filterPanel, #cardsRow, #products, #goalsDashboard, #seoDashboard, #seoDetailPage, #sellerboardDashboard, #periodOverlay) :focus-visible {
  outline: 2px solid var(--design-accent); outline-offset: 2px;
}
body.dashboard-design-modern :is(.seo-section, .seo-stat, .products) { border: 1px solid var(--design-border); border-radius: 7px; background: var(--design-panel); box-shadow: none; }
body.dashboard-design-modern :is(.seo-dashboard, .seo-section-head) { gap: 16px; }
body.dashboard-design-modern .seo-hero { align-items: center; min-height: 0; padding: 0 0 4px; border: 0; border-radius: 0; background: none; box-shadow: none; }
body.dashboard-design-modern .seo-hero::after { display: none; }
body.dashboard-design-modern .seo-eyebrow { color: var(--design-accent); font-size: 10px; letter-spacing: .07em; }
body.dashboard-design-modern .seo-hero h1 { margin-top: 6px; font-size: 31px; line-height: 1.15; }
body.dashboard-design-modern .seo-hero p { max-width: 1020px; margin-top: 8px; color: var(--design-muted); font-size: 13px; line-height: 1.6; }
body.dashboard-design-modern .seo-hero-note { max-width: 275px; padding: 12px 14px; border-color: var(--design-border); border-radius: 7px; color: var(--design-muted); background: var(--design-panel); font-size: 11px; }
body.dashboard-design-modern .seo-section { padding: 18px; }
body.dashboard-design-modern .seo-section-title { color: var(--design-text); font-size: 18px; }
body.dashboard-design-modern :is(.seo-section-sub, .seo-stat-label, .seo-stat-foot, .seo-search-field, .seo-filter-field, .seo-model-field, .seo-model-save-status, .seo-month-wrap, .seo-batch-note) { color: var(--design-muted); }
body.dashboard-design-modern .seo-stat-grid { gap: 14px; }
body.dashboard-design-modern .seo-stat { min-height: 100px; padding: 16px; background: var(--n3); }
body.dashboard-design-modern .seo-stat-label { font-size: 10px; letter-spacing: .035em; }
body.dashboard-design-modern .seo-stat-value { margin-top: 9px; font-size: 27px; font-weight: 750; }
body.dashboard-design-modern .seo-stat-foot { margin-top: 7px; line-height: 1.4; }
body.dashboard-design-modern .seo-stat-value.good { color: var(--design-good); }
body.dashboard-design-modern .seo-stat-value.warn { color: var(--design-warn); }
body.dashboard-design-modern .seo-stat-value.risk { color: var(--design-bad); }
body.dashboard-design-modern :is(.seo-search, .seo-filter-select, .seo-model-select, .seo-month) { min-height: 40px; border-color: var(--design-border); border-radius: 6px; color: var(--n13); background: var(--n1); color-scheme: var(--color-scheme); }
body.dashboard-design-modern input::placeholder { color: var(--n10); }
body.dashboard-design-modern :is(.seo-tool-btn, .seo-retry-btn) { min-height: 36px; border-color: var(--design-border); border-radius: 6px; color: var(--n13); background: var(--design-raised); }
body.dashboard-design-modern :is(.seo-tool-btn, .seo-retry-btn):hover:not(:disabled) { border-color: var(--sky); background: var(--n5); }
body.dashboard-design-modern :is(.seo-batch-btn, .seo-audit-btn) { min-height: 36px; border-color: var(--sky); border-radius: 6px; color: var(--on-fill); background: var(--design-accent); }
body.dashboard-design-modern :is(.seo-batch-btn, .seo-audit-btn):hover:not(:disabled) { border-color: var(--teal); background: var(--teal-fill); }
body.dashboard-design-modern :is(.seo-loading, .seo-empty, .empty, .seo-no-audit) { border-color: var(--design-border); color: var(--design-muted); }
body.dashboard-design-modern .seo-error { border-color: var(--red-strong); color: var(--red); background: var(--n3); }
body.dashboard-design-modern :is(.seo-batch-progress, .seo-usage-card) { border-color: var(--sky-strong); color: var(--n13); background: var(--n4); }
body.dashboard-design-modern :is(.seo-batch-progress-track, .plan-progress) { background: var(--n6); }
body.dashboard-design-modern .seo-batch-progress-track span { background: var(--design-accent); }
body.dashboard-design-modern :is(.spin, .goals-number-spinner) { border-color: var(--n6); border-top-color: var(--design-accent); }
body.dashboard-design-modern :is(.goals-progress::after, .filter-progress::after) { background: var(--design-accent); }

@media (max-width: 900px) {
  body.dashboard-design-modern .seo-hero { align-items: flex-start; flex-direction: column; gap: 12px; }
  body.dashboard-design-modern .seo-hero-note { max-width: none; width: 100%; }
  body.dashboard-design-modern .seo-section-head { flex-wrap: wrap; }
  body.dashboard-design-modern :is(.seo-catalog-tools, .seo-plan-tools) { flex-basis: 100%; width: 100%; }
}
@media (max-width: 700px) {
  body.dashboard-design-modern .dashboard { gap: 12px; padding: 0 12px 24px; }
  body.dashboard-design-modern .global-shell .user-chip { order: 3; }
  body.dashboard-design-modern .dashboard-design-toolbar { flex-wrap: wrap; gap: 12px; }
  body.dashboard-design-modern :is(.dashboard-design-heading h1, .seo-hero h1) { font-size: 25px; }
  body.dashboard-design-modern .dashboard-design-heading p { font-size: 12px; }
  body.dashboard-design-modern .seo-section { padding: 12px; }
  body.dashboard-design-modern .seo-stat-grid { gap: 8px; }
  body.dashboard-design-modern .seo-stat { min-height: 94px; padding: 12px; }
  body.dashboard-design-modern .seo-stat-value { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .dashboard-design-track::after { transition: none; }
  body.dashboard-design-modern :is(.card, .plan-row, .plan-category-chevron, .plan-progress > span, .seo-listing-row) { transition: none; }
}
