/* Driver pages: phone-first. Loaded only on /drive and /app pages. */

/* landing: the appbar sits above the hero, so give it the deep background */
body.drv-landing .appbar.on-deep{background:var(--deep)}
.drv-heronums{display:flex;gap:var(--s5);margin-top:var(--s4);flex-wrap:wrap}
.drv-heronums .lbl{color:var(--on-deep-dim)}
.drv-heronums .big{font-family:var(--f-dp);font-size:29px;font-weight:700;color:#fff;letter-spacing:-.02em}
.drv-range{width:100%;accent-color:var(--teal);height:32px;padding:0!important;border:0!important;min-height:0!important}
.drv-est{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;justify-content:space-between}
.drv-est-num{font-family:var(--f-dp);font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.drv-stepnum{width:34px;height:34px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;
  font-weight:700;margin-bottom:12px}
.drv-steps h3{font-size:15px;margin-bottom:6px}

/* apply flow */
.drv-apply{max-width:1080px;margin:0 auto;width:100%}
.drv-form{max-width:560px}
.drv-cta{display:flex;gap:10px;margin-top:var(--s3);flex-wrap:wrap}
.drv-reasons{margin:0;padding-left:20px;font-size:13.5px;color:var(--slate);line-height:1.8}
.check.bad span{color:var(--crimson)}

/* account */
a.drv-cardlink{display:block;text-decoration:none;color:inherit;transition:box-shadow .15s,transform .15s}
a.drv-cardlink:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.drv-review{max-width:560px}
.drv-tabs a.chip{text-decoration:none}
.drv-maphd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
tr.drv-sel td{background:var(--teal-l)}
.drv-emptycard{display:flex;gap:var(--s3);align-items:center;flex-wrap:wrap}
.drv-emptycard img{width:220px;max-width:100%;border-radius:8px;flex:none}
.drv-emptycard>div{flex:1;min-width:220px}
.drv-howto{margin:0;padding-left:20px;font-size:13.5px;color:var(--slate);line-height:1.9}
.drv-howto b{color:var(--ink)}

/* photo check-in */
.drv-file{position:absolute;width:1px;height:1px;opacity:0}
.drv-photo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;
  border:2px dashed var(--line);border-radius:12px;padding:var(--s4) var(--s3);cursor:pointer;background:var(--paper);
  min-height:200px;transition:border-color .15s}
.drv-photo:hover,.drv-file:focus-visible+.drv-cta{border-color:var(--teal)}
.drv-photo-ico{font-size:40px;line-height:1}
.drv-photo-tx b{display:block;font-size:16px}
.drv-photo-tx small{color:var(--slate);font-size:12.5px}
.drv-photo img{max-height:240px;width:auto;border-radius:8px}
.drv-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.drv-thumbs figure{margin:0}
.drv-thumbs img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;background:var(--pale)}
.drv-thumbs figcaption{font-size:11.5px;color:var(--slate);margin-top:4px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}

/* phones: big tap targets, primary action full width at the end of the form */
@media(max-width:820px){
  .btn{min-height:46px}
  .btn.sm{min-height:38px}
  .opt{padding:14px 16px}
  .chip{padding:9px 15px;font-size:13.5px}
  .drv-cta{display:flex;gap:10px;margin-top:var(--s3)}
  .drv-cta .btn{flex:1;min-height:48px}
  .drv-heronums{gap:var(--s3)}
  .drv-heronums .big{font-size:22px}
  .drv-thumbs{grid-template-columns:repeat(2,1fr)}
  .steps div{font-size:0;gap:0}
  .steps div.on{font-size:12.5px;gap:8px}
  .steps u{margin:0 6px;min-width:12px}
}
.drv-range{height:44px!important}
.drv-range::-webkit-slider-runnable-track{height:8px;border-radius:4px}
.drv-range::-moz-range-track{height:8px;border-radius:4px}
