/* AS Drive shop — builds on main.css tokens */
[hidden]{display:none!important}
.shop-main{padding:40px 0 60px;min-height:60vh}
.shop-main h1{font-size:clamp(1.8rem,3.6vw,2.8rem)}
.shop-menu a[href="/shop/"]{color:#fff}
.small{font-size:.85rem}
.crumbs{font-size:.9rem;color:var(--muted);margin-bottom:22px}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--brand)}

.badge{display:inline-flex;align-items:center;gap:.4em;padding:.35em .8em;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.badge.ok{background:rgba(58,255,193,.14);color:var(--brand-2);border:1px solid rgba(58,255,193,.4)}
.badge.warn{background:rgba(255,182,72,.12);color:var(--warn);border:1px solid rgba(255,182,72,.4)}
.badge.info{background:rgba(0,209,255,.12);color:var(--brand);border:1px solid rgba(0,209,255,.4)}
.badge.bad{background:rgba(255,92,122,.12);color:#ff8aa0;border:1px solid rgba(255,92,122,.4)}

/* catalog */
.shop-group{padding:34px 0 0}
.shop-group h2{margin-bottom:.2em}
.shop-group>p{margin-bottom:20px}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.shop-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));color:var(--ink);transition:transform .15s ease,border-color .2s ease}
.shop-card:hover{transform:translateY(-3px);border-color:rgba(0,209,255,.4);color:var(--ink)}
.shop-card-img{position:relative;aspect-ratio:4/3;background:#e9eaec}
.shop-card-img img{width:100%;height:100%;object-fit:cover}
.shop-card-img .badge{position:absolute;left:12px;top:12px;background-color:rgba(3,19,31,.82);backdrop-filter:blur(6px)}
.shop-card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.shop-card-body h3{margin:0;font-size:1.1rem}
.shop-card-body p{margin:0;color:#b9cddd;font-size:.92rem}
.shop-card-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:12px}
.shop-card-foot .btn{padding:.6em 1em;font-size:.92rem}
.price{font-size:1.3rem;font-weight:800}
.no-photo{width:100%;height:100%;display:grid;place-items:center;color:#5d7386;background:var(--bg-3);font-size:.9rem}
.shop-empty{border:1px dashed rgba(255,255,255,.16);border-radius:var(--radius);padding:26px;color:var(--muted);text-align:center}

/* product */
.pgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:start}
@media (max-width:860px){.pgrid{grid-template-columns:1fr;gap:22px}}
.pgal{border-radius:22px;overflow:hidden;background:#08202f;box-shadow:var(--shadow)}
.pgal-main{aspect-ratio:4/3;background:#e9eaec}
.pgal-main img{width:100%;height:100%;object-fit:contain;transition:opacity .2s ease}
.pgal-thumbs{display:flex;gap:6px;padding:8px;overflow-x:auto}
.pgal-thumb{flex:0 0 92px;aspect-ratio:1.3/1;border:2px solid transparent;border-radius:10px;overflow:hidden;padding:0;background:#e9eaec;cursor:pointer;opacity:.7}
.pgal-thumb img{width:100%;height:100%;object-fit:cover}
.pgal-thumb.active,.pgal-thumb:hover{opacity:1;border-color:var(--brand)}
.pinfo h1{margin:.45em 0 .2em}
.psub{color:#cfe1f0;font-size:1.05rem}
.pprice{font-size:2.2rem;font-weight:900;margin:.3em 0 .2em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;width:fit-content}
.pnote{color:var(--muted)}
.ptrust{margin:16px 0 0;font-size:.88rem;color:var(--muted)}
.pactions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.pactions .btn{white-space:normal}
.buy-form{flex-basis:100%;margin-top:6px;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.03)}
.buy-form h3{margin:0 0 4px}
.buy-form .qty{display:grid;gap:4px;font-size:.9rem;color:var(--muted);max-width:160px}
.pdesc{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;margin-top:46px}
@media (max-width:860px){.pdesc{grid-template-columns:1fr;gap:10px}}
.pdesc h2{font-size:1.4rem}
.pdesc ul{margin:0 0 1em;padding-left:1.2em;color:#d3e3f0}
.pdesc li{margin:.3em 0}
.specs{width:100%;border-collapse:collapse;font-size:.95rem}
.specs th,.specs td{text-align:left;padding:10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.specs th{color:var(--muted);font-weight:500;width:38%;padding-right:14px}

/* messages / order status */
.shop-msg{max-width:620px;margin:40px auto;text-align:center;display:grid;gap:12px;justify-items:center}
.shop-msg h1{margin:.2em 0 0}
.mock-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}

/* admin */
body.admin .shop-main{padding-top:26px}
.admin-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.admin-head>div{display:flex;gap:10px;align-items:center}
.admin-head h1{margin:0;font-size:1.8rem}
.admin-login{max-width:380px;margin:60px auto}
.admin-form{max-width:820px}
.admin-form label,.arow label{display:grid;gap:5px;font-size:.85rem;color:var(--muted)}
.admin-form input[type=file]{padding:10px}
.arows,.orows{display:grid;gap:10px;margin-top:16px}
.arow{display:grid;grid-template-columns:minmax(220px,1.6fr) 1fr .7fr .9fr .6fr auto;gap:12px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.arow.is-hidden{opacity:.6}
.arow input,.arow select,.orow input{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);font:inherit}
.arow select option{color:#02131f}
.arow-title{display:flex;gap:12px;align-items:center;align-self:center}
.arow-title img,.arow-title .no-photo{width:64px;height:48px;object-fit:cover;border-radius:8px;flex:none;font-size:.6rem}
.arow-title div{display:grid}
.arow-actions{display:flex;gap:8px}
.arow-actions .btn,.orow .btn,.admin-head .btn{padding:.65em 1em;font-size:.9rem}
@media (max-width:980px){.arow{grid-template-columns:1fr 1fr}.arow-title,.arow-actions{grid-column:1/-1}}
.orow{display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap;padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.orow .ship{display:flex;gap:8px}