/*
 * Kampanya Kutusu — kupon kartı. Gölge yok.
 * Yumuşak ton: beyaz kart, renk yalnızca vurgu. Canlı ton: kartın tamamı vurgu rengi,
 * kupon/CTA rengin koyu tonları (--ctile-deep / --ctile-deeper).
 */
.cc_3oy8q90m_F5sOHABEeN .ctile {
  --ctile-accent-fallback: var(--kombos-primary);
  --ctile-color: var(--ctile-accent, var(--ctile-accent-fallback));
  container-type: inline-size;
  container-name: ctile;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--kombos-border);
  border-radius: var(--kombos-radius-lg);
  background-color: var(--kombos-white);
  color: var(--kombos-text);
  transition: border-color var(--dur-fast) var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
  .cc_3oy8q90m_F5sOHABEeN .ctile:hover {
    border-color: var(--kombos-border-strong);
  }
}

/* ─── Üst alan: indirim + koşul + opsiyonel görsel ─── */
.cc_3oy8q90m_F5sOHABEeN .ctile__top {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex: 1 1 auto;
  padding: 1.25rem;
  background-color: color-mix(in srgb, var(--ctile-color) 7%, var(--kombos-white));
}

.cc_3oy8q90m_F5sOHABEeN .ctile__offer {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  flex: 1 1 auto;
  min-width: 0;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__discount {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 0.375rem;
  margin: 0;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__discount-value {
  color: var(--ctile-color);
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__discount-label {
  color: var(--kombos-text);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__desc {
  margin: 0;
  color: var(--kombos-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__media {
  flex: 0 0 auto;
  width: 5rem;
  height: 5rem;
  padding: 0.375rem;
  overflow: hidden;
  border-radius: var(--kombos-radius-card);
  background-color: var(--kombos-white);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__media-el {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (min-width: 1024px) {
  .cc_3oy8q90m_F5sOHABEeN .ctile__media {
    width: 6rem;
    height: 6rem;
  }
}

/* ─── Alt alan: kod + kopyala, bağlantı, şart notu ─── */
.cc_3oy8q90m_F5sOHABEeN .ctile__bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.25rem 1.25rem;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__countdown {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: var(--kombos-text-secondary);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__countdown-icon {
  font-size: 0.875rem;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__coupon {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__code {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.375rem 0.75rem;
  border: 1px solid var(--kombos-border-strong);
  border-radius: var(--kombos-radius-input);
  background-color: var(--kombos-gray-50);
  color: var(--kombos-gray-900);
  letter-spacing: 0.06em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  user-select: all;
  transition:
    border-color var(--dur-fast) var(--ease-out),
    background-color var(--dur-fast) var(--ease-out);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__coupon--done .ctile__code {
  border-color: var(--kombos-success);
  background-color: var(--kombos-success-soft);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__copy {
  flex-shrink: 0;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__copy-inner {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__copy-icon {
  display: inline-flex;
  font-size: 1rem;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__coupon--done .ctile__copy-icon {
  color: var(--kombos-success);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__link {
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
  color: var(--kombos-text);
  text-decoration: none;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__link:hover {
  text-decoration: underline;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__link:focus-visible {
  outline: 2px solid var(--kombos-focus);
  outline-offset: 2px;
  border-radius: var(--kombos-radius-sm);
}

.cc_3oy8q90m_F5sOHABEeN .ctile__link-icon {
  font-size: 1rem;
}

.cc_3oy8q90m_F5sOHABEeN .ctile__terms {
  margin: 0;
  margin-top: auto;
  color: var(--kombos-text-muted);
}

/* Dar kart: görsel küçülür */
@container ctile (max-width: 17rem) {
  .cc_3oy8q90m_F5sOHABEeN .ctile__media {
    width: 3.5rem;
    height: 3.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_3oy8q90m_F5sOHABEeN .ctile, .cc_3oy8q90m_F5sOHABEeN .ctile__code {
    transition: none;
  }
}

/* ─── Canlı ton: kartın tamamı vurgu rengi (diyagonal açık kesit görselin arkasında), içerikler rengin koyu tonları ─── */
.cc_3oy8q90m_F5sOHABEeN .ctile--vivid {
  --ctile-fg: var(--ctile-content, var(--kombos-white));
  --ctile-light: var(--ctile-second, color-mix(in srgb, var(--ctile-color) 86%, var(--kombos-white)));
  --ctile-deep: var(--ctile-surface, color-mix(in srgb, var(--ctile-color) 76%, #000));
  --ctile-deeper: var(--ctile-surface-strong, color-mix(in srgb, var(--ctile-color) 62%, #000));
  border-color: transparent;
  background: linear-gradient(118deg, var(--ctile-color) 0 56%, var(--ctile-light) 56% 100%);
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid:not(.ctile--has-media) {
  background: var(--ctile-color);
}

@media (hover: hover) and (pointer: fine) {
  .cc_3oy8q90m_F5sOHABEeN .ctile--vivid:hover {
    border-color: transparent;
  }
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__top {
  background: transparent;
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__discount-value, .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__discount-label {
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__desc {
  color: color-mix(in srgb, var(--ctile-fg) 88%, transparent);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__media {
  border-radius: var(--kombos-radius-lg);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14);
}

@media (hover: hover) and (pointer: fine) {
  .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__media {
    transition: transform var(--dur-base) var(--ease-out);
  }

  .cc_3oy8q90m_F5sOHABEeN .ctile--vivid:hover .ctile__media {
    transform: translateY(-2px) rotate(-1.5deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_3oy8q90m_F5sOHABEeN .ctile--vivid:hover .ctile__media {
    transform: none;
  }
}

/* Alt alan: ayrı zemin ya da ayraç yok; içerik kartın renginde akar. */
.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__bottom {
  padding-top: 0.25rem;
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__countdown {
  color: color-mix(in srgb, var(--ctile-fg) 85%, transparent);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__terms {
  color: color-mix(in srgb, var(--ctile-fg) 72%, transparent);
}

/* Kupon: rengin koyu tonunda tek parça; kod beyaz, kopyala butonu daha koyu ton */
.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__coupon {
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.25rem 0.25rem 0.875rem;
  border: 0;
  border-radius: 10px;
  background-color: var(--ctile-deep);
  transition: background-color var(--dur-fast) var(--ease-out);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__code {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__coupon--done {
  background-color: var(--kombos-success);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__coupon--done .ctile__code, .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__coupon--done .ctile__copy-icon {
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .k-btn.ctile__copy {
  border-color: transparent;
  background-color: var(--ctile-deeper);
  color: var(--ctile-fg);
  box-shadow: none;
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .k-btn.ctile__copy:hover:not(:disabled) {
  border-color: transparent;
  background-color: color-mix(in srgb, var(--ctile-deeper) 82%, #000);
}

/* Kodsuz kart CTA'sı: koyu ton dolgu, beyaz yazı */
.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .k-btn.ctile__cta {
  border-color: transparent;
  background-color: var(--ctile-deep);
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .k-btn.ctile__cta:hover:not(:disabled) {
  border-color: transparent;
  background-color: var(--ctile-deeper);
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__link {
  color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__link:focus-visible, .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .k-btn:focus-visible {
  outline-color: var(--ctile-fg);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__link-icon {
  transition: transform var(--dur-fast) var(--ease-out);
}

.cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__link:hover .ctile__link-icon {
  transform: translateX(2px);
}

@media (prefers-reduced-motion: reduce) {
  .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__coupon, .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__link-icon {
    transition: none;
  }
}

/* ─── Geniş hücre (1–2 kart, ≥36rem): yatay düzen — solda teklif, sağda kod/buton ─── */
@container ctile-cell (min-width: 36rem) {
  .cc_3oy8q90m_F5sOHABEeN .ctile {
    flex-direction: row;
  }

  .cc_3oy8q90m_F5sOHABEeN .ctile__top {
    flex: 1 1 auto;
    min-height: 9rem;
    padding: 1.25rem 1.5rem;
  }

  .cc_3oy8q90m_F5sOHABEeN .ctile__bottom {
    flex: 0 0 clamp(15rem, 40%, 20rem);
    justify-content: center;
    padding: 1.25rem 1.5rem;
  }

  .cc_3oy8q90m_F5sOHABEeN .ctile__media {
    width: 6.5rem;
    height: 6.5rem;
  }

  .cc_3oy8q90m_F5sOHABEeN .ctile--vivid .ctile__bottom {
    padding-top: 1.25rem;
  }
}
