:root{--tsb-green:#93c120;--tsb-dark:#0f172a;--tsb-muted:#6c757d;}
body{background:#f6f8fb}
.text-brand{color:var(--tsb-green)!important}
.card{border:1px solid #e5e7eb}
.btn-primary{background:var(--tsb-green);border-color:var(--tsb-green)}
.btn-primary:hover{background:#7ead1b;border-color:#7ead1b}
.badge-status{background:#e9ecef;color:#333;border:1px solid #dee2e6}
.form-label{font-weight:500}

/* Status dropdown alignment */
.dropdown-menu form button.btn-link{display:flex;align-items:center;gap:.5rem;white-space:nowrap;}

/* Toast container positioning */
#toastContainer{
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1080; /* above modals backdrop */
  display: flex;
  flex-direction: column;
  gap: .5rem;
  pointer-events: none;
}
#toastContainer .toast{
  pointer-events: auto;
  min-width: 280px;
  max-width: 380px;
}

/* --- Responsive header / dashboard tweaks (v4) --- */
.app-topbar{ background:#0f5f7a; }
.app-topbar .navbar-brand{ font-weight:800; letter-spacing:.2px; }

/* Keep header above tables / sticky elements */
.app-navbar{
  position: sticky;
  top: 0;
  z-index: 2000;
  background: #fff;
  padding-top: .35rem;
  padding-bottom: .35rem;
}

/* Keep navbar compact, especially on desktop */
.app-navbar .navbar-brand{ display:flex; align-items:center; gap:.6rem; }

/* If header uses brand-logo, keep it constrained */
.brand-logo{ height:44px; width:auto; max-width:220px; object-fit:contain; }
@media (max-width: 576px){ .brand-logo{ height:36px; max-width:160px; } }

/* Constrain the company logo so it never overlaps page content */
.tsb-logo{ height:44px; width:auto; max-width:220px; object-fit:contain; }
@media (max-width: 576px){ .tsb-logo{ height:36px; max-width:160px; } }

/* Ensure all pages have left/right breathing room and don't run full-bleed */
.container-fluid{
  padding-left: 18px;
  padding-right: 18px;
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}
.app-nav-btn{
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.10);
  color:#fff !important;
  font-weight:700;
  padding:.55rem .9rem;
  border-radius: .6rem;
}
.app-nav-btn:hover{ background:rgba(255,255,255,.18); }
.app-nav-btn.active{ background:#ffffff; color:#0f5f7a !important; border-color:#ffffff; }
.app-avatar{
  width:40px; height:40px;
  border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.35);
  color:#fff;
  font-weight:900;
}

/* Image avatar in header dropdown */
.tsb-avatar{
  width:40px;
  height:40px;
  border-radius:999px;
  object-fit:cover;
}
.notif-bar{
  border:1px solid #dbeafe;
  background:#eff6ff;
  border-radius:14px;
  padding:14px 16px;
}
.notif-bar .title{ font-weight:900; }
.dash-stat{
  border-radius:16px;
  border:1px solid #e5e7eb;
}
.dash-stat .iconWrap{
  width:46px; height:46px;
  border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:#eef2ff;
  border:1px solid #e5e7eb;
}
.dash-stat .num{ font-size:28px; font-weight:900; line-height:1; }
.dash-stat .lbl{ color:#6b7280; font-weight:700; }

/* Main layout wrapper (keeps content away from edges and avoids "full width" feel) */
.tsb-main{
  max-width: 1280px;
  margin: 0 auto;
  padding: 16px;
}

@media (min-width: 992px){
  .tsb-main{ padding: 22px; }
}

@media (max-width: 575.98px){
  .tsb-main{ padding: 12px; }
}

@media (max-width: 575.98px){
  .app-nav-btn{ width:100%; justify-content:flex-start; }
}

/* Portal status badge palette */
.badge.ps-default{ background:#0f5f7a; }
.badge.ps-to-be-booked{ background:#6b7280; }
.badge.ps-date-booked{ background:#475569; }
.badge.ps-assigned-to-subcontractor{ background:#0ea5e9; }
.badge.ps-assigned-to-operative{ background:#2563eb; }
.badge.ps-on-route{ background:#0284c7; }
.badge.ps-on-site{ background:#16a34a; }
.badge.ps-off-site{ background:#64748b; }
.badge.ps-return-required{ background:#f59e0b; color:#111827; }
.badge.ps-job-complete{ background:#22c55e; }

/* ---- Layout helpers ---- */
.app-container{
  max-width: 1280px;
}

/* Ensure sticky header never overlaps content */
.app-navbar{
  z-index: 1030;
}

/* --- Dashboard stat cards (slick grid) --- */
.app-stat-card{border-radius:18px; transition:transform .08s ease, box-shadow .08s ease;}
.app-stat-card:hover{transform:translateY(-1px); box-shadow:0 10px 24px rgba(15,23,42,.08);}
.app-stat-icon{width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:#eef2ff;border:1px solid #e5e7eb;font-size:26px;}
.app-stat-num{font-size:30px;font-weight:900;line-height:1;}
.app-stat-label{color:#6b7280;font-weight:700;}

/* Screenpop-style Compliance Hub refresh */
:root{--tsb:#93c120;--tsb2:#78a414;--ink:#172033;--muted:#687385;--line:#e3e9ef;--soft:#f6f8fb;--blue:#1d7afc;--orange:#ff9f1c;--purple:#7c3aed;}
body{background:linear-gradient(180deg,#f7fafc 0,#edf3f7 100%);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;}
.app-nav,.app-navbar{background:rgba(255,255,255,.94)!important;backdrop-filter:blur(14px);border-bottom:1px solid var(--line)!important;box-shadow:0 8px 25px rgba(15,23,42,.04)!important;}
.nav-link{border-radius:999px;padding:.55rem .9rem!important;color:#334155!important;font-weight:700;}
.nav-link.active,.nav-link:hover{background:#eef7dd;color:#406000!important;}
.dropdown-menu{border-radius:18px;border:1px solid var(--line);box-shadow:0 20px 60px rgba(15,23,42,.12);padding:.5rem;}
.dropdown-item{border-radius:12px;padding:.62rem .75rem;}
.hero{border:1px solid var(--line);background:radial-gradient(circle at top right,rgba(147,193,32,.24),transparent 35%),linear-gradient(135deg,#fff 0%,#fff 58%,#f3fae9 100%);border-radius:30px;padding:28px;box-shadow:0 18px 60px rgba(15,23,42,.075);}
.section-title{font-size:1.1rem;font-weight:900;margin-bottom:1rem;}
.card-soft{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 14px 35px rgba(15,23,42,.06);}
.metric{border-radius:22px;padding:20px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px rgba(15,23,42,.045);}
.pill{display:inline-flex;align-items:center;gap:.45rem;border:1px solid var(--line);border-radius:999px;padding:.42rem .72rem;background:#fff;color:#475569;font-size:.9rem;}
.action-btn{border-radius:16px;font-weight:800;}
.form-control,.form-select{border-radius:14px;border-color:#d9e1ea;}
.badge-soft{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.34rem .58rem;font-weight:800;font-size:.78rem;}
.badge-green{background:#eef7dd;color:#527400;border:1px solid #d8edb7;}.badge-blue{background:#eaf2ff;color:#155cc5;border:1px solid #cfe0ff;}.badge-orange{background:#fff3df;color:#a45b00;border:1px solid #ffe0ad;}.badge-purple{background:#f1e9ff;color:#5b21b6;border:1px solid #ded0ff;}.badge-grey{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0;}
.empty{border:2px dashed #d8dee8;border-radius:24px;padding:32px;text-align:center;color:var(--muted);background:#fff;}
.note-card{border:1px solid rgba(15,23,42,.10);border-left:7px solid #cbd5e1;border-radius:1rem;padding:1rem;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.04);}
.fw-black{font-weight:900;}
.progress-bar{background:var(--tsb2);}
@media(max-width:991px){.hero{padding:22px}.mobile-actions{position:sticky;bottom:12px;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:22px;padding:10px;box-shadow:0 15px 45px rgba(15,23,42,.15)}}

/* Compliance Hub onboarding refinements */
:root{--tsb-green:#93c120;--tsb-green-dark:#6d9612;--tsb-ink:#172033;--tsb-soft:#f6faef;}
.onb-page{background:linear-gradient(180deg,#f8fafc 0%,#f3f7ec 100%);min-height:100vh;}
.onb-shell{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start;}
.onb-progress{position:sticky;top:22px;border-radius:28px;background:#fff;border:1px solid rgba(148,163,184,.25);box-shadow:0 20px 60px rgba(15,23,42,.08);padding:18px;}
.onb-progress .brand-mini{width:42px;height:42px;border-radius:16px;background:var(--tsb-soft);display:grid;place-items:center;color:var(--tsb-green-dark);font-weight:900;}
.onb-step-link{display:flex;align-items:center;gap:.75rem;width:100%;border:0;background:transparent;text-align:left;padding:.78rem .85rem;border-radius:17px;color:#475569;font-weight:800;transition:.18s ease;margin:.15rem 0;}
.onb-step-link .num{width:30px;height:30px;border-radius:999px;background:#f1f5f9;color:#64748b;display:grid;place-items:center;font-size:.82rem;font-weight:900;}
.onb-step-link.active,.onb-step-link:hover{background:#eef8db;color:#3f5f00;}
.onb-step-link.active .num{background:var(--tsb-green);color:#fff;}
.onb-step-link.done .num{background:#e8f7cf;color:#4f7a00;}
.onb-card{background:#fff;border:1px solid rgba(148,163,184,.25);border-radius:30px;box-shadow:0 18px 55px rgba(15,23,42,.07);padding:28px;}
.onb-card h2{font-weight:950;letter-spacing:-.02em;color:var(--tsb-ink);}
.onb-subtitle{color:#64748b;font-size:1rem;}
.onb-intro{border-radius:24px;background:linear-gradient(135deg,#f8fff0,#fff);border:1px solid #ddecbd;padding:18px;color:#334155;}
.onb-fieldset{border:1px solid rgba(148,163,184,.25);border-radius:24px;padding:18px;background:#fbfcfe;}
.onb-fieldset legend{float:none;width:auto;font-size:1rem;font-weight:900;padding:0 .25rem;color:#172033;}
.onb-form .form-control,.onb-form .form-select{border-radius:15px;border-color:#dbe4ef;padding:.78rem .9rem;}
.onb-form .form-control:focus,.onb-form .form-select:focus{border-color:var(--tsb-green);box-shadow:0 0 0 .25rem rgba(147,193,32,.18);}
.onb-help{font-size:.88rem;color:#64748b;}
.tsb-check-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;}
.tsb-check-card{position:relative;display:flex;align-items:center;gap:.75rem;border:1px solid #dbe4ef;background:#fff;border-radius:18px;padding:.82rem .95rem;cursor:pointer;font-weight:800;color:#334155;transition:.16s ease;min-height:52px;}
.tsb-check-card:hover{border-color:#b8d96d;box-shadow:0 10px 26px rgba(147,193,32,.12);transform:translateY(-1px);}
.tsb-check-card input{position:absolute;opacity:0;pointer-events:none;}
.tsb-check-card .fake-check{width:24px;height:24px;min-width:24px;border-radius:9px;border:2px solid #cbd5e1;background:#fff;display:grid;place-items:center;transition:.15s ease;}
.tsb-check-card .fake-check::after{content:'\F26E';font-family:'bootstrap-icons';font-size:14px;line-height:1;color:#fff;opacity:0;transform:scale(.65);transition:.15s ease;}
.tsb-check-card:has(input:checked){border-color:var(--tsb-green);background:#f4fbe8;color:#2f4c00;box-shadow:0 10px 28px rgba(147,193,32,.14);}
.tsb-check-card:has(input:checked) .fake-check{background:var(--tsb-green);border-color:var(--tsb-green);}
.tsb-check-card:has(input:checked) .fake-check::after{opacity:1;transform:scale(1);}
.region-matrix{display:grid;grid-template-columns:1fr 110px 135px;gap:8px;align-items:center;}
.region-matrix .matrix-head{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:#64748b;font-weight:900;}
.region-row{display:contents;}
.region-row .region-name{padding:.7rem .8rem;background:#fff;border:1px solid #e2e8f0;border-radius:14px;font-weight:800;color:#334155;}
.region-row .region-check{display:flex;justify-content:center;padding:.7rem;background:#fff;border:1px solid #e2e8f0;border-radius:14px;}
.onb-signature-wrap{border-radius:24px;border:1px solid #dbe4ef;background:#f8fafc;padding:12px;}
.sig-pad{display:block;width:100%;height:230px;border:2px dashed #b8c7d9;border-radius:20px;background:#fff;touch-action:none;cursor:crosshair;}
.sig-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;}
.agreement-box{max-height:590px;overflow:auto;border:1px solid #dbe4ef;border-radius:24px;background:#fff;padding:22px;line-height:1.6;}
.agreement-box h3{font-size:1rem;font-weight:950;margin-top:1.15rem;color:#172033;}
.agreement-box p{margin-bottom:.85rem;}
.onb-actions{display:flex;justify-content:space-between;gap:12px;margin-top:18px;}
.onb-actions .btn{border-radius:16px;font-weight:900;padding:.85rem 1.1rem;}
@media(max-width:991px){.onb-shell{display:block}.onb-progress{position:static;margin-bottom:16px}.onb-step-link{display:none}.onb-step-link.active{display:flex}.onb-card{padding:20px;border-radius:24px}.region-matrix{grid-template-columns:1fr 88px 110px}.onb-actions{position:sticky;bottom:12px;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border:1px solid #dbe4ef;border-radius:22px;padding:10px;box-shadow:0 15px 45px rgba(15,23,42,.14)}}
@supports not selector(:has(*)){.tsb-check-card.checked{border-color:var(--tsb-green);background:#f4fbe8;color:#2f4c00}.tsb-check-card.checked .fake-check{background:var(--tsb-green);border-color:var(--tsb-green)}.tsb-check-card.checked .fake-check::after{opacity:1;transform:scale(1)}}


/* Onboarding wizard section visibility + icon polish */
.step-card{display:none;}
.step-card.active{display:block;animation:onbFade .18s ease-out;}
@keyframes onbFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.onb-step-link .step-ico{width:32px;height:32px;border-radius:12px;display:grid;place-items:center;background:#f8fafc;color:#64748b;border:1px solid #e2e8f0;font-size:1rem;}
.onb-step-link.active .step-ico,.onb-step-link.done .step-ico{background:#eef8db;color:#5f8700;border-color:#d8edb7;}
.onb-card h2 .section-ico{width:42px;height:42px;border-radius:16px;display:inline-grid;place-items:center;background:#eef8db;color:#5f8700;margin-right:.55rem;vertical-align:middle;font-size:1.15rem;}
.region-matrix .matrix-head.text-center{display:flex;align-items:center;justify-content:center;gap:.35rem;}
.region-matrix .matrix-head.text-center::before{font-family:'bootstrap-icons';color:var(--tsb-green);font-size:1rem;}
.region-matrix .matrix-head:nth-child(2)::before{content:'\F633';}
.region-matrix .matrix-head:nth-child(3)::before{content:'\F1D7';}

/* Onboarding UX patch: drag/drop uploads, fixed signature alignment, exclusive region state */
.drop-upload{position:relative;border:2px dashed #cbd5e1;border-radius:16px;background:#f8fafc;min-height:58px;padding:.7rem .85rem;display:flex;align-items:center;gap:.6rem;color:#64748b;font-weight:800;cursor:pointer;transition:.16s ease;overflow:hidden;}
.drop-upload i{font-size:1.25rem;color:var(--tsb-green-dark,#6d9612);}
.drop-upload:hover,.drop-upload.dragover{border-color:var(--tsb-green,#93c120);background:#f4fbe8;color:#2f4c00;box-shadow:0 10px 24px rgba(147,193,32,.12);}
.drop-upload input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;}
.sig-pad{width:100%!important;height:230px!important;display:block;touch-action:none;cursor:crosshair;}
.region-row .tsb-check-card.checked .fake-check{background:var(--tsb-green,#93c120);border-color:var(--tsb-green,#93c120);}
.region-row .tsb-check-card.checked .fake-check::after{opacity:1;transform:scale(1);}
#copyPlToEl{border-radius:999px;font-weight:800;vertical-align:middle;}

/* Compliance Hub admin review additions */
.review-field{background:#f8fafc;border:1px solid #e5edf6;border-radius:18px;padding:14px 16px;min-height:72px;}
.signature-review{background:#fff;border:1px dashed #cbd8e6;border-radius:18px;padding:12px;}
.signature-review img{display:block;max-width:100%;height:auto;max-height:220px;object-fit:contain;}

/* Compliance streamlining patch */
.doc-review-card{
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  border-radius:22px;
  padding:18px;
  box-shadow:0 10px 28px rgba(15,23,42,.045);
}
.badge-red{background:#fee2e2;color:#991b1b;border:1px solid #fecaca;}
.badge-orange,.badge-amber{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;}
.badge-grey{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0;}
.badge-green{background:#eef9dc;color:#4d7600;border:1px solid #d6efb2;}
.drop-zone{
  border:2px dashed #cbd5e1;
  border-radius:18px;
  padding:14px;
  background:linear-gradient(180deg,#fff,#f8fafc);
  transition:.16s ease;
}
.drop-zone.drag-over{
  border-color:#93c120;
  background:#f3fce8;
  box-shadow:0 0 0 4px rgba(147,193,32,.12);
}
.sleek-check .form-check-input:checked{background-color:#93c120;border-color:#93c120;}

/* Compliance warning logic patch */
.badge-orange { background:#fff7e6 !important; color:#b26a00 !important; border:1px solid #ffd591 !important; }
.badge-green { background:#f6ffed !important; color:#237804 !important; border:1px solid #b7eb8f !important; }
.badge-grey { background:#fff1f0 !important; color:#a8071a !important; border:1px solid #ffa39e !important; }
.score-warning, .score-review { border-color:#ffd591 !important; background:#fffdf5 !important; }

/* Subcontractor lifecycle badges */
.lifecycle-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .65rem;border-radius:999px;font-size:.78rem;font-weight:800;text-transform:capitalize;border:1px solid transparent;white-space:nowrap}
.lifecycle-active{background:#f6ffed;color:#237804;border-color:#b7eb8f}
.lifecycle-pending{background:#fff7e6;color:#ad6800;border-color:#ffd591}
.lifecycle-suspended{background:#fff1f0;color:#a8071a;border-color:#ffa39e}
.lifecycle-inactive{background:#f5f5f5;color:#595959;border-color:#d9d9d9}
.lifecycle-archived{background:#f0f2f5;color:#434343;border-color:#bfbfbf}
.lifecycle-filter-card{background:#fff;border:0;border-radius:1.25rem;box-shadow:0 10px 30px rgba(15,23,42,.06)}


/* Layout overflow fix - keeps header/menu and compliance actions within viewport */
html, body{max-width:100%;overflow-x:hidden;}
.app-navbar{overflow:visible;}
.app-navbar .app-container{max-width:100%;width:100%;padding-left:1rem;padding-right:1rem;}
.app-navbar .navbar-brand{flex:0 0 auto;min-width:0;}
.app-navbar .navbar-collapse{min-width:0;}
.app-navbar .navbar-nav{min-width:0;flex-wrap:wrap;justify-content:flex-end;row-gap:.25rem;}
.app-navbar .nav-item{min-width:0;}
.app-navbar .nav-link{border-radius:14px;line-height:1.15;text-align:center;white-space:normal;padding:.55rem .55rem;font-weight:800;font-size:.92rem;max-width:118px;}
.app-navbar .nav-link i{display:block;margin:0 auto .18rem!important;font-size:1rem;}
.app-navbar .dropdown .nav-link i{display:inline-block;margin:0 .25rem 0 0!important;}
.tsb-logo{max-width:120px;height:auto;}
@media (min-width: 1200px){
  .app-navbar .nav-link{font-size:.86rem;max-width:104px;padding:.48rem .45rem;}
  .app-navbar .navbar-brand span{font-size:1rem;}
}
@media (max-width: 1199.98px){
  .app-navbar .navbar-nav{align-items:stretch!important;flex-wrap:nowrap;}
  .app-navbar .nav-link{max-width:none;text-align:left;display:flex;align-items:center;gap:.5rem;}
  .app-navbar .nav-link i{display:inline-block;margin:0!important;}
}

/* Compliance register action buttons - wrap instead of forcing horizontal scroll */
.table-responsive{max-width:100%;overflow-x:auto;}
.actions-col{min-width:320px;text-align:left!important;}
.actions-cell{white-space:normal!important;min-width:320px;}
.action-wrap{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-start;align-items:center;max-width:520px;}
.action-wrap .btn{white-space:nowrap;border-radius:10px;}
@media (max-width: 991.98px){
  .actions-col,.actions-cell{min-width:260px;}
  .action-wrap{max-width:320px;}
  .action-wrap .btn{flex:1 1 auto;}
}

/* Compact grouped navigation */
.compact-nav .dropdown-menu .dropdown-item{display:flex;align-items:center;gap:.25rem;border-radius:12px;font-weight:700;}
.compact-nav .dropdown-menu .dropdown-item:hover{background:#f3f9e8;color:#315b02;}
@media (min-width: 992px){
  .compact-nav .nav-link{max-width:none!important;white-space:nowrap!important;display:flex!important;align-items:center;gap:.35rem;text-align:left!important;}
  .compact-nav .nav-link i{display:inline-block!important;margin:0!important;}
}
