/* THRS V14.15 — Shift Management Premium Visual Refinement
   Cosmetics only, preserving page flow, lists, filters, form fields, permissions,
   React event handlers and existing mobile wrapping. */
html[data-theme="light"] .thrs-page-shift-management {
 --shift15-surface:#ffffff;
 --shift15-soft:#f6f9fd;
 --shift15-soft2:#eef4f9;
 --shift15-ink:#142d46;
 --shift15-muted:#61788e;
 --shift15-border:#dce5ee;
 --shift15-hair:#e9eff5;
 --shift15-gold:#b78442;
 --shift15-gold-pale:#f7ecd8;
 --shift15-gold-text:#97672e;
 --shift15-navy:#113451;
 --shift15-shadow:0 3px 5px rgba(18,50,79,.015),0 12px 30px rgba(17,48,77,.073);
 --shift15-shadow-hover:0 6px 12px rgba(18,50,79,.03),0 20px 42px rgba(18,50,79,.12);
}
html[data-theme="dark"] .thrs-page-shift-management {
 --shift15-surface:#142e47;
 --shift15-soft:#1b3953;
 --shift15-soft2:#22445f;
 --shift15-ink:#eef5fc;
 --shift15-muted:#c0d0e0;
 --shift15-border:#395a77;
 --shift15-hair:#2b4a64;
 --shift15-gold:#e7be80;
 --shift15-gold-pale:#36465b;
 --shift15-gold-text:#f1d29a;
 --shift15-navy:#102c46;
 --shift15-shadow:0 4px 8px rgba(0,7,20,.12),0 16px 36px rgba(0,7,20,.23);
 --shift15-shadow-hover:0 8px 15px rgba(0,7,20,.16),0 22px 47px rgba(0,7,20,.30);
}
html[data-theme] .thrs-page-shift-management {
 color:var(--shift15-ink) !important;
 -webkit-font-smoothing:antialiased;
 font-feature-settings:"tnum" 1,"lnum" 1;
}
html[data-theme] .thrs-page-shift-management :is(h1,h2,h3,strong){
 text-wrap:pretty;
}
/* Premium page header: same buttons, same order, calm layered porcelain/dark navy */
html[data-theme] .thrs-page-shift-management>.page-header {
 background:
  radial-gradient(ellipse at 97% -12%,color-mix(in srgb,var(--shift15-gold) 11%,transparent),transparent 53%),
  linear-gradient(125deg,var(--shift15-surface),var(--shift15-soft)) !important;
 border:1px solid var(--shift15-border) !important;
 border-radius:19px !important;
 box-shadow:var(--shift15-shadow),inset 0 1px 0 rgba(255,255,255,.06) !important;
}
html[data-theme] .thrs-page-shift-management>.page-header::after {
 background:linear-gradient(90deg,transparent,#ad7d3f 15%,#f1d6a8 50%,#ad7d3f 85%,transparent) !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .page-title {
 color:var(--shift15-ink) !important;
 font-weight:900 !important;
 letter-spacing:-.035em !important;
 line-height:1.22 !important;
 text-shadow:none !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .page-title :is(svg,span:first-child) {
 color:var(--shift15-gold-text) !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .thrs-btn {
 border-radius:11px !important;
 font-size:12px !important;
 font-weight:850 !important;
 border:1px solid var(--shift15-border) !important;
 box-shadow:0 2px 8px rgba(12,44,76,.035) !important;
 transition:background .17s,color .17s,border-color .17s,box-shadow .17s,filter .17s !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .thrs-btn-primary {
 background:linear-gradient(135deg,#194362,#0a2d4c) !important;
 border-color:#b18b56 !important;
 color:#fff !important;
 box-shadow:0 6px 18px rgba(8,43,73,.15) !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .thrs-btn-secondary {
 color:#172e42 !important;
 background:linear-gradient(126deg,#f1d9af,#dbb37c) !important;
 border-color:#c6a16e !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .thrs-btn-outline {
 color:var(--shift15-ink) !important;
 background:var(--shift15-surface) !important;
 border-color:var(--shift15-border) !important;
}
html[data-theme] .thrs-page-shift-management>.page-header .thrs-btn:hover:not(:disabled){
 filter:brightness(1.04);
 box-shadow:0 8px 18px rgba(13,48,78,.13) !important;
}
/* Actual KPI cards: keep same two metrics, polished material and number ink. */
html[data-theme] .thrs-page-shift-management>div:nth-child(2)>.thrs-card {
 position:relative;
 border:1px solid var(--shift15-border) !important;
 border-radius:17px !important;
 background:linear-gradient(155deg,var(--shift15-surface),var(--shift15-soft)) !important;
 box-shadow:var(--shift15-shadow) !important;
 transition:box-shadow .2s,border-color .2s,transform .2s !important;
}
html[data-theme] .thrs-page-shift-management>div:nth-child(2)>.thrs-card::before{
 content:"";position:absolute;inset-block-start:0;inset-inline:0;
 height:3px;pointer-events:none;
 background:linear-gradient(90deg,transparent 2%,#b98845 30%,#edcf9e 65%,transparent 98%);
 opacity:.95;
}
html[data-theme] .thrs-page-shift-management>div:nth-child(2)>.thrs-card:hover{
 box-shadow:var(--shift15-shadow-hover) !important;
 border-color:color-mix(in srgb,var(--shift15-gold) 38%,var(--shift15-border)) !important;
 transform:translateY(-2px);
}
html[data-theme] .thrs-page-shift-management>div:nth-child(2)>.thrs-card>div>div>div:nth-child(2)>div:first-child{
 font-size:12px !important;
 font-weight:750 !important;
 letter-spacing:.01em !important;
 color:var(--shift15-muted) !important;
}
html[data-theme] .thrs-page-shift-management>div:nth-child(2)>.thrs-card>div>div>div:nth-child(2)>div:last-child{
 color:var(--shift15-ink) !important;
 font-weight:900 !important;
 letter-spacing:-.04em !important;
 line-height:1.25 !important;
 font-variant-numeric:tabular-nums;
}
/* Consistent card header chrome with gold micro-accent. Section order intact. */
html[data-theme] .thrs-page-shift-management>.thrs-card{
 border:1px solid var(--shift15-border) !important;
 border-radius:18px !important;
 background:linear-gradient(155deg,var(--shift15-surface),var(--shift15-soft)) !important;
 box-shadow:var(--shift15-shadow) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card>.thrs-card-header{
 background:linear-gradient(135deg,color-mix(in srgb,var(--shift15-soft) 77%,transparent),transparent) !important;
 border-bottom:1px solid var(--shift15-hair) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card>.thrs-card-header h3{
 color:var(--shift15-ink) !important;
 font-weight:900 !important;
 font-size:16px !important;
 letter-spacing:-.02em !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card>.thrs-card-header h3>span:first-child{
 background:linear-gradient(#f5dbaa,#b5823e) !important;
 box-shadow:0 0 0 3px color-mix(in srgb,var(--shift15-gold) 14%,transparent) !important;
}
/* Shift definition and assignment tables use the same understated data language. */
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table-wrap{
 border:1px solid var(--shift15-border) !important;
 border-radius:12px !important;
 background:var(--shift15-surface) !important;
 scrollbar-color:color-mix(in srgb,var(--shift15-gold) 34%,var(--shift15-border)) transparent;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table{
 background:var(--shift15-surface) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table th{
 background:var(--shift15-soft) !important;
 color:var(--shift15-muted) !important;
 border-bottom:1px solid var(--shift15-border) !important;
 font-weight:850 !important;
 letter-spacing:.015em;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table td{
 color:var(--shift15-ink) !important;
 border-bottom:1px solid var(--shift15-hair) !important;
 font-weight:575 !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table tr.zebra td{
 background:color-mix(in srgb,var(--shift15-soft) 63%,var(--shift15-surface)) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table tbody tr:hover td{
 background:color-mix(in srgb,var(--shift15-gold) 6%,var(--shift15-soft)) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table td:first-child{
 font-weight:765 !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table .thrs-btn{
 border-radius:9px !important;
 font-size:11px !important;
 font-weight:820 !important;
 box-shadow:none !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table .thrs-btn-secondary{
 color:var(--shift15-ink) !important;
 background:var(--shift15-soft) !important;
 border:1px solid var(--shift15-border) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table .thrs-btn-danger{
 color:#fff !important;
 background:linear-gradient(125deg,#d94d5c,#b73246) !important;
 border:1px solid rgba(151,43,61,.33) !important;
}
html[data-theme] .thrs-page-shift-management .badge{
 border-radius:999px !important;
 font-size:11px !important;
 font-weight:850 !important;
 box-shadow:none !important;
}
html[data-theme] .thrs-page-shift-management .badge-success{
 color:#087454 !important;
 background:#e0f7ee !important;
 border:1px solid #bee8d9 !important;
}
html[data-theme] .thrs-page-shift-management .badge-danger{
 color:#a32942 !important;
 background:#ffeaef !important;
 border:1px solid #f0bec9 !important;
}
html[data-theme] .thrs-page-shift-management .badge-warning{
 color:#89510c !important;
 background:#fff1d8 !important;
 border:1px solid #f0d9a7 !important;
}
/* Weekly calendar: premium day surfaces and compact shift entry styling.
   No changes to its grid template or the order of the seven weekdays. */
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(5)>div:last-child>div>div{
 background:linear-gradient(150deg,var(--shift15-soft),var(--shift15-surface)) !important;
 border:1px solid var(--shift15-border) !important;
 border-radius:14px !important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 3px 10px rgba(16,45,71,.045) !important;
 transition:border-color .18s ease,box-shadow .18s ease !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(5)>div:last-child>div>div:hover{
 border-color:color-mix(in srgb,var(--shift15-gold) 36%,var(--shift15-border)) !important;
 box-shadow:var(--shift15-shadow) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(5)>div:last-child>div>div>div:first-child{
 color:var(--shift15-ink) !important;
 font-weight:880 !important;
 letter-spacing:.015em;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(5)>div:last-child>div>div>div:nth-child(n+2){
 background:var(--shift15-surface) !important;
 border:1px solid var(--shift15-border) !important;
 border-radius:10px !important;
 color:var(--shift15-ink) !important;
 box-shadow:0 2px 7px rgba(19,50,76,.027) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(5)>div:last-child>div>div>div:nth-child(n+2)>div:first-child{
 color:var(--shift15-ink) !important;
 font-weight:830 !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(5)>div:last-child>div>div>div:nth-child(n+2)>div:last-child{
 color:var(--shift15-muted) !important;
}
/* Swap request list: preserve approval workflow and semantic statuses. */
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(6)>div:last-child>div{
 border-bottom-color:var(--shift15-hair) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(6)>div:last-child>div>div:first-child{
 color:var(--shift15-ink) !important;
 font-weight:840 !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(6)>div:last-child>div>div:nth-child(2){
 color:var(--shift15-muted) !important;
 line-height:1.65 !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(6) .thrs-btn{
 border-radius:9px !important;
 font-weight:820 !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(6) .thrs-btn-secondary{
 color:var(--shift15-ink) !important;
 background:var(--shift15-soft2) !important;
 border:1px solid var(--shift15-border) !important;
}
html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(6) .thrs-btn-danger{
 color:#fff !important;
 background:linear-gradient(125deg,#d44d5d,#b53044) !important;
}
/* Modal is rendered in a React portal outside page DOM. Scope to Shift route
   presence, so other screens and their modals are not affected. */
html[data-theme="light"] body:has(.thrs-page-shift-management) .thrs-modal-overlay{
 --sm15-card:#fff;--sm15-ink:#152d47;--sm15-muted:#61798e;
 --sm15-border:#d9e4ee;--sm15-input:#fafcff;--sm15-gold:#bd8e4e;
}
html[data-theme="dark"] body:has(.thrs-page-shift-management) .thrs-modal-overlay{
 --sm15-card:#18364f;--sm15-ink:#f1f6fc;--sm15-muted:#bfcede;
 --sm15-border:#3c5a75;--sm15-input:#1d3d58;--sm15-gold:#e7c285;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-overlay{
 backdrop-filter:blur(12px) !important;
 -webkit-backdrop-filter:blur(12px) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-overlay>.thrs-modal-card{
 background:var(--sm15-card) !important;
 color:var(--sm15-ink) !important;
 border:1px solid var(--sm15-border) !important;
 border-radius:18px !important;
 box-shadow:0 24px 70px rgba(1,17,34,.32),inset 0 1px 0 rgba(255,255,255,.065) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card>div:first-child{
 background:linear-gradient(130deg,var(--sm15-card),var(--sm15-input)) !important;
 border-bottom:1px solid var(--sm15-border) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card>div:first-child h2{
 color:var(--sm15-ink) !important;
 font-weight:900 !important;
 letter-spacing:-.018em;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card .form-label{
 color:var(--sm15-muted) !important;
 font-weight:830 !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card :is(.form-input,.form-select,textarea){
 background:var(--sm15-input) !important;
 color:var(--sm15-ink) !important;
 -webkit-text-fill-color:var(--sm15-ink) !important;
 border:1px solid var(--sm15-border) !important;
 border-radius:10px !important;
 box-shadow:inset 0 1px 2px rgba(5,25,47,.04) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card :is(.form-input,.form-select,textarea):focus-visible{
 border-color:var(--sm15-gold) !important;
 outline:2px solid var(--sm15-gold) !important;
 outline-offset:2px !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card :is(input[type="checkbox"]){
 accent-color:var(--sm15-gold) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card form label{
 color:var(--sm15-ink) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card .thrs-btn{
 border-radius:10px !important;
 font-weight:840 !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card .thrs-btn-primary{
 background:linear-gradient(125deg,#1b4769,#0a2d48) !important;
 color:#fff !important;
 border:1px solid rgba(225,183,122,.45) !important;
 box-shadow:0 5px 16px rgba(10,38,63,.14) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card .thrs-btn-secondary{
 color:var(--sm15-ink) !important;
 background:var(--sm15-input) !important;
 border:1px solid var(--sm15-border) !important;
}
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card :is(button,input,select,textarea):focus-visible{
 outline:2px solid var(--sm15-gold) !important;
 outline-offset:2px !important;
}
/* No content is hidden and no columns, form controls, or layout containers are moved. */
html[data-theme] .thrs-page-shift-management :is(button,a,input,select,textarea):focus-visible{
 outline:2px solid var(--shift15-gold) !important;
 outline-offset:2px !important;
}
@media(prefers-reduced-motion:reduce){
 html[data-theme] .thrs-page-shift-management :is(.thrs-card,.thrs-btn){
  transition:none !important;transform:none !important;animation:none !important;
 }
 html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card{
  animation:none !important;
 }
}

/* Responsive tables: maintain readable columns inside their existing cards.
   This does not reorder or hide any table fields. */
html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table-wrap{
 max-width:100% !important;
 overflow-x:auto !important;
 overscroll-behavior-x:contain;
 -webkit-overflow-scrolling:touch;
}
@media(max-width:780px){
 html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(3) .modern-table{
  min-width:745px !important;
 }
 html[data-theme] .thrs-page-shift-management>.thrs-card:nth-child(4) .modern-table{
  min-width:620px !important;
 }
 html[data-theme] .thrs-page-shift-management>.thrs-card .modern-table :is(th,td){
  white-space:nowrap;
 }
}
/* The primary modal action must be visible against the deep navy dialog. */
html[data-theme="dark"] body:has(.thrs-page-shift-management) .thrs-modal-card .thrs-btn-primary{
 color:#142b42 !important;
 background:linear-gradient(125deg,#f3d7a8,#ddaf70) !important;
 border-color:#c89b62 !important;
 box-shadow:0 6px 17px rgba(2,15,30,.18) !important;
}
/* Rich text reason in swap dialog: readable inside the existing editor. */
html[data-theme] body:has(.thrs-page-shift-management) .thrs-modal-card [contenteditable="true"]{
 color:var(--sm15-ink) !important;
 caret-color:var(--sm15-gold) !important;
}