/* =========================================================================
   assets/css/lw-a11y.css — Lavawall console accessibility layer
   -------------------------------------------------------------------------
   Loaded by layouts/head-css.php AFTER every other stylesheet, so it wins
   on equal specificity. Paired with:
     assets/js/lw-a11y-early.js  (head: applies saved prefs before first paint)
     assets/js/lw-a11y.js        (end of body: settings dialog, landmarks,
                                  keyboard and name repairs)

   Three layers:
     1. BASELINE  — always on. Fixes that WCAG 2.2 AA requires of every page:
        text contrast (1.4.3), non-text contrast of form controls (1.4.11),
        visible focus (2.4.7), focus not hidden under the fixed top bar
        (2.4.11), minimum target size (2.5.8), skip link (2.4.1), motion
        preference (2.3.3 good practice; supports 2.2.2).
     2. USER PREFERENCES — opt-in from the Accessibility settings dialog:
        text size, large print view, high contrast, underline links, text
        spacing, readable font, reduce motion.
     3. LARGE PRINT VIEW — a responsive single-column layout that keeps
        working at 150-200% text.

   NOTHING here changes on <html> attributes. layouts/layout.js compares the
   <html> attributes with a sessionStorage snapshot and reloads the page on
   any difference, so every switch lives on <body> classes instead, and the
   root font size is set through a <style id="lw-a11y-root"> element.
   ========================================================================= */

/* ---------- 1. BASELINE ------------------------------------------------- */

:root {
    --lw-focus: #0b57d0;          /* 6.9:1 on white, 6.0:1 on #f1f1f1 */
    --lw-focus-on-dark: #ffffff;
    --lw-topbar-clearance: 90px;  /* 70px bar + ticker/shadow + breathing room */
}
html { scroll-padding-top: var(--lw-topbar-clearance); scroll-padding-bottom: 88px; }

/* Skip link (2.4.1). Rendered by layouts/menu.php; hidden until focused. */
.lw-skip-link {
    position: fixed; left: 12px; top: -200px; z-index: 2147483000;
    background: #0b1f33; color: #fff !important; padding: .75rem 1.25rem;
    border-radius: .375rem; font-weight: 600; text-decoration: underline;
    box-shadow: 0 4px 16px rgba(0,0,0,.35);
}
.lw-skip-link:focus, .lw-skip-link:focus-visible { top: 12px; outline: 3px solid #fff !important; outline-offset: 2px; }

/* Visible focus (2.4.7). Beats the "outline:none" rules scattered through
   page CSS; Bootstrap's faint focus shadow stays underneath. */
:focus-visible {
    outline: 3px solid var(--lw-focus) !important;
    outline-offset: 2px !important;
}
.app-menu :focus-visible,
[data-bs-theme="dark"] :focus-visible,
.bg-dark :focus-visible, .bg-primary :focus-visible { outline-color: var(--lw-focus-on-dark) !important; }
[data-sidebar="light"] .app-menu :focus-visible { outline-color: var(--lw-focus) !important; }
/* Programmatic focus targets (skip link destination, headings) */
[tabindex="-1"]:focus:not(:focus-visible) { outline: none !important; }
/* Sidebar collapse links are block-level; keep the ring inside the rail */
.app-menu .nav-link:focus-visible { outline-offset: -3px !important; }

/* Text contrast (1.4.3) — light theme only. The Velzon palette used
   #5ea3cb links (2.8:1), #878a99 muted text (3.0:1 on the page background)
   and pastel text-success/warning/info (1.8-2.6:1). Same hues, darker. */
:root:not([data-bs-theme="dark"]) {
    --vz-link-color: #306b8f;
    --vz-link-color-rgb: 48, 107, 143;
    --vz-link-hover-color: #24536f;
    --vz-link-hover-color-rgb: 36, 83, 111;
    --vz-secondary-color: #666978;      /* muted text & placeholders: 4.8:1 on #f1f1f1 */
    --vz-footer-color: #666978;         /* was #98a6ad on white: 2.5:1 */
    /* "-text-emphasis" colours drive alerts, subtle badges and list-group
       variants - text on a pale tint of the same hue. */
    --vz-primary-text-emphasis: #306b8f;
    --vz-success-text-emphasis: #277235;
    --vz-danger-text-emphasis: #b3432b;
    --vz-warning-text-emphasis: #8a5a00;
    --vz-info-text-emphasis: #1e6b82;
    --vz-secondary-text-emphasis: #4d5ea8;
}
:root:not([data-bs-theme="dark"]) .text-muted:not(.app-menu *):not(.bg-dark *):not(.bg-primary *) { color: #666978 !important; }
:root:not([data-bs-theme="dark"]) .text-primary:not(.app-menu *):not(.btn *):not(.bg-primary *) { color: #306b8f !important; }
:root:not([data-bs-theme="dark"]) .text-success:not(.app-menu *):not(.btn *):not(.bg-success *) { color: #277235 !important; }
:root:not([data-bs-theme="dark"]) .text-danger:not(.app-menu *):not(.btn *):not(.bg-danger *)  { color: #b3432b !important; }
:root:not([data-bs-theme="dark"]) .text-warning:not(.app-menu *):not(.btn *):not(.bg-warning *) { color: #8a5a00 !important; }
:root:not([data-bs-theme="dark"]) .text-info:not(.app-menu *):not(.btn *):not(.bg-info *)    { color: #1e6b82 !important; }
:root:not([data-bs-theme="dark"]) .text-secondary:not(.app-menu *):not(.btn *):not(.bg-secondary *) { color: #4d5ea8 !important; }
:root:not([data-bs-theme="dark"]) .link-primary { color: #306b8f !important; }
:root:not([data-bs-theme="dark"]) .link-danger  { color: #b3432b !important; }
:root:not([data-bs-theme="dark"]) .link-success { color: #277235 !important; }
:root:not([data-bs-theme="dark"]) .form-control::placeholder,
:root:not([data-bs-theme="dark"]) .form-select::placeholder { color: #666978; opacity: 1; }

/* Solid buttons and badges — both themes. White text on the Velzon pastels
   measured 1.8-3.6:1. Fills are deepened where white text reads well and
   switched to dark text where the hue is too light to carry white. */
.btn-primary   { --vz-btn-bg:#306b8f; --vz-btn-border-color:#306b8f; --vz-btn-hover-bg:#24536f; --vz-btn-hover-border-color:#24536f; --vz-btn-active-bg:#1d4560; --vz-btn-active-border-color:#1d4560; --vz-btn-color:#fff; --vz-btn-hover-color:#fff; --vz-btn-active-color:#fff; --vz-btn-disabled-bg:#306b8f; --vz-btn-disabled-border-color:#306b8f; --vz-btn-disabled-color:#fff; }
.btn-secondary { --vz-btn-bg:#4d5ea8; --vz-btn-border-color:#4d5ea8; --vz-btn-hover-bg:#3e4d8e; --vz-btn-hover-border-color:#3e4d8e; --vz-btn-active-bg:#334077; --vz-btn-active-border-color:#334077; --vz-btn-color:#fff; --vz-btn-hover-color:#fff; --vz-btn-active-color:#fff; --vz-btn-disabled-bg:#4d5ea8; --vz-btn-disabled-border-color:#4d5ea8; --vz-btn-disabled-color:#fff; }
.btn-success   { --vz-btn-bg:#277235; --vz-btn-border-color:#277235; --vz-btn-hover-bg:#1f5c2a; --vz-btn-hover-border-color:#1f5c2a; --vz-btn-active-bg:#194b22; --vz-btn-active-border-color:#194b22; --vz-btn-color:#fff; --vz-btn-hover-color:#fff; --vz-btn-active-color:#fff; --vz-btn-disabled-bg:#277235; --vz-btn-disabled-border-color:#277235; --vz-btn-disabled-color:#fff; }
.btn-danger    { --vz-btn-bg:#b3432b; --vz-btn-border-color:#b3432b; --vz-btn-hover-bg:#963722; --vz-btn-hover-border-color:#963722; --vz-btn-active-bg:#7d2e1c; --vz-btn-active-border-color:#7d2e1c; --vz-btn-color:#fff; --vz-btn-hover-color:#fff; --vz-btn-active-color:#fff; --vz-btn-disabled-bg:#b3432b; --vz-btn-disabled-border-color:#b3432b; --vz-btn-disabled-color:#fff; }
.btn-info      { --vz-btn-bg:#1e6b82; --vz-btn-border-color:#1e6b82; --vz-btn-hover-bg:#18586b; --vz-btn-hover-border-color:#18586b; --vz-btn-active-bg:#134858; --vz-btn-active-border-color:#134858; --vz-btn-color:#fff; --vz-btn-hover-color:#fff; --vz-btn-active-color:#fff; --vz-btn-disabled-bg:#1e6b82; --vz-btn-disabled-border-color:#1e6b82; --vz-btn-disabled-color:#fff; }
.btn-warning   { --vz-btn-color:#14171a; --vz-btn-hover-color:#14171a; --vz-btn-active-color:#14171a; --vz-btn-disabled-color:#14171a; }
.badge.bg-primary, .text-bg-primary     { background-color:#306b8f !important; color:#fff !important; }
.badge.bg-secondary, .text-bg-secondary { background-color:#4d5ea8 !important; color:#fff !important; }
.badge.bg-success, .text-bg-success     { background-color:#277235 !important; color:#fff !important; }
.badge.bg-danger, .text-bg-danger       { background-color:#b3432b !important; color:#fff !important; }
.badge.bg-info, .text-bg-info           { background-color:#1e6b82 !important; color:#fff !important; }
.badge.bg-warning, .text-bg-warning     { color:#14171a !important; }
/* Soft / outline / ghost buttons use the base hue as TEXT on a pale tint */
:root:not([data-bs-theme="dark"]) :is(.btn-soft-primary,.btn-outline-primary,.btn-ghost-primary):not(:hover):not(:active):not(.active) { color:#306b8f !important; }
:root:not([data-bs-theme="dark"]) :is(.btn-soft-success,.btn-outline-success,.btn-ghost-success):not(:hover):not(:active):not(.active) { color:#277235 !important; }
:root:not([data-bs-theme="dark"]) :is(.btn-soft-danger,.btn-outline-danger,.btn-ghost-danger):not(:hover):not(:active):not(.active)   { color:#b3432b !important; }
:root:not([data-bs-theme="dark"]) :is(.btn-soft-warning,.btn-outline-warning,.btn-ghost-warning):not(:hover):not(:active):not(.active) { color:#8a5a00 !important; }
:root:not([data-bs-theme="dark"]) :is(.btn-soft-info,.btn-outline-info,.btn-ghost-info):not(:hover):not(:active):not(.active)       { color:#1e6b82 !important; }
:root:not([data-bs-theme="dark"]) :is(.btn-soft-secondary,.btn-outline-secondary,.btn-ghost-secondary):not(:hover):not(:active):not(.active) { color:#4d5ea8 !important; }
:root:not([data-bs-theme="dark"]) :is(.badge.bg-primary-subtle,.badge.bg-success-subtle,.badge.bg-danger-subtle,.badge.bg-warning-subtle,.badge.bg-info-subtle,.badge.bg-secondary-subtle) { font-weight: 600; }

/* Non-text contrast (1.4.11): a text box on a white card was identified only
   by a #ced4da border (1.5:1). */
:root:not([data-bs-theme="dark"]) :is(.form-control,.form-select,.form-check-input,.choices__inner,.select2-container--default .select2-selection) { border-color: #7d838c; }
:root:not([data-bs-theme="dark"]) .form-control:disabled, :root:not([data-bs-theme="dark"]) .form-select:disabled { border-color: #c5c9cf; }

/* Target size (2.5.8): at least 24x24 CSS px for icon-only controls */
.btn-close { min-width: 24px; min-height: 24px; box-sizing: border-box; }
.btn-icon, .btn.btn-sm:has(> i:only-child), .remove-item-btn { min-width: 24px; min-height: 24px; }
.form-check-input { min-width: 1.1rem; min-height: 1.1rem; }
/* Stacked checkboxes/radios: keep centres at least 24px apart (2.5.8 spacing). */
.form-check:not(.form-check-inline) { min-height: 1.625rem; }

/* Click-only spans/icons that lw-a11y.js turned into role=button */
:is(span, i, small, strong, b, em, img)[role="button"][data-lw-a11y] { display: inline-block; min-width: 24px; min-height: 24px; text-align: center; cursor: pointer; }
[role="button"][data-lw-a11y], tr[data-lw-a11y], td[data-lw-a11y], th[data-lw-a11y] { cursor: pointer; }

/* News ticker also pauses while a keyboard user is inside it */
.lw-news-ticker:focus-within .lw-news-ticker-track { animation-play-state: paused; }

/* Motion: honour the OS setting even with no preference saved */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
    .lw-news-ticker-track { animation: none !important; }
}

/* Page name is now an <h1> (layouts/page-title.php); keep the Velzon h4 look.
   rem instead of px so it follows the text-size setting. */
.page-title-box h1 { font-weight: 700; font-size: .9375rem; text-transform: uppercase; line-height: 1.2; margin-top: 0; }

/* Utility used by lw-a11y.js */
.lw-sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }

/* ---------- 2. USER PREFERENCES ---------------------------------------- */

/* Text size: the root size is written by lw-a11y-early.js into
   <style id="lw-a11y-root">. Bootstrap/Velzon size text in rem, so that
   scales most things; the rules below catch the px-sized leftovers. */
body.lw-textscaled .fs-10 { font-size: 0.7500rem !important; }
body.lw-textscaled .fs-11 { font-size: 0.7500rem !important; }
body.lw-textscaled .fs-12 { font-size: 0.7500rem !important; }
body.lw-textscaled .fs-13 { font-size: 0.8125rem !important; }
body.lw-textscaled .fs-14 { font-size: 0.8750rem !important; }
body.lw-textscaled .fs-15 { font-size: 0.9375rem !important; }
body.lw-textscaled .fs-16 { font-size: 1.0000rem !important; }
body.lw-textscaled .fs-17 { font-size: 1.0625rem !important; }
body.lw-textscaled .fs-18 { font-size: 1.1250rem !important; }
body.lw-textscaled .fs-19 { font-size: 1.1875rem !important; }
body.lw-textscaled .fs-20 { font-size: 1.2500rem !important; }
body.lw-textscaled .fs-21 { font-size: 1.3125rem !important; }
body.lw-textscaled .fs-22 { font-size: 1.3750rem !important; }
body.lw-textscaled .fs-23 { font-size: 1.4375rem !important; }
body.lw-textscaled .fs-24 { font-size: 1.5000rem !important; }
body.lw-textscaled [style*="font-size:8px"], body.lw-textscaled [style*="font-size: 8px"] { font-size: 0.8125rem !important; }
body.lw-textscaled [style*="font-size:9px"], body.lw-textscaled [style*="font-size: 9px"] { font-size: 0.8125rem !important; }
body.lw-textscaled [style*="font-size:10px"], body.lw-textscaled [style*="font-size: 10px"] { font-size: 0.8125rem !important; }
body.lw-textscaled [style*="font-size:11px"], body.lw-textscaled [style*="font-size: 11px"] { font-size: 0.8125rem !important; }
body.lw-textscaled [style*="font-size:12px"], body.lw-textscaled [style*="font-size: 12px"] { font-size: 0.8125rem !important; }
body.lw-textscaled [style*="font-size:13px"], body.lw-textscaled [style*="font-size: 13px"] { font-size: 0.8125rem !important; }
body.lw-textscaled [style*="font-size:14px"], body.lw-textscaled [style*="font-size: 14px"] { font-size: 0.8750rem !important; }
body.lw-textscaled [style*="font-size:15px"], body.lw-textscaled [style*="font-size: 15px"] { font-size: 0.9375rem !important; }
body.lw-textscaled [style*="font-size:16px"], body.lw-textscaled [style*="font-size: 16px"] { font-size: 1.0000rem !important; }
body.lw-textscaled [style*="font-size:17px"], body.lw-textscaled [style*="font-size: 17px"] { font-size: 1.0625rem !important; }
body.lw-textscaled [style*="font-size:18px"], body.lw-textscaled [style*="font-size: 18px"] { font-size: 1.1250rem !important; }
body.lw-textscaled [style*="font-size:20px"], body.lw-textscaled [style*="font-size: 20px"] { font-size: 1.2500rem !important; }
body.lw-textscaled [style*="font-size:22px"], body.lw-textscaled [style*="font-size: 22px"] { font-size: 1.3750rem !important; }
body.lw-textscaled [style*="font-size:24px"], body.lw-textscaled [style*="font-size: 24px"] { font-size: 1.5000rem !important; }
/* Scaled text: the top bar may grow. Velzon hard-codes 70px of clearance
   above the content, so lw-a11y.js measures the real bar into --lw-topbar-h. */
body.lw-textscaled .navbar-header { height: auto; min-height: 70px; }
body.lw-textscaled .page-content { padding-top: calc(var(--lw-topbar-h, 70px) + 1.5rem); }
body.lw-textscaled { scroll-padding-top: calc(var(--lw-topbar-h, 70px) + 20px); }


/* Underline links (1.4.1 support: links distinguished by more than colour) */
body.lw-underline a:not(.btn):not(.nav-link):not(.dropdown-item):not(.logo):not(.menu-link) { text-decoration: underline !important; text-underline-offset: .18em; }
/* Links inside running text are always distinguishable, even with no preference */
:is(p, li, td, .card-text, .alert) > a:not(.btn):not(.badge):not(.nav-link):not(.dropdown-item) { text-decoration: underline; text-underline-offset: .18em; }

/* Text spacing (1.4.12 values) */
body.lw-spacing, body.lw-spacing * { line-height: 1.5 !important; letter-spacing: .12em !important; word-spacing: .16em !important; }
body.lw-spacing p { margin-bottom: 2em !important; }
body.lw-spacing i[class*="ri-"], body.lw-spacing i[class*="mdi"], body.lw-spacing i[class*="bx"], body.lw-spacing i[class*="fa"] { letter-spacing: 0 !important; word-spacing: 0 !important; }

/* Readable font */
body.lw-readable, body.lw-readable :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,p,span,div,td,th,li,a,button,input,select,textarea,label,small,strong,b,em) {
    font-family: Verdana, "Segoe UI", Tahoma, system-ui, sans-serif !important;
}

/* Reduce motion (explicit preference, independent of the OS setting) */
body.lw-reduce-motion *, body.lw-reduce-motion *::before, body.lw-reduce-motion *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
}
body.lw-reduce-motion .lw-news-ticker-track { animation: none !important; }
body.lw-reduce-motion .lw-news-ticker-window { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }

/* High contrast (G174 contrast switcher). Light and dark variants. */
body.lw-hc {
    --vz-body-color: #000; --vz-body-bg: #fff; --vz-secondary-bg: #fff; --vz-card-bg: #fff;
    --vz-secondary-color: #1a1a1a; --vz-border-color: #000; --vz-link-color: #0040a0; --vz-link-color-rgb: 0, 64, 160;
    --vz-header-bg: #fff; --vz-footer-bg: #fff; --vz-footer-color: #000;
    background: #fff !important; color: #000 !important;
}
body.lw-hc :is(.card, .modal-content, .dropdown-menu, .page-title-box, .footer, #page-topbar, .table, .list-group-item, .accordion-item) {
    background-color: #fff !important; color: #000 !important; border: 1px solid #000 !important; box-shadow: none !important;
}
body.lw-hc :is(.text-muted, .text-secondary, .text-body-secondary, .form-text, small) { color: #1a1a1a !important; }
body.lw-hc :is(.form-control, .form-select, .form-check-input, .choices__inner) { border: 2px solid #000 !important; background-color: #fff !important; color: #000 !important; }
body.lw-hc a:not(.btn):not(.nav-link):not(.dropdown-item) { color: #0040a0 !important; text-decoration: underline !important; }
body.lw-hc .btn:not(.btn-close) { border-width: 2px !important; border-color: #000 !important; }
body.lw-hc :is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-info,.btn-dark) { background-color: #000 !important; color: #fff !important; }
body.lw-hc :is(.btn-light,.btn-warning,[class*="btn-soft-"],[class*="btn-ghost-"],[class*="btn-outline-"]) { background-color: #fff !important; color: #000 !important; }
body.lw-hc .badge { background-color: #000 !important; color: #fff !important; border: 1px solid #000; }
body.lw-hc :is(.bg-light, [class*="-subtle"], .bg-body-tertiary, .table-light, thead) { background-color: #fff !important; color: #000 !important; }
body.lw-hc .table > :not(caption) > * > * { border-color: #000 !important; color: #000 !important; background-color: #fff !important; box-shadow: none !important; }
body.lw-hc .alert { background: #fff !important; color: #000 !important; border: 2px solid #000 !important; }
body.lw-hc .app-menu { --vz-vertical-menu-bg: #000; --vz-vertical-menu-item-color: #fff; --vz-vertical-menu-sub-item-color: #fff; --vz-vertical-menu-title-color: #fff; background: #000 !important; }
body.lw-hc .app-menu a { color: #fff !important; }
body.lw-hc :focus-visible { outline: 4px solid #d10000 !important; outline-offset: 2px !important; }
body.lw-hc .app-menu :focus-visible { outline-color: #ffd400 !important; }
[data-bs-theme="dark"] body.lw-hc {
    --vz-body-color: #fff; --vz-body-bg: #000; --vz-secondary-bg: #000; --vz-card-bg: #000; --vz-secondary-color: #f0f0f0;
    --vz-border-color: #fff; --vz-link-color: #9fd0ff; --vz-link-color-rgb: 159, 208, 255; --vz-header-bg: #000; --vz-footer-bg: #000; --vz-footer-color: #fff;
    background: #000 !important; color: #fff !important;
}
[data-bs-theme="dark"] body.lw-hc :is(.card, .modal-content, .dropdown-menu, .page-title-box, .footer, #page-topbar, .table, .list-group-item, .accordion-item, .bg-light, [class*="-subtle"], .table-light, thead, .alert),
[data-bs-theme="dark"] body.lw-hc .table > :not(caption) > * > * { background-color: #000 !important; color: #fff !important; border-color: #fff !important; }
[data-bs-theme="dark"] body.lw-hc :is(.text-muted, .text-secondary, .form-text, small) { color: #f0f0f0 !important; }
[data-bs-theme="dark"] body.lw-hc :is(.form-control, .form-select, .choices__inner) { background-color: #000 !important; color: #fff !important; border-color: #fff !important; }
[data-bs-theme="dark"] body.lw-hc a:not(.btn):not(.nav-link):not(.dropdown-item) { color: #9fd0ff !important; }
[data-bs-theme="dark"] body.lw-hc :is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-info,.btn-dark) { background-color: #fff !important; color: #000 !important; border-color: #fff !important; }
[data-bs-theme="dark"] body.lw-hc :is(.btn-light,.btn-warning,[class*="btn-soft-"],[class*="btn-ghost-"],[class*="btn-outline-"]) { background-color: #000 !important; color: #fff !important; border-color: #fff !important; }
[data-bs-theme="dark"] body.lw-hc .badge { background-color: #fff !important; color: #000 !important; }
[data-bs-theme="dark"] body.lw-hc :focus-visible { outline-color: #ffd400 !important; }

/* ---------- 3. LARGE PRINT VIEW (body.lw-lp) --------------------------- */
/* The off-canvas sidebar is its own class, body.lw-lpnav, because it is also
   used on its own at 175% text and above: a 250px rail cannot hold menu labels
   at that size (they wrap and clip), so the menu moves behind the hamburger. */
/* A reflowing, single-column layout for 150-200% text:
   - the sidebar becomes an off-canvas menu opened by the hamburger
   - content uses the full width; columns stack
   - controls grow to at least 44x44
   - tables keep their structure and scroll sideways inside their card
     (1.4.10 permits two-dimensional scrolling for data tables) */
body.lw-lp { line-height: 1.6; }
body.lw-lpnav .app-menu {
    width: min(22rem, 92vw) !important; margin-left: 0 !important;
    transform: translateX(-105%); transition: transform .15s ease-out;
    z-index: 1005 !important; visibility: hidden;
}
body.lw-lpnav.lw-lp-nav-open .app-menu { transform: none; visibility: visible; }
body.lw-lpnav .app-menu .navbar-nav .nav-link, body.lw-lpnav .app-menu .menu-title span { font-size: 1rem !important; }
body.lw-lpnav .app-menu .menu-link span, body.lw-lpnav .app-menu .nav-link span { display: inline !important; }
body.lw-lpnav .app-menu .menu-dropdown { position: static !important; display: none; width: auto !important; box-shadow: none !important; padding-left: 1rem; background: transparent !important; }
body.lw-lpnav .app-menu .menu-dropdown.show { display: block; }
body.lw-lpnav .lw-lp-overlay { display: none; }
body.lw-lpnav.lw-lp-nav-open .lw-lp-overlay { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1004; }
body.lw-lpnav .main-content { margin-left: 0 !important; }
body.lw-lpnav #page-topbar { left: 0 !important; }
body.lw-lpnav .footer { left: 0 !important; }
body.lw-lp .footer { position: static; height: auto; }
body.lw-lpnav .navbar-brand-box.horizontal-logo { display: none !important; }
body.lw-lp .lw-news-ticker-host { display: none !important; }
body.lw-lp .page-content { padding-top: calc(var(--lw-topbar-h, 70px) + 1.25rem); padding-bottom: 2rem; }
body.lw-lp .page-title-box { flex-wrap: wrap; gap: .75rem; height: auto; }
body.lw-lp .page-title-box > * { max-width: 100%; }

/* Columns stack: everything below 1600px goes single column, wider screens
   get at most two columns. */
body.lw-lp .row > [class*="col-"] { flex: 0 0 100% !important; max-width: 100% !important; width: 100% !important; }
@media (min-width: 1600px) {
    body.lw-lp .row > :is([class*="col-xl-"],[class*="col-xxl-"],[class*="col-lg-"]):not([class*="col-xl-12"]):not([class*="col-lg-12"]):not([class*="col-xxl-12"]) { flex: 0 0 50% !important; max-width: 50% !important; width: 50% !important; }
}
body.lw-lp .row-cols-1 > *, body.lw-lp [class*="row-cols-"] > * { flex: 0 0 100% !important; max-width: 100% !important; }
body.lw-lp .d-flex:not(.navbar-header):not(.navbar-header *):not(.btn):not(.input-group) { flex-wrap: wrap; }
body.lw-lp .card-body, body.lw-lp .tab-content, body.lw-lp .modal-body { overflow-x: auto; }
body.lw-lp table { font-size: 1rem; }
body.lw-lp .table > :not(caption) > * > * { padding: .75rem .75rem; }
body.lw-lp :is(td, th) { overflow-wrap: break-word; }
body.lw-lp .modal-dialog { max-width: min(96vw, 64rem) !important; margin: 1rem auto; }
body.lw-lp .modal-dialog.modal-xl { max-width: 96vw !important; }
body.lw-lp .dropdown-menu { font-size: 1rem; max-width: 96vw; }

/* 44x44 targets (2.5.5-level comfort) */
body.lw-lp :is(.btn, .form-control, .form-select, .page-link, .nav-link, .dropdown-item) { min-height: 44px; }
body.lw-lp .btn { padding: .55rem 1rem; }
body.lw-lp :is(.btn-icon, .btn-close, .btn.btn-sm:has(> i:only-child)) { min-width: 44px; min-height: 44px; }
body.lw-lp .form-check-input { width: 1.5rem; height: 1.5rem; margin-top: .1rem; }
body.lw-lp .form-check { padding-left: 2.1rem; min-height: 1.75rem; }
body.lw-lp .form-check .form-check-input { margin-left: -2.1rem; }
body.lw-lp .form-switch .form-check-input { width: 2.75rem; }
body.lw-lp :is(label, .form-label) { font-weight: 600; }
body.lw-lp a:not(.btn):not(.nav-link):not(.dropdown-item):not(.logo) { text-decoration: underline; text-underline-offset: .18em; }

/* Charts: let them shrink to the column instead of forcing sideways scroll */
body.lw-lp :is(.apexcharts-canvas, canvas, svg.apexcharts-svg) { max-width: 100% !important; }

/* ---------- Accessibility settings dialog ------------------------------ */
.lw-a11y-btn i { font-size: 22px; }
.lw-a11y-fab {
    position: fixed; right: 16px; bottom: 16px; z-index: 1070; width: 48px; height: 48px; border-radius: 50%;
    border: 2px solid #fff; background: #306b8f; color: #fff; display: flex; align-items: center; justify-content: center;
    box-shadow: 0 3px 12px rgba(0,0,0,.3); font-size: 24px;
}
dialog.lw-a11y-dialog {
    width: min(34rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); overflow: auto;
    border: 0; border-radius: .6rem; padding: 0; color: var(--vz-body-color, #212529);
    background: var(--vz-secondary-bg, #fff); box-shadow: 0 12px 40px rgba(0,0,0,.35);
    font-size: 1rem; line-height: 1.5;
}
dialog.lw-a11y-dialog::backdrop { background: rgba(0,0,0,.5); }
.lw-a11y-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--vz-border-color, #dee2e6); }
.lw-a11y-dialog h2 { font-size: 1.25rem; margin: 0; }
.lw-a11y-dialog .lw-a11y-body { padding: 1rem 1.25rem; }
.lw-a11y-dialog fieldset { border: 0; padding: 0; margin: 0 0 1.25rem; }
.lw-a11y-dialog legend { font-size: 1rem; font-weight: 600; margin-bottom: .5rem; float: none; width: auto; }
.lw-a11y-dialog .lw-a11y-sizes { display: flex; flex-wrap: wrap; gap: .5rem; }
.lw-a11y-dialog .lw-a11y-sizes label {
    display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .4rem .8rem;
    border: 2px solid #7d838c; border-radius: .4rem; cursor: pointer;
}
.lw-a11y-dialog .lw-a11y-sizes input:checked + span { font-weight: 700; }
.lw-a11y-dialog .lw-a11y-sizes label:has(input:checked) { border-color: var(--lw-focus); background: rgba(11,87,208,.08); }
.lw-a11y-dialog .lw-a11y-toggle { display: flex; align-items: flex-start; gap: .75rem; padding: .6rem 0; border-top: 1px solid var(--vz-border-color, #e9ebec); }
.lw-a11y-dialog .lw-a11y-toggle input { width: 1.4rem; height: 1.4rem; margin-top: .15rem; flex: 0 0 auto; }
.lw-a11y-dialog .lw-a11y-toggle label { font-weight: 600; cursor: pointer; }
.lw-a11y-dialog .lw-a11y-hint { display: block; font-weight: 400; font-size: .9rem; color: var(--vz-secondary-color, #666978); }
.lw-a11y-dialog footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; padding: 1rem 1.25rem; border-top: 1px solid var(--vz-border-color, #dee2e6); }
.lw-a11y-dialog .lw-a11y-close { min-width: 44px; min-height: 44px; }
.lw-a11y-dialog .lw-a11y-note { font-size: .875rem; color: var(--vz-secondary-color, #666978); margin: 0; }
body.lw-hc dialog.lw-a11y-dialog { border: 2px solid currentColor; }

@media print {
    .lw-skip-link, .lw-a11y-fab, dialog.lw-a11y-dialog { display: none !important; }
}


/* ---------- Round 2 fixes (2026-09-24) --------------------------------- */

/* Top-bar count badges at larger text. Velzon hangs each badge off the icon's
   corner (position:absolute + translate-middle) on a fixed 42px circle, so a
   scaled "99+" spilled over the neighbouring icons. While text is scaled the
   badge sits inline after its icon and the button grows to fit it. */
body.lw-textscaled #page-topbar .btn-topbar:has(.topbar-badge) {
    width: auto !important; min-width: 2.625rem; padding: 0 .4rem;
    display: inline-flex; align-items: center; justify-content: center; gap: .15rem;
    border-radius: 1.5rem !important;
}
body.lw-textscaled #page-topbar .topbar-badge {
    position: static !important; transform: none !important; inset: auto !important;
    margin: 0 !important; font-size: .7rem !important; line-height: 1.1; padding: .2em .45em !important;
    align-self: flex-start; margin-top: .35rem !important;
}
body.lw-textscaled #page-topbar .header-item { flex-shrink: 0; }
body.lw-textscaled #page-topbar .navbar-header > .d-flex:last-child { gap: .15rem; }

/* 115-150%: widen the sidebar with the text (capped) so labels are not clipped.
   At 175%+ it is off-canvas instead (body.lw-lpnav above). */
body.lw-textscaled:not(.lw-lpnav) { --vz-vertical-menu-width: min(calc(250px * var(--lw-scale, 1)), 340px); }

/* High contrast: the checked state must survive the white-fill override.
   Bootstrap draws the tick / dot / knob as a white SVG on the accent fill,
   so the fill goes black (light) and the glyph goes black on white (dark). */
body.lw-hc .form-check-input:checked,
body.lw-hc .form-check-input[type="checkbox"]:indeterminate {
    background-color: #000 !important; border-color: #000 !important;
}
body.lw-hc .form-check-input:focus { box-shadow: none !important; }
body.lw-hc :is(.btn-check:checked + .btn, .btn-check:active + .btn, .btn.active, .nav-link.active, .page-item.active .page-link, .list-group-item.active, .dropdown-item.active) {
    background-color: #000 !important; color: #fff !important; border-color: #000 !important;
    outline: 2px solid #000; outline-offset: 1px;
}
[data-bs-theme="dark"] body.lw-hc .form-check-input:checked[type="checkbox"] {
    background-color: #fff !important; border-color: #fff !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
}
[data-bs-theme="dark"] body.lw-hc .form-check-input:checked[type="radio"] {
    background-color: #fff !important; border-color: #fff !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23000'/%3e%3c/svg%3e") !important;
}
[data-bs-theme="dark"] body.lw-hc .form-switch .form-check-input:checked {
    background-color: #fff !important; border-color: #fff !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23000'/%3e%3c/svg%3e") !important;
}
[data-bs-theme="dark"] body.lw-hc :is(.btn-check:checked + .btn, .btn-check:active + .btn, .btn.active, .nav-link.active, .page-item.active .page-link, .list-group-item.active, .dropdown-item.active) {
    background-color: #fff !important; color: #000 !important; border-color: #fff !important; outline-color: #fff;
}
/* Unchecked boxes keep a strong edge so checked vs unchecked is a fill difference */
body.lw-hc .form-check-input:not(:checked) { background-image: none !important; }
[data-bs-theme="dark"] body.lw-hc .form-check-input:not(:checked) { background-color: #000 !important; border-color: #fff !important; }
[data-bs-theme="dark"] body.lw-hc .form-switch .form-check-input:not(:checked) {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}
body.lw-hc .form-switch .form-check-input:not(:checked) {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23000'/%3e%3c/svg%3e") !important;
}

/* Reduced motion: the ticker stops and becomes a hand-scrolled row, which adds
   a scrollbar inside the 34px strip and squeezed the headlines. Give the row
   more height, lift the text toward the top of the bar, and let the scrollbar
   sit underneath it. The duplicate copy that makes the marquee loop is hidden. */
body.lw-reduce-motion .lw-news-ticker.lw-news-ticker-on { height: 56px; margin-top: 0; margin-bottom: 0; align-self: center; }
body.lw-reduce-motion .lw-news-ticker-window {
    height: 56px; overflow-x: auto; overflow-y: hidden; padding-top: 0;
    -webkit-mask-image: none; mask-image: none; scrollbar-width: thin;
}
body.lw-reduce-motion .lw-news-ticker-track { position: static; height: 40px; padding-top: 0; margin-top: 0; animation: none !important; transform: none !important; }
body.lw-reduce-motion #lwNewsTickerClone { display: none !important; }
@media (prefers-reduced-motion: reduce) {
    html body .lw-news-ticker.lw-news-ticker-on { height: 56px; margin-top: 0; margin-bottom: 0; align-self: center; }
    html body .lw-news-ticker-window { height: 56px; overflow-x: auto; overflow-y: hidden; padding-top: 0; -webkit-mask-image: none; mask-image: none; scrollbar-width: thin; }
    html body .lw-news-ticker-track { position: static; height: 40px; padding-top: 0; margin-top: 0; animation: none !important; transform: none !important; }
    html body #lwNewsTickerClone { display: none !important; }
}

/* Phone / tablet top bar at standard text size. Velzon hangs each count badge
   past the right edge of its 42px button (right:-9px), and the header items are
   only 4px apart, so on a narrow bar "19" and "99+" sat on top of the next icon.
   Pull the badge back over its own button and give a button that carries a
   visible badge a little more room on its right. */
@media (max-width: 991.98px) {
    body:not(.lw-textscaled) #page-topbar .header-item:has(.topbar-badge:not(.d-none):not([style*="display:none"]):not([style*="display: none"])) {
        margin-right: .55rem;
    }
    body:not(.lw-textscaled) #page-topbar .topbar-badge {
        right: -4px !important; left: auto !important; top: 2px !important;
        transform: none !important;
        font-size: 10px; min-width: 18px; padding: .2em .4em;
    }
}

/* Phones: the icon gap is tighter (lw-topbar.css), so the badge stays fully
   inside its own button rather than hanging 4px into the next one. */
@media (max-width: 575.98px) {
    body:not(.lw-textscaled) #page-topbar .topbar-badge { right: 0 !important; top: 0 !important; }
}

/* ---------- Cards keep their content inside (WCAG 1.4.10 Reflow) -------------
   Velzon's card header is `card-header d-flex align-items-center` with the
   title as flex-grow-1 and the action ("Review All", "View all") as
   flex-shrink-0. On a phone neither can give way, so the button ran out of
   the card's right edge and long titles did too. The header now wraps: the
   action drops under the title when the two do not fit side by side.

   Tables inside cards: lw-a11y.js wraps a table that is wider than its card
   in a .table-responsive scroller (and makes that scroller keyboard-
   focusable), so its column headings stay inside the card instead of
   spilling over the next one. */
.card { min-width: 0; }
.card-header.d-flex,
.card-header > .d-flex {
    flex-wrap: wrap;
    row-gap: .5rem;
    column-gap: .5rem;
}
.card-header .card-title,
.card-header h1, .card-header h2, .card-header h3,
.card-header h4, .card-header h5, .card-header h6 {
    min-width: 0;
    overflow-wrap: break-word;
}
.card-header .flex-shrink-0 { max-width: 100%; }
@media (max-width: 575.98px) {
    .card-header .card-title.flex-grow-1 { flex-basis: 12rem; }
    .card-header .btn { white-space: normal; }
}
.table-responsive[data-lw-a11y="auto"] { max-width: 100%; }
.table-responsive[data-lw-a11y="auto"]:focus-visible { outline: 3px solid var(--lw-focus, #1d4ed8); outline-offset: 2px; }
