.mg-missbar{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin:2px 0 10px}.mg-missbar .mg-ck{font-size:12.5px}
.mg-misskpi{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.mgm-k{flex:1;min-width:170px;background:var(--card);border:1px solid var(--border);border-left:4px solid var(--acc-2);border-radius:12px;padding:9px 14px}.mgm-k b{display:block;font-size:20px;line-height:1.25}.mgm-k span{font-size:11.5px;color:var(--gray-600)}
.mgm-k.bad{border-left-color:#c0392b}.mgm-k.bad b{color:#c0392b}.mgm-k.ok{border-left-color:#1e8e3e}.mgm-k.ok b{color:#1e8e3e}
.mgm-chip{display:inline-block;min-width:26px;text-align:center;background:#fde7e9;color:#a80000;font-weight:700;border-radius:999px;padding:2px 9px}
#mgMissTable td.mgm-dates{white-space:normal!important;min-width:280px;font-size:12px;color:var(--gray-700)}
:root{--acc-1:#12306b;--acc-2:#1d4ed8;--acc-3:#3b82f6;--acc-soft:#eaf0fb;--acc-line:#c9d7f0;--acc-grad:linear-gradient(120deg,var(--acc-1) 0%,var(--acc-2) 55%,var(--acc-3) 100%)}
html[data-accent=green]{--acc-1:#14532d;--acc-2:#15803d;--acc-3:#34b863;--acc-soft:#e6f5ec;--acc-line:#b8dfc7;--brand:#15803d;--brand-dark:#166534;--brand-light:#ecfdf3}
html[data-accent=gray]{--acc-1:#1f2937;--acc-2:#475569;--acc-3:#8795a8;--acc-soft:#edf0f4;--acc-line:#cdd4de;--brand:#475569;--brand-dark:#334155;--brand-light:#f1f4f8}
html[data-accent=red]{--acc-1:#5b0f1b;--acc-2:#9f1d2e;--acc-3:#d6455a;--acc-soft:#fbe9ec;--acc-line:#ecc3c9;--brand:#9f1d2e;--brand-dark:#7f1624;--brand-light:#fdf0f2}
html[data-accent=navy]{--acc-1:#071433;--acc-2:#0f2a66;--acc-3:#1e40af;--acc-soft:#e8edfa;--acc-line:#c2cdea;--brand:#1e3a8a;--brand-dark:#172554;--brand-light:#e9eefb}html[data-accent=navy] body.dark{--brand-light:#14234d}
html[data-accent=green] body.dark{--brand-light:#12351f}html[data-accent=gray] body.dark{--brand-light:#2a3342}html[data-accent=red] body.dark{--brand-light:#43161d}
body.dark{--acc-soft:#24324a;--acc-line:#3b4b66}
/* resizable drop-down lists everywhere (drag the bottom-right corner, or use ⤢ Larger) */
.combo-list,.mc-list,.list-picker-list{resize:both;overflow:auto!important;min-width:min(260px,92vw);max-width:94vw;max-height:min(62vh,520px);min-height:90px}
.mc-list.mc-big,.combo-list.mc-big,.list-picker-list.mc-big{width:min(560px,94vw)!important;max-height:78vh!important;height:auto}
.mc-head{gap:6px;flex-wrap:wrap}.mc-head span{min-width:120px}
.combo-item,.list-picker-item,.mc-item{overflow-wrap:break-word}
/* collapse + column filters */
.cc-btn{background:var(--brand-light)!important;color:var(--brand)!important;border:1px solid var(--acc-line)!important;border-radius:8px;padding:4px 10px!important;font-size:12px!important;font-weight:600}
.card-header>.cc-btn:last-child{margin-left:auto}.card-header:has(>.cc-btn:last-child){display:flex;align-items:center;gap:10px;flex-wrap:wrap}.cc-collapsed>:not(.card-header){display:none!important}.cc-collapsed>.card-header{margin-bottom:0!important}
table.rn-on thead tr.tcf-row::before{content:""!important}
tr.tcf-row th{position:sticky;z-index:3;background:var(--gray-50)!important;border-bottom:1px solid var(--border)!important}
tr.tcf-row .mc-box{height:28px;min-height:26px}tr.tcf-row .mc-input{font-size:12px}
/* side panel follows the theme */
:root{--sidebar-bg:#0f2347;--sidebar-hover:#1c3768}
html[data-accent=navy]{--sidebar-bg:#071433;--sidebar-hover:#13275a}
html[data-accent=green]{--sidebar-bg:#0e3220;--sidebar-hover:#1a4d31}
html[data-accent=gray]{--sidebar-bg:#1f2937;--sidebar-hover:#374151}
html[data-accent=red]{--sidebar-bg:#3a0c14;--sidebar-hover:#5a1b27}
html[data-accent] body.dark{--sidebar-bg:#0b1220;--sidebar-hover:#1e293b}
.sidebar{background:linear-gradient(180deg,var(--sidebar-bg) 0%,color-mix(in srgb,var(--sidebar-bg) 72%,#000) 100%)}
.nav-item.active{background:var(--acc-grad);box-shadow:0 2px 8px rgba(0,0,0,.25)}
/* top bar in the theme colour (same gradient as the pop-up headers) */
html body .topbar{background:var(--acc-grad) !important;border-bottom:0 !important;color:#fff;box-shadow:0 2px 8px rgba(15,23,42,.18)}
html body .topbar .topbar-title{color:#fff !important}html body .topbar .topbar-sub{color:rgba(255,255,255,.85) !important}
html body .topbar>div:not(.tb-logo):not(.topbar-actions){margin:0 auto 0 14px;text-align:left}
html body .topbar .tb-logo{background:rgba(255,255,255,.18) !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
html body .topbar .icon-btn,html body .topbar .m-menu-btn{background:rgba(255,255,255,.14) !important;color:#fff !important;border:1px solid rgba(255,255,255,.3) !important;box-shadow:none !important}
html body .topbar .icon-btn:hover,html body .topbar .m-menu-btn:hover{background:rgba(255,255,255,.27) !important}
html body .topbar .token-pill{background:rgba(255,255,255,.16);color:#fff}html body .topbar .token-pill.ok{background:rgba(255,255,255,.95);color:#0b7a0b}html body .topbar .token-pill.throttled{background:rgba(255,255,255,.95);color:#b45309}
.sidebar-brand .logo{background:var(--acc-grad)}.tb-logo{width:38px;height:38px;flex:none;border-radius:9px;background:var(--acc-grad);color:#fff;display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:700;overflow:hidden;margin-right:12px}@media(max-width:700px){.tb-logo{width:30px;height:30px;font-size:15px;margin-right:8px}}.topbar{display:flex;align-items:center}
.user-card .avatar,.user-avatar{background:var(--acc-2)}
/* expanded lists */
#tblExpandOverlay{background:var(--gray-50)}
#tblExpandOverlay .te-bar{background:var(--acc-grad);color:#fff;padding:14px 22px;border:0;gap:10px;box-shadow:0 4px 16px rgba(15,23,42,.18)}
#tblExpandOverlay .te-bar strong{color:#fff;font-size:17px;letter-spacing:.2px}
#tblExpandOverlay .te-bar .text-sm,#tblExpandOverlay .te-bar #teCount{color:rgba(255,255,255,.88)!important}
#tblExpandOverlay .te-bar>button,#tblExpandOverlay .te-bar .btn-row>button{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.32);border-radius:10px;padding:7px 14px;font-weight:600;box-shadow:none}
#tblExpandOverlay .te-bar>button:hover:not(:disabled){background:rgba(255,255,255,.28)}
#tblExpandOverlay .te-bar #teClose{background:#fff;color:var(--acc-1);border-color:#fff}
#tblExpandOverlay .te-bar select,#tblExpandOverlay .te-bar input{background:#fff;color:#1f2937;border:1px solid rgba(255,255,255,.5);border-radius:9px}
#tblExpandOverlay .te-bar .combo-input,#tblExpandOverlay .te-bar .mc-input{background:#fff;color:#1f2937}
#tblExpandOverlay #teExtra{background:var(--card);border-bottom:1px solid var(--border)}
#tblExpandOverlay .te-body{padding:16px 22px 24px;background:var(--gray-50)}
#tblExpandOverlay .te-body table{background:var(--card);border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08);border-collapse:separate;border-spacing:0}
#tblExpandOverlay .te-body table th{background:var(--acc-soft);color:var(--gray-700);text-transform:uppercase;letter-spacing:.05em;font-size:11.5px;border-bottom:2px solid var(--acc-line)}
#tblExpandOverlay .te-body table thead tr:first-child th{background:var(--acc-soft)!important;color:var(--gray-700)}
#tblExpandOverlay .te-body table tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--acc-2) 3.5%,transparent)}
#tblExpandOverlay .te-body table tbody tr:hover td{background:var(--brand-light)}
#tblExpandOverlay .te-body table td{border-bottom:1px solid var(--border)}
/* modal / editable forms */
:is(#expEmailModal,#dtrkDetailModal,#dtrkEmailModal,#wMailModal,#attModal,#userFormModal,#featModal,#acModal,#gdModal,#roSmGridModal)>.card{border:0;border-radius:16px;box-shadow:0 26px 70px rgba(15,23,42,.4);overflow:auto}
:is(#expEmailModal,#dtrkDetailModal,#dtrkEmailModal,#wMailModal,#attModal,#userFormModal,#featModal,#acModal,#gdModal)>.card>.card-header:first-child{background:var(--acc-grad);color:#fff;margin:-20px -24px 16px;padding:14px 24px;border-radius:16px 16px 0 0;position:sticky;top:-20px;z-index:5}
:is(#expEmailModal,#dtrkDetailModal,#dtrkEmailModal,#wMailModal,#attModal,#userFormModal,#featModal,#acModal,#gdModal)>.card>.card-header:first-child .card-title{color:#fff;font-size:16px}
:is(#expEmailModal,#dtrkDetailModal,#dtrkEmailModal,#wMailModal,#attModal,#userFormModal,#featModal,#acModal,#gdModal)>.card>.card-header:first-child button{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:9px}
:is(#expEmailModal,#dtrkDetailModal,#dtrkEmailModal,#wMailModal,#attModal,#userFormModal,#featModal,#acModal,#gdModal) .form-group label{font-size:11.5px;font-weight:600;color:var(--gray-600)}
:is(#expEmailModal,#dtrkDetailModal,#dtrkEmailModal,#wMailModal,#attModal,#userFormModal,#featModal,#acModal,#gdModal) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){border-radius:9px;border:1px solid var(--gray-300)}
/* editable pages: cards, tables, fields */
.card{border-radius:14px;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.table-wrap thead th,#view-fdplan .fd-tbl th,#view-fddemand .fd-tbl th{background:var(--acc-soft);color:var(--gray-700);text-transform:uppercase;letter-spacing:.04em;font-size:11.5px;border-bottom:2px solid var(--acc-line)}
.table-wrap tbody tr:hover td,.fd-tbl tbody tr.fd-click:hover td{background:var(--brand-light)}
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 20%,transparent)}
.card-title{position:relative}
/* every list / table header follows the colour theme (coloured grids with their own background are left alone) */
html body :is(.card,.table-wrap,.fd-wrap,.pl-card,.te-body,.dtrk-table,#dtrkDetailModal) table thead th:not([style*="background"]):not(.ro-keep):not(#view-roster *):not(#view-brkplan *):not(.ro-grid *),
html body table.fd-tbl thead th:not([style*="background"]),html body table.pl-tbl thead th:not([style*="background"]),html body table.map-table thead th:not([style*="background"]),html body table.data-table thead th:not([style*="background"]),html body table.user-table thead th,html body .dtrk-table thead th:not([style*="background"]),html body .dtrk-table thead tr.dtrk-grp th{background:var(--acc-soft)!important;color:var(--gray-700)!important;border-bottom:2px solid var(--acc-line)!important}
html body .dtrk-table thead tr.dtrk-grp th{background:var(--acc-line)!important}
html body table.fd-tbl tbody tr:hover td,html body table.pl-tbl tbody tr:hover td{background:var(--brand-light)}
html body table.fd-tbl tr.fd-tot td,html body table.fd-tbl tfoot td{background:var(--acc-soft)}
/* accent picker */
#setAccent{display:flex;gap:10px;flex-wrap:wrap}
#setAccent button{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--card);color:var(--gray-700);border:2px solid var(--border);border-radius:12px;padding:8px 12px;font-size:12px;box-shadow:none}
#setAccent button i{display:block;width:54px;height:22px;border-radius:7px}
#setAccent button.on{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 20%,transparent)}
