/* Driver's daybook. Presentation only: schedule geometry lives in style.css/app.js. */
@font-face {
  font-family: Manrope; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('/fonts/manrope-latin.woff2') format('woff2');
}
@font-face {
  font-family: Manrope; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('/fonts/manrope-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
:root {
  --canvas:#F5F4EF; --surface:#FFFFFF; --surface-secondary:#FAF9F5;
  --surface-hover:#F0EFE9; --surface-pressed:#E7E7DF; --surface-disabled:#ECEDE7;
  --ink:#202723; --text-secondary:#505B53; --muted:#626D65; --placeholder:#677168;
  --text-disabled:#737D75; --line:#DDDFD5; --control-border:#B9BFB3;
  --separator:#EBECE5; --border-hover:#8A9488;
  --accent:#303E33; --accent-hover:#243128; --accent-pressed:#18251D;
  --accent-soft:#E9EDE5; --accent-soft-hover:#DCE3D7; --accent-border:#A4B69D;
  --transfer:#2A624D; --transfer-accent:#3C7B60; --transfer-bg:#EAF2EC; --transfer-border:#BED5C6;
  --allocation:#555475; --allocation-accent:#777391; --allocation-bg:#EFEDF6; --allocation-border:#D2CDE2;
  --history:#60665E; --history-bg:#F0F0EB; --history-border:#DCDDD4;
  --attention:#7C4D0D; --attention-bg:#FCF3DF; --attention-border:#E8D0A3;
  --overlay:rgba(20,29,23,.5); --brand-amber:#EDBF61; --brand-dark:#202723;
  --shadow-small:0 2px 4px rgba(32,39,35,.04);
  --shadow-dialog:0 24px 80px rgba(20,29,23,.24);
  font-family:Manrope,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
body { -webkit-font-smoothing:antialiased; }
.topbar { background:var(--brand-dark); color:#FFF; border-bottom:0; padding:12px 20px; padding-top:calc(12px + env(safe-area-inset-top)); }
.brand { color:#FFF; gap:10px; font-size:1.35rem; font-weight:800; letter-spacing:-.065em; line-height:1.1; }
.brand-symbol { width:32px; height:32px; flex:none; color:var(--brand-amber); }
.brand b { color:var(--brand-amber); font-weight:500; }
.brand small { display:block; color:#C4CCC2; font-size:.5rem; letter-spacing:.16em; margin-top:6px; font-weight:600; }
.header-logout { color:#D3DBD1; }
.header-logout .app-icon { width:18px; height:18px; }
main { padding:24px 18px; }
h1,h2,.route-title { letter-spacing:-.045em; font-weight:800; }
.dashboard-head { margin-bottom:20px; gap:8px; }
.dashboard-head > div { display:block; }
.page-kicker { display:block; color:var(--muted); font-size:.625rem; font-weight:800; letter-spacing:.12em; margin-bottom:7px; }
.dashboard-title { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.dashboard-head h1 { font-size:1.8rem; font-weight:800; letter-spacing:-.06em; }
.vehicle-context { border:1px solid #BAC0B4; border-left:4px solid #536A7D; border-radius:4px; padding:3px 7px; background:#FFF; color:var(--ink); font-size:.6875rem; font-weight:800; letter-spacing:.035em; }
.primary, .section-head .primary { background:var(--brand-amber); color:var(--brand-dark); font-weight:800; border-radius:12px; min-height:48px; padding:12px 16px; box-shadow:0 2px 0 rgba(103,74,20,.1); }
.primary:hover, .section-head .primary:hover { background:#E3AF47; color:var(--brand-dark); }
.primary:active, .section-head .primary:active { background:#D9A23A; transform:translateY(1px); }
.primary:disabled { background:var(--surface-disabled); color:var(--text-disabled); box-shadow:none; }
.secondary,.ghost { border-radius:12px; font-weight:700; }
.bottom-nav { padding-inline:8px; background:var(--surface); box-shadow:0 -4px 20px rgba(32,39,35,.035); }
.bottom-nav button { border-radius:0; color:var(--muted); font-weight:600; gap:3px; }
.bottom-nav button.active { color:var(--ink); background:none; font-weight:800; }
.bottom-nav button.active .app-icon { background:var(--brand-amber); box-shadow:0 0 0 7px var(--brand-amber); border-radius:5px; }
.bottom-nav button .nav-label { margin-top:5px; font-size:.625rem; }
.calendar-workspace { border-radius:18px; border-color:#D8DCD1; }
.calendar-toolbar { padding:18px 14px 10px; }
.calendar-period strong { font-size:1.4rem; font-weight:800; letter-spacing:-.05em; }
.calendar-period small { font-size:.875rem; }
.calendar-navigation button:not(.text-btn) { border:0; background:var(--surface-secondary); border-radius:10px; }
.calendar-navigation .text-btn { font-weight:800; font-size:.75rem; }
.calendar-key { padding:0 14px 16px; gap:8px 10px; font-size:.625rem; font-weight:600; }
.calendar-key span::before { width:5px; height:5px; border-radius:50%; }
.month-grid .weekday { background:var(--surface-secondary); font-size:.625rem; font-weight:800; letter-spacing:.04em; padding:10px 0; }
.month-grid .day-tile { min-height:82px; padding:7px 3px; border-right:1px solid var(--separator); }
.month-grid .day-tile b { font-weight:700; font-size:.875rem; width:30px; height:30px; line-height:30px; margin-bottom:2px; }
.month-grid .day-tile.today b { background:var(--brand-dark); color:var(--brand-amber); }
.month-grid .day-tile.outside b { color:#828B81; }
.month-event { font-size:.625rem; font-weight:700; border-left-width:2px; border-radius:4px; justify-content:center; padding:3px 1px; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip-path:inset(50%); white-space:nowrap; border:0!important; }
.day-week-strip { grid-template-columns:28px repeat(7,minmax(0,1fr)) 28px; padding:8px 4px; gap:0; }
.day-week-strip .week-step { display:flex; align-items:center; justify-content:center; min-height:60px; color:var(--text-secondary); }
.week-step .app-icon { width:18px; height:18px; }
.day-week-strip small { font-size:.6875rem; font-weight:600; }
.day-week-strip button.active { background:var(--surface-secondary); }
.day-week-strip button.active b { background:var(--brand-dark); color:var(--brand-amber); }
.day-week-strip b { width:32px; height:32px; line-height:32px; }
.day-heading { background:var(--surface-secondary); }
.day-heading .day-calendar-title { font-size:.8125rem; font-weight:800; }
.day-event b { font-size:.8125rem; font-weight:800; }
.day-event { border-radius:6px; }
.day-event:not(.limited):not(.compact) span { display:-webkit-box; -webkit-line-clamp:var(--event-lines,4); white-space:normal; overflow-wrap:anywhere; flex-shrink:0; min-height:0; font-size:var(--event-text-size,.8125rem); line-height:var(--event-line-height,1.46154); }
.day-event:not(.limited):not(.compact) small { flex-shrink:1; }
.day-event.compact b { font-size:.75rem; }
.is-day { min-height:400px; }
.is-day > .text-btn { margin:0; padding:12px; min-height:44px; border-top:1px solid var(--line); font-size:.75rem; background:var(--surface-secondary); }
.calendar-support { display:flex; flex-direction:column; gap:0; margin-top:18px; }
.next-card { order:-1; display:block; background:var(--brand-dark); color:#FFF; border:0; border-radius:16px; padding:18px; margin:0 0 18px; position:relative; overflow:hidden; }
.next-heading { display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px 12px; margin-bottom:18px; }
.next-card small { display:flex; align-items:center; gap:7px; color:var(--brand-amber); font-size:.5625rem; letter-spacing:.12em; font-weight:800; }
.live-dot { width:5px; height:5px; border-radius:50%; background:var(--brand-amber); }
.next-date { color:#CBD3C8; font-size:.625rem; }
.next-body { display:flex; align-items:center; gap:14px; }
.next-card .next-time { font-size:1.85rem; line-height:1.15; font-weight:800; letter-spacing:-.06em; font-variant-numeric:tabular-nums; color:#FFF; margin:0; flex:none; }
.next-route { flex:1; min-width:0; border-left:1px solid #515B51; padding-left:14px; }
.next-card strong { color:#FFF; font-weight:700; font-size:.8125rem; line-height:1.5; overflow-wrap:anywhere; }
.next-flight { font-size:.6875rem; color:var(--brand-amber); display:block; margin-top:5px; }
.next-card button { background:#38443A; color:var(--brand-amber); min-width:44px; width:44px; height:44px; padding:10px; border-radius:50%; }
.next-card button .app-icon { width:22px; height:22px; }
.next-clear { background:#E7EBE1; border:1px solid #D4DCCC; }
.next-clear small { color:var(--text-secondary); margin-bottom:8px; }
.next-clear strong { color:var(--ink); font-size:1rem; }
.next-clear p { color:var(--text-secondary); font-size:.75rem; margin:6px 0 0; max-width:36ch; }
.card { border-radius:16px; padding:20px; }
.line > .text-btn { flex-shrink:0; white-space:nowrap; }
.section-head h2,main > .section-head:first-child h2 { font-weight:800; letter-spacing:-.045em; }
.reservation-entry { border-radius:14px; border-color:var(--line); margin:10px 0; }
.reservation-row { padding:18px 14px; grid-template-columns:64px minmax(0,1fr) 18px; gap:12px; }
.reservation-row-time { color:var(--ink); font-size:1.15rem; font-weight:800; letter-spacing:-.05em; }
.reservation-row-main strong { font-weight:700; font-size:.875rem; line-height:1.45; }
.reservation-row-main small { font-size:.75rem; }
.reservation-date-heading { color:var(--text-secondary); font-size:.6875rem; font-weight:800; letter-spacing:.035em; padding-bottom:8px; border-bottom:1px solid var(--line); }
.reservation-modes { background:#E9EBE3; border-radius:12px; padding:4px; }
.reservation-modes button { min-height:44px; font-weight:700; }
.reservation-modes button.active { background:var(--brand-dark); color:#FFF; box-shadow:none; border-radius:9px; }
.summary div { background:#E9EDE5; border:0; border-radius:14px; }
.summary b { font-weight:800; letter-spacing:-.055em; }
.currency-summary .card { background:var(--surface-secondary); }
.empty { background:transparent; border:1px dashed #B9C1B3; padding:36px 20px; border-radius:16px; }
.empty::before { content:''; display:block; width:26px; height:26px; margin:0 auto 18px; background:url('/app-icon.svg?v=20261011-3') center/contain no-repeat; opacity:.8; }
.empty b { font-weight:800; }
.directions-link { background:var(--accent-soft); border:0; font-weight:700; border-radius:10px; }
.read-search-panel { border-radius:14px; }
.banner { border-radius:12px; font-size:.8125rem; }
.banner strong { font-weight:800; }
.field label { font-weight:700; font-size:.8125rem; }
.field input:not([type=radio]):not([type=checkbox]),.field textarea,.field select,.date-display,.read-search input,.read-search select { background:var(--surface-secondary); border-color:var(--control-border); border-radius:11px; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--accent); background:var(--surface); }
.field input[aria-invalid=true],.field select[aria-invalid=true],.field textarea[aria-invalid=true] { border-color:var(--conflict); }
.segmented { background:#E9EBE3; border-radius:12px; }
.segmented span { font-weight:700; border-radius:9px; }
.segmented input:checked + span { color:var(--ink); }
.dialog-head h2 { font-weight:800; letter-spacing:-.045em; }
.icon-btn { min-height:48px; min-width:48px; width:48px; height:48px; }
.dialog-head small { color:var(--muted); font-weight:800; letter-spacing:.1em; font-size:.625rem; }
.form-section-title { font-size:.875rem; font-weight:800; }
.editor-footer,.dialog-footer { background:var(--surface-secondary); }
.optional-details { background:var(--surface-secondary); border-radius:12px; }
.optional-details summary { font-weight:700; }
.auth { padding:28px; margin:20px auto; max-width:460px; border:0; background:transparent; }
.auth-intro { background:var(--brand-dark); color:#FFF; padding:30px 28px 16px; margin:-28px -28px 28px; border-radius:18px; }
.auth .auth-intro .eyebrow { display:block; color:var(--brand-amber); font-size:.5625rem; letter-spacing:.16em; font-weight:800; }
.auth-intro h2 { font-size:2.15rem; line-height:1.15; letter-spacing:-.065em; margin:18px 0 12px; font-weight:800; }
.auth .auth-intro p { font-size:.8125rem; color:#D5DDD1; line-height:1.65; margin:0; }
.auth-road { width:100%; height:60px; color:var(--brand-amber); margin-top:12px; }
.auth h1 { font-size:1.375rem; line-height:1.5; font-weight:800; letter-spacing:-.05em; }
.auth .auth-description { font-size:.8125rem; }
.auth .segmented { margin:22px 0; }
.auth .field { margin:18px 0; }
.auth .hint { font-size:.6875rem; line-height:1.6; }
.auth .remember-device { font-size:.8125rem; font-weight:600; margin:14px 0 4px; }
.remember-device input { accent-color:var(--accent); }
.auth a { color:var(--text-secondary); font-size:.6875rem; text-underline-offset:3px; }
.auth #login-help { margin-top:8px; }
.shell:has(.auth) { padding-left:0; padding-bottom:0; }
.shell:has(.auth) main { max-width:100%; padding:20px 18px; }
.shell:has(.auth) .topbar .brand { color:#FFF; }
.shell:has(.auth) .topbar { margin-left:0; }
@media(min-width:768px) {
  .topbar { margin-left:-72px; padding-inline:28px; }
  .bottom-nav { top:72px; background:var(--brand-dark); border:0; gap:12px; }
  .bottom-nav button { color:#BCC7B9; border-radius:12px; }
  .bottom-nav button.active { background:#354237; color:var(--brand-amber); }
  .bottom-nav button.active .app-icon { box-shadow:none; background:none; }
  main { padding:32px; }
  .month-grid .day-tile { min-height:118px; padding:10px 8px; }
  .month-event { justify-content:flex-start; font-size:.75rem; padding:4px 6px; }
  .calendar-key { font-size:.6875rem; }
  .calendar-toolbar { padding:22px 24px 10px; }
  .calendar-key { padding-inline:24px; }
  .calendar-period strong { font-size:1.75rem; }
  .auth { margin:30px auto; padding:32px; background:var(--surface); border:1px solid var(--line); border-radius:22px; }
  .auth-intro { margin:-32px -32px 28px; border-radius:22px 22px 0 0; padding:32px; }
  .reservation-row { grid-template-columns:80px minmax(0,1fr) 20px; padding:22px; }
}
@media(min-width:1200px) {
  .topbar { margin-left:0; }
  .topbar .brand { background:var(--brand-dark); color:#FFF; height:72px; width:224px; border-color:#414B40; padding-left:22px; }
  .bottom-nav { width:224px; padding:24px 14px; }
  .bottom-nav button { padding:15px; gap:14px; min-height:52px; }
  .bottom-nav button .nav-label { font-size:.8125rem; margin:0; }
  main:has(.calendar-workspace) { grid-template-columns:minmax(0,1fr) 310px; }
  .calendar-support { margin-top:0; }
  .calendar-support .next-card { display:block; padding:22px; }
  .next-body { flex-wrap:wrap; }
  .next-card .next-time { font-size:2.4rem; }
  .next-body { display:grid; grid-template-columns:minmax(0,1fr) 44px; }
  .next-route { grid-column:1/-1; grid-row:2; border-left:0; border-top:1px solid #515B51; padding:14px 0 0; }
  .next-body > button { grid-column:2; grid-row:1; }
}
@media(max-width:767px) {
  main:has(.calendar-workspace) { display:flex; flex-direction:column; }
  .calendar-support { display:contents; }
  .calendar-support > * { order:3; }
  .calendar-support .next-card { order:1; }
  .calendar-workspace { order:2; width:100%; }
  .vehicle-filter { order:1; }
  main:has(.is-day) .next-card { display:none; }
  main:has(.is-day) { padding-top:18px; padding-bottom:12px; }
  main:has(.is-day) .dashboard-head { margin-bottom:14px; }
  /* Fill the visible phone viewport, keeping only the hours independently scrollable. */
  .is-day { height:calc(100dvh - 230px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); min-height:280px; }
  .header-logout span { display:none; }
  .header-logout { padding:0; min-width:44px; justify-content:center; }
  .dashboard-head .primary { min-height:48px; padding:12px 14px; }
  .auth { padding:22px 8px; margin:0 auto; }
  .auth-intro { margin:-22px -8px 26px; padding:26px 24px 10px; }
  .auth-intro { padding:20px 24px 8px; margin-bottom:20px; }
  .auth-intro h2 { font-size:1.8rem; margin:12px 0 10px; }
  .auth .auth-intro p { font-size:.75rem; line-height:1.5; }
  .auth-road { height:32px; margin-top:6px; }
  .auth .segmented { margin:16px 0; }
  .auth .field { margin:14px 0; }
  dialog { border-radius:24px 24px 0 0; }
  #job-form > .dialog-head,.form-dialog .dialog-head { padding-top:24px; }
  .editor-content,.dialog-content { padding-bottom:28px; }
  .calendar-support .section-head { margin-top:14px; }
}
@media(max-width:359px) {
  main { padding-inline:12px; }
  .dashboard-title { gap:8px; }
  .dashboard-head h1 { font-size:1.5rem; }
  .dashboard-head .primary { padding-inline:12px; }
  .vehicle-context { font-size:.5625rem; }
  .page-kicker { font-size:.5rem; }
  .calendar-toolbar { padding-inline:10px; }
  .calendar-period strong { font-size:1.2rem; }
  .calendar-controls { gap:0; }
  .calendar-key { padding-inline:10px; gap:7px; font-size:.5625rem; }
  .month-grid .day-tile { min-height:76px; }
  .reservation-row { grid-template-columns:56px minmax(0,1fr) 16px; gap:8px; padding:14px 12px; }
  .reservation-row-time { font-size:1rem; }
  .next-card { padding:16px; }
  .next-card .next-time { font-size:1.5rem; }
  .next-body { gap:10px; }
  .next-route { padding-left:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .primary:active { transform:none; }
}
/* Inline suggestions also remain legible when voice fills both endpoints. */
.place-area { margin: 12px 0 18px; }
.place-area label { display: block; font-size: .875rem; margin-bottom: 6px; }
.place-area select { width: 100%; max-width: 100%; min-height: 48px; padding: 10px; font: inherit; color: var(--ink); background: var(--surface-secondary); border: 1px solid var(--control-border); border-radius: 11px; }
.place-area select:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
.place-suggestions { position: static; margin-top: 8px; max-height: 300px; }
.place-suggestions button strong,.place-suggestions button span { display: block; overflow-wrap: anywhere; }
.place-suggestions button span { color: var(--muted); font-size: .8rem; margin-top: 3px; }
.place-suggestions button .place-used { color: var(--accent); font-size: .75rem; }
.place-suggestions button[aria-selected="true"] { outline: 2px solid var(--accent); outline-offset: -2px; }
.jobs-date-bar #jobs-period { max-width: 100%; min-height: 43px; padding: 9px 10px; font: inherit; font-size: .8125rem; color: var(--accent); background: var(--accent-soft); border: 1px solid var(--accent-soft-hover); border-radius: 9px; }