:root{
  --brand: #0066ff;
  --chip:  #d6dcf0;
  --card:  #f7f7f7;
  --text:  #1792de;
  --info:  #6699ff; /* ✅ جديد */
  --radius: 14px;
  --imgH: 120px;
  --ticker-seconds: 35s;
}

/* أساسيات */
body{background:#f7f7fb;color:var(--text);padding-bottom:90px;touch-action:manipulation}

/* من نمطك الأصلي — مع متغيرات الديناميك */
.topbar{position:sticky;top:0;z-index:1030;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.tab-chip{background:var(--chip);border:none;padding:.55rem 1rem;border-radius:999px;font-weight:700}
.tab-chip.active{background:var(--brand);color:#fff}
.card-auction{border:none;border-radius:var(--radius);box-shadow:0 8px 30px rgba(16,24,40,.08);overflow:hidden;background:var(--card);cursor:pointer}
.auction-row{display:flex;flex-wrap:nowrap;direction:ltr}
.auction-row .img-col{flex:0 0 42%;max-width:42%}
.auction-row .text-col{flex:0 0 58%;max-width:58%}
.car-photo{width:100%;height:var(--imgH);object-fit:cover;border-radius:12px;margin:10px}
.meta i{opacity:.8;margin-inline-end:.35rem}
.end-btn{background:#3f3f56;color:#fff;border-radius:999px;padding:.5rem 1.1rem;font-weight:700}
.timer{font-weight:700}
.skeleton{animation:pulse 1.2s infinite ease-in-out;background:linear-gradient(90deg,#eee,#f6f6f6,#eee);background-size:200% 100%}
@keyframes pulse{0%{background-position:200% 0}100%{background-position:-200% 0}}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;background:#fff;box-shadow:0 -6px 20px rgba(0,0,0,.08);z-index:1030}
.bn-item{padding:.35rem 0;text-align:center;color:#111}
.bn-item .icon{font-size:1.25rem;display:block}
.bn-item button{background:none;border:0;width:100%}
.modal-header.sticky{position:sticky;top:0;z-index:1;background:#fff;border-bottom:1px solid #e9ecef}
.back-btn{border:none;background:none;font-size:1.25rem}
.news-wrap{background:#fff;border-bottom:1px solid #eee}
.news-inner{position:relative;overflow:hidden;height:38px}
.ticker-title{position:absolute;top:0;bottom:0;display:flex;align-items:center;font-weight:700;color:var(--brand);padding:0 .75rem}
.ticker-track{white-space:nowrap;will-change:transform;display:inline-block;line-height:38px}
.ticker-track span{margin:0 1.25rem;color:#444}
.rtl .ticker-run{animation:ticker-rtl var(--ticker-seconds) linear infinite}
.ltr .ticker-run{animation:ticker-ltr var(--ticker-seconds) linear infinite}
@keyframes ticker-rtl{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
@keyframes ticker-ltr{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.news-inner:hover .ticker-run{animation-play-state:paused}
.notif-btn{position:relative}
.notif-badge{position:absolute;top:0;inset-inline-end:-2px;transform:translate(50%,-30%);background:#ef4444;color:#fff;border-radius:999px;padding:.1rem .35rem;font-size:.7rem;min-width:18px;text-align:center}
.carousel-item img{max-height:420px;object-fit:cover}

/* إخفاء صندوق "عناصر إضافية" الذي تولّده بعض المتصفّحات لوسم menu */
menu[type="toolbar"],
menu:empty,
details[popover][open][role="list"],
details[role="list"] { display: none !important; }

/* ✅ غلاف السلايدر بمقاس ثابت ومتجاوب */
.car-carousel-wrapper { position: relative; width: 100%; max-width: 100%; }
.car-carousel-wrapper .carousel,
.car-carousel-wrapper .carousel-inner,
.car-carousel-wrapper .carousel-item { width: 100%; height: 260px; } /* موبايل */

/* الصورة نفسها */
.car-carousel-wrapper .carousel-item img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* على الشاشات الأكبر نرفع الارتفاع */
@media (min-width: 768px) {
  .car-carousel-wrapper .carousel,
  .car-carousel-wrapper .carousel-inner,
  .car-carousel-wrapper .carousel-item { height: 420px; }
}

.floating-voice-btn{
  position:fixed;
  bottom:80px;
  right:16px;
  width:56px;
  height:56px;
  border-radius:50%;
  border:none;
  outline:none;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.6rem;
  box-shadow:0 4px 12px rgba(0,0,0,.2);
  background:#dc3545;
  color:#fff;
  z-index:1080;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, opacity .2s ease;
}
.floating-voice-btn:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,.25); }
.floating-voice-btn:active{ transform:translateY(1px) scale(.97); box-shadow:0 2px 8px rgba(0,0,0,.2); }

/* لو الموقع RTL خليه في اليسار بدل اليمين */
body.rtl .floating-voice-btn{ right:auto; left:16px; }

/* على الشاشات الصغيرة جداً نزله شوي */
@media (max-width:575.98px){ .floating-voice-btn{ bottom:88px; } }

/* إزالة النقاط والهوامش من قائمة السوشيال */
.social-icons { list-style: none; padding: 0; margin: 0; }
.social-icons li a { text-decoration: none; color: inherit; }
.social-icons i { font-size: 24px; transition: 0.3s ease; }
.social-icons i:hover { transform: scale(1.2); opacity: 0.8; }

.drawer-logo { height: 36px; max-width: 120px; object-fit: contain; }

.gallery-swiper { width: 100%; height: 75vh; background:#000; }
@media (max-width:576px){ .gallery-swiper{ height: calc(100vh - 120px); } }

.gallery-slide{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  background:#000;
}
.swiper-zoom-container{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
}
.gallery-img{
  max-width:100%;
  max-height:85vh;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
  touch-action:none;
}
@media (max-width:576px){ .gallery-img{ max-height:75vh; } }

/* =========================================================
   ✅ ألوان معلومات الكروت (الموقف/الرقم + سطر المدينة)
   - تعتمد على --info القادم من لوحة الثيم
   - لو عندك text-muted جوّاها نخليه يرث اللون
========================================================= */
.auction-top-info{
  color: var(--info) !important;
  font-weight: 700;
}

.auction-bottom-info{
  color: var(--info) !important;
}

.auction-bottom-info .text-muted{
  color: inherit !important;
}

/* (اختياري) لو استخدمت class city-text في مكان آخر */
.city-text{
  color: var(--info) !important;
}
/* الاتجاه الطبيعي */
.ticker-track {
  white-space: nowrap;
  overflow: hidden;
}

/* عربي → يمشي من اليسار لليمين */
.ticker-ltr {
  direction: ltr;
  animation: ticker-ltr 25s linear infinite;
}

/* انجليزي → يمشي من اليمين لليسار */
.ticker-rtl {
  direction: rtl;
  animation: ticker-rtl 25s linear infinite;
}

/* حركة من اليسار لليمين */
@keyframes ticker-ltr {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* حركة من اليمين لليسار */
@keyframes ticker-rtl {
  0%   { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}