/* DSE 2026 brand alignment
 * Palette source: approved navy-and-gold DSE identity.
 * Color-only overrides: no application layout or behavior changes.
 */

:root {
    --dse-2026-navy-950: #061126;
    --dse-2026-navy-900: #091a38;
    --dse-2026-navy-800: #102851;
    --dse-2026-gold: #f0b828;
    --dse-2026-gold-highlight: #fce466;
    --dse-2026-gold-edge: #ac740c;
    --dse-2026-canvas: #f3f6fa;
    --dse-2026-white: #ffffff;
    --dse-2026-ink: #101b31;
    --dse-2026-muted: #536077;
    --dse-2026-border: #d7dfeb;
    --dse-2026-gold-soft: #fff8e4;
    --dse-2026-gold-ring: rgba(240, 184, 40, .28);

    --dse-brand-navy: var(--dse-2026-navy-950);
    --dse-brand-navy-soft: var(--dse-2026-navy-900);
    --dse-brand-yellow: var(--dse-2026-gold);
    --dse-brand-canvas: var(--dse-2026-white);
    --dse-brand-surface: var(--dse-2026-canvas);
    --dse-brand-surface-strong: #e9eef5;
    --dse-brand-ink: var(--dse-2026-ink);
    --dse-brand-text: #31405a;
    --dse-brand-muted: var(--dse-2026-muted);
    --dse-brand-border: var(--dse-2026-border);
    --dse-brand-border-strong: #b7c3d3;
    --dse-brand-focus: 0 0 0 3px var(--dse-2026-gold-ring), 0 0 0 5px var(--dse-2026-navy-950);
}

body::before {
    background: linear-gradient(
        90deg,
        var(--dse-2026-gold-edge),
        var(--dse-2026-gold),
        var(--dse-2026-gold-highlight),
        var(--dse-2026-gold),
        var(--dse-2026-gold-edge)
    ) !important;
}

html body.dse-client-portal::before,
html body.dse-staff-login::before,
html body.dse-helpdesk-portal::before,
html body.dse-rmm-portal::before {
    background: linear-gradient(
        90deg,
        var(--dse-2026-gold-edge),
        var(--dse-2026-gold),
        var(--dse-2026-gold-highlight),
        var(--dse-2026-gold),
        var(--dse-2026-gold-edge)
    ) !important;
}

:where(a, button, input, select, textarea):focus-visible {
    outline-color: var(--dse-2026-gold) !important;
}

/* Shared logo treatment */
.dse-helpdesk-brand img,
.dse-scp-login-brand img,
.dse-native-app-mark img,
#logo.dse-scp-logo img,
.dse-mobile-app .brand-mark img,
#loginBody #logo img,
#loginBody img.osticket-logo {
    border-radius: 8px !important;
    background: var(--dse-2026-navy-950) !important;
    box-shadow: 0 0 0 1px rgba(240, 184, 40, .72), 0 10px 26px rgba(0, 0, 0, .22) !important;
}

/* Customer Helpdesk */
body.dse-client-portal {
    --dse-helpdesk-navy: var(--dse-2026-navy-950);
    --dse-helpdesk-navy-soft: var(--dse-2026-navy-900);
    --dse-helpdesk-blue: var(--dse-2026-gold);
    --dse-helpdesk-blue-dark: var(--dse-2026-gold-edge);
    --dse-helpdesk-cyan: var(--dse-2026-gold-highlight);
    --dse-helpdesk-ink: var(--dse-2026-ink);
    --dse-helpdesk-text: #31405a;
    --dse-helpdesk-muted: var(--dse-2026-muted);
    --dse-helpdesk-border: var(--dse-2026-border);
    --dse-helpdesk-canvas: var(--dse-2026-canvas);
}

body.dse-client-portal .dse-helpdesk-top {
    border-bottom-color: rgba(240, 184, 40, .28) !important;
    background:
        radial-gradient(circle at 14% -70%, rgba(240, 184, 40, .18), transparent 30rem),
        linear-gradient(125deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900) 58%, var(--dse-2026-navy-800)) !important;
    box-shadow: 0 14px 36px rgba(6, 17, 38, .2) !important;
}

body.dse-client-portal #header.dse-helpdesk-header #logo {
    border-color: rgba(240, 184, 40, .72) !important;
    background: var(--dse-2026-navy-950) !important;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .24) !important;
}

body.dse-client-portal .dse-helpdesk-brand-text strong {
    color: var(--dse-2026-white) !important;
}

body.dse-client-portal .dse-helpdesk-brand-text span {
    color: #bdc9da !important;
}

body.dse-client-portal .dse-helpdesk-account a.dse-helpdesk-signin,
body.dse-client-portal .dse-helpdesk-account a.dse-helpdesk-signin:visited {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 10px 26px rgba(172, 116, 12, .24) !important;
}

body.dse-client-portal .dse-helpdesk-account a.dse-helpdesk-signin:hover,
body.dse-client-portal .dse-helpdesk-account a.dse-helpdesk-signin:focus-visible {
    border-color: var(--dse-2026-gold-highlight) !important;
    background: linear-gradient(135deg, #fff0a2, var(--dse-2026-gold-highlight)) !important;
    color: var(--dse-2026-navy-950) !important;
}

body.dse-client-portal .dse-helpdesk-nav > li > a:hover {
    color: var(--dse-2026-navy-800) !important;
    background: var(--dse-2026-gold-soft) !important;
}

body.dse-client-portal .dse-helpdesk-nav > li > a.active,
body.dse-client-portal .dse-helpdesk-nav > li > a.active:hover {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 8px 20px rgba(172, 116, 12, .22) !important;
}

html body.dse-client-portal ul#nav.dse-helpdesk-nav > li > a.active,
html body.dse-client-portal ul#nav.dse-helpdesk-nav > li > a.active:hover,
html body.dse-client-portal ul#nav.dse-helpdesk-nav > li > a.active:focus-visible {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 8px 20px rgba(172, 116, 12, .22) !important;
}

body.dse-client-portal .dse-helpdesk-nav-toggle-icon {
    color: var(--dse-2026-gold-edge) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-hero {
    border-color: rgba(240, 184, 40, .28) !important;
    background:
        radial-gradient(circle at 82% 18%, rgba(240, 184, 40, .16), transparent 27rem),
        linear-gradient(135deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900) 58%, var(--dse-2026-navy-800)) !important;
    box-shadow: 0 26px 70px rgba(6, 17, 38, .24) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-hero::before {
    background-image: radial-gradient(rgba(252, 228, 102, .16) 1px, transparent 1px) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-hero::after {
    border-color: rgba(240, 184, 40, .18) !important;
    box-shadow:
        0 0 0 44px rgba(240, 184, 40, .04),
        0 0 0 88px rgba(240, 184, 40, .025) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-eyebrow {
    color: var(--dse-2026-gold-highlight) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-eyebrow::before {
    background: var(--dse-2026-gold) !important;
    box-shadow: 0 0 0 5px rgba(240, 184, 40, .12), 0 0 16px rgba(240, 184, 40, .55) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-hero h1 span {
    color: var(--dse-2026-gold-highlight) !important;
    background: linear-gradient(100deg, #ffffff 0%, var(--dse-2026-gold-highlight) 52%, var(--dse-2026-gold) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-button.primary,
body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-button.primary:visited {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 16px 34px rgba(172, 116, 12, .28) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-button.primary:hover,
body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-button.primary:focus-visible {
    border-color: var(--dse-2026-gold-highlight) !important;
    background: linear-gradient(135deg, #fff0a2, var(--dse-2026-gold-highlight)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 20px 42px rgba(172, 116, 12, .34) !important;
}

body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-button:not(.primary):hover,
body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-button:not(.primary):focus-visible {
    border-color: rgba(252, 228, 102, .66) !important;
    background: rgba(240, 184, 40, .12) !important;
    color: var(--dse-2026-white) !important;
}

body.dse-client-portal :where(
    .dse-helpdesk-workstream-icon,
    .dse-helpdesk-resource-mark,
    .dse-helpdesk-quick-number
) {
    border-color: rgba(172, 116, 12, .34) !important;
    background: var(--dse-2026-gold-soft) !important;
    color: #7a5008 !important;
}

body.dse-client-portal :where(
    .dse-hd-button.primary,
    .dse-login-button.primary,
    .dse-open-button.primary,
    .dse-view-button.primary,
    .dse-profile-button.primary,
    .dse-password-reset-button.primary,
    .dse-ticket-button.primary,
    .dse-kb-button.primary,
    a.action-button.primary
) {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 10px 24px rgba(172, 116, 12, .22) !important;
}

/* Shared Helpdesk/RMM staff sign-in */
body.dse-staff-login {
    background:
        radial-gradient(circle at 16% 10%, rgba(240, 184, 40, .10), transparent 28rem),
        linear-gradient(145deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900)) !important;
    color: #d8e1ed !important;
}

body.dse-staff-login .dse-scp-shell {
    border-color: rgba(240, 184, 40, .30) !important;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .34) !important;
}

body.dse-staff-login .dse-scp-brand,
body.dse-staff-login .dse-scp-login {
    border-color: rgba(240, 184, 40, .24) !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(240, 184, 40, .09), transparent 22rem),
        linear-gradient(145deg, var(--dse-2026-navy-900), var(--dse-2026-navy-800)) !important;
}

body.dse-staff-login .dse-scp-login-brand img {
    border: 1px solid rgba(240, 184, 40, .68) !important;
}

body.dse-staff-login .dse-scp-kicker,
body.dse-staff-login .dse-scp-links a {
    color: var(--dse-2026-gold-highlight) !important;
}

body.dse-staff-login .dse-scp-field input:focus {
    border-color: var(--dse-2026-gold) !important;
    box-shadow: 0 0 0 3px var(--dse-2026-gold-ring) !important;
}

body.dse-staff-login button.dse-scp-submit {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 12px 28px rgba(172, 116, 12, .24) !important;
}

body.dse-staff-login button.dse-scp-submit:hover,
body.dse-staff-login button.dse-scp-submit:focus-visible {
    background: linear-gradient(135deg, #fff0a2, var(--dse-2026-gold-highlight)) !important;
    color: var(--dse-2026-navy-950) !important;
}

/* Authenticated Helpdesk/RMM shell: colors only */
html body.dse-helpdesk-portal,
html body.dse-rmm-portal {
    --dse-navy: var(--dse-2026-navy-950);
    --dse-navy-2: var(--dse-2026-navy-900);
    --dse-border: var(--dse-2026-navy-800);
    --dse-blue: var(--dse-2026-gold);
    --dse-blue-light: var(--dse-2026-gold-highlight);
    --dse-page: var(--dse-2026-canvas);
    --dse-page-soft: #e9eef5;
    --dse-ink: var(--dse-2026-ink);
}

html body.dse-helpdesk-portal :where(.dse-scp-header-card, .dse-scp-nav-card),
html body.dse-rmm-portal :where(.dse-scp-header-card, .dse-scp-nav-card) {
    border-color: rgba(240, 184, 40, .24) !important;
    background:
        radial-gradient(circle at 12% -50%, rgba(240, 184, 40, .11), transparent 26rem),
        linear-gradient(135deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900)) !important;
}

html body.dse-helpdesk-portal .dse-scp-kicker,
html body.dse-rmm-portal .dse-scp-kicker {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-helpdesk-portal :where(a, button, input, select, textarea):focus-visible,
html body.dse-rmm-portal :where(a, button, input, select, textarea):focus-visible {
    outline-color: var(--dse-2026-gold) !important;
    box-shadow: 0 0 0 3px var(--dse-2026-gold-ring) !important;
}

/* Legacy staff reset/login fallback */
#loginBody {
    background:
        radial-gradient(circle at 50% 0%, rgba(240, 184, 40, .10), transparent 28rem),
        linear-gradient(145deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900)) !important;
}

#loginBody #loginBox {
    border-color: rgba(240, 184, 40, .28) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34) !important;
}

#loginBody :where(button, input[type="submit"]) {
    border-color: var(--dse-2026-gold-edge) !important;
    background: var(--dse-2026-gold) !important;
    color: var(--dse-2026-navy-950) !important;
}

/* Mobile staff workspace */
.dse-mobile-app {
    --navy-950: var(--dse-2026-navy-950);
    --navy-900: var(--dse-2026-navy-900);
    --navy-800: var(--dse-2026-navy-800);
    --blue-700: var(--dse-2026-gold-edge);
    --blue-600: var(--dse-2026-gold);
    --blue-500: var(--dse-2026-gold-highlight);
    --yellow-500: var(--dse-2026-gold);
}

.dse-mobile-app .app-header,
.dse-mobile-app .hero-card {
    border-color: rgba(240, 184, 40, .24) !important;
    background:
        radial-gradient(circle at 12% -20%, rgba(240, 184, 40, .12), transparent 22rem),
        linear-gradient(135deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900)) !important;
}

.dse-mobile-app :where(.button-primary, .bottom-nav a.active) {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
}

.dse-mobile-app :where(.eyebrow, .text-link, .metric-link) {
    color: #7a5008 !important;
}

/* Public Helpdesk palette refinement
 * Color and presentation only. Deliberately excludes GavBot / .dse-ai-*.
 */
html body.dse-client-portal {
    --dse-cx-navy-950: var(--dse-2026-navy-950);
    --dse-cx-navy-900: var(--dse-2026-navy-900);
    --dse-cx-navy-800: var(--dse-2026-navy-800);
    --dse-cx-blue-700: var(--dse-2026-navy-800);
    --dse-cx-blue-600: var(--dse-2026-navy-800);
    --dse-cx-blue-500: var(--dse-2026-navy-800);
    --dse-cx-cyan-400: var(--dse-2026-gold-highlight);
    --dse-cx-ink: var(--dse-2026-ink);
    --dse-cx-copy: var(--dse-2026-ink);
    --dse-cx-muted: var(--dse-2026-muted);
    --dse-cx-line: var(--dse-2026-border);
    --dse-cx-line-strong: var(--dse-2026-border);
    --dse-cx-canvas: var(--dse-2026-canvas);
    --dse-cx-surface: var(--dse-2026-white);
    --dse-cx-surface-soft: var(--dse-2026-canvas);
    --dse-cx-shadow-blue: 0 14px 32px rgba(240, 184, 40, .18);

    --dse-entry-page: var(--dse-2026-canvas);
    --dse-entry-surface: var(--dse-2026-white);
    --dse-entry-surface-soft: var(--dse-2026-canvas);
    --dse-entry-ink: var(--dse-2026-ink);
    --dse-entry-muted: var(--dse-2026-muted);
    --dse-entry-line: var(--dse-2026-border);
    --dse-entry-blue: var(--dse-2026-navy-800);
    --dse-entry-blue-soft: rgba(240, 184, 40, .12);
    --dse-entry-navy: var(--dse-2026-navy-950);

    background:
        radial-gradient(circle at 8% 1%, rgba(240, 184, 40, .07), transparent 27rem),
        linear-gradient(180deg, #ffffff 0, var(--dse-2026-canvas) 22rem, #ffffff 100%) !important;
}

html body.dse-client-portal .dse-helpdesk-top {
    border-bottom-color: rgba(240, 184, 40, .24) !important;
    background:
        radial-gradient(circle at 12% -120%, rgba(240, 184, 40, .09), transparent 26rem),
        linear-gradient(125deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900) 60%, var(--dse-2026-navy-800)) !important;
}

html body.dse-client-portal ul#nav.dse-helpdesk-nav > li > a.active,
html body.dse-client-portal ul#nav.dse-helpdesk-nav > li > a.active:hover,
html body.dse-client-portal ul#nav.dse-helpdesk-nav > li > a.active:focus-visible {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-soft), #fcefc0) !important;
    color: #7a5008 !important;
    box-shadow: 0 8px 20px rgba(172, 116, 12, .16) !important;
}

/* Homepage: finish the navy, gold, and neutral hierarchy. */
html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-hero {
    border-color: rgba(240, 184, 40, .28) !important;
    background:
        radial-gradient(circle at 84% 18%, rgba(240, 184, 40, .14), transparent 24rem),
        linear-gradient(125deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900) 58%, var(--dse-2026-navy-800)) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-assurance {
    border-color: rgba(240, 184, 40, .26) !important;
    background: linear-gradient(145deg, rgba(9, 26, 56, .95), rgba(16, 40, 81, .88)) !important;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .22), inset 0 1px rgba(252, 228, 102, .08) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-assurance li {
    border-color: rgba(240, 184, 40, .18) !important;
    background: rgba(255, 255, 255, .055) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-assurance li > b,
html body.dse-client-portal #content .dse-helpdesk-home-assurance footer > span i,
html body.dse-client-portal #content .dse-helpdesk-workstream.featured .dse-helpdesk-workstream-icon,
html body.dse-client-portal #content .dse-helpdesk-resource-mark i {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: none !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-assurance li small,
html body.dse-client-portal #content .dse-helpdesk-home-assurance footer small {
    color: #bdc9da !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-assurance footer > span i:nth-child(2) {
    background: linear-gradient(135deg, var(--dse-2026-gold), #d69b14) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-assurance footer > span i:nth-child(3) {
    background: linear-gradient(135deg, #d69b14, var(--dse-2026-gold-edge)) !important;
}

html body.dse-client-portal #content .dse-helpdesk-quick-actions a {
    border-color: var(--dse-2026-border) !important;
    color: var(--dse-2026-ink) !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 18px 44px rgba(6, 17, 38, .11) !important;
}

html body.dse-client-portal #content .dse-helpdesk-quick-actions a:hover {
    border-color: rgba(172, 116, 12, .52) !important;
    color: var(--dse-2026-navy-800) !important;
    box-shadow: 0 24px 54px rgba(6, 17, 38, .16) !important;
}

html body.dse-client-portal #content .dse-helpdesk-quick-actions a.primary,
html body.dse-client-portal #content .dse-helpdesk-final-cta > a {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 14px 30px rgba(172, 116, 12, .24) !important;
}

html body.dse-client-portal #content .dse-helpdesk-quick-actions a.primary *,
html body.dse-client-portal #content .dse-helpdesk-final-cta > a * {
    color: var(--dse-2026-navy-950) !important;
}

html body.dse-client-portal #content .dse-helpdesk-quick-actions a:not(.primary) .dse-helpdesk-quick-number {
    color: #7a5008 !important;
}

html body.dse-client-portal #content .dse-helpdesk-quick-actions a:not(.primary) > b {
    border-color: rgba(172, 116, 12, .34) !important;
    color: #7a5008 !important;
    background: var(--dse-2026-gold-soft) !important;
}

html body.dse-client-portal #content .dse-helpdesk-service-map {
    border-color: var(--dse-2026-border) !important;
    background: rgba(255, 255, 255, .88) !important;
    box-shadow: 0 22px 60px rgba(6, 17, 38, .07) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-section-head > div > span,
html body.dse-client-portal #content .dse-helpdesk-final-cta > div > span {
    color: #7a5008 !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-workstream {
    border-color: var(--dse-2026-border) !important;
    color: #31405a !important;
    background:
        radial-gradient(circle at 100% 0, rgba(240, 184, 40, .08), transparent 13rem),
        #ffffff !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-workstream:hover {
    border-color: rgba(172, 116, 12, .50) !important;
    box-shadow: 0 20px 44px rgba(6, 17, 38, .11) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-workstream-icon {
    border-color: rgba(172, 116, 12, .34) !important;
    color: #7a5008 !important;
    background: var(--dse-2026-gold-soft) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-workstream.featured {
    border-color: rgba(240, 184, 40, .32) !important;
    color: #dce4ef !important;
    background:
        radial-gradient(circle at 88% 4%, rgba(240, 184, 40, .16), transparent 15rem),
        linear-gradient(135deg, var(--dse-2026-navy-950), var(--dse-2026-navy-800)) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-workstream.accent {
    border-color: rgba(172, 116, 12, .30) !important;
    background:
        radial-gradient(circle at 95% 15%, rgba(240, 184, 40, .14), transparent 15rem),
        linear-gradient(135deg, var(--dse-2026-gold-soft), #ffffff) !important;
}

html body.dse-client-portal #content .dse-helpdesk-workstream-top > small {
    border-color: rgba(240, 184, 40, .28) !important;
    color: var(--dse-2026-gold-highlight) !important;
    background: rgba(240, 184, 40, .09) !important;
}

html body.dse-client-portal #content .dse-helpdesk-workstream-route {
    color: #7a5008 !important;
}

html body.dse-client-portal #content .dse-helpdesk-workstream.featured .dse-helpdesk-workstream-route {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #content .dse-helpdesk-resource-band {
    border-color: rgba(240, 184, 40, .28) !important;
    background:
        radial-gradient(circle at 95% 10%, rgba(240, 184, 40, .16), transparent 21rem),
        linear-gradient(125deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900) 65%, var(--dse-2026-navy-800)) !important;
    box-shadow: 0 24px 64px rgba(6, 17, 38, .17) !important;
}

html body.dse-client-portal #content .dse-helpdesk-resource-band::after {
    border-color: rgba(240, 184, 40, .14) !important;
    box-shadow: 0 0 0 48px rgba(240, 184, 40, .035), 0 0 0 96px rgba(240, 184, 40, .02) !important;
}

html body.dse-client-portal #content .dse-helpdesk-resource-copy > span,
html body.dse-client-portal #content .dse-helpdesk-resource-band > aside > strong {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-links a,
html body.dse-client-portal #content .dse-helpdesk-resource-band > aside {
    border-color: rgba(240, 184, 40, .24) !important;
}

html body.dse-client-portal #content .dse-helpdesk-home-v2 .dse-helpdesk-home-links a:hover {
    border-color: rgba(252, 228, 102, .58) !important;
    color: #ffffff !important;
    background: rgba(240, 184, 40, .13) !important;
}

html body.dse-client-portal #content .dse-helpdesk-final-cta {
    border-color: rgba(172, 116, 12, .34) !important;
    background:
        radial-gradient(circle at 90% 10%, rgba(252, 228, 102, .24), transparent 14rem),
        linear-gradient(135deg, var(--dse-2026-gold-soft), #ffffff) !important;
}

html body.dse-client-portal #content .dse-helpdesk-final-cta::after {
    border-color: rgba(172, 116, 12, .14) !important;
    box-shadow: 0 0 0 32px rgba(240, 184, 40, .04) !important;
}

html body.dse-client-page-index #footer::before {
    background: linear-gradient(90deg, transparent, rgba(240, 184, 40, .72), transparent) !important;
}

/* Public sign-in, request, and ticket-status routes. */
html body.dse-client-portal #content .dse-login-wrap,
html body.dse-client-portal #content .dse-open-ticket,
html body.dse-client-portal #content .dse-view-wrap {
    --dse-navy: var(--dse-2026-navy-950);
    --dse-navy-2: var(--dse-2026-navy-900);
    --dse-border: var(--dse-2026-navy-800);
    --dse-blue: var(--dse-2026-gold);
    --dse-blue-light: var(--dse-2026-gold-highlight);
    --dse-text: var(--dse-2026-muted);
    --dse-soft-text: var(--dse-2026-border);
}

html body.dse-client-portal #content .dse-login-hero,
html body.dse-client-portal #content .dse-open-hero,
html body.dse-client-portal #content .dse-view-hero,
html body.dse-client-portal #content .dse-kb-clean-hero {
    border-color: rgba(240, 184, 40, .28) !important;
    background:
        radial-gradient(circle at 88% 8%, rgba(240, 184, 40, .15), transparent 23rem),
        linear-gradient(135deg, var(--dse-2026-navy-950), var(--dse-2026-navy-900) 58%, var(--dse-2026-navy-800)) !important;
    box-shadow: 0 18px 48px rgba(6, 17, 38, .18) !important;
}

html body.dse-client-portal #content .dse-login-kicker,
html body.dse-client-portal #content .dse-open-kicker,
html body.dse-client-portal #content .dse-view-kicker,
html body.dse-client-portal #content .dse-kb-clean-kicker {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #content .dse-view-wrap .dse-view-kicker {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #content .dse-login-wrap .dse-login-hero .dse-login-kicker,
html body.dse-client-portal #content .dse-open-ticket .dse-open-hero .dse-open-kicker,
html body.dse-client-portal #content .dse-view-wrap .dse-view-hero .dse-view-kicker,
html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-hero .dse-kb-clean-kicker {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #content .dse-login-hero p,
html body.dse-client-portal #content .dse-open-hero p,
html body.dse-client-portal #content .dse-view-hero p,
html body.dse-client-portal #content .dse-kb-clean-hero p {
    color: var(--dse-2026-border) !important;
}

html body.dse-client-portal #content .dse-login-grid .dse-login-label,
html body.dse-client-portal #content .dse-open-grid .dse-open-label,
html body.dse-client-portal #content .dse-view-grid .dse-view-label,
html body.dse-client-portal #content .dse-kb-clean-section-head > span,
html body.dse-client-portal #content .dse-kb-clean-card > span {
    color: #7a5008 !important;
}

html body.dse-client-portal #content .dse-login-field-head a,
html body.dse-client-portal #content .dse-login-form-footer a,
html body.dse-client-portal #content .dse-open-ticket a:not(.dse-open-button) {
    color: var(--dse-2026-navy-800) !important;
}

html body.dse-client-portal #content .dse-login-wrap .dse-login-submit input[type="submit"],
html body.dse-client-portal #content .dse-login-wrap .dse-login-button:not(.secondary),
html body.dse-client-portal #content .dse-view-wrap .dse-access-submit,
html body.dse-client-portal #content .dse-view-wrap .dse-view-button:not(.secondary),
html body.dse-client-portal #content .dse-open-ticket .dse-open-button:not(.secondary),
html body.dse-client-portal #content .dse-open-ticket #ticketForm input[type="submit"],
html body.dse-client-portal #content .dse-kb-clean-search button,
html body.dse-client-portal #content .dse-kb-clean-actions a.is-primary,
html body.dse-client-portal #content .dse-kb-step-link {
    border-color: var(--dse-2026-gold-edge) !important;
    background: linear-gradient(135deg, var(--dse-2026-gold-highlight), var(--dse-2026-gold)) !important;
    color: var(--dse-2026-navy-950) !important;
    box-shadow: 0 12px 28px rgba(172, 116, 12, .24) !important;
}

html body.dse-client-portal #content .dse-login-wrap .dse-login-button.secondary,
html body.dse-client-portal #content .dse-view-wrap .dse-view-button.secondary,
html body.dse-client-portal #content .dse-open-ticket .dse-open-button.secondary {
    border-color: rgba(172, 116, 12, .34) !important;
    background: #ffffff !important;
    color: var(--dse-2026-navy-800) !important;
    box-shadow: none !important;
}

html body.dse-client-portal #content .dse-login-field input:not(.error):focus,
html body.dse-client-portal #content .dse-access-field input:not(.error):focus,
html body.dse-client-portal #content .dse-open-ticket input:not(.error):focus,
html body.dse-client-portal #content .dse-open-ticket textarea:not(.error):focus,
html body.dse-client-portal #content .dse-kb-clean-search input:not(.error):focus {
    border-color: var(--dse-2026-gold) !important;
    outline: 3px solid var(--dse-2026-gold-ring) !important;
    outline-offset: 1px !important;
    box-shadow: 0 0 0 1px var(--dse-2026-navy-950) !important;
}

/* Knowledge base: warm accents on neutral cards, gold actions on navy. */
html body.dse-client-portal #content .dse-kb-shell,
html body.dse-client-portal #content .dse-kb-library {
    --kb-page: var(--dse-2026-canvas);
    --kb-ink: var(--dse-2026-ink);
    --kb-muted: var(--dse-2026-muted);
    --kb-text: #31405a;
    --kb-line: var(--dse-2026-border);
    --kb-border-soft: var(--dse-2026-border);
    --kb-soft: var(--dse-2026-gold-soft);
    --kb-blue: var(--dse-2026-navy-800);
    --kb-blue-2: var(--dse-2026-gold-highlight);
    --kb-navy: var(--dse-2026-navy-950);
}

html body.dse-client-portal #content .dse-kb-clean-search label {
    color: var(--dse-2026-gold-soft) !important;
}

html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-section-head > span,
html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-card span {
    color: #7a5008 !important;
}

html body.dse-client-portal #content .dse-kb-clean-actions a:not(.is-primary) {
    border-color: rgba(240, 184, 40, .22) !important;
    background: rgba(255, 255, 255, .075) !important;
}

html body.dse-client-portal #content .dse-kb-clean-actions a:not(.is-primary):hover {
    border-color: rgba(252, 228, 102, .48) !important;
    background: rgba(240, 184, 40, .11) !important;
}

html body.dse-client-portal #content .dse-kb-clean-actions a.is-primary *,
html body.dse-client-portal #content .dse-kb-step-link * {
    color: var(--dse-2026-navy-950) !important;
}

html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-actions a.is-primary span,
html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-actions a.is-primary strong,
html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-actions a.is-primary em,
html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-actions a.is-primary b {
    color: var(--dse-2026-navy-950) !important;
}

html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-actions a:not(.is-primary) span {
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #content .dse-kb-library .dse-kb-clean-actions a:not(.is-primary) em {
    color: var(--dse-2026-border) !important;
}

html body.dse-client-portal #content .dse-kb-clean-number,
html body.dse-client-portal #content .dse-kb-step-card-head span,
html body.dse-client-portal #content .dse-kb-system-icon,
html body.dse-client-portal #content .dse-kb-system-card.is-featured .dse-kb-system-copy span,
html body.dse-client-portal #content .dse-kb-on-this-page a span,
html body.dse-client-portal #content .dse-kb-section-number {
    border-color: rgba(172, 116, 12, .34) !important;
    background: rgba(240, 184, 40, .14) !important;
    color: var(--dse-2026-navy-800) !important;
}

html body.dse-client-portal #content .dse-kb-visual-number {
    border-color: var(--dse-2026-gold-soft) !important;
    background: var(--dse-2026-gold) !important;
    color: var(--dse-2026-navy-950) !important;
}

html body.dse-client-portal #content .dse-kb-step-list li::before,
html body.dse-client-portal #content .dse-kb-procedure-steps > li::before {
    border-color: rgba(172, 116, 12, .34) !important;
    background: rgba(240, 184, 40, .14) !important;
    color: var(--dse-2026-navy-800) !important;
}

html body.dse-client-portal #content .dse-kb-article-content .dse-kb-summary,
html body.dse-client-portal #content details.dse-kb-section[open] > summary,
html body.dse-client-portal #content .dse-kb-system-card.is-featured {
    border-color: rgba(172, 116, 12, .28) !important;
    background: rgba(240, 184, 40, .10) !important;
    color: var(--dse-2026-ink) !important;
}

html body.dse-client-portal #content .dse-kb-article-content .dse-kb-summary {
    border-left-color: var(--dse-2026-gold-edge) !important;
}

html body.dse-client-portal #content .dse-kb-shell .dse-kb-article:hover,
html body.dse-client-portal #content .dse-kb-shell .dse-kb-article:focus-within,
html body.dse-client-portal #content .dse-kb-clean-card:hover {
    border-color: rgba(172, 116, 12, .38) !important;
    background: var(--dse-2026-gold-soft) !important;
}

html body.dse-client-portal #content .dse-kb-shell .dse-kb-article a,
html body.dse-client-portal #content .dse-kb-shell .dse-kb-side-card a,
html body.dse-client-portal #content .dse-kb-shell .dse-kb-panel a,
html body.dse-client-portal #content .dse-kb-on-this-page a,
html body.dse-client-portal #content .dse-kb-category-card > em,
html body.dse-client-portal #content .dse-kb-system-category-link,
html body.dse-client-portal #content .dse-kb-section-toggle::before,
html body.dse-client-portal #content .dse-kb-breadcrumbs a {
    color: var(--dse-2026-navy-800) !important;
}

html body.dse-client-portal #content .dse-kb-clean-card a {
    border-color: rgba(172, 116, 12, .28) !important;
    background: var(--dse-2026-gold-soft) !important;
    color: var(--dse-2026-navy-800) !important;
}

html body.dse-client-portal #content .dse-kb-category-card > span {
    border-color: rgba(172, 116, 12, .30) !important;
    background: var(--dse-2026-gold-soft) !important;
    color: #7a5008 !important;
}

html body.dse-client-portal #footer .dse-footer-links a,
html body.dse-client-portal #footer .dse-footer-links a:visited {
    border-color: rgba(240, 184, 40, .20) !important;
    background: rgba(240, 184, 40, .07) !important;
    color: var(--dse-2026-gold-highlight) !important;
}

html body.dse-client-portal #footer .dse-footer-links a:hover,
html body.dse-client-portal #footer .dse-footer-links a:focus-visible {
    border-color: rgba(252, 228, 102, .48) !important;
    background: rgba(240, 184, 40, .13) !important;
    color: #ffffff !important;
}

html body.dse-client-portal #content .dse-kb-shell input:not(.error):focus,
html body.dse-client-portal #content .dse-kb-shell select:not(.error):focus,
html body.dse-client-portal #content .dse-kb-shell textarea:not(.error):focus {
    border-color: var(--dse-2026-gold) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px var(--dse-2026-gold-ring) !important;
}

@media (prefers-reduced-motion: reduce) {
    body.dse-client-portal *,
    body.dse-staff-login *,
    .dse-mobile-app * {
        transition-duration: .01ms !important;
    }
}
