.sot-app { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; padding: 16px 16px 48px; max-width: 560px; margin: 0 auto; }
.sot-logo { display:flex; justify-content:center; margin: 6px 0 14px; }
.sot-logo img { max-width: 240px; height: auto; }
.sot-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sot-card { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:6px; text-decoration:none; font-weight:700; padding:26px 12px; border-radius:16px; background:#f2f6fb; border:1px solid #e6edf7; color:#0b3a67; box-shadow: 0 1px 0 rgba(0,0,0,.04); }
.sot-card:active { transform: scale(.98); }
.sot-emoji { font-size: 28px; }
.sot-form { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:14px; margin-top:16px; }
.sot-form h2 { margin:4px 0 8px; font-size:18px; }
.sot-form label { display:block; font-weight:700; margin:8px 0 6px; }
.sot-form input[type="text"], .sot-form input[type="email"], .sot-form input[type="date"], .sot-form input[type="number"], .sot-form select, .sot-form textarea, .sot-form input[type="file"] { width:100%; padding:12px; border:1px solid #d1d5db; border-radius:10px; font-size:16px; }
.sot-btn { appearance:none; border:none; border-radius:12px; background:#1e88e5; color:#fff; padding:12px 16px; font-weight:800; margin-top:12px; width:100%; text-align:center; display:inline-block; }
.sot-btn.secondary { background:#e5e7eb; color:#111827; width:auto; }
.sot-table { width:100%; border-collapse: collapse; margin-top:8px; }
.sot-table th, .sot-table td { border:1px solid #e5e7eb; padding:10px; text-align:left; font-size:14px; }

/* SOT PWA specific */
#sotpwa-content { margin-top: 16px; }
.sot-card { cursor:pointer; }
.sot-section { background:#fff; border-radius:14px; padding:16px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); margin-top:12px; }
.sot-table{ width:100%; border-collapse: collapse; }
.sot-table th,.sot-table td{ border-bottom:1px solid #eee; padding:8px; text-align:left; }
.sot-empty{ padding:10px; background:#f8fafc; border:1px dashed #e5e7eb; border-radius:10px; color:#6b7280; }
.sot-error{ padding:10px; background:#fee2e2; border:1px solid #fecaca; border-radius:10px; color:#991b1b; }

.sot-row{ display:flex; align-items:center; gap:12px; margin:8px 0; flex-wrap:wrap; }
.sot-label{ width:260px; font-weight:600; color:#374151; }
.sot-input{ flex:1; min-width:160px; padding:8px; border:1px solid #e5e7eb; border-radius:10px; }
.sot-btn{ display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid #111827; background:#111827; color:#fff; }
.sot-file a{ margin-right:10px; display:inline-block; }

/* Header */
.sot-header{ display:flex; align-items:center; justify-content:center; padding:10px 12px; background:#ffffff; border-bottom:1px solid #e5e7eb; }
.sot-header-logo{ max-height:56px; height:auto; width:auto; }



/* SOT-PWA cosmetic badges */
.sot-table td.sot-evt-start { background: #e8f6ec; font-weight: 600; }
.sot-table td.sot-evt-finish { background: #eef3ff; font-weight: 600; }

/* --- SOT-PWA NextUp emphasis --- */
.sot-table td.sot-evt-start,
.sot-table td.sot-evt-finish {
  background: #ececec;
  font-weight: 700;
}

/* SOT-PWA NextUp two-table emphasis */
.sot-table td.sot-evt-start, .sot-table td.sot-evt-finish {
  background: #ececec;
  font-weight: 700;
}

.sot-login-banner,
.sot-login-state {
  border: 1px solid #fecaca;
  background: #fef2f2;
  padding: 12px 16px;
  border-radius: 8px;
  margin: 12px 0;
  text-align: center;
}

.sot-login-banner p,
.sot-login-state p {
  margin: 0 0 8px;
}

.sot-login-btn {
  display: inline-block;
  margin-top: 4px;
  padding: 8px 16px;
  border-radius: 9999px;
  font-weight: 600;
  text-decoration: none;
}

/* Schedule helpers */
.sot-mini{ font-size:12px; color:#6b7280; margin-top:6px; }

.sot-mini.sot-warn{ color:#b91c1c; font-weight:800; }
.sot-pill{ display:inline-block; padding:2px 8px; border-radius:999px; border:1px solid #ddd; margin-right:6px; font-size:12px; font-weight:700; }
.sot-pill.ok{ background:#ecfdf5; border-color:#10b981; color:#065f46; }
.sot-pill.no{ background:#fef2f2; border-color:#ef4444; color:#7f1d1d; }



/* ---- CHECK (vehicle checklist) ---- */
.sot-checklist { margin-top: 10px; display: grid; gap: 8px; }
.sot-check-item { padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 12px; background: #fff; }
.sot-check-item.current { border-color: #111827; box-shadow: 0 1px 0 rgba(17,24,39,0.08); }
.sot-check-label { display:flex; align-items:center; gap:10px; font-weight: 600; }
.sot-check-cb { width: 18px; height: 18px; }
.sot-progress { margin-top: 8px; font-weight: 700; }
.sot-ok { padding:10px 12px; border-radius: 12px; background:#ecfdf5; color:#065f46; border: 1px solid #a7f3d0; margin: 8px 0; }


/* --- Check: issues tooltip + modal --- */
.sot-issues-cell{ position:relative; display:inline-block; cursor:pointer; }
.sot-issues-count{
  display:inline-block;
  min-width:22px;
  padding:2px 8px;
  border-radius:999px;
  background:#f2f3f5;
  border:1px solid #d9dde3;
  font-weight:700;
}
.sot-issues-tooltip{
  display:none;
  position:absolute;
  left:0;
  top: calc(100% + 6px);
  background:#fff;
  border:1px solid #d9dde3;
  border-radius:10px;
  padding:10px 12px;
  z-index:9999;
  min-width:280px;
  max-width:520px;
  box-shadow:0 10px 30px rgba(0,0,0,0.12);
}
.sot-issues-tooltip-row{ font-size:13px; margin:4px 0; }
.sot-issues-cell:hover .sot-issues-tooltip{ display:block; }

.sot-modal-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,0.35);
  z-index:99999; display:flex; align-items:center; justify-content:center;
  padding:16px;
}
.sot-modal{
  background:#fff; border-radius:14px; width:min(720px, 96vw);
  max-height:90vh; overflow:auto; padding:16px 16px 14px;
  box-shadow:0 20px 60px rgba(0,0,0,0.25);
}
.sot-modal-title{ font-size:18px; font-weight:800; margin-bottom:6px; }
.sot-modal-sub{ font-size:13px; opacity:0.75; margin-bottom:12px; }
.sot-modal-body{ padding:8px 0; }
.sot-modal-list{ margin:0; padding-left:18px; }
.sot-modal-actions{ display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }


/* --- PWA PDF document overlay (prevents "stuck" PDF view in standalone mode) --- */
body.sot-doc-noscroll{ overflow:hidden; }

.sot-doc-overlay{
  position:fixed; inset:0;
  background:#fff;
  z-index:100000;
  display:flex;
  flex-direction:column;
}

.sot-doc-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-bottom:1px solid #e5e7eb;
  /* iOS safe area */
  padding-top: calc(10px + env(safe-area-inset-top));
}

.sot-doc-title{ font-weight:800; }

.sot-doc-actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.sot-doc-open{
  font-weight:800;
  text-decoration:none;
  border:1px solid #111827;
  padding:8px 10px;
  border-radius:10px;
  color:#111827;
}

.sot-doc-close{
  font-weight:800;
  border:1px solid #111827;
  background:#111827;
  color:#fff;
  padding:8px 10px;
  border-radius:10px;
}

.sot-doc-frame{
  flex:1;
  width:100%;
  border:0;
}

.sot-doc-btn{
  padding:6px 10px;
  border-radius:10px;
  border:1px solid #111827;
  background:#111827;
  color:#fff;
  font-weight:800;
}




/* --- Delivery photos (Check-in) modal --- */
.sot-photo-overlay{
  position:fixed; inset:0;
  background: rgba(0,0,0,.55);
  z-index:100001;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  padding:12px;
  padding-bottom: calc(12px + env(safe-area-inset-bottom));
}
.sot-photo-modal{
  width:100%;
  max-width:520px;
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  max-height: calc(100vh - 24px - env(safe-area-inset-top));
}
.sot-photo-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px;
  border-bottom:1px solid #e5e7eb;
  padding-top: calc(12px + env(safe-area-inset-top));
}
.sot-photo-title{ font-weight:800; }
.sot-photo-close{
  font-weight:800;
  border:1px solid #111827;
  background:#111827;
  color:#fff;
  padding:8px 10px;
  border-radius:10px;
}
.sot-photo-body{ padding:12px; overflow:auto; }
.sot-photo-sub{ font-size:12px; color:#6b7280; margin:0 0 8px; }
.sot-photo-note{ margin:0 0 10px; font-size:13px; }
.sot-photo-input{ width:100%; margin:0 0 10px; }
.sot-photo-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:8px; }
.sot-photo-thumb{
  position:relative;
  border:1px solid #e5e7eb;
  border-radius:12px;
  overflow:hidden;
  background:#f9fafb;
}
.sot-photo-thumb img{ width:100%; height:100px; object-fit:cover; display:block; }
.sot-photo-missing{ height:100px; display:flex; align-items:center; justify-content:center; font-weight:800; color:#6b7280; }
.sot-photo-remove{
  position:absolute;
  top:6px;
  right:6px;
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid #111827;
  background:#111827;
  color:#fff;
  font-weight:900;
  line-height:1;
}
.sot-photo-count{ margin-top:10px; font-size:12px; color:#6b7280; }
.sot-photo-error{ margin-top:10px; color:#b91c1c; font-size:13px; font-weight:800; }
.sot-photo-actions{ margin-top:12px; display:flex; gap:8px; }
.sot-photo-upload{ flex:1; }

/* --- Next Up cards (mobile) --- */
.sot-nu-list{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.sot-nu-item{ border:1px solid #e5e7eb; border-radius:14px; padding:12px; background:#fff; }
.sot-nu-line1{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; flex-wrap:wrap; }
.sot-nu-customer{ font-weight:800; font-size:15px; }
.sot-nu-badges{ display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.sot-nu-vehicle{ margin-top:4px; font-weight:700; color:#111827; }
.sot-nu-meta{ margin-top:6px; font-size:12px; color:#6b7280; display:flex; flex-wrap:wrap; gap:10px; }
.sot-nu-actions{ margin-top:10px; display:flex; flex-wrap:wrap; gap:8px; }

/* Long term rentals list (PWA) */
.sot-lt-overdue{ border-color:#ef4444; background:#fef2f2; }
.sot-lt-soon{ border-color:#f59e0b; background:#fffbeb; }

.sot-wa-btn{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #111827;
  background:#fff;
  color:#111827;
  font-weight:800;
  text-decoration:none;
  font-size:12px;
  max-width:160px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.sot-nu-btn{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
}

.sot-doc-btn[disabled]{ opacity:0.6; }