/* Shared Haul identity: charcoal, white, and yellow across signed-in screens. */
:root{--haul-ink:#172126;--haul-yellow:#ffd34e;--haul-soft:#f2f5f6;--line:#d7dee1;--green:#172126;color:var(--haul-ink);background:var(--haul-soft);font-family:Arial,Helvetica,sans-serif}
button,.button,input,select,textarea{color:var(--haul-ink);border-radius:10px}
button,.button{font-weight:700}
button.primary,.invite-share-actions .primary{background:var(--haul-yellow);color:var(--haul-ink);border-color:var(--haul-yellow)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #1d70be;outline-offset:3px}
.topbar{background:#fff;border-color:var(--line);padding-block:18px}
.topbar .brand{color:var(--haul-ink);font-size:30px;letter-spacing:-1.3px}
.topbar .imperial-shared-logo{filter:none}
.topbar .brand span{font-size:11px;letter-spacing:1px;color:var(--haul-ink)}
.topbar button{background:#fff;border-color:var(--line);color:var(--haul-ink)}
.pilot{background:#fff3ca;color:var(--haul-ink)}
h1{font-weight:800;letter-spacing:-1px;font-size:36px}
.eyebrow{color:#526068;font-size:12px;letter-spacing:.1em}
.lead,.muted,small,.sync,dt{color:#526068}
.panel{border-radius:18px;border-color:var(--line);box-shadow:0 2px 4px #17212603}
input,select,textarea{border-color:#aab6bd}
input[readonly]{background:var(--haul-soft)}
.switches{gap:10px}
.switches button{background:#fff;border-color:var(--line);min-height:48px}
.switches button[aria-pressed="true"],.switches button.active{background:var(--haul-ink);color:#fff;border-color:var(--haul-ink)}
.switches button[aria-pressed="true"] .haul-icon{color:var(--haul-yellow)}
.haul-icon{display:inline-block;vertical-align:middle;width:22px;height:22px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.choices{gap:18px}
.choices button{border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--haul-ink);min-height:194px;padding:24px}
.choices button.primary{background:var(--haul-yellow);border-color:var(--haul-yellow)}
.choices .haul-icon{display:block;width:52px;height:52px;margin-bottom:20px;stroke-width:1.3}
.choices strong{font-size:24px;margin-bottom:8px}
.choices small{font-size:14px;line-height:1.5;opacity:1}
.notice{background:#fff8e3;border-left-color:var(--haul-yellow)}
.notice.error{background:#fff1ec;border-left-color:#b84a32;color:#923629}
.badge{background:#edf1f3;color:var(--haul-ink)}
.invitation-ready{background:#fffdf5;border-color:#e1ca80}
.owner-driver{background:#172126;color:#fff;border-color:#172126}
.owner-driver h2,.owner-driver p{color:#fff}
.owner-driver button{background:var(--haul-yellow);border-color:var(--haul-yellow);color:var(--haul-ink)}
.owner-driver button .haul-icon{width:25px;height:25px}
.camera-box{background:#f5f7f8;border-color:#aab6bd}
.camera{background:var(--haul-yellow);color:var(--haul-ink)}
.signature{border-color:#aab6bd}
#bottom{border-color:var(--line);box-shadow:0 -4px 20px #17212608}
#bottom button{flex-direction:column;gap:4px;color:#526068;min-height:58px;padding:8px 12px}
#bottom button.active{background:#fff3ca;color:var(--haul-ink)}
#status:not(:empty){background:var(--haul-ink)}
@media(max-width:650px){h1{font-size:30px}.topbar{padding:14px 16px}.topbar .brand{font-size:28px}.choices{gap:12px}.choices button{padding:20px 16px;min-height:202px}.choices strong{font-size:21px}.choices .haul-icon{width:44px;height:44px;margin-bottom:16px}.switches button{flex-grow:1;font-size:13px;padding-inline:12px}#bottom button{font-size:12px;padding-inline:8px}#status{bottom:100px}}

/* Customer overview: equal service choices, one clear orders section. */
.customer-overview{max-width:1200px}
.customer-heading{align-items:center;margin-bottom:28px}
.customer-heading h1{margin-bottom:12px}
.customer-heading .lead{font-size:18px;font-weight:400;line-height:1.5}
.service-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0 0 40px}
.service-choices button{position:relative;min-width:0;min-height:232px;padding:28px;background:var(--haul-ink);border:1px solid var(--haul-ink);border-radius:18px;color:#fff;box-shadow:0 4px 12px #1721260a;transition:background .15s,border-color .15s}
.service-choices button:hover{background:#223139;border-color:#526068}
.service-choices button:active{background:#2c3d46}
.service-choices button:focus-visible{outline-color:#1d70be;outline-offset:4px}
.service-choices .service-symbol{display:block;color:var(--haul-yellow);margin-bottom:24px}
.service-choices .service-symbol .haul-icon{width:48px;height:48px;margin:0;stroke-width:1.5}
.service-choices strong{font-size:26px;line-height:1.25;font-weight:700;letter-spacing:-.4px;margin-bottom:8px}
.service-choices small{display:block;color:#dbe2e5;font-size:16px;font-weight:400;line-height:1.5}
.service-choices .service-arrow{position:absolute;right:28px;top:32px;display:grid;place-items:center;width:36px;height:36px;color:var(--haul-yellow);border:1px solid #ffffff29;border-radius:50%}
.service-choices .service-arrow .haul-icon{width:20px;height:20px;margin:0;stroke-width:1.8}
.customer-orders .orders-heading{align-items:center;margin-bottom:16px}
.customer-orders h2{margin:0;font-size:24px;font-weight:700}
.orders-heading button{font-size:14px;font-weight:600;padding:8px 16px;min-height:44px;background:transparent}
.customer-orders .orders-empty{display:flex;align-items:center;gap:20px;min-height:170px;padding:32px;margin-bottom:0;box-shadow:none}
.empty-symbol{display:grid;place-items:center;flex:0 0 56px;height:56px;border-radius:14px;background:#f2f5f6;color:#667780}
.empty-symbol .haul-icon{width:28px;height:28px}
.orders-empty h3{font-size:20px;font-weight:600;margin-bottom:6px}
.orders-empty p{font-size:16px;color:#526068;margin:0;line-height:1.5}
.orders-list{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff}
.orders-list .job{padding:24px}
.orders-list .job:last-child{border-bottom:0}
.orders-list .job:hover{background:#f8fafb}
.customer-orders .orders-sync{font-size:14px;font-weight:400;line-height:1.5;margin:16px 0 0}
.customer-orders>button{margin-top:16px}
@media(min-width:651px){
 .topbar{padding-inline:max(24px,calc((100% - 1136px)/2))}
 #bottom{position:sticky;top:0;bottom:auto;justify-content:flex-start;gap:12px;padding:10px max(24px,calc((100% - 1136px)/2));border-top:0;border-bottom:1px solid var(--line);box-shadow:none}
 #bottom button{flex:0 1 auto;flex-direction:row;gap:9px;min-height:44px;max-width:none;padding:10px 18px;font-size:15px;font-weight:600;white-space:nowrap}
 #bottom button.active{background:var(--haul-ink);color:#fff}
 #bottom button.active .haul-icon{color:var(--haul-yellow)}
 #bottom button:hover:not(.active){background:#f2f5f6}
 main{padding-bottom:64px}
 .customer-overview{padding:40px 32px 64px}
 #status{bottom:24px}
}
@media(max-width:650px){
 .customer-heading{margin-bottom:24px}
 .customer-heading .lead{font-size:16px}
 .service-choices{gap:16px;margin-bottom:32px}
 .service-choices button{padding:22px;min-height:218px}
 .service-choices strong{font-size:22px}
 .service-choices small{font-size:15px}
 .service-choices .service-arrow{top:24px;right:20px}
 .customer-orders h2{font-size:22px}
 .customer-orders .orders-empty{padding:24px 20px;gap:16px;min-height:156px}
 .orders-list .job{padding:20px 16px}
 .orders-empty h3{font-size:19px}
 .empty-symbol{flex-basis:48px;height:48px}
}
@media(min-width:651px) and (max-width:900px){
 #bottom{gap:6px}
 #bottom button{padding:10px;font-size:14px;gap:7px}
 #bottom .haul-icon{width:20px;height:20px}
}
@media(max-width:540px){
 .service-choices{grid-template-columns:1fr}
 .service-choices button{display:grid;grid-template-columns:42px minmax(0,1fr) 22px;grid-template-rows:auto auto;column-gap:16px;row-gap:5px;align-content:center;min-height:132px;padding:22px 20px}
 .service-choices .service-symbol{grid-column:1;grid-row:1/3;align-self:center;margin:0}
 .service-choices .service-symbol .haul-icon{width:42px;height:42px}
 .service-choices strong{grid-column:2;grid-row:1;margin:0;font-size:21px}
 .service-choices small{grid-column:2;grid-row:2}
 .service-choices .service-arrow{position:static;grid-column:3;grid-row:1/3;align-self:center;width:22px;height:22px;border:0}
 .customer-orders .orders-empty{align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){.service-choices button{transition:none}}
.request-draft-notice{max-width:1136px;margin:0 auto 24px;border-radius:10px}
.request-draft-notice p{margin-bottom:10px;line-height:1.5}
.request-draft-actions{display:flex;flex-wrap:wrap;gap:10px}
.request-draft-actions button{font-size:14px;min-height:44px;background:#fff}
.request-save-note{line-height:1.5}
.request-confirmation{border-left:4px solid var(--haul-yellow);margin-top:24px}
.request-confirmation p:last-child{margin-bottom:0;color:#526068}
