/* ==========================================================================
   RushBuy — app styles (store, cart, checkout, tracking, staff/admin/driver tools)
   Loaded after site.css on the pages that need it.
   ========================================================================== */

/* ---------- Store ---------- */
.store-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:36px}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 18px;background:var(--white);color:var(--navy);border:var(--bw) solid var(--navy);box-shadow:3px 3px 0 0 var(--navy);font:800 .85rem var(--display);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:transform .15s ease-out,box-shadow .15s,background .15s}
.chip:hover{background:var(--peach-soft)}
.chip:active{transform:translate(3px,3px);box-shadow:none}
.chip[aria-pressed="true"]{background:var(--navy);color:var(--cream)}
.chip i{width:10px;height:10px;background:var(--orange);display:block}
.chip:nth-child(3n+2) i{border-radius:50%;background:var(--peach)}
.chip:nth-child(3n+3) i{clip-path:polygon(50% 0,0 100%,100% 100%);background:var(--cream)}
.product-grid{display:grid;gap:30px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.product-card{position:relative;display:flex;flex-direction:column;background:var(--white);border:var(--bw) solid var(--navy);box-shadow:var(--sh-lg);transition:transform .2s ease-out}
.product-card:hover{transform:translateY(-6px)}
.product-photo{position:relative;aspect-ratio:1;background:var(--grey);border-bottom:var(--bw) solid var(--navy);overflow:hidden;display:grid;place-items:center}
.product-photo img{width:100%;height:100%;object-fit:cover}
.product-photo .ph{width:46%;aspect-ratio:1;background:var(--peach);border:var(--bw) solid var(--navy)}
.product-card:nth-child(3n+2) .product-photo .ph{border-radius:50%;background:var(--orange)}
.product-card:nth-child(3n+3) .product-photo .ph{border:0;background:var(--navy);clip-path:polygon(50% 0,0 100%,100% 100%)}
.price-tag{position:absolute;right:12px;bottom:12px;background:var(--orange);color:var(--navy);border:var(--bw) solid var(--navy);box-shadow:3px 3px 0 0 var(--navy);font:900 1.15rem/1 var(--display);padding:9px 12px}
.sold-out{position:absolute;left:0;top:14px;background:var(--navy);color:var(--cream);font:800 .8rem var(--display);letter-spacing:.14em;text-transform:uppercase;padding:6px 14px}
.product-body{display:flex;flex-direction:column;gap:10px;padding:20px;flex:1}
.product-body .cat{font:800 .72rem var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--orange-ink)}
.product-body h3{font-size:1.4rem;margin:0}
.product-body p{margin:0;font-size:.95rem;line-height:1.5;flex:1}
.empty-state{border:var(--bw) dashed var(--navy);padding:44px 24px;text-align:center;background:var(--white)}
.empty-state h3{margin-bottom:8px}

/* custom order explainer + form */
.custom-grid{display:grid;gap:40px;grid-template-columns:1fr}
@media(min-width:960px){.custom-grid{grid-template-columns:.8fr 1.2fr;gap:56px}}
.mini-steps{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:18px}
.mini-steps li{display:flex;gap:16px;align-items:flex-start;font-weight:500}
.mini-steps b{flex:0 0 40px;height:40px;display:grid;place-items:center;background:var(--orange);color:var(--navy);border:var(--bw) solid var(--navy);font:900 1.1rem var(--display)}
.mini-steps li:nth-child(2) b{border-radius:50%;background:var(--peach)}
.mini-steps li:nth-child(3) b{background:var(--navy);color:var(--cream)}
.mini-steps li:nth-child(4) b{border-radius:50%;background:var(--sage)}
.panel{background:var(--white);border:var(--bw) solid var(--navy);box-shadow:var(--sh-lg);padding:24px;margin-top:8px}
@media(min-width:640px){.panel{padding:30px}}
.panel+.panel{margin-top:32px}
.panel h2{margin:0 0 18px;font-size:clamp(1.5rem,3vw,2rem)}
.panel-dark{background:var(--navy);color:var(--cream)}
.panel-dark h2,.panel-dark h3{color:var(--cream)}
.panel-dark p,.panel-dark .muted-note{color:#D9DEE9}
.phone-row{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:6px}
@media(min-width:480px){.phone-row{grid-template-columns:190px 1fr}}

/* ---------- Checkout ---------- */
.checkout-grid{display:grid;gap:36px;grid-template-columns:1fr}
@media(min-width:980px){.checkout-grid{grid-template-columns:1.25fr .75fr;gap:48px;align-items:start}.summary{position:sticky;top:calc(var(--header-h) + 24px)}}
.pay-options{display:grid;gap:16px;border:0;padding:0;margin:0 0 8px}
.pay-options legend{font:800 .82rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-bottom:12px;padding:0}
.pay-option{position:relative;display:block;cursor:pointer}
.pay-option input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0}
.pay-face{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:center;background:var(--white);border:var(--bw) solid var(--navy);box-shadow:var(--sh-hard);padding:16px 18px;transition:transform .15s ease-out,box-shadow .15s,background .15s}
.pay-face .pay-shape{flex:none;width:48px;height:48px}
.pay-face strong{display:block;font:900 1.25rem/1.05 var(--display);text-transform:uppercase;color:var(--navy)}
.pay-face span.d{display:block;font-size:.92rem;color:var(--slate);margin-top:3px;line-height:1.4}
.pay-option:hover .pay-face{background:var(--peach-soft)}
.pay-option input:checked+.pay-face{background:var(--orange);transform:translate(var(--sh),var(--sh));box-shadow:none}
.pay-option input:checked+.pay-face span.d{color:var(--navy)}
.pay-option input:focus-visible+.pay-face{outline:3px solid var(--navy);outline-offset:3px}
.pay-extra{margin-top:14px}
.summary h2{font-size:1.7rem}
.sum-line{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:2px solid var(--navy);font-weight:500}
.sum-line b{font-family:var(--display);color:var(--navy);white-space:nowrap}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:16px;font:900 1.7rem var(--display);text-transform:uppercase;color:var(--navy)}
.done-id{display:inline-block;background:var(--navy);color:var(--cream);font:900 clamp(1.8rem,6vw,3rem)/1 var(--display);letter-spacing:.04em;padding:14px 22px;border:var(--bw) solid var(--navy);box-shadow:var(--sh-lg);margin:8px 0 22px;transform:rotate(-1deg)}
.bank-box{background:var(--cream);border:var(--bw) solid var(--navy);padding:18px 20px;margin:18px 0;display:grid;gap:8px}
.bank-box div{display:flex;justify-content:space-between;gap:12px;border-bottom:2px dashed var(--navy);padding-bottom:6px;flex-wrap:wrap}
.bank-box div:last-child{border:0;padding:0}
.bank-box span{font:800 .78rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--slate)}
.bank-box b{font:800 1.05rem var(--display);color:var(--navy);word-break:break-all}

/* ---------- Tracking, status pills ---------- */
.inline-form{display:flex;gap:14px;flex-wrap:wrap}
.inline-form .form-control{flex:1 1 220px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.form-control.plain{text-transform:none;letter-spacing:normal;font-weight:500}
.order-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.order-id{font:900 clamp(1.7rem,4vw,2.4rem)/1 var(--display);color:var(--navy);margin:0;letter-spacing:.02em}
.status-pill{display:inline-block;padding:6px 14px;border-radius:999px;background:var(--peach);color:var(--navy);border:2px solid var(--navy);font:800 .78rem var(--display);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.status-pill.done{background:var(--sage)}
.status-pill.pending{background:var(--peach-soft)}
.status-pill.rejected,.status-pill.bad{background:#FFD9D4}
.status-pill.info{background:var(--grey)}
.status-pill.warn{background:#FFE08A}
.detail-grid{display:grid;gap:16px;margin:22px 0 8px}
@media(min-width:600px){.detail-grid{grid-template-columns:1fr 1fr}}
.detail-grid.single{grid-template-columns:1fr}
.detail-grid dt{font:800 .75rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--slate);margin:0 0 2px}
.detail-grid dd{margin:0;font-weight:700;color:var(--navy)}
.timeline{list-style:none;margin:28px 0 0;padding:0}
.timeline li{position:relative;padding:0 0 26px 52px;color:var(--slate);font:800 1.1rem var(--display);text-transform:uppercase;letter-spacing:.04em}
.timeline li::before{content:"";position:absolute;left:13px;top:30px;bottom:-4px;width:var(--bw);min-width:3px;background:var(--navy);opacity:.25}
.timeline li:last-child{padding-bottom:0}
.timeline li:last-child::before{display:none}
.timeline li::after{content:"";position:absolute;left:0;top:0;width:30px;height:30px;background:var(--white);border:var(--bw) solid var(--navy)}
.timeline li:nth-child(2n)::after{border-radius:50%}
.timeline li.done{color:var(--navy)}
.timeline li.done::before{background:var(--orange);opacity:1}
.timeline li.done::after{background:var(--orange)}
.timeline li.current::after{background:var(--navy);box-shadow:4px 4px 0 0 var(--orange)}
.timeline .when{display:block;font:500 .85rem var(--body);letter-spacing:0;text-transform:none;color:var(--slate)}

/* ---------- Consoles: staff / admin / driver ---------- */
.console{display:grid;gap:28px;grid-template-columns:1fr}
@media(min-width:960px){.console{grid-template-columns:240px 1fr;gap:40px;align-items:start}.console-nav{position:sticky;top:calc(var(--header-h) + 24px)}}
.console-nav{display:flex;gap:10px;overflow-x:auto;padding:4px 4px 10px;margin:0 -4px}
@media(min-width:960px){.console-nav{flex-direction:column;overflow:visible;padding:0;margin:0}}
.console-nav button{display:flex;align-items:center;gap:12px;text-align:left;white-space:nowrap;background:var(--white);color:var(--navy);border:var(--bw) solid var(--navy);box-shadow:3px 3px 0 0 var(--navy);padding:12px 16px;font:800 .95rem var(--display);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}
.console-nav button i{flex:0 0 14px;height:14px;background:var(--orange);display:block}
.console-nav button:nth-child(3n+2) i{border-radius:50%;background:var(--peach)}
.console-nav button:nth-child(3n+3) i{clip-path:polygon(50% 0,0 100%,100% 100%);background:var(--navy)}
.console-nav button:hover{background:var(--peach-soft)}
.console-nav button.active{background:var(--navy);color:var(--cream);transform:translate(3px,3px);box-shadow:none}
.console-nav button.active i{background:var(--orange)}
.console-nav .badge{margin-left:auto;min-width:24px;height:24px;border-radius:999px;background:var(--orange);color:var(--navy);border:2px solid var(--navy);font:900 .75rem/20px var(--display);text-align:center;padding:0 6px}
.console-nav .badge[hidden]{display:none}
.console-main{min-width:0}
.tabbar{display:flex;gap:10px;margin-bottom:24px;overflow-x:auto;padding:2px 4px 8px;margin-left:-4px}
.tabbar button{white-space:nowrap;background:var(--white);color:var(--navy);border:var(--bw) solid var(--navy);box-shadow:3px 3px 0 0 var(--navy);padding:10px 16px;font:800 .88rem var(--display);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}
.tabbar button:hover{background:var(--peach-soft)}
.tabbar button.active{background:var(--orange);transform:translate(3px,3px);box-shadow:none}
.subtab{display:none}
.subtab.active{display:block}
.who-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--navy);color:var(--cream);padding:14px 20px;margin-bottom:28px;border:var(--bw) solid var(--navy);box-shadow:var(--sh-hard)}
.who-bar b{font:900 1.2rem var(--display);text-transform:uppercase}
.who-bar .sub{color:var(--peach);font-size:.9rem}
.signout{background:none;border:0;color:var(--cream);text-decoration:underline;text-underline-offset:4px;cursor:pointer;font:700 .9rem var(--body);padding:6px 4px}
.header-tools .signout{color:var(--navy)}
.search-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.search-row .form-control{flex:1 1 240px}

.rb-orders{display:grid;gap:20px;margin-top:8px}
.rb-order{position:relative;border:var(--bw) solid var(--navy);padding:18px;background:var(--cream);box-shadow:var(--sh-hard)}
.rb-order.is-custom{background:var(--peach-soft)}
.rb-order-top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.rb-order strong{font:900 1.3rem var(--display);color:var(--navy);letter-spacing:.03em}
.rb-order p{margin:6px 0 0;font-size:.95rem;line-height:1.45}
.rb-order .badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.rb-order-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;align-items:stretch}
.rb-order-actions select{flex:1 1 170px;min-height:44px}
.rb-order-actions .form-control{min-height:44px}
.order-extra{margin-top:14px;padding-top:14px;border-top:2px dashed var(--navy);display:grid;gap:10px}
.order-extra[hidden]{display:none}
.link-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.btn-block,.driver-page .btn-block{width:100%}
.action-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.action-row .btn{flex:1 1 140px}
.result-list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.empty-note{padding:26px;border:var(--bw) dashed var(--navy);text-align:center;font-weight:700;background:var(--white)}

.driver-card,.emp-card,.req-card{border:var(--bw) solid var(--navy);padding:16px 18px;background:var(--cream);margin-bottom:18px;box-shadow:var(--sh-hard)}
.driver-card-top,.emp-card-top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}
.driver-card-top{cursor:pointer}
.driver-card-top strong,.emp-card strong,.req-card strong{font:900 1.2rem var(--display);color:var(--navy);text-transform:uppercase}
.driver-badges{display:flex;gap:6px;flex-wrap:wrap}
.driver-detail{margin-top:14px;padding-top:14px;border-top:2px dashed var(--navy);display:none}
.driver-detail.open{display:block}
.doc-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 0;border-bottom:2px solid var(--sand)}
.doc-row:last-child{border-bottom:0}
.doc-row .doc-actions{display:flex;gap:8px;flex-wrap:wrap}
.reject-box{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;width:100%}
.reject-box input{flex:1 1 200px}
.reason-note{color:#7A1710;font-size:.88rem;font-weight:700;margin:6px 0 0}
.req-card .req-meta{font-size:.9rem;color:var(--slate);margin-bottom:8px}
.req-card .change{display:grid;gap:4px;margin:10px 0;padding:12px;background:var(--white);border:2px solid var(--navy)}
.req-card .change s{color:#7A1710}
.req-card .change em{font-style:normal;font-weight:700;color:#1E6B3A}
.field-row{display:flex;gap:10px;flex-wrap:wrap}
.field-row>*{flex:1 1 160px}

/* auth switch, password rules, uploads */
.auth-switch{text-align:center;margin:16px 0 0;font-size:.95rem}
.auth-switch .link,.link{color:var(--orange-ink);font:700 1rem var(--body);text-decoration:underline;text-underline-offset:4px;background:none;border:0;cursor:pointer;padding:0}
.pw-rules{font-size:.85rem;color:var(--slate);margin:8px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:2px 12px}
.pw-rules li::before{content:"";display:inline-block;width:10px;height:10px;border:2px solid var(--navy);margin-right:8px;vertical-align:-1px}
.pw-rules li.ok{color:#1E6B3A;font-weight:700}
.pw-rules li.ok::before{background:var(--orange)}
.upload-row{border:var(--bw) dashed var(--navy);padding:16px;margin-bottom:16px;background:var(--cream)}
.upload-row-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.upload-row input[type=file]{margin-top:12px}
.locked-tag{color:var(--slate);font-size:.88rem;font-weight:700;margin:8px 0 0}
.blocked-banner{background:#FFE08A;border:var(--bw) solid var(--navy);box-shadow:var(--sh-hard);color:var(--navy);padding:16px 18px;margin-bottom:24px;font-weight:700}
.page-pad{padding:44px 0 88px;background:var(--cream)}
@media(max-width:560px){.pw-rules{grid-template-columns:1fr}.order-head .status-pill{align-self:flex-start}}