/* ===== Message #15 preview (?preview=v2): Driver's Toolbox dropdown + 18-type quote form. Loaded only in preview. ===== */

/* ---------- Header: Driver's Toolbox dropdown ---------- */
nav.v2nav{align-items:center}
.ts-wrap{position:relative}
.ts-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:6px 0;border-bottom:3px solid transparent;cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:inherit;color:#111827;white-space:nowrap}
.ts-btn svg{width:11px;height:8px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.ts-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.ts-btn:hover,.ts-wrap.is-current .ts-btn{border-bottom-color:#D9B44A}
.ts-btn:focus-visible,.ts-menu a:focus-visible{outline:3px solid rgba(217,180,74,.8);outline-offset:2px}
.ts-menu{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);min-width:270px;background:#fff;border:1px solid #D5DCE9;border-radius:8px;box-shadow:0 22px 40px -18px rgba(6,26,64,.45);padding:8px;z-index:60;text-transform:none;letter-spacing:0}
.ts-menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.ts-menu a{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:6px;text-decoration:none;border:0;white-space:normal}
.ts-menu a:hover{background:#F3F5F9}
.ts-menu b{font-family:var(--disp);font-weight:700;font-size:1.05rem;letter-spacing:.04em;text-transform:uppercase;color:#0A2A5E}
.ts-menu small{font-family:var(--text);font-weight:500;font-size:.86rem;color:#5A6478}
.ts-menu a[aria-current="page"] b{color:#8C5A0A}
@media (max-width:1180px){
  header.v2hdr nav.v2nav.open .ts-wrap{border-bottom:1px solid #EEF1F6}
  header.v2hdr nav.v2nav.open .ts-btn{width:100%;justify-content:space-between;padding:12px 0;border-bottom:0}
  header.v2hdr nav.v2nav.open .ts-menu{position:static;transform:none;min-width:0;box-shadow:none;border:0;padding:0 0 8px 12px}
  header.v2hdr nav.v2nav.open .ts-menu::before{display:none}
  header.v2hdr nav.v2nav.open .ts-menu a{padding:8px 0;border-bottom:0}
}
}

/* ---------- Header v2 layout (Message #20): the logo never shrinks, wraps or gets covered ---------- */
header.v2hdr .bar{flex-wrap:nowrap;gap:20px;position:relative}
header.v2hdr .brand{flex:0 0 auto;min-width:max-content;margin-right:auto}
header.v2hdr .brand .wm,header.v2hdr .brand .wm b,header.v2hdr .brand .wm small{white-space:nowrap}
header.v2hdr nav.v2nav{flex:0 1 auto;min-width:0;gap:24px;white-space:nowrap}
header.v2hdr nav.v2nav a,header.v2hdr .ts-btn{white-space:nowrap}
header.v2hdr .hphone{flex:0 0 auto}
header.v2hdr .hphone b,header.v2hdr .hphone small{white-space:nowrap}
header.v2hdr .bar>.btn.gold{flex:0 0 auto;white-space:nowrap}
header.v2hdr .menu{flex:0 0 auto}
header.v2hdr .nav-call{display:none}
/* Hamburger from 1180 px down (the base theme switches at 1100; the full row needs about 1085 px of room plus margins). */
@media (max-width:1180px){
  header.v2hdr nav.main{display:none}
  header.v2hdr nav.main.open{display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid #D5DCE9;padding:8px 20px 16px;box-shadow:0 18px 30px -18px rgba(0,0,0,.3);max-height:calc(100vh - 90px);overflow-y:auto}
  header.v2hdr nav.main.open>a{padding:12px 0;border-bottom:1px solid #EEF1F6}
  header.v2hdr .menu{display:block}
}
/* Phone number moves into the hamburger menu when the bar gets tight (and the call bar is at the bottom on phones). */
@media (max-width:900px){
  header.v2hdr .hphone{display:none}
  header.v2hdr nav.main.open>a.nav-call{display:block;font-weight:700;color:#0A2A5E}
}
@media (max-width:760px){header.v2hdr .bar>.btn.gold{display:none}}

/* ---------- Quote form v2: icon dropdowns (Message #19) ---------- */
.qc2-step{font-family:var(--disp);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;color:#8C5A0A!important;margin-top:10px!important}
.q2 legend{margin-bottom:14px}
.q2-field{margin-bottom:18px}
.q2-field>.lbl{display:block;margin-bottom:8px}
.q2-row{position:relative}
.q2-row+.q2-row{margin-top:10px}
.q2-row-extra{display:flex;align-items:flex-start;gap:8px}
.q2-row-extra .q2-dd{flex:1;min-width:0}
.q2-dd{position:relative}
.q2-dd-btn{width:100%;min-height:52px;display:flex;align-items:center;gap:12px;box-sizing:border-box;padding:8px 14px;border:1.5px solid #9AA6BD;border-radius:6px;background:#fff;color:#111827;font:inherit;font-size:1.02rem;text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.q2-dd-btn:hover{border-color:#0A2A5E}
.q2-dd-btn:focus-visible,.q2-dd-btn[aria-expanded="true"]{border-color:#0A2A5E;outline:3px solid rgba(217,180,74,.6);outline-offset:0}
.q2-dd-btn .q2-ico{width:26px;height:26px;flex:none;stroke:#0A2A5E;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.q2-val{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.q2-dd:not(.has-value) .q2-val{color:#5A6478}
.q2-chev{width:12px;height:8px;flex:none;stroke:#0A2A5E;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.q2-dd-btn[aria-expanded="true"] .q2-chev{transform:rotate(180deg)}
/* The list opens in the flow of the form (not as a floating layer), so it can never run off a phone screen or be clipped by the card. */
.q2-dd-panel{margin-top:6px;border:1.5px solid #0A2A5E;border-radius:6px;background:#fff;overflow:hidden}
.q2-dd-search{display:block;width:100%;box-sizing:border-box;min-height:46px;padding:10px 14px;border:0;border-bottom:1px solid #D5DCE9;font:inherit;font-size:1rem;background:#F8F9FC;color:#111827;border-radius:0}
.q2-dd-search:focus{outline:3px solid rgba(217,180,74,.6);outline-offset:-3px}
.q2-list{list-style:none;margin:0;padding:4px;max-height:min(46vh,280px);overflow-y:auto;overscroll-behavior:contain}
.q2-list:focus{outline:3px solid rgba(217,180,74,.6);outline-offset:-3px}
.q2-list li{display:flex;align-items:center;gap:12px;min-height:46px;padding:6px 10px;border-radius:5px;cursor:pointer;color:#111827;font-size:1rem}
.q2-list li .q2-ico{width:22px;height:22px;flex:none;stroke:#0A2A5E;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.q2-list li span{flex:1;min-width:0}
.q2-list li .q2-tick{width:16px;height:16px;flex:none;stroke:#0A2A5E;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;visibility:hidden}
.q2-list li[aria-selected="true"]{background:#F3F5F9;font-weight:600}
.q2-list li[aria-selected="true"] .q2-tick{visibility:visible}
.q2-list li.is-active,.q2-list li:hover{background:#E8EDF6}
.q2-list li[aria-disabled="true"]{opacity:.4;cursor:not-allowed}
.q2-list li[hidden]{display:none}
.q2-empty{margin:0;padding:12px 14px;font-size:.92rem;color:#5A6478}
.q2-add{margin-top:10px;background:none;border:0;padding:10px 2px;min-height:44px;font:inherit;font-weight:600;font-size:.98rem;color:#0A2A5E;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.q2-add:focus-visible,.q2-remove:focus-visible{outline:3px solid rgba(217,180,74,.8);outline-offset:2px;border-radius:4px}
.q2-add[hidden]{display:none}
.q2-remove{flex:none;width:52px;height:52px;display:flex;align-items:center;justify-content:center;border:1.5px solid #C9D2E2;border-radius:6px;background:#fff;cursor:pointer}
.q2-remove:hover{border-color:#B31942}
.q2-remove svg{width:16px;height:16px;stroke:#5A6478;fill:none;stroke-width:1.8;stroke-linecap:round}
.q2-note{font-size:.86rem;color:#5A6478;margin:0 0 4px}
nav.v2nav .ts-menu a[aria-current="page"]{border-bottom-color:transparent}
nav.v2nav .ts-menu a:hover,nav.v2nav .ts-menu a:focus-visible{border-bottom-color:transparent}
