:root {
    --jtp-brand-light: #3a7ca5;
    --jtp-brand-dark: #2b6777;
    --jtp-danger: #b42318;
    --jtp-sidebar-width: 250px;
    --jtp-sidebar-collapsed-width: 56px;
}

.theme-swatch,
.rz-menuitem[data-theme-swatch] > .rz-menuitem-link::before {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    background: var(--theme-swatch-background);
}

.rz-menuitem[data-theme-swatch] > .rz-menuitem-link::before {
    content: "";
    margin-inline-end: .6rem;
}

.theme-selector { position: relative; }
.theme-selector > summary { display: flex; align-items: center; gap: .35rem; list-style: none; }
.theme-selector > summary::-webkit-details-marker { display: none; }
.theme-selector-panel {
    position: absolute; top: 100%; right: 0; z-index: 100;
    min-width: 180px; padding: .3rem; border-radius: .25rem;
    background: var(--jtp-content-bg); color: var(--jtp-text);
    box-shadow: 0 .3rem 1rem #0003;
}
.theme-selector-option {
    display: flex; align-items: center; gap: .6rem; width: 100%;
    padding: .65rem .8rem; border: 0; border-radius: .25rem;
    background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer;
}
.theme-selector-option:hover, .theme-selector-option[aria-pressed="true"] { background: var(--jtp-hover); }
.theme-selector-option[aria-pressed="true"] { font-weight: 700; }
.theme-selector-option:focus-visible { outline: 2px solid var(--jtp-primary); }

.theme-swatch-nyx,
.rz-menuitem[data-theme-swatch="nyx"] {
    --theme-swatch-background: #2b6777;
}

.theme-swatch-eos,
.rz-menuitem[data-theme-swatch="eos"] {
    --theme-swatch-background: #3a7ca5;
}

.theme-swatch-iris,
.rz-menuitem[data-theme-swatch="iris"] {
    --theme-swatch-background: linear-gradient(180deg, #3a7ca5 0%, #2b6777 100%);
}

.theme-swatch-selene,
.rz-menuitem[data-theme-swatch="selene"] {
    --theme-swatch-background: linear-gradient(180deg, #2b6777 0%, #3a7ca5 100%);
}

.theme-jtp-light {
    --jtp-main-bg: #f0f4f7;
    --jtp-content-bg: #ffffff;
    --jtp-text: #333333;
    --jtp-text-muted: #5f6e77;
    --jtp-primary: #2b6777;
    --jtp-primary-light: #d7e7ee;
    --jtp-primary-dark: #205461;
    --jtp-secondary: #3a7ca5;
    --jtp-secondary-light: #6d9fbe;
    --jtp-border: #d5e1e7;
    --jtp-accent: #3a7ca5;
    --jtp-accent-dark: #2b6777;
    --jtp-hover: #d7e7ee;
    --jtp-menu-text: #333333;
    --jtp-menu-active-background: #d7e7ee;
    --jtp-menu-active-text: #205461;
}

.theme-jtp-dark {
    --jtp-main-bg: #102d35;
    --jtp-content-bg: #183f49;
    --jtp-text: #f4f8fa;
    --jtp-text-muted: #b6cbd5;
    --jtp-primary: #8fc1d6;
    --jtp-primary-light: #244e5a;
    --jtp-primary-dark: #b9deeb;
    --jtp-secondary: #78aec9;
    --jtp-secondary-light: #a6cfdf;
    --jtp-border: #315968;
    --jtp-accent: #78aec9;
    --jtp-accent-dark: #8fc1d6;
    --jtp-hover: #244e5a;
    --jtp-menu-text: #f4f8fa;
    --jtp-menu-active-background: #244e5a;
    --jtp-menu-active-text: #ffffff;
}

.theme-jtp-solid-dark {
    --jtp-sidebar-background: #2b6777;
    --jtp-sidebar-header-background: #3a7ca5;
    --jtp-toprow-background: #3a7ca5;
}

.theme-jtp-solid-light {
    --jtp-sidebar-background: #3a7ca5;
    --jtp-sidebar-header-background: #2b6777;
    --jtp-toprow-background: #2b6777;
}

.theme-jtp-gradient {
    --jtp-sidebar-background: linear-gradient(180deg, #3a7ca5 0%, #2b6777 100%);
    --jtp-sidebar-header-background: #3a7ca5;
    --jtp-toprow-background: #3a7ca5;
}

.theme-jtp-gradient-reverse {
    --jtp-sidebar-background: linear-gradient(180deg, #2b6777 0%, #3a7ca5 100%);
    --jtp-sidebar-header-background: #2b6777;
    --jtp-toprow-background: #2b6777;
}

.theme-jtp-light,
.theme-jtp-dark {
    --jtp-sidebar-text: #ffffff;
    --jtp-sidebar-icon-color: #ffffff;
    --jtp-sidebar-divider-color: rgba(255, 255, 255, 0.28);
    --jtp-sidebar-control-border: rgba(255, 255, 255, 0.7);
    --jtp-sidebar-hover-background: rgba(0, 0, 0, 0.16);
    --jtp-sidebar-active-background: rgba(0, 0, 0, 0.28);
    --jtp-sidebar-active-indicator: #ffffff;
    --jtp-toprow-text: #ffffff;
    --jtp-toprow-border: rgba(0, 0, 0, 0.18);
    --jtp-toprow-control-border: rgba(255, 255, 255, 0.62);
}

.theme-jtp-light .rz-card,
.theme-jtp-light .card,
.theme-jtp-light .rz-dialog {
    background-color: var(--jtp-content-bg);
    color: var(--jtp-text);
}

.theme-jtp-dark .rz-card,
.theme-jtp-dark .card,
.theme-jtp-dark .rz-dialog,
.theme-jtp-dark .rz-datatable {
    background-color: var(--jtp-content-bg);
    color: var(--jtp-text);
}