/*
 * Last-cascade visibility guard.
 * Loaded at the end of each interactive shell so late inline Blade styles
 * cannot leave headings or supporting section copy without contrast.
 */
:root {
    --tms-guard-heading: #071a3d;
    --tms-guard-heading-on-dark: #f8fbff;
    --tms-guard-copy: #40546d;
    --tms-guard-copy-on-dark: #d9e8f8;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) :is(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .page-title,
    .card-title,
    .panel-title,
    .section-title,
    [class$="-title"],
    [class*="-title "],
    [class$="-heading"],
    [class*="-heading "],
    [class$="-headline"],
    [class*="-headline "],
    p,
    small,
    .subtitle,
    .description,
    .help-text,
    .note,
    .hint,
    [class$="-subtitle"],
    [class*="-subtitle "],
    [class$="-sub"],
    [class*="-sub "],
    [class$="-copy"],
    [class*="-copy "],
    [class$="-kicker"],
    [class*="-kicker "],
    [class$="-eyebrow"],
    [class*="-eyebrow "]
) {
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    letter-spacing: 0 !important;
}

/* Only explicitly dark surfaces receive a CSS fallback. Class names such as
 * *-hero are not a color contract; many pages intentionally use light heroes.
 */
:is(.tms-content-inner, .tms-portal-main) :is(
    .ui-surface-dark,
    [data-ui-tone="dark"],
    .bg-dark,
    .bg-black,
    .bg-slate-900,
    .bg-slate-950,
    .bg-gray-900,
    .bg-gray-950,
    .bg-blue-900,
    .bg-blue-950,
    .bg-indigo-900,
    .bg-indigo-950
) :is(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .page-title,
    .card-title,
    .panel-title,
    .section-title,
    [class$="-title"],
    [class*="-title "],
    [class$="-heading"],
    [class*="-heading "],
    [class$="-headline"],
    [class*="-headline "]
) {
    color: var(--tms-guard-heading-on-dark) !important;
    -webkit-text-fill-color: var(--tms-guard-heading-on-dark) !important;
}

:is(.tms-content-inner, .tms-portal-main) :is(
    .ui-surface-dark,
    [data-ui-tone="dark"],
    .bg-dark,
    .bg-black,
    .bg-slate-900,
    .bg-slate-950,
    .bg-gray-900,
    .bg-gray-950,
    .bg-blue-900,
    .bg-blue-950,
    .bg-indigo-900,
    .bg-indigo-950
) :is(
    p,
    small,
    .subtitle,
    .description,
    .help-text,
    .note,
    .hint,
    [class$="-subtitle"],
    [class*="-subtitle "],
    [class$="-sub"],
    [class*="-sub "],
    [class$="-copy"],
    [class*="-copy "],
    [class$="-kicker"],
    [class*="-kicker "],
    [class$="-eyebrow"],
    [class*="-eyebrow "]
) {
    color: var(--tms-guard-copy-on-dark) !important;
    -webkit-text-fill-color: var(--tms-guard-copy-on-dark) !important;
}

/* Explicitly light nested panels remain dark even inside a dark surface. */
:is(.tms-content-inner, .tms-portal-main) :is(
    .ui-surface-light,
    [data-ui-tone="light"],
    .card,
    .tms-card,
    .panel,
    .box,
    .modal-content,
    .dropdown-menu
) :is(h1, h2, h3, h4, h5, h6, .card-title, .panel-title, .section-title) {
    color: var(--tms-guard-heading) !important;
    -webkit-text-fill-color: var(--tms-guard-heading) !important;
}

:is(.tms-content-inner, .tms-portal-main) :is(
    .ui-surface-light,
    [data-ui-tone="light"],
    .card,
    .tms-card,
    .panel,
    .box,
    .modal-content,
    .dropdown-menu
) :is(p, small, .subtitle, .description, .help-text, .note, .hint) {
    color: var(--tms-guard-copy) !important;
    -webkit-text-fill-color: var(--tms-guard-copy) !important;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) .text-white:not([data-tms-contrast-tone="dark"]) {
    color: var(--tms-guard-heading-on-dark) !important;
    -webkit-text-fill-color: var(--tms-guard-heading-on-dark) !important;
}

/* The audit writes the real measured surface tone. These rules intentionally
 * follow page and utility fallbacks so actual contrast always wins.
 */
:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) [data-tms-contrast-tone="dark"] {
    color: var(--tms-guard-heading) !important;
    -webkit-text-fill-color: var(--tms-guard-heading) !important;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) [data-tms-contrast-tone="light"] {
    color: var(--tms-guard-heading-on-dark) !important;
    -webkit-text-fill-color: var(--tms-guard-heading-on-dark) !important;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) [data-tms-contrast-role="copy"][data-tms-contrast-tone="dark"] {
    color: var(--tms-guard-copy) !important;
    -webkit-text-fill-color: var(--tms-guard-copy) !important;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) [data-tms-contrast-role="copy"][data-tms-contrast-tone="light"] {
    color: var(--tms-guard-copy-on-dark) !important;
    -webkit-text-fill-color: var(--tms-guard-copy-on-dark) !important;
}

/* Button labels inherit the button's tested foreground instead of section rules. */
:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) :is(
    a.btn,
    button.btn,
    .button,
    [class$="-btn"],
    [class*="-btn "],
    [class$="-button"],
    [class*="-button "]
) :is(h1, h2, h3, h4, h5, h6, p, span, strong, b, small, [class$="-title"], [class*="-title "]) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) :is(
    .btn-primary,
    .btn-success,
    .btn-danger,
    .btn-dark,
    [class$="-btn-primary"],
    [class*="-btn-primary "],
    [class$="-btn-success"],
    [class*="-btn-success "],
    [class$="-btn-danger"],
    [class*="-btn-danger "],
    [class$="-btn-dark"],
    [class*="-btn-dark "]
) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

:is(.tms-content-inner, .tms-portal-main, .ct-auth-content) :is(
    .btn-light,
    .btn-white,
    .btn-outline-primary,
    .btn-outline-secondary,
    [class$="-btn-light"],
    [class*="-btn-light "],
    [class$="-btn-soft"],
    [class*="-btn-soft "],
    [class$="-btn-outline"],
    [class*="-btn-outline "]
) {
    color: #173758 !important;
    -webkit-text-fill-color: #173758 !important;
}

/* Restore the current page title hidden by the compact legacy top bar. */
body.tms-admin-body .tms-shell-topbar .tms-topbar-left > div,
body.tms-admin-body .tms-topbar .tms-topbar-left > div {
    display: block !important;
    min-width: 0;
}

body.tms-admin-body :is(.tms-shell-topbar, .tms-topbar) .tms-topbar-title {
    display: block !important;
    max-width: min(34vw, 430px);
    margin: 0 !important;
    overflow: hidden;
    color: var(--tms-guard-heading) !important;
    -webkit-text-fill-color: var(--tms-guard-heading) !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.tms-admin-body :is(.tms-shell-topbar, .tms-topbar) .tms-topbar-kicker {
    display: none !important;
}

body.tms-admin-body .ct-sidebar :is(.ct-nav-link, .ct-submenu-link, .ct-grandmenu-link).active,
body.tms-admin-body .ct-sidebar :is(.ct-nav-link, .ct-submenu-link, .ct-grandmenu-link).active:visited {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: #0b63ce !important;
}

body.tms-admin-body .ct-sidebar :is(.ct-nav-link, .ct-submenu-link, .ct-grandmenu-link).active :is(span, strong, small, em) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 760px) {
    body.tms-admin-body :is(.tms-shell-topbar, .tms-topbar) .tms-topbar-title {
        max-width: 38vw;
        font-size: 14px !important;
    }
}