/* NewLineColorItem — spec: specs/anasayfa-newline-koleksiyon.md §5, §6.7, §14
 *
 * Iki gorunum modu tek dosyada:
 *  - .mh-newline-card       urun satiri / mobil seritteki kart
 *
 * Bagimsiz CSS dosyasi — sub-components/ altindan hicbir seyin importu
 * gerekmiyor (spec §12: ProductCard, Button, Badge vb. kullanilmiyor).
 */

/* ===== Kart (card) ===== */
.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  transition: transform 280ms ease-out;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card:hover {
  transform: translateY(-3px);
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__media-frame {
  position: relative;
  aspect-ratio: var(--mh-newline-card-ar, 2 / 3);
  border-radius: 8px 8px 0 0;
  overflow: hidden;
  background: var(--mh-surface-variant);
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__media-link {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__media {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 280ms ease-out;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card:hover .mh-newline-card__media {
  transform: scale(1.03);
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__media--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mh-outline-variant);
  font-size: 2.5rem;
}

/* Favori — gercek <button>, kalp gorselin uzerinde mutlak konumlu.
 * z-index media-link'in (2) ustunde: tiklanabilir kalmali. */
.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__favorite {
  position: absolute;
  z-index: 3;
  top: 0.5rem;
  right: 0.5rem;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mh-surface) 90%, transparent);
  color: var(--mh-primary);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  padding: 0;
  cursor: pointer;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__info {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__color-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 12px 0 2px;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__color-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex: 0 0 auto;
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--mh-on-surface) 12%, transparent);
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__color-name {
  font-family: var(--mh-font-body);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--mh-on-surface);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__collection {
  font-family: var(--mh-font-body);
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  color: var(--mh-on-surface-variant);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__prices {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin-top: 6px;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__price {
  font-family: var(--mh-font-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  color: var(--mh-primary);
}

/* Yerlesik indirim kurali — TASARIM-DILI, tuval indirimsiz durumu ciziyor
 * (spec §6.5 "Yerlesik fiyat kurali"). */
.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__price--discounted {
  color: var(--mh-accent-crimson);
  font-weight: 700;
}

.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__price-old {
  font-family: var(--mh-font-body);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: var(--mh-on-surface-variant);
  opacity: 0.6;
  text-decoration: line-through;
}

/* Kartin geri kalanini (bosluklar, metin araligi) tiklanabilir yapan
 * gorunmez ortu. Gercek kontroller yukarida z-index ile ustte tutuluyor. */
.cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__link-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  -webkit-user-drag: none;
}

/* ===== Mobil serit — kart genisligi sabit, snap noktasi ===== */
@media (max-width: 1023px) {
  .cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card {
    flex: 0 0 296px;
    scroll-snap-align: start;
  }
}

/* ===== Masaustu izgara (NewLineCollection §17) — kart 157px'e (1440) /
 * 150px'e (1024) daraliyor; `collectionName` bu genislikte tek satira
 * sigmayabilir. Taşma degil SARMA (spec talimati): ellipsis/nowrap kaldirilir. */
@media (min-width: 1024px) {
  .cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__collection {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}

/* ===== Erisilebilirlik: azaltilmis hareket ===== */
@media (prefers-reduced-motion: reduce) {
  .cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card, .cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card__media {
    transition: none;
  }

  .cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card:hover, .cc_t2dowgyg_Lo2CAeXTQZ .mh-newline-card:hover .mh-newline-card__media {
    transform: none;
  }
}