/* Orbit — dark mode, layout modes, customizer off-canvas */

html[data-theme="dark"],
html[data-theme="dark"] .orbit-body {
    --orbit-bg: #070B12;
    --orbit-surface: #101826;
    --orbit-border: #1C2A3D;
    --orbit-text: #E6EEF8;
    --orbit-text-muted: #8494A7;
    --orbit-card-shadow: 0 1px 0 rgba(255,255,255,0.03), 0 12px 32px rgba(0,0,0,0.35);
    --orbit-shadow-sm: 0 1px 2px rgba(0,0,0,0.25);
    --orbit-shadow-md: 0 10px 28px rgba(0,0,0,0.4);
    --orbit-shadow-lg: 0 22px 48px rgba(0,0,0,0.5);
    --orbit-accent-light: color-mix(in srgb, var(--orbit-primary) 16%, transparent);
    --orbit-light: #152033;
    --orbit-tint-danger: rgba(239, 68, 68, 0.16);
    --orbit-tint-warning: rgba(226, 165, 58, 0.16);
    --orbit-danger-text: #ff9d94;
    --orbit-warning-text: #e8c07a;
    --orbit-amber-surface: color-mix(in srgb, var(--orbit-amber) 14%, transparent);
    color-scheme: dark;
}

html[data-theme="dark"] .orbit-atmosphere {
    background: var(--orbit-bg);
}

html[data-theme="dark"] .orbit-atmosphere::after {
    background-image:
        linear-gradient(rgba(230, 238, 248, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(230, 238, 248, 0.04) 1px, transparent 1px);
}

html[data-theme="dark"] .orbit-topbar {
    background: color-mix(in srgb, var(--orbit-surface) 78%, transparent);
}

html[data-theme="dark"] .orbit-alert--success { color: #6ee7b7; }
html[data-theme="dark"] .orbit-alert--danger,
html[data-theme="dark"] .orbit-alert--error { color: #fda4af; }
html[data-theme="dark"] .orbit-alert--warning { color: #fcd34d; }
html[data-theme="dark"] .orbit-alert--info { color: #7dd3fc; }

html[data-theme="dark"] .orbit-btn--soft-dark { --btn-color: #e2e8f0; }
html[data-theme="dark"] .orbit-badge--soft-dark { color: #e2e8f0; }
html[data-theme="dark"] .orbit-text-dark { color: #e2e8f0 !important; }

/* Sidebar color modes */
html[data-sidebar-color="light"],
html[data-sidebar-color="light"] .orbit-body {
    --orbit-sidebar-bg: #ffffff;
    --orbit-sidebar-border: #E5EAF1;
    --orbit-sidebar-text: #6B7C8F;
    --orbit-sidebar-active: #101820;
    --orbit-sidebar-active-bg: color-mix(in srgb, var(--orbit-primary) 12%, transparent);
    --orbit-sidebar-section: #94A3B8;
}

html[data-theme="dark"][data-sidebar-color="light"],
html[data-theme="dark"][data-sidebar-color="light"] .orbit-body {
    --orbit-sidebar-bg: #152033;
    --orbit-sidebar-border: rgba(255, 255, 255, 0.08);
    --orbit-sidebar-text: rgba(255, 255, 255, 0.55);
    --orbit-sidebar-active: #ffffff;
}

html[data-sidebar-color="light"] .orbit-mark::before {
    background: #ffffff;
}

html[data-theme="dark"][data-sidebar-color="light"] .orbit-mark::before {
    background: #152033;
}

html[data-sidebar-color="light"] .orbit-sidebar__wordmark {
    color: var(--orbit-sidebar-active);
}

html[data-sidebar-color="gradient"] .orbit-sidebar {
    /* “Gradient” mode = primary-tinted solid (opt-in .orbit-gradient on brand if needed) */
    background: color-mix(in srgb, var(--orbit-primary) 22%, #0C1520);
    --orbit-sidebar-border: rgba(255, 255, 255, 0.12);
    --orbit-sidebar-text: rgba(255, 255, 255, 0.72);
    --orbit-sidebar-active: #ffffff;
    --orbit-sidebar-active-bg: rgba(255, 255, 255, 0.14);
    --orbit-sidebar-section: rgba(255, 255, 255, 0.45);
}

html[data-sidebar-color="gradient"] .orbit-mark {
    background: color-mix(in srgb, var(--orbit-primary) 30%, #0C1520);
}

/* Sidebar sizes */
html[data-sidebar-size="default"],
html[data-sidebar-size="default"] .orbit-body { --orbit-sidebar-width: 264px; }

html[data-sidebar-size="compact"],
html[data-sidebar-size="compact"] .orbit-body { --orbit-sidebar-width: 168px; }

html[data-sidebar-size="icon"],
html[data-sidebar-size="icon"] .orbit-body,
html[data-sidebar-size="hover"],
html[data-sidebar-size="hover"] .orbit-body { --orbit-sidebar-width: 72px; }

html[data-sidebar-size="icon"] .orbit-sidebar__label,
html[data-sidebar-size="icon"] .orbit-sidebar__section-title,
html[data-sidebar-size="icon"] .orbit-sidebar__badge:not(.orbit-sidebar__badge--count),
html[data-sidebar-size="icon"] .orbit-sidebar__wordmark,
html[data-sidebar-size="icon"] .orbit-sidebar__profile-text,
html[data-sidebar-size="hover"] .orbit-sidebar__label,
html[data-sidebar-size="hover"] .orbit-sidebar__section-title,
html[data-sidebar-size="hover"] .orbit-sidebar__badge:not(.orbit-sidebar__badge--count),
html[data-sidebar-size="hover"] .orbit-sidebar__wordmark,
html[data-sidebar-size="hover"] .orbit-sidebar__profile-text {
    opacity: 0;
    width: 0;
    overflow: hidden;
    white-space: nowrap;
    pointer-events: none;
}

/* Em icon/hover: badge numérico vira bolinha no canto do ícone. */
html[data-sidebar-size="icon"] .orbit-sidebar__link,
html[data-sidebar-size="hover"] .orbit-sidebar__link {
    position: relative;
}

html[data-sidebar-size="icon"] .orbit-sidebar__badge--count,
html[data-sidebar-size="hover"] .orbit-sidebar__badge--count {
    opacity: 1;
    width: 8px;
    min-width: 8px;
    height: 8px;
    padding: 0;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
    position: absolute;
    top: 8px;
    right: 10px;
    border: 2px solid var(--orbit-sidebar-bg, #0C1520);
    box-sizing: content-box;
    pointer-events: none;
}

html[data-sidebar-size="hover"] .orbit-sidebar:hover {
    width: 264px;
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 105;
    box-shadow: 8px 0 32px rgba(0, 0, 0, 0.22);
}

html[data-layout="two-col"]:has([data-admin-modules])[data-sidebar-size="hover"] .orbit-sidebar:hover {
    left: 64px;
}

html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__label,
html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__section-title,
html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__badge:not(.orbit-sidebar__badge--count),
html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__wordmark,
html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__profile-text {
    opacity: 1;
    width: auto;
    pointer-events: auto;
}

html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__badge--count {
    position: static;
    width: auto;
    min-width: 18px;
    height: auto;
    font-size: 10px;
    line-height: 16px;
    padding: 1px 7px;
    border: 0;
    overflow: visible;
}

html[data-sidebar-size="icon"] .orbit-sidebar__link,
html[data-sidebar-size="hover"] .orbit-sidebar__link,
html[data-sidebar-size="icon"] .orbit-sidebar__brand-link,
html[data-sidebar-size="hover"] .orbit-sidebar__brand-link {
    justify-content: center;
}

html[data-sidebar-size="icon"] .orbit-sidebar__chevron,
html[data-sidebar-size="hover"] .orbit-sidebar__chevron {
    opacity: 0;
    width: 0;
    overflow: hidden;
}

html[data-sidebar-size="icon"] .orbit-sidebar__submenu {
    display: none;
}

html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__link,
html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__brand-link {
    justify-content: flex-start;
}

html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__chevron {
    opacity: 0.55;
    width: auto;
    overflow: visible;
}

html[data-sidebar-size="hover"] .orbit-sidebar:hover .orbit-sidebar__submenu {
    display: flex;
}

html[data-sidebar-view="detached"] .orbit-sidebar {
    margin: 12px 0 12px 12px;
    min-height: calc(100vh - 24px);
    height: calc(100vh - 24px);
    border-radius: 18px;
    border: 1px solid var(--orbit-sidebar-border);
    box-shadow: var(--orbit-shadow-md);
}

/* Horizontal / two-col / semi-box / boxed */
html[data-layout="horizontal"] .orbit-sidebar,
html[data-layout="horizontal"] .orbit-icon-rail {
    display: none !important;
}

/* Desktop horizontal: sidebar some — troca o toggle pelo logotipo */
@media (min-width: 992px) {
    html[data-layout="horizontal"] .orbit-topbar__toggle {
        display: none !important;
    }

    html[data-layout="horizontal"] .orbit-topbar__brand {
        display: inline-flex;
    }
}

.orbit-hnav {
    position: relative;
    z-index: 30;
    background: color-mix(in srgb, var(--orbit-surface) 90%, transparent);
    border-bottom: 1px solid var(--orbit-border);
    flex-shrink: 0;
    backdrop-filter: blur(10px);
    overflow: visible;
}

.orbit-hnav[hidden] { display: none !important; }

.orbit-hnav__scroll {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    padding: 10px 16px;
}

/* overflow-x cria clipping vertical; solta o scroll enquanto o menu está aberto */
.orbit-hnav__scroll:has(.orbit-hnav__menu:not([hidden])),
.orbit-hnav__scroll:has(.orbit-hnav__mega-panel:not([hidden])) {
    overflow: visible;
}

.orbit-hnav__link {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 550;
    color: var(--orbit-text-muted);
    white-space: nowrap;
}

.orbit-hnav__link:hover:not(.is-soon) {
    background: var(--orbit-accent-light);
    color: var(--orbit-primary);
}

.orbit-hnav__link.is-active {
    background: var(--orbit-accent-light);
    color: var(--orbit-primary);
    font-weight: 700;
}

.orbit-hnav__link.is-soon { opacity: 0.5; }

.orbit-hnav__icon {
    display: inline-flex;
    flex-shrink: 0;
    opacity: 0.85;
}

.orbit-hnav__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--orbit-primary);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

.orbit-hnav__badge--zero,
.orbit-hnav__badge[hidden] {
    display: none;
}

.orbit-hnav__badge--sm {
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    font-size: 9px;
    margin-left: auto;
}

.orbit-hnav__dropdown {
    position: relative;
    flex-shrink: 0;
}

.orbit-hnav__link--parent {
    border: 0;
    background: transparent;
    cursor: pointer;
    gap: 6px;
}

.orbit-hnav__chevron {
    display: inline-flex;
    opacity: 0.6;
}

.orbit-dropdown__menu.orbit-hnav__menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: auto;
    min-width: 180px;
    padding: 6px;
    border-radius: 12px;
    background: var(--orbit-surface);
    border: 1px solid var(--orbit-border);
    box-shadow: var(--orbit-shadow-lg);
    z-index: 50;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.orbit-dropdown__menu.orbit-hnav__menu[hidden] {
    display: none !important;
}

.orbit-hnav__menu-link {
    display: block;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 13px;
    color: var(--orbit-text);
    text-decoration: none;
}

.orbit-hnav__menu-link:hover,
.orbit-hnav__menu-link.is-active {
    background: var(--orbit-accent-light);
    color: var(--orbit-primary);
}

.orbit-hnav__menu-link.is-soon {
    opacity: 0.5;
    cursor: default;
}

/* Mega menu (Horizontal + admin com rails) */
.orbit-hnav--mega {
    position: relative;
}

/* Pais centralizados na barra */
.orbit-hnav--mega .orbit-hnav__scroll {
    gap: 4px;
    flex-wrap: wrap;
    overflow: visible;
    justify-content: center;
}

.orbit-hnav--mega .orbit-hnav__mega {
    position: relative;
}

/* Painel ancorado no módulo pai (não no centro da página) */
.orbit-dropdown__menu.orbit-hnav__mega-panel {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: auto;
    transform: none;
    width: max-content;
    min-width: 320px;
    max-width: min(920px, calc(100vw - 32px));
    padding: 18px 20px;
    border-radius: 14px;
    background: var(--orbit-surface);
    border: 1px solid var(--orbit-border);
    box-shadow: var(--orbit-shadow-lg);
    z-index: 60;
    display: grid;
    gap: 16px 28px;
    grid-template-columns: repeat(var(--hnav-cols, 2), minmax(200px, 1fr));
    box-sizing: border-box;
}

.orbit-hnav__mega-panel[data-cols="1"] {
    --hnav-cols: 1;
    min-width: 260px;
}

.orbit-hnav__mega-panel[data-cols="2"] {
    --hnav-cols: 2;
    min-width: 440px;
}

.orbit-hnav__mega-panel[data-cols="3"] {
    --hnav-cols: 3;
    min-width: 660px;
}

.orbit-hnav__mega-panel[data-cols="4"] {
    --hnav-cols: 4;
    min-width: 840px;
}

.orbit-dropdown__menu.orbit-hnav__mega-panel[hidden] {
    display: none !important;
}

/* Se o painel estourar à direita, alinha pela direita do pai */
.orbit-hnav__mega:last-child .orbit-hnav__mega-panel,
.orbit-hnav__mega:nth-last-child(-n+2) .orbit-hnav__mega-panel {
    left: auto;
    right: 0;
}

.orbit-hnav__mega-col {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.orbit-hnav__mega-title {
    padding: 2px 8px 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--orbit-text-muted);
}

.orbit-hnav__mega-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 550;
    color: var(--orbit-text);
    text-decoration: none;
}

.orbit-hnav__mega-link:hover,
.orbit-hnav__mega-link.is-active {
    background: var(--orbit-accent-light);
    color: var(--orbit-primary);
}

.orbit-hnav__mega-link.is-soon {
    opacity: 0.5;
    cursor: default;
}

.orbit-hnav__mega-link-icon {
    display: inline-flex;
    flex-shrink: 0;
    opacity: 0.7;
    color: inherit;
}

.orbit-hnav__mega-link-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.orbit-hnav__mega-group {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 4px;
}

.orbit-hnav__mega-group-label {
    padding: 6px 10px 2px;
    font-size: 11px;
    font-weight: 700;
    color: var(--orbit-text-muted);
}

@media (max-width: 991px) {
    .orbit-hnav--mega .orbit-hnav__scroll {
        justify-content: flex-start;
    }

    .orbit-dropdown__menu.orbit-hnav__mega-panel {
        position: fixed;
        left: 12px !important;
        right: 12px !important;
        top: calc(var(--orbit-topbar-height, 64px) + 52px);
        transform: none;
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: min(70vh, 520px);
        overflow: auto;
        grid-template-columns: 1fr;
    }
}

.orbit-icon-rail {
    width: 64px;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--orbit-sidebar-bg) 82%, #000);
    border-right: 1px solid var(--orbit-sidebar-border);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    z-index: 41;
}

.orbit-icon-rail[hidden] { display: none !important; }

html[data-sidebar-color="light"] .orbit-icon-rail {
    background: var(--orbit-sidebar-bg);
}

html[data-layout-position="fixed"] .orbit-icon-rail,
html[data-layout="two-col"] .orbit-icon-rail {
    position: sticky;
    top: 0;
    align-self: flex-start;
    height: 100vh;
    max-height: 100vh;
    overflow-y: auto;
}

.orbit-icon-rail__brand {
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--orbit-sidebar-border);
}

.orbit-icon-rail__brand-link {
    display: flex;
    align-items: center;
    justify-content: center;
}

.orbit-icon-rail__nav {
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.orbit-icon-rail .orbit-sidebar__link--icon-only {
    justify-content: center;
    padding: 11px 0;
    color: var(--orbit-sidebar-text);
    position: relative;
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
    border-radius: 10px;
}

.orbit-icon-rail .orbit-icon-rail__btn {
    font: inherit;
}

.orbit-icon-rail .orbit-sidebar__badge--count {
    opacity: 1;
    position: absolute;
    top: 4px;
    right: 4px;
    border: 2px solid color-mix(in srgb, var(--orbit-sidebar-bg) 82%, #000);
    box-sizing: content-box;
    pointer-events: none;
}

html[data-sidebar-color="light"] .orbit-icon-rail .orbit-sidebar__badge--count {
    border-color: var(--orbit-sidebar-bg);
}

/* Admin Two Col: badge numérico legível no rail (não só bolinha) */
html[data-layout="two-col"] .orbit-icon-rail[data-admin-modules] .orbit-sidebar__badge--count {
    width: auto;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    font-size: 9px;
    font-weight: 700;
    line-height: 16px;
    border-radius: 999px;
}

.orbit-icon-rail .orbit-sidebar__link.is-active {
    background: var(--orbit-sidebar-active-bg);
    color: var(--orbit-sidebar-active);
}

/* Two Col legado (sem módulos admin): sidebar estreita sem ícones nos itens */
html[data-layout="two-col"]:not(:has([data-admin-modules])) .orbit-sidebar {
    --orbit-sidebar-width: 168px;
}

html[data-layout="two-col"]:not(:has([data-admin-modules])) .orbit-sidebar .orbit-sidebar__icon {
    display: none;
}

/* Admin Two Col: rail + sidebar secundária; largura vem de Sidebar Size */
html[data-layout="two-col"]:has([data-admin-modules]) .orbit-sidebar .orbit-sidebar__icon {
    display: flex;
}

.orbit-sidebar__panels {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.orbit-sidebar__panels[hidden] {
    display: none !important;
}

.orbit-sidebar__panel {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.orbit-sidebar__panel[hidden] {
    display: none !important;
}

[data-nav-flat][hidden] {
    display: none !important;
}

html[data-layout="semi-box"] .orbit-workspace {
    margin: 16px 16px 16px 0;
    border-radius: 18px;
    border: 1px solid var(--orbit-border);
    background: color-mix(in srgb, var(--orbit-surface) 88%, transparent);
    overflow: hidden;
    box-shadow: var(--orbit-card-shadow);
}

html[data-layout-width="boxed"] .orbit-shell {
    max-width: 1360px;
    margin: 0 auto;
    box-shadow: 0 0 0 1px var(--orbit-border);
}

html[data-layout-position="fixed"] .orbit-sidebar {
    position: sticky;
    top: 0;
    align-self: flex-start;
    height: 100vh;
}

html[data-layout-position="fixed"] .orbit-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
}

html[data-topbar-color="dark"] .orbit-topbar {
    background: #121A26;
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-topbar-color="dark"] .orbit-topbar__hello { color: #f1f5f9; }
html[data-topbar-color="dark"] .orbit-topbar__clock,
html[data-topbar-color="dark"] .orbit-icon-btn,
html[data-topbar-color="dark"] .orbit-user-menu__trigger {
    color: #94a3b8;
}

html[data-theme="dark"] .orbit-theme-toggle__sun { display: none; }
html[data-theme="dark"] .orbit-theme-toggle__moon { display: block; }

/* Customizer */
.orbit-customizer {
    position: fixed;
    top: 0;
    right: 0;
    width: min(380px, 100vw);
    height: 100vh;
    height: 100dvh;
    background: color-mix(in srgb, var(--orbit-surface) 96%, transparent);
    backdrop-filter: blur(18px) saturate(1.15);
    border-left: 1px solid var(--orbit-border);
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.22);
    /* Acima do overlay (110) e do assistente Radar (1200? não — o assistente
       é escondido via JS quando o customizer abre). Overlay cobre o app. */
    z-index: 120;
    transform: translateX(105%);
    transition: transform 0.34s cubic-bezier(.22,1,.36,1);
    display: flex;
    flex-direction: column;
}

.orbit-customizer.is-open {
    transform: translateX(0);
}

.orbit-customizer__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 18px 14px;
    border-bottom: 1px solid var(--orbit-border);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--orbit-primary) 12%, transparent), transparent 60%);
}

.orbit-customizer__title {
    font-size: 15px;
    font-weight: 750;
    letter-spacing: -0.02em;
}

.orbit-customizer__subtitle {
    margin-top: 2px;
    font-size: 12px;
    color: var(--orbit-text-muted);
}

.orbit-customizer__close {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--orbit-text-muted);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.orbit-customizer__close:hover {
    background: var(--orbit-accent-light);
    color: var(--orbit-primary);
}

.orbit-customizer__body {
    flex: 1;
    overflow: auto;
    padding: 16px 18px 28px;
}

.cust-section__title {
    margin: 0;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cust-section__desc {
    margin: 4px 0 12px;
    font-size: 12px;
    color: var(--orbit-text-muted);
}

.cust-divider {
    border: 0;
    border-top: 1px solid var(--orbit-border);
    margin: 16px 0;
}

.cust-grid {
    display: grid;
    gap: 8px;
}

.cust-grid--2 { grid-template-columns: 1fr 1fr; }
.cust-grid--3 { grid-template-columns: repeat(3, 1fr); }
.cust-grid--4 { grid-template-columns: repeat(4, 1fr); }

.cust-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    text-align: center;
}

.cust-card__preview {
    display: block;
    height: 54px;
    border-radius: 10px;
    border: 2px solid var(--orbit-border);
    background: var(--orbit-bg);
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}

.cust-card.is-selected .cust-card__preview {
    border-color: var(--orbit-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--orbit-primary) 18%, transparent);
    transform: translateY(-1px);
}

.cust-card__label {
    font-size: 11px;
    font-weight: 600;
    color: var(--orbit-text-muted);
}

.cust-card.is-selected .cust-card__label {
    color: var(--orbit-primary);
}

.cust-preview--scheme-light { background: #f8fafc; }
.cust-preview--scheme-dark { background: #070B12; }
.cust-preview--sbcol-light { background: linear-gradient(90deg, #e2e8f0 35%, #f8fafc 35%); }
.cust-preview--sbcol-dark { background: linear-gradient(90deg, #0C1520 35%, #f8fafc 35%); }
.cust-preview--sbcol-gradient { background: linear-gradient(90deg, var(--orbit-primary) 0%, #0C1520 35%, #f8fafc 35%); }
.cust-preview--vertical { background: linear-gradient(90deg, #0C1520 28%, #eef3f9 28%); }
.cust-preview--horizontal { background: linear-gradient(180deg, #0C1520 28%, #eef3f9 28%); }
.cust-preview--twocol { background: linear-gradient(90deg, #070D14 14%, #0C1520 14% 36%, #eef3f9 36%); }
.cust-preview--semibox {
    background:
        linear-gradient(90deg, #0C1520 28%, transparent 28%),
        linear-gradient(#dbe4f0, #dbe4f0) 40% 22% / 52% 56% no-repeat,
        #eef3f9;
}
.cust-preview--fluid { background: linear-gradient(90deg, #0C1520 22%, #eef3f9 22%); }
.cust-preview--boxed {
    background:
        linear-gradient(90deg, transparent 10%, #0C1520 10% 30%, #eef3f9 30% 90%, transparent 90%),
        #cbd5e1;
}
.cust-preview--topbar-light { background: linear-gradient(180deg, #fff 30%, #eef3f9 30%); }
.cust-preview--topbar-dark { background: linear-gradient(180deg, #121A26 30%, #eef3f9 30%); }
.cust-preview--sb-default { background: linear-gradient(90deg, #0C1520 36%, #eef3f9 36%); }
.cust-preview--sb-compact { background: linear-gradient(90deg, #0C1520 24%, #eef3f9 24%); }
.cust-preview--sb-icon { background: linear-gradient(90deg, #0C1520 12%, #eef3f9 12%); }
.cust-preview--sb-hover { background: linear-gradient(90deg, #0C1520 12%, color-mix(in srgb, var(--orbit-primary) 20%, #eef3f9) 12% 40%, #eef3f9 40%); }
.cust-preview--sbview-default { background: linear-gradient(90deg, #0C1520 30%, #eef3f9 30%); }
.cust-preview--sbview-detached {
    background:
        linear-gradient(#0C1520, #0C1520) 8% 12% / 24% 76% no-repeat,
        #eef3f9;
    border-radius: 12px;
}

.cust-segmented {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 4px;
    border-radius: 12px;
    background: var(--orbit-bg);
    border: 1px solid var(--orbit-border);
}

.cust-segmented__btn {
    border: 0;
    background: transparent;
    border-radius: 9px;
    padding: 9px 10px;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    color: var(--orbit-text-muted);
    cursor: pointer;
}

.cust-segmented__btn.is-selected {
    background: var(--orbit-surface);
    color: var(--orbit-primary);
    box-shadow: var(--orbit-shadow-sm);
}

.cust-colors {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.cust-color {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 2px solid transparent;
    background: var(--swatch, var(--orbit-primary));
    cursor: pointer;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,0.25);
    transition: transform 0.15s, box-shadow 0.15s;
}

.cust-color--cobalt { background: #1B6EF3; }
.cust-color--mint { background: #00C9A7; }
.cust-color--orange { background: #F36E21; }
.cust-color--teal { background: #0f9b8e; }
.cust-color--rose { background: #E11D48; }
.cust-color--ink { background: #0F172A; }

.cust-color.is-selected {
    transform: scale(1.08);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--swatch, var(--orbit-primary)) 35%, transparent), inset 0 0 0 2px rgba(255,255,255,0.35);
}

.cust-reset {
    width: 100%;
    margin-top: 18px;
    min-height: 42px;
    border-radius: 12px;
    border: 1px dashed var(--orbit-border);
    background: transparent;
    color: var(--orbit-text-muted);
    font: inherit;
    font-weight: 650;
    cursor: pointer;
}

.cust-reset:hover {
    border-color: var(--orbit-primary);
    color: var(--orbit-primary);
    background: var(--orbit-accent-light);
}

@media (max-width: 991.98px) {
    html[data-layout-position="fixed"] .orbit-sidebar {
        position: fixed !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        max-height: 100dvh !important;
    }

    html[data-sidebar-view="detached"] .orbit-sidebar {
        margin: 0 !important;
        border-radius: 0 !important;
        min-height: 100dvh !important;
        height: 100dvh !important;
    }

    html[data-layout="semi-box"] .orbit-workspace {
        margin: 0;
        border-radius: 0;
        border: 0;
        box-shadow: none;
    }

    html[data-layout="horizontal"] .orbit-hnav__scroll {
        padding-left: 12px;
        padding-right: 12px;
    }
}
