
/* ===== AccountSidebar — tuval: stitch-screens/hesabim.html "Navigation List"
 *
 * Tuvalde tek bir duzen var ve MOBILE cizilmis: kenarlikli bir kart, icinde
 * ayraclarla bolunmus gezinme satirlari, aktif satirda 4px sol vurgu cubugu;
 * kartin ALTINDA ayri, cerceveli, tam genislikte "Cikis Yap" butonu.
 *
 * 2026-09-16: mobil acilir menu (trigger + katlanan liste) KALDIRILDI —
 * tuvalde karsiligi yoktu ve uc gorunur hata uretiyordu (ayrinti index.tsx
 * bilesen yorumunda). Artik tek liste her genislikte acik; masaustu farki
 * sadece genislik ve yapisma.
 *
 * Kart yuzeyi: tuval "surface-container-lowest" (#fff) kullaniyor, sayfa
 * zemini ise "surface" (krem). Temanin sayfa zemini su an beyaz oldugu icin
 * kart --mh-surface ile ciziliyor; iliski tersine donmus durumda ve bu
 * Code mode'dan duzeltilemez (sayfa zemini Design mode temasinda).
 */

/* --- Kart --- */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar, .cc_t2dowgyg_account_info .kombos-account-sidebar {
  display: block;
  width: 100%;
  flex-shrink: 0;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list, .cc_t2dowgyg_account_info .kombos-account-sidebar__list {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--mh-outline-variant) 30%, transparent);
  /* Tuval: rounded-xl. TASARIM-DILI'ndeki 12px "buyuk kart" degeri. */
  border-radius: 12px;
  background: var(--mh-surface);
  box-shadow: 0 4px 24px rgba(33, 78, 124, 0.04);
}

/* --- Satir --- */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
  padding: 1.5rem;
  border: none;
  background: none;
  cursor: pointer;
  font-family: var(--mh-font-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: var(--mh-on-surface);
  text-align: left;
  transition: background-color 0.15s ease, color 0.15s ease;
}

/* Ayrac satirlar ARASINDA; kartin kendi kenarligi ustte ve altta zaten var. */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li + li .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li + li .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li + li .kombos-account-sidebar__item {
  border-top: 1px solid color-mix(in srgb, var(--mh-outline-variant) 20%, transparent);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__icon, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__icon, .cc_t2dowgyg_account_info .kombos-account-sidebar__icon {
  flex-shrink: 0;
  font-size: 1.5rem;
  color: var(--mh-primary);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__label, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__label, .cc_t2dowgyg_account_info .kombos-account-sidebar__label {
  min-width: 0;
}

/* Tuvaldeki "chevron_right" — yeni SVG yerine saf CSS ok.
 * `margin-left: auto` oku saga itiyor; puan rozeti metnin hemen yaninda
 * kaldigi icin okun yerini almiyor. */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item::after, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item::after, .cc_t2dowgyg_account_info .kombos-account-sidebar__item::after {
  content: "";
  display: block;
  width: 0.4rem;
  height: 0.4rem;
  margin-left: auto;
  border-right: 2px solid var(--mh-on-surface-variant);
  border-bottom: 2px solid var(--mh-on-surface-variant);
  transform: rotate(-45deg);
  flex-shrink: 0;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item:hover, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item:hover, .cc_t2dowgyg_account_info .kombos-account-sidebar__item:hover {
  background: color-mix(in srgb, var(--mh-surface-bone) 50%, var(--mh-surface));
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item:active, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item:active, .cc_t2dowgyg_account_info .kombos-account-sidebar__item:active {
  background: var(--mh-surface-bone);
}

/* --- Aktif satir: 4px sol cubuk + tonlu zemin + marka rengi --- */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item--active, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item--active, .cc_t2dowgyg_account_info .kombos-account-sidebar__item--active {
  color: var(--mh-primary);
  font-weight: 600;
  background: color-mix(in srgb, var(--mh-surface-bone) 30%, var(--mh-surface));
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item--active::before, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item--active::before, .cc_t2dowgyg_account_info .kombos-account-sidebar__item--active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--mh-primary);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__item--active::after, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__item--active::after, .cc_t2dowgyg_account_info .kombos-account-sidebar__item--active::after {
  border-color: var(--mh-primary);
}

/* --- Cikis: kartin ALTINDA, ayri cerceveli buton --- */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__logout, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__logout, .cc_t2dowgyg_account_info .kombos-account-sidebar__logout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  margin-top: 1.5rem;
  padding: 1rem;
  border: 1px solid var(--mh-outline-variant);
  /* Tuval: rounded-lg. Yikici/ikincil bir eylem — birincil CTA'nin 20px
   * ovaliyle karistirilmamali. */
  border-radius: 8px;
  background: none;
  cursor: pointer;
  font-family: var(--mh-font-body);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--mh-on-surface-variant);
  transition: background-color 0.15s ease;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__logout-icon, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__logout-icon, .cc_t2dowgyg_account_info .kombos-account-sidebar__logout-icon {
  flex-shrink: 0;
  font-size: 1.25rem;
  color: var(--mh-on-surface-variant);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__logout:hover, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__logout:hover, .cc_t2dowgyg_account_info .kombos-account-sidebar__logout:hover {
  background: color-mix(in srgb, var(--mh-surface-variant) 20%, var(--mh-surface));
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__logout:active, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__logout:active, .cc_t2dowgyg_account_info .kombos-account-sidebar__logout:active {
  background: color-mix(in srgb, var(--mh-surface-variant) 40%, var(--mh-surface));
}

/* --- Puan rozeti --- */
/* Temanin MEVCUT altin dili (secili varyant rozetiyle ayni gradyan token'i);
 * yeni renk icat edilmedi. Puani olmayan ya da programi kapali magazada
 * bilesen bunu HIC cizmez, o yuzden bos durum stili yok. */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__points, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__points, .cc_t2dowgyg_account_info .kombos-account-sidebar__points {
  flex-shrink: 0;
  padding: 2px 10px;
  border: 1px solid var(--mh-gold);
  border-radius: 999px;
  background: var(--mh-gold-gradient);
  font-family: var(--mh-font-body);
  font-size: 12px;
  line-height: 16px;
  font-weight: 700;
  color: var(--mh-primary);
}

/* --- Masaustu (1024px+) --- */
/* Duzen degismiyor, yalnizca kolon genisligi sabitleniyor. */
@media (min-width: 1024px) {
  .cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar, .cc_t2dowgyg_account_info .kombos-account-sidebar {
    width: fit-content;
  }

  .cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list, .cc_t2dowgyg_account_info .kombos-account-sidebar__list {
    min-width: 17rem;
  }
}
