/* Layout layer for the locally hosted Tabler 1.6.1 dashboard. */
body{--blue:#4263eb;--orange:#d98735;--mut:#66758c;--pagebg:#f3f5f9;--chrome:#fff}
.topbar{padding:22px 32px;gap:24px;position:relative;background:var(--chrome)}
.title{font-size:24px;letter-spacing:-.5px;white-space:normal}
.greet{border-left:3px solid var(--blue);padding-left:12px;min-width:150px}
.hspace{min-width:0}.digits{gap:5px}.digit{border:0;background:transparent;font-size:28px;padding:0;min-width:18px}
#daynight{top:18px;right:18px}.topbar{padding-right:72px}
.dashboard-nav{display:flex;gap:18px;align-items:center;padding:14px 32px;border-bottom:1px solid var(--bd);background:var(--chrome);flex-wrap:wrap}
.dashboard-nav a{font-weight:600;font-size:13px;text-decoration:none}.dashboard-nav .active{color:var(--blue)}
.dashboard-intro{padding:22px 32px 0;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.dashboard-intro h2{margin:0 0 6px;font-size:20px;color:var(--tx)}
.dashboard-intro p{margin:0;font-size:12px;color:var(--mut);line-height:1.7}
#dataStatus{font-size:12px;padding:8px 12px;border:1px solid var(--bd);border-radius:8px;background:var(--chrome);color:var(--mut)}
.grid{max-width:1680px;margin:auto;grid-template-columns:repeat(3,minmax(0,1fr));padding:20px 32px;gap:20px}
.panel{min-width:0;min-height:350px;border-radius:10px;padding:20px;box-shadow:0 2px 8px #1b294208}
.p-title{color:var(--tx);font-size:15px;margin-bottom:16px;flex-wrap:wrap}.p-title .sub{font-size:11px}
.p-title:before{border-radius:2px;width:4px;height:16px}.chart{min-height:210px}
.tablewrap{max-height:330px}.dt td{padding:10px 8px}.dt th{padding:8px}
.stat6{gap:10px}.cell{background:var(--pagebg);border-color:var(--bd);padding:12px 6px}.cell b{font-size:22px;color:var(--tx)}
.filter-row{display:flex;gap:12px;align-items:center;margin-bottom:12px;font-size:12px;color:var(--mut);flex-wrap:wrap}
.filter-row input[type=search]{flex:1;min-width:100px}.filter-row label{white-space:nowrap}
.hist-strip{padding:0 32px 20px}.foot{padding:0 32px 24px;line-height:1.8}
.drawer-head{color:var(--tx)}#drawer,.drawer-body{background:var(--chrome);color:var(--tx)}
body.night{--pagebg:#111827;--chrome:#1b2537;--tx:#e7edf7;--mut:#9cacc3;--bd:#344156;--ctl:#243047;--ctltx:#e7edf7;--ctld:#43536c}
body.night .panel{background:var(--chrome)}body.night .dt th{background:var(--chrome);color:var(--mut);border-color:var(--bd)}
body.night .dt td{color:var(--tx);border-color:var(--bd)}body.night .dt tr.orm{background:#382e25}body.night .dt tr.orm td{color:#edbd82}
body.night .empty{color:var(--mut);border-color:var(--bd)}body.night .btn2{background:#26365c;color:#b6c8ff;border-color:#435a89}
body.night .cell b{color:var(--tx)}body.night .cell.orange b{color:#edbd82}
:focus-visible{outline:3px solid #4263eb88;outline-offset:3px}
@media(max-width:1200px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{gap:12px}.greet{display:none}}
@media(max-width:720px){.grid{grid-template-columns:minmax(0,1fr);padding:16px;gap:16px}.topbar{padding:18px 58px 18px 16px}.title{width:100%;font-size:21px}.hspace{display:none}.dashboard-nav,.dashboard-intro{padding-left:16px;padding-right:16px}.panel{padding:16px;min-height:330px}.hist-strip,.foot{padding-left:16px;padding-right:16px}.stat6.s4{grid-template-columns:repeat(2,minmax(0,1fr))}.tablewrap{overflow:auto}.p-title .sub{margin-left:0;width:100%}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* One centered shell keeps the header, navigation, charts and history aligned. */
.dashboard-shell{position:relative;width:100%;max-width:1560px;margin:0 auto;min-height:100vh}
.history-heading{font-size:18px;margin:0;padding:0 32px 12px;color:var(--tx)}
#trend-history,#trend-comparison{scroll-margin-top:24px}
.dashboard-nav a:focus,.dashboard-nav a:active{background:#5267eb;color:#fff}
.dashboard-shell .grid{max-width:none}
.topbar .digits{flex:0 0 auto;min-width:0;flex-wrap:wrap}
.topbar select.ctl{width:100px;flex:0 0 100px;padding-right:30px}
.topbar button.ctl{width:auto;min-width:max-content;flex:0 0 auto;white-space:nowrap;height:auto}
#qstate:empty{display:none}
.filter-row input[type=search]{width:0;min-width:120px;max-width:100%}
.dashboard-intro>div:last-child{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#dataStatus{display:inline-block;max-width:100%;white-space:normal}
.dt td:nth-child(2){overflow-wrap:anywhere}.dt td button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
@media(min-width:1201px){
 .dashboard-shell{padding:24px 24px 0 220px}
 .dashboard-nav{position:absolute;left:24px;top:24px;bottom:24px;width:180px;padding:24px 14px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:12px;background:#1e2235;border:0;border-radius:12px}
 .dashboard-nav a{padding:12px;border-radius:8px;color:#b7c0d9;font-size:13px}
 .dashboard-nav a:first-child{color:#fff;font-size:17px;line-height:1.5;margin-bottom:24px;font-weight:800}
 .dashboard-nav a.active{background:#5267eb;color:#fff;box-shadow:0 4px 14px #0b122840}
 .dashboard-nav a:hover{background:#ffffff12;color:#fff}
 .dashboard-nav a.active:hover{background:#5267eb}
 .topbar{padding:20px 24px;border:1px solid var(--bd);border-radius:12px;gap:14px}
 .title{font-size:22px}.greet{display:none}
 #daynight{right:max(16px,calc((100vw - 1560px)/2 + 30px));top:8px;width:30px;height:30px;font-size:14px}
 .dashboard-intro{padding:24px 0 0}.grid{padding:20px 0;gap:18px}
 .hist-strip{padding:0 0 20px}.foot{padding:0 0 24px}
 .history-heading{padding:0 0 12px}
 .panel{min-height:350px;padding:18px}
 .p-title .sub{margin-left:0;flex-basis:100%}
 .stat6 .cell:first-child{background:#5267eb;border-color:#5267eb}.stat6 .cell:first-child b,.stat6 .cell:first-child small{color:#fff}
}
@media(min-width:721px) and (max-width:1200px){.dashboard-shell{max-width:1120px}.topbar{padding-right:64px}}
@media(max-width:720px){.history-heading{padding-left:16px;padding-right:16px}.topbar .digits:last-child{width:100%;gap:10px}.topbar select.ctl{width:110px;flex-basis:110px}.topbar button.ctl{min-width:0;max-width:100%;padding:9px 12px}.filter-row input[type=search]{width:auto;flex:1 1 140px}}
