/*
 * Dashboard V2 production shell.
 * Applied by dashboard-v2.js as the only main dashboard experience.
 */

body.dashboard-v2-enabled {
    --dashboard-v2-bg: #111315;
    --dashboard-v2-panel: rgba(24, 27, 32, 0.94);
    --dashboard-v2-panel-soft: rgba(31, 36, 43, 0.9);
    --dashboard-v2-panel-strong: #171a1f;
    --dashboard-v2-border: rgba(176, 184, 194, 0.16);
    --dashboard-v2-border-strong: rgba(20, 184, 166, 0.34);
    --dashboard-v2-text: #f5f7fa;
    --dashboard-v2-muted: #a8b1bd;
    --dashboard-v2-accent: #14b8a6;
    --dashboard-v2-left-width: 272px;
    --dashboard-v2-right-width: 300px;
    --dashboard-v2-drawer-width: min(440px, calc(100vw - 96px));
    --dashboard-v2-page-gutter: clamp(12px, 1.6vw, 28px);
    --dashboard-v2-dock-inset: clamp(14px, 1.2vw, 22px);
    --dashboard-v2-dock-gutter: 0px;
    --dashboard-v2-left-dock-gutter: 0px;
    --dashboard-v2-right-dock-gutter: 0px;
    --dashboard-v2-content-max: 1480px;
    --dashboard-v2-content-width: min(var(--dashboard-v2-content-max), calc(100vw - var(--dashboard-v2-left-width) - var(--dashboard-v2-right-width) - (var(--dashboard-v2-page-gutter) * 2)));
    --v2-surface: var(--dashboard-v2-panel);
    --v2-surface-elevated: rgba(21, 25, 31, 0.96);
    --v2-border: var(--dashboard-v2-border);
    --v2-text: var(--dashboard-v2-text);
    --v2-muted: var(--dashboard-v2-muted);
    --v2-accent: var(--dashboard-v2-accent);
    --v2-danger: #ef4444;
}

.schedule-history-row summary {
    list-style: none;
}

.schedule-history-row summary::-webkit-details-marker {
    display: none;
}

body.dashboard-v2-enabled.dashboard-v2-left-collapsed {
    --dashboard-v2-left-width: 0px;
}

body.dashboard-v2-enabled.dashboard-v2-right-collapsed {
    --dashboard-v2-right-width: 0px;
}

body.app-loading .dashboard-v2-floating-dock,
body:has(#app-container.hidden) .dashboard-v2-floating-dock,
body.header-account-menu-open .dashboard-v2-floating-dock,
body.notification-panel-open .dashboard-v2-floating-dock {
    display: none !important;
}

html[data-theme="light"] body.dashboard-v2-enabled {
    --dashboard-v2-bg: #f4f6f8;
    --dashboard-v2-panel: rgba(255, 255, 255, 0.96);
    --dashboard-v2-panel-soft: rgba(241, 245, 249, 0.94);
    --dashboard-v2-panel-strong: #ffffff;
    --dashboard-v2-border: rgba(71, 85, 105, 0.18);
    --dashboard-v2-border-strong: rgba(13, 148, 136, 0.34);
    --dashboard-v2-text: #111827;
    --dashboard-v2-muted: #526173;
    --dashboard-v2-accent: #0f766e;
    --v2-surface: var(--dashboard-v2-panel);
    --v2-surface-elevated: rgba(255, 255, 255, 0.98);
    --v2-border: var(--dashboard-v2-border);
    --v2-text: var(--dashboard-v2-text);
    --v2-muted: var(--dashboard-v2-muted);
    --v2-accent: var(--dashboard-v2-accent);
    --v2-danger: #dc2626;
}

body.dashboard-v2-enabled,
body.dashboard-v2-enabled #app-container.dashboard-v2-shell {
    max-width: 100vw;
    overflow-x: hidden;
}

body.dashboard-v2-enabled .dashboard-v2-workspace,
body.dashboard-v2-enabled .dashboard-v2-main-column,
body.dashboard-v2-enabled .dashboard-v2-main,
body.dashboard-v2-enabled .dashboard-v2-command-bar,
body.dashboard-v2-enabled .dashboard-v2-quick-create,
body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl,
body.dashboard-v2-enabled .dashboard-v2-quick-create .max-w-7xl,
body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl > *,
body.dashboard-v2-enabled .dashboard-v2-quick-create .max-w-7xl > * {
    min-width: 0;
    max-width: 100%;
}

body.dashboard-v2-enabled #app-container.dashboard-v2-shell {
    color: var(--dashboard-v2-text);
    background: var(--dashboard-v2-bg);
}

body.dashboard-v2-enabled .dashboard-v2-topbar {
    color: var(--dashboard-v2-text);
    background:
        linear-gradient(135deg, rgba(20, 184, 166, 0.06), transparent 36%),
        linear-gradient(90deg, rgba(15, 18, 23, 0.96), rgba(24, 27, 32, 0.94)) !important;
    border-color: var(--dashboard-v2-border) !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18) !important;
}

body.dashboard-v2-enabled #app-container.dashboard-v2-shell > header.dashboard-v2-header {
    position: relative;
    z-index: 42;
    padding: 8px 12px !important;
    overflow: visible;
}

body.dashboard-v2-enabled .dashboard-v2-header-inner {
    display: grid !important;
    grid-template-columns: minmax(150px, 1fr) minmax(180px, auto) minmax(260px, 1fr);
    gap: 12px;
    align-items: center;
    min-width: 0;
}

body.dashboard-v2-enabled .dashboard-v2-header-left,
body.dashboard-v2-enabled .dashboard-v2-header-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    min-width: 0;
}

body.dashboard-v2-enabled .dashboard-v2-header-left {
    justify-content: flex-start;
    gap: 8px !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-center {
    display: flex;
    justify-content: center;
    min-width: 0;
}

body.dashboard-v2-enabled .dashboard-v2-header-actions {
    position: relative;
    justify-content: flex-end;
    gap: 7px !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-logo {
    width: 32px !important;
    height: 32px !important;
    object-fit: contain;
    filter: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-team-name {
    max-width: min(42vw, 520px);
    overflow: hidden;
    font-size: clamp(16px, 1.25vw, 20px) !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-v2-enabled .dashboard-v2-header-icon-button,
body.dashboard-v2-enabled .dashboard-v2-theme-toggle,
body.dashboard-v2-enabled .dashboard-v2-header-primary,
body.dashboard-v2-enabled .dashboard-v2-header-shortcut {
    align-items: center;
    justify-content: center;
    min-height: 32px !important;
    height: 32px;
    padding: 0 10px !important;
    color: var(--v2-text, #f5f7fa) !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: 0;
    border: 1px solid var(--dashboard-v2-border, rgba(176, 184, 194, 0.16)) !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
    transition: transform 160ms ease, background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

body.dashboard-v2-enabled .dashboard-v2-header-icon-button,
body.dashboard-v2-enabled .dashboard-v2-theme-toggle {
    width: 34px;
    min-width: 34px;
    padding: 0 !important;
    background: rgba(148, 163, 184, 0.08) !important;
    /* Center the icon inside the round button. The base rule sets
     * align/justify but not display, so buttons without their own flex
     * (e.g. the refresh button) rendered the icon off-center. */
    display: inline-flex !important;
}

body.dashboard-v2-enabled #app-container > header #pwa-refresh-btn.dashboard-v2-header-refresh {
    width: 38px !important;
    min-width: 38px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border-radius: 10px !important;
}

body.dashboard-v2-enabled #app-container > header #pwa-refresh-btn.dashboard-v2-header-refresh > svg {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px;
}

body.dashboard-v2-enabled .dashboard-v2-theme-toggle {
    gap: 4px;
    width: auto;
    min-width: 34px;
    padding: 0 9px !important;
    color: #c7d2fe !important;
    background: rgba(99, 102, 241, 0.13) !important;
    border-color: rgba(129, 140, 248, 0.28) !important;
}

body.dashboard-v2-enabled .dashboard-v2-theme-toggle span:first-child {
    line-height: 1;
}

body.dashboard-v2-enabled #header-actions-cluster #ds-theme-toggle {
    width: 34px;
    min-width: 34px;
    padding: 0 !important;
}

body.dashboard-v2-enabled #header-actions-cluster #ds-theme-label {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-primary:not(.hidden) {
    display: inline-flex !important;
    color: #ffffff !important;
    background:
        radial-gradient(circle at 22% 18%, rgba(255, 255, 255, 0.22), transparent 42%),
        linear-gradient(135deg, rgba(124, 58, 237, 0.92), rgba(79, 70, 229, 0.92)) !important;
    border-color: rgba(196, 181, 253, 0.36) !important;
    box-shadow: 0 10px 26px rgba(79, 70, 229, 0.18);
}

body.dashboard-v2-enabled .dashboard-v2-header-shortcut {
    display: inline-flex;
    min-width: 0;
    padding: 0 11px !important;
    text-decoration: none !important;
    background: rgba(15, 23, 42, 0.36) !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-shortcut--clients {
    color: #bfdbfe !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-shortcut--guides {
    color: #99f6e4 !important;
    border-color: rgba(45, 212, 191, 0.26) !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-shortcut--training {
    color: #ddd6fe !important;
    border-color: rgba(167, 139, 250, 0.28) !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-icon-button:hover,
body.dashboard-v2-enabled .dashboard-v2-header-icon-button:focus-visible,
body.dashboard-v2-enabled .dashboard-v2-theme-toggle:hover,
body.dashboard-v2-enabled .dashboard-v2-theme-toggle:focus-visible,
body.dashboard-v2-enabled .dashboard-v2-header-primary:hover,
body.dashboard-v2-enabled .dashboard-v2-header-primary:focus-visible,
body.dashboard-v2-enabled .dashboard-v2-header-shortcut:hover,
body.dashboard-v2-enabled .dashboard-v2-header-shortcut:focus-visible {
    color: #ffffff !important;
    background: rgba(20, 184, 166, 0.14) !important;
    border-color: rgba(20, 184, 166, 0.34) !important;
    box-shadow: 0 12px 28px rgba(20, 184, 166, 0.13);
    outline: 2px solid rgba(20, 184, 166, 0.24);
    outline-offset: 2px;
    transform: translateY(-1px);
}

body.dashboard-v2-enabled .dashboard-v2-header-icon {
    width: 17px;
    height: 17px;
}

body.dashboard-v2-enabled .dashboard-v2-header-more {
    position: relative;
    display: none;
    align-items: center;
    flex: 0 0 auto;
    line-height: 0;
}

body.dashboard-v2-enabled .dashboard-v2-header-more[hidden],
body.dashboard-v2-enabled .dashboard-v2-header-more-button[hidden] {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-more-button {
    gap: 5px;
    width: auto;
    min-width: 34px;
    padding: 0 10px !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-more-menu {
    position: absolute;
    top: calc(100% + 9px);
    right: 0;
    z-index: 72;
    display: grid;
    gap: 6px;
    width: min(220px, calc(100vw - 24px));
    padding: 8px;
    background:
        linear-gradient(135deg, rgba(20, 184, 166, 0.08), transparent 46%),
        var(--v2-surface-elevated, rgba(21, 25, 31, 0.96));
    border: 1px solid var(--dashboard-v2-border, rgba(176, 184, 194, 0.16));
    border-radius: 16px;
    box-shadow: 0 24px 54px rgba(0, 0, 0, 0.32);
}

body.dashboard-v2-enabled .dashboard-v2-header-more-menu[hidden] {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-header-more-item {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    padding: 0 10px;
    color: var(--v2-text, #f5f7fa);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 12px;
}

body.dashboard-v2-enabled .dashboard-v2-header-more-item:hover,
body.dashboard-v2-enabled .dashboard-v2-header-more-item:focus-visible {
    background: rgba(148, 163, 184, 0.12);
    border-color: var(--dashboard-v2-border);
    outline: 2px solid rgba(20, 184, 166, 0.22);
    outline-offset: 2px;
}

body.dashboard-v2-enabled .dashboard-v2-header-more-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #60a5fa;
    box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.12);
}

body.dashboard-v2-enabled .dashboard-v2-header-more-item--guides .dashboard-v2-header-more-dot {
    background: #2dd4bf;
    box-shadow: 0 0 0 4px rgba(45, 212, 191, 0.12);
}

body.dashboard-v2-enabled .dashboard-v2-header-more-item--training .dashboard-v2-header-more-dot {
    background: #a78bfa;
    box-shadow: 0 0 0 4px rgba(167, 139, 250, 0.12);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-topbar {
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.07), transparent 38%),
        rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-icon-button,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-theme-toggle,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut {
    color: #334155 !important;
    background: rgba(255, 255, 255, 0.78) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut--clients {
    color: #1d4ed8 !important;
    border-color: rgba(37, 99, 235, 0.2) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut--guides {
    color: #0f766e !important;
    border-color: rgba(15, 118, 110, 0.2) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut--training {
    color: #6d28d9 !important;
    border-color: rgba(109, 40, 217, 0.2) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-more-menu {
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.06), transparent 42%),
        rgba(255, 255, 255, 0.98);
    box-shadow: 0 24px 54px rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-more-item {
    color: #0f172a;
}

@media (max-width: 1420px) {
    body.dashboard-v2-enabled .dashboard-v2-header-shortcut {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-more:not([hidden]) {
        display: inline-flex;
    }
}

@media (max-width: 1180px) {
    body.dashboard-v2-enabled .dashboard-v2-header-inner {
        grid-template-columns: minmax(104px, auto) minmax(120px, 1fr) minmax(180px, auto);
        gap: 8px;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-left,
    body.dashboard-v2-enabled .dashboard-v2-header-actions {
        gap: 5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-logo {
        width: 30px !important;
        height: 30px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-primary:not(.hidden) {
        max-width: 132px;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-primary:not(.hidden) span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 767px) {
    body.dashboard-v2-enabled #app-container.dashboard-v2-shell > header.dashboard-v2-header {
        padding: 4px 6px !important;
        overflow: visible !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-inner {
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 4px;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-left,
    body.dashboard-v2-enabled .dashboard-v2-header-actions {
        gap: 3px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-logo {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-team-name {
        max-width: 40vw;
        font-size: 13px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-icon-button,
    body.dashboard-v2-enabled .dashboard-v2-theme-toggle,
    body.dashboard-v2-enabled .dashboard-v2-header-primary,
    body.dashboard-v2-enabled .dashboard-v2-header-more-button {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 !important;
    }

    body.dashboard-v2-enabled #header-actions-cluster #ds-theme-toggle.dashboard-v2-theme-toggle,
    body.dashboard-v2-enabled #app-container > header #pwa-refresh-btn.dashboard-v2-header-refresh {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        padding: 0 !important;
        border-radius: 10px !important;
    }

    body.dashboard-v2-enabled #app-container > header #pwa-refresh-btn.dashboard-v2-header-refresh > svg,
    body.dashboard-v2-enabled #header-actions-cluster #ds-theme-toggle.dashboard-v2-theme-toggle svg {
        width: 17px !important;
        min-width: 17px !important;
        height: 17px !important;
        flex: 0 0 17px !important;
    }

    body.dashboard-v2-enabled #header-actions-cluster #ds-theme-icon {
        font-size: 13px !important;
        line-height: 1 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-more-label,
    body.dashboard-v2-enabled .dashboard-v2-theme-toggle [data-theme-label],
    body.dashboard-v2-enabled #ds-theme-label {
        display: none !important;
    }

    body.dashboard-v2-enabled #notif-bell-btn,
    body.dashboard-v2-enabled #schedule-btn,
    body.dashboard-v2-enabled #header-ai-copilot-btn,
    body.dashboard-v2-enabled #header-account-menu {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-header-more-menu {
        right: -38px;
        width: min(220px, calc(100vw - 18px));
    }

    body.dashboard-v2-enabled #dashboard-v2-header-more,
    body.dashboard-v2-enabled #dashboard-v2-header-more-button,
    body.dashboard-v2-enabled #dashboard-v2-header-more-menu {
        display: none !important;
    }

    body.dashboard-v2-enabled #app-container.dashboard-v2-shell > header .dashboard-v2-header-shortcut,
    body.dashboard-v2-enabled #app-container.dashboard-v2-shell > header a[data-module="clients"]:not(.header-account-menu-item),
    body.dashboard-v2-enabled #app-container.dashboard-v2-shell > header a[data-module="guides"]:not(.header-account-menu-item),
    body.dashboard-v2-enabled #app-container.dashboard-v2-shell > header a[data-module="training"]:not(.header-account-menu-item) {
        display: none !important;
    }
}

body.dashboard-v2-enabled .dashboard-v2-workspace {
    min-height: 0;
    background: var(--dashboard-v2-bg);
}

body.dashboard-v2-enabled .dashboard-v2-main-column {
    min-width: 0;
    background: transparent;
}

body.dashboard-v2-enabled .dashboard-v2-tabs,
body.dashboard-v2-enabled .dashboard-v2-command-bar,
body.dashboard-v2-enabled .dashboard-v2-quick-create {
    color: var(--dashboard-v2-text);
    background: var(--dashboard-v2-panel) !important;
    border-color: var(--dashboard-v2-border) !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-tabs {
    min-width: 0;
    overflow-x: clip;
    padding: 8px 12px !important;
}

body.dashboard-v2-enabled .dashboard-v2-tabs > div {
    width: 100%;
    max-width: var(--dashboard-v2-content-width) !important;
    margin-right: auto;
    margin-left: auto;
    min-width: 0;
    overflow: hidden;
    gap: 3px !important;
    padding: 4px !important;
    background: var(--v2-surface-elevated, rgba(21, 25, 31, 0.96)) !important;
    border: 1px solid var(--v2-border, rgba(176, 184, 194, 0.16)) !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body.dashboard-v2-enabled .dashboard-v2-tabs .tab-btn {
    min-width: 0;
    padding: 8px 10px !important;
    overflow: hidden;
    color: var(--v2-muted, #a8b1bd) !important;
    font-size: 11px !important;
    border-radius: 999px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-v2-enabled .dashboard-v2-tabs .tab-btn.text-white {
    color: var(--v2-text, #f5f7fa) !important;
}

body.dashboard-v2-enabled .dashboard-v2-tabs #tab-indicator {
    top: 4px !important;
    bottom: 4px !important;
    height: auto !important;
    background: linear-gradient(135deg, rgba(20, 184, 166, 0.48), rgba(129, 140, 248, 0.38)) !important;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px !important;
    box-shadow: 0 10px 24px rgba(20, 184, 166, 0.16) !important;
}

body.dashboard-v2-enabled .dashboard-v2-main {
    min-width: 0;
    scroll-padding-bottom: 112px;
}

/* Weekly leaderboard — unified circular rank badges + brighter score pill.
 * All ranks share one badge shape/size; top 3 get medal tints (semantic for
 * ranking, not brand accent), the rest a neutral surface. */
.lb-rank {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    background: rgba(148, 163, 184, 0.16);
    color: rgba(226, 232, 240, 0.88);
    border: 1px solid rgba(148, 163, 184, 0.22);
}
.lb-rank[data-rank="1"] {
    background: linear-gradient(135deg, rgba(250, 204, 21, 0.32), rgba(245, 158, 11, 0.22));
    color: #fde68a;
    border-color: rgba(250, 204, 21, 0.48);
}
.lb-rank[data-rank="2"] {
    background: linear-gradient(135deg, rgba(203, 213, 225, 0.30), rgba(148, 163, 184, 0.20));
    color: #f1f5f9;
    border-color: rgba(203, 213, 225, 0.42);
}
.lb-rank[data-rank="3"] {
    background: linear-gradient(135deg, rgba(217, 119, 6, 0.30), rgba(180, 83, 9, 0.20));
    color: #fcd34d;
    border-color: rgba(217, 119, 6, 0.44);
}
.lb-score {
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.16);
}
html[data-theme="light"] .lb-rank {
    background: rgba(15, 23, 42, 0.06);
    color: #334155;
    border-color: rgba(15, 23, 42, 0.12);
}
html[data-theme="light"] .lb-score {
    background: rgba(15, 23, 42, 0.05);
    border-color: rgba(15, 23, 42, 0.12);
    color: #0f172a;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-range {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 8px 0 10px;
    color: var(--dashboard-v2-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    white-space: nowrap;
    background: var(--dashboard-v2-panel-soft);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-range select {
    min-width: 82px;
    height: 28px;
    padding: 0 26px 0 9px;
    color: var(--dashboard-v2-text);
    font-size: 12px;
    font-weight: 800;
    background: rgba(15, 23, 42, 0.52);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 999px;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-range select {
    background: rgba(255, 255, 255, 0.82);
}

html[data-theme="light"] body.dashboard-v2-enabled #search-input,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-command-bar select {
    background: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(71, 85, 105, 0.2) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-search-shortcut,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-clear-search {
    background: rgba(15, 23, 42, 0.055);
    border-color: rgba(71, 85, 105, 0.14);
}

html[data-theme="light"] body.dashboard-v2-enabled #ticket-count-display,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-filter-chip {
    background: rgba(13, 148, 136, 0.08) !important;
    border-color: rgba(13, 148, 136, 0.22) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-clear-filters {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.07);
    border-color: rgba(220, 38, 38, 0.18);
}

body.dashboard-v2-enabled .dashboard-v2-team-stats-range-label {
    margin-right: 6px;
    color: var(--dashboard-v2-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .dashboard-v2-main > #tickets-view,
body.dashboard-v2-enabled .dashboard-v2-main > #done-view,
body.dashboard-v2-enabled .dashboard-v2-main > #follow-up-view,
body.dashboard-v2-enabled .dashboard-v2-main > #dashboard-view,
body.dashboard-v2-enabled .dashboard-v2-main > #knowledge-base-view,
body.dashboard-v2-enabled .dashboard-v2-main #badges-header,
body.dashboard-v2-enabled .dashboard-v2-main #badges-header > *,
body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl,
body.dashboard-v2-enabled .dashboard-v2-quick-create .max-w-7xl {
    width: 100%;
    max-width: var(--dashboard-v2-content-width) !important;
    margin-right: auto;
    margin-left: auto;
}

body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

body.dashboard-v2-enabled .dashboard-v2-command-bar .relative {
    flex: 999 1 360px;
    min-width: min(100%, 260px) !important;
}

body.dashboard-v2-enabled .dashboard-v2-search-wrap {
    isolation: isolate;
}

body.dashboard-v2-enabled .dashboard-v2-search-wrap svg {
    color: var(--dashboard-v2-muted) !important;
}

body.dashboard-v2-enabled #search-input {
    height: 38px;
    padding-right: 84px !important;
    color: var(--dashboard-v2-text) !important;
    background: rgba(15, 23, 42, 0.5) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

body.dashboard-v2-enabled #search-input::placeholder {
    color: color-mix(in srgb, var(--dashboard-v2-muted) 82%, transparent);
}

body.dashboard-v2-enabled #search-input:focus {
    border-color: rgba(20, 184, 166, 0.46) !important;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dashboard-v2-enabled .dashboard-v2-search-shortcut {
    position: absolute;
    top: 50%;
    right: 12px;
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 7px;
    color: var(--dashboard-v2-muted);
    font-size: 10px;
    font-weight: 800;
    background: rgba(148, 163, 184, 0.1);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 999px;
    transform: translateY(-50%);
    pointer-events: none;
}

body.dashboard-v2-enabled .dashboard-v2-search-shortcut-active {
    color: #7dd3fc;
    background: rgba(20, 184, 166, 0.14);
    border-color: rgba(20, 184, 166, 0.44);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.08);
}

body.dashboard-v2-enabled .dashboard-v2-filter-active .dashboard-v2-search-shortcut {
    display: none;
}

body.dashboard-v2-enabled .dashboard-v2-clear-search {
    position: absolute;
    top: 50%;
    right: 9px;
    display: none;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--dashboard-v2-muted);
    font-size: 15px;
    line-height: 1;
    background: rgba(148, 163, 184, 0.12);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    transform: translateY(-50%);
}

body.dashboard-v2-enabled .dashboard-v2-filter-active .dashboard-v2-clear-search {
    display: inline-flex;
}

body.dashboard-v2-enabled .dashboard-v2-clear-search:hover,
body.dashboard-v2-enabled .dashboard-v2-clear-search:focus-visible {
    color: var(--dashboard-v2-text);
    border-color: rgba(20, 184, 166, 0.34);
}

body.dashboard-v2-enabled .dashboard-v2-command-bar select {
    flex: 0 1 126px;
    width: auto;
    min-width: 104px;
    max-width: 148px;
    height: 38px;
    color: var(--dashboard-v2-text) !important;
    font-size: 12px !important;
    font-weight: 760;
    background: rgba(15, 23, 42, 0.48) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-command-bar #filter-tag {
    flex-basis: 124px;
    max-width: 150px;
}

body.dashboard-v2-enabled .dashboard-v2-command-bar select.dashboard-v2-filter-active,
body.dashboard-v2-enabled .dashboard-v2-ticket-range.dashboard-v2-filter-active {
    color: var(--dashboard-v2-text) !important;
    border-color: rgba(20, 184, 166, 0.42) !important;
    box-shadow: 0 0 0 1px rgba(20, 184, 166, 0.08) !important;
}

body.dashboard-v2-enabled #dashboard-v2-ticket-range-wrap {
    flex: 0 0 auto;
    margin-left: auto;
}

body.dashboard-v2-enabled #ticket-count-display {
    flex: 0 0 auto;
    margin-left: 0 !important;
    min-height: 38px;
    padding: 0 11px !important;
    color: var(--dashboard-v2-muted);
    background: rgba(20, 184, 166, 0.1) !important;
    border-color: rgba(20, 184, 166, 0.24) !important;
    border-radius: 999px !important;
    white-space: nowrap;
}

body.dashboard-v2-enabled #ticket-count-display span:first-child {
    display: none;
}

body.dashboard-v2-enabled #ticket-count-display #ticket-count {
    color: var(--dashboard-v2-text) !important;
    font-size: 13px !important;
}

body.dashboard-v2-enabled .dashboard-v2-clear-filters {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 12px;
    color: #fca5a5;
    font-size: 12px;
    font-weight: 800;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(248, 113, 113, 0.22);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-clear-filters[hidden] {
    display: none;
}

body.dashboard-v2-enabled .dashboard-v2-clear-filters:hover,
body.dashboard-v2-enabled .dashboard-v2-clear-filters:focus-visible {
    color: #fecaca;
    background: rgba(239, 68, 68, 0.16);
    border-color: rgba(248, 113, 113, 0.34);
}

body.dashboard-v2-enabled .dashboard-v2-active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    width: 100%;
    max-width: var(--dashboard-v2-content-width);
    margin: 0 auto;
    padding: 0 0 10px;
}

body.dashboard-v2-enabled .dashboard-v2-active-filters[hidden] {
    display: none;
}

body.dashboard-v2-enabled .dashboard-v2-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 26px;
    padding: 0 8px;
    color: var(--dashboard-v2-muted);
    font-size: 11px;
    font-weight: 750;
    background: rgba(20, 184, 166, 0.1);
    border: 1px solid rgba(20, 184, 166, 0.2);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-filter-chip strong {
    color: var(--dashboard-v2-text);
    font-weight: 850;
}

body.dashboard-v2-enabled .dashboard-v2-filter-chip:hover,
body.dashboard-v2-enabled .dashboard-v2-filter-chip:focus-visible {
    border-color: rgba(20, 184, 166, 0.38);
}

body.dashboard-v2-enabled #badges-header.dashboard-v2-badge-strip {
    display: block !important;
    margin: 0 auto 6px;
    overflow: visible;
}

body.dashboard-v2-enabled #badges-header.dashboard-v2-badge-strip::before {
    display: block;
    margin: 0 2px 3px;
    color: var(--dashboard-v2-muted);
    content: "Team Recognition";
    font-size: 9.5px;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.05;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .dashboard-v2-badge-strip-inner {
    padding: 5px !important;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(20, 184, 166, 0.08), transparent 42%),
        linear-gradient(180deg, rgba(30, 34, 41, 0.96), rgba(20, 24, 30, 0.94)) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 14px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18) !important;
    /* backdrop-filter removed (perf): this strip is persistent chrome; blurring
       the page behind it forces a full GPU re-blur on every scroll frame. The
       background gradient above is already near-opaque, so the glass look is kept. */
}

body.dashboard-v2-enabled .dashboard-v2-badge-track {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    justify-content: stretch !important;
    gap: 5px !important;
    padding: 0 !important;
    overflow-x: visible !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(20, 184, 166, 0.28) transparent;
}

body.dashboard-v2-enabled .dashboard-v2-badge-track::-webkit-scrollbar {
    height: 4px;
}

body.dashboard-v2-enabled .dashboard-v2-badge-track::-webkit-scrollbar-track {
    background: transparent;
}

body.dashboard-v2-enabled .dashboard-v2-badge-track::-webkit-scrollbar-thumb {
    background: rgba(20, 184, 166, 0.28);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-badge-card {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    min-width: 0 !important;
    min-height: 50px !important;
    padding: 5px 7px !important;
    gap: 6px !important;
    color: var(--dashboard-v2-text);
    background:
        linear-gradient(135deg, rgba(148, 163, 184, 0.1), rgba(15, 23, 42, 0.14)) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 13px !important;
    box-shadow: none !important;
    cursor: help;
    outline: none;
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease;
}

body.dashboard-v2-enabled .dashboard-v2-badge-card::before {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-badge-card:hover,
body.dashboard-v2-enabled .dashboard-v2-badge-card:focus-visible {
    z-index: 2;
    background:
        linear-gradient(135deg, rgba(20, 184, 166, 0.14), rgba(59, 130, 246, 0.08)) !important;
    border-color: rgba(20, 184, 166, 0.34) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22) !important;
    transform: translateY(-1px);
}

body.dashboard-v2-enabled .dashboard-v2-badge-card.badge-negative {
    background:
        linear-gradient(135deg, rgba(248, 113, 113, 0.12), rgba(15, 23, 42, 0.1)) !important;
    border-color: rgba(248, 113, 113, 0.18) !important;
}

body.dashboard-v2-enabled .dashboard-v2-badge-card.badge-negative:hover,
body.dashboard-v2-enabled .dashboard-v2-badge-card.badge-negative:focus-visible {
    border-color: rgba(248, 113, 113, 0.34) !important;
    box-shadow: 0 12px 30px rgba(127, 29, 29, 0.18) !important;
}

body.dashboard-v2-enabled .dashboard-v2-badge-empty {
    opacity: 0.62;
}

body.dashboard-v2-enabled .dashboard-v2-badge-empty:hover,
body.dashboard-v2-enabled .dashboard-v2-badge-empty:focus-visible {
    opacity: 0.86;
}

body.dashboard-v2-enabled .dashboard-v2-badge-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-size: 14px !important;
    line-height: 1;
    background: rgba(20, 184, 166, 0.12);
    border: 1px solid rgba(20, 184, 166, 0.18);
    border-radius: 999px;
    filter: none !important;
}

body.dashboard-v2-enabled .badge-negative .dashboard-v2-badge-icon {
    background: rgba(248, 113, 113, 0.12);
    border-color: rgba(248, 113, 113, 0.18);
}

body.dashboard-v2-enabled .dashboard-v2-badge-card .badge-info {
    min-width: 0;
    gap: 2px !important;
}

body.dashboard-v2-enabled .dashboard-v2-badge-name {
    overflow: hidden;
    color: var(--dashboard-v2-text) !important;
    font-size: 10.5px !important;
    font-weight: 850 !important;
    letter-spacing: 0;
    line-height: 1.05 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-v2-enabled .dashboard-v2-badge-users {
    display: flex !important;
    align-items: center;
    min-width: 0;
    min-height: 16px;
    gap: 2px !important;
    overflow: hidden;
}

body.dashboard-v2-enabled .dashboard-v2-badge-users .badge-holder {
    width: 16px !important;
    min-width: 16px;
    height: 16px !important;
    color: #fff !important;
    font-size: 7.5px !important;
    font-weight: 850 !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

body.dashboard-v2-enabled .dashboard-v2-badge-users .badge-holder:hover {
    transform: translateY(-1px) scale(1.06) !important;
}

body.dashboard-v2-enabled .dashboard-v2-badge-users .no-holders {
    color: var(--dashboard-v2-muted) !important;
    font-size: 10.5px !important;
    line-height: 1;
}

body.dashboard-v2-enabled .dashboard-v2-badge-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px !important;
    height: 20px;
    padding: 0 6px;
    color: var(--dashboard-v2-muted) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    background: rgba(148, 163, 184, 0.1);
    border: 1px solid rgba(148, 163, 184, 0.15);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-badge-count.has-holders {
    color: #67e8f9 !important;
    background: rgba(20, 184, 166, 0.14);
    border-color: rgba(20, 184, 166, 0.24);
}

body.dashboard-v2-enabled .badge-negative .dashboard-v2-badge-count.has-holders {
    color: #fca5a5 !important;
    background: rgba(239, 68, 68, 0.14);
    border-color: rgba(248, 113, 113, 0.24);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-strip-inner {
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.08), transparent 42%),
        rgba(255, 255, 255, 0.96) !important;
    border-color: rgba(71, 85, 105, 0.16) !important;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-card {
    background: linear-gradient(135deg, rgba(241, 245, 249, 0.9), rgba(255, 255, 255, 0.92)) !important;
    border-color: rgba(71, 85, 105, 0.16) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-card:hover,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-card:focus-visible {
    background: linear-gradient(135deg, rgba(240, 253, 250, 0.96), rgba(239, 246, 255, 0.92)) !important;
    border-color: rgba(13, 148, 136, 0.34) !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.11) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-card.badge-negative {
    background: linear-gradient(135deg, rgba(254, 242, 242, 0.96), rgba(255, 255, 255, 0.92)) !important;
    border-color: rgba(248, 113, 113, 0.24) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-icon {
    background: rgba(13, 148, 136, 0.1);
    border-color: rgba(13, 148, 136, 0.2);
}

html[data-theme="light"] body.dashboard-v2-enabled .badge-negative .dashboard-v2-badge-icon {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.18);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-badge-count.has-holders {
    color: #0f766e !important;
    background: rgba(13, 148, 136, 0.1);
    border-color: rgba(13, 148, 136, 0.2);
}

html[data-theme="light"] body.dashboard-v2-enabled .badge-negative .dashboard-v2-badge-count.has-holders {
    color: #b91c1c !important;
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.18);
}

@media (max-width: 1180px) {
    body.dashboard-v2-enabled .dashboard-v2-badge-track {
        display: flex !important;
        flex-wrap: nowrap;
        justify-content: flex-start !important;
        overflow-x: auto !important;
        overscroll-behavior-x: contain;
        scroll-padding-inline: 8px;
        -webkit-overflow-scrolling: touch;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-card {
        flex: 0 0 clamp(170px, 25vw, 220px) !important;
        scroll-snap-align: start;
    }
}

body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create {
    color: var(--dashboard-v2-text);
    background: transparent !important;
    border-top: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-inner {
    padding: 9px calc(var(--dashboard-v2-page-gutter) + var(--dashboard-v2-right-dock-gutter)) calc(9px + env(safe-area-inset-bottom, 0px)) calc(var(--dashboard-v2-page-gutter) + var(--dashboard-v2-left-dock-gutter)) !important;
    pointer-events: auto;
    background:
        linear-gradient(135deg, rgba(20, 184, 166, 0.07), transparent 42%),
        linear-gradient(180deg, rgba(24, 28, 35, 0.97), rgba(16, 19, 24, 0.96)) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-bottom: 0 !important;
    border-radius: 12px 12px 0 0;
    box-shadow: 0 -18px 48px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
    /* backdrop-filter removed (perf): the quick-create bar is position:fixed and
       on-screen during the entire scroll, so blur(18px) re-blurred the whole
       ticket list behind it every frame — the biggest single scroll cost.
       The gradient background below is ~0.96 opaque, so it still reads as glass. */
}

@media (min-width: 768px) {
    body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create {
        left: var(--dashboard-v2-quick-create-left, var(--dashboard-v2-left-width)) !important;
        right: auto !important;
        width: var(--dashboard-v2-quick-create-width, var(--dashboard-v2-content-width)) !important;
    }

    body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create .dashboard-v2-quick-create-inner {
        width: 100%;
        max-width: none !important;
        margin-right: 0;
        margin-left: 0;
    }
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center;
    gap: 7px !important;
    min-width: 0;
}

body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create .dashboard-v2-quick-create-row {
    flex-wrap: wrap !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-suggestion {
    flex: 0 1 120px;
    max-width: 128px;
    min-height: 36px;
    padding: 4px 9px !important;
    color: #86efac !important;
    font-size: 11px !important;
    line-height: 1.15;
    background: rgba(16, 185, 129, 0.11) !important;
    border: 1px solid rgba(74, 222, 128, 0.26) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    overflow: hidden;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-suggestion > div {
    max-width: 100%;
    min-width: 0;
    align-items: flex-start !important;
    overflow: hidden;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-suggestion span,
body.dashboard-v2-enabled .dashboard-v2-quick-create-suggestion strong {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-source {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    min-height: 36px;
    padding: 0 10px !important;
    color: var(--dashboard-v2-muted) !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    background: rgba(148, 163, 184, 0.08) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-source:hover,
body.dashboard-v2-enabled .dashboard-v2-quick-create-source:focus-visible {
    color: var(--dashboard-v2-text) !important;
    border-color: rgba(20, 184, 166, 0.32) !important;
    background: rgba(20, 184, 166, 0.11) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-selected="true"] {
    color: #e0f2fe !important;
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.26), rgba(59, 130, 246, 0.18)) !important;
    border-color: rgba(125, 211, 252, 0.44) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-source-id="teams"][data-selected="true"] {
    color: #ede9fe !important;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.28), rgba(124, 58, 237, 0.18)) !important;
    border-color: rgba(196, 181, 253, 0.44) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-source-id="outlook"][data-selected="true"] {
    color: #e0f2fe !important;
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.26), rgba(59, 130, 246, 0.18)) !important;
    border-color: rgba(125, 211, 252, 0.44) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-divider {
    flex: 0 0 1px;
    height: 30px !important;
    background: rgba(148, 163, 184, 0.16) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-subject,
body.dashboard-v2-enabled .dashboard-v2-quick-create-meta {
    height: 38px !important;
    min-height: 38px !important;
    color: var(--dashboard-v2-text) !important;
    font-size: 13px !important;
    background: rgba(15, 23, 42, 0.48) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 12px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-subject {
    flex: 1 1 clamp(280px, 26vw, 380px) !important;
    width: auto;
    min-width: min(100%, 280px) !important;
    max-width: min(100%, 380px);
    padding-right: 12px !important;
    padding-left: 12px !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-subject::placeholder {
    color: color-mix(in srgb, var(--dashboard-v2-muted) 84%, transparent);
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-subject:focus,
body.dashboard-v2-enabled .dashboard-v2-quick-create-meta:focus {
    border-color: rgba(20, 184, 166, 0.45) !important;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-assign {
    flex: 1 1 124px;
    width: auto;
    min-width: 118px;
    max-width: 144px;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-priority {
    flex: 0 1 112px;
    width: auto;
    min-width: 94px;
    max-width: 126px;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-client-type {
    flex: 0 1 112px;
    width: auto !important;
    min-width: 104px;
    max-width: 116px;
    padding: 0 32px 0 12px !important;
    overflow: hidden;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-client-type option {
    padding: 3px 6px;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-width: 98px;
    min-height: 38px;
    padding: 0 15px !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    background: linear-gradient(135deg, #6366f1, #2563eb) !important;
    border: 1px solid rgba(191, 219, 254, 0.28) !important;
    border-radius: 999px !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.24) !important;
}

body.dashboard-v2-enabled .dashboard-v2-quick-create-button:hover,
body.dashboard-v2-enabled .dashboard-v2-quick-create-button:focus-visible {
    background: linear-gradient(135deg, #818cf8, #3b82f6) !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.32) !important;
    transform: translateY(-1px);
}

html[data-theme="light"] body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create {
    background: transparent !important;
    border-top-color: transparent !important;
    box-shadow: none !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-inner {
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.06), transparent 44%),
        rgba(255, 255, 255, 0.96) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
    border-bottom: 0 !important;
    box-shadow: 0 -18px 42px rgba(15, 23, 42, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-suggestion {
    color: #047857 !important;
    background: rgba(16, 185, 129, 0.09) !important;
    border-color: rgba(5, 150, 105, 0.24) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-source,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-subject,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-meta {
    color: #111827 !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-selected="true"] {
    color: #0f172a !important;
    background: linear-gradient(135deg, rgba(224, 242, 254, 0.96), rgba(219, 234, 254, 0.92)) !important;
    border-color: rgba(37, 99, 235, 0.34) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-source-id="teams"][data-selected="true"] {
    color: #3b0764 !important;
    background: linear-gradient(135deg, rgba(245, 243, 255, 0.98), rgba(237, 233, 254, 0.94)) !important;
    border-color: rgba(124, 58, 237, 0.32) !important;
}

body.dashboard-v2-enabled #ticket-list,
body.dashboard-v2-enabled #done-ticket-list,
body.dashboard-v2-enabled #follow-up-ticket-list {
    display: grid;
    gap: 8px;
    padding-bottom: calc(var(--compose-bar-height, 0px) + 1.5rem) !important;
    padding-right: 0 !important;
}

body.dashboard-v2-enabled #ticket-list > *,
body.dashboard-v2-enabled #done-ticket-list > *,
body.dashboard-v2-enabled #follow-up-ticket-list > * {
    margin-top: 0 !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card {
    min-width: 0;
    min-height: 0;
    contain-intrinsic-size: auto 112px;
    gap: 8px !important;
    padding: 12px 14px !important;
    color: var(--dashboard-v2-text);
    background:
        linear-gradient(135deg, rgba(31, 36, 43, 0.96), rgba(17, 20, 25, 0.94)),
        var(--v2-surface-elevated) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-left-width: 3px !important;
    border-radius: 14px !important;
    /* Shadow blur radius reduced 34px -> 6px (perf): a 34px-blur shadow on every
       card is costly to rasterize and gets repainted for each card that scrolls
       into view. The smaller offset/blur keeps depth at a fraction of the cost. */
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background-color 160ms ease;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) {
    contain-intrinsic-size: auto 112px;
    gap: 5px !important;
    padding-top: 8px !important;
    padding-bottom: 7px !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body:not(.hidden)) {
    contain-intrinsic-size: auto 280px;
    gap: 11px !important;
    padding: 14px !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:hover,
body.dashboard-v2-enabled .dashboard-v2-ticket-card:focus-within {
    border-color: rgba(20, 184, 166, 0.32) !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body:not(.hidden)) {
    border-color: rgba(20, 184, 166, 0.48) !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.24) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card.opacity-60 {
    opacity: 0.72 !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card.dashboard-v2-ticket-email {
    border-left-color: rgba(34, 211, 238, 0.66) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card.dashboard-v2-ticket-email:has(.ticket-body.hidden) {
    contain-intrinsic-size: auto 124px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="high"],
body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="urgent"],
body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="critical"] {
    border-left-color: rgba(248, 113, 113, 0.78) !important;
}

body.dashboard-v2-enabled .ticket-super-urgent-card {
    border-color: rgba(248, 113, 113, 0.58) !important;
    border-left-color: rgba(248, 113, 113, 0.95) !important;
    box-shadow: 0 3px 8px rgba(127, 29, 29, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

body.dashboard-v2-enabled .ticket-super-urgent-chip {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    border: 1px solid rgba(248, 113, 113, 0.48);
    background: rgba(239, 68, 68, 0.16);
    color: #fecaca;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    white-space: nowrap;
}

body.dashboard-v2-enabled .ticket-super-urgent-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 10px;
    border: 1px solid rgba(248, 113, 113, 0.5);
    background: linear-gradient(90deg, rgba(127, 29, 29, 0.66), rgba(185, 28, 28, 0.34), rgba(127, 29, 29, 0.66));
    color: #fff1f2;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 10px 24px rgba(127, 29, 29, 0.2);
}

body.dashboard-v2-enabled .ticket-super-urgent-banner-word {
    font-size: 14px;
    font-weight: 900;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .ticket-super-urgent-banner-meta {
    color: rgba(254, 226, 226, 0.78);
    font-size: 11px;
    font-weight: 700;
}

body.dashboard-v2-enabled .ticket-super-urgent-detail-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(248, 113, 113, 0.42);
    background: rgba(127, 29, 29, 0.24);
}

body.dashboard-v2-enabled .ticket-super-urgent-detail-banner strong,
body.dashboard-v2-enabled .ticket-super-urgent-detail-banner span {
    display: block;
}

body.dashboard-v2-enabled .ticket-super-urgent-detail-banner strong {
    color: #fecaca;
    font-size: 12px;
    font-weight: 850;
}

body.dashboard-v2-enabled .ticket-super-urgent-detail-banner span {
    color: rgba(254, 226, 226, 0.76);
    font-size: 11px;
    line-height: 1.35;
}

body.dashboard-v2-enabled .ticket-super-urgent-toggle {
    color: #fca5a5 !important;
    background: rgba(248, 113, 113, 0.08);
}

body.dashboard-v2-enabled .ticket-super-urgent-toggle:hover,
body.dashboard-v2-enabled .ticket-super-urgent-toggle:focus-visible,
body.dashboard-v2-enabled .ticket-super-urgent-toggle.is-active {
    color: #fff1f2 !important;
    background: rgba(220, 38, 38, 0.24);
    box-shadow: 0 0 0 1px rgba(248, 113, 113, 0.36);
}

body.dashboard-v2-enabled .ticket-super-urgent-action-active {
    color: #fecaca !important;
}

@media (prefers-reduced-motion: no-preference) {
    body.dashboard-v2-enabled .ticket-super-urgent-banner-word {
        animation: ticketSuperUrgentPulse 1.8s ease-in-out infinite;
    }
}

@keyframes ticketSuperUrgentPulse {
    0%, 100% { opacity: 0.82; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.025); }
}

body.dashboard-v2-enabled .dashboard-v2-ticket-head {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px !important;
    align-items: flex-start;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-avatar {
    padding-top: 1px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-avatar img,
body.dashboard-v2-enabled .dashboard-v2-ticket-avatar > div {
    width: 34px !important;
    height: 34px !important;
    border-radius: 999px !important;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, 0.18), 0 8px 18px rgba(0, 0, 0, 0.2);
}

body.dashboard-v2-enabled .dashboard-v2-ticket-primary {
    display: grid;
    min-width: 0;
    gap: 5px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-topline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px !important;
    align-items: start !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-identity {
    gap: 5px !important;
    color: var(--dashboard-v2-muted);
    font-size: 11px;
    line-height: 1.35;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-identity > span:first-child {
    color: #67e8f9 !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: 0;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-badges {
    justify-content: flex-end;
    gap: 4px !important;
    max-width: min(100%, 520px);
}

body.dashboard-v2-enabled .dashboard-v2-ticket-badge {
    display: inline-flex !important;
    align-items: center;
    min-height: 20px;
    padding: 0 7px !important;
    font-size: 9.5px !important;
    font-weight: 800 !important;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
    border-radius: 999px !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-source {
    color: #a5f3fc !important;
    background: rgba(8, 145, 178, 0.14) !important;
    border-color: rgba(34, 211, 238, 0.34) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-source="outlook"] .dashboard-v2-ticket-source {
    color: #bfdbfe !important;
    background: rgba(59, 130, 246, 0.14) !important;
    border-color: rgba(96, 165, 250, 0.34) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-source="teams"] .dashboard-v2-ticket-source,
body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-source="manual"] .dashboard-v2-ticket-source {
    color: #ddd6fe !important;
    background: rgba(124, 58, 237, 0.14) !important;
    border-color: rgba(167, 139, 250, 0.32) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-priority {
    color: #fde68a !important;
    background: rgba(245, 158, 11, 0.14) !important;
    border: 1px solid rgba(251, 191, 36, 0.28) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="high"] .dashboard-v2-ticket-priority,
body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="urgent"] .dashboard-v2-ticket-priority,
body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="critical"] .dashboard-v2-ticket-priority {
    color: #fecaca !important;
    background: rgba(239, 68, 68, 0.16) !important;
    border-color: rgba(248, 113, 113, 0.34) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="low"] .dashboard-v2-ticket-priority {
    color: #bbf7d0 !important;
    background: rgba(34, 197, 94, 0.13) !important;
    border-color: rgba(74, 222, 128, 0.26) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-status {
    color: #fed7aa !important;
    background: rgba(245, 158, 11, 0.13) !important;
    border-color: rgba(251, 146, 60, 0.3) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-status="done"] .dashboard-v2-ticket-status {
    color: #bbf7d0 !important;
    background: rgba(34, 197, 94, 0.13) !important;
    border-color: rgba(74, 222, 128, 0.3) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-state,
body.dashboard-v2-enabled .reopen-flag.dashboard-v2-ticket-state {
    color: #a5f3fc !important;
    background: rgba(6, 182, 212, 0.14) !important;
    border-color: rgba(34, 211, 238, 0.32) !important;
}

body.dashboard-v2-enabled .email-pending-claim-badge.dashboard-v2-ticket-state {
    color: #a7f3d0 !important;
    background: rgba(16, 185, 129, 0.14) !important;
    border-color: rgba(52, 211, 153, 0.34) !important;
}

body.dashboard-v2-enabled .email-unread-reply-badge.dashboard-v2-ticket-state {
    color: #bae6fd !important;
    background: rgba(14, 165, 233, 0.16) !important;
    border-color: rgba(56, 189, 248, 0.38) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-tags {
    gap: 4px !important;
    min-height: 0;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-tags:empty {
    display: none;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-tags span {
    max-width: 180px;
    min-height: 18px;
    padding: 0 6px !important;
    overflow: hidden;
    color: var(--dashboard-v2-muted) !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: rgba(148, 163, 184, 0.1) !important;
    border-color: rgba(148, 163, 184, 0.16) !important;
    border-radius: 999px !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-title-row {
    align-items: center !important;
    gap: 5px !important;
    min-width: 0;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-title {
    margin: 0;
    min-width: 0;
    color: var(--dashboard-v2-text) !important;
    font-size: 13.5px !important;
    font-weight: 760 !important;
    line-height: 1.3 !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-email-line {
    width: fit-content;
    max-width: 100%;
    padding: 3px 7px;
    color: var(--dashboard-v2-muted);
    background: rgba(8, 145, 178, 0.09);
    border: 1px solid rgba(34, 211, 238, 0.14);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-label {
    color: #67e8f9;
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-name {
    color: var(--dashboard-v2-text);
}

body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-address {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-cc {
    color: #bae6fd;
    font-size: 10px;
    font-weight: 800;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-detail {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-footer {
    padding-top: 4px !important;
    border-top-color: rgba(148, 163, 184, 0.1) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-tags:not(:has(*)),
body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-email-line:not(:has(.email-customer-name)) {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-footer {
    margin-top: 0 !important;
    padding-top: 7px !important;
    border-color: var(--dashboard-v2-border) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-footer-grid {
    display: grid !important;
    grid-template-columns: minmax(0, auto) minmax(220px, 1fr) auto;
    align-items: center !important;
    gap: 8px !important;
}

@media (min-width: 768px) {
    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-primary {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 4px 8px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-topline {
        grid-column: 1 / -1;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-title-row {
        grid-column: 1 / 2;
        grid-row: 2;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-tags {
        grid-column: 2 / 3;
        grid-row: 2;
        justify-content: flex-end;
        max-width: 280px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-email-line {
        grid-column: 1 / -1;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-state-actions button,
    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-state-chip {
        min-height: 22px;
        padding: 0 7px !important;
        font-size: 9.5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action) {
        width: 24px;
        min-width: 24px;
        height: 24px;
        min-height: 24px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-kb-action {
        min-height: 24px;
        padding: 0 8px !important;
        font-size: 9.5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body.hidden) .dashboard-v2-ticket-actions svg {
        width: 12px;
        height: 12px;
    }
}

body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions {
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px !important;
    min-width: 0;
    padding: 2px 4px !important;
    background: rgba(15, 23, 42, 0.22) !important;
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 999px !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions:empty {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions button,
body.dashboard-v2-enabled .dashboard-v2-ticket-state-chip {
    min-height: 24px;
    padding: 0 8px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-meta {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    min-width: 0;
    gap: 6px !important;
    overflow: hidden;
    color: var(--dashboard-v2-muted) !important;
    font-size: 10.5px !important;
    line-height: 1.25;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-meta p,
body.dashboard-v2-enabled .dashboard-v2-ticket-meta span {
    margin: 0;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-meta svg {
    width: 12px;
    height: 12px;
    opacity: 0.75;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-actions {
    justify-self: end;
    display: inline-flex !important;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 2px !important;
    min-width: 0;
    padding: 2px !important;
    background: rgba(15, 23, 42, 0.2);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 999px;
    opacity: 0.72;
    transition: opacity 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-card:hover .dashboard-v2-ticket-actions,
body.dashboard-v2-enabled .dashboard-v2-ticket-card:focus-within .dashboard-v2-ticket-actions {
    border-color: rgba(148, 163, 184, 0.22);
    opacity: 1;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    padding: 0 !important;
    color: var(--dashboard-v2-muted) !important;
    background: transparent !important;
    border-radius: 999px !important;
    transition: color 150ms ease, background-color 150ms ease, transform 150ms ease;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action):hover,
body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action):focus-visible {
    color: var(--dashboard-v2-text) !important;
    background: rgba(148, 163, 184, 0.12) !important;
    transform: translateY(-1px);
}

body.dashboard-v2-enabled .dashboard-v2-ticket-actions svg {
    width: 13px;
    height: 13px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 9px !important;
    color: #bfdbfe !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    white-space: nowrap;
    background: rgba(59, 130, 246, 0.1) !important;
    border: 1px solid rgba(96, 165, 250, 0.18);
    border-radius: 999px !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action:hover,
body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action:focus-visible {
    color: #dbeafe !important;
    background: rgba(59, 130, 246, 0.18) !important;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu,
body.dashboard-v2-enabled .ticket-card-mobile-menu {
    display: none;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-detail {
    margin-top: 2px;
}

body.dashboard-v2-enabled .dashboard-v2-ticket-detail > .relative {
    border-color: var(--dashboard-v2-border) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card {
    color: var(--dashboard-v2-text);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.99), rgba(248, 250, 252, 0.97)),
        var(--v2-surface-elevated) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card:hover,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card:focus-within,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body:not(.hidden)) {
    border-color: rgba(13, 148, 136, 0.36) !important;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.11), 0 0 0 1px rgba(13, 148, 136, 0.06) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-card {
    border-color: rgba(220, 38, 38, 0.38) !important;
    border-left-color: rgba(220, 38, 38, 0.92) !important;
    box-shadow: 0 16px 36px rgba(127, 29, 29, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-chip {
    color: #991b1b;
    background: rgba(254, 226, 226, 0.92);
    border-color: rgba(248, 113, 113, 0.62);
}

html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-banner {
    color: #7f1d1d;
    background: linear-gradient(90deg, rgba(254, 226, 226, 0.98), rgba(254, 242, 242, 0.94), rgba(254, 226, 226, 0.98));
    border-color: rgba(248, 113, 113, 0.54);
    box-shadow: 0 10px 24px rgba(127, 29, 29, 0.1);
}

html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-banner-meta,
html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-detail-banner span {
    color: rgba(127, 29, 29, 0.68);
}

html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-detail-banner {
    background: rgba(254, 242, 242, 0.94);
    border-color: rgba(248, 113, 113, 0.48);
}

html[data-theme="light"] body.dashboard-v2-enabled .ticket-super-urgent-detail-banner strong {
    color: #991b1b;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-identity,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-meta,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-email-line {
    color: var(--dashboard-v2-muted) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-identity > span:first-child {
    color: #0f766e !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-title {
    color: #0f172a !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-source {
    color: #0e7490 !important;
    background: rgba(236, 254, 255, 0.9) !important;
    border-color: rgba(103, 232, 249, 0.7) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-source="outlook"] .dashboard-v2-ticket-source {
    color: #1d4ed8 !important;
    background: rgba(239, 246, 255, 0.95) !important;
    border-color: #bfdbfe !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-source="teams"] .dashboard-v2-ticket-source,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-source="manual"] .dashboard-v2-ticket-source {
    color: #6d28d9 !important;
    background: rgba(245, 243, 255, 0.95) !important;
    border-color: #ddd6fe !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-priority {
    color: #92400e !important;
    background: #fef3c7 !important;
    border-color: #fde68a !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="high"] .dashboard-v2-ticket-priority,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="urgent"] .dashboard-v2-ticket-priority,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="critical"] .dashboard-v2-ticket-priority {
    color: #b91c1c !important;
    background: #fee2e2 !important;
    border-color: #fecaca !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-priority="low"] .dashboard-v2-ticket-priority {
    color: #15803d !important;
    background: #dcfce7 !important;
    border-color: #bbf7d0 !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-status {
    color: #b45309 !important;
    background: #fffbeb !important;
    border-color: #fde68a !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card[data-dashboard-v2-status="done"] .dashboard-v2-ticket-status {
    color: #15803d !important;
    background: #ecfdf5 !important;
    border-color: #bbf7d0 !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-state {
    color: #0e7490 !important;
    background: #ecfeff !important;
    border-color: #a5f3fc !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .email-pending-claim-badge.dashboard-v2-ticket-state {
    color: #047857 !important;
    background: #ecfdf5 !important;
    border-color: #a7f3d0 !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-tags span {
    color: #475569 !important;
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-email-line {
    background: rgba(236, 254, 255, 0.72);
    border-color: rgba(165, 243, 252, 0.78);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-label {
    color: #0e7490;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-name {
    color: #0f172a;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-actions {
    background: rgba(248, 250, 252, 0.92);
    border-color: rgba(148, 163, 184, 0.22);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action) {
    color: #64748b !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action):hover,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action):focus-visible {
    color: #0f172a !important;
    background: rgba(226, 232, 240, 0.9) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action {
    color: #1d4ed8 !important;
    background: #eff6ff !important;
    border-color: #bfdbfe !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action:hover,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action:focus-visible {
    color: #1e40af !important;
    background: #dbeafe !important;
}

body.dashboard-v2-enabled .dashboard-v2-left-rail,
body.dashboard-v2-enabled .dashboard-v2-right-rail {
    color: var(--dashboard-v2-text);
    background: var(--dashboard-v2-panel) !important;
    border-color: var(--dashboard-v2-border) !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-left-rail > [data-dashboard-v2-section],
body.dashboard-v2-enabled .dashboard-v2-right-rail > [data-dashboard-v2-section] {
    margin-bottom: 12px !important;
    padding: 12px !important;
    color: var(--dashboard-v2-text) !important;
    background:
        linear-gradient(145deg, rgba(148, 163, 184, 0.075), transparent 62%),
        var(--dashboard-v2-panel-soft) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-left-rail > [data-dashboard-v2-section] h3,
body.dashboard-v2-enabled .dashboard-v2-right-rail > [data-dashboard-v2-section] h3 {
    color: var(--dashboard-v2-text) !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

body.dashboard-v2-enabled #stats-period,
body.dashboard-v2-enabled #custom-days-input {
    min-height: 28px;
    color: var(--dashboard-v2-text) !important;
    background: rgba(15, 23, 42, 0.44) !important;
    border-color: var(--dashboard-v2-border) !important;
    border-radius: 999px !important;
}

body.dashboard-v2-enabled #stats-container,
body.dashboard-v2-enabled #leaderboard-container,
body.dashboard-v2-enabled #on-leave-notes,
body.dashboard-v2-enabled #schedule-adjustments,
body.dashboard-v2-enabled #deployment-notes-list {
    display: grid;
    gap: 7px !important;
}

body.dashboard-v2-enabled #stats-container > *,
body.dashboard-v2-enabled #leaderboard-container > *,
body.dashboard-v2-enabled #on-leave-notes > *,
body.dashboard-v2-enabled #schedule-adjustments > *,
body.dashboard-v2-enabled #deployment-notes-list > * {
    margin: 0 !important;
    background: rgba(15, 23, 42, 0.28) !important;
    border-color: var(--dashboard-v2-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled #stats-container > div,
body.dashboard-v2-enabled #leaderboard-container > div {
    padding: 9px 10px !important;
}

body.dashboard-v2-enabled #leaderboard-container > div {
    min-height: 38px;
}

body.dashboard-v2-enabled #leaderboard-container > div:first-child {
    background:
        linear-gradient(135deg, rgba(245, 158, 11, 0.14), rgba(168, 85, 247, 0.08)),
        rgba(15, 23, 42, 0.34) !important;
    border-color: rgba(245, 158, 11, 0.24) !important;
}

body.dashboard-v2-enabled #stats-container [data-presence-label="true"] {
    padding: 2px 6px;
    background: rgba(148, 163, 184, 0.08);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 999px;
}

body.dashboard-v2-enabled #on-leave-notes p,
body.dashboard-v2-enabled #schedule-adjustments p,
body.dashboard-v2-enabled #deployment-notes-list p {
    color: var(--dashboard-v2-muted) !important;
    line-height: 1.4;
}

body.dashboard-v2-enabled #on-leave-notes > p,
body.dashboard-v2-enabled #schedule-adjustments > p,
body.dashboard-v2-enabled #deployment-notes-list > p,
body.dashboard-v2-enabled #leaderboard-container > p,
body.dashboard-v2-enabled #stats-container > p,
body.dashboard-v2-enabled #stats-container > .col-span-full {
    padding: 12px !important;
    color: var(--dashboard-v2-muted) !important;
    text-align: center;
    background: rgba(15, 23, 42, 0.22) !important;
    border: 1px dashed var(--dashboard-v2-border) !important;
    border-radius: 12px !important;
}

body.dashboard-v2-enabled #deployment-form {
    background: rgba(15, 23, 42, 0.34) !important;
    border-color: var(--dashboard-v2-border) !important;
    border-radius: 12px !important;
}

body.dashboard-v2-enabled #deployment-form textarea,
body.dashboard-v2-enabled #deployment-form select,
body.dashboard-v2-enabled #deployment-form input {
    color: var(--dashboard-v2-text) !important;
    background: rgba(15, 23, 42, 0.42) !important;
    border-color: var(--dashboard-v2-border) !important;
}

body.dashboard-v2-enabled #performance-modal {
    padding: var(--dashboard-v2-page-gutter) !important;
    background: rgba(3, 7, 18, 0.64) !important;
    backdrop-filter: blur(10px) !important;
}

body.dashboard-v2-enabled #performance-modal > .glassmorphism {
    color: var(--dashboard-v2-text) !important;
    background:
        linear-gradient(135deg, rgba(20, 184, 166, 0.065), transparent 38%),
        linear-gradient(180deg, rgba(31, 36, 43, 0.98), rgba(18, 22, 28, 0.97)),
        var(--v2-surface-elevated) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(255, 255, 255, 0.03) !important;
}

body.dashboard-v2-enabled #performance-header {
    color: var(--dashboard-v2-text) !important;
    letter-spacing: 0 !important;
}

body.dashboard-v2-enabled #close-performance-modal-btn {
    width: 34px;
    height: 34px;
    color: var(--dashboard-v2-muted) !important;
    background: rgba(148, 163, 184, 0.08) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 999px !important;
    line-height: 1 !important;
}

body.dashboard-v2-enabled #close-performance-modal-btn:hover,
body.dashboard-v2-enabled #close-performance-modal-btn:focus-visible {
    color: var(--dashboard-v2-text) !important;
    background: rgba(20, 184, 166, 0.14) !important;
    border-color: var(--dashboard-v2-border-strong) !important;
}

body.dashboard-v2-enabled #performance-content {
    color: var(--dashboard-v2-text) !important;
}

body.dashboard-v2-enabled #performance-content .glassmorphism,
body.dashboard-v2-enabled #user-kpi-results > div,
body.dashboard-v2-enabled #user-kpi-results [class*="bg-gray-"],
body.dashboard-v2-enabled #user-kpi-results [class*="bg-indigo-"] {
    color: var(--dashboard-v2-text) !important;
    background:
        linear-gradient(145deg, rgba(148, 163, 184, 0.075), transparent 62%),
        rgba(15, 23, 42, 0.28) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

body.dashboard-v2-enabled #performance-content > .grid:first-child .glassmorphism {
    min-height: 138px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-color: rgba(20, 184, 166, 0.2) !important;
}

body.dashboard-v2-enabled #performance-content h4 {
    color: var(--dashboard-v2-text) !important;
    letter-spacing: 0 !important;
}

body.dashboard-v2-enabled #performance-content :is(.text-gray-300, .text-gray-400, .text-gray-500) {
    color: var(--dashboard-v2-muted) !important;
}

body.dashboard-v2-enabled #performance-content :is(.text-white, .font-bold.text-white) {
    color: var(--dashboard-v2-text) !important;
}

body.dashboard-v2-enabled #performance-content :is(.text-indigo-300, .text-indigo-400) {
    color: var(--dashboard-v2-accent) !important;
}

body.dashboard-v2-enabled #performance-content input[type="date"] {
    min-height: 40px;
    color: var(--dashboard-v2-text) !important;
    background: rgba(15, 23, 42, 0.44) !important;
    border-color: var(--dashboard-v2-border) !important;
    border-radius: 12px !important;
}

body.dashboard-v2-enabled #performance-content input[type="date"]:focus {
    border-color: var(--dashboard-v2-border-strong) !important;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.22) !important;
}

body.dashboard-v2-enabled #performance-content button[onclick="main.loadUserKPI()"] {
    min-height: 40px;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0f766e, #2563eb) !important;
    border: 1px solid rgba(45, 212, 191, 0.28) !important;
    border-radius: 999px !important;
    box-shadow: 0 14px 30px rgba(20, 184, 166, 0.16) !important;
}

body.dashboard-v2-enabled #performance-content button[onclick="main.loadUserKPI()"]:hover,
body.dashboard-v2-enabled #performance-content button[onclick="main.loadUserKPI()"]:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(45, 212, 191, 0.48) !important;
    box-shadow: 0 18px 38px rgba(37, 99, 235, 0.22) !important;
}

body.dashboard-v2-enabled #performance-content .bg-gray-600\/50 {
    color: var(--dashboard-v2-text) !important;
    background: rgba(148, 163, 184, 0.12) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
}

body.dashboard-v2-enabled #priority-chart-container canvas {
    max-height: 210px;
}

html[data-theme="light"] body.dashboard-v2-enabled #performance-modal {
    background: rgba(15, 23, 42, 0.32) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #performance-modal > .glassmorphism {
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.055), transparent 40%),
        rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(15, 23, 42, 0.03) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #performance-content .glassmorphism,
html[data-theme="light"] body.dashboard-v2-enabled #user-kpi-results > div,
html[data-theme="light"] body.dashboard-v2-enabled #user-kpi-results [class*="bg-gray-"],
html[data-theme="light"] body.dashboard-v2-enabled #user-kpi-results [class*="bg-indigo-"] {
    background:
        linear-gradient(145deg, rgba(13, 148, 136, 0.045), transparent 62%),
        rgba(255, 255, 255, 0.84) !important;
    border-color: rgba(71, 85, 105, 0.16) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #performance-content input[type="date"] {
    color: #0f172a !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #performance-content .bg-gray-600\/50 {
    background: rgba(241, 245, 249, 0.92) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
}

body.dashboard-v2-enabled #notification-center {
    top: var(--notification-panel-top, 70px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--notification-panel-left, 12px) !important;
    width: var(--notification-panel-width, min(410px, calc(100vw - 24px))) !important;
    max-height: min(var(--notification-panel-max-height, 620px), calc(100vh - 88px)) !important;
    color: var(--dashboard-v2-text) !important;
    background:
        radial-gradient(circle at var(--notification-panel-origin, 24px) -12px, rgba(129, 140, 248, 0.22), transparent 150px),
        linear-gradient(180deg, rgba(31, 36, 43, 0.99), rgba(18, 22, 28, 0.98)),
        var(--v2-surface-elevated) !important;
    border: 1px solid var(--dashboard-v2-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
    overflow: visible !important;
    transform-origin: var(--notification-panel-origin, 24px) top;
    z-index: 86 !important;
}

body.dashboard-v2-enabled #notification-center:not(.hidden) {
    animation: dashboard-v2-notification-pop 150ms ease-out both;
}

body.dashboard-v2-enabled #notification-center::before {
    position: absolute;
    top: -7px;
    left: var(--notification-panel-arrow-left, 28px);
    width: 14px;
    height: 14px;
    content: "";
    background: rgba(31, 36, 43, 0.99);
    border-top: 1px solid var(--dashboard-v2-border);
    border-left: 1px solid var(--dashboard-v2-border);
    border-radius: 4px 0 0;
    transform: translateX(-50%) rotate(45deg);
    z-index: 0;
}

body.dashboard-v2-enabled #notification-center > * {
    position: relative;
    z-index: 1;
}

@keyframes dashboard-v2-notification-pop {
    from {
        opacity: 0;
        transform: translateY(-4px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

body.dashboard-v2-enabled #notification-center > div:first-child {
    min-height: 50px;
    padding: 12px 14px 10px !important;
    border-bottom-color: var(--dashboard-v2-border) !important;
}

body.dashboard-v2-enabled #notification-center h3 {
    color: var(--dashboard-v2-text) !important;
    font-size: 14px !important;
    font-weight: 850 !important;
}

body.dashboard-v2-enabled #notification-center .notif-tab-btn {
    min-height: 38px;
    font-size: 12px !important;
}

body.dashboard-v2-enabled #notification-center .notif-filter-btn {
    min-height: 26px;
    font-size: 10.5px !important;
    border-radius: 999px !important;
}

body.dashboard-v2-enabled #notif-list {
    padding: 10px !important;
    gap: 7px !important;
}

body.dashboard-v2-enabled #notif-list:empty::before {
    display: block;
    padding: 14px;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    content: "No notifications to show.";
    background: rgba(15, 23, 42, 0.24);
    border: 1px dashed var(--dashboard-v2-border);
    border-radius: 12px;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-left-rail > [data-dashboard-v2-section],
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-right-rail > [data-dashboard-v2-section],
html[data-theme="light"] body.dashboard-v2-enabled #stats-container > *,
html[data-theme="light"] body.dashboard-v2-enabled #leaderboard-container > *,
html[data-theme="light"] body.dashboard-v2-enabled #on-leave-notes > *,
html[data-theme="light"] body.dashboard-v2-enabled #schedule-adjustments > *,
html[data-theme="light"] body.dashboard-v2-enabled #deployment-notes-list > * {
    background:
        linear-gradient(145deg, rgba(13, 148, 136, 0.045), transparent 62%),
        rgba(255, 255, 255, 0.82) !important;
    border-color: rgba(71, 85, 105, 0.16) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #stats-period,
html[data-theme="light"] body.dashboard-v2-enabled #custom-days-input,
html[data-theme="light"] body.dashboard-v2-enabled #deployment-form textarea,
html[data-theme="light"] body.dashboard-v2-enabled #deployment-form select,
html[data-theme="light"] body.dashboard-v2-enabled #deployment-form input {
    color: #0f172a !important;
    background: rgba(255, 255, 255, 0.86) !important;
    border-color: rgba(71, 85, 105, 0.18) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #notification-center {
    background:
        radial-gradient(circle at var(--notification-panel-origin, 24px) -12px, rgba(99, 102, 241, 0.14), transparent 150px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 250, 252, 0.98)),
        var(--v2-surface-elevated) !important;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(15, 23, 42, 0.03) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled #notification-center::before {
    background: rgba(255, 255, 255, 0.99);
    border-color: rgba(71, 85, 105, 0.16);
}

html[data-theme="light"] body.dashboard-v2-enabled #notif-list:empty::before,
html[data-theme="light"] body.dashboard-v2-enabled #on-leave-notes > p,
html[data-theme="light"] body.dashboard-v2-enabled #schedule-adjustments > p,
html[data-theme="light"] body.dashboard-v2-enabled #deployment-notes-list > p,
html[data-theme="light"] body.dashboard-v2-enabled #leaderboard-container > p,
html[data-theme="light"] body.dashboard-v2-enabled #stats-container > p,
html[data-theme="light"] body.dashboard-v2-enabled #stats-container > .col-span-full {
    background: rgba(248, 250, 252, 0.86) !important;
    border-color: rgba(71, 85, 105, 0.16) !important;
}

.dashboard-v2-rail-toggle,
.dashboard-v2-floating-button,
.dashboard-v2-mobile-actions button,
.dashboard-v2-mobile-drawer-close,
.dashboard-v2-virtual-popover-close,
.dashboard-v2-shift-action,
.dashboard-v2-drawer-backdrop,
.dashboard-v2-mobile-backdrop {
    font: inherit;
}

.dashboard-v2-rail-toggle,
.dashboard-v2-floating-button,
.dashboard-v2-mobile-actions button,
.dashboard-v2-mobile-drawer-close,
.dashboard-v2-virtual-popover-close,
.dashboard-v2-shift-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    border: 1px solid var(--dashboard-v2-border, rgba(176, 184, 194, 0.16));
    border-radius: 999px;
    color: var(--v2-text, #f5f7fa);
    background: var(--v2-surface, rgba(31, 36, 43, 0.9));
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

.dashboard-v2-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.dashboard-v2-rail-toggle:hover,
.dashboard-v2-rail-toggle:focus-visible,
.dashboard-v2-floating-button:hover,
.dashboard-v2-floating-button:focus-visible,
.dashboard-v2-mobile-actions button:hover,
.dashboard-v2-mobile-actions button:focus-visible,
.dashboard-v2-mobile-drawer-close:hover,
.dashboard-v2-mobile-drawer-close:focus-visible,
.dashboard-v2-virtual-popover-close:hover,
.dashboard-v2-virtual-popover-close:focus-visible,
.dashboard-v2-shift-action:hover,
.dashboard-v2-shift-action:focus-visible {
    color: #ffffff;
    background: rgba(20, 184, 166, 0.18);
    border-color: var(--dashboard-v2-border-strong, rgba(20, 184, 166, 0.34));
    outline: 2px solid rgba(20, 184, 166, 0.35);
    outline-offset: 2px;
}

html[data-theme="light"] .dashboard-v2-rail-toggle:hover,
html[data-theme="light"] .dashboard-v2-rail-toggle:focus-visible,
html[data-theme="light"] .dashboard-v2-floating-button:hover,
html[data-theme="light"] .dashboard-v2-floating-button:focus-visible,
html[data-theme="light"] .dashboard-v2-mobile-actions button:hover,
html[data-theme="light"] .dashboard-v2-mobile-actions button:focus-visible,
html[data-theme="light"] .dashboard-v2-mobile-drawer-close:hover,
html[data-theme="light"] .dashboard-v2-mobile-drawer-close:focus-visible,
html[data-theme="light"] .dashboard-v2-virtual-popover-close:hover,
html[data-theme="light"] .dashboard-v2-virtual-popover-close:focus-visible,
html[data-theme="light"] .dashboard-v2-shift-action:hover,
html[data-theme="light"] .dashboard-v2-shift-action:focus-visible {
    color: #0f172a;
    background: rgba(204, 251, 241, 0.8);
}

.dashboard-v2-rail-toggle {
    align-self: flex-end;
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    margin-bottom: 10px;
    padding: 0;
}

.dashboard-v2-floating-dock,
.dashboard-v2-drawer-backdrop,
.dashboard-v2-mobile-actions,
.dashboard-v2-mobile-backdrop,
.dashboard-v2-mobile-drawer,
.dashboard-v2-virtual-popover {
    display: none;
}

.dashboard-v2-arrow-svg {
    width: 16px;
    height: 16px;
}

.dashboard-v2-popover-title {
    display: none;
}

.dashboard-v2-popover-section-hidden {
    display: none !important;
}

.dashboard-v2-popover-inline-hidden {
    display: none !important;
}

.dashboard-v2-floating-button {
    position: relative;
}

.dashboard-v2-floating-icon {
    width: 18px;
    height: 18px;
    stroke-width: 2;
}

.dashboard-v2-floating-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    max-width: 28px;
    height: 17px;
    padding: 0 4px;
    color: #ffffff;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    background: var(--v2-danger, #ef4444);
    border: 2px solid var(--v2-surface, rgba(24, 27, 32, 0.94));
    border-radius: 999px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dashboard-v2-floating-badge[hidden] {
    display: none;
}

.dashboard-v2-floating-dot {
    min-width: 10px;
    width: 10px;
    height: 10px;
    padding: 0;
}

@media (min-width: 768px) {
    body.dashboard-v2-enabled .dashboard-v2-workspace {
        display: grid !important;
        grid-template-columns: var(--dashboard-v2-left-width) minmax(0, 1fr);
        align-items: stretch;
        overflow: hidden;
    }

    body.dashboard-v2-enabled #sidebar.dashboard-v2-left-rail {
        position: relative !important;
        inset: auto !important;
        z-index: 20 !important;
        display: flex !important;
        width: var(--dashboard-v2-left-width) !important;
        min-width: 0 !important;
        max-width: var(--dashboard-v2-left-width) !important;
        height: auto !important;
        box-sizing: border-box;
        padding: 14px 12px !important;
        transform: none !important;
        border-right-width: 1px !important;
        overflow-x: hidden !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-main-column {
        overflow: hidden;
    }

    body.dashboard-v2-enabled .dashboard-v2-main-column {
        padding-left: var(--dashboard-v2-left-dock-gutter);
        padding-right: var(--dashboard-v2-right-dock-gutter);
    }

    body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create {
        left: var(--dashboard-v2-quick-create-left, var(--dashboard-v2-left-width)) !important;
        right: auto !important;
        width: var(--dashboard-v2-quick-create-width, var(--dashboard-v2-content-width)) !important;
    }

    body.dashboard-v2-enabled.dashboard-v2-left-collapsed #sidebar.dashboard-v2-left-rail {
        width: 0 !important;
        max-width: 0 !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
        border-right-width: 0 !important;
        overflow: hidden !important;
        pointer-events: none;
        visibility: hidden;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock {
        position: fixed;
        inset: 0;
        z-index: 60;
        display: block;
        pointer-events: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock-group {
        position: fixed;
        top: calc(76px + env(safe-area-inset-top, 0px));
        z-index: 61;
        display: flex;
        flex-direction: column;
        gap: 9px;
        padding: 7px;
        background: rgba(15, 23, 42, 0.52);
        border: 1px solid rgba(148, 163, 184, 0.18);
        border-radius: 999px;
        box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
        backdrop-filter: blur(14px);
        pointer-events: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock-left {
        left: var(--dashboard-v2-dock-inset);
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock-right {
        right: var(--dashboard-v2-dock-inset);
    }

    body.dashboard-v2-enabled:not(.dashboard-v2-left-collapsed) .dashboard-v2-floating-dock-left,
    body.dashboard-v2-enabled:not(.dashboard-v2-right-collapsed) .dashboard-v2-floating-dock-right {
        display: none !important;
    }

    /* Keep toast notifications clear of the right floating dock.
     * The dock (button 46px + 7px padding each side ≈ 60px) sits at
     * right: var(--dashboard-v2-dock-inset). When the right rail is
     * collapsed the dock is visible, so we slide the toast stacks left of
     * it (dock width + a gap) instead of letting them overlap. */
    body.dashboard-v2-enabled.dashboard-v2-right-collapsed #notification-panel,
    body.dashboard-v2-enabled.dashboard-v2-right-collapsed #status-notifications-container {
        right: calc(var(--dashboard-v2-dock-inset, 18px) + 76px) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-button {
        --dock-accent-text: rgba(226, 232, 240, 0.94);
        --dock-accent-soft: rgba(20, 184, 166, 0.15);
        --dock-accent-strong: rgba(20, 184, 166, 0.26);
        --dock-accent-border: rgba(148, 163, 184, 0.22);
        --dock-accent-border-strong: rgba(125, 211, 252, 0.38);
        --dock-accent-glow: rgba(20, 184, 166, 0.18);
        width: 46px;
        min-width: 46px;
        height: 46px;
        min-height: 46px;
        padding: 0;
        color: var(--dock-accent-text);
        background:
            radial-gradient(circle at 28% 18%, var(--dock-accent-soft), transparent 58%),
            linear-gradient(145deg, rgba(30, 41, 59, 0.94), rgba(15, 23, 42, 0.9)),
            rgba(15, 23, 42, 0.88);
        border-color: var(--dock-accent-border);
        border-radius: 999px;
        backdrop-filter: blur(12px);
        font-weight: 800;
        letter-spacing: 0;
        box-shadow: 0 16px 34px rgba(0, 0, 0, 0.3), 0 0 18px var(--dock-accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.05);
        pointer-events: auto;
    }

    /*
     * Dock accent families reduced to four semantic groups (May 2026 Claude-review polish):
     *   1. Insights (cyan)      - KPI, Team, Settings
     *   2. Highlight (amber)    - Rank/Weekly leaderboard (kept distinct - leaderboard convention)
     *   3. Attention (rose)     - Notifications
     *   4. Work (blue/teal)     - Schedule, Deployments
     * Shift remains state-aware (green/red/neutral) below.
     * Settings reuses the neutral slate base color from the default .dashboard-v2-floating-button
     * surface so it reads as "neutral" without introducing a separate accent family.
     */
    /* Primary panels (KPI, Team, Schedule, Deploy) share the teal brand
     * accent so the dock matches the unified header. Only genuinely-semantic
     * colors remain distinct: amber=rank (matches gold leaderboard badge),
     * rose=notifications, green/red=shift state. */
    body.dashboard-v2-enabled .dashboard-v2-floating-btn--kpi,
    body.dashboard-v2-enabled .dashboard-v2-floating-btn--team,
    body.dashboard-v2-enabled .dashboard-v2-floating-btn--schedule,
    body.dashboard-v2-enabled .dashboard-v2-floating-btn--deploy {
        --dock-accent-text: #5eead4;
        --dock-accent-soft: rgba(20, 184, 166, 0.2);
        --dock-accent-strong: rgba(20, 184, 166, 0.34);
        --dock-accent-border: rgba(45, 212, 191, 0.34);
        --dock-accent-border-strong: rgba(94, 234, 212, 0.54);
        --dock-accent-glow: rgba(20, 184, 166, 0.24);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-btn--settings {
        --dock-accent-text: #cbd5e1;
        --dock-accent-soft: rgba(148, 163, 184, 0.18);
        --dock-accent-strong: rgba(148, 163, 184, 0.3);
        --dock-accent-border: rgba(148, 163, 184, 0.32);
        --dock-accent-border-strong: rgba(203, 213, 225, 0.5);
        --dock-accent-glow: rgba(148, 163, 184, 0.18);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-btn--rank {
        --dock-accent-text: #fde68a;
        --dock-accent-soft: rgba(245, 158, 11, 0.22);
        --dock-accent-strong: rgba(245, 158, 11, 0.36);
        --dock-accent-border: rgba(251, 191, 36, 0.34);
        --dock-accent-border-strong: rgba(253, 230, 138, 0.54);
        --dock-accent-glow: rgba(245, 158, 11, 0.24);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-btn--notifications {
        --dock-accent-text: #fda4af;
        --dock-accent-soft: rgba(244, 63, 94, 0.22);
        --dock-accent-strong: rgba(244, 63, 94, 0.36);
        --dock-accent-border: rgba(251, 113, 133, 0.38);
        --dock-accent-border-strong: rgba(253, 164, 175, 0.58);
        --dock-accent-glow: rgba(244, 63, 94, 0.25);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-btn--shift {
        --dock-accent-text: #cbd5e1;
        --dock-accent-soft: rgba(148, 163, 184, 0.16);
        --dock-accent-strong: rgba(148, 163, 184, 0.28);
        --dock-accent-border: rgba(148, 163, 184, 0.28);
        --dock-accent-border-strong: rgba(203, 213, 225, 0.48);
        --dock-accent-glow: rgba(148, 163, 184, 0.16);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-btn--shift.dashboard-v2-shift-start {
        --dock-accent-text: #86efac;
        --dock-accent-soft: rgba(34, 197, 94, 0.22);
        --dock-accent-strong: rgba(34, 197, 94, 0.36);
        --dock-accent-border: rgba(74, 222, 128, 0.38);
        --dock-accent-border-strong: rgba(134, 239, 172, 0.58);
        --dock-accent-glow: rgba(34, 197, 94, 0.25);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-btn--shift.dashboard-v2-shift-end {
        --dock-accent-text: #fca5a5;
        --dock-accent-soft: rgba(239, 68, 68, 0.23);
        --dock-accent-strong: rgba(239, 68, 68, 0.38);
        --dock-accent-border: rgba(248, 113, 113, 0.4);
        --dock-accent-border-strong: rgba(252, 165, 165, 0.62);
        --dock-accent-glow: rgba(239, 68, 68, 0.27);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--kpi,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--team,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--schedule,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--deploy {
        --dock-accent-text-light: #0f766e;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--settings {
        --dock-accent-text-light: #475569;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--rank {
        --dock-accent-text-light: #92400e;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--notifications {
        --dock-accent-text-light: #be123c;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--away {
        --dock-accent-text-light: #c2410c;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--deploy {
        --dock-accent-text-light: #0f766e;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--actions {
        --dock-accent-text-light: #6d28d9;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--shift.dashboard-v2-shift-start {
        --dock-accent-text-light: #15803d;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-btn--shift.dashboard-v2-shift-end {
        --dock-accent-text-light: #b91c1c;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-button:hover,
    body.dashboard-v2-enabled .dashboard-v2-floating-button:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-floating-button[aria-expanded="true"] {
        color: #ffffff;
        background:
            radial-gradient(circle at 28% 18%, var(--dock-accent-strong), transparent 60%),
            linear-gradient(145deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.94)),
            rgba(30, 41, 59, 0.98);
        border-color: var(--dock-accent-border-strong);
        box-shadow: 0 20px 44px rgba(0, 0, 0, 0.36), 0 0 26px var(--dock-accent-glow), 0 0 0 1px var(--dock-accent-border);
        transform: translateY(-1px);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-dock-group {
        background: rgba(255, 255, 255, 0.64);
        border-color: rgba(71, 85, 105, 0.16);
        box-shadow: 0 18px 44px rgba(15, 23, 42, 0.14);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-button {
        color: var(--dock-accent-text-light, #1e293b);
        background:
            radial-gradient(circle at 28% 18%, var(--dock-accent-soft), transparent 58%),
            linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(241, 245, 249, 0.94)),
            rgba(255, 255, 255, 0.88);
        border-color: rgba(71, 85, 105, 0.2);
        box-shadow: 0 14px 30px rgba(15, 23, 42, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.8);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-button:hover,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-button:focus-visible,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-button[aria-expanded="true"] {
        color: #0f172a;
        background:
            radial-gradient(circle at 28% 18%, var(--dock-accent-strong), transparent 62%),
            linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(241, 245, 249, 0.96)),
            rgba(255, 255, 255, 0.96);
        border-color: var(--dock-accent-border-strong);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-button[hidden] {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-expand {
        width: 38px;
        min-width: 38px;
        height: 38px;
        min-height: 38px;
        align-self: center;
        padding: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-label {
        position: absolute;
        top: 50%;
        left: calc(100% + 10px);
        display: inline-flex;
        align-items: center;
        min-height: 28px;
        padding: 0 9px;
        color: var(--v2-text);
        font-size: 11px;
        font-weight: 750;
        white-space: nowrap;
        background: var(--v2-surface-elevated);
        border: 1px solid var(--v2-border);
        border-radius: 999px;
        box-shadow: 0 12px 26px rgba(0, 0, 0, 0.22);
        opacity: 0;
        pointer-events: none;
        transform: translateY(-50%) translateX(-4px);
        transition: opacity 140ms ease, transform 140ms ease;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock-right .dashboard-v2-floating-label {
        right: calc(100% + 10px);
        left: auto;
        transform: translateY(-50%) translateX(4px);
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-button:hover .dashboard-v2-floating-label,
    body.dashboard-v2-enabled .dashboard-v2-floating-button:focus-visible .dashboard-v2-floating-label {
        opacity: 1;
        transform: translateY(-50%) translateX(0);
    }

    body.dashboard-v2-enabled .dashboard-v2-drawer-backdrop {
        position: fixed;
        inset: 0;
        z-index: 58;
        display: block;
        background: rgba(0, 0, 0, 0.02);
        border: 0;
        backdrop-filter: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-drawer-backdrop[hidden] {
        display: none;
    }

    body.dashboard-v2-drawer-open {
        overflow-x: hidden;
    }

    body.dashboard-v2-enabled.dashboard-v2-left-drawer-open #sidebar.dashboard-v2-left-rail,
    body.dashboard-v2-enabled.dashboard-v2-right-drawer-open #on-leave-sidebar.dashboard-v2-right-rail {
        position: fixed !important;
        top: var(--dashboard-v2-popover-top, 96px) !important;
        bottom: auto !important;
        z-index: 75 !important;
        display: flex !important;
        flex-direction: column;
        width: var(--dashboard-v2-drawer-width) !important;
        min-width: 0 !important;
        max-width: var(--dashboard-v2-drawer-width) !important;
        height: auto !important;
        max-height: min(70vh, 560px) !important;
        padding: 14px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        pointer-events: auto;
        transform: none !important;
        visibility: visible;
        background:
            linear-gradient(180deg, rgba(31, 36, 43, 0.98), rgba(18, 22, 28, 0.97)),
            var(--v2-surface-elevated) !important;
        border: 1px solid var(--v2-border) !important;
        border-radius: 18px !important;
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(255, 255, 255, 0.03) !important;
        backdrop-filter: blur(18px);
    }

    html[data-theme="light"] body.dashboard-v2-enabled.dashboard-v2-left-drawer-open #sidebar.dashboard-v2-left-rail,
    html[data-theme="light"] body.dashboard-v2-enabled.dashboard-v2-right-drawer-open #on-leave-sidebar.dashboard-v2-right-rail {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 250, 252, 0.98)),
            var(--v2-surface-elevated) !important;
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(15, 23, 42, 0.03) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover .dashboard-v2-popover-title {
        display: flex;
        align-items: center;
        gap: 9px;
        min-height: 36px;
        margin: -2px 42px 12px 0;
        padding-bottom: 12px;
        color: var(--dashboard-v2-text);
        font-size: 14px;
        font-weight: 800;
        letter-spacing: 0;
        border-bottom: 1px solid var(--dashboard-v2-border);
    }

    body.dashboard-v2-enabled .dashboard-v2-popover .dashboard-v2-rail-toggle {
        position: absolute;
        top: 12px;
        right: 12px;
        z-index: 2;
        margin: 0;
        background: var(--dashboard-v2-panel-soft);
    }

    body.dashboard-v2-enabled .dashboard-v2-popover-title-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        color: var(--v2-accent);
        background: rgba(20, 184, 166, 0.12);
        border: 1px solid rgba(20, 184, 166, 0.2);
        border-radius: 999px;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover-title-icon .dashboard-v2-floating-icon {
        width: 15px;
        height: 15px;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover-empty-state {
        padding: 12px;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
        line-height: 1.45;
        text-align: center;
        background: rgba(15, 23, 42, 0.26);
        border: 1px dashed var(--dashboard-v2-border);
        border-radius: 12px;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-popover-empty-state {
        background: rgba(248, 250, 252, 0.82);
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section] {
        margin-bottom: 10px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section]::before {
        display: block;
        margin-bottom: 8px;
        color: var(--dashboard-v2-muted);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: 0;
        text-transform: uppercase;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section="profile-kpi"]::before {
        content: "Profile actions";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section="team-stats"]::before {
        content: "Team Stats";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section="leaderboard"]::before {
        content: "Weekly leaderboard";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section="absences"]::before {
        content: "Absences";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section="adjustments"]::before {
        content: "Adjustments";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover [data-dashboard-v2-section="deployments"]::before {
        content: "Deployments & Meetings";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover #stats-container,
    body.dashboard-v2-enabled .dashboard-v2-popover #leaderboard-container,
    body.dashboard-v2-enabled .dashboard-v2-popover #on-leave-notes,
    body.dashboard-v2-enabled .dashboard-v2-popover #schedule-adjustments,
    body.dashboard-v2-enabled .dashboard-v2-popover #deployment-notes-list {
        max-height: min(48vh, 390px);
        overflow-y: auto;
        padding-right: 2px;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section],
    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-deployments"] [data-dashboard-v2-section="deployments"] {
        padding: 12px !important;
        background: rgba(15, 23, 42, 0.3) !important;
        border: 1px solid var(--dashboard-v2-border) !important;
        border-radius: 14px !important;
        box-shadow: none !important;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section],
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-deployments"] [data-dashboard-v2-section="deployments"] {
        background: rgba(248, 250, 252, 0.88) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section="schedule-actions"] h3 {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section="schedule-actions"]::before {
        display: block;
        margin-bottom: 8px;
        color: var(--dashboard-v2-muted);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: 0;
        text-transform: uppercase;
        content: "Today's Schedule";
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section="schedule-actions"]::before {
        color: #93c5fd;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section="absences"]::before {
        color: #fbbf24;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section="adjustments"]::before {
        color: #c4b5fd;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-deployments"] [data-dashboard-v2-section="deployments"]::before {
        color: #5eead4;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] [data-dashboard-v2-section="schedule-actions"] .space-y-2 {
        display: grid;
        gap: 8px;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-schedule"] #schedule-btn,
    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-deployments"] [data-dashboard-v2-section="deployments"] button {
        min-height: 36px;
        border-radius: 10px !important;
        box-shadow: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-deployments"] #deployment-notes-list .schedule-action-btn {
        min-height: 28px;
        border-radius: 8px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-popover[data-dashboard-v2-active-panel="right-deployments"] [data-dashboard-v2-section="deployments"] .grid {
        gap: 8px !important;
        margin-bottom: 10px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover {
        position: fixed;
        top: var(--dashboard-v2-popover-top, 96px);
        z-index: 75;
        display: none;
        flex-direction: column;
        width: var(--dashboard-v2-drawer-width);
        min-width: 0;
        max-width: var(--dashboard-v2-drawer-width);
        max-height: min(70vh, 560px);
        color: var(--dashboard-v2-text);
        overflow: hidden;
        background:
            linear-gradient(180deg, rgba(31, 36, 43, 0.98), rgba(18, 22, 28, 0.97)),
            var(--v2-surface-elevated);
        border: 1px solid var(--v2-border);
        border-radius: 18px;
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(255, 255, 255, 0.03);
        backdrop-filter: blur(18px);
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover.is-open {
        display: flex;
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover[hidden] {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover.dashboard-v2-popover-left {
        left: calc(var(--dashboard-v2-dock-inset) + 60px);
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover.dashboard-v2-popover-right {
        right: calc(var(--dashboard-v2-dock-inset) + 60px);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-virtual-popover {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 250, 252, 0.98)),
            var(--v2-surface-elevated);
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(15, 23, 42, 0.03);
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 56px;
        padding: 14px 14px 12px;
        border-bottom: 1px solid var(--dashboard-v2-border);
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover-title-wrap {
        display: flex;
        align-items: center;
        min-width: 0;
        gap: 9px;
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover-title-wrap h2 {
        margin: 0;
        color: var(--dashboard-v2-text);
        font-size: 14px;
        font-weight: 800;
        letter-spacing: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover-close {
        width: 34px;
        min-width: 34px;
        height: 34px;
        min-height: 34px;
        padding: 0;
        background: var(--dashboard-v2-panel-soft);
    }

    body.dashboard-v2-enabled .dashboard-v2-virtual-popover-body {
        display: grid;
        gap: 10px;
        padding: 14px;
        overflow-y: auto;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-status-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 8px;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-status-row .dashboard-v2-shift-eyebrow {
        margin-bottom: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-status-pill {
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: 0 8px;
        color: var(--dashboard-v2-muted);
        font-size: 10.5px;
        font-weight: 850;
        white-space: nowrap;
        background: rgba(148, 163, 184, 0.12);
        border: 1px solid rgba(148, 163, 184, 0.18);
        border-radius: 999px;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-status-pill.dashboard-v2-shift-start {
        color: #bbf7d0;
        background: rgba(34, 197, 94, 0.12);
        border-color: rgba(34, 197, 94, 0.24);
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-status-pill.dashboard-v2-shift-end {
        color: #fecaca;
        background: rgba(239, 68, 68, 0.12);
        border-color: rgba(239, 68, 68, 0.24);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-shift-status-pill.dashboard-v2-shift-start {
        color: #166534;
        background: rgba(22, 163, 74, 0.1);
        border-color: rgba(22, 163, 74, 0.22);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-shift-status-pill.dashboard-v2-shift-end {
        color: #b91c1c;
        background: rgba(220, 38, 38, 0.09);
        border-color: rgba(220, 38, 38, 0.2);
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card-compact {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 10px 12px;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card-compact .dashboard-v2-shift-eyebrow,
    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card-compact strong {
        margin: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card,
    body.dashboard-v2-enabled .dashboard-v2-popover-empty {
        padding: 12px;
        background: rgba(15, 23, 42, 0.34);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 14px;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-shift-popover-card,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-popover-empty {
        background: rgba(248, 250, 252, 0.86);
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card-soft {
        background: rgba(20, 184, 166, 0.08);
        border-color: rgba(20, 184, 166, 0.18);
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-eyebrow {
        display: block;
        margin-bottom: 5px;
        color: var(--dashboard-v2-muted);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0;
        text-transform: uppercase;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card strong,
    body.dashboard-v2-enabled .dashboard-v2-popover-empty strong {
        display: block;
        margin-bottom: 4px;
        color: var(--dashboard-v2-text);
        font-size: 14px;
        font-weight: 800;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-popover-card p,
    body.dashboard-v2-enabled .dashboard-v2-popover-empty p {
        margin: 0;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
        line-height: 1.45;
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-action {
        width: 100%;
        min-height: 40px;
        color: #ffffff;
        font-size: 13px;
        font-weight: 800;
        background: linear-gradient(135deg, rgba(34, 197, 94, 0.86), rgba(20, 184, 166, 0.78));
        border-color: rgba(134, 239, 172, 0.34);
        box-shadow: 0 12px 26px rgba(20, 184, 166, 0.18);
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-action.dashboard-v2-shift-end {
        background: linear-gradient(135deg, rgba(220, 38, 38, 0.9), rgba(239, 68, 68, 0.78));
        border-color: rgba(252, 165, 165, 0.36);
        box-shadow: 0 12px 26px rgba(239, 68, 68, 0.2);
    }

    body.dashboard-v2-enabled .dashboard-v2-shift-action[disabled] {
        cursor: not-allowed;
        color: var(--dashboard-v2-muted);
        background: var(--dashboard-v2-panel-soft);
        border-color: var(--dashboard-v2-border);
        box-shadow: none;
        opacity: 0.8;
    }

    body.dashboard-v2-enabled.dashboard-v2-left-drawer-open #sidebar.dashboard-v2-left-rail {
        left: calc(var(--dashboard-v2-dock-inset) + 60px) !important;
        right: auto !important;
        border-right-width: 1px !important;
    }

    body.dashboard-v2-enabled.dashboard-v2-right-drawer-open #on-leave-sidebar.dashboard-v2-right-rail {
        right: calc(var(--dashboard-v2-dock-inset) + 60px) !important;
        left: auto !important;
        border-left-width: 1px !important;
    }
}

@media (min-width: 1024px) {
    body.dashboard-v2-enabled {
        --dashboard-v2-dock-gutter: clamp(96px, 8vw, 116px);
    }

    body.dashboard-v2-enabled.dashboard-v2-left-collapsed {
        --dashboard-v2-left-dock-gutter: var(--dashboard-v2-dock-gutter);
    }

    body.dashboard-v2-enabled.dashboard-v2-right-collapsed {
        --dashboard-v2-right-dock-gutter: var(--dashboard-v2-dock-gutter);
    }

    body.dashboard-v2-enabled .dashboard-v2-workspace {
        grid-template-columns: var(--dashboard-v2-left-width) minmax(0, 1fr) var(--dashboard-v2-right-width);
    }

    body.dashboard-v2-enabled #on-leave-sidebar.dashboard-v2-right-rail {
        position: relative !important;
        inset: auto !important;
        z-index: 20 !important;
        display: flex !important;
        width: var(--dashboard-v2-right-width) !important;
        min-width: 0 !important;
        max-width: var(--dashboard-v2-right-width) !important;
        height: auto !important;
        box-sizing: border-box;
        padding: 14px 12px !important;
        transform: none !important;
        border-left-width: 1px !important;
        overflow-x: hidden !important;
    }

    body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create {
        right: auto !important;
    }

    body.dashboard-v2-enabled.dashboard-v2-right-collapsed #on-leave-sidebar.dashboard-v2-right-rail {
        width: 0 !important;
        max-width: 0 !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
        border-left-width: 0 !important;
        overflow: hidden !important;
        pointer-events: none;
        visibility: hidden;
    }

    body.dashboard-v2-enabled.dashboard-v2-right-collapsed.dashboard-v2-right-drawer-open #on-leave-sidebar.dashboard-v2-right-rail {
        display: flex !important;
        width: var(--dashboard-v2-drawer-width) !important;
        max-width: var(--dashboard-v2-drawer-width) !important;
        padding: 14px !important;
        border-left-width: 1px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        pointer-events: auto;
        visibility: visible;
    }
}

@media (min-width: 1440px) {
    body.dashboard-v2-enabled {
        --dashboard-v2-left-width: 284px;
        --dashboard-v2-right-width: 312px;
        --dashboard-v2-drawer-width: min(460px, calc(100vw - 120px));
    }

    body.dashboard-v2-enabled.dashboard-v2-left-collapsed {
        --dashboard-v2-left-width: 0px;
    }

    body.dashboard-v2-enabled.dashboard-v2-right-collapsed {
        --dashboard-v2-right-width: 0px;
    }
}

@media (min-width: 768px) and (max-width: 1540px) {
    body.dashboard-v2-enabled {
        --dashboard-v2-dock-inset: 14px;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar .relative {
        flex-basis: 100%;
    }

    body.dashboard-v2-enabled #dashboard-v2-ticket-range-wrap {
        margin-left: 0;
    }

    body.dashboard-v2-enabled #ticket-count-display {
        margin-left: auto !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-quick-create-divider,
    body.dashboard-v2-enabled .dashboard-v2-quick-create .h-8.w-px {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-quick-create-subject,
    body.dashboard-v2-enabled #ticket-subject {
        order: -1;
        flex: 1 1 100% !important;
        min-width: 0 !important;
        max-width: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-quick-create-row {
        gap: 5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-quick-create-suggestion {
        flex-basis: 110px;
        max-width: 118px;
        min-height: 34px;
    }

    body.dashboard-v2-enabled .dashboard-v2-quick-create-source {
        min-width: 72px;
        min-height: 34px;
        padding: 0 8px !important;
        font-size: 11.5px !important;
    }

    body.dashboard-v2-enabled #assign-to {
        flex-basis: 118px;
        min-width: 106px;
        max-width: 132px;
    }

    body.dashboard-v2-enabled #ticket-priority {
        flex-basis: 90px;
        min-width: 86px;
        max-width: 100px;
    }

    body.dashboard-v2-enabled #ticket-tags {
        flex-basis: 102px;
        min-width: 94px;
        max-width: 108px;
    }

    body.dashboard-v2-enabled .dashboard-v2-quick-create-button {
        min-width: 88px;
        min-height: 36px;
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock-group {
        gap: 7px;
        padding: 6px;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-button {
        width: 42px;
        min-width: 42px;
        height: 42px;
        min-height: 42px;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-icon {
        width: 17px;
        height: 17px;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-expand {
        width: 36px;
        min-width: 36px;
        height: 36px;
        min-height: 36px;
    }

}

body.dashboard-v2-enabled .dashboard-v2-left-rail > [data-dashboard-v2-section="profile-actions"] {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-left-rail #stats-period,
body.dashboard-v2-enabled .dashboard-v2-left-rail #custom-days-input,
body.dashboard-v2-enabled .dashboard-v2-left-rail #dashboard-v2-team-stats-range-label {
    display: none !important;
}

body.dashboard-v2-enabled .dashboard-v2-kpi-workload-card {
    display: grid;
    gap: 7px;
    margin-bottom: 10px;
    padding: 12px;
    background: rgba(15, 23, 42, 0.42);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 12px;
}

body.dashboard-v2-enabled .dashboard-v2-kpi-workload-kicker {
    color: var(--dashboard-v2-muted);
    font-size: 11px;
    font-weight: 750;
}

body.dashboard-v2-enabled .dashboard-v2-kpi-workload-card strong {
    color: var(--dashboard-v2-text);
    font-size: 15px;
    font-weight: 900;
    line-height: 1.1;
}

body.dashboard-v2-enabled .dashboard-v2-kpi-workload-track {
    height: 7px;
    overflow: hidden;
    background: rgba(148, 163, 184, 0.18);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-v2-kpi-workload-track span {
    display: block;
    width: 0;
    height: 100%;
    background: linear-gradient(90deg, #22c55e, #06b6d4);
    border-radius: inherit;
    transition: width 180ms ease;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-kpi-workload-card {
    background: rgba(241, 245, 249, 0.82);
    border-color: rgba(71, 85, 105, 0.16);
}

@media (min-width: 768px) and (max-width: 1180px) {
    body.dashboard-v2-enabled .dashboard-v2-quick-create-meta,
    body.dashboard-v2-enabled #assign-to,
    body.dashboard-v2-enabled #ticket-priority,
    body.dashboard-v2-enabled #ticket-tags {
        flex: 1 1 124px;
        max-width: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-topline,
    body.dashboard-v2-enabled .dashboard-v2-ticket-footer-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-badges,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions,
    body.dashboard-v2-enabled .dashboard-v2-ticket-meta {
        justify-content: flex-start;
        justify-self: start;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions {
        opacity: 0.9;
    }
}

@media (max-width: 1023px) {
    body.dashboard-v2-enabled {
        --dashboard-v2-dock-gutter: 0px;
        --dashboard-v2-left-dock-gutter: 0px;
        --dashboard-v2-right-dock-gutter: 0px;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock,
    body.dashboard-v2-enabled .dashboard-v2-drawer-backdrop {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
        padding: 8px 10px;
        color: var(--dashboard-v2-text);
        background: var(--v2-surface);
        border-bottom: 1px solid var(--dashboard-v2-border);
    }

    .dashboard-v2-mobile-actions button {
        min-width: 0;
        min-height: 38px;
        padding: 0 8px;
        font-size: 12px;
        font-weight: 750;
        border-radius: 999px !important;
    }

    .dashboard-v2-mobile-result-count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 38px;
        padding: 0 10px;
        color: var(--dashboard-v2-muted);
        font-size: 11px;
        font-weight: 800;
        white-space: nowrap;
        background: rgba(148, 163, 184, 0.08);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 999px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-backdrop {
        position: fixed;
        inset: 0;
        z-index: 80;
        display: block;
        background: rgba(3, 7, 18, 0.36);
        border: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-backdrop[hidden] {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 81;
        display: flex;
        flex-direction: column;
        max-height: min(70vh, 520px);
        padding: 8px 14px 18px;
        color: var(--dashboard-v2-text);
        background: var(--v2-surface-elevated);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -18px 44px rgba(0, 0, 0, 0.28);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer[hidden] {
        display: none;
    }

    body.dashboard-v2-mobile-drawer-open {
        overflow: hidden;
    }

    .dashboard-v2-mobile-drawer-handle {
        align-self: center;
        width: 40px;
        height: 4px;
        margin: 2px 0 10px;
        background: var(--dashboard-v2-border);
        border-radius: 999px;
    }

    .dashboard-v2-mobile-drawer-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding-bottom: 10px;
        border-bottom: 1px solid var(--dashboard-v2-border);
    }

    .dashboard-v2-mobile-drawer-header h2 {
        margin: 0;
        font-size: 15px;
        font-weight: 800;
        letter-spacing: 0;
    }

    .dashboard-v2-mobile-drawer-close {
        min-height: 44px;
        padding: 0 14px;
        font-size: 12px;
        font-weight: 750;
    }

    .dashboard-v2-mobile-drawer-body {
        min-height: 140px;
        padding: 14px 0 0;
        overflow-y: auto;
    }

    .dashboard-v2-mobile-drawer-card {
        padding: 12px;
        color: var(--dashboard-v2-text);
        background: var(--dashboard-v2-panel-soft);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 8px;
    }

    .dashboard-v2-mobile-drawer-card strong {
        display: block;
        margin-bottom: 6px;
        font-size: 13px;
    }

    .dashboard-v2-mobile-drawer-card p {
        margin: 0;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
        line-height: 1.45;
    }

    .dashboard-v2-mobile-filter-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 10px;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
        font-weight: 800;
    }

    .dashboard-v2-mobile-clear-filters {
        min-height: 44px;
        padding: 0 14px;
        color: #fca5a5;
        font-size: 12px;
        font-weight: 800;
        background: rgba(239, 68, 68, 0.1);
        border: 1px solid rgba(248, 113, 113, 0.22);
        border-radius: 999px;
    }

    .dashboard-v2-mobile-filter-grid {
        display: grid;
        gap: 9px;
    }

    .dashboard-v2-mobile-filter-field {
        display: grid;
        gap: 5px;
        color: var(--dashboard-v2-muted);
        font-size: 11px;
        font-weight: 800;
    }

    .dashboard-v2-mobile-filter-field select {
        width: 100%;
        min-height: 44px;
        padding: 0 12px;
        color: var(--dashboard-v2-text);
        font-size: 13px;
        font-weight: 760;
        background: rgba(15, 23, 42, 0.48);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 12px;
    }

    html[data-theme="light"] .dashboard-v2-mobile-filter-field select {
        background: rgba(255, 255, 255, 0.88);
    }

    .dashboard-v2-mobile-active-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-top: 12px;
    }

    .dashboard-v2-mobile-active-filters p {
        margin: 0;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
    }

    body.dashboard-v2-enabled #dashboard-v2-mobile-actions > button {
        border-radius: 999px !important;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    body.dashboard-v2-enabled:not(.dashboard-v2-right-drawer-open) #on-leave-sidebar.dashboard-v2-right-rail {
        display: none !important;
        width: 0 !important;
        max-width: 0 !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
        overflow: hidden !important;
        transform: none !important;
        pointer-events: none !important;
        visibility: hidden !important;
    }
}

@media (max-width: 767px) {
    body.dashboard-v2-enabled {
        --dashboard-v2-page-gutter: 10px;
        --dashboard-v2-content-width: calc(100vw - 20px);
    }

    body.dashboard-v2-enabled #app-container.dashboard-v2-shell {
        min-width: 0;
        overflow-x: hidden;
    }

    body.dashboard-v2-enabled .dashboard-v2-workspace {
        min-width: 0;
        overflow-x: hidden;
    }

    body.dashboard-v2-enabled .dashboard-v2-main {
        padding-bottom: 300px !important;
    }

    body.dashboard-v2-enabled #badges-header.dashboard-v2-badge-strip {
        display: block !important;
        width: 100%;
        max-width: var(--dashboard-v2-content-width) !important;
        margin-bottom: 6px;
        overflow: hidden;
    }

    body.dashboard-v2-enabled #badges-header.dashboard-v2-badge-strip::before {
        margin-bottom: 3px;
        font-size: 8.5px;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-strip-inner {
        padding: 5px !important;
        border-radius: 13px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-track {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 5px !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        padding-bottom: 0 !important;
        scroll-snap-type: x proximity;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-card {
        flex: 0 0 150px !important;
        min-height: 46px !important;
        padding: 5px 6px !important;
        gap: 6px !important;
        scroll-snap-align: start;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-icon {
        width: 26px;
        height: 26px;
        font-size: 13px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-name {
        font-size: 10px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-badge-count {
        min-width: 21px !important;
        height: 20px;
        padding: 0 6px;
        font-size: 10.5px !important;
    }

    body.dashboard-v2-enabled #ticket-list,
    body.dashboard-v2-enabled #done-ticket-list,
    body.dashboard-v2-enabled #follow-up-ticket-list {
        gap: 8px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card {
        min-height: 0;
        padding: 10px !important;
        border-radius: 12px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body:not(.hidden)) {
        padding: 12px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-head {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 9px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-avatar img,
    body.dashboard-v2-enabled .dashboard-v2-ticket-avatar > div {
        width: 34px !important;
        height: 34px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-topline,
    body.dashboard-v2-enabled .dashboard-v2-ticket-footer-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-badges {
        justify-content: flex-start;
        max-width: 100%;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-badge {
        min-height: 20px;
        padding: 0 6px !important;
        font-size: 9.5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-title {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-email-line {
        width: 100%;
        border-radius: 10px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-address {
        max-width: 100%;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions {
        width: 100%;
        justify-content: flex-start;
        justify-self: stretch;
        border-radius: 14px;
        opacity: 1;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-meta {
        justify-content: flex-start;
        font-size: 10px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action) {
        width: 30px;
        min-width: 30px;
        height: 30px;
        min-height: 30px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action {
        min-width: 84px;
        min-height: 30px;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar .relative {
        grid-column: 1 / -1;
        width: 100%;
        margin-left: 0 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar select,
    body.dashboard-v2-enabled #dashboard-v2-ticket-range-wrap,
    body.dashboard-v2-enabled #ticket-count-display,
    body.dashboard-v2-enabled .dashboard-v2-clear-filters,
    body.dashboard-v2-enabled #export-btn {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-active-filters {
        display: none !important;
    }

    body.dashboard-v2-enabled #ticket-count-display {
        justify-content: center;
        text-align: center;
    }

    body.dashboard-v2-enabled #search-input {
        height: 40px;
        padding-right: 74px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-search-shortcut {
        right: 10px;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-dock,
    body.dashboard-v2-enabled .dashboard-v2-drawer-backdrop {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        padding: 8px 10px;
        color: var(--dashboard-v2-text);
        background: var(--v2-surface);
        border-bottom: 1px solid var(--dashboard-v2-border);
    }

    .dashboard-v2-mobile-actions button {
        min-width: 0;
        min-height: 38px;
        padding: 0 8px;
        font-size: 12px;
        font-weight: 750;
        border-radius: 999px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-backdrop {
        position: fixed;
        inset: 0;
        z-index: 80;
        display: block;
        background: rgba(3, 7, 18, 0.36);
        border: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-backdrop[hidden] {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 81;
        display: flex;
        flex-direction: column;
        max-height: min(70vh, 520px);
        padding: 8px 14px 18px;
        color: var(--dashboard-v2-text);
        background: var(--v2-surface-elevated);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -18px 44px rgba(0, 0, 0, 0.28);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer[hidden] {
        display: none;
    }

    body.dashboard-v2-mobile-drawer-open {
        overflow: hidden;
    }

    .dashboard-v2-mobile-drawer-handle {
        align-self: center;
        width: 40px;
        height: 4px;
        margin: 2px 0 10px;
        background: var(--dashboard-v2-border);
        border-radius: 999px;
    }

    .dashboard-v2-mobile-drawer-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding-bottom: 10px;
        border-bottom: 1px solid var(--dashboard-v2-border);
    }

    .dashboard-v2-mobile-drawer-header h2 {
        margin: 0;
        font-size: 15px;
        font-weight: 800;
        letter-spacing: 0;
    }

    .dashboard-v2-mobile-drawer-close {
        min-height: 34px;
        padding: 0 10px;
        font-size: 12px;
        font-weight: 750;
    }

    .dashboard-v2-mobile-drawer-body {
        min-height: 140px;
        padding: 14px 0 0;
        overflow-y: auto;
    }

    .dashboard-v2-mobile-drawer-card {
        padding: 12px;
        color: var(--dashboard-v2-text);
        background: var(--dashboard-v2-panel-soft);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 8px;
    }

    .dashboard-v2-mobile-drawer-card strong {
        display: block;
        margin-bottom: 6px;
        font-size: 13px;
    }

    .dashboard-v2-mobile-drawer-card p {
        margin: 0;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
        line-height: 1.45;
    }

    body.dashboard-v2-enabled #dashboard-v2-mobile-actions > button {
        border-radius: 999px !important;
    }

    body.dashboard-v2-enabled #tickets-footer.dashboard-v2-quick-create {
        display: none !important;
        right: 0 !important;
        left: 0 !important;
    }

    body.dashboard-v2-enabled #mobile-fab.dashboard-v2-mobile-create-trigger {
        display: flex !important;
        position: fixed;
        align-items: center;
        justify-content: center;
        width: 54px;
        height: 54px;
        right: 16px;
        bottom: calc(68px + env(safe-area-inset-bottom, 0px));
        background:
            radial-gradient(circle at 30% 20%, rgba(125, 211, 252, 0.28), transparent 54%),
            linear-gradient(135deg, #6366f1, #2563eb) !important;
        border: 1px solid rgba(191, 219, 254, 0.34);
        box-shadow: 0 18px 36px rgba(37, 99, 235, 0.34);
    }

    body.dashboard-v2-enabled:has(#app-container.hidden) #mobile-fab.dashboard-v2-mobile-create-trigger {
        display: none !important;
        pointer-events: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet {
        color: var(--dashboard-v2-text);
        background:
            linear-gradient(135deg, rgba(20, 184, 166, 0.07), transparent 40%),
            linear-gradient(180deg, rgba(24, 28, 35, 0.98), rgba(15, 18, 23, 0.98)) !important;
        border: 1px solid rgba(148, 163, 184, 0.16);
        border-bottom: 0;
        box-shadow: 0 -24px 54px rgba(0, 0, 0, 0.34);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-sheet-header {
        padding-bottom: 10px;
        border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-sheet-header h3 {
        font-size: 17px;
        letter-spacing: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-body {
        gap: 10px !important;
        padding-top: 12px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-field-label {
        margin-bottom: 5px;
        color: var(--dashboard-v2-muted);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: 0;
        text-transform: uppercase;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-source-row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-source-btn,
    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-input,
    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-select {
        color: var(--dashboard-v2-text);
        background: rgba(15, 23, 42, 0.48);
        border: 1px solid rgba(148, 163, 184, 0.16);
        border-radius: 13px;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-source-btn {
        font-size: 13px;
        font-weight: 850;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-source-btn.selected {
        color: #e0f2fe;
        background: linear-gradient(135deg, rgba(14, 165, 233, 0.28), rgba(59, 130, 246, 0.18));
        border-color: rgba(125, 211, 252, 0.44);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-input:focus,
    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-select:focus {
        border-color: rgba(20, 184, 166, 0.45);
        box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.13);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-tags-row {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-tag-btn {
        min-height: 34px;
        padding: 0 10px;
        color: var(--dashboard-v2-muted);
        font-size: 12px;
        font-weight: 800;
        background: rgba(148, 163, 184, 0.08);
        border: 1px solid rgba(148, 163, 184, 0.16);
        border-radius: 999px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-tag-btn.selected {
        color: #ccfbf1;
        background: rgba(20, 184, 166, 0.16);
        border-color: rgba(45, 212, 191, 0.36);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet #mobile-next-up-badge {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        border-radius: 999px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-create-submit {
        min-height: 44px;
        margin-top: 2px;
        color: #fff;
        font-size: 14px;
        font-weight: 900;
        background: linear-gradient(135deg, #6366f1, #2563eb) !important;
        border: 1px solid rgba(191, 219, 254, 0.28);
        border-radius: 999px !important;
        box-shadow: 0 14px 30px rgba(37, 99, 235, 0.25);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet {
        background:
            linear-gradient(135deg, rgba(13, 148, 136, 0.06), transparent 42%),
            rgba(255, 255, 255, 0.98) !important;
        border-color: rgba(71, 85, 105, 0.16);
        box-shadow: 0 -22px 48px rgba(15, 23, 42, 0.12);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-source-btn,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-input,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-select {
        color: #111827;
        background: rgba(255, 255, 255, 0.94);
        border-color: rgba(71, 85, 105, 0.18);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-create-sheet .mobile-source-btn.selected {
        color: #0f172a;
        background: linear-gradient(135deg, rgba(224, 242, 254, 0.96), rgba(219, 234, 254, 0.92));
        border-color: rgba(37, 99, 235, 0.34);
    }
}

/*
 * Dashboard V2 Team Recognition strip.
 *
 * Product update (2026-05-21): badges return above the ticket queue on desktop,
 * matching the older ticket-first workflow. Mobile keeps the ticket-first compact
 * layout and leaves badge detail to the Scores surfaces.
 */
@media (min-width: 768px) {
    body.dashboard-v2-enabled #badges-header.dashboard-v2-badge-strip,
    body.dashboard-v2-enabled #badges-header {
        display: block !important;
    }
}

@media (max-width: 767px) {
    body.dashboard-v2-enabled #badges-header.dashboard-v2-badge-strip,
    body.dashboard-v2-enabled #badges-header {
        display: none !important;
    }
}

@media (max-width: 767px) {
    body.dashboard-v2-enabled .dashboard-v2-main {
        padding: 4px 6px calc(104px + env(safe-area-inset-bottom, 0px)) !important;
    }

    body.dashboard-v2-enabled #mobile-subtabs.dashboard-v2-mobile-tabs {
        display: flex !important;
        gap: 3px;
        padding: 2px 6px !important;
        overflow-x: auto;
        overflow-y: hidden;
        background: rgba(15, 18, 23, 0.94);
        border-bottom: 1px solid var(--dashboard-v2-border);
        scrollbar-width: none;
    }

    body.dashboard-v2-enabled #mobile-subtabs.dashboard-v2-mobile-tabs::-webkit-scrollbar {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-tabs .mobile-subtab-btn {
        min-height: 20px;
        padding: 0 7px !important;
        font-size: 10px !important;
        font-weight: 800;
        border-radius: 999px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar {
        padding: 3px 6px !important;
        border-bottom-color: var(--dashboard-v2-border) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl,
    body.dashboard-v2-enabled .dashboard-v2-command-bar .dashboard-v2-command-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center;
        gap: 5px !important;
        max-width: 100% !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar .relative,
    body.dashboard-v2-enabled .dashboard-v2-search-wrap {
        flex: 1 1 auto !important;
        grid-column: auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
    }

    body.dashboard-v2-enabled #search-input {
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 48px 0 38px !important;
        font-size: 12px !important;
        border-radius: 999px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-search-shortcut {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-clear-search {
        right: 5px;
        width: 44px;
        min-width: 44px;
        height: 44px;
        min-height: 44px;
        font-size: 11px;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar select,
    body.dashboard-v2-enabled #dashboard-v2-ticket-range-wrap,
    body.dashboard-v2-enabled #ticket-count-display,
    body.dashboard-v2-enabled .dashboard-v2-clear-filters,
    body.dashboard-v2-enabled .dashboard-v2-active-filters,
    body.dashboard-v2-enabled #export-btn {
        display: none !important;
    }

    body.dashboard-v2-enabled #dashboard-v2-mobile-actions.dashboard-v2-mobile-actions {
        display: inline-flex !important;
        flex: 0 0 auto;
        align-items: center;
        gap: 5px;
        min-width: 0;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
    }

    body.dashboard-v2-enabled #dashboard-v2-mobile-actions > button {
        min-height: 44px !important;
        padding: 0 14px !important;
        color: var(--dashboard-v2-text);
        font-size: 11px !important;
        font-weight: 900;
        background: rgba(20, 184, 166, 0.14);
        border: 1px solid rgba(20, 184, 166, 0.28);
        border-radius: 999px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-result-count {
        min-width: 34px;
        min-height: 44px;
        padding: 0 8px;
        color: var(--dashboard-v2-text);
        font-size: 11px;
        font-weight: 900;
        background: rgba(148, 163, 184, 0.1);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 999px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-backdrop {
        background: rgba(3, 7, 18, 0.26);
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer {
        max-height: min(76vh, 560px);
        padding: 6px 12px 14px;
        border-radius: 18px 18px 0 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer-body {
        min-height: 0;
        padding-top: 10px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-filter-grid {
        gap: 7px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-filter-field select {
        min-height: 44px;
        font-size: 12px;
        border-radius: 11px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-filter-footer {
        display: flex;
        justify-content: flex-end;
        margin-top: 12px;
    }

    body.dashboard-v2-enabled .dashboard-v2-mobile-apply-filters {
        min-height: 44px;
        padding: 0 16px;
        color: #ffffff;
        font-size: 12px;
        font-weight: 900;
        background: linear-gradient(135deg, #14b8a6, #2563eb);
        border: 1px solid rgba(191, 219, 254, 0.28);
        border-radius: 999px;
    }

    body.dashboard-v2-enabled #ticket-list,
    body.dashboard-v2-enabled #done-ticket-list,
    body.dashboard-v2-enabled #follow-up-ticket-list {
        gap: 7px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card {
        padding: 9px !important;
    }

    body.dashboard-v2-enabled .ticket-super-urgent-card {
        box-shadow: 0 10px 24px rgba(127, 29, 29, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
    }

    body.dashboard-v2-enabled .ticket-super-urgent-chip {
        height: 18px;
        padding: 0 6px;
        font-size: 9px;
    }

    body.dashboard-v2-enabled .ticket-super-urgent-banner {
        flex-direction: row;
        gap: 5px;
        min-height: 28px;
        padding: 4px 8px;
        border-radius: 8px;
        text-align: left;
    }

    body.dashboard-v2-enabled .ticket-super-urgent-banner-word {
        font-size: 10.5px;
        line-height: 1;
    }

    body.dashboard-v2-enabled .ticket-super-urgent-banner-word::after {
        content: "·";
        margin-left: 5px;
        color: rgba(254, 226, 226, 0.72);
    }

    body.dashboard-v2-enabled .ticket-super-urgent-banner-meta {
        font-size: 9.5px;
        line-height: 1;
    }

    body.dashboard-v2-enabled .ticket-super-urgent-detail-banner {
        align-items: flex-start;
        gap: 8px;
        padding: 9px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-head {
        gap: 8px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-primary,
    body.dashboard-v2-enabled .dashboard-v2-ticket-topline,
    body.dashboard-v2-enabled .dashboard-v2-ticket-footer,
    body.dashboard-v2-enabled .dashboard-v2-ticket-footer-grid {
        width: 100%;
    }

    body.dashboard-v2-enabled[data-device="mobile"] .ticket-card.dashboard-v2-ticket-card > .dashboard-v2-ticket-footer.mt-3.pt-3.border-t,
    html[data-predetect="mobile"] body.dashboard-v2-enabled .ticket-card.dashboard-v2-ticket-card > .dashboard-v2-ticket-footer.mt-3.pt-3.border-t {
        display: block !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-topline {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 4px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-identity,
    body.dashboard-v2-enabled .dashboard-v2-ticket-badges {
        width: 100%;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-shrink: 1 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-badges {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        gap: 3px !important;
        overflow: visible !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-badge {
        max-width: 100%;
    }

    /*
     * Mobile ticket footer.
     * Keep the updated/opened dates together, then let actions sit on their own
     * compact line so the metadata does not wrap beside the icon cluster.
     */
    body.dashboard-v2-enabled .dashboard-v2-ticket-footer-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 5px 6px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-meta {
        width: 100%;
        justify-content: flex-start;
        grid-column: 1 / 2;
        gap: 4px 6px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-meta .ticket-time-primary {
        max-width: 100%;
        gap: 4px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-meta .ticket-status-change-info,
    body.dashboard-v2-enabled .dashboard-v2-ticket-meta .status-change-info {
        flex-basis: 100%;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions,
    body.dashboard-v2-enabled .ticket-card-actions {
        position: relative;
        z-index: 5;
        width: auto !important;
        max-width: 100% !important;
        gap: 3px !important;
        justify-content: flex-start !important;
        justify-self: end;
        grid-column: 2 / 3;
        flex-wrap: nowrap !important;
        padding: 3px !important;
        overflow: visible !important;
        pointer-events: auto !important;
    }

    body.dashboard-v2-enabled .ticket-card.dashboard-v2-ticket-card.dashboard-v2-ticket-card-action-menu-open {
        position: relative !important;
        z-index: 120 !important;
        overflow: visible !important;
        contain: none !important;
        content-visibility: visible !important;
        /* Any of these on the card makes it the containing block for the
           position:fixed action sheet (in dark mode the card keeps a
           backdrop-filter; light mode resets it — which is why the sheet only
           broke in dark). Neutralize them all while the menu is open so the
           sheet anchors to the viewport in both themes. */
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        transform: none !important;
        filter: none !important;
        perspective: none !important;
        will-change: auto !important;
    }

    body.dashboard-v2-enabled #ticket-list.dashboard-v2-ticket-list-menu-open,
    body.dashboard-v2-enabled #done-ticket-list.dashboard-v2-ticket-list-menu-open,
    body.dashboard-v2-enabled #follow-up-ticket-list.dashboard-v2-ticket-list-menu-open {
        position: relative !important;
        z-index: 80 !important;
        overflow: visible !important;
        contain: none !important;
        content-visibility: visible !important;
    }

    body.dashboard-v2-enabled .ticket-card.dashboard-v2-ticket-card.dashboard-v2-ticket-card-action-menu-open .dashboard-v2-ticket-footer,
    body.dashboard-v2-enabled .ticket-card.dashboard-v2-ticket-card.dashboard-v2-ticket-card-action-menu-open .dashboard-v2-ticket-footer-grid,
    body.dashboard-v2-enabled .ticket-card.dashboard-v2-ticket-card.dashboard-v2-ticket-card-action-menu-open .dashboard-v2-ticket-actions,
    body.dashboard-v2-enabled .ticket-card.dashboard-v2-ticket-card.dashboard-v2-ticket-card-action-menu-open .ticket-card-actions {
        overflow: visible !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions {
        grid-column: 1 / -1;
        width: 100%;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions.dashboard-v2-ticket-state-actions-empty {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > button.dashboard-v2-ticket-action,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > label.dashboard-v2-ticket-action,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > .kb-button,
    body.dashboard-v2-enabled .ticket-card-actions > .ticket-card-secondary-action,
    body.dashboard-v2-enabled .ticket-card-actions > .kb-button,
    body.dashboard-v2-enabled .ticket-card-actions > label[for^="add-attachment-"],
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > .w-px,
    body.dashboard-v2-enabled .ticket-card-actions > .w-px {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > button.dashboard-v2-ticket-assign-action,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > button[onclick*="tickets.assignToMe"],
    body.dashboard-v2-enabled .ticket-card-actions > .ticket-card-assign-action,
    body.dashboard-v2-enabled .ticket-card-actions > button[onclick*="tickets.assignToMe"] {
        display: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action:not(.dashboard-v2-ticket-kb-action),
    body.dashboard-v2-enabled .ticket-card-actions > .ticket-card-assign-action {
        width: 0;
        min-width: 0;
        height: 0;
        min-height: 0;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions svg,
    body.dashboard-v2-enabled .ticket-card-actions svg {
        width: 14px;
        height: 14px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions {
        gap: 5px !important;
        padding: 3px 5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions button,
    body.dashboard-v2-enabled .dashboard-v2-ticket-state-chip {
        min-height: 44px;
        padding: 0 10px !important;
        font-size: 10.5px !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action {
        position: relative;
        min-width: 44px;
        min-height: 44px;
        padding: 0 8px !important;
        color: #bfdbfe !important;
        font-size: 0 !important;
        background: rgba(59, 130, 246, 0.16) !important;
        border: 1px solid rgba(96, 165, 250, 0.34) !important;
        overflow: visible !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu,
    body.dashboard-v2-enabled .ticket-card-mobile-menu {
        position: relative;
        z-index: 15;
        display: inline-flex !important;
        flex: 0 0 32px;
        order: 1 !important;
        width: 32px;
        min-width: 32px;
        height: 32px;
        min-height: 32px;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        touch-action: manipulation;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu[data-open="true"] {
        z-index: 150 !important;
    }

    body.dashboard-v2-enabled .ticket-card-actions > .ticket-card-assign-action,
    body.dashboard-v2-enabled .ticket-card-actions > button[onclick*="tickets.assignToMe"],
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > .dashboard-v2-ticket-assign-action,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions > button[onclick*="tickets.assignToMe"] {
        order: 1 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-trigger,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-trigger {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        min-width: 32px;
        height: 32px;
        min-height: 32px;
        padding: 0 !important;
        color: var(--dashboard-v2-muted);
        cursor: pointer;
        list-style: none;
        background: rgba(148, 163, 184, 0.055);
        border: 1px solid rgba(148, 163, 184, 0.12);
        border-radius: 10px;
        pointer-events: auto !important;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-trigger::-webkit-details-marker,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-trigger::-webkit-details-marker {
        display: none;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-trigger svg,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-trigger svg {
        width: 11px;
        height: 11px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-trigger:active,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-trigger:active {
        transform: scale(0.96);
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-trigger:focus-visible,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-trigger:focus-visible,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-item:focus-visible {
        outline: 2px solid rgba(129, 140, 248, 0.85);
        outline-offset: 2px;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu[open] .dashboard-v2-ticket-action-menu-trigger,
    body.dashboard-v2-enabled .ticket-card-mobile-menu[data-open="true"] .ticket-card-mobile-menu-trigger {
        color: #dbeafe;
        background: rgba(59, 130, 246, 0.18);
        border-color: rgba(96, 165, 250, 0.32);
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-panel,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel {
        position: fixed;
        right: 10px;
        left: 10px;
        top: auto;
        bottom: calc(58px + env(safe-area-inset-bottom, 0px));
        z-index: 160;
        display: none;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: min(66dvh, 360px);
        padding: 10px;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        transform: translateZ(0);
        background: rgba(15, 18, 23, 0.98);
        border: 1px solid var(--dashboard-v2-border);
        border-radius: 18px 18px 14px 14px;
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.42);
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu:not([open]) > .dashboard-v2-ticket-action-menu-panel,
    body.dashboard-v2-enabled .ticket-card-mobile-menu:not([data-open="true"]) > .ticket-card-mobile-menu-panel {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu:not([open]) > .dashboard-v2-ticket-action-menu-panel .dashboard-v2-ticket-action,
    body.dashboard-v2-enabled .ticket-card-mobile-menu:not([data-open="true"]) > .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-item {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        pointer-events: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu[open] .dashboard-v2-ticket-action-menu-panel,
    body.dashboard-v2-enabled .ticket-card-mobile-menu[data-open="true"] .ticket-card-mobile-menu-panel {
        display: grid;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu[data-open="true"]::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: 158;
        background: rgba(2, 6, 23, 0.34);
        pointer-events: none;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu-heading {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 24px;
        padding: 0 2px 5px;
        color: var(--dashboard-v2-text);
        border-bottom: 1px solid rgba(148, 163, 184, 0.14);
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu-heading span {
        font-size: 12px;
        font-weight: 900;
        letter-spacing: 0;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu-heading small {
        min-width: 0;
        overflow: hidden;
        color: var(--dashboard-v2-muted);
        font-size: 10px;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-panel .dashboard-v2-ticket-action,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-item {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 8px !important;
        color: var(--dashboard-v2-text) !important;
        font-size: 10.5px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        text-align: center;
        white-space: nowrap;
        pointer-events: auto !important;
        background: rgba(148, 163, 184, 0.08) !important;
        border: 1px solid rgba(148, 163, 184, 0.08) !important;
        border-radius: 11px !important;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-item-danger {
        color: #fca5a5 !important;
        background: rgba(239, 68, 68, 0.1) !important;
        border-color: rgba(248, 113, 113, 0.22) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-panel .dashboard-v2-ticket-kb-action,
    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .kb-button {
        min-width: 0 !important;
        padding: 0 8px !important;
        font-size: 10.5px !important;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-label {
        display: inline-flex;
        align-items: center;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        justify-content: center;
    }

    /*
     * Use a literal "KB" string so the chip is never blank even if the V2 enhancer
     * has not yet annotated the button (e.g., a realtime insert paints before the
     * MutationObserver fires). The data-dashboard-v2-kb-label attribute is still set
     * by js/dashboard-v2.js for desktop aria/title purposes, but the mobile chip
     * label is now guaranteed by CSS alone.
     */
    body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action::after {
        content: "KB";
        color: inherit;
        font-size: 10px;
        font-weight: 900;
        line-height: 1;
        letter-spacing: 0;
        white-space: nowrap;
    }

    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .kb-button::after {
        content: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-actions:empty {
        display: none !important;
    }

    /*
     * Real-data overflow guards (May 2026 authenticated-QA fix pass).
     * Long ticket titles, long tag names, very long customer email addresses, and
     * long state-chip text can push the card past viewport width if any flex/grid
     * child forgets to allow shrinking. These min-width:0 fallbacks ensure children
     * can shrink so the parent stays inside the card and the card stays inside the
     * viewport. Defensive only - no functional change.
     */
    body.dashboard-v2-enabled .dashboard-v2-ticket-card,
    body.dashboard-v2-enabled .dashboard-v2-ticket-head,
    body.dashboard-v2-enabled .dashboard-v2-ticket-primary,
    body.dashboard-v2-enabled .dashboard-v2-ticket-topline,
    body.dashboard-v2-enabled .dashboard-v2-ticket-identity,
    body.dashboard-v2-enabled .dashboard-v2-ticket-title-row,
    body.dashboard-v2-enabled .dashboard-v2-ticket-meta,
    body.dashboard-v2-enabled .dashboard-v2-ticket-footer-grid,
    body.dashboard-v2-enabled .dashboard-v2-ticket-state-actions,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions,
    body.dashboard-v2-enabled .ticket-card-actions {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-title,
    body.dashboard-v2-enabled .dashboard-v2-ticket-email-line,
    body.dashboard-v2-enabled .dashboard-v2-ticket-email-line .email-customer-address {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-tags {
        max-width: 100%;
        overflow: hidden;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-kb-action {
        color: #1d4ed8 !important;
        background: #eff6ff !important;
        border-color: #bfdbfe !important;
    }

    body.dashboard-v2-enabled #mobile-fab.dashboard-v2-mobile-create-trigger {
        width: 50px;
        height: 50px;
        right: 14px;
        bottom: calc(62px + env(safe-area-inset-bottom, 0px));
    }

    body.dashboard-v2-enabled #ticket-list,
    body.dashboard-v2-enabled #done-ticket-list,
    body.dashboard-v2-enabled #follow-up-ticket-list {
        padding-bottom: calc(132px + env(safe-area-inset-bottom, 0px)) !important;
    }

    body.dashboard-v2-enabled:has(.ticket-card-mobile-menu[data-open="true"]) #mobile-fab.dashboard-v2-mobile-create-trigger,
    body.dashboard-v2-enabled:has(.ticket-card-mobile-menu[data-open="true"]) .tc-chat-launcher,
    body.dashboard-v2-enabled:has(.ticket-card-mobile-menu[data-open="true"]) .tc-chat-tip {
        display: none !important;
        pointer-events: none !important;
    }

    body.dashboard-v2-enabled #notification-center {
        top: auto !important;
        right: 10px !important;
        bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important;
        left: 10px !important;
        width: auto !important;
        max-height: min(72vh, 560px) !important;
        border-radius: 18px !important;
        overflow: hidden !important;
        transform-origin: center bottom;
    }

    body.dashboard-v2-enabled #notification-center::before {
        display: none;
    }

    html[data-theme="light"] body.dashboard-v2-enabled #mobile-subtabs.dashboard-v2-mobile-tabs,
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-command-bar {
        background: rgba(255, 255, 255, 0.96) !important;
    }

    html[data-theme="light"] body.dashboard-v2-enabled #dashboard-v2-mobile-actions > button {
        color: #0f766e;
        background: rgba(13, 148, 136, 0.08);
        border-color: rgba(13, 148, 136, 0.22);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-result-count {
        color: #0f172a;
        background: rgba(15, 23, 42, 0.055);
        border-color: rgba(71, 85, 105, 0.14);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-trigger,
    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card-mobile-menu-trigger {
        color: #475569;
        background: rgba(241, 245, 249, 0.94);
        border-color: rgba(71, 85, 105, 0.18);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu[open] .dashboard-v2-ticket-action-menu-trigger,
    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card-mobile-menu[data-open="true"] .ticket-card-mobile-menu-trigger {
        color: #1d4ed8;
        background: #eff6ff;
        border-color: #bfdbfe;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-panel,
    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card-mobile-menu-panel {
        background: rgba(255, 255, 255, 0.98);
        border-color: rgba(71, 85, 105, 0.18);
        box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card-mobile-menu-heading {
        color: #0f172a;
        border-bottom-color: rgba(71, 85, 105, 0.16);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-action-menu-panel .dashboard-v2-ticket-action,
    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-item {
        background: rgba(241, 245, 249, 0.9) !important;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card-mobile-menu-panel .ticket-card-mobile-menu-item-danger {
        color: #b91c1c !important;
        background: #fef2f2 !important;
        border-color: #fecaca !important;
    }
}

/*
 * Hard mobile action fallback.
 *
 * Diagnostics showed the ticket DOM is correct on phone: .ticket-card-actions is
 * present and contains .ticket-card-mobile-menu. If any older mobile strip rule
 * still wins, force the direct secondary controls out of layout here and leave
 * only assign + the compact menu.
 */
@media (max-width: 767px) {
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions {
        display: inline-flex !important;
        width: auto !important;
        max-width: 40px !important;
        flex: 0 0 auto !important;
        position: relative !important;
        z-index: 15 !important;
        justify-content: flex-end !important;
        justify-self: end !important;
        grid-column: 2 / 3 !important;
        gap: 4px !important;
        padding: 0 !important;
        overflow: visible !important;
        pointer-events: auto !important;
        background: transparent !important;
        border: 0 !important;
    }

    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .ticket-card-secondary-action,
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .dashboard-v2-ticket-action:not(.ticket-card-assign-action),
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .dashboard-v2-ticket-kb-action,
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .kb-button,
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > label[for^="add-attachment-"],
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .ticket-card-assign-action,
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > button[onclick*="tickets.assignToMe"],
    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .w-px {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
        pointer-events: none !important;
    }

    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .ticket-card-mobile-menu {
        display: inline-flex !important;
        flex: 0 0 32px !important;
        order: 1 !important;
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .ticket-card-mobile-menu > .ticket-card-mobile-menu-trigger {
        position: relative !important;
        z-index: 20 !important;
        display: inline-flex !important;
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #cbd5e1 !important;
        background: rgba(148, 163, 184, 0.08) !important;
        border-color: rgba(148, 163, 184, 0.18) !important;
        border-radius: 10px !important;
        pointer-events: auto !important;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .ticket-card-mobile-menu > .ticket-card-mobile-menu-trigger {
        color: #334155 !important;
        background: #f8fafc !important;
        background-color: #f8fafc !important;
        background-image: none !important;
        border-color: #cbd5e1 !important;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06) !important;
    }

    html[data-theme="light"] body.dashboard-v2-enabled .ticket-card .ticket-card-actions.dashboard-v2-ticket-actions > .ticket-card-mobile-menu[data-open="true"] > .ticket-card-mobile-menu-trigger {
        color: #0f766e !important;
        background: #ccfbf1 !important;
        background-color: #ccfbf1 !important;
        background-image: none !important;
        border-color: rgba(13, 148, 136, 0.34) !important;
    }
}

/*
 * Dashboard V2 light-mode polish pass (May 2026 Claude-review follow-up).
 *
 * Goals:
 *   - Softer, anchored card shadows that read on a near-white page.
 *   - Stronger focus rings so keyboard users can see where they are.
 *   - Empty-state surfaces sit on pure white so the dashed border reads cleanly.
 *   - Source/quick-create selected chips have enough contrast against unselected.
 *   - Mobile result-count and search hint pills are legible against white inputs.
 *   - The desktop dock click-away backdrop has just enough opacity to read as a layer
 *     without darkening the page.
 *
 * Scoped strictly to html[data-theme="light"] body.dashboard-v2-enabled, so dark mode
 * is untouched and V1 is unaffected.
 */
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card {
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.06),
        0 8px 22px rgba(15, 23, 42, 0.06) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card:hover,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card:focus-within,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-ticket-card:has(.ticket-body:not(.hidden)) {
    box-shadow:
        0 2px 4px rgba(15, 23, 42, 0.06),
        0 12px 28px rgba(15, 23, 42, 0.09) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-popover-empty-state,
html[data-theme="light"] body.dashboard-v2-enabled #notif-list:empty::before,
html[data-theme="light"] body.dashboard-v2-enabled #on-leave-notes > p,
html[data-theme="light"] body.dashboard-v2-enabled #schedule-adjustments > p,
html[data-theme="light"] body.dashboard-v2-enabled #deployment-notes-list > p,
html[data-theme="light"] body.dashboard-v2-enabled #leaderboard-container > p,
html[data-theme="light"] body.dashboard-v2-enabled #stats-container > p,
html[data-theme="light"] body.dashboard-v2-enabled #stats-container > .col-span-full {
    background: #ffffff !important;
    border: 1px dashed #cbd5e1 !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-icon-button:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-theme-toggle:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-primary:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-button:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-rail-toggle:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-virtual-popover-close:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-drawer-close:focus-visible,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-filter-chip:focus-visible {
    outline: 2px solid rgba(13, 148, 136, 0.48) !important;
    outline-offset: 2px !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-source-id="outlook"][data-selected="true"] {
    color: #1e3a8a !important;
    background: linear-gradient(135deg, #dbeafe, #bfdbfe) !important;
    border-color: rgba(59, 130, 246, 0.42) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-quick-create-source[data-source-id="teams"][data-selected="true"] {
    color: #3b0764 !important;
    background: linear-gradient(135deg, #ede9fe, #ddd6fe) !important;
    border-color: rgba(124, 58, 237, 0.42) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-search-shortcut {
    color: #475569;
    background: #f1f5f9;
    border-color: #cbd5e1;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-search-shortcut-active {
    color: #0f766e;
    background: #ccfbf1;
    border-color: rgba(13, 148, 136, 0.38);
    box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.12);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-clear-search {
    color: #475569;
    background: #f1f5f9;
    border-color: #cbd5e1;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-filter-chip {
    color: #0f766e !important;
    background: rgba(13, 148, 136, 0.1) !important;
    border-color: rgba(13, 148, 136, 0.34) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-filter-chip strong {
    color: #042f2e !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-filter-chip:hover,
html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-filter-chip:focus-visible {
    background: rgba(13, 148, 136, 0.16) !important;
    border-color: rgba(13, 148, 136, 0.48) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-clear-filters {
    color: #991b1b !important;
    background: rgba(220, 38, 38, 0.08) !important;
    border-color: rgba(220, 38, 38, 0.28) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut--clients {
    background: rgba(37, 99, 235, 0.06) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut--guides {
    background: rgba(13, 148, 136, 0.06) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-header-shortcut--training {
    background: rgba(109, 40, 217, 0.06) !important;
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-dock-group {
    background: rgba(255, 255, 255, 0.84);
    border-color: rgba(71, 85, 105, 0.18);
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.1);
}

html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-floating-button {
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.05),
        0 10px 24px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

@media (min-width: 768px) {
    body.dashboard-v2-enabled .dashboard-v2-drawer-backdrop {
        background: rgba(15, 23, 42, 0.04);
    }

    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-drawer-backdrop {
        background: rgba(15, 23, 42, 0.08);
    }
}

@media (max-width: 767px) {
    html[data-theme="light"] body.dashboard-v2-enabled .dashboard-v2-mobile-result-count {
        background: rgba(15, 23, 42, 0.06);
        border-color: rgba(71, 85, 105, 0.22);
    }
}

/*
 * Dashboard V2 reduced-motion overrides.
 *
 * When the user prefers reduced motion, V2 disables hover lifts, focus translations,
 * card and dock translateY, and animated chip/tab transitions. State changes still
 * happen visually (border, color) but without movement.
 *
 * Scoped to V2 only - V1 motion is unchanged.
 */
@media (prefers-reduced-motion: reduce) {
    body.dashboard-v2-enabled .dashboard-v2-ticket-card,
    body.dashboard-v2-enabled .dashboard-v2-floating-button,
    body.dashboard-v2-enabled .dashboard-v2-header-icon-button,
    body.dashboard-v2-enabled .dashboard-v2-header-primary,
    body.dashboard-v2-enabled .dashboard-v2-header-shortcut,
    body.dashboard-v2-enabled .dashboard-v2-theme-toggle,
    body.dashboard-v2-enabled .dashboard-v2-quick-create-button,
    body.dashboard-v2-enabled .dashboard-v2-quick-create-source,
    body.dashboard-v2-enabled .dashboard-v2-filter-chip,
    body.dashboard-v2-enabled .dashboard-v2-badge-card,
    body.dashboard-v2-enabled .dashboard-v2-rail-toggle,
    body.dashboard-v2-enabled .dashboard-v2-mobile-actions button,
    body.dashboard-v2-enabled .dashboard-v2-mobile-drawer-close,
    body.dashboard-v2-enabled .dashboard-v2-virtual-popover-close,
    body.dashboard-v2-enabled .dashboard-v2-shift-action,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions,
    body.dashboard-v2-enabled .dashboard-v2-ticket-actions .dashboard-v2-ticket-action,
    body.dashboard-v2-enabled .dashboard-v2-floating-label,
    body.dashboard-v2-enabled .dashboard-v2-tabs .tab-btn,
    body.dashboard-v2-enabled .dashboard-v2-tabs #tab-indicator,
    body.dashboard-v2-enabled #performance-content button[onclick="main.loadUserKPI()"] {
        transition: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-ticket-card:hover,
    body.dashboard-v2-enabled .dashboard-v2-ticket-card:focus-within,
    body.dashboard-v2-enabled .dashboard-v2-floating-button:hover,
    body.dashboard-v2-enabled .dashboard-v2-floating-button:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-floating-button[aria-expanded="true"],
    body.dashboard-v2-enabled .dashboard-v2-header-icon-button:hover,
    body.dashboard-v2-enabled .dashboard-v2-header-icon-button:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-header-primary:hover,
    body.dashboard-v2-enabled .dashboard-v2-header-primary:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-header-shortcut:hover,
    body.dashboard-v2-enabled .dashboard-v2-header-shortcut:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-theme-toggle:hover,
    body.dashboard-v2-enabled .dashboard-v2-theme-toggle:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-quick-create-button:hover,
    body.dashboard-v2-enabled .dashboard-v2-quick-create-button:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-badge-card:hover,
    body.dashboard-v2-enabled .dashboard-v2-badge-card:focus-visible,
    body.dashboard-v2-enabled .dashboard-v2-badge-users .badge-holder:hover,
    body.dashboard-v2-enabled #performance-content button[onclick="main.loadUserKPI()"]:hover,
    body.dashboard-v2-enabled #performance-content button[onclick="main.loadUserKPI()"]:focus-visible {
        transform: none !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-floating-label {
        transition: opacity 0ms !important;
    }
}

/*
 * Popover-open workspace guards (May 2026 - authenticated QA report).
 *
 * Bug reported: "When I open anything from the left floating button, the tickets
 * and background disappear." The popover renders correctly but the workspace
 * behind it appears collapsed - filter row stacks vertically with only chevrons
 * visible, and the page background reads pure black instead of the V2 dark
 * surface.
 *
 * These guards force the workspace, main column, ticket-list views, and page
 * background to stay in their expected layout whenever a V2 dock popover is
 * open. They are scoped strictly to body.dashboard-v2-enabled and only fire
 * while a drawer is open, so they are no-ops in the steady state and harmless
 * if the underlying race is fixed later.
 *
 * If the bug persists after this patch, check the JS console for the
 * "[dashboard-v2] popover opened" diagnostic line which logs the resolved
 * widths of the workspace and main column at popover-open time.
 */
@media (min-width: 768px) {
    body.dashboard-v2-enabled.dashboard-v2-drawer-open #app-container.dashboard-v2-shell {
        background: var(--dashboard-v2-bg) !important;
    }

    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-workspace {
        background: var(--dashboard-v2-bg) !important;
        visibility: visible !important;
        overflow: visible !important;
    }

    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-main-column,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-main,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-tabs,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-command-bar,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-quick-create {
        visibility: visible !important;
        opacity: 1 !important;
    }

    body.dashboard-v2-enabled.dashboard-v2-drawer-open #ticket-list,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open #done-ticket-list,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open #follow-up-ticket-list,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open #dashboard-view,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open #knowledge-base-view {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /*
     * The command-bar inner row uses .max-w-7xl. When the workspace narrows
     * (popover taking width via fixed positioning + dock gutters), the row
     * must stay horizontal at desktop widths. If it ever collapses to a
     * single column on desktop, search + filters + range stack vertically -
     * which is the visible symptom of the reported bug.
     */
    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-command-bar > .max-w-7xl,
    body.dashboard-v2-enabled.dashboard-v2-drawer-open .dashboard-v2-command-bar .dashboard-v2-command-row {
        display: flex !important;
        flex-wrap: wrap !important;
        grid-template-columns: none !important;
    }
}

/*
 * V2 workspace layout guards.
 *
 * Belt-and-braces around the actual fix (explicit grid-column assignment
 * above): even if a future change to V1 markup or to Tailwind classes
 * tries to redefine the workspace's display, the V2 dashboard keeps its
 * grid layout, its dark background, and its horizontal command-bar /
 * tabs row at all desktop widths.
 *
 * Whether or not a popover is open:
 *   - #app-container keeps its V2 background colour.
 *   - .dashboard-v2-workspace stays display:grid with the expected columns.
 *   - .dashboard-v2-main-column is a vertical flex container.
 *   - .dashboard-v2-tabs and the inner tab container stay horizontal.
 *   - The command-bar inner row stays horizontal flex with wrapping at all
 *     widths >= 768px (prevents the stacked-filter mobile layout from
 *     creeping into desktop).
 */
body.dashboard-v2-enabled #app-container.dashboard-v2-shell {
    background: var(--dashboard-v2-bg) !important;
}

body.dashboard-v2-enabled .dashboard-v2-workspace {
    background: var(--dashboard-v2-bg) !important;
}

@media (min-width: 768px) {
    body.dashboard-v2-enabled .dashboard-v2-workspace {
        display: grid !important;
        grid-template-columns: var(--dashboard-v2-left-width) minmax(0, 1fr) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-main-column {
        display: flex !important;
        flex-direction: column !important;
        min-width: 0 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-main {
        display: block !important;
        flex: 1 1 auto !important;
        min-height: 0 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-tabs {
        display: block !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-tabs > div {
        display: flex !important;
        flex-direction: row !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-command-bar > .max-w-7xl,
    body.dashboard-v2-enabled .dashboard-v2-command-bar .dashboard-v2-command-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        grid-template-columns: none !important;
    }

    body.dashboard-v2-enabled #ticket-list,
    body.dashboard-v2-enabled #done-ticket-list,
    body.dashboard-v2-enabled #follow-up-ticket-list,
    body.dashboard-v2-enabled #tickets-view,
    body.dashboard-v2-enabled #done-view,
    body.dashboard-v2-enabled #follow-up-view,
    body.dashboard-v2-enabled #dashboard-view,
    body.dashboard-v2-enabled #knowledge-base-view {
        visibility: visible !important;
        opacity: 1 !important;
    }
}

@media (min-width: 1024px) {
    body.dashboard-v2-enabled .dashboard-v2-workspace {
        grid-template-columns: var(--dashboard-v2-left-width) minmax(0, 1fr) var(--dashboard-v2-right-width) !important;
    }
}

/*
 * Explicit grid-column assignments (May 2026 - root cause for the popover bug).
 *
 * Diagnostic from authenticated QA showed gridCols correctly resolved to
 * "0px 1397.33px 0px" but the main column was only 224px wide (= the sum of
 * its dock-safe paddings). Root cause: when the left rail is in popover mode,
 * its position:fixed style makes CSS grid auto-placement reshuffle the
 * remaining children. The main column was being placed in cell 1 (0px wide)
 * instead of cell 2 (1397.33px), with the right sidebar taking cell 2.
 *
 * Fix: pin each workspace child to its intended grid column explicitly. Now
 * the main column always sits in the 1fr middle column regardless of any
 * sibling becoming position:fixed.
 */
@media (min-width: 768px) {
    body.dashboard-v2-enabled #sidebar.dashboard-v2-left-rail {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-main-column {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }
}

@media (min-width: 1024px) {
    body.dashboard-v2-enabled #on-leave-sidebar.dashboard-v2-right-rail {
        grid-column: 3 !important;
        grid-row: 1 !important;
    }
}

/*
 * Defensive visibility/opacity guards for V2 workspace containers.
 *
 * Keeps the dashboard structurally visible if any V1 (or future) stylesheet
 * ever tries to set visibility:hidden / opacity:0 on the workspace, the
 * main column, the tabs row, the command bar, or any of the view roots.
 * The actual bug that motivated this block was the grid-column placement
 * issue fixed above; these guards stay as a safety net.
 *
 * Excludes the V1 .modal class (we still want those to honor .hidden) and
 * elements that V2 itself hides (.dashboard-v2-popover-section-hidden,
 * .dashboard-v2-popover-inline-hidden).
 */
body.dashboard-v2-enabled .dashboard-v2-main-column,
body.dashboard-v2-enabled .dashboard-v2-tabs,
body.dashboard-v2-enabled .dashboard-v2-main,
body.dashboard-v2-enabled .dashboard-v2-command-bar,
body.dashboard-v2-enabled #tickets-view,
body.dashboard-v2-enabled #done-view,
body.dashboard-v2-enabled #follow-up-view,
body.dashboard-v2-enabled #dashboard-view,
body.dashboard-v2-enabled #knowledge-base-view,
body.dashboard-v2-enabled #ticket-list,
body.dashboard-v2-enabled #done-ticket-list,
body.dashboard-v2-enabled #follow-up-ticket-list {
    visibility: visible !important;
    opacity: 1 !important;
}

body.dashboard-v2-enabled .dashboard-v2-main-column:not(.hidden):not([hidden]),
body.dashboard-v2-enabled .dashboard-v2-tabs:not(.hidden):not([hidden]),
body.dashboard-v2-enabled .dashboard-v2-main:not(.hidden):not([hidden]) {
    pointer-events: auto !important;
}

/*
 * Ensure the workspace itself never collapses to zero height. If the parent
 * #app-container ever loses its h-screen / flex:1 chain (e.g., V1 toggling
 * a layout class), the workspace still claims viewport space so its
 * children render.
 */
@media (min-width: 768px) {
    body.dashboard-v2-enabled .dashboard-v2-workspace {
        min-height: calc(100vh - 220px) !important;
    }

    body.dashboard-v2-enabled .dashboard-v2-main-column {
        min-height: calc(100vh - 220px) !important;
    }
}

/* V2 operations dashboard tab */
body.dashboard-v2-enabled #dashboard-view.dashboard-ops-shell.hidden {
    display: none !important;
}

body.dashboard-v2-enabled #dashboard-view.dashboard-ops-shell:not(.hidden) {
    display: block !important;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    padding: 18px;
    color: var(--dashboard-v2-text);
    background:
        linear-gradient(180deg, rgba(20, 184, 166, 0.05), transparent 190px),
        var(--dashboard-v2-bg);
}

body.dashboard-v2-enabled .dashboard-ops-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    margin-bottom: 14px;
    background: var(--dashboard-v2-panel);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-header h2 {
    margin: 0;
    color: var(--dashboard-v2-text);
    font-size: 24px;
    line-height: 1.1;
    font-weight: 850;
    letter-spacing: 0;
}

body.dashboard-v2-enabled .dashboard-ops-eyebrow,
body.dashboard-v2-enabled .dashboard-ops-subtitle {
    margin: 0;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
    line-height: 1.35;
}

body.dashboard-v2-enabled .dashboard-ops-eyebrow {
    margin-bottom: 6px;
    color: var(--dashboard-v2-accent);
    font-weight: 800;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .dashboard-ops-subtitle {
    margin-top: 7px;
    max-width: 560px;
}

body.dashboard-v2-enabled .dashboard-ops-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

body.dashboard-v2-enabled .dashboard-ops-controls label {
    color: var(--dashboard-v2-muted);
    font-size: 12px;
    font-weight: 750;
}

body.dashboard-v2-enabled .dashboard-ops-controls select,
body.dashboard-v2-enabled .dashboard-ops-refresh {
    min-height: 36px;
    color: var(--dashboard-v2-text);
    background: var(--dashboard-v2-panel-soft);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 750;
}

body.dashboard-v2-enabled .dashboard-ops-controls select {
    min-width: 190px;
    padding: 0 34px 0 12px;
}

body.dashboard-v2-enabled .dashboard-ops-refresh {
    padding: 0 13px;
}

body.dashboard-v2-enabled .dashboard-ops-refresh:hover {
    border-color: var(--dashboard-v2-border-strong);
    color: var(--dashboard-v2-accent);
}

body.dashboard-v2-enabled .dashboard-ops-content {
    display: grid;
    gap: 14px;
}

body.dashboard-v2-enabled .dashboard-ops-context {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-context span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 28px;
    padding: 0 10px;
    background: var(--dashboard-v2-panel-soft);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-ops-context b {
    color: var(--dashboard-v2-text);
    font-weight: 800;
}

body.dashboard-v2-enabled .dashboard-ops-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

body.dashboard-v2-enabled .dashboard-ops-kpi {
    display: grid;
    align-content: start;
    gap: 6px;
    min-height: 92px;
    padding: 13px;
    background: var(--dashboard-v2-panel);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-kpi span {
    color: var(--dashboard-v2-muted);
    font-size: 11px;
    line-height: 1.25;
    font-weight: 800;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .dashboard-ops-kpi strong {
    color: var(--dashboard-v2-text);
    font-size: 28px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

body.dashboard-v2-enabled .dashboard-ops-kpi small {
    color: var(--dashboard-v2-muted);
    font-size: 12px;
    line-height: 1.3;
}

body.dashboard-v2-enabled .dashboard-ops-kpi-good {
    border-color: rgba(34, 197, 94, 0.32);
}

body.dashboard-v2-enabled .dashboard-ops-kpi-warn {
    border-color: rgba(245, 158, 11, 0.36);
}

body.dashboard-v2-enabled .dashboard-ops-kpi-urgent {
    border-color: rgba(248, 113, 113, 0.42);
}

body.dashboard-v2-enabled .dashboard-ops-kpi-good strong {
    color: #34d399;
}

body.dashboard-v2-enabled .dashboard-ops-kpi-warn strong {
    color: #fbbf24;
}

body.dashboard-v2-enabled .dashboard-ops-kpi-urgent strong {
    color: #fb7185;
}

body.dashboard-v2-enabled .dashboard-ops-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-panel {
    min-width: 0;
    padding: 14px;
    background: var(--dashboard-v2-panel);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-panel-wide {
    grid-column: 1 / -1;
}

body.dashboard-v2-enabled .dashboard-ops-panel header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--dashboard-v2-border);
}

body.dashboard-v2-enabled .dashboard-ops-panel header span {
    color: var(--dashboard-v2-text);
    font-size: 14px;
    line-height: 1.2;
    font-weight: 850;
}

body.dashboard-v2-enabled .dashboard-ops-panel header small,
body.dashboard-v2-enabled .dashboard-ops-panel-subtitle {
    color: var(--dashboard-v2-muted);
    font-size: 11px;
    line-height: 1.35;
    font-weight: 750;
}

body.dashboard-v2-enabled .dashboard-ops-panel-subtitle {
    margin: 12px 0 8px;
    text-transform: uppercase;
}

body.dashboard-v2-enabled .dashboard-ops-attention-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 12px;
    margin-bottom: 8px;
    background: var(--dashboard-v2-panel-soft);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-attention-row:last-child {
    margin-bottom: 0;
}

body.dashboard-v2-enabled .dashboard-ops-attention-row strong,
body.dashboard-v2-enabled .dashboard-ops-attention-row b {
    color: var(--dashboard-v2-text);
    font-weight: 850;
}

body.dashboard-v2-enabled .dashboard-ops-attention-row div > span {
    display: block;
    margin-top: 3px;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-attention-row b {
    display: inline-grid;
    place-items: center;
    width: 34px;
    min-width: 34px;
    height: 34px;
    background: rgba(148, 163, 184, 0.11);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-attention-urgent {
    border-color: rgba(248, 113, 113, 0.42);
}

body.dashboard-v2-enabled .dashboard-ops-attention-warn {
    border-color: rgba(245, 158, 11, 0.36);
}

body.dashboard-v2-enabled .dashboard-ops-chip-row {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 10px;
}

body.dashboard-v2-enabled .dashboard-ops-chip {
    display: inline-flex;
    align-items: center;
    max-width: 180px;
    min-height: 24px;
    padding: 0 8px;
    overflow: hidden;
    color: var(--dashboard-v2-text);
    background: rgba(15, 23, 42, 0.32);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-v2-enabled .dashboard-ops-bar-row {
    display: grid;
    gap: 6px;
    margin-bottom: 10px;
}

body.dashboard-v2-enabled .dashboard-ops-bar-row:last-child {
    margin-bottom: 0;
}

body.dashboard-v2-enabled .dashboard-ops-bar-row > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-bar-row strong {
    color: var(--dashboard-v2-text);
}

body.dashboard-v2-enabled .dashboard-ops-meter,
body.dashboard-v2-enabled .dashboard-ops-trend-bars {
    position: relative;
    overflow: hidden;
    min-height: 8px;
    background: rgba(148, 163, 184, 0.13);
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-ops-meter i {
    display: block;
    height: 8px;
    background: linear-gradient(90deg, #14b8a6, #60a5fa);
    border-radius: inherit;
}

body.dashboard-v2-enabled .dashboard-ops-capacity {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-panel .dashboard-ops-kpi {
    min-height: 78px;
    padding: 10px;
    background: var(--dashboard-v2-panel-soft);
    box-shadow: none;
}

body.dashboard-v2-enabled .dashboard-ops-panel .dashboard-ops-kpi strong {
    font-size: 22px;
}

body.dashboard-v2-enabled .dashboard-ops-kb {
    display: grid;
    gap: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

body.dashboard-v2-enabled .dashboard-ops-tag-list span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 26px;
    padding: 0 9px;
    color: var(--dashboard-v2-muted);
    background: var(--dashboard-v2-panel-soft);
    border: 1px solid var(--dashboard-v2-border);
    border-radius: 999px;
    font-size: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-tag-list b {
    color: var(--dashboard-v2-text);
}

body.dashboard-v2-enabled .dashboard-ops-trend-legend {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-trend-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

body.dashboard-v2-enabled .dashboard-ops-trend-legend i {
    display: inline-block;
    width: 18px;
    height: 7px;
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-ops-trend-row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 54px;
    align-items: center;
    gap: 10px;
    min-height: 30px;
    color: var(--dashboard-v2-muted);
    font-size: 12px;
}

body.dashboard-v2-enabled .dashboard-ops-trend-bars {
    display: grid;
    gap: 3px;
    min-height: 17px;
    padding: 3px;
}

body.dashboard-v2-enabled .dashboard-ops-trend-bars i {
    display: block;
    height: 5px;
    border-radius: 999px;
}

body.dashboard-v2-enabled .dashboard-ops-trend-created {
    background: #60a5fa;
}

body.dashboard-v2-enabled .dashboard-ops-trend-closed {
    background: #34d399;
}

body.dashboard-v2-enabled .dashboard-ops-trend-row b {
    color: var(--dashboard-v2-text);
    text-align: right;
}

body.dashboard-v2-enabled .dashboard-ops-empty,
body.dashboard-v2-enabled .dashboard-ops-mini-empty {
    color: var(--dashboard-v2-muted);
    background: var(--dashboard-v2-panel-soft);
    border: 1px dashed var(--dashboard-v2-border);
    border-radius: 8px;
}

body.dashboard-v2-enabled .dashboard-ops-empty {
    display: grid;
    gap: 7px;
    place-items: center;
    min-height: 220px;
    padding: 24px;
    text-align: center;
}

body.dashboard-v2-enabled .dashboard-ops-empty strong {
    color: var(--dashboard-v2-text);
    font-size: 18px;
}

body.dashboard-v2-enabled .dashboard-ops-mini-empty {
    padding: 14px;
    font-size: 13px;
}

body.dashboard-v2-enabled .dashboard-ops-skeleton,
body.dashboard-v2-enabled .dashboard-ops-skeleton-panel {
    overflow: hidden;
}

body.dashboard-v2-enabled .dashboard-ops-skeleton span,
body.dashboard-v2-enabled .dashboard-ops-skeleton strong,
body.dashboard-v2-enabled .dashboard-ops-skeleton small,
body.dashboard-v2-enabled .dashboard-ops-skeleton-panel span,
body.dashboard-v2-enabled .dashboard-ops-skeleton-panel strong,
body.dashboard-v2-enabled .dashboard-ops-skeleton-panel p {
    display: block;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(148, 163, 184, 0.12), rgba(148, 163, 184, 0.28), rgba(148, 163, 184, 0.12));
    background-size: 200% 100%;
    animation: dashboardOpsPulse 1.2s linear infinite;
}

body.dashboard-v2-enabled .dashboard-ops-skeleton strong {
    width: 46%;
    height: 28px;
}

body.dashboard-v2-enabled .dashboard-ops-skeleton small,
body.dashboard-v2-enabled .dashboard-ops-skeleton-panel p {
    width: 70%;
}

@keyframes dashboardOpsPulse {
    to {
        background-position: -200% 0;
    }
}

@media (max-width: 1200px) {
    body.dashboard-v2-enabled .dashboard-ops-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    body.dashboard-v2-enabled .dashboard-ops-header {
        flex-direction: column;
    }

    body.dashboard-v2-enabled .dashboard-ops-controls {
        width: 100%;
        justify-content: flex-start;
    }

    body.dashboard-v2-enabled .dashboard-ops-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    body.dashboard-v2-enabled #dashboard-view.dashboard-ops-shell:not(.hidden) {
        padding: 12px;
    }

    body.dashboard-v2-enabled .dashboard-ops-header {
        padding: 13px;
    }

    body.dashboard-v2-enabled .dashboard-ops-header h2 {
        font-size: 22px;
    }

    body.dashboard-v2-enabled .dashboard-ops-kpis,
    body.dashboard-v2-enabled .dashboard-ops-capacity {
        grid-template-columns: minmax(0, 1fr);
    }

    body.dashboard-v2-enabled .dashboard-ops-controls select,
    body.dashboard-v2-enabled .dashboard-ops-refresh {
        width: 100%;
    }

    body.dashboard-v2-enabled .dashboard-ops-trend-row {
        grid-template-columns: 62px minmax(0, 1fr) 44px;
    }
}

/* ── Mobile ticket action sheet: portal + tap-to-close + handle + animation ──
   The panel is portaled to <body> (class .is-portaled) so its position:fixed is
   viewport-anchored (a transformed/blurred ancestor card was making it float
   upward). Keep this OUTSIDE a transformed context. */
@media (max-width: 767px) {
    /* Tappable dim layer behind the sheet (tap outside closes it). */
    /* <body> has `transform: translateZ(0)` (GPU hack) which makes it the
       containing block for position:fixed and would anchor the backdrop to the
       scrollable page box instead of the viewport. Drop it while the sheet is
       open so the backdrop pins to the viewport (translateZ(0)->none is a no-op
       visually, so there's no jump). */
    body.tc-action-sheet-open {
        transform: none !important;
    }

    /* Full-screen fixed backdrop that CONTAINS the sheet and bottom-aligns it
       with flexbox. The panel inside no longer needs position:fixed, so it can't
       be thrown off by an ancestor's transform/contain/content-visibility. */
    .ticket-mobile-menu-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1500;
        display: flex;
        align-items: flex-end;
        justify-content: center;
        padding: 0 10px calc(58px + env(safe-area-inset-bottom, 0px));
        background: rgba(2, 6, 23, 0.5);
        touch-action: none;
        overscroll-behavior: contain;
        cursor: pointer; /* iOS Safari needs this to fire tap/click on a bare div */
        animation: ticketSheetFade 0.18s ease both;
    }

    /* The sheet itself: laid out by the backdrop's flexbox (bottom-centered).
       Override the base panel's fixed positioning; keep its grid/scroll styling. */
    body.dashboard-v2-enabled .ticket-card-mobile-menu-panel.is-portaled {
        position: relative !important;
        inset: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        max-width: 520px !important;
        margin: 0 !important;
        display: grid !important;
        visibility: visible !important;
        pointer-events: auto !important;
        touch-action: pan-y;
        animation: ticketSheetUp 0.22s cubic-bezier(0.2, 0.7, 0.3, 1) both;
    }

    /* Grab handle at the top of the sheet. */
    body.dashboard-v2-enabled .ticket-card-mobile-menu-handle {
        grid-column: 1 / -1;
        justify-self: center;
        width: 38px;
        height: 4px;
        margin: 2px 0 8px;
        border-radius: 999px;
        background: rgba(148, 163, 184, 0.4);
    }

    /* Keep long ticket subjects to two lines on small screens. */
    body.dashboard-v2-enabled .tc-ticket-subject {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    @keyframes ticketSheetUp {
        from { transform: translateY(18px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }
    @keyframes ticketSheetFade {
        from { opacity: 0; }
        to { opacity: 1; }
    }
}