/* ===== AccountSidebar — Stitch "Navigation List" (hesabim.html) =====
 * Stitch only designed MOBILE: a card list (Siparişlerim / Profil Bilgileri /
 * Adreslerim / Favorilerim) with a 4px left "active indicator" bar on the
 * current item, plus a separate outlined "Çıkış Yap" button below the card.
 *
 * This component renders the list two ways depending on viewport:
 *   - >=1024px: an always-visible vertical list (`.kombos-account-sidebar`)
 *   - <1024px: a collapsible trigger + menu (`.kombos-account-dropdown`)
 * That split (accordion on mobile) is existing component behavior, not
 * something this pass changes — only colors/spacing/tokens were restyled to
 * match Stitch. The "logout is a separate button below the card" split is
 * achieved with pure CSS (:last-child) since the 5 items already render in a
 * single fixed-order list (account, orders, addresses, favorites, logout).
 *
 * Card surface: Stitch uses "surface-container-lowest" (#fff), which has no
 * --mh-* equivalent in the token set handed to this component — approximated
 * with --mh-surface (var(--mh-surface)), same substitution already used elsewhere
 * (see ContactForm/styles.css).
 */

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-icon, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-icon, .cc_t2dowgyg_account_info .kombos-account-icon {
  font-size: 1.5rem;
  flex-shrink: 0;
}

/* ── Shared "chevron_right" decoration (Stitch shows one per row) ──
 * No new SVG/markup allowed this pass, so it's a pure-CSS arrow. */
.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, .cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item::after, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item::after, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-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;
}

/* --- Desktop sidebar list (>=1024px) ---
 * Undesigned by Stitch (mobile-only source) — the mobile card language
 * (rounded card, dividers, left active bar) is scaled up as-is. */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar, .cc_t2dowgyg_account_info .kombos-account-sidebar {
  display: none;
  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;
  display: flex;
  flex-direction: column;
  min-width: 17rem;
}

.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;
  border-left: 1px solid color-mix(in srgb, var(--mh-outline-variant) 30%, transparent);
  border-right: 1px solid color-mix(in srgb, var(--mh-outline-variant) 30%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--mh-outline-variant) 20%, transparent);
  background: var(--mh-surface);
  cursor: pointer;
  overflow: hidden;
  font-family: var(--mh-font-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: var(--mh-on-surface);
  transition: background-color 0.15s ease, color 0.15s ease;
}

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

.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);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:first-child .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:first-child .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:first-child .kombos-account-sidebar__item {
  border-top: 1px solid color-mix(in srgb, var(--mh-outline-variant) 30%, transparent);
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:nth-last-child(2) .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:nth-last-child(2) .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:nth-last-child(2) .kombos-account-sidebar__item {
  border-bottom: 1px solid color-mix(in srgb, var(--mh-outline-variant) 30%, transparent);
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:first-child .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:first-child .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:first-child .kombos-account-sidebar__item, .cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:nth-last-child(2) .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:nth-last-child(2) .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:nth-last-child(2) .kombos-account-sidebar__item {
  box-shadow: 0 4px 24px rgba(33, 78, 124, 0.04);
}

/* Active indicator: 4px solid left bar + tinted background + primary text */
.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);
}

/* Logout — separated from the card, own outlined button, no chevron */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:last-child, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:last-child, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:last-child {
  margin-top: 1.5rem;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:last-child .kombos-account-sidebar__item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:last-child .kombos-account-sidebar__item, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:last-child .kombos-account-sidebar__item {
  justify-content: center;
  border: 1px solid var(--mh-outline-variant);
  /* Oval — birincil CTA (Sepete Ekle) ile ayni yaricap */
  border-radius: 20px;
  color: var(--mh-on-surface-variant);
  font-family: var(--mh-font-body);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

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

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

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:last-child svg, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:last-child svg, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:last-child svg {
  color: var(--mh-on-surface-variant);
  font-size: 1.25rem;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar__list li:last-child .kombos-account-sidebar__item::after, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar__list li:last-child .kombos-account-sidebar__item::after, .cc_t2dowgyg_account_info .kombos-account-sidebar__list li:last-child .kombos-account-sidebar__item::after {
  display: none;
}

/* --- Mobile dropdown (<1024px) --- */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown, .cc_t2dowgyg_account_info .kombos-account-dropdown {
  display: block;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__box, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__box, .cc_t2dowgyg_account_info .kombos-account-dropdown__box {
  border: 1px solid color-mix(in srgb, var(--mh-outline-variant) 30%, transparent);
  border-radius: 8px;
  overflow: hidden;
  background: var(--mh-surface);
  box-shadow: 0 4px 24px rgba(33, 78, 124, 0.04);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__trigger, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__trigger, .cc_t2dowgyg_account_info .kombos-account-dropdown__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1.5rem;
  border: none;
  background: color-mix(in srgb, var(--mh-surface-bone) 30%, var(--mh-surface));
  cursor: pointer;
  position: relative;
  font-family: var(--mh-font-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  color: var(--mh-primary);
}

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

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__trigger svg, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__trigger svg, .cc_t2dowgyg_account_info .kombos-account-dropdown__trigger svg {
  color: var(--mh-primary);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__trigger--open, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__trigger--open, .cc_t2dowgyg_account_info .kombos-account-dropdown__trigger--open {
  border-bottom: 1px solid color-mix(in srgb, var(--mh-outline-variant) 20%, transparent);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__trigger-left, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__trigger-left, .cc_t2dowgyg_account_info .kombos-account-dropdown__trigger-left {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__caret, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__caret, .cc_t2dowgyg_account_info .kombos-account-dropdown__caret {
  transition: transform 0.2s ease;
  color: var(--mh-primary);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__caret--open, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__caret--open, .cc_t2dowgyg_account_info .kombos-account-dropdown__caret--open {
  transform: rotate(180deg);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--mh-surface);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  padding: 1.5rem;
  border: none;
  border-top: 1px solid color-mix(in srgb, var(--mh-outline-variant) 20%, transparent);
  background: none;
  cursor: pointer;
  font-family: var(--mh-font-body);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: var(--mh-on-surface);
  transition: background-color 0.15s ease;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item svg, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item svg, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item svg {
  color: var(--mh-primary);
}

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

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item--active, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item--active, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item--active {
  position: relative;
  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-dropdown__menu-item--active::before, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item--active::before, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item--active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--mh-primary);
}

/* the checkmark (active state) replaces the chevron in the open menu */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item--active::after, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item--active::after, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item--active::after {
  display: none;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item--active svg:last-child, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item--active svg:last-child, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item--active svg:last-child {
  color: var(--mh-primary);
}

/* Logout row inside the open menu — same separation treatment as desktop */
.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu li:last-child, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu li:last-child, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu li:last-child {
  margin-top: 1rem;
  padding: 0 1rem 1rem;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu li:last-child .kombos-account-dropdown__menu-item, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu li:last-child .kombos-account-dropdown__menu-item, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu li:last-child .kombos-account-dropdown__menu-item {
  justify-content: center;
  border: 1px solid var(--mh-outline-variant);
  border-top: 1px solid var(--mh-outline-variant);
  /* Oval — birincil CTA (Sepete Ekle) ile ayni yaricap */
  border-radius: 20px;
  color: var(--mh-on-surface-variant);
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item--logout svg, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item--logout svg, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item--logout svg {
  color: var(--mh-on-surface-variant);
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu li:last-child .kombos-account-dropdown__menu-item::after, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu li:last-child .kombos-account-dropdown__menu-item::after, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu li:last-child .kombos-account-dropdown__menu-item::after {
  display: none;
}

.cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown__menu-item-left, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown__menu-item-left, .cc_t2dowgyg_account_info .kombos-account-dropdown__menu-item-left {
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* --- Responsive --- */
@media (min-width: 1024px) {
  .cc_t2dowgyg_WGvKxFlrJz .kombos-account-sidebar, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-sidebar, .cc_t2dowgyg_account_info .kombos-account-sidebar {
    display: block;
    width: fit-content;
  }

  .cc_t2dowgyg_WGvKxFlrJz .kombos-account-dropdown, .cc_t2dowgyg_zmTAEz5st7 .kombos-account-dropdown, .cc_t2dowgyg_account_info .kombos-account-dropdown {
    display: none;
  }
}

/* Puan sayisi rozeti — menudeki "Puanlarim" maddesinin sagina oturur.
 * 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.
 *
 * `margin-left: auto` YOK: madde zaten `::after` ile bir ok cizip onu
 * `margin-left:auto` ile sagda tutuyor; rozet metnin hemen yaninda durmali,
 * okun yerini almamali. */
.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);
}