/* FW Dispatch v2.4 / Build 27.
   Adds guarded feedback deletion and a live recipient-specific notification
   centre while preserving Build 26 sessions and appearance controls. */
.build-tag {
  margin-top: 18px;
  color: var(--muted);
  font-size: .62rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
}
.live-state { display: inline-flex; align-items: center; gap: 7px; }
.live-state::before,
.sidebar-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 10px var(--green);
  content: "";
}
.login-card button[disabled] { cursor: wait; opacity: .72; }
.readonly-note { color: var(--muted); font-size: .64rem; line-height: 1.45; }
.company-card.disabled { opacity: .68; }
.company-card.disabled .company-logo { filter: grayscale(.65); }
.company-access-setting small { display: block; margin-top: 6px; color: var(--muted); font-size: .62rem; line-height: 1.45; }
.permission-editor { overflow: hidden; border: 1px solid rgba(var(--accent-rgb),.24); border-radius: 13px; background: rgba(var(--accent-rgb),.035); }
.permission-editor-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 13px; border-bottom: 1px solid rgba(149,162,181,.14); }
.permission-editor-head strong { color: var(--text); font-size: .76rem; }
.permission-editor-head span { color: var(--muted); font-size: .61rem; text-align: right; }
.permission-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: rgba(149,162,181,.12); }
.permission-choice { display: flex; align-items: flex-start; gap: 9px; padding: 11px 12px; background: var(--panel); cursor: pointer; }
.permission-choice input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--yellow); }
.permission-choice span,.permission-choice b,.permission-choice small { display: block; }
.permission-choice b { color: var(--text); font-size: .68rem; }
.permission-choice small { margin-top: 3px; color: var(--muted); font-size: .58rem; font-weight: 500; line-height: 1.38; }
.permission-summary { padding: 12px 13px; border: 1px solid rgba(149,162,181,.18); border-radius: 12px; background: rgba(149,162,181,.055); }
.permission-summary b,.permission-summary span { display: block; }
.permission-summary b { color: var(--text); font-size: .72rem; }
.permission-summary span { margin-top: 4px; color: var(--muted); font-size: .63rem; line-height: 1.45; }
.job-recovery { border-color: rgba(var(--accent-rgb),.34); background: rgba(var(--accent-rgb),.055); }
.recovery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.recovery-grid label { display: grid; gap: 5px; color: var(--muted); font-size: .62rem; font-weight: 800; }
.recovery-grid .span2 { grid-column: 1 / -1; }
.recovery-grid select,.recovery-grid input { width: 100%; }
.recovery-actions { margin-top: 11px; flex-wrap: wrap; }
.prestart-modal { width: min(780px,calc(100% - 24px)); }
.prestart-record { margin-bottom: 10px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.018); overflow: hidden; }
.prestart-record>summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px; cursor: pointer; list-style: none; }
.prestart-record>summary::-webkit-details-marker { display: none; }
.prestart-record>summary span:first-child { display: grid; gap: 3px; }
.prestart-record>summary small { color: var(--muted); }
.prestart-result { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; font-size: .62rem; font-weight: 900; }
.prestart-result.passed { background: rgba(85,214,154,.12); color: var(--green); }
.prestart-result.has-issues { background: rgba(255,114,122,.12); color: var(--red); }
.prestart-meta { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 0 14px 12px; }
.prestart-meta span { padding: 9px; border-radius: 9px; background: rgba(149,162,181,.06); color: var(--muted); font-size: .65rem; }
.prestart-meta b { display: block; margin-top: 3px; color: var(--text); }
.prestart-items { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; border-top: 1px solid var(--line); background: var(--line); }
.prestart-item { display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; background: var(--card); font-size: .65rem; }
.prestart-item span { color: var(--muted); }
.prestart-item.issue { background: rgba(255,114,122,.07); }
.prestart-item.issue b { color: var(--red); }
.prestart-notes { padding: 12px 14px; border-top: 1px solid var(--line); }
.prestart-notes small { color: var(--muted); font-weight: 800; }
.prestart-notes p { margin: 5px 0 0; white-space: pre-wrap; }
.defect-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
.defect-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.defect .defStage { width: 100%; margin-top: 12px; }
.defect-actions { margin-top: 10px; justify-content: flex-end; }

/* Compact Fleet workspace ------------------------------------------------- */
.fleet-toolbar {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 9px;
}
.fleet-toolbar p { margin: 0; color: var(--muted); font-size: .7rem; }
.fleet-statbar {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  margin-bottom: 9px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--line);
  gap: 1px;
  overflow: hidden;
}
.fleet-statbar>div {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 7px 11px;
  background: var(--panel);
}
.fleet-statbar span { color: var(--muted); font-size: .63rem; font-weight: 800; }
.fleet-statbar strong { font-size: 1.05rem; }
.fleet-statbar .success strong { color: var(--green); }
.fleet-statbar .danger strong { color: var(--red); }
.fleet-list { display: grid; gap: 8px; }
.fleet-row {
  border: 1px solid rgba(149,162,181,.17);
  border-radius: 13px;
  background: var(--panel);
  overflow: hidden;
}
.fleet-row.is-open { border-color: rgba(var(--accent-rgb),.32); }
.fleet-row-main {
  display: grid;
  grid-template-columns: minmax(230px,1.35fr) minmax(310px,1.45fr) minmax(190px,.82fr) auto;
  align-items: center;
  gap: 13px;
  padding: 11px 13px;
}
.fleet-identity { min-width: 0; }
.fleet-titleline { display: flex; align-items: center; gap: 8px; }
.fleet-titleline h3 { margin: 0; font-size: 1rem; white-space: nowrap; }
.fleet-status {
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(149,162,181,.1);
  color: var(--muted);
  font-size: .55rem;
  font-weight: 900;
}
.fleet-status.Available { background: rgba(85,214,154,.12); color: var(--green); }
.fleet-status.Workshop,.fleet-status.Offline { background: rgba(255,114,122,.12); color: var(--red); }
.fleet-status.On-job { background: rgba(86,170,255,.12); color: #7dbbff; }
.fleet-defects {
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(255,174,80,.11);
  color: var(--orange);
  font-size: .57rem;
}
.fleet-identity p {
  margin: 5px 0 2px;
  color: var(--muted);
  font-size: .63rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fleet-identity small { color: var(--muted); font-size: .61rem; }
.fleet-identity small b { color: var(--text); }
.fleet-signals { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.fleet-signal {
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid rgba(149,162,181,.12);
  border-radius: 8px;
  background: rgba(7,13,21,.5);
}
.fleet-signal span,.fleet-signal strong { display: block; }
.fleet-signal span {
  margin-bottom: 3px;
  color: var(--muted);
  font-size: .52rem;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.fleet-signal strong {
  font-size: .68rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fleet-signal.good strong,.fleet-calc.good strong { color: var(--green); }
.fleet-signal.warn strong,.fleet-calc.warn strong { color: var(--orange); }
.fleet-signal.bad strong,.fleet-calc.bad strong { color: var(--red); }
.fleet-signal.missing strong,.fleet-calc.missing strong { color: #ff9ca2; }
.fleet-dates { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.fleet-date {
  min-width: 0;
  padding: 6px 7px;
  border-radius: 8px;
  background: rgba(7,13,21,.42);
}
.fleet-date span,.fleet-date strong { display: block; }
.fleet-date span { margin-bottom: 3px; color: var(--muted); font-size: .52rem; font-weight: 850; text-transform: uppercase; }
.fleet-date strong { font-size: .62rem; white-space: nowrap; }
.fleet-date small { display: block; margin-top: 3px; overflow: hidden; color: var(--muted); font-size: .5rem; text-overflow: ellipsis; white-space: nowrap; }
.fleet-date.warn strong { color: var(--orange); }
.fleet-date.bad strong,.fleet-date.missing strong { color: var(--red); }
.fleet-date.invalid strong,.fleet-date.invalid small { color: var(--orange); }
.fleet-row-actions { display: flex; min-width: 185px; gap: 5px; }
.fleet-row-actions .btn { flex: 1; min-height: 30px; padding: 5px 8px; white-space: nowrap; }
.fleet-row-actions .viewPrestarts { display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.fleet-row-actions .viewPrestarts span {
  min-width: 18px;
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb),.13);
  color: var(--yellow);
  font-size: .58rem;
}
.fleet-row-details {
  padding: 10px 13px 11px;
  border-top: 1px solid rgba(149,162,181,.13);
  background: rgba(5,10,17,.23);
}
.fleet-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.fleet-calc {
  padding: 9px 10px;
  border: 1px solid rgba(149,162,181,.12);
  border-radius: 9px;
  background: rgba(7,13,21,.45);
}
.fleet-calc span,.fleet-calc strong,.fleet-calc small { display: block; }
.fleet-calc span { color: var(--muted); font-size: .54rem; font-weight: 850; text-transform: uppercase; }
.fleet-calc strong { margin: 4px 0; font-size: .73rem; }
.fleet-calc small { color: var(--muted); font-size: .56rem; line-height: 1.4; }
.fleet-detail-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  color: var(--muted);
  font-size: .58rem;
}
.fleet-detail-foot b { color: var(--text); }
.fleet-detail-foot .btn { margin-left: auto; }

@media (max-width: 1249px) and (min-width: 721px) {
  .fleet-row-main { grid-template-columns: minmax(220px,1fr) minmax(285px,1.25fr) auto; }
  .fleet-dates { grid-column: 1 / 3; max-width: 310px; }
  .fleet-row-actions { grid-column: 3; grid-row: 1 / 3; }
}

@media (max-width: 720px) {
  .fleet-toolbar { align-items: flex-start; }
  .fleet-toolbar p { max-width: 55%; }
  .fleet-statbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fleet-statbar>div { justify-content: space-between; min-height: 38px; }
  .fleet-row-main { grid-template-columns: 1fr; gap: 8px; padding: 11px; }
  .fleet-signals { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .fleet-dates { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fleet-row-actions { display: flex; min-width: 0; }
  .fleet-row-actions .btn { flex: 1; }
  .fleet-detail-grid { grid-template-columns: 1fr; }
  .fleet-detail-foot { align-items: flex-start; flex-direction: column; }
  .fleet-detail-foot .btn { width: 100%; margin-left: 0; }
}

/* Build 18 compact remaining workspaces --------------------------------- */
.workspace-toolbar {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}
.workspace-toolbar>p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.workspace-toolbar>.btnrow { justify-content: flex-end; }
.workspace-toolbar select { min-width: 142px; }
.workspace-statbar {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(92px,1fr));
  margin-bottom: 10px;
  border: 1px solid var(--line);
  border-radius: 11px;
  gap: 1px;
  overflow: hidden;
  background: var(--line);
}
.workspace-statbar>div {
  display: flex;
  min-height: 43px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 7px 11px;
  background: var(--panel);
}
.workspace-statbar span { color: var(--muted); font-size: .63rem; font-weight: 800; }
.workspace-statbar strong { font-size: 1.05rem; }
.workspace-statbar .success strong { color: var(--green); }
.workspace-statbar .warning strong { color: var(--orange); }
.workspace-statbar .danger strong { color: var(--red); }

.comfortable-summary { display: grid; align-content: start; gap: 9px; }
.comfortable-summary>.due { justify-self: start; }
.comfortable-issues { font-size: .66rem; }
.comfortable-route { margin: 0; }
.comfortable-foot { align-items: center; }
.jobs:not(.compact-view) { grid-template-columns: 1fr; }

.location-list,.defect-list,.reports-grid { display: grid; gap: 8px; }
.location-row { display: grid; gap: 9px; align-items: center; }
.location-row h3 { margin: 0 0 4px; }
.location-row p { margin: 0; }
.location-field small,.defect-operate small,.defect-status small {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: .55rem;
  font-weight: 850;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.location-actions { align-items: center; }

.defect-row { display: grid; gap: 10px; align-items: center; }
.defect-priority { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.defect-copy { min-width: 0; }
.defect-copy h3 { margin: 0 0 5px; }
.defect-copy p { margin: 0 0 5px; overflow: hidden; text-overflow: ellipsis; }
.defect-copy small { color: var(--muted); font-size: .6rem; }
.defect-operate {
  padding: 8px 10px;
  border: 1px solid rgba(149,162,181,.13);
  border-radius: 9px;
  background: rgba(7,13,21,.42);
}
.defect-operate strong { font-size: .7rem; }
.defect-operate.cannot-operate { border-color: rgba(255,114,122,.28); background: rgba(255,114,122,.07); }
.defect-operate.cannot-operate strong { color: var(--red); }
.defect-row .defStage { margin: 0; min-height: 36px; }
.defect-row .defect-actions { margin: 0; }

.report-panel { margin: 0; }
.report-panel .panel-head { padding: 11px 12px; }
.report-panel .panel-head h3 { font-size: .82rem; }
.report-bars { padding: 8px 12px 10px; }
.report-panel .bar { grid-template-columns: minmax(68px,86px) 1fr 22px; margin: 7px 0; }
.report-panel .bar label { font-size: .6rem; }
.report-panel .track { height: 7px; }
.report-panel .bar b { font-size: .68rem; text-align: right; }
.report-empty { margin: 8px 0; color: var(--muted); font-size: .65rem; }

/* Feedback workspace ----------------------------------------------------- */
.feedback-statbar { grid-template-columns: repeat(3,minmax(0,1fr)); }
.feedback-layout { display: grid; gap: 12px; }
.feedback-compose { padding: 16px; }
.feedback-compose label {
  display: grid;
  gap: 6px;
  color: #d9e1ec;
  font-size: .68rem;
  font-weight: 800;
}
.feedback-section-head,.feedback-list-head,.feedback-card-head,.feedback-context {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.feedback-section-head { margin-bottom: 14px; }
.feedback-section-head small,.feedback-list-head small {
  display: block;
  margin-bottom: 4px;
  color: var(--yellow);
  font-size: .57rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.feedback-section-head h2,.feedback-list-head h2 { margin: 0; font-size: 1rem; }
.feedback-origin {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb),.09);
  color: var(--yellow);
  font-size: .58rem;
  font-weight: 850;
  text-transform: capitalize;
}
.feedback-list { display: grid; align-content: start; gap: 8px; }
.feedback-list-head { align-items: flex-end; padding: 3px 2px 2px; }
.feedback-list-head p { max-width: 330px; margin: 0; color: var(--muted); font-size: .62rem; line-height: 1.45; text-align: right; }
.feedback-card { padding: 13px 14px; }
.feedback-card-head { align-items: center; }
.feedback-card-head h3 { margin: 6px 0 0; font-size: .86rem; }
.feedback-card>p { margin: 10px 0; color: #d7dfe9; font-size: .69rem; line-height: 1.55; white-space: pre-wrap; }
.feedback-context {
  padding-top: 9px;
  border-top: 1px solid rgba(149,162,181,.12);
  color: var(--muted);
  font-size: .58rem;
}
.feedback-context span:last-child { text-align: right; }
.feedback-status-control { display: grid; min-width: 116px; gap: 4px; color: var(--muted); font-size: .54rem; font-weight: 850; text-transform: uppercase; }
.feedback-status-control select { min-height: 34px; padding: 5px 28px 5px 9px; font-size: .65rem; text-transform: none; }
.feedback-status {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(149,162,181,.1);
  color: var(--muted);
  font-size: .58rem;
  font-weight: 900;
}
.feedback-status.New { background: rgba(255,174,80,.12); color: var(--orange); }
.feedback-status.Reviewed,.feedback-status.Planned { background: rgba(86,170,255,.12); color: #7dbbff; }
.feedback-status.Done,.feedback-status.Closed { background: rgba(85,214,154,.12); color: var(--green); }
.feedback-status.Cancelled { background: rgba(149,162,181,.13); color: #c3ccd8; }
.feedback-card-controls { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.feedback-company-label { display: block; margin-bottom: 6px; color: var(--yellow); font-size: .57rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.feedback-empty { display: grid; gap: 4px; padding: 20px; color: var(--muted); text-align: center; }
.feedback-empty strong { color: var(--text); }
.feedback-empty span { font-size: .65rem; }
.feedback-ticket-modal { width: min(680px,calc(100% - 24px)); }
.feedback-workflow { margin: 0; padding: 0; border: 0; }
.feedback-workflow legend { margin-bottom: 7px; color: #d9e1ec; font-size: .68rem; font-weight: 800; }
.feedback-workflow-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.feedback-workflow-choice { cursor: pointer; }
.feedback-workflow-choice input { position: absolute; opacity: 0; pointer-events: none; }
.feedback-workflow-choice span { display: grid; min-height: 38px; place-items: center; padding: 7px; border: 1px solid var(--line); border-radius: 9px; background: #0b141f; color: var(--muted); font-size: .64rem; font-weight: 850; }
.feedback-workflow-choice input:checked+span { border-color: rgba(var(--accent-rgb),.48); background: rgba(var(--accent-rgb),.12); color: var(--yellow); box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb),.12); }
.feedback-workflow-choice input:focus-visible+span { outline: 2px solid var(--blue); outline-offset: 2px; }
.feedback-activity { display: grid; gap: 8px; margin-top: 14px; padding-top: 13px; border-top: 1px solid rgba(149,162,181,.14); }
.feedback-activity-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.feedback-activity-head strong { font-size: .72rem; }
.feedback-activity-head small { color: var(--muted); font-size: .56rem; }
.feedback-activity-list { display: grid; gap: 6px; max-height: 230px; overflow: auto; padding-right: 3px; }
.feedback-activity-row { display: grid; grid-template-columns: 9px minmax(0,1fr) auto; align-items: start; gap: 8px; padding: 9px 10px; border: 1px solid rgba(149,162,181,.12); border-radius: 9px; background: rgba(7,13,21,.36); }
.feedback-activity-dot { width: 7px; height: 7px; margin-top: 4px; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.09); }
.feedback-activity-row strong,.feedback-activity-row span,.feedback-activity-row small { display: block; }
.feedback-activity-row strong { font-size: .66rem; }
.feedback-activity-row span { margin-top: 3px; color: #d7dfe9; font-size: .6rem; }
.feedback-activity-row small { margin-top: 4px; color: var(--muted); font-size: .54rem; }
.feedback-activity-row time { color: var(--muted); font-size: .54rem; white-space: nowrap; }
.feedback-notification-row { border-color: rgba(var(--accent-rgb),.25); background: rgba(var(--accent-rgb),.045); }
.feedback-notification-row .btn { margin-top: 9px; }
.feedback-ticket-destructive { display: flex; gap: 8px; }

/* Notification centre --------------------------------------------------- */
.notification-modal { width: min(680px,calc(100% - 24px)); }
.notification-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid rgba(149,162,181,.14); }
.notification-toolbar .sub { margin: 0; }
.notification-body { max-height: min(65vh,560px); max-height: min(65dvh,560px); overflow: auto; }
.notification-row { position: relative; }
.notification-row.is-unread { border-color: rgba(var(--accent-rgb),.34); background: rgba(var(--accent-rgb),.06); }
.notification-row.is-unread::before { position: absolute; top: 14px; left: -5px; width: 9px; height: 9px; border: 2px solid var(--panel); border-radius: 50%; background: var(--yellow); content: ""; }
.notification-row-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.notification-row-actions .btn { margin-top: 0; }
.notification-row .notification-state.is-read { color: var(--muted); }
.notification-row .notification-state.is-unread { color: var(--yellow); }
.notification-company { color: var(--yellow)!important; font-size: .57rem!important; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }

/* Global Site Owner workspace ------------------------------------------ */
.owner-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.owner-toolbar small { color: var(--yellow); font-size: .59rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.owner-toolbar h2 { margin: 4px 0 2px; font-size: 1.15rem; }
.owner-toolbar p { margin: 0; color: var(--muted); font-size: .67rem; }
.owner-statbar { grid-template-columns: repeat(4,minmax(0,1fr)); }
.owner-grid { display: grid; gap: 10px; margin-top: 10px; }
.owner-create { padding: 14px; }
.owner-directory { display: grid; align-content: start; gap: 7px; }
.owner-company-list { display: grid; gap: 6px; }
.owner-company-row { display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; align-items: center; gap: 10px; min-height: 60px; padding: 9px 10px; border: 1px solid rgba(149,162,181,.16); border-radius: 11px; background: var(--panel); }
.owner-company-row.disabled { opacity: .72; }
.owner-company-mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 10px; background: var(--company-accent); color: #0b1119; font-size: .72rem; font-weight: 950; }
.owner-company-copy { min-width: 0; }
.owner-company-copy strong,.owner-company-copy span { display: block; }
.owner-company-copy strong { overflow: hidden; font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.owner-company-copy span { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.owner-company-state { padding: 4px 7px; border-radius: 999px; font-size: .56rem; font-weight: 900; }
.owner-company-state.enabled { background: rgba(85,214,154,.11); color: var(--green); }
.owner-company-state.disabled { background: rgba(255,114,122,.11); color: var(--red); }
.owner-company-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.owner-feedback { display: grid; gap: 8px; margin-top: 14px; }
.owner-feedback-list { display: grid; gap: 7px; }

@media (min-width: 1120px) {
  .owner-grid { grid-template-columns: minmax(280px,340px) minmax(0,1fr); align-items: start; }
  .owner-create { position: sticky; top: 116px; }
  .owner-feedback-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (min-width: 1180px) {
  .feedback-layout { grid-template-columns: minmax(320px,380px) minmax(0,1fr); align-items: start; }
  .feedback-compose { position: sticky; top: 116px; }
}

@media (min-width: 900px) {
  .reports-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .reports-grid .report-panel:last-child { grid-column: 1 / -1; }
}

@media (min-width: 1200px) {
  .comfortable-job {
    grid-template-columns: minmax(190px,.78fr) minmax(260px,1.15fr) minmax(220px,.92fr) minmax(170px,.72fr);
    grid-template-areas:
      "summary route checks audit"
      "summary route checks foot";
    align-items: stretch;
    gap: 11px 13px;
    padding: 12px 13px;
  }
  .comfortable-summary { grid-area: summary; }
  .comfortable-route { grid-area: route; align-content: center; }
  .comfortable-checks { grid-area: checks; align-content: center; }
  .comfortable-audit { grid-area: audit; align-content: center; }
  .comfortable-foot { grid-area: foot; align-self: end; }
  .comfortable-job .job-head { display: grid; gap: 7px; }
  .comfortable-job .job-head>.status { justify-self: start; }
  .comfortable-job .twocol { grid-template-columns: 1fr; }
  .comfortable-job .mini { padding: 7px 8px; }
  .comfortable-foot .check { min-height: 34px; }

  .location-row {
    grid-template-columns: auto minmax(210px,1.05fr) minmax(150px,.72fr) minmax(210px,1fr) auto;
    padding: 10px 12px;
  }
  .location-type { justify-self: start; }
  .location-field p { overflow: hidden; text-overflow: ellipsis; }
  .location-instructions p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .location-actions { justify-content: flex-end; flex-wrap: nowrap; }

  .defect-row {
    grid-template-columns: minmax(140px,.62fr) minmax(260px,1.4fr) minmax(105px,.48fr) minmax(170px,.7fr) auto;
    padding: 10px 12px;
  }
  .defect-actions { justify-content: flex-end; flex-wrap: nowrap; }
}

@media (min-width: 1320px) {
  .reports-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .reports-grid .report-panel:last-child { grid-column: auto; }
}

@media (max-width: 599px) {
  .workspace-toolbar { align-items: stretch; flex-direction: column; }
  .workspace-toolbar>.btnrow { justify-content: stretch; }
  .workspace-toolbar>.btnrow>* { flex: 1; }
  .workspace-statbar>div { justify-content: space-between; }
  .feedback-list-head,.feedback-card-head,.feedback-context { align-items: stretch; flex-direction: column; }
  .feedback-list-head p,.feedback-context span:last-child { max-width: none; text-align: left; }
  .feedback-card-controls { justify-content: flex-start; }
  .feedback-workflow-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .owner-statbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .owner-company-row { grid-template-columns: auto minmax(0,1fr) auto; }
  .owner-company-state { grid-column: 2; justify-self: start; }
  .owner-company-actions { grid-column: 3; grid-row: 1 / 3; align-items: stretch; flex-direction: column; }
  .feedback-ticket-modal .actions { align-items: stretch; flex-direction: column; }
  .feedback-ticket-modal .actions>div { width: 100%; }
  .feedback-ticket-modal .actions>div:last-child { justify-content: flex-end; }
  .feedback-ticket-destructive .btn { flex: 1; }
  .notification-toolbar { align-items: flex-start; }
}
.desktop-nav-only,.sidebar-live,.header-user-copy,.page-heading>small { display: none; }
.page-heading { flex: 1; }

.login-screen {
  padding: 84px 24px 28px;
  background:
    radial-gradient(circle at 12% 4%, rgba(var(--accent-rgb),.15), transparent 30%),
    radial-gradient(circle at 92% 92%, rgba(86,170,255,.09), transparent 31%),
    #090e15;
}
.login-card {
  width: min(510px,100%);
  padding: 40px;
  border-radius: 27px;
  background: rgba(17,27,40,.95);
  box-shadow: 0 28px 90px rgba(0,0,0,.48);
  backdrop-filter: blur(16px);
}
.login-card h2 { margin: 12px 0 10px; font-size: clamp(2rem,6vw,3.1rem); letter-spacing: -.045em; }
.login-card>p { margin-bottom: 18px; font-size: .83rem; line-height: 1.55; }
.login-card .form-grid { grid-template-columns: 1fr; gap: 15px; }
.login-card .span2 { grid-column: auto; }
.login-company-control { margin-bottom: 18px; }
.login-company-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 63px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(13,22,34,.72);
}
.login-company-summary>span { display: grid; gap: 3px; min-width: 0; }
.login-company-summary small {
  color: var(--yellow);
  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.login-company-summary strong { overflow: hidden; color: var(--text); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.login-company-summary .btn { min-height: 36px; padding: 0 12px; }
.login-company-picker {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(13,22,34,.72);
}
.login-company-picker-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 7px; }
.login-company-picker-head label {
  margin: 0;
  color: var(--yellow);
  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.login-company-picker-head button {
  padding: 2px 0;
  border: 0;
  background: transparent;
  color: var(--yellow);
  font-size: .62rem;
  font-weight: 850;
}
.login-company-picker-head button:hover { text-decoration: underline; }
.login-company-picker select {
  width: 100%;
  padding: 8px 34px 8px 10px;
  border: 1px solid #334257;
  border-radius: 9px;
  background: #0d1622;
  color: var(--text);
  font-weight: 800;
}
.login-company-picker small { display: block; margin-top: 5px; color: var(--muted); font-size: .56rem; }

@media (min-width: 900px) {
  :root { --desktop-sidebar: 260px; }
  body { padding-bottom: 0; }
  header {
    min-height: 96px;
    margin-left: var(--desktop-sidebar);
    padding: 18px 30px;
    border-bottom-color: rgba(149,162,181,.11);
    background: rgba(9,14,21,.9);
    /* A filtered ancestor becomes the containing block for fixed descendants in
       Chromium. Disable the mobile blur here so the fixed company switcher is
       anchored to the viewport/sidebar instead of the content topbar. */
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .page-heading { flex: 1; display: grid; gap: 3px; }
  .page-heading>small {
    display: block;
    color: var(--yellow);
    font-size: .65rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
  }
  header h1 { font-size: 1.75rem; letter-spacing: -.035em; }
  .company-switch {
    position: fixed;
    z-index: 45;
    top: 22px;
    left: 20px;
    width: 220px;
    padding: 10px 8px;
  }
  .company-switch .brand { width: 52px; height: 52px; border-radius: 15px; font-size: 1.05rem; }
  .company-copy { max-width: 138px; }
  .company-copy b { font-size: .9rem; }
  .company-copy small { font-size: .66rem; }
  .header-user-copy { display: grid; min-width: 105px; gap: 2px; }
  .header-user-copy strong { font-size: .75rem; }
  .header-user-copy small { color: var(--muted); font-size: .61rem; }
  #accountBtn { margin-left: 8px; }

  nav {
    position: fixed;
    z-index: 32;
    inset: 0 auto 0 0;
    width: var(--desktop-sidebar);
    max-width: none;
    margin: 0;
    padding: 116px 18px 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 7px;
    border: 0;
    border-right: 1px solid rgba(149,162,181,.1);
    border-radius: 0;
    background: rgba(12,19,29,.98);
  }
  nav button,
  nav button.desktop-nav-only {
    display: flex;
    width: 100%;
    min-height: 50px;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 0 14px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--muted);
    font-size: .83rem;
    font-weight: 850;
    text-align: left;
  }
  nav button:hover { background: rgba(255,255,255,.04); color: var(--text); }
  nav button.active {
    background: rgba(var(--accent-rgb),.12);
    color: var(--yellow);
    box-shadow: inset 3px 0 0 var(--yellow);
  }
  nav button b { display: grid; width: 24px; place-items: center; font-size: 1rem; }
  nav button b svg { width: 18px; height: 18px; }
  nav #moreBtn { display: none; }
  nav .new {
    position: fixed;
    z-index: 46;
    top: 26px;
    right: 245px;
    width: auto;
    min-width: 116px;
    min-height: 45px;
    justify-content: center;
    padding: 0 17px;
    border: 1px solid var(--yellow);
    background: var(--yellow);
    color: #151200;
    font-size: .83rem;
    box-shadow: 0 12px 30px rgba(var(--accent-rgb),.15);
  }
  nav .new::after { content: "New job"; margin-left: 5px; }
  nav .new:hover { background: #ffda4e; color: #151200; }
  .sidebar-live {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding: 11px 13px;
    border: 1px solid rgba(149,162,181,.12);
    border-radius: 11px;
    color: var(--muted);
    font-size: .68rem;
  }
  nav .nav-logout { margin-top: 4px; color: var(--red); }

  .banner { margin-left: var(--desktop-sidebar); text-align: left; padding: 8px 32px; }
  main { max-width: none; margin: 0 0 0 var(--desktop-sidebar); padding: 24px 32px 48px; }
  #dashboard.active {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
  }
  #dashboard .hero,
  #dashboard .metrics { grid-column: 1 / -1; }
  #dashboard .panel { margin: 0; }
  #dashboard .panel:nth-of-type(3),
  #dashboard .panel:nth-of-type(5) { grid-column: span 2; }
  .hero {
    display: flex;
    min-height: 190px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 34px 40px;
    border: 0;
    background: linear-gradient(110deg,var(--yellow),#ffd84e 66%,#ffe58b);
    color: #171300;
    box-shadow: 0 24px 55px rgba(var(--accent-rgb),.12);
    overflow: hidden;
    position: relative;
  }
  .hero::after {
    position: absolute;
    width: 250px;
    height: 250px;
    right: -85px;
    top: -110px;
    border: 42px solid rgba(255,255,255,.17);
    border-radius: 50%;
    content: "";
  }
  .hero>* { position: relative; z-index: 1; }
  .hero small { color: rgba(23,19,0,.62); letter-spacing: .12em; }
  .hero h2 { margin: 12px 0 8px; font-size: clamp(2rem,3.7vw,3rem); letter-spacing: -.05em; }
  .hero p { color: rgba(23,19,0,.66); font-size: .95rem; }
  .hero-action { border-color: #111722; background: #111722; color: white; white-space: nowrap; }
  .metrics { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 15px; margin: 0; }
  .metric { min-height: 142px; padding: 21px; }
  .metric span { font-size: .74rem; font-weight: 800; }
  .metric strong { margin-top: 27px; font-size: 2.05rem; }
  .jobs,.grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .drawer { left: auto; width: min(650px,100%); border-left: 1px solid var(--line); }
}

@media (max-width: 899px) {
  .login-screen { padding: 28px 16px; }
  .login-card { padding: 27px 23px; }
  .permission-grid { grid-template-columns: 1fr; }
  .recovery-grid,.prestart-meta,.prestart-items { grid-template-columns: 1fr; }
  .feedback-activity-row { grid-template-columns: 9px minmax(0,1fr); }
  .feedback-activity-row time { grid-column: 2; }
}

/* Build 25 appearance themes -------------------------------------------- */
:root {
  --accent-text: var(--yellow);
  --theme-field: #0c141f;
  --theme-raised: #0b131d;
  --theme-layer: #0d1622;
  --theme-shadow: rgba(0,0,0,.45);
}

.theme-button {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  padding: 0;
}
.theme-button:hover { border-color: rgba(var(--accent-rgb),.45); background: rgba(var(--accent-rgb),.08); }
.theme-button:focus-visible { outline: 3px solid rgba(var(--accent-rgb),.36); outline-offset: 2px; }
.theme-icon { display: grid; place-items: center; }
.theme-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.theme-icon-moon { display: none; }
html[data-theme="light"] .theme-icon-sun { display: none; }
html[data-theme="light"] .theme-icon-moon { display: grid; }
.login-card { position: relative; }
.login-theme-button { position: absolute; top: 22px; right: 22px; z-index: 2; }
.sheet { max-height: calc(100dvh - 16px); overflow-y: auto; }
.mobile-theme-action { display: flex; align-items: center; gap: 9px; }
.mobile-theme-action [data-theme-glyph] { display: inline-grid; width: 20px; place-items: center; font-size: 1rem; }
.toast-message {
  position: fixed;
  z-index: 400;
  top: 15px;
  right: 15px;
  left: 15px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel2);
  color: var(--text);
  box-shadow: 0 14px 40px var(--theme-shadow);
  text-align: center;
  font-weight: 800;
}

html[data-theme="light"] {
  --bg: #f2f5f9;
  --panel: #ffffff;
  --panel2: #eaf0f6;
  --text: #172033;
  --muted: #64748b;
  --line: #d5dee9;
  --green: #087a4b;
  --blue: #1769aa;
  --orange: #9a4e00;
  --red: #b42335;
  --accent-text: color-mix(in srgb,var(--yellow) 58%,#0b1525 42%);
  --theme-field: #ffffff;
  --theme-raised: #f6f8fb;
  --theme-layer: #eef3f8;
  --theme-shadow: rgba(15,23,42,.16);
  color-scheme: light;
}

html[data-theme="light"] body {
  background: radial-gradient(circle at 80% 0,rgba(var(--accent-rgb),.11),transparent 30%),var(--bg);
}
html[data-theme="light"] header {
  border-bottom-color: var(--line);
  background: rgba(255,255,255,.94);
  box-shadow: 0 3px 16px rgba(15,23,42,.05);
}
html[data-theme="light"] .login-screen {
  background:
    radial-gradient(circle at 12% 4%,rgba(var(--accent-rgb),.18),transparent 30%),
    radial-gradient(circle at 92% 92%,rgba(23,105,170,.09),transparent 31%),
    #f2f5f9;
}
html[data-theme="light"] .login-card {
  background: rgba(255,255,255,.96);
  box-shadow: 0 28px 80px rgba(15,23,42,.16);
}
html[data-theme="light"] .login-company-summary,
html[data-theme="light"] .login-company-picker {
  background: rgba(246,248,251,.94);
}
html[data-theme="light"] .login-company-picker select { border-color: var(--line); background: #fff; }

html[data-theme="light"] :is(input,select,textarea,.search,.check,.company-card,.account-summary,.login-demo) {
  background: var(--theme-field);
}
html[data-theme="light"] :is(.tenant-stats div,.compact-route,.route,.compliance div,.ruc-box,.sheet button) {
  background: var(--theme-layer);
}
html[data-theme="light"] :is(.mini,.prestart-meta span,.fleet-signal,.fleet-date,.fleet-calc,.defect-operate,.feedback-workflow-choice span,.feedback-activity-row) {
  background: var(--theme-raised);
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #8793a5; opacity: 1; }
html[data-theme="light"] input:-webkit-autofill,
html[data-theme="light"] input:-webkit-autofill:hover,
html[data-theme="light"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text);
  box-shadow: 0 0 0 1000px #fff inset;
}

html[data-theme="light"] .hero {
  background: linear-gradient(120deg,#ffffff,#eaf0f6);
  box-shadow: 0 18px 42px rgba(15,23,42,.08);
}
html[data-theme="light"] .track { background: #dfe6ee; }
html[data-theme="light"] nav { background: rgba(255,255,255,.97); }
html[data-theme="light"] nav button:hover { background: rgba(15,23,42,.05); }
html[data-theme="light"] .overlay { background: rgba(15,23,42,.38); }
html[data-theme="light"] .modal,
html[data-theme="light"] .modal-head { background: #fff; }
html[data-theme="light"] .suggestions {
  border-color: var(--line);
  background: #fff;
  box-shadow: 0 18px 48px rgba(15,23,42,.16);
}
html[data-theme="light"] .suggestion span { color: #475569; }
html[data-theme="light"] .drawer { background: #fff; }
html[data-theme="light"] .drawer-actions { background: #f6f8fb; }
html[data-theme="light"] .more { background: rgba(15,23,42,.38); }
html[data-theme="light"] .evidence-card { background: #fff; }
html[data-theme="light"] .evidence-thumb { background: #e7edf4; }
html[data-theme="light"] .evidence-viewer .actions { background: #fff; }
html[data-theme="light"] .fleet-row-details { background: #f7f9fc; }
html[data-theme="light"] .prestart-record,
html[data-theme="light"] .prestart-item { background: #fff; }

html[data-theme="light"] :is(.permission-note,.tenant-notice,.feedback-card>p,.feedback-activity-row span,.form label,.feedback-compose label,.feedback-workflow legend) {
  color: #334155;
}
html[data-theme="light"] .driver-only-note { color: #245b43; }
html[data-theme="light"] :is(.login-demo b,.service-box .ruc-source,.ruc-box .ruc-source) { color: #475569; }
html[data-theme="light"] .login-error { color: var(--red); }
html[data-theme="light"] .btn.danger { color: var(--red); }
html[data-theme="light"] :is(.role-chip,.access-chip.web) { color: var(--blue); }
html[data-theme="light"] .role-chip.company-admin { color: #7040a0; }
html[data-theme="light"] .role-chip.read-only { color: #59677a; }
html[data-theme="light"] .dot.activity-sent { color: #7040a0; }
html[data-theme="light"] .dot.activity-edit { color: #59677a; }
html[data-theme="light"] .pill,
html[data-theme="light"] .status.Cancelled,
html[data-theme="light"] .feedback-status.Cancelled { color: #59677a; }
html[data-theme="light"] :is(.status.New,.status.On-Scan,.feedback-status.Reviewed,.feedback-status.Planned) { color: var(--blue); }
html[data-theme="light"] :is(.status.Delivered,.due.ok) { color: var(--green); }
html[data-theme="light"] :is(.due.overdue,.fleet-signal.missing strong,.fleet-calc.missing strong) { color: var(--red); }
html[data-theme="light"] .due.soon { color: var(--orange); }
html[data-theme="light"] :is(.status.Accepted,.status.Picked-Up) { color: #7040a0; }

html[data-theme="light"] :is(
  .login-card>small,
  .login-company-summary small,
  .login-company-picker-head label,
  .login-company-picker-head button,
  .banner b,
  .page-heading>small,
  .job h3,
  .tab.active,
  nav button.active,
  .drawer-tabs button.active,
  .location-match,
  .ruc-form-note strong,
  .evidence-state.uploading,
  .evidence-state.pending,
  .feedback-section-head small,
  .feedback-list-head small,
  .feedback-origin,
  .feedback-company-label,
  .feedback-workflow-choice input:checked+span,
  .owner-toolbar small,
  .fleet-row-actions .viewPrestarts span,
  .user,
  .account-summary>span,
  .dot.activity-created,
  .dot.priority-icon
) { color: var(--accent-text); }

@media (min-width: 900px) {
  nav .new { right: 293px; }
  html[data-theme="light"] .hero {
    background: linear-gradient(110deg,var(--yellow),#ffd84e 66%,#ffe58b);
    color: #171300;
    box-shadow: 0 24px 55px rgba(var(--accent-rgb),.14);
  }
  html[data-theme="light"] .hero small { color: rgba(23,19,0,.62); }
  html[data-theme="light"] .hero p { color: rgba(23,19,0,.66); }
}

@media (max-width: 899px) {
  #themeBtn { display: none; }
  .login-theme-button { top: 18px; right: 18px; }
}
