/* ESR Türkiye — commerce.css (COMMERCE): sepet, ödeme, sipariş, hesap, giriş/üye ol, Cihazım.
   Prototip çekmece dilinin sayfa hali: beyaz zemin, #f5f5f7 yuvarlak yüzeyler, nane rengi yalnız birincil eylemde.
   Ortak öğeler (esr-btn, esr-input, esr-select, esr-field, esr-page-*, esr-segmented, esr-flash, esr-toast) app.css'te. */

/* ---------- genel ---------- */
.esr-commerce { padding-bottom: 64px; }
.esr-container--narrow { max-width: calc(720px + 2 * var(--esr-gutter)); }
.esr-container--auth { max-width: calc(420px + 2 * var(--esr-gutter)); }
.esr-commerce-head { padding-bottom: 22px; }
.esr-commerce-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.esr-commerce-back::before {
  content: ""; width: 7px; height: 7px; border-left: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg); margin-right: 2px;
}
.esr-commerce-flash { margin: 0 0 18px; }
.esr-commerce-flash p { margin: 0; }
.esr-commerce-flash p + p { margin-top: 4px; }
.esr-muted { color: var(--esr-muted); font-size: 14px; margin: 0; }
.esr-center { text-align: center; }
.esr-prewrap { white-space: pre-line; }

.esr-notice {
  margin: 0 0 18px; padding: 12px 16px; border-radius: var(--esr-radius-sm);
  background: var(--esr-surface); color: var(--esr-text); font-size: 14px;
}
.esr-notice--ok { background: var(--esr-accent-soft, #eefae8); color: var(--esr-accent-ink); }
.esr-notice--error { background: #fcecef; color: var(--esr-danger); }

.esr-commerce-empty { padding: 56px 0 24px; display: grid; justify-items: center; gap: 18px; }
.esr-commerce-empty--inline { padding: 28px 0; }
.esr-commerce-empty__title { margin: 0; font: 600 19px/1.25 var(--esr-font-display); color: var(--esr-text); letter-spacing: -0.01em; }

.esr-btn-sm { height: 38px; padding: 0 16px; font-size: 14px; border-radius: 19px; }
.esr-btn-danger { background: var(--esr-danger); color: #fff; }
.esr-text-btn--danger { color: var(--esr-danger); }
.esr-text-btn--danger:hover { color: var(--esr-danger); text-decoration: underline; text-underline-offset: 3px; }
.esr-btn.is-disabled { opacity: .45; pointer-events: none; }

/* form ekleri */
.esr-form-stack { display: grid; gap: 14px; }
.esr-form-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.esr-textarea { min-height: 96px; }
textarea.esr-input.esr-textarea { min-height: 96px; }
.esr-field__error { margin: 0; font-size: 13px; color: var(--esr-danger); }
.esr-field__hint { margin: 0; font-size: 12px; color: var(--esr-muted); }
.esr-field__optional { color: var(--esr-faint); }
.esr-field.is-invalid .esr-input, .esr-field.is-invalid .esr-select { border-color: var(--esr-danger); }
.esr-file { height: auto; padding: 10px 12px; font-size: 14px; }
.esr-check { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.45; cursor: pointer; }
.esr-check input { width: 18px; height: 18px; margin: 1px 0 0; flex-shrink: 0; accent-color: var(--esr-text); }
.esr-fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 10px; min-width: 0; }
.esr-fieldset legend { font-size: 12px; color: var(--esr-muted); margin-bottom: 8px; padding: 0; }
.esr-inline-form { display: flex; gap: 8px; align-items: center; }
.esr-inline-form .esr-input { flex: 1; min-width: 0; }
.esr-inline-form .esr-btn { flex-shrink: 0; }

/* açılır bölüm (hediye çeki, sipariş notu, iade talebi) */
.esr-disclosure { border-top: 1px solid var(--esr-line); }
.esr-disclosure > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 48px; font-size: 14px; color: var(--esr-text);
}
.esr-disclosure > summary::-webkit-details-marker { display: none; }
.esr-disclosure > summary::after {
  content: ""; width: 7px; height: 7px; border-right: 1.6px solid var(--esr-muted); border-bottom: 1.6px solid var(--esr-muted);
  transform: rotate(45deg) translateY(-2px); transition: transform 200ms var(--esr-ease-out); flex-shrink: 0; margin-right: 4px;
}
.esr-disclosure[open] > summary::after { transform: rotate(-135deg) translateY(-1px); }
.esr-disclosure__body { padding: 2px 0 16px; display: grid; gap: 10px; }
.esr-chip-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.esr-chip-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; }

/* rozet */
.esr-badge {
  display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 12px;
  background: #fff; border: 1px solid var(--esr-line); font-size: 12px; color: var(--esr-text); white-space: nowrap;
}
.esr-badge--accent, .esr-badge--success { background: var(--esr-accent); border-color: transparent; color: var(--esr-accent-ink); }
.esr-badge--info { background: #eef3fb; border-color: transparent; color: #1d4f91; }
.esr-badge--warning { background: #fdf4e3; border-color: transparent; color: #8a5a00; }
.esr-badge--danger { background: #fcecef; border-color: transparent; color: var(--esr-danger); }
.esr-badge--muted { color: var(--esr-muted); }

/* yüzey kutusu */
.esr-box { background: var(--esr-surface); border-radius: var(--esr-radius); padding: 20px; margin-top: 16px; }
.esr-box:first-child { margin-top: 0; }
.esr-box__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.esr-box__head .esr-box__title { margin: 0; }
.esr-box__title { font: 600 17px/1.25 var(--esr-font-display); letter-spacing: -0.01em; margin: 0 0 12px; }
.esr-box__text { font-size: 14px; color: var(--esr-muted); margin: 12px 0 0; }
.esr-box .esr-input, .esr-box .esr-select { background-color: #fff; }
.esr-box.esr-disclosure { border-top: 0; padding-top: 6px; padding-bottom: 6px; }

.esr-dl { margin: 0; display: grid; }
.esr-dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--esr-line); font-size: 14px; }
.esr-dl > div:last-child { border-bottom: 0; }
.esr-dl dt { color: var(--esr-muted); }
.esr-dl dd { margin: 0; text-align: right; min-width: 0; overflow-wrap: anywhere; }
.esr-dl__mono { font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.esr-box .esr-dl + .esr-btn { margin-top: 14px; }

/* ---------- tutarlar ---------- */
.esr-totals { margin: 0; display: grid; gap: 8px; font-size: 14px; }
.esr-totals__row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.esr-totals__row dt { color: var(--esr-muted); }
.esr-totals__row dd { margin: 0; text-align: right; }
.esr-totals__row--discount dd { color: #2d7d1f; }
.esr-totals__row--total { border-top: 1px solid var(--esr-line); padding-top: 12px; margin-top: 4px; font-size: 17px; font-weight: 600; }
.esr-totals__row--total dt { color: var(--esr-text); }

/* ücretsiz kargo */
.esr-ship { margin: 0 0 16px; }
.esr-ship__note { margin: 0; font-size: 13px; color: var(--esr-muted); }
.esr-ship__note--done { color: var(--esr-accent-ink); }
.esr-ship__bar { height: 4px; border-radius: 2px; background: var(--esr-surface-2); overflow: hidden; margin-top: 8px; }
.esr-summary .esr-ship__bar { background: #fff; }
.esr-ship__bar i { display: block; height: 100%; background: var(--esr-text); transform-origin: left; transition: transform 300ms var(--esr-ease-out); }

/* ---------- sepet ---------- */
.esr-cart { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
.esr-cart-lines { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--esr-line); }
.esr-cart-line {
  display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 14px; padding: 16px 0;
  border-bottom: 1px solid var(--esr-line); font-size: 14px; transition: opacity 160ms ease;
}
.esr-cart-line.is-busy { opacity: .55; }
.esr-cart-line__media {
  width: 76px; height: 76px; border-radius: 14px; background: var(--esr-surface); overflow: hidden; display: block;
}
.esr-cart-line__media img { width: 100%; height: 100%; object-fit: contain; padding: 6px; mix-blend-mode: multiply; }
.esr-cart-line__body { min-width: 0; display: grid; gap: 3px; align-content: start; }
.esr-cart-line__name {
  font-size: 15px; line-height: 1.35; color: var(--esr-text);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
a.esr-cart-line__name:hover { text-decoration: underline; text-underline-offset: 3px; }
.esr-cart-line__meta { margin: 0; font-size: 13px; color: var(--esr-muted); overflow-wrap: anywhere; }
.esr-cart-line__price { font-size: 15px; font-weight: 600; text-align: right; white-space: nowrap; }
.esr-cart-line__actions { display: flex; align-items: center; gap: 16px; margin-top: 10px; flex-wrap: wrap; }
.esr-cart-line__remove { margin: 0; }
.esr-cart-line__remove .esr-text-btn { font-size: 13px; min-height: 36px; }
.esr-cart__continue { display: inline-block; margin-top: 18px; }

.esr-cart-qty { display: inline-flex; align-items: center; height: 36px; border-radius: 18px; background: var(--esr-surface); margin: 0; }
.esr-cart-qty__btn {
  width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--esr-text);
  transition: background-color 160ms ease, transform 160ms var(--esr-ease-out);
}
.esr-cart-qty__btn:active:not(:disabled) { transform: scale(0.92); }
.esr-cart-qty__btn:disabled { color: var(--esr-faint); cursor: default; }
@media (hover: hover) and (pointer: fine) { .esr-cart-qty__btn:hover:not(:disabled) { background: var(--esr-surface-2); } }
.esr-cart-qty__value { min-width: 26px; text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; }

.esr-summary { background: var(--esr-surface); border-radius: var(--esr-radius); padding: 20px; }
.esr-summary__title { font: 600 17px/1.25 var(--esr-font-display); letter-spacing: -0.01em; margin: 0 0 14px; }
.esr-summary .esr-totals { margin-bottom: 8px; }
.esr-summary .esr-disclosure { border-top-color: var(--esr-line); }
.esr-summary .esr-input { background: #fff; }
.esr-summary .esr-btn-ghost { background: #fff; }
.esr-summary__cta { margin-top: 10px; }
.esr-summary__note { margin: 10px 0 0; font-size: 13px; color: var(--esr-muted); text-align: center; }

/* mobil alt çubuk */
.esr-cart-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 25;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 10px var(--esr-gutter) calc(10px + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  border-top: 1px solid var(--esr-line);
}
.esr-cart-bar__total { display: grid; line-height: 1.2; }
.esr-cart-bar__total small { font-size: 12px; color: var(--esr-muted); }
.esr-cart-bar__total .money { font-size: 17px; font-weight: 600; }
.esr-cart-bar .esr-btn { flex: 1; max-width: 220px; }
.esr-cart-page { padding-bottom: 112px; }
.esr-cart-page .esr-summary__cta { display: none; }

.esr-cart-reco { padding-bottom: 0; }
.esr-cart-reco__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 10px; }

/* ---------- ödeme ---------- */
.esr-checkout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.esr-checkout__form { display: grid; gap: 0; min-width: 0; }
.esr-step-card { padding: 22px 0; border-top: 1px solid var(--esr-line); min-width: 0; }
.esr-step-card:first-of-type { border-top: 0; padding-top: 4px; }
.esr-step-card__title { font: 600 19px/1.2 var(--esr-font-display); letter-spacing: -0.01em; margin: 0 0 14px; }
.esr-step-card__lead { margin: -6px 0 14px; font-size: 14px; color: var(--esr-muted); }
.esr-step-card--plain { padding: 0; }
.esr-step-card--plain .esr-disclosure { border-top: 0; }

/* çekirdek kargo / ödeme yöntemi alanları (commerce.partials.shipping-methods / payment-methods) */
.esr-methods { font-size: 15px; }
.esr-methods label {
  display: flex !important; align-items: flex-start; gap: 12px; padding: 14px 16px; border-radius: var(--esr-radius-sm);
  border: 1px solid var(--esr-line); background: #fff; cursor: pointer; transition: border-color 160ms ease, box-shadow 160ms ease;
}
.esr-methods label:has(input:checked) { border-color: var(--esr-text); box-shadow: inset 0 0 0 1px var(--esr-text); }
.esr-methods input[type="radio"] { width: 18px; height: 18px; margin: 2px 0 0; flex-shrink: 0; accent-color: var(--esr-text); }
.esr-methods strong { font-weight: 500; }
.esr-methods p { margin: 0; }
.esr-methods p + p { margin-top: 4px; }
.esr-methods .pages-list-subtitle { font-size: 13px; color: var(--esr-muted); }
.esr-methods .page-description { font-size: 14px; }
.esr-methods fieldset[data-pickup-locations] { border: 0; padding: 0 !important; margin: 16px 0 0 !important; min-width: 0; }
.esr-methods fieldset[data-pickup-locations] legend { font-size: 12px; color: var(--esr-muted); padding: 0 !important; font-weight: 400 !important; }
.esr-methods > p:only-child { padding: 14px 16px; border-radius: var(--esr-radius-sm); background: var(--esr-surface); }
/* tek yöntem: çekirdek gizli input + düz paragraflar → tek yüzey */
.esr-methods:has(> input[type="hidden"]) { padding: 14px 16px; border-radius: var(--esr-radius-sm); background: var(--esr-surface); }

/* çekirdek yasal onaylar (commerce.partials.checkout-legal-consents) */
.esr-consents { padding: 6px 0 18px; }
.esr-consents .checkout-legal-consents { margin: 0 !important; gap: 14px !important; }
.esr-consents label { font-size: 14px; color: var(--esr-text); }
.esr-consents input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--esr-text); }
.esr-consents a { text-decoration: underline; text-underline-offset: 3px; }
.esr-checkout__submit { height: 52px; font-size: 16px; }

.esr-summary--checkout { padding: 0; order: -1; }
.esr-summary__fold > summary.esr-summary__title {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 0; padding: 18px 20px;
}
.esr-summary__fold > summary::-webkit-details-marker { display: none; }
.esr-summary__fold > summary .money { font-size: 17px; }
.esr-summary__fold > summary > span:first-child { display: inline-flex; align-items: center; gap: 10px; }
.esr-summary__fold > summary > span:first-child::after {
  content: ""; width: 7px; height: 7px; border-right: 1.6px solid var(--esr-muted); border-bottom: 1.6px solid var(--esr-muted);
  transform: rotate(45deg) translateY(-2px); transition: transform 200ms var(--esr-ease-out);
}
.esr-summary__fold[open] > summary > span:first-child::after { transform: rotate(-135deg) translateY(-1px); }
.esr-summary__fold > .esr-cart-lines, .esr-summary__fold > .esr-totals { margin-left: 20px; margin-right: 20px; }
.esr-summary__fold > .esr-totals { padding: 14px 0 20px; margin-bottom: 0; }
.esr-cart-lines--compact { border-top: 1px solid var(--esr-line); }
.esr-cart-lines--compact .esr-cart-line { grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; padding: 12px 0; }
.esr-cart-lines--compact .esr-cart-line__media { width: 56px; height: 56px; border-radius: 12px; background: #fff; }
.esr-cart-lines--compact .esr-cart-line__name { font-size: 14px; }
.esr-cart-lines--compact .esr-cart-line__price { font-size: 14px; }

/* ---------- sipariş sonucu / ödeme ---------- */
.esr-result { text-align: center; padding: 32px 0 8px; display: grid; justify-items: center; gap: 10px; }
.esr-result .esr-page-title { font-size: clamp(26px, 3.2vw, 36px); }
.esr-result .esr-notice { margin: 8px 0 0; }
.esr-result__icon { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 6px; }
.esr-result__icon--ok { background: var(--esr-accent); color: var(--esr-accent-ink); }
.esr-result__icon--error { background: #fcecef; color: var(--esr-danger); }
.esr-result__number { margin: 0; color: var(--esr-muted); }
.esr-result__number b { color: var(--esr-text); font-weight: 600; }
.esr-result__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 24px; }
.esr-result-page .esr-box { margin-top: 20px; }

.esr-order-lines { list-style: none; margin: 0 0 12px; padding: 0; }
.esr-order-lines__row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--esr-line); font-size: 14px; }
.esr-order-lines__body { display: grid; gap: 2px; min-width: 0; }
.esr-order-lines__name { overflow-wrap: anywhere; }
.esr-order-lines__meta { font-size: 13px; color: var(--esr-muted); }

.esr-payment-frame { border-radius: var(--esr-radius); overflow: hidden; border: 1px solid var(--esr-line); background: #fff; }
.esr-payment-frame iframe { display: block; width: 100%; border: 0; }

/* ---------- giriş / üye ol ---------- */
.esr-auth { padding: 24px 0 8px; }
.esr-auth__switch { margin-bottom: 26px; display: flex; width: 100%; }
.esr-auth__switch a { flex: 1; justify-content: center; }
.esr-auth__title { font-size: clamp(26px, 3.2vw, 34px); }
.esr-auth__sub { margin-bottom: 22px; }
.esr-auth .esr-form-stack { margin-top: 4px; }
.esr-auth .esr-btn-block { margin-top: 6px; height: 50px; }
.esr-auth__alt { margin: 20px 0 0; font-size: 14px; color: var(--esr-muted); text-align: center; }
.esr-auth__alt a { color: var(--esr-text); text-decoration: underline; text-underline-offset: 3px; }
.esr-auth__alt--muted { margin-top: 10px; }
.esr-auth__alt--muted a { color: var(--esr-muted); }

/* ---------- hesap ---------- */
.esr-acc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: start; }
.esr-acc__content { min-width: 0; }
.esr-acc-nav {
  display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain;
  margin: 0 calc(-1 * var(--esr-gutter)); padding: 0 var(--esr-gutter) 2px;
}
.esr-acc-nav::-webkit-scrollbar { display: none; }
.esr-acc-nav a, .esr-acc-nav button {
  flex-shrink: 0; display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border-radius: 19px;
  border: 1px solid var(--esr-line); font-size: 14px; color: var(--esr-text); background: #fff; white-space: nowrap;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}
.esr-acc-nav a[aria-current="page"] { background: var(--esr-text); border-color: var(--esr-text); color: #fff; }
.esr-acc-nav__logout { margin: 0; display: contents; }
.esr-acc-nav__logout button { color: var(--esr-muted); }
.esr-acc__section-title { font: 600 19px/1.2 var(--esr-font-display); letter-spacing: -0.01em; margin: 0 0 12px; }
.esr-acc__content > section + section { margin-top: 28px; }
.esr-acc__content .esr-commerce-back { margin-bottom: 14px; }

.esr-list { list-style: none; margin: 0; padding: 0; background: var(--esr-surface); border-radius: var(--esr-radius); overflow: hidden; }
.esr-list > li + li { border-top: 1px solid var(--esr-line); }
.esr-list__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; min-height: 60px; transition: background-color 160ms ease; }
@media (hover: hover) and (pointer: fine) { a.esr-list__row:hover { background: var(--esr-surface-2); } }
.esr-list__main { display: grid; gap: 2px; min-width: 0; }
.esr-list__main b { font-weight: 600; font-size: 15px; }
.esr-list__main small { font-size: 13px; color: var(--esr-muted); }
.esr-list__side { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; font-size: 15px; }
.esr-list__side svg { color: var(--esr-faint); }
.esr-list__badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }

.esr-acc-device {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 18px; margin-bottom: 24px;
  border-radius: var(--esr-radius); background: var(--esr-accent-soft, #eefae8); transition: background-color 160ms ease;
}
.esr-acc-device__copy { display: grid; line-height: 1.3; min-width: 0; }
.esr-acc-device__copy small { font-size: 12px; color: var(--esr-muted); }
.esr-acc-device__copy b { font-weight: 600; overflow-wrap: anywhere; }
.esr-acc-device svg { color: var(--esr-muted); flex-shrink: 0; }
.esr-acc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 10px; }

.esr-return-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--esr-line); }
.esr-return-item .esr-check { min-width: 0; }
.esr-return-item__qty { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.esr-return-item__qty .esr-input { width: 72px; height: 38px; }

/* ---------- Cihazım ---------- */
.esr-device-local {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px;
  padding: 14px 16px; margin-bottom: 16px; border-radius: 20px; background: var(--esr-accent-soft, #eefae8);
}
.esr-device-local__copy { display: grid; line-height: 1.3; min-width: 0; }
.esr-device-local__copy small { font-size: 12px; color: var(--esr-muted); }
.esr-device-local__copy b { font-weight: 600; font-size: 16px; overflow-wrap: anywhere; }
.esr-device-local__actions { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; }
.esr-device-cta__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.esr-device-cta .esr-box__title { margin-bottom: 0; }
.esr-device-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.esr-device-toolbar + .esr-box { margin: 0 0 16px; }
.esr-device-form__actions { display: flex; justify-content: flex-end; gap: 8px; }
.esr-device-empty { padding: 32px 0; }

.esr-device-item { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; align-items: center; padding: 14px 16px; }
.esr-device-item__mark {
  width: 44px; height: 44px; border-radius: 50%; background: #fff; display: grid; place-items: center; overflow: hidden;
  font-weight: 600; font-size: 17px; color: var(--esr-text); grid-row: span 1;
}
.esr-device-item__mark img { width: 100%; height: 100%; object-fit: contain; padding: 8px; }
.esr-device-item__copy { display: grid; gap: 2px; min-width: 0; justify-items: start; }
.esr-device-item__copy b { font-weight: 600; font-size: 15px; overflow-wrap: anywhere; }
.esr-device-item__copy small { font-size: 13px; color: var(--esr-muted); }
.esr-device-item__copy .esr-badge { margin-top: 4px; }
.esr-device-item__actions { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 8px; }
.esr-device-item__actions .esr-text-btn { min-height: 38px; }

/* ---------- sayfa içi onay penceresi ---------- */
.esr-dialog {
  border: 0; border-radius: var(--esr-radius); padding: 22px; width: min(360px, calc(100vw - 32px));
  background: #fff; color: var(--esr-text); box-shadow: 0 20px 50px rgba(0, 0, 0, .18);
}
.esr-dialog::backdrop { background: rgba(0, 0, 0, .28); }
.esr-dialog[open] { animation: esr-dialog-in 200ms var(--esr-ease-out); }
.esr-dialog--fallback { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 70; }
.esr-dialog__text { margin: 0 0 18px; font-size: 16px; line-height: 1.45; }
.esr-dialog__actions { display: flex; justify-content: flex-end; gap: 8px; }
@keyframes esr-dialog-in { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }

/* ---------- geniş ekran ---------- */
@media (min-width: 560px) {
  .esr-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .esr-form-grid__full { grid-column: 1 / -1; }
  .esr-device-item { grid-template-columns: 44px minmax(0, 1fr) auto; }
  .esr-device-item__actions { grid-column: 3; margin-top: 0; justify-content: flex-end; }
}

@media (min-width: 760px) {
  .esr-cart-line { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 18px; padding: 20px 0; }
  .esr-cart-line__media { width: 96px; height: 96px; }
  .esr-cart-reco__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 16px; }
  .esr-acc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 16px; }
  .esr-box { padding: 22px 24px; }
}

@media (min-width: 900px) {
  .esr-cart { grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; }
  .esr-summary { position: sticky; top: calc(var(--esr-header-h) + 20px); }
  .esr-cart-bar { display: none; }
  .esr-cart-page { padding-bottom: 64px; }
  .esr-cart-page .esr-summary__cta { display: flex; }

  .esr-checkout { grid-template-columns: minmax(0, 1fr) 380px; gap: 48px; }
  .esr-summary--checkout { position: sticky; top: calc(var(--esr-header-h) + 20px); order: 0; }
  .esr-summary__fold > summary { pointer-events: none; }
  .esr-summary__fold > summary > span:first-child::after { display: none; }

  .esr-acc { grid-template-columns: 200px minmax(0, 1fr); gap: 40px; }
  .esr-acc-nav { display: grid; gap: 2px; margin: 0; padding: 0; overflow: visible; position: sticky; top: calc(var(--esr-header-h) + 20px); }
  .esr-acc-nav a, .esr-acc-nav button {
    height: 40px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: var(--esr-muted); width: 100%; text-align: left;
  }
  .esr-acc-nav a[aria-current="page"] { background: var(--esr-surface); color: var(--esr-text); font-weight: 500; }
  .esr-acc-nav__logout { display: block; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--esr-line); }
}
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  .esr-acc-nav a:hover, .esr-acc-nav button:hover { color: var(--esr-text); }
}

@media (prefers-reduced-motion: reduce) {
  .esr-dialog[open] { animation: none; }
  .esr-ship__bar i, .esr-cart-qty__btn, .esr-disclosure > summary::after { transition: none; }
}

/* yüzey içinde ikincil düğme beyaz kalsın */
.esr-box .esr-btn-ghost { background: #fff; }
@media (hover: hover) and (pointer: fine) { .esr-box .esr-btn-ghost:hover { background: var(--esr-surface-2); } }
.esr-box + .esr-muted { margin-top: 16px; }