/* Book This Ride additions on top of the hub's dispatch-board styles (hub.css). */
.btr-inline { display: inline-flex; align-items: center; gap: 10px; margin: 0; }
.hub-tab { text-decoration: none; display: inline-block; }

/* Phone: bottom tab bar. Tall tap targets with icon + one-line label; scrolls sideways
   when the tabs don't all fit, snapping to each tab. */
@media (max-width: 720px) {
  .hub-tabs {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto;
    display: flex; gap: 0; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding: 0 4px env(safe-area-inset-bottom);
    border-bottom: 0; border-top: 1px solid var(--rule);
    z-index: 30;
  }
  .hub-tabs::-webkit-scrollbar { display: none; }
  .hub-tab {
    flex: 0 0 auto; min-width: 84px; min-height: 64px; scroll-snap-align: center;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    padding: 8px 12px 7px;
    font-size: 12.5px; line-height: 1; letter-spacing: 0; white-space: nowrap; text-align: center;
    border-bottom: 0; border-top: 3px solid transparent; position: relative;
  }
  .hub-tab.active { border-bottom-color: transparent; border-top-color: var(--blue); }
  .hub-main { padding-bottom: calc(env(safe-area-inset-bottom) + 80px); }
}
.btr-tab-ic { width: 24px; height: 24px; display: block; }
@media (min-width: 721px) { .btr-tab-ic { display: none; } }
.hub-tab .btr-unread { position: absolute; top: 5px; right: 14px; padding: 1px 6px; font-size: 10px; }
.btr-flash { margin: 12px 18px 0; padding: 10px 12px; border-radius: 6px; background: var(--blue-soft); color: var(--blue); font-size: 13px; }
.btr-flash-err { background: var(--danger-soft); color: var(--danger); }
.btr-wrap { padding: 8px 18px 40px; }
.btr-auth { max-width: 420px; margin: 0 auto; padding: 28px 18px 60px; }
.btr-auth h1 { color: var(--white); font-size: 22px; margin: 0 0 6px; }
.btr-auth h1.hub-brand img { width: 36px; height: 36px; }
.btr-auth p { color: var(--muted); font-size: 14px; }
.btr-label { display: block; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin: 12px 0 6px; }
.btr-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.btr-muted { color: var(--muted); font-size: 12px; }
.btr-cal-cell { text-decoration: none; }
.hub-cal-job a { color: inherit; text-decoration: none; }
.btr-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.btr-code { font-family: ui-monospace, Menlo, monospace; font-size: 12px; word-break: break-all; color: var(--chrome); }

/* Light theme: white page, black type, blue actions; header stays black to carry the logo. */
body { --ink:#FFFFFF; --chrome:#111111; --white:#000000; --muted:#5F6368; --muted-soft:rgba(0,0,0,.06);
  --rule:#E3E3E3; --panel:#F5F7FB; --raised:#FFFFFF; --ink-soft:#BBBBBB; --blue-soft:rgba(30,91,255,.08);
  background:#fff; color:#111; }
.hub-header, .hub-tabs { --ink:#000; --white:#FFFFFF; --chrome:#EDEDED; --muted:#A0A0A0; --rule:#222;
  background:#000; color:#EDEDED; }
.hub-header { border-bottom:0; }
input:not([type=checkbox]):not([type=radio]), select, textarea { background:#fff !important; border:1px solid #CFCFCF !important; color:#000 !important; }
input:focus, select:focus, textarea:focus { border-color:var(--blue) !important; outline:none; box-shadow:0 0 0 3px rgba(30,91,255,.15); }
.hub-button, .hub-button-publish, .hub-assign-text, .hub-cal-cell.is-selected, .hub-cal-btn { color:#fff !important; }
.hub-cal-btn { background:var(--blue); border-color:var(--blue); }
.hub-button-secondary { color:var(--blue) !important; background:#fff; }
.btr-flash { background:var(--blue-soft); border:1px solid rgba(30,91,255,.3); color:#000; }
.btr-flash .hub-link-btn { color:var(--blue); font-weight:800; }
input[type=checkbox] { accent-color:var(--blue); }
.hub-main > .hub-panel { padding-left: 18px; padding-right: 18px; }
.hub-main > .hub-panel .hub-section-title { padding-left: 0; padding-right: 0; }
.hub-main > .btr-flash, .hub-main > #pwa-install { margin-left: 18px; margin-right: 18px; }
/* Header brand: big pin, two-tone wordmark. */
.hub-brand { gap: 10px; }
.hub-brand .btr-logo { width: 48px; height: 48px; overflow: hidden; border-radius: 12px; flex: none; display: block; }
.hub-brand .btr-logo img { width: 48px; height: 48px; transform: none; display: block; }
.btr-wm { font-size: 24px; font-weight: 800; letter-spacing: -.035em; line-height: 1; white-space: nowrap; }
.btr-wm-a { color: #fff; }
.btr-wm-b { color: var(--blue); margin-left: .22em; }
.hub-header { padding-bottom: 12px; }
.btr-auth .hub-brand .btr-wm-a { color: #000; }
.hdr .btr-wm-a { color: inherit; }

/* Live tracking: driver's sticky "Sharing location" bar */
.btr-track-bar { position:fixed; left:0; right:0; bottom:0; z-index:50; display:flex; align-items:center; gap:8px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:#000; color:#fff; border-top:2px solid var(--blue); }
.btr-track-bar[hidden] { display:none; }
.btr-track-bar-msg { flex:1; font-size:13px; font-weight:700; }
.btr-track-bar .hub-button, .btr-track-bar .hub-button-secondary { width:auto; padding:9px 14px; margin:0; }
.btr-track-dot { width:10px; height:10px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 0 rgba(30,91,255,.7); animation:btrPulse 1.6s infinite; }
@keyframes btrPulse { 0%{box-shadow:0 0 0 0 rgba(30,91,255,.7)} 70%{box-shadow:0 0 0 10px rgba(30,91,255,0)} 100%{box-shadow:0 0 0 0 rgba(30,91,255,0)} }
body.btr-tracking-on .hub-main { padding-bottom:80px; }
.btr-track-start { margin-top:10px; }
.btr-track-start .hub-button { width:auto; padding:9px 16px; }

/* Driver profile and IDs */
.btr-profile { display:flex; gap:14px; align-items:center; margin-bottom:12px; }
.btr-avatar { width:72px; height:72px; border-radius:50%; object-fit:cover; border:2px solid var(--blue); flex:none; display:block; }
.btr-carphoto { width:100%; max-height:240px; object-fit:cover; border-radius:12px; display:block; margin:6px 0 8px; background:var(--paper); }
.btr-vehicle { font-size:14px; margin:0 0 14px; }
.btr-vehicle span { color:var(--muted); }
.btr-driver-id { font-size:22px; font-weight:800; letter-spacing:.18em; }
.btr-driver-id-sm { font-weight:800; letter-spacing:.12em; color:var(--blue); font-size:12px; }
.btr-profile-photos { display:grid; gap:10px; }
.btr-addid { margin:14px 0 6px; }
.btr-install-card { background:#fff; border:1px solid #e3e6ea; border-radius:14px; padding:16px; margin:16px 0; }
.btr-home-install { margin: 12px 0 4px; }
.btr-home-install .btr-install-card { margin: 0; }
.btr-install-card .hub-section-title { margin-top:0; }
.btr-install-card .hub-button { width:100%; }

.btr-field-err{color:#c0392b;font-size:.9rem;margin:6px 0 0;font-weight:600}