/* ============================================================
   SocialBar — Indigo design system (site-wide)
   Tokens: accent #6366F1, gradient #7C3AED→#6366F1, bg #F8FAFC
   ============================================================ */

:root {
    --sb-accent: #6366F1;
    --sb-accent-hover: #5558E0;
    --sb-accent-deep: #7C3AED;
    --sb-surface: #FFFFFF;
    --sb-bg: #F8FAFC;
    --sb-text-primary: #0F172A;
    --sb-text-secondary: #334155;
    --sb-text-muted: #64748B;
    --sb-bg-dark: #020617;
    --sb-border: #E2E8F0;
    --sb-shadow-card: 0 10px 15px -3px rgb(15 23 42 / 0.08), 0 4px 6px -4px rgb(15 23 42 / 0.08);
    --sb-radius-card: 20px;
    --sb-radius-pill: 9999px;
    --sb-fs-hero: 56px;
    --sb-fs-section: 28px;
    --sb-fs-body: 15px;
    --sb-fs-small: 13px;
    --sb-lh-heading: 1.1;
    --sb-lh-section: 1.2;
    --sb-lh-body: 1.6;
    --sb-fw-heading: 700;
    --sb-fw-body: 400;
    --sb-font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --sb-grad: linear-gradient(to bottom, #7C3AED, #6366F1);
    --sb-purple: #6366F1;
    --sb-purple-700: #5558E0;
    --sb-purple-800: #4F46E5;
    --sb-purple-900: #4338CA;
    --sb-lime: #6366F1;
    --sb-lime-600: #5558E0;
    --sb-brand: #6366F1;
    --sb-brand-600: #5558E0;
    --sb-brand-700: #4F46E5;
    --sb-secondary: #6366F1;
    --sb-accent-pink: #6366F1;
    --sb-ink: #0F172A;
    --sb-ink-soft: #334155;
    --sb-muted: #64748B;
    --sb-surface-2: #F8FAFC;
    --sb-surface-3: #F1F5F9;
    --sb-sidebar-bg: #FFFFFF;
    --sb-sidebar-ink: #334155;
    --sb-sidebar-muted: #64748B;
    --sb-sidebar-active-bg: rgba(99, 102, 241, 0.12);
    --sb-topbar-bg: #FFFFFF;
    --sb-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.06);
    --sb-shadow-md: var(--sb-shadow-card);
    --sb-shadow-lg: 0 16px 24px -6px rgb(15 23 42 / 0.12);
    --sb-glow: 0 0 0 3px rgba(99, 102, 241, 0.25);
    --sb-radius: 20px;
    --sb-radius-sm: 12px;
    --sb-font-head: var(--sb-font);
    --sb-font-body: var(--sb-font);
    --x-display: var(--sb-font);
    --x-body: var(--sb-font);
    --x-grad: linear-gradient(to bottom, #7C3AED, #6366F1);
    --x-grad-soft: rgba(99, 102, 241, 0.12);
    --x-violet: #6366F1;
    --x-ink: #0F172A;
    --x-muted: #64748B;
    --x-card: #FFFFFF;
    --x-hair: #E2E8F0;
    --x-hair-2: #E2E8F0;
    --x-shadow: var(--sb-shadow-card);
    --x-shadow-lg: 0 16px 24px -6px rgb(15 23 42 / 0.12);
}

/* ---- Global shell (all pages) ---- */
body.sb-indigo-home, body.sb-shell, body.fullpage {
    background: var(--sb-bg) !important;
    font-family: var(--sb-font) !important;
    color: var(--sb-text-secondary) !important;
    -webkit-font-smoothing: antialiased;
}

body.sb-indigo-home.sb-shell, body.sb-shell.sb-shell {
    background: var(--sb-bg) !important;
}

/* ---- Sidebar ---- */
body.sb-indigo-home .sb-sidebar, body.sb-shell .sb-sidebar, body.fullpage .sb-sidebar {
    background: var(--sb-surface) !important;
    border-right: 1px solid var(--sb-border) !important;
    box-shadow: var(--sb-shadow-card) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.sb-indigo-home .sb-sidebar__header, body.sb-shell .sb-sidebar__header, body.fullpage .sb-sidebar__header {
    border-bottom: 1px solid var(--sb-border);
    padding-bottom: 12px;
}

body.sb-indigo-home .sb-logo__text, body.sb-shell .sb-logo__text, body.fullpage .sb-logo__text {
    font-family: var(--sb-font) !important;
    font-weight: 700 !important;
    color: var(--sb-text-primary) !important;
    letter-spacing: -0.02em;
}

body.sb-indigo-home .sb-nav .sb-group__label, body.sb-shell .sb-nav .sb-group__label, body.fullpage .sb-nav .sb-group__label {
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sb-text-muted) !important;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item__text,
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item__caret,
body.sb-shell .sb-sidebar .sb-nav .sb-item__text,
body.sb-shell .sb-sidebar .sb-nav .sb-item__caret,
body.fullpage .sb-sidebar .sb-nav .sb-item__text,
body.fullpage .sb-sidebar .sb-nav .sb-item__caret {
    color: var(--sb-text-secondary) !important;
    font-size: 14px !important;
    font-weight: 500;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item__icon, body.sb-shell .sb-sidebar .sb-nav .sb-item__icon, body.fullpage .sb-sidebar .sb-nav .sb-item__icon {
    color: var(--sb-accent) !important;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item:hover,
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item.is-open, body.sb-shell .sb-sidebar .sb-nav .sb-item.is-open, body.fullpage .sb-sidebar .sb-nav .sb-item.is-open {
    background: rgba(99, 102, 241, 0.08) !important;
    box-shadow: none !important;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item:hover .sb-item__text,
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item:hover .sb-item__caret,
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item.is-open .sb-item__text, body.sb-shell .sb-sidebar .sb-nav .sb-item.is-open .sb-item__text, body.fullpage .sb-sidebar .sb-nav .sb-item.is-open .sb-item__text {
    color: var(--sb-text-primary) !important;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item[aria-current="page"],
body.sb-shell .sb-sidebar .sb-nav .sb-item[aria-current="page"],
body.fullpage .sb-sidebar .sb-nav .sb-item[aria-current="page"] {
    background: var(--sb-sidebar-active-bg) !important;
    border-radius: var(--sb-radius-sm, 8px) !important;
    margin: 0 !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__text,
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__icon,
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__caret,
body.sb-shell .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__text,
body.sb-shell .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__icon,
body.sb-shell .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__caret,
body.fullpage .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__text,
body.fullpage .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__icon,
body.fullpage .sb-sidebar .sb-nav .sb-item[aria-current="page"] .sb-item__caret {
    color: var(--sb-accent) !important;
}

body.sb-indigo-home .sb-sidebar .sb-nav .sb-item[aria-current="page"]::before,
body.sb-shell .sb-sidebar .sb-nav .sb-item[aria-current="page"]::before,
body.fullpage .sb-sidebar .sb-nav .sb-item[aria-current="page"]::before {
    background: var(--sb-accent) !important;
    width: 3px !important;
}

body.sb-indigo-home .sb-rail-toggle, body.sb-shell .sb-rail-toggle, body.fullpage .sb-rail-toggle {
    color: var(--sb-text-muted) !important;
    border-color: var(--sb-border) !important;
}

body.sb-indigo-home .sb-sidebar__footer, body.sb-shell .sb-sidebar__footer, body.fullpage .sb-sidebar__footer {
    border-top: 1px solid var(--sb-border);
}

body.sb-indigo-home .sb-cartcount, body.sb-shell .sb-cartcount, body.fullpage .sb-cartcount {
    background: var(--sb-accent) !important;
    color: #fff !important;
    border-radius: 9999px;
}

body.sb-indigo-home .sb-lang select, body.sb-shell .sb-lang select, body.fullpage .sb-lang select {
    border: 1px solid var(--sb-border) !important;
    border-radius: 9999px !important;
    font-size: 13px !important;
    color: var(--sb-text-secondary) !important;
}

/* ---- Mobile topbar ---- */
body.sb-indigo-home .sb-topbar, body.sb-shell .sb-topbar, body.fullpage .sb-topbar {
    background: var(--sb-surface) !important;
    border-bottom: 1px solid var(--sb-border) !important;
    box-shadow: var(--sb-shadow-card);
}

body.sb-indigo-home .sb-topbar__btn, body.sb-shell .sb-topbar__btn, body.fullpage .sb-topbar__btn {
    color: var(--sb-text-secondary) !important;
}

body.sb-indigo-home .sb-topbar__btn:hover, body.sb-shell .sb-topbar__btn:hover, body.fullpage .sb-topbar__btn:hover {
    background: rgba(99, 102, 241, 0.08) !important;
    color: var(--sb-accent) !important;
}

body.sb-indigo-home .sb-overlay, body.sb-shell .sb-overlay, body.fullpage .sb-overlay {
    background: rgba(15, 23, 42, 0.35) !important;
    backdrop-filter: blur(4px);
}

/* ---- Footer ---- */
body.sb-indigo-home .sb-footer, body.sb-shell .sb-footer, body.fullpage .sb-footer {
    background: var(--sb-bg-dark) !important;
    margin-top: 0;
}

body.sb-indigo-home .sb-footer__name, body.sb-shell .sb-footer__name, body.fullpage .sb-footer__name {
    font-family: var(--sb-font) !important;
    text-transform: none !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    font-size: 18px !important;
}

body.sb-indigo-home .sb-footer__mark, body.sb-shell .sb-footer__mark, body.fullpage .sb-footer__mark {
    background: var(--sb-accent) !important;
    border-radius: 9999px !important;
}

body.sb-indigo-home .sb-footer__tag, body.sb-shell .sb-footer__tag, body.fullpage .sb-footer__tag {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: rgba(255, 255, 255, 0.65) !important;
}

body.sb-indigo-home .sb-footer__h, body.sb-shell .sb-footer__h, body.fullpage .sb-footer__h {
    font-family: var(--sb-font) !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: 0 !important;
    color: #fff !important;
}

body.sb-indigo-home .sb-footer__menu a, body.sb-shell .sb-footer__menu a, body.fullpage .sb-footer__menu a {
    font-size: 15px !important;
    color: rgba(255, 255, 255, 0.72) !important;
}

body.sb-indigo-home .sb-footer__menu a:hover, body.sb-shell .sb-footer__menu a:hover, body.fullpage .sb-footer__menu a:hover {
    color: var(--sb-accent) !important;
}

body.sb-indigo-home .sb-footer__bar, body.sb-shell .sb-footer__bar, body.fullpage .sb-footer__bar {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 13px;
    color: rgba(255, 255, 255, 0.55);
}

body.sb-indigo-home .sb-footer__pay, body.sb-shell .sb-footer__pay, body.fullpage .sb-footer__pay {
    color: var(--sb-accent) !important;
}

body.sb-indigo-home .sb-social a, body.sb-shell .sb-social a, body.fullpage .sb-social a {
    background: rgba(99, 102, 241, 0.2) !important;
    border-radius: 9999px !important;
}

body.sb-indigo-home .sb-social a:hover, body.sb-shell .sb-social a:hover, body.fullpage .sb-social a:hover {
    background: var(--sb-accent) !important;
    color: #fff !important;
}

/* ---- Component utilities ---- */
body.sb-indigo-home .btn-accent,
body.sb-indigo-home button.btn-accent,
body.sb-indigo-home a.btn-accent, body.sb-shell a.btn-accent, body.fullpage a.btn-accent {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--sb-accent) !important;
    color: #fff !important;
    font-family: var(--sb-font);
    font-size: 15px;
    font-weight: 500;
    border: none !important;
    border-radius: 9999px;
    padding: 12px 24px;
    cursor: pointer;
    transition: background 0.2s ease;
    text-decoration: none;
    box-shadow: none !important;
}

body.sb-indigo-home .btn-accent:hover,
body.sb-indigo-home button.btn-accent:hover,
body.sb-indigo-home a.btn-accent:hover, body.sb-shell a.btn-accent:hover, body.fullpage a.btn-accent:hover {
    background: var(--sb-accent-hover) !important;
    color: #fff !important;
}

body.sb-indigo-home .btn-outline, body.sb-shell .btn-outline, body.fullpage .btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    color: var(--sb-accent);
    font-family: var(--sb-font);
    font-size: 15px;
    font-weight: 500;
    border: 1px solid var(--sb-accent);
    border-radius: 9999px;
    padding: 11px 24px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
}

body.sb-indigo-home .btn-outline:hover, body.sb-shell .btn-outline:hover, body.fullpage .btn-outline:hover {
    background: var(--sb-accent);
    color: #fff;
}

body.sb-indigo-home .card, body.sb-shell .card, body.fullpage .card {
    background: var(--sb-surface);
    border: none;
    border-radius: var(--sb-radius-card);
    box-shadow: var(--sb-shadow-card);
}

body.sb-indigo-home .icon-circle, body.sb-shell .icon-circle, body.fullpage .icon-circle {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: var(--sb-accent);
    color: #fff;
    font-size: 18px;
    flex-shrink: 0;
}

body.sb-indigo-home .badge, body.sb-shell .badge, body.fullpage .badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--sb-accent);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    padding: 6px 14px;
    border-radius: 9999px;
}

body.sb-indigo-home .gradient-purple, body.sb-shell .gradient-purple, body.fullpage .gradient-purple {
    background: var(--sb-grad);
}

/* ---- Homepage layout ---- */
body.sb-indigo-home #header-holder {
    background: transparent;
}

body.sb-indigo-home .sb-home {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px 0;
}

@media (min-width: 993px) {
    body.sb-indigo-home .sb-home {
        padding: 32px 40px 0;
    }
}

/* Hero */
body.sb-indigo-home .sb-hero {
    border-radius: var(--sb-radius-card);
    padding: clamp(48px, 8vw, 72px) clamp(28px, 5vw, 56px);
    color: #fff;
    margin-bottom: 32px;
    position: relative;
    overflow: hidden;
}

body.sb-indigo-home .sb-hero__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
}

body.sb-indigo-home .sb-hero__eyebrow {
    background: var(--sb-accent);
    color: #fff;
    font-size: var(--sb-fs-small);
    font-weight: 500;
    border: none;
    box-shadow: none;
    margin-bottom: 20px;
}

body.sb-indigo-home .sb-hero h1 {
    font-family: var(--sb-font);
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 700;
    line-height: 1.1;
    color: #fff;
    margin: 0 0 16px;
    letter-spacing: -0.03em;
}

body.sb-indigo-home .sb-hero__lead {
    font-size: 15px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.88);
    margin: 0 0 28px;
    max-width: 48ch;
}

body.sb-indigo-home .sb-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

body.sb-indigo-home .sb-hero .btn-accent {
    background: #fff;
    color: var(--sb-accent-deep);
}

body.sb-indigo-home .sb-hero .btn-accent:hover {
    background: #f1f5f9;
}

body.sb-indigo-home .sb-hero .btn-outline {
    border-color: rgba(255, 255, 255, 0.65);
    color: #fff;
}

body.sb-indigo-home .sb-hero .btn-outline:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: #fff;
    color: #fff;
}

/* Hero dashboard card */
body.sb-indigo-home .sb-hero-card {
    padding: 28px;
}

body.sb-indigo-home .sb-hero-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

body.sb-indigo-home .sb-hero-card__live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #16a34a;
}

body.sb-indigo-home .sb-hero-card__live-dot {
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    background: #22c55e;
}

body.sb-indigo-home .sb-hero-card__count {
    font-size: 40px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--sb-text-primary);
    letter-spacing: -0.02em;
}

body.sb-indigo-home .sb-hero-card__delta {
    font-size: 13px;
    font-weight: 600;
    color: #16a34a;
    margin-top: 4px;
}

body.sb-indigo-home .sb-hero-card__chart {
    height: 80px;
    margin: 16px 0;
}

body.sb-indigo-home .sb-hero-card__chart svg {
    width: 100%;
    height: 100%;
}

body.sb-indigo-home .sb-hero-card__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-top: 1px solid var(--sb-border);
    font-size: 13px;
    color: var(--sb-text-secondary);
}

body.sb-indigo-home .sb-hero-card__row:first-of-type {
    border-top: none;
}

body.sb-indigo-home .sb-hero-card__pill {
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 9999px;
    background: rgba(99, 102, 241, 0.12);
    color: var(--sb-accent);
}

/* Stats strip */
body.sb-indigo-home .sb-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 40px;
}

body.sb-indigo-home .sb-stat {
    padding: 20px 24px;
    text-align: center;
}

body.sb-indigo-home .sb-stat strong {
    display: block;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--sb-text-primary);
    margin-bottom: 6px;
}

body.sb-indigo-home .sb-stat span {
    font-size: 13px;
    color: var(--sb-text-muted);
}

/* Section headings */
body.sb-indigo-home .sb-sec-head {
    margin-bottom: 28px;
}

body.sb-indigo-home .sb-sec-head h2 {
    font-family: var(--sb-font);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--sb-text-primary);
    margin: 0 0 8px;
}

body.sb-indigo-home .sb-sec-head p {
    font-size: 15px;
    line-height: 1.6;
    color: var(--sb-text-muted);
    margin: 0;
}

/* Package cards */
body.sb-indigo-home .sb-packages {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 48px;
}

body.sb-indigo-home .sb-pkg {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.sb-indigo-home .sb-pkg:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 24px -6px rgb(15 23 42 / 0.12);
}

body.sb-indigo-home .sb-pkg h3 {
    font-size: 15px;
    font-weight: 600;
    color: var(--sb-text-primary);
    margin: 0;
    line-height: 1.3;
}

body.sb-indigo-home .sb-pkg__meta {
    font-size: 13px;
    color: var(--sb-text-muted);
}

body.sb-indigo-home .sb-pkg__price {
    font-size: 28px;
    font-weight: 700;
    color: var(--sb-text-primary);
    line-height: 1.1;
}

body.sb-indigo-home .sb-pkg__price small {
    font-size: 13px;
    font-weight: 400;
    color: var(--sb-text-muted);
}

body.sb-indigo-home .sb-pkg .btn-accent {
    width: 100%;
    justify-content: center;
    margin-top: auto;
}

/* Channels grid */
body.sb-indigo-home .sb-channels {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 48px;
}

body.sb-indigo-home .sb-channel {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    text-decoration: none;
    color: var(--sb-text-secondary);
    font-size: 15px;
    font-weight: 500;
    transition: transform 0.15s ease;
}

body.sb-indigo-home .sb-channel:hover {
    transform: translateY(-1px);
    color: var(--sb-text-primary);
}

body.sb-indigo-home .sb-channel .icon-circle {
    width: 40px;
    height: 40px;
    font-size: 16px;
}

/* How it works */
body.sb-indigo-home .sb-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 48px;
}

body.sb-indigo-home .sb-step {
    padding: 28px;
}

body.sb-indigo-home .sb-step__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--sb-accent);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 14px;
}

body.sb-indigo-home .sb-step h3 {
    font-size: 15px;
    font-weight: 600;
    color: var(--sb-text-primary);
    margin: 0 0 8px;
}

body.sb-indigo-home .sb-step p {
    font-size: 15px;
    line-height: 1.6;
    color: var(--sb-text-muted);
    margin: 0;
}

/* CTA band */
body.sb-indigo-home .sb-cta-band {
    border-radius: var(--sb-radius-card);
    padding: 48px 40px;
    text-align: center;
    color: #fff;
    margin-bottom: 48px;
}

body.sb-indigo-home .sb-cta-band h2 {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    margin: 0 0 12px;
}

body.sb-indigo-home .sb-cta-band p {
    font-size: 15px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.88);
    margin: 0 auto 24px;
    max-width: 52ch;
}

body.sb-indigo-home .sb-cta-band .sb-link-bar {
    display: flex;
    max-width: 520px;
    margin: 0 auto;
    background: var(--sb-surface);
    border-radius: 9999px;
    padding: 6px 6px 6px 20px;
    align-items: center;
    gap: 10px;
    box-shadow: var(--sb-shadow-card);
}

body.sb-indigo-home .sb-cta-band .sb-link-bar input {
    flex: 1;
    border: none;
    outline: none;
    font-family: var(--sb-font);
    font-size: 15px;
    color: var(--sb-text-primary);
    background: transparent;
}

body.sb-indigo-home .sb-cta-band .sb-link-bar input::placeholder {
    color: var(--sb-text-muted);
}

/* FAQ section on homepage */
body.sb-indigo-home .container-fluid {
    background: var(--sb-bg) !important;
    padding: 0 0 48px !important;
}

body.sb-indigo-home .container-fluid .container {
    max-width: 1200px;
}

/* Modal overrides */
body.sb-indigo-home .sb-modal__dialog, body.sb-shell .sb-modal__dialog, body.fullpage .sb-modal__dialog {
    border-radius: var(--sb-radius-card) !important;
    box-shadow: var(--sb-shadow-card) !important;
    font-family: var(--sb-font) !important;
}

body.sb-indigo-home .sb-modal__title, body.sb-shell .sb-modal__title, body.fullpage .sb-modal__title {
    color: var(--sb-text-primary) !important;
    font-weight: 700 !important;
}

body.sb-indigo-home .sb-cta-btn,
body.sb-indigo-home .sb-buy-boost, body.sb-shell .sb-buy-boost, body.fullpage .sb-buy-boost {
    background: var(--sb-accent) !important;
    color: #fff !important;
    border-radius: 9999px !important;
    border: none !important;
    box-shadow: none !important;
}

/* Kill legacy lime/green CTA bleed from redesign.css */
body.sb-indigo-home .ybtn,
body.sb-indigo-home .ybtn1,
body.sb-indigo-home .sb-pkg-card__buy, body.sb-shell .sb-pkg-card__buy, body.fullpage .sb-pkg-card__buy {
    background: var(--sb-accent) !important;
    color: #fff !important;
    border: none !important;
}

/* Responsive */
@media (max-width: 1024px) {
body.sb-indigo-home .sb-hero__grid, body.sb-shell .sb-hero__grid, body.fullpage .sb-hero__grid { grid-template-columns: 1fr; }
body.sb-indigo-home .sb-stats, body.sb-shell .sb-stats, body.fullpage .sb-stats { grid-template-columns: repeat(2, 1fr); }
body.sb-indigo-home .sb-packages, body.sb-shell .sb-packages, body.fullpage .sb-packages { grid-template-columns: repeat(2, 1fr); }
body.sb-indigo-home .sb-channels, body.sb-shell .sb-channels, body.fullpage .sb-channels { grid-template-columns: repeat(2, 1fr); }
body.sb-indigo-home .sb-steps, body.sb-shell .sb-steps, body.fullpage .sb-steps { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    body.sb-indigo-home .sb-stats,
    body.sb-indigo-home .sb-packages,
body.sb-indigo-home .sb-channels, body.sb-shell .sb-channels, body.fullpage .sb-channels { grid-template-columns: 1fr; }
body.sb-indigo-home .sb-cta-band .sb-link-bar, body.sb-shell .sb-cta-band .sb-link-bar, body.fullpage .sb-cta-band .sb-link-bar { flex-direction: column; border-radius: var(--sb-radius-card); padding: 16px; }
body.sb-indigo-home .sb-cta-band .sb-link-bar .btn-accent, body.sb-shell .sb-cta-band .sb-link-bar .btn-accent, body.fullpage .sb-cta-band .sb-link-bar .btn-accent { width: 100%; justify-content: center; }
}
==============================================
   INNER PAGES — buy, services, cart, account, legal, hubs
   ============================================================ */
body.sb-shell {
    background: var(--sb-bg) !important;
    font-family: var(--sb-font) !important;
    color: var(--sb-text-secondary) !important;
    -webkit-font-smoothing: antialiased;
}

body.sb-shell .row-title::after { background: var(--sb-grad) !important; }
body.sb-shell .feature-box {
    border-radius: var(--sb-radius-card) !important;
    box-shadow: var(--sb-shadow-card) !important;
    border-color: var(--sb-border) !important;
}
body.sb-shell .feature-box:hover { border-color: rgba(99, 102, 241, 0.35) !important; }
body.sb-shell .feature-icon img { background: var(--x-grad-soft) !important; border-radius: 9999px !important; }
body.sb-shell #daysCombo, body.sb-shell select.form-control, body.sb-shell input.form-control, body.sb-shell textarea.form-control {
    border-radius: 12px !important; border-color: var(--sb-border) !important; font-family: var(--sb-font) !important;
}
body.sb-shell #daysCombo:focus, body.sb-shell select.form-control:focus, body.sb-shell input.form-control:focus {
    border-color: var(--sb-accent) !important; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15) !important;
}
body.sb-shell .ybtn, body.sb-shell .ybtn1, body.sb-shell .sb-pkg-card__buy, body.sb-shell a.ybtn, body.sb-shell button.ybtn {
    background: var(--sb-accent) !important; color: #fff !important; border: none !important;
    border-radius: 9999px !important; font-family: var(--sb-font) !important; box-shadow: none !important;
}
body.sb-shell .ybtn:hover, body.sb-shell .ybtn1:hover { background: var(--sb-accent-hover) !important; color: #fff !important; }
body.sb-shell table.table, body.sb-shell .table { border-radius: var(--sb-radius-card); overflow: hidden; box-shadow: var(--sb-shadow-card); }
body.sb-shell .table thead th {
    background: var(--sb-bg) !important; color: var(--sb-text-primary) !important;
    font-family: var(--sb-font) !important; border-color: var(--sb-border) !important;
}
body.sb-shell .table td { border-color: var(--sb-border) !important; color: var(--sb-text-secondary) !important; }
body.sb-shell #message1.message-area, body.sb-shell #message2.message-area { background: var(--sb-bg) !important; }
body.sb-shell #message1.message-area::before, body.sb-shell #message2.message-area::before {
    background: var(--sb-grad) !important; opacity: 0.08 !important;
}
body.sb-shell .panel, body.sb-shell .well, body.sb-shell .card-box {
    background: var(--sb-surface) !important; border: 1px solid var(--sb-border) !important;
    border-radius: var(--sb-radius-card) !important; box-shadow: var(--sb-shadow-card) !important;
}
body.sb-shell .sbx .btn--grad, body.sb-shell .sbx .step__n, body.sb-shell .sbx .quote__av, body.sb-shell .sbx .qa.open .qa__sign {
    background: var(--sb-grad) !important; box-shadow: 0 10px 20px -8px rgba(99, 102, 241, 0.45) !important;
}
body.sb-shell .sbx .hero .eyebrow {
    background: rgba(99, 102, 241, 0.1) !important; border-color: rgba(99, 102, 241, 0.25) !important; color: var(--sb-accent) !important;
}
body.sb-shell .sbx .hero h1 .grad-text, body.sb-shell .sbx .grad-text {
    background: var(--sb-grad) !important; -webkit-background-clip: text; background-clip: text; color: transparent !important;
}
body.sb-shell .sbx .svc__go { color: var(--sb-accent) !important; }
body.sb-shell .sbx .pill:hover { background: rgba(99, 102, 241, 0.12) !important; }
body.sb-shell .sbx .cta__island::before {
    background: radial-gradient(60% 120% at 50% 0%, rgba(99,102,241,.45), transparent 60%),
                radial-gradient(50% 120% at 90% 100%, rgba(124,58,237,.35), transparent 60%) !important;
}
body.fullpage { background: var(--sb-bg) !important; font-family: var(--sb-font) !important; }
body.fullpage #form-section { background: var(--sb-grad) !important; }
body.fullpage .form-holder {
    background: var(--sb-surface) !important; border-radius: var(--sb-radius-card) !important;
    box-shadow: var(--sb-shadow-card) !important; border: 1px solid var(--sb-border) !important;
}
body.fullpage .form-title { font-family: var(--sb-font) !important; color: var(--sb-text-primary) !important; }
body.fullpage .ybtn, body.fullpage input[type="submit"], body.fullpage .submit-btn {
    background: var(--sb-accent) !important; color: #fff !important; border-radius: 9999px !important; border: none !important;
}
body.fullpage .form-text input, body.fullpage input[type="text"], body.fullpage input[type="email"], body.fullpage input[type="password"] {
    border-radius: 12px !important; border-color: var(--sb-border) !important; font-family: var(--sb-font) !important;
}
html[data-theme="dark"] {
    --sb-bg: #0F172A; --sb-surface: #1E293B; --sb-surface-2: #0F172A; --sb-border: #334155;
    --sb-ink: #F8FAFC; --sb-text-primary: #F8FAFC; --sb-text-secondary: #CBD5E1; --sb-text-muted: #94A3B8;
    --x-ink: #F8FAFC; --x-muted: #94A3B8; --x-card: #1E293B;
}
html[data-theme="dark"] body.sb-shell .sb-sidebar, html[data-theme="dark"] body.sb-indigo-home .sb-sidebar {
    background: var(--sb-surface) !important; border-color: var(--sb-border) !important;
}
html[data-theme="dark"] body.sb-shell .feature-box, html[data-theme="dark"] body.fullpage .form-holder {
    background: var(--sb-surface) !important; border-color: var(--sb-border) !important;
}

/* SEO prose / key facts / related links on hub & product pages */
body.sb-shell .key-facts {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 12px;
    max-width: 820px;
}
body.sb-shell .key-facts li {
    background: var(--sb-surface);
    border: 1px solid var(--sb-border);
    border-radius: var(--sb-radius-card);
    padding: 16px 20px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--sb-text-secondary);
    box-shadow: var(--sb-shadow-card);
}
body.sb-shell .related-links__h {
    font-family: var(--sb-font);
    font-size: 20px;
    font-weight: 600;
    color: var(--sb-text-primary);
    margin: 0 0 14px;
}
body.sb-shell .related-links__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
body.sb-shell .related-links__list a {
    display: inline-flex;
    align-items: center;
    padding: 10px 18px;
    border-radius: 9999px;
    border: 1px solid var(--sb-border);
    background: var(--sb-surface);
    color: var(--sb-accent);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    box-shadow: var(--sb-shadow-card);
    transition: background 0.2s ease, border-color 0.2s ease;
}
body.sb-shell .related-links__list a:hover {
    background: rgba(99, 102, 241, 0.08);
    border-color: rgba(99, 102, 241, 0.35);
}

/* ============================================================
   Design tokens — typography scale + utility aliases
   (matches tailwind.config + component class spec)
   ============================================================ */
body.sb-indigo-home,
body.sb-shell,
body.fullpage {
    font-size: var(--sb-fs-body);
    line-height: var(--sb-lh-body);
    font-weight: var(--sb-fw-body);
}

body.sb-indigo-home h1,
body.sb-shell .sbx h1,
body.sb-shell .sbx .h-sec,
body.sb-shell .row-title {
    font-family: var(--sb-font) !important;
    font-size: clamp(36px, 5vw, var(--sb-fs-hero)) !important;
    font-weight: var(--sb-fw-heading) !important;
    line-height: var(--sb-lh-heading) !important;
    color: var(--sb-text-primary) !important;
    letter-spacing: -0.03em;
}

body.sb-indigo-home h2,
body.sb-shell h2,
body.sb-shell .sbx h2 {
    font-family: var(--sb-font) !important;
    font-size: var(--sb-fs-section) !important;
    font-weight: var(--sb-fw-heading) !important;
    line-height: var(--sb-lh-section) !important;
    color: var(--sb-text-primary) !important;
}

body.sb-indigo-home h3,
body.sb-shell h3,
body.sb-shell .sbx h3 {
    font-family: var(--sb-font) !important;
    font-size: var(--sb-fs-body) !important;
    font-weight: 600 !important;
    color: var(--sb-text-primary) !important;
}

body.sb-indigo-home p,
body.sb-shell p,
body.sb-shell .sbx p,
body.sb-shell .sbx .lead {
    font-size: var(--sb-fs-body) !important;
    line-height: var(--sb-lh-body) !important;
    color: var(--sb-text-secondary);
}

body.sb-indigo-home small,
body.sb-shell small,
body.sb-shell .caption,
body.sb-shell .text-muted {
    font-size: var(--sb-fs-small) !important;
    line-height: 1.5;
    color: var(--sb-text-muted) !important;
}

/* Reusable component utilities (spec parity) */
.btn-accent,
button.btn-accent,
a.btn-accent {
    background: var(--sb-accent) !important;
    color: #fff !important;
    font-family: var(--sb-font);
    font-size: var(--sb-fs-body);
    font-weight: 500;
    border: none;
    border-radius: var(--sb-radius-pill);
    padding: 10px 24px;
    transition: background 0.2s ease;
}

.btn-accent:hover {
    background: var(--sb-accent-hover) !important;
    color: #fff !important;
}

.btn-outline {
    border: 1px solid var(--sb-accent);
    color: var(--sb-accent);
    font-family: var(--sb-font);
    font-size: var(--sb-fs-body);
    font-weight: 500;
    border-radius: var(--sb-radius-pill);
    padding: 9px 24px;
    background: transparent;
    transition: all 0.2s ease;
}

.btn-outline:hover {
    background: var(--sb-accent);
    color: #fff;
}

.card {
    background: var(--sb-surface);
    border: none;
    border-radius: var(--sb-radius-card);
    box-shadow: var(--sb-shadow-card);
}

.icon-circle {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--sb-radius-pill);
    background: var(--sb-accent);
    color: #fff;
    font-size: 18px;
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--sb-accent);
    color: #fff;
    font-size: var(--sb-fs-small);
    font-weight: 500;
    padding: 6px 14px;
    border-radius: var(--sb-radius-pill);
}

.gradient-purple {
    background: var(--sb-grad);
}

.avatar {
    border-radius: var(--sb-radius-pill);
    object-fit: cover;
}

/* .sbx hub/product pages — remap legacy sb-home.css tokens */
body.sb-shell .sbx,
body.sb-indigo-home .sbx {
    --x-display: var(--sb-font);
    --x-body: var(--sb-font);
    --x-ink: var(--sb-text-primary);
    --x-ink-soft: var(--sb-text-secondary);
    --x-muted: var(--sb-text-muted);
    --x-bg: var(--sb-bg);
    --x-card: var(--sb-surface);
    --x-hair: var(--sb-border);
    --x-hair-2: var(--sb-border);
    --x-violet: var(--sb-accent);
    --x-blue: var(--sb-accent);
    --x-pink: var(--sb-accent);
    --x-grad: var(--sb-grad);
    --x-grad-soft: rgba(99, 102, 241, 0.12);
    --x-shadow: var(--sb-shadow-card);
    --x-shadow-lg: 0 16px 24px -6px rgb(15 23 42 / 0.12);
    --x-r-lg: 20px;
    --x-r-md: 20px;
    --x-r-sm: 12px;
    font-family: var(--sb-font) !important;
    color: var(--sb-text-secondary) !important;
    background: var(--sb-bg) !important;
}

body.sb-shell .sbx::before {
    display: none !important;
}

body.sb-shell .sbx .eyebrow {
    font-family: var(--sb-font) !important;
    font-size: var(--sb-fs-small) !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em;
    color: #fff !important;
    background: var(--sb-accent) !important;
    border: none !important;
    box-shadow: none !important;
}

body.sb-shell .sbx .eyebrow .dot {
    background: #fff !important;
    box-shadow: none !important;
}

body.sb-shell .sbx .bezel {
    border: none !important;
    border-radius: var(--sb-radius-card) !important;
    box-shadow: var(--sb-shadow-card) !important;
    padding: 0 !important;
    background: transparent !important;
}

body.sb-shell .sbx .bezel > .core {
    border-radius: var(--sb-radius-card) !important;
    box-shadow: var(--sb-shadow-card) !important;
    background: var(--sb-surface) !important;
}

body.sb-shell .sbx .btn {
    font-family: var(--sb-font) !important;
    font-size: var(--sb-fs-body) !important;
    border-radius: var(--sb-radius-pill) !important;
    box-shadow: var(--sb-shadow-card) !important;
}

body.sb-shell .sbx .btn--grad {
    background-image: var(--sb-grad) !important;
}

body.sb-shell .sbx .svc-hero__bg {
    background: var(--sb-grad) !important;
}

body.sb-shell .sbx .svc-pill {
    border-radius: var(--sb-radius-pill) !important;
    font-size: var(--sb-fs-small) !important;
    font-weight: 500 !important;
}

/* sb-ui.css legacy overrides — force indigo tokens */
body.sb-shell .feature-box {
    border: none !important;
    border-radius: var(--sb-radius-card) !important;
    box-shadow: var(--sb-shadow-card) !important;
}

body.sb-shell .feature-box:hover {
    border-color: transparent !important;
    box-shadow: 0 16px 24px -6px rgb(15 23 42 / 0.12) !important;
}

body.sb-shell .feature-title {
    font-family: var(--sb-font) !important;
    font-size: var(--sb-fs-body) !important;
    font-weight: 600 !important;
    color: var(--sb-text-primary) !important;
}

body.sb-shell .feature-details {
    font-size: var(--sb-fs-body) !important;
    line-height: var(--sb-lh-body) !important;
    color: var(--sb-text-muted) !important;
}

body.sb-shell .feature-icon img {
    border-radius: var(--sb-radius-pill) !important;
    background: rgba(99, 102, 241, 0.12) !important;
}

body.sb-shell #daysCombo,
body.sb-shell select.form-control {
    font-family: var(--sb-font) !important;
    font-size: var(--sb-fs-body) !important;
    border-radius: 12px !important;
    border-color: var(--sb-border) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236366F1' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
}

body.sb-shell input[type="range"].slider,
body.sb-shell input.slider#myRange {
    background: linear-gradient(90deg, #7C3AED, #6366F1) !important;
}

body.sb-shell input[type="range"].slider::-webkit-slider-thumb,
body.sb-shell input[type="range"].slider::-moz-range-thumb {
    border-color: var(--sb-accent) !important;
    box-shadow: 0 6px 16px -4px rgba(99, 102, 241, 0.45) !important;
}

body.sb-shell #demo_slider {
    font-family: var(--sb-font) !important;
    font-weight: 600 !important;
}

body.sb-shell #demo {
    color: var(--sb-accent) !important;
    font-family: var(--sb-font) !important;
}

/* Footer — dark surface token */
body.sb-indigo-home .sb-footer,
body.sb-shell .sb-footer {
    background: var(--sb-bg-dark) !important;
    color: #94a3b8 !important;
}

body.sb-indigo-home .sb-footer__name,
body.sb-shell .sb-footer__name {
    color: #f8fafc !important;
}

body.sb-indigo-home .sb-stat {
    border-radius: var(--sb-radius-pill);
}

/* ============================================================
   Sidebar readability + layout (overrides redesign §7 purple nav)
   White sidebar must use dark ink — not legacy white-on-purple text.
   ============================================================ */
body.sb-indigo-home .sb-sidebar .sb-nav .sb-item,
body.sb-shell .sb-sidebar .sb-nav .sb-item,
body.fullpage .sb-sidebar .sb-nav .sb-item {
    color: var(--sb-text-secondary) !important;
}

body.sb-indigo-home .sb-sidebar .sb-submenu .sb-item,
body.sb-shell .sb-sidebar .sb-submenu .sb-item,
body.fullpage .sb-sidebar .sb-submenu .sb-item {
    color: var(--sb-text-secondary) !important;
}

body.sb-indigo-home .sb-sidebar .sb-submenu .sb-item__text,
body.sb-shell .sb-sidebar .sb-submenu .sb-item__text,
body.fullpage .sb-sidebar .sb-submenu .sb-item__text {
    display: inline !important;
    color: var(--sb-text-secondary) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sb-indigo-home:not(.sb-collapsed) .sb-sidebar .sb-item__text,
body.sb-indigo-home:not(.sb-collapsed) .sb-sidebar .sb-item__caret,
body.sb-shell:not(.sb-collapsed) .sb-sidebar .sb-item__text,
body.sb-shell:not(.sb-collapsed) .sb-sidebar .sb-item__caret,
body.fullpage:not(.sb-collapsed) .sb-sidebar .sb-item__text,
body.fullpage:not(.sb-collapsed) .sb-sidebar .sb-item__caret {
    display: inline !important;
}

body.sb-indigo-home .sb-sidebar .sb-item:hover,
body.sb-shell .sb-sidebar .sb-item:hover,
body.fullpage .sb-sidebar .sb-item:hover {
    color: var(--sb-text-primary) !important;
    background: rgba(99, 102, 241, 0.08) !important;
}

body.sb-indigo-home .sb-sidebar .sb-item.is-open .sb-item__icon,
body.sb-indigo-home .sb-sidebar .sb-item.is-open .sb-item__caret,
body.sb-shell .sb-sidebar .sb-item.is-open .sb-item__icon,
body.sb-shell .sb-sidebar .sb-item.is-open .sb-item__caret,
body.fullpage .sb-sidebar .sb-item.is-open .sb-item__icon,
body.fullpage .sb-sidebar .sb-item.is-open .sb-item__caret {
    color: var(--sb-accent) !important;
}

body.sb-indigo-home .sb-sidebar .sb-rail-toggle,
body.sb-shell .sb-sidebar .sb-rail-toggle,
body.fullpage .sb-sidebar .sb-rail-toggle {
    background: var(--sb-surface-2, #f1f5f9) !important;
    color: var(--sb-text-muted) !important;
    border-color: var(--sb-border) !important;
}

body.sb-indigo-home .sb-sidebar .sb-theme-toggle,
body.sb-shell .sb-sidebar .sb-theme-toggle,
body.fullpage .sb-sidebar .sb-theme-toggle {
    background: var(--sb-surface-2, #f1f5f9) !important;
    color: var(--sb-text-secondary) !important;
    border-color: var(--sb-border) !important;
}

body.sb-indigo-home .sb-sidebar .sb-lang select,
body.sb-shell .sb-sidebar .sb-lang select,
body.fullpage .sb-sidebar .sb-lang select {
    background: var(--sb-surface-2, #f1f5f9) !important;
    color: var(--sb-text-secondary) !important;
}

/* Keep main content beside the fixed sidebar (desktop) */
@media (min-width: 993px) {
    body.sb-indigo-home.sb-shell,
    body.sb-shell {
        padding-left: var(--sb-sidebar-w, 280px) !important;
    }

    body.sb-indigo-home.sb-shell.sb-collapsed,
    body.sb-shell.sb-collapsed {
        padding-left: var(--sb-sidebar-w-collapsed, 76px) !important;
    }

    body.sb-indigo-home .sb-sidebar,
    body.sb-shell .sb-sidebar,
    body.fullpage .sb-sidebar {
        width: var(--sb-sidebar-w, 280px) !important;
        max-width: var(--sb-sidebar-w, 280px) !important;
        transform: none !important;
    }

    body.sb-indigo-home.sb-collapsed .sb-sidebar,
    body.sb-shell.sb-collapsed .sb-sidebar,
    body.fullpage.sb-collapsed .sb-sidebar {
        width: var(--sb-sidebar-w-collapsed, 76px) !important;
        max-width: var(--sb-sidebar-w-collapsed, 76px) !important;
    }

    body.sb-indigo-home .sbx,
    body.sb-shell .sbx,
    body.sb-shell main,
    body.sb-indigo-home main {
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* Mobile drawer: hide sidebar until opened; never cover content by default */
@media (max-width: 992px) {
    body.sb-indigo-home.sb-shell,
    body.sb-shell {
        padding-left: 0 !important;
        padding-top: var(--sb-topbar-h, 60px) !important;
    }

    body.sb-indigo-home:not(.sb-drawer-open) .sb-sidebar,
    body.sb-shell:not(.sb-drawer-open) .sb-sidebar {
        transform: translateX(-100%) !important;
    }

    body.sb-indigo-home.sb-drawer-open .sb-sidebar,
    body.sb-shell.sb-drawer-open .sb-sidebar {
        transform: translateX(0) !important;
        z-index: 1100 !important;
    }

    body.sb-indigo-home .sb-sidebar .sb-item__text,
    body.sb-shell .sb-sidebar .sb-item__text,
    body.sb-indigo-home .sb-sidebar .sb-item__caret,
    body.sb-shell .sb-sidebar .sb-item__caret {
        display: inline !important;
    }
}