/* =========================================================
   stoc.css — "În curând" + Mașini vândute
   Se încarcă DUPĂ style.css (în index.html ȘI în car.html):
   <link rel="stylesheet" href="style.css">
   <link rel="stylesheet" href="stoc.css">
========================================================= */

/* ===== ÎN CURÂND (puncte animate) ===== */
.coming-soon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.9rem;
  margin-top: 2.5rem;
  padding: 2.5rem 1rem;
  background: var(--card);
  border: 1px dashed var(--border-gold);
  border-radius: var(--radius-lg);
}

.coming-soon-text {
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 3vw, 1.8rem);
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted-light);
}

.loading-dots {
  display: inline-flex;
  align-items: flex-end;
  gap: 6px;
  height: 1.6rem;
}

.loading-dots span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--primary);
  animation: dot-bounce 1.2s ease-in-out infinite;
}

.loading-dots span:nth-child(2) { animation-delay: 0.15s; }
.loading-dots span:nth-child(3) { animation-delay: 0.3s; }

@keyframes dot-bounce {
  0%, 60%, 100% { transform: translateY(0); }
  30%           { transform: translateY(-12px); }
}


/* =========================================================
   SECȚIUNEA "MAȘINI VÂNDUTE" (index.html)
========================================================= */

.sold-section {
  background: var(--bg-secondary);
  border-top: 1px solid var(--border);
}

.sold-section[hidden] {
  display: none;
}

.sold-section-head {
  margin-bottom: 2.5rem;
}

.sold-section-head .section-sub {
  max-width: 560px;
}


/* ===== CARD VÂNDUT =====
   Cardul rămâne normal și clicabil. Doar poza are o etichetă
   mică "VÂNDUT" și o ușoară estompare. */

/* anulează orice opacity/filter rămas din style.css */
.car-card.is-sold {
  pointer-events: auto;
  cursor: pointer;
}

.car-card.is-sold .car-card-img,
.car-card.is-sold .car-card-body {
  opacity: 1;
  filter: none;
}

.sold-overlay {
  display: none;
}

/* >>> AICI modifici cât de „stinsă” e poza mașinii vândute <<<
   grayscale: 0 = color, 1 = alb-negru
   brightness: 1 = normal, 0.5 = mai întunecat
   Pentru deloc estompat: filter: none; */
.car-card.is-sold .car-card-img img {
  filter: grayscale(0.3) brightness(0.9);
}

.car-card.is-sold:hover .car-card-img img {
  filter: none;
}

/* eticheta mică, doar pe imagine */
.sold-tag {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-8deg);
  z-index: 3;
  pointer-events: none;

  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;

  color: var(--primary);
  background: rgba(8, 8, 8, 0.78);
  border: 2px solid var(--primary);
  border-radius: 4px;
  padding: 0.4rem 0.9rem 0.4rem 1.1rem;
}

@media (max-width: 768px) {
  .sold-tag {
    font-size: 0.95rem;
    letter-spacing: 0.18em;
  }
}

/* Pagina car.html pentru mașini vândute: stilurile ("VÂNDUT" mare
   pe prima poză și butonul dezactivat) sunt puse automat din script.js. */