/* THRS V14.3 — Premium Header, Sidebar, Controls & Modal System
 * Global shared visual language.  Visual CSS only; no layout, RBAC, API,
 * form validation, button event handling, modal focus/escape handling changed.
 * Use independent root theme variables so Modal portals inherit them.
 */
html[data-theme="light"] {
 --p143-header:#fbfcff;
 --p143-head-ink:#193653;
 --p143-head-muted:#526b85;
 --p143-head-line:#d6e1ec;
 --p143-control:#ffffff;
 --p143-control-hover:#f1f5fa;
 --p143-control-ink:#17334e;
 --p143-control-border:#cbd9e7;
 --p143-surface:#ffffff;
 --p143-surface-raised:#f5f8fc;
 --p143-modal-line:#d2deea;
 --p143-focus:#a87930;
 --p143-ring:0 0 0 3px rgba(189,139,55,.23);
 --p143-shadow:0 12px 31px rgba(11,39,73,.10);
 --p143-modal-shadow:0 28px 84px rgba(7,28,56,.27);
 --p143-gold:#91601f;
 --p143-navy:#102e50;
 --p143-sidebar:#071b30;
 --p143-sidebar-mid:#0c2c4a;
 --p143-sidebar-muted:#b9cee4;
 --p143-sidebar-label:#dbe8f5;
 --p143-backdrop:rgba(7,22,41,.66);
 color-scheme:light;
}
html[data-theme="dark"] {
 --p143-header:#0f273d;
 --p143-head-ink:#f2f7fe;
 --p143-head-muted:#c2d2e6;
 --p143-head-line:#486986;
 --p143-control:#183751;
 --p143-control-hover:#21445f;
 --p143-control-ink:#f3f8ff;
 --p143-control-border:#607f9a;
 --p143-surface:#102b44;
 --p143-surface-raised:#193b59;
 --p143-modal-line:#4e718f;
 --p143-focus:#f1cc82;
 --p143-ring:0 0 0 3px rgba(236,194,116,.25);
 --p143-shadow:0 12px 31px rgba(0,0,0,.29);
 --p143-modal-shadow:0 28px 88px rgba(0,0,0,.62);
 --p143-gold:#f1d18b;
 --p143-navy:#102d49;
 --p143-sidebar:#061625;
 --p143-sidebar-mid:#0a243c;
 --p143-sidebar-muted:#c2d4e7;
 --p143-sidebar-label:#e3effa;
 --p143-backdrop:rgba(1,8,18,.79);
 color-scheme:dark;
}
/* Header: raised, clear, yet never changes existing fixed position/height. */
html[data-theme="light"] .thrs-shell > .thrs-header {
 background:linear-gradient(115deg,#ffffff,#f4f8fd) !important;
 border-block-end:1px solid var(--p143-head-line) !important;
 box-shadow:0 4px 24px rgba(11,40,76,.075) !important;
 color:var(--p143-head-ink);
 backdrop-filter:blur(18px) saturate(1.15);
}
html[data-theme="dark"] .thrs-shell > .thrs-header {
 background:linear-gradient(115deg,#142f49,#0c2137) !important;
 border-block-end:1px solid var(--p143-head-line) !important;
 box-shadow:0 5px 28px rgba(0,0,0,.32) !important;
 color:var(--p143-head-ink);
 backdrop-filter:blur(18px) saturate(1.15);
}
html[data-theme] .thrs-shell > .thrs-header .thrs-header-brand {
 gap:9px;
 min-width:0;
}
html[data-theme] .thrs-shell > .thrs-header .thrs-brand-logo {
 object-fit:contain;
 filter:drop-shadow(0 2px 6px rgba(192,154,79,.18));
}
html[data-theme] .thrs-shell > .thrs-header .thrs-header-brand h1 {
 font-size:16px !important;
 font-weight:850 !important;
 letter-spacing:-.022em;
 color:var(--p143-head-ink) !important;
 text-shadow:none !important;
}
html[data-theme] .thrs-shell > .thrs-header .thrs-header-controls {
 gap:8px !important;
 align-items:center;
}
html[data-theme] .thrs-shell > .thrs-header .thrs-header-user-name {
 color:var(--p143-head-ink) !important;
 font-size:13px !important;
 font-weight:790 !important;
}
html[data-theme] .thrs-shell > .thrs-header .thrs-header-user-role {
 color:var(--p143-head-muted) !important;
 font-size:11px !important;
 font-weight:640 !important;
}
/* Native header controls: preserve purpose-specific icon colors/icons. */
html[data-theme] .thrs-shell > .thrs-header :is(.thrs-icon-button,.thrs-logout-btn) {
 border:1px solid var(--p143-control-border) !important;
 background:var(--p143-control) !important;
 color:var(--p143-control-ink) !important;
 border-radius:12px !important;
 box-shadow:0 5px 14px rgba(13,39,67,.09) !important;
 min-height:39px !important;
 transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
html[data-theme] .thrs-shell > .thrs-header :is(.thrs-icon-button,.thrs-logout-btn):hover:not(:disabled) {
 background:var(--p143-control-hover) !important;
 border-color:var(--p143-focus) !important;
 box-shadow:var(--p143-shadow) !important;
 transform:translateY(-1px);
}
html[data-theme] .thrs-shell > .thrs-header .thrs-user-avatar {
 border-radius:12px !important;
 border:1px solid #d8af6a !important;
 background:linear-gradient(145deg,#173b60,#081f38) !important;
 color:#fff !important;
 font-size:12.5px !important;
 font-weight:800 !important;
 box-shadow:0 6px 17px rgba(6,26,49,.22) !important;
}
/* Sidebar: all roles share the same visual frame; no role-filter changes. */
html[data-theme="light"] .thrs-shell > .thrs-sidebar,
html[data-theme="dark"] .thrs-shell > .thrs-sidebar {
 background:
  radial-gradient(circle at 18% 0%,rgba(200,169,98,.11),transparent 35%),
  linear-gradient(176deg,var(--p143-sidebar-mid),var(--p143-sidebar) 62%,#030d1a) !important;
 border-inline-end:1px solid rgba(222,188,121,.37) !important;
 box-shadow:14px 0 39px rgba(4,20,37,.22) !important;
 color:#eef4ff !important;
}
html[dir="rtl"][data-theme] .thrs-shell > .thrs-sidebar {
 box-shadow:-14px 0 39px rgba(4,20,37,.22) !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-scroll-area {
 scrollbar-color:rgba(207,170,100,.5) transparent;
 scrollbar-width:thin;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-section-label {
 color:var(--p143-sidebar-muted) !important;
 font-size:10.8px !important;
 letter-spacing:.075em !important;
 font-weight:850 !important;
 padding-block:7px 4px !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-section-label::after {
 background:linear-gradient(90deg,rgba(235,199,131,.30),transparent) !important;
}
html[dir="rtl"][data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-section-label::after {
 background:linear-gradient(270deg,rgba(235,199,131,.30),transparent) !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link {
 min-height:45px !important;
 gap:11px !important;
 padding-inline:13px !important;
 margin-block:2px !important;
 color:var(--p143-sidebar-label) !important;
 font-size:13px !important;
 border-radius:12px !important;
 border:1px solid transparent !important;
 transition:background-color .17s ease,border-color .17s ease,transform .17s ease;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link .thrs-sidebar-link-label {
 color:inherit !important;
 font-weight:665 !important;
 line-height:1.45 !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link:not(.sidebar-active-link):hover {
 background:rgba(133,172,210,.15) !important;
 border-color:rgba(196,219,240,.20) !important;
 color:#fff !important;
 transform:translateX(2px);
}
html[dir="rtl"][data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link:not(.sidebar-active-link):hover {
 transform:translateX(-2px);
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link.sidebar-active-link {
 background:linear-gradient(118deg,#f5d995,#d9a749) !important;
 border:1px solid #f6deaa !important;
 border-inline-start:4px solid #ffe4a4 !important;
 color:#091d33 !important;
 box-shadow:0 5px 19px rgba(210,164,84,.25),inset 0 1px 0 rgba(255,255,255,.55) !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link.sidebar-active-link::before {
 background:transparent !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link.sidebar-active-link .thrs-sidebar-link-label {
 color:#091d33 !important;
 font-weight:870 !important;
}
/* Do not recolor icon assets or swap their identity; visually mute bright icon in selected row. */
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link.sidebar-active-link :is(.thrs-modern-icon-wrap,svg, lord-icon) {
 filter:brightness(.42) saturate(.65) !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-footer {
 border:1px solid rgba(219,179,110,.25) !important;
 background:rgba(9,33,54,.59) !important;
 box-shadow:0 11px 25px rgba(0,0,0,.19) !important;
 border-radius:16px !important;
}
html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-footer-toggle {
 color:#f6ecd9 !important;
}
/* Consistent focus for keyboard, never suppress native tab navigation. */
html[data-theme] .thrs-shell :is(.thrs-header,.thrs-sidebar) :is(button,a):focus-visible,
html[data-theme] .thrs-main-shell :is(.thrs-btn,.form-input,.form-select,.form-textarea):focus-visible {
 outline:3px solid var(--p143-focus) !important;
 outline-offset:3px !important;
}
/* Shared controls: classes only; do not apply blanket styling to arbitrary
   controls like day cells, pills, approval widgets or dashboards. */
html[data-theme] .thrs-main-shell :is(.thrs-btn,.form-input,.form-select,.form-textarea) {
 border-radius:12px !important;
}
html[data-theme] .thrs-main-shell :is(.form-input,.form-select,.form-textarea),
html[data-theme] :is(.thrs-modal-card,.thrs-advanced-filter) :is(.form-input,.form-select,.form-textarea) {
 background:var(--p143-control) !important;
 color:var(--p143-control-ink) !important;
 -webkit-text-fill-color:var(--p143-control-ink) !important;
 border:1px solid var(--p143-control-border) !important;
 box-shadow:inset 0 1px 2px rgba(8,29,48,.045) !important;
 border-radius:12px !important;
 transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
html[data-theme] .thrs-main-shell :is(.form-input,.form-select,.form-textarea):is(:hover,:focus),
html[data-theme] :is(.thrs-modal-card,.thrs-advanced-filter) :is(.form-input,.form-select,.form-textarea):is(:hover,:focus) {
 border-color:var(--p143-focus) !important;
}
html[data-theme] .thrs-main-shell :is(.form-input,.form-select,.form-textarea):focus,
html[data-theme] :is(.thrs-modal-card,.thrs-advanced-filter) :is(.form-input,.form-select,.form-textarea):focus {
 outline:none !important;
 box-shadow:var(--p143-ring) !important;
}
html[data-theme] .thrs-main-shell :is(.form-input,.form-select,.form-textarea)::placeholder,
html[data-theme] :is(.thrs-modal-card,.thrs-advanced-filter) :is(.form-input,.form-select,.form-textarea)::placeholder {
 color:var(--p143-head-muted) !important;
 -webkit-text-fill-color:var(--p143-head-muted) !important;
 opacity:1 !important;
}
html[data-theme] .thrs-main-shell .form-label,
html[data-theme] .thrs-modal-card .form-label {
 color:var(--p143-head-ink) !important;
 font-size:12.5px !important;
 font-weight:760 !important;
}
html[data-theme="light"] .thrs-main-shell .thrs-btn-primary {
 --thrs-btn-bg:linear-gradient(125deg,#173e62,#0c2947);
 --thrs-btn-color:#fff;
 --thrs-btn-border:#2b4c69;
 --thrs-btn-shadow:0 7px 17px rgba(13,44,78,.16);
}
html[data-theme="dark"] .thrs-main-shell .thrs-btn-primary {
 --thrs-btn-bg:linear-gradient(125deg,#244b6e,#143453);
 --thrs-btn-color:#f7fbff;
 --thrs-btn-border:#6688a6;
 --thrs-btn-shadow:0 8px 17px rgba(0,0,0,.22);
}
html[data-theme] .thrs-main-shell .thrs-btn-gold {
 --thrs-btn-bg:linear-gradient(130deg,#f8dea2,#d8a650);
 --thrs-btn-color:#091e33;
 --thrs-btn-border:#f0d18c;
}
html[data-theme] .thrs-main-shell :is(.thrs-btn-secondary,.thrs-btn-outline,.thrs-btn-ghost) {
 --thrs-btn-bg:var(--p143-control);
 --thrs-btn-color:var(--p143-control-ink);
 --thrs-btn-border:var(--p143-control-border);
 --thrs-btn-shadow:0 5px 16px rgba(8,28,52,.075);
}
html[data-theme] .thrs-main-shell .thrs-btn:disabled {
 opacity:.57 !important;
 cursor:not-allowed !important;
 transform:none !important;
 box-shadow:none !important;
}
html[data-theme] .thrs-main-shell .thrs-btn:hover:not(:disabled) {
 border-color:var(--p143-focus) !important;
 transform:translateY(-1px);
}
html[data-theme] .thrs-main-shell :is(input,textarea):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):disabled {
 cursor:not-allowed !important;
 opacity:.62 !important;
}
/* Shared standalone page cards use the same edge/radius scale without
   replacing custom opaque component panels or overriding calendars/tables. */
html[data-theme="light"] .thrs-main-shell .thrs-page :is(.thrs-card,.thrs-panel) {
 border:1px solid #d5e0eb !important;
 border-radius:17px !important;
 box-shadow:0 11px 30px rgba(14,42,75,.07) !important;
}
html[data-theme="dark"] .thrs-main-shell .thrs-page :is(.thrs-card,.thrs-panel) {
 border:1px solid #55718c !important;
 border-radius:17px !important;
 box-shadow:0 13px 30px rgba(0,0,0,.22) !important;
}
/* Shared Modal portal: element may live directly under document.body.
   No changes to height, portal stacking, close-on-escape or close buttons. */
html[data-theme] .thrs-modal-overlay {
 background:var(--p143-backdrop) !important;
 backdrop-filter:blur(10px) saturate(.85) !important;
 -webkit-backdrop-filter:blur(10px) saturate(.85) !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card {
 background:var(--p143-surface) !important;
 border:1px solid var(--p143-modal-line) !important;
 border-radius:22px !important;
 box-shadow:var(--p143-modal-shadow) !important;
 color:var(--p143-head-ink) !important;
 overflow:hidden !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:first-child {
 background:linear-gradient(180deg,var(--p143-surface-raised),var(--p143-surface)) !important;
 border-bottom:1px solid var(--p143-modal-line) !important;
 padding:19px 23px !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:first-child h2 {
 color:var(--p143-head-ink) !important;
 font-size:17px !important;
 font-weight:830 !important;
 line-height:1.36 !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:first-child button {
 min-width:38px !important;min-height:38px !important;
 color:var(--p143-control-ink) !important;
 border:1px solid var(--p143-control-border) !important;
 background:var(--p143-control) !important;
 border-radius:11px !important;
 box-shadow:0 3px 10px rgba(10,34,61,.085) !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:first-child button:hover {
 border-color:#d28a7d !important;
 background:var(--p143-control-hover) !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:first-child button:focus-visible {
 outline:3px solid var(--p143-focus) !important;
 outline-offset:3px !important;
}
html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:nth-child(2) {
 color:var(--p143-head-ink) !important;
 padding:23px !important;
}
/* Calendar modal family: only surfaces/outline, never rewrite event state. */
html[data-theme="light"] .thrs-calendar-modal {
 background:#fff !important;color:#193653 !important;
 border:1px solid #d0dfec !important;
 border-radius:20px !important;
 box-shadow:var(--p143-modal-shadow) !important;
}
html[data-theme="dark"] .thrs-calendar-modal {
 background:#14324d !important;color:#f2f7fe !important;
 border:1px solid #5c7e9b !important;
 border-radius:20px !important;
 box-shadow:var(--p143-modal-shadow) !important;
}
/* Native OS menu popups remain OS-managed.  Do not suppress selects, date
   pickers, custom dropdown portal logic or modal scrolling. */
@media(max-width:760px) {
 html[data-theme] .thrs-shell > .thrs-header {padding-inline:12px !important;}
 html[data-theme] .thrs-shell > .thrs-header .thrs-header-controls {gap:5px !important;}
 html[data-theme] .thrs-shell > .thrs-header .thrs-header-brand h1 {font-size:14px !important;}
 html[data-theme] .thrs-modal-overlay > .thrs-modal-card {
  max-width:min(95vw,560px) !important;
  border-radius:18px !important;
 }
 html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:first-child,
 html[data-theme] .thrs-modal-overlay > .thrs-modal-card > div:nth-child(2) {
  padding:17px !important;
 }
 html[data-theme] .thrs-shell > .thrs-sidebar .thrs-sidebar-link {min-height:44px !important;}
}
@media(prefers-reduced-motion:reduce) {
 html[data-theme] .thrs-shell :is(.thrs-header button,.thrs-sidebar-link,.thrs-btn),
 html[data-theme] .thrs-modal-overlay > .thrs-modal-card {
  transition:none !important;
 }
}