:root,
[data-bs-theme="light"] {
    color-scheme: light;
    --cms-primary: #4559b5;
    --cms-primary-subtle: #edf0fc;
    --cms-bg: #f5f6fa;
    --cms-surface: #ffffff;
    --cms-surface-secondary: #f7f8fb;
    --cms-border: #e3e7ef;
    --cms-text: #252d40;
    --cms-text-muted: #667087;
    --cms-success: #26765b;
    --cms-success-subtle: #eaf5ef;
    --cms-warning: #95661e;
    --cms-danger: #bd4253;
    --cms-info: #32748c;
    --cms-shadow: 0 2px 5px rgb(25 35 65 / 2%);
    --cms-sidebar-width: 244px;
    --cms-topbar-height: 80px;
    --bs-body-bg: var(--cms-bg);
    --bs-body-color: var(--cms-text);
    --bs-secondary-color: var(--cms-text-muted);
    --bs-border-color: var(--cms-border);
    --bs-tertiary-bg: var(--cms-surface-secondary);
    --bs-secondary-bg: var(--cms-surface-secondary);
    --bs-primary: var(--cms-primary);
    --bs-link-color: var(--cms-primary);
}

[data-bs-theme="dark"] {
    color-scheme: dark;
    --cms-primary: #a7b5ff;
    --cms-primary-subtle: #2b3454;
    --cms-bg: #171c27;
    --cms-surface: #202735;
    --cms-surface-secondary: #252e3e;
    --cms-border: #354055;
    --cms-text: #e3e8f2;
    --cms-text-muted: #a6b1c5;
    --cms-success: #8bd6b5;
    --cms-success-subtle: #243e38;
    --cms-warning: #e5c17b;
    --cms-danger: #f09da9;
    --cms-info: #8dc7dd;
    --cms-shadow: 0 2px 5px rgb(0 0 0 / 5%);
}

/* Reuse the bundled Boxicons font; only the glyphs used by this shell are mapped. */
@font-face {
    font-family: boxicons;
    src: url('../fonts/boxicons.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
.bx { font-family: boxicons !important; font-style: normal; font-weight: normal; line-height: 1; display: inline-block; flex-shrink: 0; speak: never; }
.bx-chevron-down::before { content: '\e9e2'; }
.bx-cog::before { content: '\e9fc'; }
.bx-file::before { content: '\ea48'; }
.bx-folder::before { content: '\ea52'; }
.bx-globe::before { content: '\ea68'; }
.bx-grid-alt::before { content: '\ea6b'; }
.bx-group::before { content: '\ea6f'; }
.bx-history::before { content: '\ea7e'; }
.bx-image::before { content: '\ea87'; }
.bx-layer::before { content: '\ea98'; }
.bx-line-chart::before { content: '\eaa1'; }
.bx-link-external::before { content: '\eaa4'; }
.bx-log-out::before { content: '\eab4'; }
.bx-menu::before { content: '\eac1'; }
.bx-moon::before { content: '\ead5'; }
.bx-plus::before { content: '\eafd'; }
.bx-pulse::before { content: '\eb05'; }
.bx-right-arrow-alt::before { content: '\eb1c'; }
.bx-show::before { content: '\eb3f'; }
.bx-sun::before { content: '\eb64'; }
.bx-user::before { content: '\eb8c'; }
.bx-x::before { content: '\ebae'; }

body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: .9375rem; line-height: 1.6; background: var(--cms-bg); color: var(--cms-text); }
button, a, select { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--cms-primary); outline-offset: 3px; }
.btn:focus-visible, .form-control:focus, .form-select:focus { box-shadow: 0 0 0 3px var(--cms-primary-subtle); border-color: var(--cms-primary); }
.cms-skip-link { position: fixed; top: -100px; left: 16px; z-index: 1100; background: var(--cms-surface); color: var(--cms-primary); padding: 12px 20px; border-radius: 8px; }
.cms-skip-link:focus { top: 12px; }
.cms-sidebar { --bs-offcanvas-width: min(288px, 88vw); background: var(--cms-surface) !important; border-right: 1px solid var(--cms-border) !important; }
.cms-brand-row { display: flex; align-items: center; justify-content: space-between; padding: 28px 22px; }
.cms-brand { display: inline-flex; align-items: center; gap: 12px; color: var(--cms-text); text-decoration: none; font-size: 1.25rem; font-weight: 700; letter-spacing: -.035em; }
.cms-brand-mark { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; background: var(--cms-primary-subtle); color: var(--cms-primary); font-size: 24px; }
.cms-brand-caption { display: block; font-size: .6875rem; color: var(--cms-text-muted); letter-spacing: .01em; font-weight: 400; }
.cms-sidebar .offcanvas-body { display: flex; flex-direction: column; padding: 0 16px 20px; overflow-y: auto; }
.cms-navigation { width: 100%; }
.cms-nav-heading { color: var(--cms-text-muted); font-size: .625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .13em; margin: 26px 12px 8px; }
.cms-nav-link { display: flex; width: 100%; align-items: center; gap: 12px; border: 0; padding: 10px 12px; min-height: 44px; margin: 3px 0; border-radius: 8px; background: transparent; color: var(--cms-text-muted); text-decoration: none; font-size: .875rem; text-align: left; }
.cms-nav-link .bx { font-size: 20px; }
.cms-nav-link.active { color: var(--cms-primary); background: var(--cms-primary-subtle); font-weight: 600; box-shadow: inset 3px 0 var(--cms-primary); }
.cms-nav-link:hover:not(:disabled) { color: var(--cms-primary); background: var(--cms-primary-subtle); }
.cms-nav-link:disabled { cursor: not-allowed; }
.cms-sidebar-note { display: flex; align-items: center; gap: 8px; margin: auto 8px 0; padding-top: 36px; color: var(--cms-text-muted); font-size: .6875rem; }
html { scroll-padding-top: var(--cms-topbar-height); }
.cms-main { min-width: 0; min-height: 100vh; display: flex; flex-direction: column; padding-top: var(--cms-topbar-height); }
.cms-topbar { display: flex; align-items: center; gap: 24px; min-height: 80px; padding: 16px 32px; border-bottom: 1px solid var(--cms-border); background: var(--cms-surface); }
.cms-topbar-title { font-size: .875rem; font-weight: 600; }
.cms-website-selector { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.cms-website-selector label { font-size: .75rem; color: var(--cms-text-muted); }
.cms-website-selector .form-select { width: 174px; font-size: .8125rem; min-height: 40px; border-radius: 8px; background-color: var(--cms-surface-secondary); color: var(--cms-text); border-color: var(--cms-border); opacity: 1; }
.cms-topbar-actions { display: flex; align-items: center; gap: 10px; }
.cms-button, .cms-icon-button, .cms-user-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; font-size: .8125rem; border-radius: 8px; color: var(--cms-text); }
.cms-button { padding: 9px 14px; border: 1px solid var(--cms-border); background: var(--cms-surface); white-space: nowrap; }
.cms-button .bx { font-size: 17px; }
.cms-icon-button { width: 42px; min-height: 42px; font-size: 23px; }
.cms-button:hover, .cms-icon-button:hover, .cms-user-button:hover { color: var(--cms-primary); background: var(--cms-primary-subtle); border-color: var(--cms-border); }
.cms-button:disabled, .cms-quick-action:disabled { opacity: 1; color: var(--cms-text-muted); background: var(--cms-surface-secondary); border-color: var(--cms-border); }
.cms-user-button { padding: 0 4px; }
.cms-avatar { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--cms-primary-subtle); color: var(--cms-primary); font-size: 20px; }
.dropdown-menu { --bs-dropdown-bg: var(--cms-surface); --bs-dropdown-color: var(--cms-text); --bs-dropdown-border-color: var(--cms-border); --bs-dropdown-link-disabled-color: var(--cms-text-muted); --bs-dropdown-header-color: var(--cms-text-muted); --bs-dropdown-link-hover-bg: var(--cms-primary-subtle); --bs-dropdown-link-hover-color: var(--cms-primary); border-radius: 10px; padding: 8px; box-shadow: var(--cms-shadow); }
.dropdown-item { padding: 10px 12px; font-size: .8125rem; }
.cms-content { padding: 32px; width: 100%; flex: 1; }
.cms-page-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.cms-eyebrow { font-size: .625rem; letter-spacing: .15em; color: var(--cms-text-muted); font-weight: 700; margin: 0 0 6px; }
.cms-page-header h1 { font-size: 1.875rem; font-weight: 650; letter-spacing: -.045em; margin: 0 0 6px; }
.cms-page-header p:not(.cms-eyebrow) { font-size: .875rem; }
.card { --bs-card-bg: var(--cms-surface); --bs-card-border-color: var(--cms-border); --bs-card-border-radius: 12px; color: var(--cms-text); box-shadow: var(--cms-shadow); }
.card-body { padding: 24px; }
.cms-summary .card-body { padding: 20px 24px; }
.cms-summary dt { color: var(--cms-text-muted); font-size: .6875rem; font-weight: 500; margin-bottom: 6px; }
.cms-summary dd { font-size: .8125rem; font-weight: 500; margin: 0; overflow-wrap: anywhere; }
.cms-preview-label { font-size: .5625rem; margin-left: 4px; padding: 2px 5px; border: 1px solid var(--cms-border); border-radius: 4px; text-transform: uppercase; letter-spacing: .05em; }
.cms-status-badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px; border-radius: 6px; background: var(--cms-success-subtle); color: var(--cms-success); font-size: .6875rem; }
.cms-status-dot { display: inline-block; width: 6px; height: 6px; background: var(--cms-success); border-radius: 50%; flex-shrink: 0; }
.cms-metric .card-body { padding: 20px; }
.cms-metric h2 { font-size: .8125rem; color: var(--cms-text-muted); margin: 0; font-weight: 500; }
.cms-metric-icon { color: var(--cms-text-muted); font-size: 21px; }
.cms-metric-value { font-size: 2rem; font-weight: 600; line-height: 1.3; letter-spacing: -.04em; margin: 14px 0 6px; font-variant-numeric: tabular-nums; }
.cms-metric-description { font-size: .6875rem; color: var(--cms-text-muted); margin: 0; }
.cms-section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.cms-section-header h2 { font-size: .9375rem; font-weight: 600; margin: 0 0 5px; letter-spacing: -.015em; }
.cms-section-header p { font-size: .75rem; color: var(--cms-text-muted); margin: 0; }
.cms-meta-label { font-size: .625rem; color: var(--cms-text-muted); background: var(--cms-surface-secondary); border: 1px solid var(--cms-border); padding: 3px 8px; border-radius: 5px; white-space: nowrap; }
.cms-section-icon { color: var(--cms-text-muted); font-size: 20px; }
.cms-empty-state { min-height: 195px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 24px 12px; }
.cms-empty-state-lg { min-height: 250px; }
.cms-empty-icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 14px; background: var(--cms-surface-secondary); color: var(--cms-text-muted); border: 1px solid var(--cms-border); border-radius: 12px; font-size: 22px; }
.cms-empty-state h3 { font-size: .8125rem; font-weight: 500; margin: 0 0 5px; }
.cms-empty-state p { font-size: .75rem; color: var(--cms-text-muted); max-width: 290px; margin: 0; }
.cms-chart { min-height: 250px; overflow: hidden; }

/* Settings presentation stays scoped to the existing schema-driven form. */
#cms-settings .cms-settings-navigation { padding: 16px; background: var(--cms-surface-secondary); border-radius: 16px; }
#cms-settings .cms-settings-nav-heading { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; color: var(--cms-text-muted); font-size: .75rem; font-weight: 600; }
#settings-nav { flex-direction: column; }
#settings-nav .cms-button { justify-content: flex-start; min-height: 46px; padding: 12px 14px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--cms-text-muted); text-align: left; white-space: normal; overflow-wrap: anywhere; }
#settings-nav .cms-button:hover { background: var(--cms-surface); color: var(--cms-text); }
#settings-nav .cms-button.active { border-color: var(--cms-border); background: var(--cms-primary-subtle); color: var(--cms-primary); font-weight: 600; box-shadow: inset 3px 0 var(--cms-primary); }
#cms-settings .cms-settings-content { min-width: 0; }
#cms-settings .cms-settings-description { margin: 0 0 16px; color: var(--cms-text-muted); font-size: .8125rem; }
#settings-sections > .card { border-radius: 16px; }
#settings-sections > .card > .card-body { padding: 28px; }
#settings-sections h2 { padding-bottom: 20px; border-bottom: 1px solid var(--cms-border); color: var(--cms-text); font-weight: 600; letter-spacing: -.02em; overflow-wrap: anywhere; }
#settings-sections .form-label { margin-bottom: 8px; color: var(--cms-text); font-size: .875rem; font-weight: 600; }
#settings-sections .form-control,
#settings-sections .form-select { min-height: 44px; border-color: var(--cms-border); border-radius: 10px; background-color: var(--cms-surface-secondary); color: var(--cms-text); font-size: .875rem; }
#settings-sections .form-control { padding: 10px 12px; }
#settings-sections .form-select { padding-top: 10px; padding-bottom: 10px; }
#settings-sections .form-control::placeholder { color: var(--cms-text-muted); opacity: 1; }
#settings-sections .form-control:focus,
#settings-sections .form-select:focus { background-color: var(--cms-surface); border-color: var(--cms-primary); box-shadow: 0 0 0 3px var(--cms-primary-subtle); }
#settings-sections fieldset:disabled .form-control,
#settings-sections fieldset:disabled .form-select { opacity: .65; }
#cms-settings textarea.form-control { min-height: 160px; resize: vertical; }
#settings-sections .mb-4 { margin-bottom: 28px !important; }
#settings-sections .border.rounded { border-radius: 12px !important; background: var(--cms-surface-secondary); }
#settings-sections .d-flex { flex-wrap: wrap; }
#cms-settings .cms-settings-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; padding: 20px 24px; border: 1px solid var(--cms-border); border-radius: 16px; background: var(--cms-surface); box-shadow: var(--cms-shadow); }
#settings-save { min-height: 44px; padding: 11px 20px; border-radius: 10px; background: var(--cms-primary); border-color: var(--cms-primary); color: var(--cms-surface); font-weight: 600; }
#settings-save:hover { background: var(--cms-primary); border-color: var(--cms-primary); color: var(--cms-surface); box-shadow: 0 0 0 3px var(--cms-primary-subtle); }
#settings-save:disabled { background: var(--cms-surface-secondary); border-color: var(--cms-border); color: var(--cms-text-muted); box-shadow: none; }
@media (min-width: 992px) {
    #cms-settings .cms-settings-navigation { position: sticky; top: calc(var(--cms-topbar-height) + 24px); max-height: calc(100vh - var(--cms-topbar-height) - 48px); overflow-y: auto; }
}
@media (max-width: 991.98px) {
    #settings-nav { flex-direction: row; overflow-x: auto; padding-bottom: 4px; }
    #settings-nav .cms-button { flex: 0 0 auto; white-space: nowrap; }
}
@media (max-width: 575.98px) {
    #settings-sections > .card > .card-body { padding: 20px; }
    #cms-settings .cms-settings-actions { padding: 20px; }
    #settings-save { width: 100%; }
}

/* Shared Select2 controls use the same sizing and theme as Bootstrap form controls. */
.form-select + .select2-container { width: 100% !important; max-width: 100%; min-width: 0; }
.select2-container { font-family: inherit; font-size: 1rem; line-height: 1.5; }
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    min-height: calc(1.5em + .75rem + 2px);
    border: 1px solid var(--cms-border);
    border-radius: var(--bs-border-radius);
    background: var(--bs-body-bg);
    color: var(--cms-text);
}
.select2-container--default .select2-selection--single { height: calc(1.5em + .75rem + 2px); padding: .375rem 2.25rem .375rem .75rem; }
.select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0; line-height: 1.5; color: var(--cms-text); }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--cms-text-muted); }
.select2-container--default .select2-selection--single .select2-selection__arrow { top: 0; right: .75rem; height: 100%; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: var(--cms-text-muted) transparent transparent; }
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent var(--cms-text-muted); }
.select2-container--default .select2-selection__clear { color: var(--cms-text-muted); }
.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default.select2-container--open .select2-selection,
.select2-container--default .select2-selection:focus-visible {
    outline: 0;
    border-color: var(--cms-primary);
    box-shadow: 0 0 0 3px var(--cms-primary-subtle);
}
.is-invalid + .select2-container .select2-selection { border-color: var(--cms-danger); }
.select2-container--default.select2-container--disabled .select2-selection {
    background: var(--bs-secondary-bg);
    color: var(--cms-text-muted);
    border-color: var(--cms-border);
    box-shadow: none;
    cursor: not-allowed;
}
.select2-container--default.select2-container--disabled .select2-selection__rendered { color: var(--cms-text-muted); }
.select2-dropdown { background: var(--cms-surface); color: var(--cms-text); border-color: var(--cms-border); border-radius: var(--bs-border-radius); box-shadow: var(--cms-shadow); }
.select2-search--dropdown { padding: .5rem; }
.select2-container--default .select2-search--dropdown .select2-search__field {
    padding: .375rem .75rem;
    font: inherit;
    background: var(--cms-surface-secondary);
    color: var(--cms-text);
    border: 1px solid var(--cms-border);
    border-radius: var(--bs-border-radius);
}
.select2-container--default .select2-search__field::placeholder { color: var(--cms-text-muted); opacity: 1; }
.select2-container--default .select2-search__field:focus { outline: 0; border-color: var(--cms-primary); box-shadow: 0 0 0 3px var(--cms-primary-subtle); }
.select2-results__option { padding: .375rem .75rem; overflow-wrap: anywhere; }
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option--selected { background: var(--cms-surface-secondary); color: var(--cms-text); }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: var(--cms-primary-subtle); color: var(--cms-primary); }
.select2-container--default .select2-results__option[aria-disabled=true],
.select2-container--default .select2-results__option--disabled { color: var(--cms-text-muted); }
.select2-container--default .select2-selection--multiple { padding: 0 .5rem .25rem; }
.select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 0; color: var(--cms-text); }
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin: .25rem .25rem 0 0;
    background: var(--cms-surface-secondary);
    color: var(--cms-text);
    border: 1px solid var(--cms-border);
    border-radius: var(--bs-border-radius-sm);
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: var(--cms-text-muted); border-color: var(--cms-border); }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { background: var(--cms-primary-subtle); color: var(--cms-primary); }
.select2-container--default .select2-search--inline .select2-search__field { color: var(--cms-text); background: transparent; font: inherit; }

.cms-quick-actions { display: grid; gap: 8px; margin-top: 22px; }
.cms-quick-action { display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--cms-border); border-radius: 8px; min-height: 43px; padding: 10px 12px; font-size: .75rem; text-align: left; }
.cms-quick-action span { display: inline-flex; align-items: center; gap: 10px; }
.cms-quick-action .bx { font-size: 18px; }
.cms-footer { display: flex; justify-content: space-between; gap: 12px; margin: 0 32px; padding: 20px 0; border-top: 1px solid var(--cms-border); color: var(--cms-text-muted); font-size: .6875rem; }
.cms-footer-divider { padding: 0 8px; color: var(--cms-border); }

@media (min-width: 992px) {
    .cms-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--cms-sidebar-width); display: flex; flex-direction: column; z-index: 1030; }
    .cms-sidebar .offcanvas-body { flex-grow: 1; }
    .cms-main { margin-left: var(--cms-sidebar-width); }
    .cms-topbar { left: var(--cms-sidebar-width); }
    .cms-sidebar .offcanvas-body { min-height: 0; }
}
@media (max-width: 1199.98px) {
    .cms-topbar { gap: 16px; padding: 16px 24px; }
    .cms-content { padding: 28px 24px; }
    .cms-footer { margin-inline: 24px; }
}
@media (max-width: 575.98px) {
    :root { --cms-topbar-height: 130px; }
    .cms-topbar { flex-wrap: wrap; gap: 12px; padding: 12px 16px; }
    .cms-topbar-actions { margin-left: auto; gap: 8px; }
    .cms-website-selector { order: 3; width: 100%; margin: 0; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--cms-border); }
    .cms-website-selector .form-select { width: min(220px, 75%); }
    .cms-content { padding: 24px 16px; }
    .cms-page-header { align-items: flex-start; flex-direction: column; gap: 14px; }
    .cms-page-header h1 { font-size: 1.625rem; }
    .card-body, .cms-summary .card-body { padding: 20px; }
    .cms-metric .card-body { padding: 16px; }
    .cms-metric h2 { font-size: .75rem; }
    .cms-footer { margin-inline: 16px; flex-wrap: wrap; }
    .cms-section-header { flex-wrap: wrap; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* Workspace list and shared action feedback. */
.cms-workspace-card { overflow: hidden; }
.cms-workspace-card .card-body { padding: 24px; }
.cms-workspace-icon, .cms-feedback-icon { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: var(--cms-primary-subtle); color: var(--cms-primary); font-size: 25px; flex-shrink: 0; }
.cms-workspace-details { padding: 16px 0; margin-bottom: 0; border-top: 1px solid var(--cms-border); }
.cms-workspace-details > div { display: flex; justify-content: space-between; gap: 16px; padding: 4px 0; font-size: .8125rem; }
.cms-workspace-details dt { font-weight: 400; color: var(--cms-text-muted); flex-shrink: 0; }
.cms-workspace-details dt .mdi { margin-right: 7px; }
.cms-workspace-details dd { text-align: right; margin: 0; overflow-wrap: anywhere; }
.cms-workspace-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 16px; border-top: 1px solid var(--cms-border); }
.cms-workspace-actions > * { flex: 1 1 auto; }
.cms-button-primary { background: var(--cms-primary-subtle); color: var(--cms-primary); border-color: var(--cms-primary-subtle); }
.cms-button-danger, .cms-button-danger:hover { color: var(--cms-danger); }
.cms-button-danger:hover { border-color: var(--cms-danger); background: var(--cms-surface-secondary); }
.cms-feedback-modal .modal-dialog { max-width: 420px; margin-left: auto; margin-right: auto; width: calc(100% - 32px); }
.cms-feedback-modal .modal-content { background: var(--cms-surface); color: var(--cms-text); border: 1px solid var(--cms-border); border-radius: 18px; box-shadow: var(--cms-shadow); }
.cms-feedback-modal .modal-body { padding: 28px 24px 24px; }
.cms-feedback-modal .modal-footer { padding: 16px 24px; border-color: var(--cms-border); background: var(--cms-surface-secondary); border-radius: 0 0 18px 18px; }
.cms-feedback-icon { width: 56px; height: 56px; font-size: 30px; margin-bottom: 18px; }
.cms-feedback-modal[data-kind="success"] .cms-feedback-icon { color: var(--cms-success); background: var(--cms-success-subtle); }
.cms-feedback-modal[data-kind="error"] .cms-feedback-icon, .cms-feedback-danger { color: var(--cms-danger); background: var(--cms-surface-secondary); }
.cms-feedback-modal[data-kind="warning"] .cms-feedback-icon { color: var(--cms-warning); background: var(--cms-surface-secondary); }
@media (max-width: 575.98px) {
    .cms-workspace-actions > form { flex-basis: 100%; }
}

/* AJAX Pages list. */
.cms-pages-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 16px; margin-bottom: 20px; }
.cms-pages-search { flex: 1 1 240px; position: relative; }
.cms-pages-search > .mdi { position: absolute; left: 12px; top: 9px; color: var(--cms-text-muted); }
.cms-pages-search input { padding-left: 36px; padding-right: 44px; }
.cms-pages-search button { position: absolute; right: 2px; top: 0; }
.cms-pages-search input::-webkit-search-cancel-button { display: none; }
.cms-page-list { display: grid; gap: 10px; }
.cms-page-row { display: flex; align-items: center; gap: 16px; padding: 18px; border: 1px solid var(--cms-border); border-radius: 12px; background: var(--cms-surface); }
.cms-page-icon { display: grid; place-items: center; flex: 0 0 40px; height: 44px; border-radius: 9px; background: var(--cms-primary-subtle); color: var(--cms-primary); font-size: 23px; }
.cms-page-info { flex: 1; min-width: 0; }
.cms-page-title { margin: 0 0 4px; font-size: .9375rem; font-weight: 600; overflow-wrap: anywhere; }
.cms-page-slug { margin: 0 0 10px; color: var(--cms-text-muted); font-size: .8125rem; overflow-wrap: anywhere; }
.cms-page-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; color: var(--cms-text-muted); font-size: .75rem; overflow-wrap: anywhere; }
.cms-page-status { padding: 2px 9px; border-radius: 6px; background: var(--cms-surface-secondary); color: var(--cms-text-muted); text-transform: capitalize; }
.cms-page-status[data-status="published"] { background: var(--cms-success-subtle); color: var(--cms-success); }
.cms-page-status[data-status="draft"] { color: var(--cms-warning); }
.cms-page-actions { display: flex; gap: 8px; flex-shrink: 0; }
.cms-page-skeleton { min-height: 118px; }
.cms-page-skeleton span { display: block; height: 16px; border-radius: 5px; background: var(--cms-border); }
.cms-page-skeleton > span { width: 44px; height: 40px; }
.cms-page-skeleton > div { flex: 1; display: grid; gap: 12px; }
.cms-page-skeleton > div span:first-child { width: 55%; }
.cms-page-skeleton > div span:last-child { width: 80%; }
@media (max-width: 767.98px) {
    .cms-page-row { flex-wrap: wrap; align-items: flex-start; padding: 14px; gap: 12px; }
    .cms-page-actions { width: 100%; padding-top: 12px; border-top: 1px solid var(--cms-border); }
    .cms-page-actions > * { flex: 1; }
    .cms-pages-search { flex-basis: 100%; }
}

/* Contents table and featured media share the Admin theme. */
.cms-contents-toolbar { display: grid; grid-template-columns: minmax(12rem, 2fr) repeat(3, minmax(8rem, 1fr)) 6rem; gap: 1rem; margin-bottom: 1.5rem; }
.cms-contents-table { --bs-table-bg: var(--cms-surface); --bs-table-color: var(--cms-text); --bs-table-border-color: var(--cms-border); vertical-align: middle; margin-top: 1rem; }
.cms-contents-table th { color: var(--cms-text-muted); font-size: .75rem; font-weight: 600; white-space: nowrap; }
.cms-contents-table td { padding: 1rem .75rem; }
.cms-contents-table tbody tr:hover { background: var(--cms-surface-secondary); }
.cms-content-summary { display: flex; align-items: center; gap: .75rem; min-width: 13rem; overflow-wrap: anywhere; }
.cms-content-thumb { width: 44px; height: 44px; border-radius: .5rem; object-fit: cover; flex-shrink: 0; }
.cms-content-skeleton .placeholder { background: var(--cms-border); min-height: 1rem; }
.cms-media-dropzone.dropzone { background: var(--cms-surface-secondary); border: 2px dashed var(--cms-border); border-radius: .75rem; color: var(--cms-text); min-height: 180px; }
.cms-media-dropzone .dz-message .mdi { font-size: 2rem; color: var(--cms-primary); }
.cms-media-dropzone .dz-message small { color: var(--cms-text-muted); }
.cms-media-dropzone.dropzone .dz-preview { background: var(--cms-surface); color: var(--cms-text); }
.cms-media-dropzone .dz-remove { color: var(--cms-primary); padding-top: .75rem; }
@media (max-width: 1199.98px) { .cms-contents-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .cms-contents-toolbar { grid-template-columns: minmax(0, 1fr); } .cms-contents-table .cms-page-actions { flex-wrap: nowrap; } }

/* Menu manager */
.cms-menu-manager { display: grid; grid-template-columns: minmax(210px, 260px) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.cms-menu-choice { display: block; width: 100%; text-align: left; border: 1px solid transparent; border-radius: .6rem; padding: .8rem; margin-bottom: .4rem; background: transparent; color: var(--cms-text); overflow-wrap: anywhere; }
.cms-menu-choice:hover { background: var(--cms-surface-secondary); }
.cms-menu-choice.active { border-color: var(--cms-primary); background: var(--cms-primary-subtle); }
.cms-menu-tree { list-style: none; padding: 0; margin: 0 0 1rem; }
.cms-menu-tree .cms-menu-tree { padding-left: 1.25rem; margin-left: .6rem; border-left: 1px solid var(--cms-border); }
.cms-menu-row { display: flex; gap: .75rem; align-items: center; border: 1px solid var(--cms-border); border-radius: .6rem; padding: .85rem; margin-bottom: .6rem; background: var(--cms-surface); }
.cms-menu-item-body { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.cms-menu-item-actions { display: flex; gap: .4rem; flex-wrap: wrap; }
.cms-menu-modal .modal-content { background: var(--cms-surface); color: var(--cms-text); border: 1px solid var(--cms-border); border-radius: 1rem; }
.cms-menu-modal .modal-header { border-color: var(--cms-border); }
@media (max-width: 991.98px) { .cms-menu-manager { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) { .cms-menu-row { flex-wrap: wrap; } .cms-menu-item-actions { flex-basis: 100%; } .cms-menu-tree .cms-menu-tree { padding-left: .5rem; margin-left: .25rem; } }

/* Nested menu ordering: only the handle initiates dragging. */
.cms-menu-drag-handle { cursor: grab; touch-action: none; padding: .4rem; margin: -.4rem; user-select: none; }
.cms-menu-drag-handle:active, .cms-menu-sort-chosen .cms-menu-drag-handle { cursor: grabbing; }
.cms-menu-sortable > .cms-menu-tree { min-height: 36px; }
.cms-menu-tree .cms-menu-tree:empty { margin-bottom: 0; border-color: transparent; }
.cms-menu-dragging .cms-menu-tree:empty { min-height: 32px; border: 1px dashed var(--cms-border); border-radius: .4rem; margin-bottom: .6rem; background: var(--cms-surface-secondary); }
.cms-menu-sort-ghost > .cms-menu-row { opacity: .45; border: 2px dashed var(--cms-primary); background: var(--cms-primary-subtle); }
.cms-menu-sort-chosen > .cms-menu-row { border-color: var(--cms-primary); }
.cms-menu-sort-drag { list-style: none; opacity: .95; }

/* Media Library */
.cms-media-toolbar { display: grid; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)); gap: 1rem; }
.cms-media-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 1.5rem; align-items: start; }
.cms-media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 1rem; }
.cms-media-tile { padding: 0; min-width: 0; border: 1px solid var(--cms-border); border-radius: .7rem; overflow: hidden; background: var(--cms-surface); color: var(--cms-text); text-align: left; transition: border-color .15s, box-shadow .15s; }
.cms-media-tile:hover, .cms-media-tile[aria-pressed="true"] { border-color: var(--cms-primary); box-shadow: 0 0 0 2px var(--cms-primary-subtle); }
.cms-media-thumbnail, .cms-media-preview { display: flex; align-items: center; justify-content: center; background: var(--cms-surface-secondary); color: var(--cms-text-muted); aspect-ratio: 4 / 3; overflow: hidden; }
.cms-media-thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.cms-media-preview img { width: 100%; height: 100%; object-fit: contain; }
.cms-media-thumbnail .mdi, .cms-media-preview .mdi { font-size: 3rem; }
.cms-media-caption { display: block; padding: .75rem; }
.cms-media-caption strong { font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cms-media-caption small { font-size: .7rem; }
.cms-media-detail { scroll-margin-top: 160px; min-width: 0; }
.cms-media-facts { font-size: .75rem; margin-top: 1rem; }
.cms-media-facts dt { color: var(--cms-text-muted); font-weight: 500; }
.cms-media-facts dd { overflow-wrap: anywhere; margin-bottom: .7rem; }
.cms-media-empty { grid-column: 1 / -1; }
.cms-media-skeleton { aspect-ratio: 1; border-radius: .7rem; overflow: hidden; background: var(--cms-surface-secondary); }
.cms-media-skeleton .placeholder { height: 100%; background: var(--cms-border); }
.cms-media-modal .modal-content { background: var(--cms-surface); color: var(--cms-text); border: 1px solid var(--cms-border); border-radius: 1rem; }
.cms-media-modal .modal-header, .cms-media-modal .modal-footer { border-color: var(--cms-border); }
@media (max-width: 1199.98px) { .cms-media-layout { grid-template-columns: minmax(0, 1fr) 270px; } }
@media (max-width: 991.98px) { .cms-media-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) { .cms-media-toolbar { grid-template-columns: minmax(0, 1fr); } .cms-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; } }
@media (max-width: 359.98px) { .cms-media-grid { grid-template-columns: minmax(0, 1fr); } }
.cms-media-modal .dropzone .dz-preview .dz-details { color: var(--cms-text); }
.cms-media-modal .dropzone .dz-preview .dz-details .dz-size span,
.cms-media-modal .dropzone .dz-preview .dz-details .dz-filename span { background: var(--cms-surface); border-color: var(--cms-border); }
.cms-media-modal .dropzone .dz-preview .dz-progress { background: var(--cms-surface-secondary); border-color: var(--cms-border); }
.cms-media-modal .dropzone .dz-preview .dz-progress .dz-upload { background: var(--cms-primary); }

/* Statistics: reuse the CMS surfaces and typography across analytics widgets. */
.cms-statistics-range { min-width: 200px; max-width: 100%; }
.cms-statistics-custom { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem; margin-top: .75rem; }
.cms-statistics-custom > div { flex: 1 1 145px; min-width: 0; }
#cms-statistics .row > *, #cms-statistics .card, #cms-statistics .card-body { min-width: 0; }
.cms-statistics-chart { min-height: 300px; min-width: 0; overflow: hidden; }
.cms-statistics-donut { min-height: 230px; min-width: 0; overflow: hidden; }
.cms-statistics-breakdown { margin-bottom: 1rem; font-size: .8125rem; }
.cms-statistics-breakdown:last-child { margin-bottom: 0; }
.cms-statistics-progress { display: block; width: 100%; height: 6px; border: 0; border-radius: 8px; overflow: hidden; background: var(--cms-surface-secondary); color: var(--cms-primary); }
.cms-statistics-progress::-webkit-progress-bar { background: var(--cms-surface-secondary); }
.cms-statistics-progress::-webkit-progress-value { background: var(--cms-primary); border-radius: 8px; }
.cms-statistics-progress::-moz-progress-bar { background: var(--cms-primary); border-radius: 8px; }
.cms-statistics-table { --bs-table-bg: var(--cms-surface); --bs-table-color: var(--cms-text); --bs-table-border-color: var(--cms-border); font-size: .8125rem; margin-bottom: 0; }
.cms-statistics-table th { color: var(--cms-text-muted); font-size: .6875rem; font-weight: 500; }
.cms-statistics-table th:not(:first-child) { text-align: right; }
.cms-statistics-table td { padding-top: .85rem; padding-bottom: .85rem; vertical-align: middle; }
.cms-statistics-table td:first-child { min-width: 100px; max-width: 280px; overflow-wrap: anywhere; }
#cms-statistics .apexcharts-tooltip, #cms-statistics .apexcharts-tooltip-title { background: var(--cms-surface); color: var(--cms-text); border-color: var(--cms-border); }
@media (max-width: 575.98px) {
    .cms-statistics-range { width: 100%; min-width: 0; }
    .cms-statistics-custom { flex-direction: column; align-items: stretch; }
    .cms-statistics-custom > div { flex: auto; }
}

/* Booking calendars reuse the CMS palette and keep toolbars usable on small screens. */
#booking-app { min-width:0; --fc-page-bg-color:var(--cms-surface); --fc-neutral-bg-color:var(--cms-surface-secondary); --fc-border-color:var(--cms-border); --fc-list-event-hover-bg-color:var(--cms-primary-subtle); --fc-today-bg-color:var(--cms-primary-subtle); --fc-button-bg-color:var(--cms-primary); --fc-button-border-color:var(--cms-primary); }
#booking-app .fc .fc-toolbar { flex-wrap:wrap; gap:10px; }
#booking-app .fc .fc-toolbar-title { font-size:1.15rem; }
#booking-app .form-label { max-width:100%; }
#booking-app .fc a { color:inherit; }
#booking-app .fc-list-event-title { overflow-wrap:anywhere; }
@media(max-width:575px){#booking-app .fc .fc-toolbar-chunk{max-width:100%}#booking-app .card-body{min-width:0}}

/* Booking presentation: scoped to booking views, including their result-independent forms. */
.booking-page-header h1 { font-size:1.5rem; overflow-wrap:anywhere; }
.booking-back { display:inline-flex; align-items:center; gap:6px; margin-bottom:12px; color:var(--cms-text-muted); font-size:.8125rem; text-decoration:none; }
.booking-header-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:10px; color:var(--cms-text-muted); font-size:.75rem; }
#booking-app .card { border-radius:10px; box-shadow:none; }
#booking-app .card-body { padding:20px; min-width:0; }
.booking-stat .card-body { display:flex; align-items:center; gap:12px; }
.booking-stat-icon { display:grid; place-items:center; width:38px; height:38px; flex-shrink:0; border-radius:10px; background:var(--cms-primary-subtle); color:var(--cms-primary); font-size:20px; }
.booking-stat-icon--paid,.booking-stat-icon--confirmed { background:var(--cms-success-subtle); color:var(--cms-success); }
.booking-stat label,.booking-stat .text-muted { font-size:.75rem; }
.booking-stat strong { display:block; font-size:1.35rem; line-height:1.4; overflow-wrap:anywhere; }
.booking-toolbar .form-label,#booking-app .booking-save-form .form-label { font-size:.75rem; color:var(--cms-text-muted); margin-bottom:10px; }
#booking-app .form-control,#booking-app .form-select { min-width:0; background-color:var(--cms-surface-secondary); color:var(--cms-text); border-color:var(--cms-border); border-radius:7px; font-size:.8125rem; }
.booking-search { position:relative; }
.booking-search > .mdi { position:absolute; left:11px; top:9px; color:var(--cms-text-muted); }
.booking-search input { padding-left:34px; }
.booking-table { --bs-table-bg:var(--cms-surface); --bs-table-color:var(--cms-text); --bs-table-border-color:var(--cms-border); font-size:.8125rem; margin:0; }
.booking-table th { background:var(--cms-surface-secondary); color:var(--cms-text-muted); font-size:.6875rem; font-weight:600; white-space:nowrap; padding:10px 12px; }
.booking-table td { padding:12px; vertical-align:middle; }
.booking-table td small { color:var(--cms-text-muted); }
.booking-table tbody tr:last-child td { border-bottom:0; }
.booking-table a { text-decoration:none; }
.booking-badge { display:inline-flex; align-items:center; white-space:nowrap; border-radius:6px; padding:4px 7px; font-size:.6875rem; font-weight:600; color:var(--cms-text-muted); background:var(--cms-surface-secondary); }
.booking-badge--success { color:var(--cms-success); background:var(--cms-success-subtle); }
.booking-badge--warning { color:var(--cms-warning); background:color-mix(in srgb,var(--cms-warning) 12%,transparent); }
.booking-badge--danger { color:var(--cms-danger); background:color-mix(in srgb,var(--cms-danger) 12%,transparent); }
.booking-badge--info { color:var(--cms-info); background:color-mix(in srgb,var(--cms-info) 12%,transparent); }
.booking-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding-top:20px; font-size:.75rem; color:var(--cms-text-muted); }
#booking-app .booking-button-sm,#booking-app .booking-icon-button { min-height:32px; padding:5px 9px; font-size:.75rem; }
.booking-section-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.booking-section-heading h2,.booking-section-title { font-size:.9375rem; font-weight:600; margin:0 0 20px; }
.booking-section-heading h2 { margin:0; }
.booking-section-heading small { color:var(--cms-text-muted); }
.booking-empty { display:flex; flex-direction:column; align-items:center; text-align:center; padding:32px 12px; gap:6px; color:var(--cms-text-muted); }
.booking-empty > .mdi { font-size:26px; color:var(--cms-primary); }
.booking-empty strong { color:var(--cms-text); font-size:.875rem; font-weight:500; }
.booking-empty p { margin:0; font-size:.75rem; }
.booking-empty--small { padding:16px 8px; }
.booking-load-state { color:var(--cms-text-muted); font-size:.75rem; }
.booking-load-state:empty { display:none; }
.booking-customer { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:0; }
.booking-customer dt,.booking-totals dt { color:var(--cms-text-muted); font-size:.75rem; font-weight:400; }
.booking-customer dd { margin:5px 0 0; font-size:.875rem; overflow-wrap:anywhere; }
.booking-note { margin-top:16px; padding:12px; background:var(--cms-surface-secondary); border-radius:7px; font-size:.8125rem; overflow-wrap:anywhere; }
.booking-totals { margin:0; }
.booking-totals > div { display:flex; justify-content:space-between; gap:12px; margin-bottom:12px; }
.booking-totals dd { margin:0; font-size:.875rem; overflow-wrap:anywhere; }
.booking-total { border-top:1px solid var(--cms-border); padding-top:14px; }
.booking-total dt,.booking-total dd { color:var(--cms-text); font-weight:650; font-size:1rem; }
.booking-payments { list-style:none; margin:0; padding:0; }
.booking-payments li { padding:16px 0; border-top:1px solid var(--cms-border); }
.booking-payment-top,.booking-payment-bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.booking-payment-top { font-size:.8125rem; }
.booking-payment-bottom { margin-top:8px; font-size:.75rem; color:var(--cms-text-muted); overflow-wrap:anywhere; }
.booking-modal .modal-content { background:var(--cms-surface); color:var(--cms-text); border:1px solid var(--cms-border); border-radius:12px; }
.booking-modal .modal-header,.booking-modal .modal-footer { border-color:var(--cms-border); padding:16px 20px; }
.booking-modal .modal-body { padding:24px; }
.booking-modal .modal-title { font-size:1rem; }
.booking-modal .booking-amount-input { font-size:1.125rem !important; }
.booking-slot-form .form-control,.booking-slot-form .form-select { margin-top:6px; }
#booking-app .fc .fc-button { font-size:.75rem; border-radius:6px; background:var(--cms-primary-subtle); border-color:var(--cms-border); color:var(--cms-text); box-shadow:none; }
#booking-app .fc .fc-button-active { background:var(--cms-primary-subtle); color:var(--cms-primary); }
#booking-app .fc .fc-toolbar-title { font-size:1rem; }
#booking-app .fc .fc-col-header-cell { font-size:.75rem; font-weight:500; }
#booking-app .fc .fc-event { border-radius:5px; background:var(--cms-primary-subtle); border-color:var(--cms-border); color:var(--cms-text); }
#booking-app .fc .fc-event-main { color:var(--cms-text); }
#booking-app .fc .fc-list-day-cushion { background:var(--cms-surface-secondary); }
.booking-skeleton-row span { display:block; height:12px; min-width:35px; border-radius:4px; background:var(--cms-surface-secondary); }
@media(max-width:575.98px) {
 #booking-app .card-body { padding:16px; }
 .booking-stat .card-body { align-items:flex-start; gap:8px; }
 .booking-stat-icon { width:30px; height:30px; font-size:17px; }
 .booking-stat strong { font-size:1.1rem; }
 .booking-customer { grid-template-columns:1fr; gap:14px; }
 .booking-page-header { flex-wrap:wrap; }
 #booking-app .fc .fc-toolbar { justify-content:center; }
 .booking-modal .modal-body { padding:20px 16px; }
}
.booking-stat p,.booking-section-heading p { margin:0 0 4px; font-size:.75rem; color:var(--cms-text-muted); }
.booking-stat .card-body > div { min-width:0; }
.booking-caption { font-size:.75rem; color:var(--cms-text-muted); }
.booking-empty h3 { font-size:.875rem; margin:0; color:var(--cms-text); }
.booking-date-cell small,.booking-payment-bottom small { display:block; }
.booking-number { font-variant-numeric:tabular-nums; }
.booking-note p { margin:6px 0 0; }
.booking-customer dt .mdi,.booking-section-heading h2 .mdi { margin-right:6px; }
.booking-modal .modal-content > form { display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.booking-modal .modal-body { overflow-y:auto; }
.booking-modal .modal-footer { flex-shrink:0; }

/* Booking spacing stays independent of loading-message visibility. */
.booking-page-header h1 { margin-bottom:8px; }
#booking-filters { margin-bottom:24px; }
.booking-load-state { margin:12px 0; }
.booking-section-heading h2 + p { margin-top:6px; }
#booking-app .booking-slot-form > .form-label { margin-bottom:16px; }
.booking-slot-form > .d-flex { padding-top:4px; }
.booking-modal .modal-body > .row { --bs-gutter-y:20px; }
.booking-totals > div:last-child { margin-bottom:0; }
.booking-payments li:last-child { padding-bottom:0; }