/* Shared neutral palette. Tenant-supplied brand accents remain opt-in. */
:root {
  --ink: #1a1c1f;
  --muted: #6b7280;
  --line: #e7e7e8;
  --paper: #ffffff;
  --soft: #f7f7f8;
  --dark: #1a1c1f;
  --warm-ivory: #ffffff;
  --warm-taupe: #d4d4d8;
  --warm-brown: #3f3f46;
  --accent: #52525b;
  --focus: #6b7280;
}
body, .workspace-bar, .chat-home .workspace-bar, .chat-home .view { background: #fff; }
.sidebar { background: #fafafa; }
.sidebar .nav-list a.active, .sidebar .sidebar-secondary-nav a.active { background: #ededee; color: var(--ink); }
.sidebar-new-chat:hover, .saved-audience-link:hover, .nav-collapsed #menu-btn:hover { background: #ededee; }

/* Settings keep navigation in one quiet column, with one active panel. */
.settings-page .view { max-width: none; padding: 0; }
.settings-shell { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: calc(100dvh - 50px); }
.settings-menu { min-width: 0; height: calc(100dvh - 50px); position: sticky; top: 50px; overflow-y: auto; overscroll-behavior: contain; padding: 24px 14px 28px; border-right: 1px solid var(--line); background: #fafafa; }
.settings-menu-heading { padding: 0 10px; margin-bottom: 20px; }
.settings-menu-heading h1 { margin: 0; color: var(--ink); font-size: 19px; font-weight: 650; line-height: 1.4; letter-spacing: -.03em; }
.settings-menu-toggle { display: none; }
.settings-search { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 11px; border: 1px solid transparent; border-radius: 20px; background: #eeeef0; color: #85858c; }
.settings-search svg { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.settings-search:focus-within { border-color: #a1a1aa; }
.settings-search input { width: 100%; min-width: 0; border: 0; outline: none; background: transparent; color: var(--ink); font-size: 14px; line-height: 1.5; }
.settings-search input:focus-visible { outline: none; }
.settings-search input::placeholder { color: #85858c; }
.settings-nav-group { margin-top: 23px; }
.settings-nav-group > p { margin: 0 10px 7px; color: #84848c; font-size: 12px; font-weight: 500; line-height: 1.5; }
.settings-nav-group a { display: flex; align-items: center; gap: 10px; min-height: 37px; padding: 8px 10px; border-radius: 8px; color: #4b4b52; font-size: 14px; line-height: 1.4; text-decoration: none; transition: background .15s; }
.settings-nav-group a:hover { background: #f0f0f1; color: var(--ink); }
.settings-nav-group a.active { background: #ebebed; color: var(--ink); font-weight: 600; }
.settings-nav-group svg { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.settings-nav-group [hidden], .settings-navigation [hidden] { display: none !important; }
.settings-search-empty { padding: 10px; color: var(--muted); font-size: 14px; }
.settings-panel { min-width: 0; padding: 50px clamp(28px, 5vw, 88px) 80px; }
.settings-content { width: 100%; max-width: 1000px; margin-inline: auto; min-width: 0; }
.settings-content > * { min-width: 0; }
.settings-content :is(.access-heading, .rl-modules__header, .rl-ai-connections__intro, .rl-crm-intro, .rl-branding-intro, .rl-brand-kit-intro, .rl-compliance-head, .rl-billing-header, .settings-panel-heading, .rl-email-hero) { margin: 0 0 32px; padding: 0; }
.settings-content :is(.access-heading h2, .rl-modules__intro h2, .rl-ai-connections__intro h2, .rl-crm-intro h2, .rl-branding-intro h2, .rl-brand-kit-intro h2, .rl-compliance-head h1, .rl-billing-header h2, .settings-panel-heading h2, .rl-email-hero h1, .rl-email-hero h2) { margin: 0 0 9px; color: var(--ink); font-size: 27px; font-weight: 600; line-height: 1.25; letter-spacing: -.035em; }
.settings-content :is(.access-heading p, .settings-panel-heading p, .rl-billing-header p, .rl-crm-intro p, .rl-branding-intro p, .rl-brand-kit-intro p, .rl-ai-connections__lede, .rl-modules__lede, .rl-email-hero p, .rl-compliance-lede) { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.settings-content :is(.access-mark, .rl-billing-eyebrow, .rl-ai-connections__eyebrow, .rl-brand-kit-intro .section-label, .rl-branding-intro .section-label, .rl-compliance-kicker) { display: none; }
.settings-content :is(.rl-modules, .rl-ai-connections, .account-access-settings, .rl-crm, .rl-billing, .rl-compliance) { max-width: none; padding-top: 0; }
.settings-content :is(.card, .access-card, .rl-billing-card, .rl-billing-plan, .rl-compliance-card, .rl-crm-card, .rl-crm-preview, .rl-email-card, .rl-mailbox-studio) { border-color: var(--line); border-radius: 14px; background: #fff; box-shadow: none; }
.settings-content :is(.card-heading, .rl-email-card-heading) { gap: 16px; }
.settings-content :is(.card-heading h2, .rl-compliance-card h2, .rl-email-card h2) { font-size: 17px; font-weight: 600; letter-spacing: -.02em; }
.settings-content .helper, .settings-content .card-heading p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.settings-content .button { padding: 8px 13px; min-height: 37px; font-size: 14px; font-weight: 550; border-color: #e0e0e3; border-radius: 8px; }
.settings-content .button:hover { background: #f4f4f5; border-color: #c7c7cc; }
.settings-content .button-dark { background: var(--brand-accent, var(--ink)); border-color: var(--brand-accent, var(--ink)); }
.settings-content .button-dark:hover { background: var(--brand-accent, var(--ink)); filter: brightness(.92); }
.settings-content .field :is(input, select, textarea) { min-width: 0; font-size: 14px; border-color: #dedee1; border-radius: 8px; }
.settings-content .field label { color: #52525b; font-size: 13px; font-weight: 550; }
.settings-content .badge { font-size: 11px; letter-spacing: .01em; text-transform: none; background: #f2f2f3; }
.settings-content .panel-actions { border-color: var(--line); }

/* Account preferences use compact rows with a clear control on the right. */
.settings-content .account-access-settings { max-width: 820px; }
.settings-content .access-card { padding: 22px; margin-bottom: 24px; }
.settings-content .access-card .card-heading { margin-bottom: 8px; padding: 0 0 15px; border-bottom: 1px solid var(--line); align-items: flex-start; }
.settings-content .access-card .card-heading p { margin: 5px 0 0; }
.settings-content .access-row { padding: 14px 0; border-color: var(--line); gap: 12px; }
.settings-content .access-row-main strong { font-size: 14px; font-weight: 550; }
.settings-content .access-row-main span { font-size: 13px; }
.settings-content .access-badge { font-size: 12px; background: #f4f4f5; }
.settings-content .access-empty { padding: 18px 0 8px; font-size: 14px; }
.settings-content .access-preferences { display: block; }
.settings-content .access-preferences .access-preference-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; padding: 16px 0; margin: 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.access-preference-row > span { display: grid; gap: 3px; }
.access-preference-row strong { color: var(--ink); font-size: 14px; font-weight: 550; }
.access-preference-row small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.settings-content .access-preference-row input { appearance: none; -webkit-appearance: none; position: relative; display: block; flex: 0 0 34px; width: 34px; height: 20px; margin: 0; border: 0; border-radius: 999px; background: #dedee2; cursor: pointer; transition: background .15s; }
.settings-content .access-preference-row input::after { content: ''; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: white; box-shadow: 0 1px 2px #0002; transition: transform .15s; }
.settings-content .access-preference-row input:checked { background: var(--ink); }
.settings-content .access-preference-row input:checked::after { transform: translateX(14px); }
.access-preference-footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 20px; }
.access-preference-footer p { max-width: 520px; margin: 0; }
.access-preference-footer button { flex: none; }

/* Existing settings modules inherit the same surfaces and spacing. */
.settings-content .rl-modules { --module-ink: var(--ink); --module-muted: var(--muted); --module-line: var(--line); --module-card: #fff; }
.settings-content .rl-module-row.is-active { background: #fafafa; }
.settings-content .rl-module-row__toggle { width: 38px; height: 24px; background: #dedee2; font-size: 0; }
.settings-content .rl-module-row__toggle::before { width: 18px; height: 18px; top: 3px; left: 3px; }
.settings-content .rl-module-row.is-active .rl-module-row__toggle { background: var(--ink); }
.settings-content .rl-module-row.is-active .rl-module-row__toggle::before { transform: translateX(14px); }
.settings-content .rl-module-row__toggle-track { font-size: 0; }
.settings-content .rl-ai-connections__panel { background: #fff; border-color: var(--line); }
.settings-content .rl-email { --email-ink: var(--ink); --email-muted: var(--muted); --email-line: var(--line); --email-card: #fff; --email-taupe: #d4d4d8; }
.settings-content .rl-email-shell { max-width: none; }
.settings-content .rl-email-step, .settings-content .rl-email-preview { background: #f7f7f8; border-color: var(--line); }
.settings-content .rl-email-step.is-current { background: #fff; }
.settings-content .rl-email-step b { color: var(--muted); }
.settings-content .rl-email-step.is-current b { color: var(--ink); }
.settings-content .rl-email-layout { grid-template-columns: minmax(0, 1fr); }
.settings-content .rl-mailbox-studio { padding: 24px; }
.settings-content .rl-brand-kit-dropzone, .settings-content .rl-brand-kit-logo-frame, .settings-content .rl-brand-kit-preview-sidebar { background: #fafafa; }
.settings-content .rl-branding-grid, .settings-content .rl-brand-kit-grid { grid-template-columns: minmax(0, 1.15fr) minmax(270px, .85fr); }
.settings-content .client-layout { grid-template-columns: minmax(0, 1fr); }
.settings-content .rl-billing-estimator { background: #fafafa; grid-template-columns: minmax(0, 1fr) auto; }
.settings-content .rl-billing-estimate-grid { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 18px; }
.settings-content .rl-billing-plan.is-featured, .settings-content .rl-billing-plan.is-selected { border-color: #a1a1aa; }
.settings-content .rl-compliance-settings-grid { grid-template-columns: minmax(0, 1fr); }
.settings-content .rl-compliance-explainer { padding: 24px; background: #fafafa; }

@media (max-width: 1100px) {
  .settings-shell { grid-template-columns: 220px minmax(0, 1fr); }
  .settings-panel { padding: 36px 28px 60px; }
  .settings-content .rl-branding-grid, .settings-content .rl-brand-kit-grid, .settings-content .rl-crm-grid { grid-template-columns: minmax(0, 1fr); }
  .settings-content .rl-brand-kit-preview-card { order: initial; }
}
@media (max-width: 700px) {
  .settings-shell { display: block; }
  .settings-menu { position: relative; top: 0; height: auto; padding: 16px 18px; overflow: visible; border-right: 0; border-bottom: 1px solid var(--line); }
  .settings-menu-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0; margin: 0; }
  .settings-menu-heading h1 { font-size: 17px; }
  .settings-menu-toggle { display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 8px; background: white; padding: 8px 11px; font-size: 13px; color: var(--ink); }
  .settings-menu-toggle svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; }
  .settings-navigation { display: none; padding-top: 20px; }
  .settings-menu.is-open .settings-navigation { display: block; }
  .settings-menu.is-open .settings-menu-toggle svg { transform: rotate(180deg); }
  .settings-navigation nav { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
  .settings-panel { padding: 30px 18px 60px; }
  .settings-content :is(.access-heading, .rl-modules__header, .rl-ai-connections__intro, .rl-crm-intro, .rl-branding-intro, .rl-brand-kit-intro, .rl-compliance-head, .rl-billing-header, .settings-panel-heading, .rl-email-hero) { margin-bottom: 25px; }
  .settings-content :is(.access-heading h2, .rl-modules__intro h2, .rl-ai-connections__intro h2, .rl-crm-intro h2, .rl-branding-intro h2, .rl-brand-kit-intro h2, .rl-compliance-head h1, .rl-billing-header h2, .settings-panel-heading h2, .rl-email-hero h1, .rl-email-hero h2) { font-size: 25px; }
  .settings-content .access-card { padding: 18px; }
  .settings-content .access-card .card-heading { flex-wrap: wrap; gap: 12px; }
  .access-preference-footer { align-items: flex-start; flex-direction: column; gap: 14px; }
  .settings-content .rl-billing-estimator { grid-template-columns: minmax(0, 1fr); }
  .settings-content .rl-branding-grid, .settings-content .rl-brand-kit-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .settings-nav-group a, .settings-content .access-preference-row input, .settings-content .access-preference-row input::after { transition: none; }
}