/* ===== Store V1 (RTL) ===== */
.store-v1 { --line:#1b2740; --panel:#0f1422; --panel2:#0b0f1a; --ink:#eaf2ff; --muted:#a8b5c9; --grad1:#00d1ff; --grad2:#ff00aa; }

.store-main { padding-bottom: 40px; }

/* Toolbar */
.store-toolbar { position: sticky; top: 70px; z-index: 5; border-bottom:1px solid var(--line);
  background: linear-gradient(180deg, #0d1220cc, #0b0f1acc); backdrop-filter: blur(8px); }
.store-toolbar .bar{ display:flex; gap:12px; align-items:center; justify-content:space-between; padding:12px 0; }
.tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.tab-btn{ padding:10px 14px; border-radius:999px; border:1px solid var(--line); background:#10182b; color:#cfe6ff; cursor:pointer; }
.tab-btn.active{ background:linear-gradient(90deg,var(--grad1),var(--grad2)); color:#00111c; border-color:transparent; }
.tools{ display:flex; gap:10px; align-items:center; }
.search{ padding:10px 12px; border-radius:12px; border:1px solid var(--line); background:#0e1424; color:var(--ink); min-width:220px; }
.select{ padding:10px 12px; border-radius:12px; border:1px solid var(--line); background:#0e1424; color:var(--ink); }

/* Grid */
.store-grid{ padding:18px 0; }
.grid{ display:grid; gap:14px; grid-template-columns:repeat(4,1fr); }
.card{ background:linear-gradient(180deg,#0e1122,#0b0f1a); border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 18px 70px #0008; }
.card .media{ aspect-ratio:16/9; background:#0a0f1c; display:block; }
.card .media img{ width:100%; height:100%; object-fit:cover; display:block; }
.badges{ position:absolute; inset:10px auto auto 10px; display:flex; gap:6px; }
.badge{ padding:6px 10px; border-radius:999px; background:#0f1d36; border:1px solid #25466b; color:#cfe6ff; font-size:12px; }
.card .body{ padding:12px; display:grid; gap:8px; }
.card h4{ margin:0; }
.card .price{ font-weight:900; }
.card .desc{ color:var(--muted); font-size:13px; min-height:36px; }
.card .row{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.card .actions{ display:flex; gap:8px; }
.card .btn{ padding:10px 12px; border-radius:12px; text-decoration:none; }
.card .btn.primary{ background:linear-gradient(90deg,var(--grad1),var(--grad2)); color:#06121e; }
.card .btn.ghost{ border:1px solid var(--line); color:var(--ink); background:transparent; }

.empty{ text-align:center; color:var(--muted); padding:28px 0; }

/* Dialog */
.product-dialog{ border:none; border-radius:16px; padding:0; background:transparent; }
.product-dialog::backdrop{ background:#0008; }
.dialog-card{ background:linear-gradient(180deg,#0e1122,#0b0f1a); color:var(--ink); border:1px solid var(--line); border-radius:16px; width:min(960px,95vw); }
.dialog-close{ position:absolute; inset:10px 10px auto auto; border:1px solid var(--line); background:#0f1628; color:var(--ink); border-radius:10px; padding:6px 10px; cursor:pointer; }
.dialog-body{ display:grid; grid-template-columns:1fr 1.1fr; gap:14px; padding:16px; }
.dialog-body .media{ background:#0a0f1c; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.dialog-body .media img{ width:100%; height:100%; object-fit:cover; }
.dialog-body .info .price{ font-size:28px; font-weight:900; margin:6px 0; }
.dialog-body .desc{ color:var(--muted); }
.dialog-body .actions{ display:flex; gap:10px; margin-top:10px; }
.dialog-body .btn{ padding:12px 14px; border-radius:12px; }
.dialog-body .btn.btn-primary{ background:linear-gradient(90deg,var(--grad1),var(--grad2)); color:#06121e; }
.dialog-body .btn.btn-ghost{ border:1px solid var(--line); color:var(--ink); background:transparent; }
.small.muted{ color:var(--muted); font-size:12px; }

/* Cart */
.cart-btn{ position:relative; }
.cart-count{ margin-inline-start:6px; background:#10325a; border:1px solid #2c5c8e; padding:2px 6px; border-radius:999px; }
.cart{ position:fixed; inset:70px 0 0 auto; width:min(380px,95vw); background:linear-gradient(180deg,#0e1122,#0b0f1a); color:var(--ink); border-left:1px solid var(--line); box-shadow:-20px 0 80px #0008; transform:translateX(110%); transition:.25s transform; z-index:30; display:flex; flex-direction:column; }
.cart[aria-hidden="false"]{ transform:none; }
.cart-head{ display:flex; align-items:center; justify-content:space-between; padding:12px; border-bottom:1px solid var(--line); }
.cart-body{ padding:12px; display:grid; gap:10px; overflow:auto; }
.item{ display:grid; grid-template-columns:64px 1fr auto; gap:10px; align-items:center; background:#0f1628; border:1px solid var(--line); border-radius:12px; padding:8px; }
.item img{ width:64px; height:48px; object-fit:cover; border-radius:8px; }
.item .title{ font-weight:700; }
.item .muted{ color:var(--muted); font-size:12px; }
.qty{ display:flex; gap:8px; align-items:center; }
.qty button{ width:28px; height:28px; border-radius:8px; border:1px solid var(--line); background:#0b1324; color:var(--ink); cursor:pointer; }
.cart-foot{ border-top:1px solid var(--line); padding:12px; display:grid; gap:10px; }
.cart-foot .row{ display:flex; justify-content:space-between; }

.btn.btn-primary{ background:linear-gradient(90deg,var(--grad1),var(--grad2)); color:#06121e; }

@media (max-width:1100px){
  .grid{ grid-template-columns:repeat(3,1fr); }
  .dialog-body{ grid-template-columns:1fr; }
}
@media (max-width:780px){
  .grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .grid{ grid-template-columns:1fr; }
}