:root,
html[data-brand-theme="classic-green"] {
  --brand-primary: #16863d;
  --brand-primary-dark: #0c6d31;
  --brand-accent: #eaf5e8;
  --brand-text: #07264d;
  --brand-muted: #536277;
  --brand-background: #ffffff;
  --brand-surface: #f8f8f3;
  --brand-border: #dfe6e1;
  --brand-topbar: #031d3a;
}
html[data-brand-theme="warm-coral"] {
  --brand-primary: #a83b2e; --brand-primary-dark: #842b22; --brand-accent: #fbe9e5;
  --brand-text: #3d211f; --brand-muted: #705b58; --brand-background: #fffdfb;
  --brand-surface: #fff5f0; --brand-border: #ead8d1; --brand-topbar: #3d211f;
}
html[data-brand-theme="bright-blue"] {
  --brand-primary: #075ba9; --brand-primary-dark: #06477f; --brand-accent: #e6f2fb;
  --brand-text: #102b46; --brand-muted: #526779; --brand-background: #ffffff;
  --brand-surface: #f3f8fc; --brand-border: #d6e3ec; --brand-topbar: #102b46;
}
html[data-brand-theme="soft-lavender"] {
  --brand-primary: #69459a; --brand-primary-dark: #523477; --brand-accent: #f0eafb;
  --brand-text: #30253d; --brand-muted: #695f74; --brand-background: #fffefe;
  --brand-surface: #f8f5fc; --brand-border: #e2dbea; --brand-topbar: #30253d;
}
html[data-brand-theme="warm-neutral"] {
  --brand-primary: #76533b; --brand-primary-dark: #5b3d2b; --brand-accent: #f3ebe3;
  --brand-text: #342820; --brand-muted: #6a5e55; --brand-background: #fffefa;
  --brand-surface: #f8f4ed; --brand-border: #e3d9cd; --brand-topbar: #342820;
}

html[data-brand-theme] {
  --navy: var(--brand-text); --navy-deep: var(--brand-topbar); --green: var(--brand-primary);
  --green-dark: var(--brand-primary-dark); --green-soft: var(--brand-accent); --cream: var(--brand-surface);
  --line: var(--brand-border); --muted: var(--brand-muted); --white: var(--brand-background);
  --admin-navy: var(--brand-text); --admin-green: var(--brand-primary); --admin-bg: var(--brand-surface);
  --admin-border: var(--brand-border); --admin-muted: var(--brand-muted);
  --driver-navy: var(--brand-text); --driver-green: var(--brand-primary); --driver-bg: var(--brand-surface);
  --driver-border: var(--brand-border); --driver-muted: var(--brand-muted);
}
html[data-brand-theme] body { color: var(--brand-text); background-color: var(--brand-background); }
html[data-brand-theme] .section-tint,
html[data-brand-theme] .intake-shell,
html[data-brand-theme] .intake-progress-wrap,
html[data-brand-theme] .admin-body,
html[data-brand-theme] .driver-body,
html[data-brand-theme] .seller-body { background-color: var(--brand-surface); }
html[data-brand-theme] .site-footer { background: var(--brand-topbar); }
html[data-brand-theme] .final-cta { background: linear-gradient(120deg, var(--brand-topbar), var(--brand-text)); }
html[data-brand-theme] .header-cta,
html[data-brand-theme] .button,
html[data-brand-theme] .admin-button,
html[data-brand-theme] .driver-button,
html[data-brand-theme] .seller-button { background-color: var(--brand-primary); border-color: var(--brand-primary); }
html[data-brand-theme] .header-cta:hover,
html[data-brand-theme] .button:hover,
html[data-brand-theme] .seller-button:hover { background-color: var(--brand-primary-dark); border-color: var(--brand-primary-dark); }
html[data-brand-theme] .button-outline { color: var(--brand-primary-dark); background: transparent; }
html[data-brand-theme] .button-outline:hover { color: #fff; background: var(--brand-primary-dark); }
html[data-brand-theme] .button-light { color: var(--brand-text); background: #fff; border-color: #fff; }
html[data-brand-theme] .seller-button.secondary { color: var(--brand-text); background: #fff; border-color: var(--brand-border); }
html[data-brand-theme] .seller-button.danger { color: #fff; background: var(--danger); border-color: var(--danger); }
html[data-brand-theme] .admin-nav a:hover,
html[data-brand-theme] .admin-nav a:focus-visible,
html[data-brand-theme] .admin-nav a.active { color: var(--brand-primary-dark); background: var(--brand-accent); }
html[data-brand-theme] .seller-total { background: var(--brand-topbar); }

.brand-logo { display: block; width: auto; max-width: min(13rem, 36vw); height: 3rem; object-fit: contain; }
.site-header .brand-logo { max-height: 3.25rem; }
.admin-brand .brand-logo,.driver-brand .brand-logo { max-width: 10rem; height: 2.8rem; }
.seller-brand .brand-logo { max-width: 9rem; height: 2.5rem; }
.brand-name { display: block; max-width: 16rem; line-height: 1.08; overflow-wrap: anywhere; }
.brand-name small { display: block; }
.branding-theme-grid { margin: 0; padding: 0; border: 0; }
.branding-theme-grid legend { margin-bottom: .65rem; font-weight: 800; }
.branding-theme-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(10rem,1fr)); gap: .75rem; }
.branding-theme-option { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .55rem; margin: 0; padding: .8rem; border: 1px solid var(--admin-border); border-radius: .75rem; background: #fff; }
.branding-theme-option input { width: auto; }
.branding-theme-option strong { grid-column: 1/-1; }
.branding-swatches { display: flex; gap: .25rem; }
.branding-swatches i { display: block; width: 1.1rem; height: 1.1rem; border-radius: 50%; border: 1px solid rgba(0,0,0,.12); }
.branding-swatches i:nth-child(1) { background: var(--preview-primary); }
.branding-swatches i:nth-child(2) { background: var(--preview-text); }
.branding-swatches i:nth-child(3) { background: var(--preview-surface); }
.branding-media-card { display: grid; gap: 1rem; }
.branding-preview { display: block; max-width: min(100%, 42rem); max-height: 24rem; object-fit: contain; border: 1px solid var(--admin-border); border-radius: 1rem; background: var(--brand-surface); padding: .75rem; }
.branding-preview-logo { max-height: 10rem; }
.branding-site-icon-preview { display: block; width: 5rem; height: 5rem; object-fit: contain; border: 1px solid var(--admin-border); border-radius: 1rem; padding: .5rem; background: #fff; }
.branding-social-card { width: min(100%, 38rem); margin: 0; overflow: hidden; border: 1px solid var(--admin-border); border-radius: 1rem; background: #fff; box-shadow: 0 .4rem 1.2rem rgba(15,35,54,.08); }
.branding-social-card img { display: block; width: 100%; aspect-ratio: 1200/630; object-fit: cover; background: var(--brand-surface); }
.branding-social-card figcaption { display: grid; gap: .3rem; padding: 1rem; min-width: 0; }
.branding-social-card small { color: var(--admin-muted); text-transform: uppercase; letter-spacing: .06em; }
.branding-social-card strong { color: var(--brand-text); font-size: 1.1rem; overflow-wrap: anywhere; }
.branding-social-card span { color: var(--admin-muted); line-height: 1.45; overflow-wrap: anywhere; }
.branding-default-preview { display: flex; align-items: center; gap: 1rem; padding: 1rem; border: 1px dashed var(--admin-border); border-radius: 1rem; }
.branding-default-preview p { margin: 0; color: var(--admin-muted); }
@media (max-width: 430px) {
  .brand-name { max-width: 8.5rem; font-size: .9rem; }
  .site-header .brand-logo { max-width: 7.5rem; height: 2.6rem; }
  .admin-brand .brand-logo,.driver-brand .brand-logo { max-width: 7rem; }
  .branding-theme-grid { grid-template-columns: 1fr; }
  .branding-social-card { width: 100%; }
}