/* PEGA — Echipamente (shop) — echipamente/produs/cos/cerere. Mobile-first, on top of pega.css. */

/* ---- Breadcrumb ---- */
.crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:.86rem; color:var(--text-soft); margin-bottom:20px; }
.crumbs a{ color:var(--text-soft); font-weight:600; }
.crumbs a:hover{ color:var(--brand); }
.crumbs .sep{ color:var(--text-mute); }

/* ---- Toolbar (filters + search) ---- */
.shop-toolbar{ display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; margin-bottom:32px; }
.pill-row{ display:flex; flex-wrap:wrap; gap:8px; min-width:0; }
.pill{
  display:inline-flex; align-items:center; white-space:nowrap;
  padding:9px 16px; border-radius:var(--r-pill); border:1.5px solid var(--line);
  font-weight:700; font-size:.86rem; color:var(--text-soft); background:#fff;
  transition:background .15s, color .15s, border-color .15s;
}
.pill:hover{ border-color:var(--brand); color:var(--brand); }
.pill.active{ background:var(--brand); border-color:var(--brand); color:#fff; }
.shop-search{ display:flex; gap:8px; flex:0 1 340px; min-width:220px; }
.shop-search .input{ flex:1 1 auto; min-width:0; }
.shop-search button{ flex:0 0 auto; }
@media(max-width:640px){
  .shop-toolbar{ flex-direction:column; align-items:stretch; }
  .shop-search{ flex-basis:auto; min-width:0; }
}

.shop-empty{ padding:60px 20px; }

/* ---- Product grid ---- */
.shop-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media(max-width:980px){ .shop-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px){ .shop-grid{ grid-template-columns:1fr; } }

/* ---- Placeholder tile (shared: listing + detail + cart) ---- */
.ph-tile{
  position:relative; aspect-ratio:4/3; overflow:hidden;
  border-radius:var(--r-lg); border:1px solid var(--line-2);
  background:linear-gradient(160deg,var(--brand-050) 0%,#eef4ff 55%,#ffffff 130%);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
}
.ph-tile::before{
  content:""; position:absolute; inset:-20%; z-index:0;
  background:radial-gradient(circle at 28% 24%, rgba(37,80,235,.12), rgba(37,80,235,0) 62%);
}
.ph-tile .ph-ic{
  position:relative; z-index:1; width:56px; height:56px; border-radius:16px;
  background:var(--grad); color:#fff; display:grid; place-items:center;
  box-shadow:0 10px 24px rgba(37,80,235,.25);
}
.ph-tile .ph-ic svg{ width:28px; height:28px; }
.ph-tile .ph-brand{ position:relative; z-index:1; font-size:.76rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--text-soft); }
.ph-tile.lg{ aspect-ratio:1/1; max-width:460px; }
.ph-tile.lg .ph-ic{ width:88px; height:88px; border-radius:22px; }
.ph-tile.lg .ph-ic svg{ width:42px; height:42px; }
.ph-tile.lg .ph-brand{ font-size:.86rem; }
.ph-tile.sm{ width:100%; height:100%; aspect-ratio:auto; border-radius:var(--r-sm); gap:0; }
.ph-tile.sm .ph-ic{ width:28px; height:28px; border-radius:8px; box-shadow:none; }
.ph-tile.sm .ph-ic svg{ width:15px; height:15px; }
.ph-tile.sm .ph-brand{ display:none; }

/* ---- Product card ---- */
.pcard{ display:flex; flex-direction:column; }
.pcard-media{ position:relative; margin-bottom:16px; }
.pcard-badge{ position:absolute; top:12px; left:12px; z-index:2; }
.pcard-body{ display:flex; flex-direction:column; gap:2px; flex:1 1 auto; }
.pcard-cat{ font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.pcard-name{ font-size:1.04rem; margin:3px 0 0; }
.pcard-brand{ font-size:.86rem; margin-bottom:4px; }
.pcard-price{ display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; margin:8px 0 6px; }
.pcard-price .old{ text-decoration:line-through; color:var(--text-mute); font-size:.88rem; }
.pcard-price .now{ font-size:1.22rem; font-weight:800; color:var(--ink); }
.pcard-price .now.discount{ color:var(--danger); }
.pcard-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:auto; padding-top:12px; }
.pcard-actions .btn{ flex:1 1 130px; }

/* ---- Stock hint (card + detail) ---- */
.stock-hint{ display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:.82rem; margin-bottom:10px; }
.stock-hint::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.stock-hint.ok{ color:var(--ok); }
.stock-hint.low{ color:var(--warn); }
.stock-hint.out{ color:var(--danger); }
.stock-hint.pdp-stock{ font-size:.9rem; margin-bottom:16px; }

/* ---- Floating cart button ---- */
.cart-float{
  position:fixed; right:24px; bottom:24px; z-index:900;
  width:56px; height:56px; border-radius:50%; background:var(--brand); color:#fff;
  display:grid; place-items:center; box-shadow:var(--sh-lg);
  transition:transform .15s, background .15s;
}
.cart-float:hover{ transform:translateY(-2px); background:var(--brand-600); }
.cart-float svg{ width:24px; height:24px; }
.cart-float .cart-float-badge{
  position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px;
  background:var(--danger); color:#fff; font-size:.7rem; font-weight:800;
  border-radius:999px; display:grid; place-items:center; border:2px solid #fff;
}
@media(max-width:640px){ .cart-float{ right:16px; bottom:16px; width:50px; height:50px; } }

/* ---- Product detail (PDP) ---- */
.pdp-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:44px; align-items:start; }
@media(max-width:900px){ .pdp-grid{ grid-template-columns:1fr; gap:28px; } }
.pdp-sku{ font-size:.86rem; color:var(--text-mute); margin:8px 0 4px; }
.pdp-price{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin:10px 0 12px; }
.pdp-price .old{ text-decoration:line-through; color:var(--text-mute); font-size:1.1rem; }
.pdp-price .now{ font-size:1.9rem; font-weight:800; color:var(--ink); }
.pdp-price .now.discount{ color:var(--danger); }
.pdp-buy{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:22px 0; }
.pdp-buy .qty-input{ max-width:100px; flex:0 0 auto; text-align:center; }
.pdp-buy .btn{ flex:1 1 170px; }

.spec-list{ display:flex; flex-direction:column; gap:10px; }
.spec-list li{ display:flex; gap:10px; align-items:flex-start; color:var(--ink-2); font-size:.95rem; }
.spec-list li .ck{ width:20px; height:20px; flex:0 0 auto; margin-top:1px; border-radius:50%; background:var(--brand-050); color:var(--brand); display:grid; place-items:center; }
.spec-list li .ck svg{ width:11px; height:11px; }

.related-products{ padding-top:8px; }

/* ---- Cart (cos.php) ---- */
.cart-table{ border-top:1px solid var(--line); }
.cart-row{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; padding:18px 0; border-bottom:1px solid var(--line); position:relative; }
.cart-row .ci-media{ width:56px; height:56px; flex:0 0 auto; }
.cart-row .ci-info{ flex:1 1 180px; min-width:0; }
.cart-row .ci-info b{ display:block; color:var(--ink); font-weight:700; font-size:.98rem; }
.cart-row .ci-info .sku{ display:block; font-size:.8rem; margin-top:2px; }
.cart-row .ci-qty{ display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; }
.cart-row .qty-btn{ width:30px; height:30px; border:1px solid var(--line); border-radius:8px; background:#fff; font-weight:800; color:var(--ink); display:grid; place-items:center; }
.cart-row .qty-btn:hover{ border-color:var(--brand); color:var(--brand); }
.cart-row .qty-num{ width:46px; height:30px; text-align:center; border:1px solid var(--line); border-radius:8px; font:inherit; font-weight:700; padding:0; }
.cart-row .ci-price, .cart-row .ci-total{ flex:0 0 auto; min-width:88px; text-align:right; font-weight:700; color:var(--ink); font-size:.94rem; }
.cart-row .ci-total{ font-weight:800; }
.cart-row .ci-label{ display:none; }
.cart-row .ci-remove{ flex:0 0 auto; width:36px; height:36px; border-radius:8px; border:1px solid var(--line); background:#fff; display:grid; place-items:center; color:var(--text-soft); }
.cart-row .ci-remove:hover{ color:var(--danger); border-color:var(--danger); background:#fef2f2; }
.cart-row .ci-remove svg{ width:16px; height:16px; }

@media(max-width:640px){
  .cart-row{ padding-right:48px; }
  .cart-row .ci-media{ width:48px; height:48px; }
  .cart-row .ci-qty{ order:3; }
  .cart-row .ci-price{ order:4; min-width:0; text-align:left; }
  .cart-row .ci-total{ order:5; min-width:0; text-align:left; }
  .cart-row .ci-label{ display:inline; color:var(--text-mute); font-weight:600; margin-right:4px; }
  .cart-row .ci-remove{ position:absolute; top:16px; right:0; }
}

.cart-summary{ margin-top:24px; padding-top:20px; border-top:2px solid var(--line); }
.cart-subtotal{ display:flex; justify-content:space-between; align-items:baseline; font-size:1.1rem; margin-bottom:20px; }
.cart-subtotal b{ font-size:1.4rem; color:var(--ink); }
.cart-actions{ display:flex; flex-wrap:wrap; gap:14px; justify-content:flex-end; }
.cart-actions .btn{ flex:1 1 200px; }
.cart-empty{ text-align:center; padding:60px 20px; }

/* ---- Cerere ofertă (checkout, no payment) ---- */
.form-errors{ background:#fef2f2; border:1px solid #fecaca; color:#b91c1c; padding:14px 16px; border-radius:var(--r-sm); margin-bottom:20px; font-size:.9rem; }
.form-errors ul{ list-style:disc; padding-left:20px; margin-top:6px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:640px){ .field-row{ grid-template-columns:1fr; } }

.cerere-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:40px; align-items:start; }
@media(max-width:900px){ .cerere-grid{ grid-template-columns:1fr; gap:28px; } }
.cerere-summary{ background:var(--surf-1); border:1px solid var(--line); border-radius:var(--r-lg); padding:24px; }
@media(min-width:901px){ .cerere-summary{ position:sticky; top:calc(var(--nav-h) + 20px); } }
.cs-title{ font-size:1rem; margin-bottom:14px; }
.cs-list{ display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.cs-list li{ display:flex; justify-content:space-between; gap:12px; font-size:.92rem; color:var(--ink-2); }
.cs-list .cs-name{ min-width:0; display:flex; flex-wrap:wrap; gap:6px; }
.cs-list .cs-qty{ color:var(--text-soft); }
.cs-list .cs-price{ font-weight:700; color:var(--ink); white-space:nowrap; }
.cs-empty{ font-size:.9rem; }
.cs-total{ display:flex; justify-content:space-between; padding-top:14px; border-top:1px solid var(--line); font-weight:800; color:var(--ink); }
.cerere-empty{ text-align:center; padding:60px 20px; }

.panel-success{ text-align:center; max-width:560px; margin:0 auto; padding:60px 20px; }
.panel-success .ic{ width:64px; height:64px; border-radius:50%; background:var(--grad); color:#fff; display:grid; place-items:center; margin:0 auto 20px; }
.panel-success .ic svg{ width:30px; height:30px; }

/* ---- Toast feedback (data-add) ---- */
.pega-toast{
  position:fixed; left:50%; bottom:28px; z-index:1200; max-width:calc(100vw - 32px);
  transform:translate(-50%,12px); opacity:0; text-align:center;
  background:var(--ink); color:#fff; font-size:.9rem; font-weight:700;
  padding:12px 20px; border-radius:var(--r-pill); box-shadow:var(--sh-lg);
  transition:opacity .22s ease, transform .22s ease;
}
.pega-toast.show{ opacity:1; transform:translate(-50%,0); }
