/* Shared visual foundation for the layered backoffice.
 * Page-specific styles keep their layout and character; these tokens make the
 * surrounding typography, colours and component geometry feel intentional. */
:root {
    --dw-font-sans: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --dw-app-background: #f3f6fb;
    --dw-sidebar-background: #edf2f8;
    --dw-surface: #ffffff;
    --dw-surface-subtle: #f8fafc;
    --dw-ink: #344767;
    --dw-muted: #7b8ca5;
    --dw-border: #dfe6ef;
    --dw-primary: #4f61d8;
    --dw-primary-hover: #4050c4;
    --dw-primary-soft: #eef0ff;
    --dw-success: #18875d;
    --dw-success-soft: #eaf8f1;
    --dw-error: #c2414a;
    --dw-error-soft: #fff0f1;
    --dw-info: #3974c6;
    --dw-info-soft: #edf5ff;
    --dw-notice: #a56518;
    --dw-notice-soft: #fff7e7;
    --dw-card-shadow: 0 2px 8px rgba(52, 71, 103, 0.055);
    --dw-overlay-shadow: 0 16px 38px rgba(52, 71, 103, 0.16);
    --dw-shell-bar-height: 4rem;
}

/* Shared action feedback. Persistent page alerts and confirmation dialogs keep
 * their own layout because they serve a different interaction purpose. */
.notyf {
    inset: 0;
    width: 100%;
    height: 100%;
    align-items: flex-end;
    justify-content: flex-start;
    padding: calc(var(--dw-shell-bar-height) + 0.75rem) 1.25rem 1.25rem;
}

.notyf__toast.dw-toast {
    width: min(23.75rem, calc(100vw - 2.5rem));
    max-width: 23.75rem;
    padding: 0;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--dw-toast-accent) 24%, var(--dw-border));
    border-left: 0.25rem solid var(--dw-toast-accent);
    border-radius: 0.75rem;
    background: linear-gradient(105deg, var(--dw-toast-soft) 0, var(--dw-surface) 42%) !important;
    box-shadow: 0 12px 32px rgba(52, 71, 103, 0.19);
    color: var(--dw-ink);
}

.notyf__toast.dw-toast.notyf__toast--upper {
    margin-bottom: 0.625rem;
}

.notyf__toast.dw-toast--success {
    --dw-toast-accent: var(--dw-success);
    --dw-toast-soft: var(--dw-success-soft);
}

.notyf__toast.dw-toast--error {
    --dw-toast-accent: var(--dw-error);
    --dw-toast-soft: var(--dw-error-soft);
}

.notyf__toast.dw-toast--info {
    --dw-toast-accent: var(--dw-info);
    --dw-toast-soft: var(--dw-info-soft);
}

.notyf__toast.dw-toast--notice {
    --dw-toast-accent: var(--dw-notice);
    --dw-toast-soft: var(--dw-notice-soft);
}

.dw-toast .notyf__wrapper {
    align-items: stretch;
    padding: 0;
}

.dw-toast .notyf__message {
    width: 100%;
    padding: 0;
}

.dw-toast__content {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
    width: 100%;
    min-height: 4rem;
    padding: 0.875rem 2.75rem 0.875rem 1rem;
}

.dw-toast__content.is-actionable {
    cursor: pointer;
}

.dw-toast__content.is-actionable:focus-visible {
    outline: 2px solid var(--dw-primary);
    outline-offset: -3px;
}

.dw-toast__icon {
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: var(--dw-toast-soft);
    color: var(--dw-toast-accent);
    font-size: 1.125rem;
}

.dw-toast__body {
    min-width: 0;
    padding-top: 0.05rem;
}

.dw-toast__title {
    display: block;
    color: var(--dw-ink);
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.35;
}

.dw-toast__message {
    margin: 0.2rem 0 0;
    color: color-mix(in srgb, var(--dw-ink) 72%, var(--dw-muted));
    font-size: 0.8125rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: pre-line;
}

.dw-toast .notyf__dismiss {
    right: 0;
    width: 2.25rem;
    margin-right: 0;
}

.dw-toast .notyf__dismiss-btn {
    background: transparent;
    opacity: 0.45;
}

.dw-toast .notyf__dismiss-btn::before,
.dw-toast .notyf__dismiss-btn::after {
    width: 1.5px;
    height: 0.625rem;
    background: var(--dw-muted);
}

.dw-toast .notyf__dismiss-btn:hover,
.dw-toast .notyf__dismiss-btn:focus-visible {
    background: var(--dw-surface-subtle);
    opacity: 0.85;
}

@media (max-width: 639px) {
    .notyf {
        align-items: stretch;
        padding: calc(var(--dw-shell-bar-height) + 0.5rem) 0.625rem 0.625rem;
    }

    .notyf__toast.dw-toast {
        width: 100%;
        max-width: none;
        border-radius: 0.75rem;
    }

    .dw-toast__content {
        min-height: 4rem;
        padding: 0.875rem 2.5rem 0.875rem 1rem;
    }
}

.app-drawer,
.app-drawer :where(button, input, select, textarea) {
    font-family: var(--dw-font-sans);
}

.app-drawer {
    color: var(--dw-ink);
    font-synthesis: none;
    font-variant-numeric: tabular-nums;
    text-rendering: optimizeLegibility;
}

.dashboard-console-page,
.dashboard-console-page .apexcharts-legend-text,
.dashboard-console-page .apexcharts-text {
    font-family: var(--dw-font-sans) !important;
}

.backoffice-main-surface :where(.ph, .bx, .fas, .far),
.app-navbar :where(.ph, .bx, .fas, .far),
.app-sidebar :where(.ph, .bx, .fas, .far) {
    display: inline-block;
    min-width: 1em;
    line-height: 1;
    text-align: center;
    vertical-align: -0.125em;
}

.backoffice-main-surface,
.admin-console-surface,
.developer-applications-surface,
.sentinel-console-surface,
.recurring-payment-settings-surface,
.email-settings-surface,
.workflow-console-surface,
.dashboard-console-surface,
.scheduler-console-surface,
.subscription-console-surface {
    background: var(--dw-app-background) !important;
}

.dashboard-console-surface {
    --dashboard-border: var(--dw-border);
    --dashboard-ink: var(--dw-ink);
    --dashboard-muted: var(--dw-muted);
    --dashboard-primary: var(--dw-primary);
    --dashboard-primary-soft: var(--dw-primary-soft);
}

.admin-console-surface {
    --admin-ink: var(--dw-ink);
    --admin-muted: var(--dw-muted);
    --admin-border: var(--dw-border);
    --admin-soft: var(--dw-surface-subtle);
    --admin-accent: var(--dw-primary);
}

.developer-applications-surface {
    --developer-ink: var(--dw-ink);
    --developer-muted: var(--dw-muted);
    --developer-border: var(--dw-border);
    --developer-soft: var(--dw-surface-subtle);
    --developer-accent: var(--dw-primary);
    --developer-accent-soft: var(--dw-primary-soft);
}

.sentinel-console-surface {
    --sentinel-ink: var(--dw-ink);
    --sentinel-muted: var(--dw-muted);
    --sentinel-border: var(--dw-border);
    --sentinel-soft: var(--dw-surface-subtle);
    --sentinel-primary: var(--dw-primary);
    --sentinel-primary-soft: var(--dw-primary-soft);
}

.recurring-payment-settings-surface {
    --rp-border: var(--dw-border);
    --rp-ink: var(--dw-ink);
    --rp-muted: var(--dw-muted);
    --rp-primary: var(--dw-primary);
    --rp-primary-soft: var(--dw-primary-soft);
}

.email-settings-surface {
    --email-border: var(--dw-border);
    --email-ink: var(--dw-ink);
    --email-muted: var(--dw-muted);
    --email-primary: var(--dw-primary);
    --email-primary-soft: var(--dw-primary-soft);
}

.workflow-console-surface {
    --workflow-border: var(--dw-border);
    --workflow-ink: var(--dw-ink);
    --workflow-muted: var(--dw-muted);
    --workflow-primary: var(--dw-primary);
    --workflow-primary-soft: var(--dw-primary-soft);
}

.scheduler-console-surface {
    --scheduler-border: var(--dw-border);
    --scheduler-muted: var(--dw-muted);
    --scheduler-text: var(--dw-ink);
    --scheduler-primary: var(--dw-primary);
    --scheduler-soft: var(--dw-surface-subtle);
}

.subscription-console-surface {
    --subscription-border: var(--dw-border);
    --subscription-ink: var(--dw-ink);
    --subscription-muted: var(--dw-muted);
    --subscription-primary: var(--dw-primary);
    --subscription-primary-soft: var(--dw-primary-soft);
    --subscription-soft: var(--dw-surface-subtle);
}

.app-navbar {
    height: var(--dw-shell-bar-height);
    min-height: var(--dw-shell-bar-height);
    border-bottom: 1px solid var(--dw-border);
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 1px 3px rgba(52, 71, 103, 0.045);
    backdrop-filter: blur(10px);
}

.app-navbar :where(.btn, [role="button"]) > i,
.app-sidebar :where(a, summary, button) > i {
    flex: 0 0 1.25rem;
    width: 1.25rem;
    color: inherit;
    line-height: 1;
    text-align: center;
}

.app-navbar .user-menu-dropdown {
    width: auto;
}

.app-navbar .user-menu-trigger {
    position: relative;
    display: inline-flex;
    width: 2.6rem;
    height: 2.6rem;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 9999px;
    background: transparent;
    cursor: pointer;
    transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

.app-navbar .user-menu-trigger:hover,
.app-navbar .user-menu-trigger:focus-visible,
.app-navbar .user-menu-dropdown:focus-within .user-menu-trigger {
    background: var(--dw-surface-subtle);
    box-shadow: 0 0 0 3px var(--dw-primary-soft);
    outline: none;
}

.app-navbar .user-menu-trigger-avatar {
    display: block;
    width: 2rem;
    height: 2rem;
    overflow: hidden;
    border: 2px solid var(--dw-surface);
    border-radius: 9999px;
    box-shadow: 0 0 0 2px var(--dw-primary);
}

.app-navbar .user-menu-notification-badge {
    position: absolute;
    top: -0.15rem;
    right: -0.35rem;
    display: inline-flex;
    min-width: 1.15rem;
    height: 1.15rem;
    align-items: center;
    justify-content: center;
    padding: 0 0.25rem;
    border: 2px solid var(--dw-surface);
    border-radius: 9999px;
    background: #dc2626;
    color: #fff;
    font-size: 0.56rem;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 2px 5px rgba(220, 38, 38, 0.25);
}

.app-navbar .user-menu-trigger-avatar img,
.app-navbar .user-menu-summary-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.app-navbar .user-menu-panel {
    z-index: 80;
    width: min(19.5rem, calc(100vw - 1rem));
    margin-top: 0.65rem;
    padding: 0.5rem;
    border: 1px solid var(--dw-border);
    border-radius: 0.9rem;
    background: var(--dw-surface);
    box-shadow: var(--dw-overlay-shadow);
    outline: none;
}

.app-navbar .user-menu-panel .user-menu-summary > div {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem;
    background: transparent;
    cursor: default;
}

.app-navbar .user-menu-summary-avatar {
    display: block;
    width: 2.65rem;
    height: 2.65rem;
    flex: 0 0 2.65rem;
    overflow: hidden;
    border: 1px solid var(--dw-border);
    border-radius: 0.75rem;
    background: var(--dw-surface-subtle);
}

.app-navbar .user-menu-summary-copy,
.app-navbar .user-menu-item-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.app-navbar .user-menu-summary-copy strong {
    overflow: hidden;
    color: var(--dw-ink);
    font-size: 0.875rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-navbar .user-menu-summary-copy small {
    margin-top: 0.2rem;
    overflow: hidden;
    color: var(--dw-muted);
    font-size: 0.6875rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-navbar .user-menu-panel .user-menu-divider {
    height: 1px;
    min-height: 1px;
    margin: 0.35rem 0.45rem;
    background: var(--dw-border);
}

.app-navbar .user-menu-panel .user-menu-section {
    min-height: auto;
    margin-top: 0.15rem;
}

.app-navbar .user-menu-panel .user-menu-section > span {
    min-height: auto;
    padding: 0.35rem 0.65rem 0.25rem;
    color: var(--dw-muted);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: default;
}

.app-navbar .user-menu-panel .user-menu-item {
    display: grid;
    min-height: 3.25rem;
    grid-template-columns: 2.15rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    padding: 0.45rem 0.6rem;
    border-radius: 0.7rem;
    color: var(--dw-ink);
    transition: color 0.16s ease, background-color 0.16s ease;
}

.app-navbar .user-menu-panel .user-menu-item:hover,
.app-navbar .user-menu-panel .user-menu-item:focus-visible {
    color: var(--dw-primary);
    background: var(--dw-primary-soft);
    outline: none;
}

.app-navbar .user-menu-item-icon {
    display: inline-flex;
    width: 2.15rem;
    height: 2.15rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.6rem;
    background: var(--dw-surface-subtle);
    color: var(--dw-primary);
    font-size: 1.05rem;
}

.app-navbar .user-menu-item-icon-warning {
    background: #fff7e6;
    color: #d97706;
}

.app-navbar .user-menu-item-copy strong {
    overflow: hidden;
    font-size: 0.78rem;
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-navbar .user-menu-item-copy small {
    margin-top: 0.18rem;
    overflow: hidden;
    color: var(--dw-muted);
    font-size: 0.625rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-navbar .user-menu-item-action {
    color: #a7b2c3;
    font-size: 0.75rem;
}

.app-navbar .user-menu-item-count {
    display: inline-flex;
    min-width: 1.45rem;
    height: 1.45rem;
    align-items: center;
    justify-content: center;
    padding: 0 0.35rem;
    border-radius: 9999px;
    background: #fee2e2;
    color: #b91c1c;
    font-size: 0.625rem;
    font-weight: 800;
    line-height: 1;
}

.app-navbar .user-menu-notification-badge.hidden,
.app-navbar .user-menu-item-count.hidden {
    display: none;
}

.app-navbar .user-menu-item[data-rbac-denied="true"] .user-menu-item-action {
    display: none;
}

.app-navbar .user-menu-panel .user-menu-logout {
    min-height: 2.7rem;
    color: #dc2626;
}

.app-navbar .user-menu-panel .user-menu-logout:hover,
.app-navbar .user-menu-panel .user-menu-logout:focus-visible {
    color: #b91c1c;
    background: #fef2f2;
}

.app-navbar .user-menu-logout .user-menu-item-icon {
    background: #fef2f2;
    color: #dc2626;
}

.app-sidebar {
    display: flex;
    height: 100vh;
    height: 100dvh;
    min-height: 100%;
    max-height: 100vh;
    max-height: 100dvh;
    flex-direction: column;
    min-width: 0;
    overflow: hidden !important;
    border-right: 1px solid var(--dw-border);
    background: var(--dw-sidebar-background) !important;
}

.app-sidebar .sidebar-brand {
    box-sizing: border-box;
    height: var(--dw-shell-bar-height);
    min-height: var(--dw-shell-bar-height);
    padding: 0.75rem 1rem !important;
    border-color: var(--dw-border) !important;
    background: rgba(255, 255, 255, 0.48) !important;
}

.app-sidebar .company-switcher-toggle {
    min-width: 0;
    padding: 0.25rem;
    margin: -0.25rem;
    border-radius: 0.75rem;
    transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

.app-sidebar .company-switcher-toggle:hover,
.app-sidebar .company-switcher-toggle:focus-visible,
.app-sidebar .company-switcher-open .company-switcher-toggle {
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
    outline: none;
}

.app-sidebar .company-switcher-icon {
    transition: color 0.16s ease, background-color 0.16s ease;
}

.app-sidebar .company-switcher-toggle:hover .company-switcher-icon,
.app-sidebar .company-switcher-open .company-switcher-icon {
    color: var(--dw-primary);
    background: rgba(79, 97, 216, 0.1);
}

.app-sidebar .company-switcher-menu {
    position: absolute;
    z-index: 70;
    top: calc(100% + 0.5rem);
    left: 0.75rem;
    right: 0.75rem;
    padding: 0.75rem;
    overflow: hidden;
    border: 1px solid var(--dw-border);
    border-radius: 0.875rem;
    background: var(--dw-surface);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.18);
}

.app-sidebar .company-switcher-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.625rem;
    padding-left: 0.25rem;
    color: var(--dw-ink);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.app-sidebar .company-switcher-close {
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    color: var(--dw-muted);
}

.app-sidebar .company-switcher-close:hover,
.app-sidebar .company-switcher-close:focus-visible {
    color: var(--dw-ink);
    background: var(--dw-surface-subtle);
    outline: none;
}

.app-sidebar .company-switcher-search {
    position: relative;
    margin-bottom: 0.625rem;
}

.app-sidebar .company-switcher-search > i {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    color: var(--dw-muted);
    transform: translateY(-50%);
    pointer-events: none;
}

.app-sidebar .company-switcher-search > input {
    width: 100%;
    height: 2.4rem;
    padding: 0 0.75rem 0 2.25rem;
    border: 1px solid var(--dw-border);
    border-radius: 0.625rem;
    background: var(--dw-surface);
    color: var(--dw-ink);
    font-size: 0.8125rem;
    outline: none;
}

.app-sidebar .company-switcher-search > input:focus {
    border-color: rgba(79, 97, 216, 0.55);
    box-shadow: 0 0 0 3px rgba(79, 97, 216, 0.1);
}

.app-sidebar .company-switcher-list {
    max-height: min(20rem, calc(100dvh - 10rem));
    overflow-y: auto;
    overscroll-behavior: contain;
}

.app-sidebar .company-switcher-option {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem;
    border-radius: 0.75rem;
    color: var(--dw-muted);
    transition: color 0.16s ease, background-color 0.16s ease;
}

.app-sidebar .company-switcher-option:hover,
.app-sidebar .company-switcher-option:focus-visible {
    color: var(--dw-primary);
    background: var(--dw-primary-soft);
    outline: none;
}

.app-sidebar .company-switcher-option[aria-current="true"] {
    background: var(--dw-primary-soft);
}

.app-sidebar .company-switcher-option-logo {
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 2.25rem;
    border: 1px solid var(--dw-border);
    border-radius: 0.625rem;
    object-fit: cover;
}

.app-sidebar .company-switcher-option-details {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
}

.app-sidebar .company-switcher-option-name {
    overflow: hidden;
    color: var(--dw-ink);
    font-size: 0.8125rem;
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-sidebar .company-switcher-option-meta {
    margin-top: 0.15rem;
    overflow: hidden;
    color: var(--dw-muted);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.app-sidebar .company-switcher-option-action {
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 1.75rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    background: var(--dw-primary-soft);
    color: var(--dw-primary);
}

.app-sidebar .company-switcher-loading,
.app-sidebar .company-switcher-error,
.app-sidebar .company-switcher-empty {
    display: flex;
    min-height: 5rem;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: var(--dw-muted);
    font-size: 0.75rem;
    text-align: center;
}

.app-sidebar .company-switcher-error {
    flex-wrap: wrap;
    color: #dc2626;
}

.app-sidebar .company-switcher-retry {
    padding: 0.3rem 0.55rem;
    border-radius: 0.5rem;
    background: rgba(220, 38, 38, 0.1);
    font-weight: 700;
}

.app-sidebar .company-switcher-footer {
    margin-top: 0.625rem;
    padding-top: 0.625rem;
    border-top: 1px solid var(--dw-border);
}

.app-sidebar .company-switcher-create-workspace {
    display: grid;
    min-height: 2.75rem;
    grid-template-columns: 1.9rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 0.55rem;
    border-radius: 0.7rem;
    color: var(--dw-primary);
    transition: color 0.16s ease, background-color 0.16s ease;
}

.app-sidebar .company-switcher-create-workspace:hover,
.app-sidebar .company-switcher-create-workspace:focus-visible {
    color: var(--dw-primary-hover);
    background: var(--dw-primary-soft);
    outline: none;
}

.app-sidebar .company-switcher-create-workspace > span {
    display: inline-flex;
    width: 1.9rem;
    height: 1.9rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.55rem;
    background: var(--dw-primary-soft);
}

.app-sidebar .company-switcher-create-workspace > strong {
    overflow: hidden;
    font-size: 0.75rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-sidebar .company-switcher-create-workspace > i {
    color: #a7b2c3;
    font-size: 0.75rem;
}

.app-sidebar .company-switcher-menu .hidden {
    display: none !important;
}

@media (min-width: 1024px) {
    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) .app-sidebar .company-switcher-icon {
        display: none;
    }

    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) :is(.app-drawer-side:hover, .app-drawer-side:focus-within, html.dw-sidebar-prepaint-hovered .app-drawer-side) .app-sidebar .company-switcher-icon {
        display: flex;
    }
}

.app-sidebar #main-sidebar-menu :where(a, summary) {
    min-height: 2.2rem;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    border-radius: 0.625rem;
    color: #53627a;
    font-size: 0.875rem;
    font-weight: 500;
}

.app-sidebar #main-sidebar-menu > li {
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    margin-top: 0.125rem !important;
}

.app-sidebar #main-sidebar-menu > li.mt-6 {
    margin-top: 1rem !important;
}

.app-sidebar #main-sidebar-menu {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    flex: 1 1 0%;
    flex-flow: column nowrap;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.app-sidebar #main-sidebar-menu .menu-title {
    min-height: 1.65rem;
    margin-top: 0.75rem !important;
    padding-top: 0.35rem;
    padding-bottom: 0.2rem;
}

.app-sidebar #main-sidebar-menu details > ul {
    margin-top: 0.125rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
}

.app-sidebar #main-sidebar-menu details > ul :where(a, summary) {
    min-height: 2rem;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    font-size: 0.8125rem;
}

.app-sidebar #main-sidebar-menu :where(a, summary):hover {
    background: rgba(255, 255, 255, 0.72);
    color: var(--dw-ink);
}

.app-sidebar #main-sidebar-menu a.menu-active,
.app-sidebar #main-sidebar-menu summary.menu-parent-active-collapsed {
    background: var(--dw-primary-soft);
    color: var(--dw-primary);
    font-weight: 600;
}

.app-sidebar #main-sidebar-menu > .platform-admin-entry {
    margin-top: 0.875rem !important;
}

.app-sidebar .platform-admin-menu {
    overflow: hidden;
    border-color: #cdb8f4;
    background: #f5f0ff;
    box-shadow: inset 3px 0 0 #8b5bd6;
}

.app-sidebar #main-sidebar-menu .platform-admin-summary {
    border-radius: 0;
    color: #6d3cc7;
    font-weight: 700;
}

.app-sidebar #main-sidebar-menu .platform-admin-summary > i {
    color: #6d3cc7;
}

.app-sidebar #main-sidebar-menu .platform-admin-summary:hover {
    background: #ede3ff;
    color: #5525a4;
}

.app-sidebar #main-sidebar-menu .platform-admin-menu[open] > .platform-admin-summary {
    background: #ede3ff;
}

.app-sidebar #main-sidebar-menu .platform-admin-menu > ul {
    margin-right: 0.35rem;
    margin-bottom: 0.35rem;
    margin-left: 0.35rem;
    border-left-color: rgba(109, 60, 199, 0.24);
}

.app-sidebar #main-sidebar-menu .platform-admin-menu > ul a {
    color: #63507d;
}

.app-sidebar #main-sidebar-menu .platform-admin-menu > ul a:hover {
    background: rgba(255, 255, 255, 0.72);
    color: #5525a4;
}

.app-sidebar #main-sidebar-menu .platform-admin-menu a.menu-active,
.app-sidebar #main-sidebar-menu .platform-admin-summary.menu-parent-active-collapsed {
    background: #dccbff;
    color: #4f218f;
}

.app-sidebar .menu-title {
    color: var(--dw-muted);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.045em;
}

.app-sidebar .sidebar-support {
    flex: 0 0 auto;
    padding: 0.6rem 0.75rem 0.75rem;
    border-top: 1px solid var(--dw-border);
    background: rgba(255, 255, 255, 0.32);
}

.app-sidebar .sidebar-support-link {
    display: flex;
    min-height: 2.25rem;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid transparent;
    border-radius: 0.625rem;
    background: transparent;
    color: #64748b;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.2;
    transition: border-color 120ms ease, background-color 120ms ease, color 120ms ease;
}

.app-sidebar .sidebar-support-link:hover {
    border-color: var(--dw-border);
    background: rgba(255, 255, 255, 0.72);
    color: var(--dw-primary);
}

.app-sidebar .sidebar-support-link.menu-active {
    border-color: color-mix(in srgb, var(--dw-primary) 18%, var(--dw-border));
    background: var(--dw-primary-soft);
    color: var(--dw-primary);
    font-weight: 600;
}

@media (min-width: 1024px) {
    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) .app-sidebar .sidebar-support {
        padding-right: 0.5rem;
        padding-left: 0.5rem;
    }

    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) .app-sidebar .sidebar-support-link {
        justify-content: center;
        gap: 0;
        padding-right: 0.5rem;
        padding-left: 0.5rem;
        font-size: 0;
    }

    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) .app-sidebar .sidebar-support-link > i {
        margin: 0;
        font-size: 1.125rem;
    }

    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) :is(.app-drawer-side:hover, html.dw-sidebar-prepaint-hovered .app-drawer-side) .app-sidebar .sidebar-support,
    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) :is(.app-drawer-side:focus-within, html.dw-sidebar-prepaint-hovered .app-drawer-side) .app-sidebar .sidebar-support {
        padding-right: 0.75rem;
        padding-left: 0.75rem;
    }

    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) :is(.app-drawer-side:hover, html.dw-sidebar-prepaint-hovered .app-drawer-side) .app-sidebar .sidebar-support-link,
    :is(.app-drawer.desktop-sidebar-collapsed, html.dw-sidebar-prepaint-collapsed .app-drawer, html.dw-sidebar-prepaint-hovered .app-drawer) :is(.app-drawer-side:focus-within, html.dw-sidebar-prepaint-hovered .app-drawer-side) .app-sidebar .sidebar-support-link {
        justify-content: flex-start;
        gap: 0.5rem;
        padding-right: 0.65rem;
        padding-left: 0.65rem;
        font-size: 0.8125rem;
    }
}

.app-sidebar #sidebar-search {
    border-color: var(--dw-border);
    background: rgba(255, 255, 255, 0.62);
    color: var(--dw-ink);
}

.app-sidebar #sidebar-search:focus {
    border-color: var(--dw-primary);
    background: var(--dw-surface);
    outline: 3px solid color-mix(in srgb, var(--dw-primary) 14%, transparent);
    outline-offset: 0;
}

.backoffice-main-surface :where(.input-bordered, .select-bordered, .textarea-bordered) {
    border-color: var(--dw-border);
}

.backoffice-main-surface :where(.input-bordered, .select-bordered, .textarea-bordered):focus,
.backoffice-main-surface :where(.input-bordered, .select-bordered, .textarea-bordered):focus-within {
    border-color: var(--dw-primary);
    outline-color: color-mix(in srgb, var(--dw-primary) 18%, transparent);
}

.backoffice-main-surface :where(.btn-primary, .toggle-primary) {
    --btn-color: var(--dw-primary);
}

.backoffice-main-surface .btn-primary {
    border-color: var(--dw-primary);
    background: var(--dw-primary);
}

.backoffice-main-surface .btn-primary:hover {
    border-color: var(--dw-primary-hover);
    background: var(--dw-primary-hover);
}

.backoffice-main-surface .btn.btn-outline.btn-primary {
    border-color: var(--dw-primary);
    background: transparent;
    color: var(--dw-primary);
    box-shadow: none;
}

.backoffice-main-surface .btn.btn-outline.btn-primary:hover,
.backoffice-main-surface .btn.btn-outline.btn-primary:focus-visible,
.backoffice-main-surface .btn.btn-outline.btn-primary:active,
.backoffice-main-surface .btn.btn-outline.btn-primary.active {
    border-color: var(--dw-primary-hover);
    background: var(--dw-primary-hover);
    color: #fff;
}

.backoffice-main-surface .btn:is(:disabled, [disabled], [aria-disabled="true"]) {
    border-color: #cbd5e1;
    background: #e1e6ee;
    color: #47566c;
    box-shadow: none;
    cursor: not-allowed;
    opacity: 1;
}

.backoffice-main-surface .btn:is(:disabled, [disabled], [aria-disabled="true"]) :where(i, span) {
    color: inherit;
}

.backoffice-main-surface :where(.card, .glass-card, .section-card).shadow-xl,
.backoffice-main-surface :where(.card, .glass-card, .section-card).shadow-2xl {
    box-shadow: var(--dw-card-shadow) !important;
}

.backoffice-main-surface :where(.card, .glass-card, .section-card),
.backoffice-page-header,
.backoffice-list-card {
    border-color: var(--dw-border);
}

.modal > :where(.modal-box, .modal-dialog > .modal-content) {
    overflow-x: hidden;
    border-color: var(--dw-border);
    box-shadow: var(--dw-overlay-shadow);
}

.backoffice-modal-header,
.backoffice-modal-footer {
    border-color: var(--dw-border);
}

.backoffice-main-surface :where(.stat-value, [class*="metric"] strong, [class*="amount"], [class*="price"]) {
    font-variant-numeric: tabular-nums;
}

/* Dashboard hierarchy: preserve the dense layout while avoiding isolated
 * micro-sizes and synthetic font weights. */
.dashboard-console-heading nav,
.dashboard-console-eyebrow {
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1.35;
}

.dashboard-console-title-row h1 {
    color: var(--dashboard-ink);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
}

.dashboard-console-title-row p {
    margin-top: 0.3rem;
    color: var(--dashboard-muted);
    font-size: 0.8125rem;
    line-height: 1.5;
}

.dashboard-period-context > span,
.dashboard-period-context strong,
.dashboard-period-context small,
.dashboard-period-filter a,
.dashboard-anchor-nav a {
    font-size: 0.6875rem;
    font-weight: 500;
}

.dashboard-executive-card > header span:not(.dashboard-card-icon):not(.dashboard-live-badge),
.dashboard-executive-grid small,
.dashboard-attention-card header small,
.dashboard-attention-stats span,
.dashboard-section-eyebrow {
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1.35;
}

.dashboard-executive-card h2,
.dashboard-attention-card h2 {
    color: var(--dashboard-ink);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.35;
}

.dashboard-executive-card header p,
.dashboard-attention-card header p {
    font-size: 0.75rem;
    line-height: 1.45;
}

.dashboard-executive-grid strong {
    margin-top: 0.3rem;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.15;
}

.dashboard-executive-grid p,
.dashboard-attention-stats small {
    font-size: 0.6875rem;
    line-height: 1.4;
}

.dashboard-attention-stats strong {
    font-size: 0.875rem;
    font-weight: 600;
}

.dashboard-attention-action,
.dashboard-quick-actions a,
.dashboard-section-context {
    font-size: 0.75rem;
    font-weight: 500;
}

.dashboard-limit-banner p,
.dashboard-limit-banner small,
.dashboard-limit-banner .btn {
    font-size: 0.75rem;
    font-weight: 500;
}

.dashboard-section-heading h2 {
    color: var(--dashboard-ink);
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
}

.dashboard-section-heading p {
    font-size: 0.78125rem;
    line-height: 1.45;
}

.dashboard-subsection-heading h3,
.dashboard-console-page .glass-card h3 {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.35;
}

.dashboard-subsection-heading p,
.dashboard-console-page .glass-card h3 + p {
    font-size: 0.71875rem;
    line-height: 1.45;
}

.dashboard-metric-grid > .glass-card > p:first-child {
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1.35;
}

.dashboard-metric-grid > .glass-card > p:nth-child(2) {
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.15;
}

.dashboard-metric-grid > .glass-card > p:nth-child(n + 3) {
    font-size: 0.6875rem;
    line-height: 1.4;
}

.dashboard-console-page .table th {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.35;
}

.dashboard-console-page .table td {
    font-size: 0.78125rem;
    line-height: 1.45;
}

.dashboard-news-grid > .glass-card > p:first-child {
    font-size: 0.6875rem;
    font-weight: 500;
}

.dashboard-news-grid > .glass-card > p:nth-child(2) {
    font-size: 0.8125rem;
    font-weight: 600;
}

.dashboard-news-grid > .glass-card > p:nth-child(3) {
    font-size: 0.75rem;
    line-height: 1.5;
}

.dashboard-live-badge,
.dashboard-console-page .glass-card .badge,
.dashboard-console-page .apexcharts-tooltip-title,
.dashboard-console-page .apexcharts-tooltip-text-y-value {
    font-size: 0.6875rem !important;
    font-weight: 500 !important;
}

.dashboard-section-eyebrow,
.dashboard-section-context i,
.dashboard-period-filter a.is-active,
.dashboard-anchor-nav a.is-active {
    color: var(--dashboard-primary);
}

.dashboard-period-filter a.is-active {
    background: var(--dw-surface);
}

.dashboard-anchor-nav a.is-active {
    border-bottom-color: var(--dashboard-primary);
}

.dashboard-live-badge {
    border-color: color-mix(in srgb, var(--dashboard-primary) 24%, var(--dw-border));
    background: var(--dashboard-primary-soft);
    color: var(--dashboard-primary);
}

@media (max-width: 767px) {
    :root {
        --dw-shell-bar-height: 3.5rem;
    }

    .app-navbar {
        height: var(--dw-shell-bar-height);
        min-height: var(--dw-shell-bar-height);
    }

    .app-sidebar .sidebar-brand {
        height: var(--dw-shell-bar-height);
        min-height: var(--dw-shell-bar-height);
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }

    .dashboard-console-title-row h1 {
        font-size: 1.375rem;
    }
}