/* ChargeNTrack Professional UI v1 */
:root {
  --ct-bg:#f4f6f9; --ct-surface:#fff; --ct-surface-2:#f8fafc; --ct-text:#172033;
  --ct-muted:#667085; --ct-border:#dfe4ec; --ct-border-strong:#cdd5df;
  --ct-primary:#274c77; --ct-primary-hover:#1f3d60; --ct-success:#287a4b;
  --ct-warning:#946200; --ct-danger:#a12d2d;
  --ct-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.06);
  --ct-shadow-hover:0 2px 4px rgba(16,24,40,.05),0 12px 32px rgba(16,24,40,.09);
  --ct-radius-sm:8px; --ct-radius:12px; --ct-radius-lg:16px;
  --ct-focus:0 0 0 3px rgba(39,76,119,.16);
  --surface:var(--ct-surface); --surface-soft:var(--ct-surface-2);
  --border:var(--ct-border); --muted:var(--ct-muted); --primary:var(--ct-primary);
  --danger:var(--ct-danger); --shadow:var(--ct-shadow);
}
html[data-theme="dark"] {
  --ct-bg:#10141c; --ct-surface:#171d27; --ct-surface-2:#1d2531; --ct-text:#edf2f7;
  --ct-muted:#a8b2c1; --ct-border:#303a49; --ct-border-strong:#3c4859;
  --ct-primary:#78a8d8; --ct-primary-hover:#93bce4; --ct-success:#63b985;
  --ct-warning:#e5b75b; --ct-danger:#ef8585;
  --ct-shadow:0 1px 2px rgba(0,0,0,.22),0 10px 28px rgba(0,0,0,.26);
  --ct-shadow-hover:0 2px 4px rgba(0,0,0,.26),0 14px 34px rgba(0,0,0,.32);
  --ct-focus:0 0 0 3px rgba(120,168,216,.22);
  --surface:var(--ct-surface); --surface-soft:var(--ct-surface-2);
  --border:var(--ct-border); --muted:var(--ct-muted); --primary:var(--ct-primary);
  --danger:var(--ct-danger); --shadow:var(--ct-shadow);
}
*{box-sizing:border-box} html{background:var(--ct-bg);color-scheme:light} html[data-theme="dark"]{color-scheme:dark}
body{margin:0;background:var(--ct-bg);color:var(--ct-text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--ct-primary);text-underline-offset:2px} a:hover{color:var(--ct-primary-hover)}
.app-shell{min-height:100vh}
.topbar{position:sticky;z-index:100;top:0;display:flex;min-height:62px;align-items:center;justify-content:space-between;gap:18px;padding:10px clamp(16px,3vw,34px);border-bottom:1px solid var(--ct-border);background:var(--ct-surface);box-shadow:0 2px 12px rgba(16,24,40,.04)}
.topbar-brand{display:inline-flex;align-items:center;gap:10px;color:var(--ct-text);font-size:16px;font-weight:750;letter-spacing:-.015em}
.topbar-mark{display:inline-grid;width:34px;height:34px;place-items:center;border:1px solid var(--ct-primary);border-radius:10px;background:var(--ct-primary);color:#fff;font-size:11px;font-weight:850;letter-spacing:.04em}
.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.topbar-user{margin-right:4px;color:var(--ct-muted);font-size:12px;white-space:nowrap}
.content{width:min(calc(100% - 32px),1480px);margin:0 auto;padding:28px 0 44px}
.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:0 0 22px}
.page-heading h1,.content>h1{margin:0 0 6px;color:var(--ct-text);font-size:clamp(26px,2.2vw,34px);font-weight:760;letter-spacing:-.035em;line-height:1.15}
.page-heading p,.content>p:first-of-type{max-width:780px;margin:0;color:var(--ct-muted);font-size:14px} h1,h2,h3,h4{color:var(--ct-text)} h2{letter-spacing:-.02em} h3{letter-spacing:-.012em}
.company-pill,.badge,.status-badge,.severity,.health-status,.status-pill{display:inline-flex;align-items:center;gap:5px;min-height:28px;padding:5px 10px;border:1px solid var(--ct-border);border-radius:999px;background:var(--ct-surface-2);color:var(--ct-muted);font-size:11px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.panel,.card,.profile-panel,.profile-header,.report-card,.health-card,.security-card,.notification-card,.maintenance-card,.contract-card,.audit-check,.ops-card,.delete-card,.wizard-card,.stat,.summary-card,.info-card,.document-card,.assignment-card,.job-card,.worker-card,.payroll-card,.bank-card,.tax-card,.vehicle-card{border-color:var(--ct-border)!important;background:var(--ct-surface)!important;box-shadow:var(--ct-shadow)!important}
.panel,.card,.profile-panel,.report-card,.health-card,.security-card,.maintenance-card,.contract-card,.audit-check,.ops-card,.delete-card,.wizard-card,.info-card{border-radius:var(--ct-radius-lg)!important}
.dashboard-card,.module-card,.action-card{border-color:var(--ct-border)!important;background:var(--ct-surface)!important;box-shadow:var(--ct-shadow)!important}.dashboard-card:hover,.module-card:hover,.action-card:hover{border-color:var(--ct-primary)!important;box-shadow:var(--ct-shadow-hover)!important}
.btn,button.btn,input[type="submit"].btn,input[type="button"].btn{display:inline-flex;min-height:38px;align-items:center;justify-content:center;gap:7px;padding:8px 13px;border:1px solid var(--ct-border-strong);border-radius:var(--ct-radius-sm);background:var(--ct-surface);color:var(--ct-text);box-shadow:0 1px 1px rgba(16,24,40,.035);font:inherit;font-size:13px;font-weight:680;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .12s,border-color .12s,color .12s,box-shadow .12s,transform .08s}
.btn:hover,button.btn:hover{border-color:var(--ct-primary);background:var(--ct-surface-2);color:var(--ct-text);box-shadow:0 2px 5px rgba(16,24,40,.07)}.btn:active,button.btn:active{transform:translateY(1px)}
.btn:focus-visible,button.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:none;box-shadow:var(--ct-focus)}
.btn-primary{border-color:var(--ct-primary)!important;background:var(--ct-primary)!important;color:#fff!important}.btn-primary:hover{border-color:var(--ct-primary-hover)!important;background:var(--ct-primary-hover)!important;color:#fff!important}.btn-secondary{border-color:var(--ct-border-strong)!important;background:var(--ct-surface)!important;color:var(--ct-text)!important}.btn-danger,.danger-button,.delete-button{border-color:var(--ct-danger)!important;background:var(--ct-danger)!important;color:#fff!important}
.form-group{margin-bottom:15px}.form-group>label,label.form-label,.form-label{display:block;margin-bottom:6px;color:var(--ct-text);font-size:12px;font-weight:680}
.form-control,input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),select,textarea{width:100%;min-height:40px;padding:9px 11px;border:1px solid var(--ct-border-strong);border-radius:var(--ct-radius-sm);background:var(--ct-surface);color:var(--ct-text);font:inherit;font-size:13px;transition:border-color .12s,box-shadow .12s,background .12s}
textarea{min-height:88px;resize:vertical}select{cursor:pointer}.form-control:focus,input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]):focus,select:focus,textarea:focus{border-color:var(--ct-primary);outline:none;box-shadow:var(--ct-focus)}input[readonly],input[disabled],select[disabled],textarea[readonly],textarea[disabled]{background:var(--ct-surface-2);color:var(--ct-muted);cursor:not-allowed}input[type="checkbox"],input[type="radio"]{accent-color:var(--ct-primary)}small,.form-help,.help-text,.worker-muted,.muted{color:var(--ct-muted)!important}
.table-wrap,.table-responsive,[style*="overflow-x:auto"],[style*="overflow-x: auto"]{border-radius:var(--ct-radius)}
table,.table,.audit-table,.ops-table,.contract-table{width:100%;border-collapse:separate!important;border-spacing:0!important;background:transparent}table th,.table th,.audit-table th,.ops-table th,.contract-table th{padding:10px 12px!important;border-bottom:1px solid var(--ct-border-strong)!important;background:var(--ct-surface-2);color:var(--ct-muted)!important;font-size:10.5px!important;font-weight:760!important;letter-spacing:.055em!important;text-align:left;text-transform:uppercase;white-space:nowrap}table td,.table td,.audit-table td,.ops-table td,.contract-table td{padding:11px 12px!important;border-bottom:1px solid var(--ct-border)!important;background:transparent;color:var(--ct-text);font-size:13px;vertical-align:middle}table tbody tr{transition:background .1s}table tbody tr:hover{background:var(--ct-surface-2)}table tbody tr:last-child td{border-bottom-color:transparent!important}
.alert{margin-bottom:16px;padding:12px 14px;border:1px solid var(--ct-border);border-radius:var(--ct-radius);background:var(--ct-surface);color:var(--ct-text);box-shadow:0 1px 2px rgba(16,24,40,.025);line-height:1.5}.alert-success{border-color:var(--ct-success)!important}.alert-error,.alert-danger{border-color:var(--ct-danger)!important}.alert-warning{border-color:var(--ct-warning)!important}
dl{margin:0}dt{color:var(--ct-muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.045em}dd{margin:3px 0 14px;color:var(--ct-text)}hr{height:1px;margin:22px 0;border:0;background:var(--ct-border)}code{padding:2px 5px;border:1px solid var(--ct-border);border-radius:6px;background:var(--ct-surface-2);color:var(--ct-text);font-size:.92em}
details{border:1px solid var(--ct-border);border-radius:var(--ct-radius);background:var(--ct-surface)}details>summary{padding:11px 13px;color:var(--ct-text);font-weight:680;cursor:pointer}details[open]>summary{border-bottom:1px solid var(--ct-border)}details>:not(summary){margin-left:13px;margin-right:13px}
.profile-header{gap:18px!important;padding:20px!important}.profile-avatar{box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 6px 16px rgba(16,24,40,.12)}.profile-grid{gap:16px!important}.profile-panel{padding:20px!important}.empty-state{padding:34px 18px!important;color:var(--ct-muted)!important;text-align:center}.actions,.form-actions,.notification-actions,.contract-actions,.top-actions,.page-actions{display:flex;align-items:center;gap:8px!important;flex-wrap:wrap}
@media(max-width:900px){.topbar{align-items:flex-start}.topbar-actions{gap:6px}.topbar-user{display:none}.content{width:min(calc(100% - 24px),1480px);padding-top:20px}.page-heading{flex-direction:column;gap:10px}}
@media(max-width:620px){.topbar{position:relative;flex-direction:column;align-items:stretch;padding:10px 12px}.topbar-actions{justify-content:flex-start}.content{width:calc(100% - 20px);padding:16px 0 30px}.page-heading h1,.content>h1{font-size:25px}.panel,.card,.profile-panel,.report-card,.health-card,.security-card,.maintenance-card,.contract-card,.audit-check,.ops-card,.wizard-card{padding:15px!important;border-radius:var(--ct-radius)!important}table th,table td,.table th,.table td{padding:9px 10px!important}}