/* ===== PREMIUM CAR SCROLL ===== */
.car-scroll-section{
  background:#fff;
  padding:14px 8px 18px;
  border-bottom:1px solid #eee;
   display: flex;
  align-items: center;     /* 🔥 same vertical line */
  gap: 14px;
}

/* horizontal container */
.car-scroll-wrapper{
  display:flex;
  gap:12px;
  justify-content: center;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:6px 4px;
}

/* hide scrollbar */
.car-scroll-wrapper::-webkit-scrollbar{
  display:none;
}
.car-scroll-wrapper{
  justify-content: flex-start;  /* ❌ center hataya */
  flex: 1; 
}

/* CARD */
.car-card{
  min-width:78px;               /* 🔥 smaller cards */
  max-width:78px;
  background:linear-gradient(
    145deg,
    #ffffff,
    #f1f5f9
  );
  border-radius:26px;           /* 🔥 extra rounded */
  padding:10px 8px 12px;
  text-align:center;
  box-shadow:
    0 8px 18px rgba(0,0,0,0.10),
    inset 0 1px 1px rgba(255,255,255,0.8);
  flex-shrink:0;
  scroll-snap-align:start;
  cursor:pointer;
  position:relative;
  transition:all .25s ease;
}

/* subtle glow border */
.car-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:26px;
  padding:1px;
  background:linear-gradient(
    135deg,
    rgba(220,38,38,.45),
    rgba(255,255,255,0)
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
}

/* hover / tap */
.car-card:hover{
  transform:translateY(-4px) scale(1.05);
  box-shadow:
    0 14px 28px rgba(0,0,0,0.16);
}

/* IMAGE */
.car-card img{
 width:64px;
  height:64px;
  border-radius:50%;          /* 🔥 FULL ROUND */
  object-fit:contain;
  background:#fff;
  padding:1px;
  margin-bottom:1px;
  box-shadow:0 6px 14px rgba(0,0,0,.18);
}

/* TITLE */
.car-card span{
  font-size:11px;
  font-weight:700;
  color:#ff5722;                /* theme red */
  line-height:1.1;
  display:block;
}

/* ACTIVE (future use) */
.car-card.active{
  background:linear-gradient(
    145deg,
    #fee2e2,
    #fff
  );
  box-shadow:
    0 14px 30px rgba(220,38,38,.35);
}

/* LEFT FIXED TEXT */
.car-title {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 700;
  color: #111;
  white-space: nowrap;
  padding-left: 20px;
 
}