/* ============================================================================
 * Hotbar v2 Compact — final
 * ========================================================================== */

:root{
  --yg-text:#0f172a; --yg-muted:#475569; --yg-border:#e5e7eb; --yg-card:#fff;
  --yg-primary:#FFB300; --yg-accent:#4B1AB1;
}

.yg-hotbar2{ direction:rtl; color:var(--yg-text); }
.ygh-wrap{ position:relative; }

/* ===== العنوان ===== */
.ygh-head{
  display:flex; align-items:center; justify-content:center;
  margin: 10px 0 14px;
}
.ygh-title{
  font-size: clamp(20px, 2.2vw, 24px);
  font-weight: 800;
  color: var(--yg-text);
  text-align: center;
  line-height: 1.2;
}
.ygh-title::after{
  content:"";
  display:block;
  height:4px; width:96px;
  margin:8px auto 0;
  background: linear-gradient(90deg, var(--yg-accent), var(--yg-primary));
  border-radius:6px;
}

/* ===== الصف ===== */
.ygh-row{
  list-style:none; margin:0; padding:0;
  display:grid; grid-auto-flow:column; grid-auto-columns:max-content;
  gap:10px; overflow-x:auto; overflow-y:clip;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; touch-action:pan-x;
}
.ygh-row::-webkit-scrollbar{ display:none; }
.ygh-row.drag{ cursor:grabbing; }

.ygh-item{ scroll-snap-align:start; }
.ygh-item.is-oos{ opacity:.6; }

/* ===== البطاقة ===== */
.ygh-card{
  width:180px; display:block; text-decoration:none; color:inherit;
  background:var(--yg-card); border:1px solid var(--yg-border); border-radius:12px;
  overflow:hidden; box-shadow:0 2px 6px rgba(0,0,0,.05);
  transition:transform .12s, box-shadow .2s, border-color .2s;
}
@media (max-width:480px){ .ygh-card{ width:160px; } }
.ygh-card:hover{ transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.10); }

/* صورة + معلومات */
.ygh-img{ width:100%; height:120px; object-fit:contain; display:block; background:#fff; }
.ygh-info{ padding:8px 10px 10px; }
.ygh-name{ margin:0 0 6px; font:900 13px/1.35 system-ui; }
.line-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

.ygh-pricebox{ display:inline-flex; align-items:center; gap:6px; }
.ygh-price{ font:900 14px/1 system-ui; color:#000; }
.ygh-old{ font:800 11.5px/1 system-ui; text-decoration:line-through; opacity:.7; color:#111; }

.ygh-count{ margin-top:6px; font:800 11.5px/1 system-ui; color:var(--yg-muted); }
.ygh-count.ygh-expired .ygh-t{ opacity:.45; text-decoration:line-through; }

/* ===== الأسهم ===== */
.ygh-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  inline-size:28px; block-size:28px; border-radius:8px;
  border:1.5px solid var(--yg-border); background:#fff; color:#111;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 6px 14px rgba(0,0,0,.08);
  z-index:2;
}
.ygh-prev{ inset-inline-start:-6px; }
.ygh-next{ inset-inline-end:-6px; }
.ygh-nav:disabled{ opacity:.45; cursor:not-allowed; }
.ygh-nav:active{ transform:translateY(-50%) scale(.98); }

/* ===== تركيز لوحة المفاتيح ===== */
.ygh-row:focus{ outline:2px solid var(--yg-primary); outline-offset:2px; }
.ygh-card:focus{ outline:2px solid var(--yg-accent); outline-offset:2px; }