/* 2S Office – screen layer. Historical PDF/print rules remain separate. */
:root{--o-navy:#0b1730;--o-blue:#145bea;--o-cyan:#00b9e9;--o-bg:#f5f7fb;--o-ink:#17243c;--o-muted:#67758a;--o-line:#e2e8f1}
.office-sidebar,.office-menu-toggle{display:none}
@media screen{
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--o-ink);background:var(--o-bg);font-size:14px;line-height:1.55}
body.office-layout{padding-left:246px;min-width:0}
h1{font-size:28px;letter-spacing:-.7px;line-height:1.25}h2{font-size:19px;letter-spacing:-.3px}h3{font-size:16px}p{line-height:1.6}small,.small{font-size:12px}.muted{color:var(--o-muted)}
.office-sidebar{display:flex;position:fixed;inset:0 auto 0 0;width:246px;background:var(--o-navy);color:#b0c1da;padding:28px 17px 22px;z-index:90;flex-direction:column;overflow-y:auto}
.office-brand{display:flex;gap:11px;align-items:center;padding:0 7px 30px}.office-brand img{width:46px;height:46px;border-radius:12px;background:white;object-fit:contain}.office-brand strong{display:block;color:white;font-size:19px;letter-spacing:-.4px}.office-brand small{display:block;color:#9cb2ce;font-size:11px;margin-top:2px}
.office-company{border:1px solid #263958;border-radius:12px;padding:14px;color:#e5ecf8;font-size:13px;margin-bottom:23px;overflow-wrap:anywhere}.office-nav-label{font-size:10px;letter-spacing:1.8px;font-weight:750;padding:0 12px;margin-bottom:15px;color:#8298b8}
.office-sidebar nav{display:grid;gap:7px}.office-sidebar nav a{display:flex;align-items:center;gap:13px;padding:14px 13px;border-radius:9px;color:#adbed7;font-weight:650;border:1px solid transparent}.office-sidebar nav a>span{font-size:21px;width:23px;text-align:center;color:#839ebf}.office-sidebar nav a:hover{background:#162b4c;color:white}.office-sidebar nav a.active{background:linear-gradient(110deg,#183b66,#244d83);color:white;border-color:#366397;box-shadow:inset 3px 0 var(--o-cyan)}.office-sidebar nav a.active>span{color:#59d6f2}.office-sidebar-bottom{margin-top:auto;padding:38px 10px 0;font-size:11px}.office-sidebar-bottom strong{display:block;color:#d3dfef;margin-bottom:7px}
.office-layout main.shell{max-width:1540px;padding:0 30px 24px}.office-layout .topbar{min-height:84px;background:white;border:0;border-bottom:1px solid var(--o-line);border-radius:0;box-shadow:none;margin:0 -30px 30px;padding:20px 30px;display:flex;justify-content:space-between;align-items:center;gap:15px}.office-layout .topbar strong{font-size:14px;color:#4c617d}.office-top-separator{color:#adbbcd;margin:0 12px}.topbar .role{font-size:12px}.office-layout .language-menu{top:27px;right:154px;z-index:91}.office-layout .topbar form{margin-left:auto}.office-layout .site-footer{max-width:1540px;padding:24px 30px;border-top:1px solid var(--o-line);font-size:11px;color:var(--o-muted)}
.office-layout .dashboard-head{margin:0 0 22px;display:block}.office-layout .dashboard-head .company-nav,.office-layout main>.admin-tabs{display:none}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.8px;color:#5076a7}.dashboard-head h1{margin:8px 0 6px}.dashboard-head p{margin:0}
.card{border:1px solid var(--o-line);border-radius:14px;box-shadow:0 4px 16px rgba(21,43,78,.025);padding:23px;margin-bottom:20px}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:22px}.metric-card{border:1px solid var(--o-line);border-radius:12px;background:white!important;padding:19px 21px;box-shadow:none;border-top:3px solid #2a6ee9!important;color:var(--o-ink)!important}.metric-card span{color:#63758e;font-size:12px;font-weight:650}.metric-card strong{font-size:30px;color:var(--o-ink);letter-spacing:-.7px}.metric-card.warn{border-top-color:#ce8a15!important}.metric-card.danger{border-top-color:#c33a48!important}
button,.btn{border-radius:9px;font-weight:650;transition:transform .1s,box-shadow .1s,filter .1s}.btn,button{min-height:39px;padding:9px 15px}.btn.primary,button.primary,.mai-login-submit{background:linear-gradient(#327dff,#1454d2)!important;border:1px solid #1d5fc8;color:white;box-shadow:0 4px 0 #0b3a94,0 6px 10px #164e9c16}.btn.light{background:#f6f9ff;border:1px solid #d7e2f2;color:#294e7e;box-shadow:0 3px 0 #c5d3e5}.btn:active,button:active{transform:translateY(3px);box-shadow:0 1px 0 #b4c7e2}.btn:hover,button:hover{filter:brightness(1.03)}button:focus-visible,a:focus-visible{outline:3px solid #50bdf2;outline-offset:3px}
input,select,textarea{background:#fff;border:1px solid #cad6e7;border-radius:8px;color:#1e3556;min-height:41px;padding:9px 11px;font:inherit;max-width:100%}input:focus,select:focus,textarea:focus{outline:3px solid #d8edff;border-color:#387be2}label{font-size:12px;font-weight:650;color:#4d6381}.grid{gap:15px}.table-wrap{overflow:auto;border:1px solid var(--o-line);border-radius:10px}table{font-size:13px;width:100%;border-collapse:collapse}th{background:#f6f8fc;color:#677a94;font-size:10px;letter-spacing:.6px;font-weight:750;padding:13px 12px;border-bottom:1px solid var(--o-line)}td{padding:13px 12px;border-bottom:1px solid #edf1f7;vertical-align:middle}tr:last-child td{border-bottom:0}tr:hover td{background:#fbfcff}.badge{font-size:11px;border-radius:6px;padding:4px 8px;font-weight:700}.badge.success{background:#e9f6ee;color:#247243}.badge.danger{background:#fff0f1;color:#b73748}.badge.blue{background:#eaf1ff;color:#225cc4}.badge.neutral{background:#edf1f6;color:#576b85}.retention-notice{padding:13px 18px;border-radius:10px;background:#edf3fd;color:#566e91;font-size:12px;margin-bottom:20px}.usage-card summary{padding:15px}.company-section-title{margin-bottom:20px}.office-app-help{max-width:1000px}.office-public .mai-login-shell{border:1px solid var(--o-line);border-radius:20px;box-shadow:0 18px 60px #18345f14}.office-public .mai-login-brand{background:var(--o-navy)!important;color:white}.office-public .mai-login-brand-copy h1{font-size:24px!important;color:white}.office-public .mai-login-brand-copy p,.office-public .mai-login-product{color:#b5c8e4!important}.office-public .mai-login-logo-brand{width:78px!important;height:78px!important;min-width:78px!important;max-width:78px!important;border-radius:14px!important}.office-public .mai-login-logo-brand img{border-radius:14px!important}.office-public .mai-login-brand-main{grid-template-columns:78px minmax(0,1fr)!important;gap:20px!important}.office-public .mai-login-card-body{padding:30px!important}.office-public .mai-login-submit{border-radius:10px!important}.office-public .login-page{padding:55px 20px!important}.office-public .mai-login-intro{color:var(--o-muted)}
@media(max-width:1050px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.office-layout .grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){body.office-layout{padding-left:0}.office-sidebar{transform:translateX(-100%);transition:transform .2s}.office-menu-open .office-sidebar{transform:translateX(0);box-shadow:0 0 0 100vmax #08152c66}.office-menu-toggle{display:block;position:fixed;top:20px;left:12px;z-index:100;background:#edf3ff;border:1px solid #ccdaed;color:#1e4c8b}.office-layout main.shell{padding:0 16px 20px}.office-layout .topbar{margin:0 -16px 24px;padding:20px 16px 20px 66px}.office-layout .topbar strong{font-size:11px}.office-layout .language-menu{position:relative;top:auto;right:auto;float:right;margin:12px}.office-layout .grid.two,.office-layout .grid.three,.office-layout .grid.four{grid-template-columns:1fr}.metric-card{padding:15px}.metric-card strong{font-size:25px}.card{padding:18px}input,select,textarea{font-size:16px}h1{font-size:24px}}
}
@media print{.office-sidebar,.office-menu-toggle{display:none!important}.office-layout{padding:0!important}}
@media screen and (min-width:801px){.office-layout .language-menu{right:32px!important;top:25px!important}.office-layout .topbar form{margin-right:70px}}

@media screen{.office-app-link{max-width:850px;margin:22px 0 26px}.office-app-link input{display:block;width:100%;font-weight:650;font-size:15px;margin:7px 0 13px;min-height:46px}.office-app-link-actions{display:flex;flex-wrap:wrap;gap:12px}.office-app-link input:focus{outline:3px solid #d8edff}.office-app-link p{margin-top:13px}}

/* Driver portal: same Office contrast as Fahrer PWA; screen only. */
@media screen{
body.office-driver{background:#e8eef6;color:#17243c}.office-driver .topbar{background:#0b1730;color:white;border-bottom:3px solid #00b9e9;border-radius:12px}.office-driver .topbar strong{color:white}.office-driver .card{border-color:#bdcce0}.office-driver .driver-status-panel.status-always-green{background:#173354;border-color:#173354}.office-driver .driver-status-panel.status-always-green .live-status,.office-driver .status-trip{color:white}.office-driver .status-label,.office-driver .status-hint{color:#d7e7fb}.office-driver .driving-panel,.office-driver .driver-control-zone{background:#f0f5fc;border-color:#b4c6df}.office-driver .driving-meters{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}.office-driver .meter{border-color:#b7cae2;border-top:3px solid #145bea}.office-driver .meter h3{color:#223f62}.office-driver .meter-value{flex-wrap:wrap;row-gap:4px}.office-driver .meter-value b{color:#163e7a}.office-driver .meter-value span{color:#405570}.office-driver .control-zone-title small,.office-driver .driving-fortnight-meta{color:#405570}.office-driver .driver-action.blue{background:linear-gradient(#2469e8,#124cb8);color:white}.office-driver .driver-action.amber{background:linear-gradient(#aa640d,#804600);color:white}.office-driver .driver-action.green{background:linear-gradient(#258056,#16633e);color:white}.office-driver .driver-action.red{background:linear-gradient(#b93b51,#93273c);color:white}.office-driver .driver-action small{color:white;opacity:1}.office-driver .vehicle-switch-note{background:#e2edf9;border-color:#b1c6e0;color:#27466b}.office-driver .vehicle-switch-note strong,.office-driver .vehicle-switch-note span{color:#27466b}
.office-driver .meter-driving.level-warn .meter-value b{color:#8a4e00}.office-driver .meter-driving.level-critical .meter-value b,.office-driver .meter-driving.level-pulse .meter-value b{color:#9d2218}
}
@media screen{.office-driver .topbar .role{color:#d7e7fb}.office-driver .driver-action .action-icon{color:white;background:#ffffff20}.office-driver .driver-action.amber{border-color:#743e00!important}.office-driver .driver-action.green{border-color:#145331!important}.office-driver .driver-action.red{border-color:#7b2033!important}.office-driver .driver-action.is-active{outline:3px solid #145bea;outline-offset:3px}.office-driver .driving-meters>.meter{min-width:0}}

@media screen{.office-app-access{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;align-items:center;margin:24px 0}.office-app-access .office-app-link{margin:0;max-width:none;min-width:0}.office-app-qr{text-align:center;border:1px solid #ccd9e9;border-radius:14px;background:#f3f7fc;padding:18px}.office-app-qr h3{margin:0 0 14px;font-size:16px;color:#173354}.office-app-qr-code{width:228px;max-width:100%;margin:0 auto;background:#fff;padding:0;border:1px solid #d4deeb;border-radius:6px;overflow:hidden}.office-app-qr-code svg{display:block;width:100%;height:auto;shape-rendering:crispEdges}.office-app-qr p{font-size:13px;line-height:1.5;margin:12px 0 0}.office-app-qr .small{font-size:12px}}
@media screen and (max-width:1050px){.office-app-access{grid-template-columns:minmax(0,1fr);gap:20px}.office-app-qr{max-width:340px;width:100%;justify-self:center}}