/* ============================================================
   TradeRail — Crew & Compliance (foundation)
   Build marker: Crew & Compliance Foundation May 18

   Foundation + active starter module styles for the Crew &
   Compliance vertical. Mirrors the Fleet Management + Equipment
   & Tools foundation styling so the three verticals feel
   consistent.

   Active-looking elements route, filter, expand, or explain;
   passive items render flat / muted so users don't mistake them
   for live controls. Layout uses responsive grid + flex-wrap so
   mobile screens never overflow horizontally.
   ============================================================ */

#vCrewCompliance{
  display:none;
  padding:18px 14px 80px;
  max-width:1100px;
  margin:0 auto;
  color:var(--tx, #1a2e2b);
  box-sizing:border-box;
  width:100%;
  overflow-x:hidden;
}
#vCrewCompliance.cc-show{display:block;}

#vCrewCompliance *,
#vCrewCompliance *::before,
#vCrewCompliance *::after{box-sizing:border-box;}

body[data-cc-active="1"] #vHome,
body[data-cc-active="1"] #vPlanHub,
body[data-cc-active="1"] #vService,
body[data-cc-active="1"] #vScheduler,
body[data-cc-active="1"] #vProjects,
body[data-cc-active="1"] #vCategory,
body[data-cc-active="1"] #vFleetManagement,
body[data-cc-active="1"] #vEquipmentTools{
  display:none !important;
}

.cc-workarea-bar{
  position:sticky;
  top:0;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:8px;
  background:var(--white, #fff);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:12px;
  padding:8px 10px;
  margin-bottom:10px;
  box-shadow:0 2px 10px rgba(20,19,16,.06);
}
.cc-workarea-title{
  font-family:'Barlow Condensed', sans-serif;
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--navy, #141310);
  font-weight:700;
}
.cc-back-btn{ background:var(--navy, #141310); }
.cc-back-btn:hover{ background:var(--navy-md, #1A1916); }

.cc-hero{
  background:linear-gradient(135deg, var(--navy, #141310), var(--navy-md, #1A1916));
  color:#fff;
  border-radius:18px;
  padding:22px 22px 24px;
  margin-bottom:18px;
  box-shadow:0 8px 24px rgba(20,19,16,.12);
}
.cc-hero-eyebrow{
  display:inline-block;
  font-family:'Barlow Condensed', sans-serif;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  background:rgba(233,196,106,.18);
  color:#e9c46a;
  padding:4px 10px;
  border-radius:999px;
  margin-bottom:10px;
}
.cc-hero h1{
  font-family:'Barlow Condensed', sans-serif;
  font-size:28px;
  font-weight:700;
  margin:0 0 6px;
  letter-spacing:.01em;
}
.cc-hero p{
  font-size:14px;
  line-height:1.55;
  color:#cfe2dd;
  margin:0 0 6px;
  max-width:760px;
}

.cc-section-nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:14px;
}
.cc-jump-btn{
  background:var(--white, #fff);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:999px;
  padding:6px 12px;
  font-family:'Barlow Condensed', sans-serif;
  font-size:13px;
  font-weight:600;
  color:var(--navy, #141310);
  cursor:pointer;
  transition:background .12s, border-color .12s;
}
.cc-jump-btn:hover{
  background:var(--bd-lt, #eef4f3);
  border-color:var(--teal, #FF6B00);
}

.cc-section{
  background:var(--white, #fff);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:14px;
  padding:16px 18px;
  margin-bottom:14px;
  transition:box-shadow .25s;
}
.cc-section h2{
  font-family:'Barlow Condensed', sans-serif;
  font-size:18px;
  font-weight:700;
  margin:0 0 8px;
  color:var(--navy, #141310);
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
.cc-section p{
  font-size:13px;
  line-height:1.55;
  color:var(--tx-md, #4a6b65);
  margin:0 0 10px;
}
.cc-scroll-flash{
  box-shadow:0 0 0 3px rgba(255,107,0,.45);
}

.cc-demo-tag{
  display:inline-block;
  font-family:'Barlow Condensed', sans-serif;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  background:var(--teal-lt, #FFF0E5);
  color:var(--teal-dk, #D95A00);
  border:1px solid var(--teal-md, #FFD4B0);
  padding:3px 8px;
  border-radius:999px;
}

/* Trade chips row */
.cc-trade-row{
  background:var(--bd-lt, #eef4f3);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:10px;
  padding:10px 12px;
  margin-bottom:12px;
}
.cc-trade-row-label{
  font-family:'Barlow Condensed', sans-serif;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--navy, #141310);
  font-weight:700;
  margin-bottom:6px;
}
.cc-trade-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:6px;
}
.cc-trade-chip{
  background:var(--white, #fff);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:999px;
  padding:5px 12px;
  font-size:12px;
  font-weight:600;
  color:var(--navy, #141310);
  cursor:pointer;
  transition:background .12s, border-color .12s;
}
.cc-trade-chip:hover{
  background:var(--bd-lt, #eef4f3);
  border-color:var(--teal, #FF6B00);
}
.cc-trade-chip-active{
  background:var(--teal, #FF6B00);
  color:#fff;
  border-color:var(--teal-dk, #D95A00);
}
.cc-trade-row-desc{
  font-size:12px;
  color:var(--tx-md, #4a6b65);
  margin:4px 0 0;
}

/* Form fields */
.cc-form{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px 12px;
  margin-bottom:14px;
}
.cc-field{
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
}
.cc-field-wide{ grid-column: 1 / -1; }
.cc-field-check{
  flex-direction:row;
  align-items:center;
  gap:8px;
}
.cc-field > span{
  font-family:'Barlow Condensed', sans-serif;
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--tx-md, #4a6b65);
  font-weight:700;
}
.cc-field input[type="text"],
.cc-field input[type="date"],
.cc-field select{
  width:100%;
  padding:8px 10px;
  border:1px solid var(--bd, #d8e8e5);
  border-radius:8px;
  font-size:13px;
  background:var(--white, #fff);
  color:var(--tx, #1a2e2b);
  font-family:'Barlow', sans-serif;
}
.cc-field input:focus,
.cc-field select:focus{
  outline:none;
  border-color:var(--teal, #FF6B00);
  box-shadow:0 0 0 2px rgba(255,107,0,.15);
}
.cc-form-actions{
  grid-column:1 / -1;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* Buttons */
.cc-active-btn{
  background:var(--teal, #FF6B00);
  color:#fff;
  border:none;
  border-radius:8px;
  padding:8px 14px;
  font-family:'Barlow Condensed', sans-serif;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:background .12s;
}
.cc-active-btn:hover{ background:var(--teal-dk, #D95A00); }
.cc-active-btn:disabled{ background:#a8c4c0; cursor:not-allowed; }
.cc-active-btn.cc-secondary{
  background:var(--white, #fff);
  color:var(--navy, #141310);
  border:1px solid var(--bd, #d8e8e5);
}
.cc-active-btn.cc-secondary:hover{
  background:var(--bd-lt, #eef4f3);
  border-color:var(--teal, #FF6B00);
}

/* Rows */
.cc-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:8px;
}
.cc-row{
  background:var(--bd-lt, #eef4f3);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:10px;
  overflow:hidden;
}
.cc-row-head{
  width:100%;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  background:transparent;
  border:none;
  padding:10px 12px;
  text-align:left;
  cursor:pointer;
  font-family:inherit;
  color:var(--tx, #1a2e2b);
}
.cc-row-head:hover{ background:rgba(255,255,255,.5); }
.cc-row-name{
  font-weight:700;
  font-size:14px;
  color:var(--navy, #141310);
  flex:1 1 200px;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cc-row-meta{
  font-size:12px;
  color:var(--tx-md, #4a6b65);
}
.cc-row-toggle{
  font-size:14px;
  color:var(--tx-md, #4a6b65);
  margin-left:auto;
}
.cc-row[data-expanded="1"] .cc-row-head{
  background:rgba(255,255,255,.65);
}

.cc-emp-detail,
.cc-cert-detail,
.cc-intake-detail{
  background:var(--white, #fff);
  border-top:1px solid var(--bd, #d8e8e5);
  padding:10px 12px;
  font-size:12px;
  line-height:1.55;
  color:var(--tx-md, #4a6b65);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.cc-emp-cert-block{
  margin-top:4px;
  padding-top:6px;
  border-top:1px dashed var(--bd, #d8e8e5);
}
.cc-emp-cert-list{
  margin:4px 0 0;
  padding-left:18px;
}

/* Status pills */
.cc-status-pill{
  display:inline-block;
  font-size:11px;
  font-family:'Barlow Condensed', sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid transparent;
  cursor:help;
}
.cc-status-valid,
.cc-status-active{
  background:#e6f5ee;
  color:#D95A00;
  border-color:#c4ead7;
}
.cc-status-expiring_soon,
.cc-status-on_leave,
.cc-status-pending_renewal,
.cc-status-pending_verification,
.cc-status-pending,
.cc-status-review-pending,
.cc-status-review-needs_correction{
  background:#fff5e0;
  color:#a3781b;
  border-color:#f3e0a8;
}
.cc-status-expired,
.cc-status-revoked,
.cc-status-terminated{
  background:#fde6e0;
  color:#a13e25;
  border-color:#f5b8a8;
}
.cc-status-inactive,
.cc-status-not_required,
.cc-status-review-discarded{
  background:#e9ecf0;
  color:#536579;
  border-color:#cbd3dc;
}
.cc-status-review-applied{
  background:#dff3ec;
  color:#D95A00;
  border-color:#aedbc9;
}

.cc-proof-pill{
  display:inline-block;
  font-size:11px;
  font-family:'Barlow Condensed', sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid transparent;
  cursor:help;
}
.cc-proof-attached{
  background:#e6f5ee; color:#D95A00; border-color:#c4ead7;
}
.cc-proof-missing{
  background:#fde6e0; color:#a13e25; border-color:#f5b8a8;
}
.cc-proof-not-required{
  background:#e9ecf0; color:#536579; border-color:#cbd3dc;
}

/* Readiness card */
.cc-readiness-card{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:10px 12px;
}
.cc-readiness-out{
  grid-column: 1 / -1;
  border-radius:10px;
  padding:12px 14px;
  border:1px solid var(--bd, #d8e8e5);
  background:var(--white, #fff);
}
.cc-readiness-headline{
  font-family:'Barlow Condensed', sans-serif;
  font-size:16px;
  font-weight:700;
  margin-bottom:6px;
  color:var(--navy, #141310);
}
.cc-readiness-cleared{
  background:#e6f5ee; border-color:#aedbc9;
}
.cc-readiness-warning{
  background:#fff5e0; border-color:#f3e0a8;
}
.cc-readiness-blocked{
  background:#fde6e0; border-color:#f5b8a8;
}
.cc-readiness-unknown{
  background:#e9ecf0; border-color:#cbd3dc;
}
.cc-readiness-reasons{
  margin:4px 0 8px;
  padding-left:18px;
  font-size:12px;
  color:var(--tx-md, #4a6b65);
}
.cc-readiness-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:8px 12px;
  font-size:12px;
  color:var(--tx-md, #4a6b65);
  margin-top:4px;
}
.cc-cert-tag{
  display:inline-block;
  background:var(--white, #fff);
  border:1px solid var(--bd, #d8e8e5);
  border-radius:6px;
  padding:2px 8px;
  font-size:11px;
  margin:2px 4px 2px 0;
  color:var(--navy, #141310);
  cursor:help;
}
.cc-readiness-advisory{
  margin-top:8px;
  font-size:11px;
  color:var(--tx-md, #4a6b65);
  font-style:italic;
}

/* Intake drop zone */
.cc-intake-drop{
  border:2px dashed var(--teal, #FF6B00);
  background:rgba(255,107,0,.05);
  border-radius:14px;
  padding:18px 14px;
  text-align:center;
  cursor:pointer;
  transition:background .15s;
  margin-bottom:10px;
}
.cc-intake-drop:hover,
.cc-intake-drop:focus,
.cc-intake-drop-hot{
  background:rgba(255,107,0,.12);
  outline:none;
}
.cc-intake-drop-inner strong{
  display:block;
  font-family:'Barlow Condensed', sans-serif;
  font-size:15px;
  color:var(--navy, #141310);
  margin-bottom:4px;
}
.cc-intake-drop-inner p{
  font-size:12px;
  color:var(--tx-md, #4a6b65);
  margin:0;
}
.cc-intake-employee-hint{
  margin-bottom:10px;
}
.cc-intake-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:6px;
}
.cc-intake-extracted ul{
  margin:4px 0;
  padding-left:18px;
}
.cc-intake-advisory{
  font-style:italic;
  font-size:11px;
  color:var(--tx-md, #4a6b65);
  margin-top:6px;
}

/* Passive rows for the "coming next" section */
.cc-passive-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:8px;
}
.cc-passive-row{
  border:1px dashed var(--bd, #d8e8e5);
  border-radius:8px;
  padding:8px 10px;
  font-size:12px;
  color:var(--tx-lt, #8aada8);
  background:var(--bd-lt, #eef4f3);
  user-select:none;
}

.cc-empty{
  background:var(--bd-lt, #eef4f3);
  border:1px dashed var(--bd, #d8e8e5);
  border-radius:10px;
  padding:14px;
  text-align:center;
  font-size:13px;
  color:var(--tx-md, #4a6b65);
}
.cc-empty-inline{
  padding:6px 0;
  background:transparent;
  border:none;
  text-align:left;
}
.cc-muted{
  color:var(--tx-lt, #8aada8);
  font-size:11px;
}

@media (max-width: 560px){
  #vCrewCompliance{ padding:12px 8px 80px; }
  .cc-hero{ padding:18px 16px; }
  .cc-hero h1{ font-size:22px; }
  .cc-row-name{ flex-basis:100%; }
  .cc-row-meta{ flex-basis:100%; }
}

/* PR105 — Renewal alerts + persistence grid */
.cc-renewal-row{
  border-left: 4px solid #cbd3dc;
  padding-left: 8px;
}
.cc-renewal-row[data-cc-severity="blocked"]{
  border-left-color:#a13e25;
  background:#fdf2ee;
}
.cc-renewal-row[data-cc-severity="warning"]{
  border-left-color:#b06f00;
  background:#fff9e8;
}
.cc-renewal-blocked{
  background:#fde6e0; color:#a13e25; border-color:#f5b8a8;
}
.cc-renewal-warning{
  background:#fff5e0; color:#b06f00; border-color:#f3e0a8;
}
.cc-renewal-info{
  background:#e9ecf0; color:#536579; border-color:#cbd3dc;
}
.cc-renewal-detail{
  font-size:12px;
  color:var(--tx-md, #4a6b65);
  padding:4px 0 0 0;
  display:grid;
  gap:2px;
}

.cc-persistence-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:10px 12px;
  font-size:13px;
}
.cc-persistence-grid > div{
  padding:8px 10px;
  border-radius:8px;
  border:1px dashed var(--bd, #d8e8e5);
  background:rgba(255,255,255,0.55);
}

/* PR106 — Crew assignment & dispatch readiness */
.cc-assign-target-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px 8px;
  margin:8px 0;
}
.cc-assign-chip{
  border-radius:14px;
  padding:4px 10px;
  font-size:13px;
}
.cc-assign-preview{
  border:1px solid var(--bd, #d8e8e5);
  padding:8px 10px;
  border-radius:8px;
  background:rgba(255,255,255,0.55);
  font-size:13px;
  margin:6px 0;
}
.cc-assign-preview[data-cc-outcome="cleared"]{
  background:#e6f5ee; border-color:#aedbc9;
}
.cc-assign-preview[data-cc-outcome="warning"]{
  background:#fff5e0; border-color:#f3e0a8;
}
.cc-assign-preview[data-cc-outcome="blocked"]{
  background:#fde6e0; border-color:#f5b8a8;
}
.cc-assign-preview-empty{
  font-style:italic;
  color:var(--tx-md, #4a6b65);
}
.cc-assign-override-flash{
  animation: cc-assign-flash 0.8s ease;
}
@keyframes cc-assign-flash{
  0%   { box-shadow: 0 0 0 0 rgba(161,62,37,0); }
  20%  { box-shadow: 0 0 0 4px rgba(161,62,37,0.35); }
  100% { box-shadow: 0 0 0 0 rgba(161,62,37,0); }
}
.cc-assign-row[data-expanded="1"]{
  background:rgba(255,255,255,0.65);
}
.cc-assign-detail{
  padding:6px 10px 4px;
  font-size:13px;
  color:var(--tx-md, #4a6b65);
  display:grid;
  gap:4px;
}

/* PR107 — Lily compliance intake review enhancements */
.cc-confidence-pill{
  display:inline-block;
  font-size:11px;
  font-family:'Barlow Condensed', sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid transparent;
  cursor:help;
}
.cc-confidence-high{
  background:#e6f5ee; color:#D95A00; border-color:#c4ead7;
}
.cc-confidence-medium{
  background:#fff5e0; color:#b06f00; border-color:#f3e0a8;
}
.cc-confidence-low{
  background:#fde6e0; color:#a13e25; border-color:#f5b8a8;
}
.cc-confidence-unknown{
  background:#e9ecf0; color:#536579; border-color:#cbd3dc;
}
.cc-dest-pill{
  display:inline-block;
  font-size:11px;
  font-family:'Barlow Condensed', sans-serif;
  letter-spacing:.04em;
  padding:2px 8px;
  border-radius:999px;
  border:1px dashed var(--bd, #d8e8e5);
  background:rgba(255,255,255,0.55);
  color:var(--tx-md, #4a6b65);
  cursor:help;
}
.cc-apply-recompute{
  margin-top:10px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #c4ead7;
  background:#e6f5ee;
  font-size:13px;
}
.cc-apply-recompute ul{
  margin:4px 0 0 16px;
  padding:0;
}
.cc-apply-recompute-empty{
  background:#e9ecf0;
  border-color:#cbd3dc;
  color:#536579;
}