/*
 * Eklenti paleti.
 *
 * Bu değişkenler bugüne dek hiçbir yerde TANIMLANMAMIŞTI: her kural yalnızca
 * var(--smm-x, açık-renk) yedeğiyle çalışıyordu. Açık temada fark edilmiyordu;
 * karanlık temada ise eklenti yüzeyleri açık kalırken yazı rengi gövdeden
 * beyaza yakın miras alınıyor ve yazı görünmez oluyordu (ör. canlı destek
 * penceresinde yazılan mesaj). Açık değerler yedeklerin birebir aynısı;
 * karanlık değerler temanın karanlık paletiyle uyumlu.
 */
:root {
	--smm-surface: #ffffff;
	--smm-surface-2: #faf7f4;
	--smm-bg: #fdfbf9;
	--smm-bg-2: #f6f1ec;
	--smm-line: #e6ded6;
	--smm-line-strong: #d5c9bf;
	--smm-border: #e6ded6;
	--smm-text: #241d18;
	--smm-muted: #7a6f66;
}

[data-theme="dark"] {
	--smm-surface: #221c17;
	--smm-surface-2: #2a231d;
	--smm-bg: #17130f;
	--smm-bg-2: #1d1814;
	--smm-line: #362d26;
	--smm-line-strong: #493d33;
	--smm-border: #362d26;
	--smm-text: #f6f1ec;
	--smm-muted: #a99c92;
	--smm-brand-soft: #2e1c10;
	--smm-ok-soft: #12241a;
}

/**
 * SMM Core — storefront styles.
 *
 * Flat, light-first commerce UI. Every colour is a token so the active theme can
 * repaint it; the fallbacks keep the plugin presentable in any other theme.
 */

/* `hidden` must always win over a component display rule. */
[hidden] { display: none !important; }

/*
 * Renk jetonları yalnızca aşağıdaki kapsayıcılara tanımlanıyordu. Tema bir
 * hizmet kartını bu kapsayıcıların dışında bastığında (ör. hizmet
 * sayfasındaki "benzer paketler" bölümü) --smm-brand tanımsız kalıyor,
 * .smm-btn--primary'nin zemini geçersiz olup saydam kalıyor ve beyaz yazılı
 * "İncele" düğmesi kartın üzerinde tamamen görünmez oluyordu.
 *
 * :where() özgüllüğü sıfırladığı için aşağıdaki kapsayıcı bloğu hâlâ
 * kazanır; bu satır yalnızca tanımsız kalmayı önler.
 */
:where(body) {
	--smm-bg: var(--sp-surface, #ffffff);
	--smm-bg-2: var(--sp-surface-2, #f5f1ee);
	--smm-band: var(--sp-bg-2, #faf8f6);
	--smm-line: var(--sp-line, #ece6e1);
	--smm-line-strong: var(--sp-line-strong, #dcd3cc);
	--smm-text: var(--sp-text, #1f1a17);
	--smm-muted: var(--sp-muted, #6e635c);
	--smm-brand: var(--sp-brand, #f4630e);
	--smm-brand-2: var(--sp-brand-2, #ff8a3d);
	--smm-brand-text: var(--sp-brand-text, #c2440a);
	--smm-brand-dark: var(--sp-brand-dark, #d24f06);
	--smm-brand-soft: var(--sp-brand-soft, #fff0e6);
	--smm-on-brand: var(--sp-on-brand, #20160c);
	--smm-on-brand-dark: var(--sp-on-brand-dark, #ffffff);
	--smm-accent: var(--sp-accent, #f5a524);
	--smm-ok: var(--sp-ok, #12a150);
	/* Yeşil metin için ayrı ton: --smm-ok beyaz üzerinde 3,37:1'de kalıyor. */
	--smm-ok-text: var(--sp-ok-text, #0d7a3c);
	--smm-ok-soft: var(--sp-ok-soft, #e8f7ef);
	--smm-warn: var(--sp-warn, #e8830c);
	--smm-err: var(--sp-err, #d92d20);
	--smm-radius: var(--sp-radius, 14px);
	--smm-shadow-sm: var(--sp-shadow-sm, 0 1px 2px rgba(31, 26, 23, .06));
	--smm-shadow: var(--sp-shadow, 0 4px 16px -6px rgba(31, 26, 23, .14));
}

.smm-order,
.smm-catalogue,
.smm-cart,
.smm-checkout,
.smm-account,
.smm-track,
.smm-api-docs,
.smm-auth,
.smm-price-table,
.smm-faq,
.smm-testimonials,
.smm-platforms,
.smm-counters,
.smm-activity {
	--smm-bg: var(--sp-surface, #ffffff);
	--smm-bg-2: var(--sp-surface-2, #f5f1ee);
	--smm-band: var(--sp-bg-2, #faf8f6);
	--smm-line: var(--sp-line, #ece6e1);
	--smm-line-strong: var(--sp-line-strong, #dcd3cc);
	--smm-text: var(--sp-text, #1f1a17);
	--smm-muted: var(--sp-muted, #6e635c);
	--smm-brand: var(--sp-brand, #f4630e);
	--smm-brand-2: var(--sp-brand-2, #ff8a3d);
	/* Metin için erişilebilir koyu ton; zemin rengi --smm-brand kalır. */
	--smm-brand-text: var(--sp-brand-text, #c2440a);
	--smm-brand-dark: var(--sp-brand-dark, #d24f06);
	--smm-brand-soft: var(--sp-brand-soft, #fff0e6);
	--smm-on-brand: var(--sp-on-brand, #20160c);
	--smm-on-brand-dark: var(--sp-on-brand-dark, #ffffff);
	--smm-accent: var(--sp-accent, #f5a524);
	--smm-ok: var(--sp-ok, #12a150);
	/* Yeşil metin için ayrı ton: --smm-ok beyaz üzerinde 3,37:1'de kalıyor. */
	--smm-ok-text: var(--sp-ok-text, #0d7a3c);
	--smm-ok-soft: var(--sp-ok-soft, #e8f7ef);
	--smm-warn: var(--sp-warn, #e8830c);
	--smm-err: var(--sp-err, #d92d20);
	--smm-radius: var(--sp-radius, 14px);
	--smm-shadow-sm: var(--sp-shadow-sm, 0 1px 2px rgba(31, 26, 23, .06));
	--smm-shadow: var(--sp-shadow, 0 4px 16px -6px rgba(31, 26, 23, .14));

	color: var(--smm-text);
	font-size: 15px;
	line-height: 1.6;
}

/* ---------------------------------------------------------------- primitives */

.smm-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
	padding: .75rem 1.3rem;
	border: 1px solid transparent; border-radius: 12px;
	font: inherit; font-weight: 700; font-size: .93rem; line-height: 1.2;
	text-decoration: none; cursor: pointer;
	transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.smm-btn:hover { transform: translateY(-1px); }
.smm-btn:focus-visible { outline: 2px solid var(--smm-brand); outline-offset: 2px; }
.smm-btn[disabled], .smm-btn.is-busy { opacity: .55; pointer-events: none; }

.smm-btn--primary { background: var(--smm-brand); color: var(--smm-on-brand, #fff); box-shadow: var(--smm-shadow-sm); }
.smm-btn--primary:hover { background: var(--smm-brand-dark); color: var(--smm-on-brand-dark, #fff); }

.smm-btn--ghost { background: var(--smm-bg); border-color: var(--smm-line-strong); color: var(--smm-text); }
.smm-btn--ghost:hover { background: var(--smm-bg-2); color: var(--smm-text); }

.smm-btn--lg { padding: .9rem 1.6rem; font-size: 1rem; }
.smm-btn--sm { padding: .45rem .85rem; font-size: .84rem; }
.smm-btn--xs { padding: .34rem .7rem; font-size: .77rem; }
.smm-btn--block { width: 100%; }

.smm-input,
.smm-select {
	width: 100%;
	padding: .8rem .95rem;
	background: var(--smm-bg);
	border: 1px solid var(--smm-line-strong);
	border-radius: 10px;
	color: var(--smm-text);
	font: inherit;
	transition: border-color .15s, box-shadow .15s;
	-webkit-appearance: none;
	appearance: none;
}

.smm-select {
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 19px) calc(1.15rem), calc(100% - 13px) calc(1.15rem);
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
	padding-right: 2.5rem;
}

.smm-input:focus,
.smm-select:focus { outline: none; border-color: var(--smm-brand); box-shadow: 0 0 0 3px var(--smm-brand-soft); }
.smm-input::placeholder { color: color-mix(in srgb, var(--smm-muted) 75%, transparent); }

.smm-input--lg { font-size: 1.3rem; font-weight: 700; }
.smm-input--qty { text-align: center; -moz-appearance: textfield; }
.smm-input--qty::-webkit-outer-spin-button,
.smm-input--qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.smm-label { display: block; margin-bottom: .4rem; font-size: .85rem; font-weight: 600; color: var(--smm-text); }
.smm-field { margin-bottom: 1.05rem; }
.smm-hint { margin: .4rem 0 0; font-size: .8rem; color: var(--smm-muted); }
.smm-link { color: var(--smm-brand-text); text-decoration: none; font-weight: 600; }
.smm-link:hover { text-decoration: underline; }

.smm-check { display: flex; gap: .6rem; align-items: flex-start; margin: .9rem 0; font-size: .86rem; color: var(--smm-muted); cursor: pointer; }
/*
 * Onay kutusu ve ödeme yöntemi radyosu 17x17'ydi: WCAG 2.2'nin 24x24
 * hedef ölçüsünün altında kalıyordu ve dokunmatikte ıskalanıyordu. Kutu
 * 20 px, tıklama alanı ise etrafındaki boşlukla 24 px'e tamamlanıyor.
 */
.smm-check input { margin-top: .1rem; accent-color: var(--smm-brand-text); width: 20px; height: 20px; flex: none; }

.smm-panel {
	background: var(--smm-bg);
	border: 1px solid var(--smm-line);
	border-radius: var(--smm-radius);
	padding: 1.4rem;
	margin-bottom: 1.2rem;
}

.smm-panel__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
.smm-panel__title { display: flex; align-items: center; gap: .6rem; margin: 0 0 1.1rem; font-size: 1.08rem; }
.smm-panel__title span {
	display: grid; place-items: center; width: 26px; height: 26px;
	background: var(--smm-brand-soft); border-radius: 7px; color: var(--smm-brand-text); font-size: .8rem; font-weight: 800;
}
.smm-panel--sticky { position: sticky; top: 88px; }

.smm-notices { display: grid; gap: .5rem; margin-bottom: 1.1rem; }
.smm-notice {
	display: flex; gap: .6rem; align-items: flex-start;
	padding: .85rem 1.05rem;
	border: 1px solid var(--smm-line);
	border-left-width: 3px;
	border-radius: 10px;
	background: var(--smm-bg-2);
	font-size: .89rem;
}
.smm-notice__icon { display: inline-flex; flex: none; }
.smm-notice--error { border-left-color: var(--smm-err); background: color-mix(in srgb, var(--smm-err) 6%, var(--smm-bg)); }
.smm-notice--success { border-left-color: var(--smm-ok); background: var(--smm-ok-soft); }
.smm-notice--info { border-left-color: var(--smm-brand-text); background: var(--smm-brand-soft); }
.smm-notice--warn { border-left-color: var(--smm-warn); background: color-mix(in srgb, var(--smm-warn) 8%, var(--smm-bg)); }
.smm-notice--warn a { font-weight: 600; }

.smm-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.smm-chip {
	display: inline-flex; align-items: center; gap: .4rem;
	padding: .5rem .85rem;
	background: var(--smm-bg);
	border: 1px solid var(--smm-line);
	border-radius: 10px;
	color: var(--smm-text);
	font: inherit; font-size: .87rem; font-weight: 600;
	text-decoration: none; cursor: pointer;
	transition: border-color .15s, background .15s, color .15s;
}
.smm-chip:hover { border-color: var(--smm-line-strong); }
.smm-chip.is-active { background: var(--smm-text); border-color: var(--smm-text); color: var(--smm-bg); }
.smm-chip--sm { padding: .35rem .7rem; font-size: .8rem; }
.smm-chip svg { flex: none; }

.smm-select--native { display: none; }
@container (max-width: 560px) {
	.smm-chips { display: none; }
	.smm-select--native { display: block; }
}
@media (max-width: 560px) {
	.smm-chips { display: none; }
	.smm-select--native { display: block; }
}

/* ---------------------------------------------------------------- order form */

.smm-order {
	position: relative;
	background: var(--smm-bg);
	border: 1px solid var(--smm-line);
	border-radius: var(--smm-radius);
	padding: 1.5rem;
	box-shadow: var(--smm-shadow);
}

.smm-order__glow { display: none; }
.smm-order__title { margin: 0 0 1.2rem; font-size: 1.2rem; }
.smm-order__mascot { position: absolute; top: -22px; right: 10px; width: 78px; pointer-events: none; }
.smm-order__mascot .boostie { --bst-size: 78px; }
.smm-order--compact { padding: 1.2rem; }

.smm-quantity { display: flex; align-items: center; gap: .45rem; }
.smm-quantity__btn {
	flex: none; width: 42px; height: 42px;
	background: var(--smm-bg-2); border: 1px solid var(--smm-line-strong);
	border-radius: 10px; color: var(--smm-text);
	font-size: 1.2rem; line-height: 1; cursor: pointer;
	transition: background .15s, border-color .15s;
}
.smm-quantity__btn:hover { background: var(--smm-brand-soft); border-color: var(--smm-brand); color: var(--smm-brand-text); }
.smm-quantity--sm .smm-quantity__btn { width: 32px; height: 32px; font-size: 1rem; }
.smm-quantity--sm .smm-input { padding: .4rem; width: 72px; }

.smm-range { width: 100%; margin-top: .8rem; accent-color: var(--smm-brand-text); }

.smm-presets { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .7rem; }
.smm-preset {
	padding: .4rem .75rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line);
	border-radius: 8px;
	color: var(--smm-text); font: inherit; font-size: .82rem; font-weight: 600;
	cursor: pointer; transition: background .15s, border-color .15s, color .15s;
	font-variant-numeric: tabular-nums;
}
.smm-preset:hover { border-color: var(--smm-brand); color: var(--smm-brand-text); }
.smm-preset.is-active { background: var(--smm-brand); border-color: var(--smm-brand); color: var(--smm-on-brand, #fff); }

.smm-order__total {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	margin: 1.2rem 0 .5rem; padding: .95rem 1.1rem;
	background: var(--smm-brand-soft);
	border-radius: 12px;
}
.smm-order__total-label { font-size: .87rem; color: var(--smm-text); font-weight: 600; }
.smm-order__total-note { display: block; margin-top: 2px; font-size: .72rem; font-weight: 600; color: var(--smm-muted); text-align: right; }
.smm-order__total-value { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; color: var(--smm-brand-text); font-variant-numeric: tabular-nums; }

.smm-order__error { margin: .5rem 0 0; color: var(--smm-err); font-size: .85rem; }
.smm-order__actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .9rem; }
.smm-order__actions .smm-btn { flex: 1 1 170px; white-space: nowrap; }

.smm-order__trust {
	display: flex; flex-wrap: wrap; gap: .4rem .9rem;
	margin: 1.1rem 0 0; padding: .9rem 0 0; list-style: none;
	border-top: 1px solid var(--smm-line);
	font-size: .79rem; color: var(--smm-muted);
}
.smm-order__trust li { display: inline-flex; align-items: center; gap: .3rem; }
.smm-order__trust svg { color: var(--smm-ok); }

/* ---------------------------------------------------------------- catalogue */

.smm-filters { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.4rem; }
.smm-filters__group { display: flex; flex-wrap: wrap; gap: .45rem; }
.smm-filters--compact { flex-direction: row; flex-wrap: wrap; align-items: center; }
.smm-search { flex: 1; min-width: 190px; }

.smm-grid { display: grid; gap: 1rem; }
.smm-grid--2 { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.smm-grid--3 { grid-template-columns: repeat(auto-fill, minmax(285px, 1fr)); }
.smm-grid--4 { grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); }

.smm-card {
	position: relative;
	display: flex; flex-direction: column; gap: .8rem;
	padding: 1.25rem;
	background: var(--smm-bg);
	border: 1px solid var(--smm-line);
	border-radius: var(--smm-radius);
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.smm-card:hover { border-color: var(--smm-line-strong); box-shadow: var(--smm-shadow); transform: translateY(-2px); }
.smm-card__shine { display: none; }

.smm-card__head { display: flex; align-items: flex-start; gap: .75rem; }
.smm-card__icon {
	display: grid; place-items: center;
	width: 40px; height: 40px; flex: none;
	background: color-mix(in srgb, var(--plat, var(--smm-muted)) 12%, transparent);
	border-radius: 10px;
	color: var(--plat, var(--smm-muted));
}
.smm-card__icon--instagram { --plat: #e1306c; }
.smm-card__icon--tiktok { --plat: #10b5c4; }
.smm-card__icon--youtube { --plat: #ff0033; }
.smm-card__icon--twitter { --plat: var(--smm-text); }
.smm-card__icon--facebook { --plat: #1877f2; }
.smm-card__icon--telegram { --plat: #29a9eb; }
.smm-card__icon--spotify { --plat: #1db954; }
.smm-card__icon--twitch { --plat: #7d40e7; }

/* Two lines, always: a three-line title in one card pushes its price row out of
   step with the cards beside it. */
.smm-card__title {
	margin: 0; font-size: .98rem; line-height: 1.35;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
	overflow: hidden; min-height: 2.7em;
}
.smm-card__title a { color: var(--smm-text); text-decoration: none; }
.smm-card__title a:hover { color: var(--smm-brand-text); }
.smm-card__meta { margin: .15rem 0 0; font-size: .79rem; color: var(--smm-muted); }
.smm-card__badge {
	margin-left: auto; padding: .22rem .55rem;
	background: var(--smm-brand); border-radius: 6px;
	color: var(--smm-on-brand, #fff); font-size: .67rem; font-weight: 700;
	letter-spacing: .02em; white-space: nowrap;
}

.smm-card__specs { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; font-size: .82rem; color: var(--smm-muted); }
.smm-card__specs li { display: flex; gap: .45rem; align-items: center; }
.smm-card__specs svg { color: var(--smm-muted); flex: none; }

.smm-card__foot { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: auto; padding-top: .85rem; border-top: 1px solid var(--smm-line); }
.smm-card__price { display: flex; flex-direction: column; }
.smm-card__price-label { font-size: .71rem; color: var(--smm-muted); }
.smm-card__price-value { font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

.smm-card__rating { display: flex; align-items: center; gap: .35rem; font-size: .81rem; }
.smm-card__rating-count { color: var(--smm-muted); }

/* Boş yıldız izi çizgi rengiyle karanlık modda kayboluyordu. */
.smm-stars { position: relative; display: inline-block; color: var(--smm-muted, var(--sp-muted, #6e635c)); font-size: .92rem; letter-spacing: .06em; }
/*
 * Puan yıldızları --sp-accent tonundaydı: beyaz üzerinde 2,04:1, grafik
 * öğeler için gereken 3:1 eşiğinin altında — dolu yıldızla boş yıldız
 * ayırt edilemiyordu. Kendi tonunu kullanıyor (3,19:1), rengi hâlâ altın.
 */
.smm-stars__fill { position: absolute; inset: 0; overflow: hidden; color: var(--smm-star, #d97706); white-space: nowrap; }
.smm-stars__value { margin-left: .3rem; font-weight: 700; }

/* ---------------------------------------------------------------- platform cards */

.smm-platforms { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: .8rem; }
.smm-platform {
	display: flex; flex-direction: column; align-items: center; gap: .25rem;
	padding: 1.25rem .85rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius);
	color: var(--smm-text); text-decoration: none; text-align: center;
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.smm-platform:hover { border-color: var(--smm-line-strong); box-shadow: var(--smm-shadow); transform: translateY(-2px); }
.smm-platform__icon { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: .4rem; background: var(--smm-bg-2); border-radius: 12px; }
.smm-platform__name { font-weight: 700; }
.smm-platform__price { font-size: .78rem; color: var(--smm-brand-text); font-weight: 600; }
.smm-platform__count { font-size: .73rem; color: var(--smm-muted); }

/* ---------------------------------------------------------------- counters & activity */

.smm-counters {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1px; overflow: hidden;
	background: var(--smm-line); border: 1px solid var(--smm-line); border-radius: var(--smm-radius);
}
.smm-counter { padding: 1.3rem 1rem; text-align: center; background: var(--smm-bg); }
.smm-counter__value { display: block; font-size: 1.75rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--smm-text); }
.smm-counter__label { display: block; margin-top: .2rem; font-size: .8rem; color: var(--smm-muted); }

.smm-activity__list { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.smm-activity__item {
	display: flex; align-items: center; gap: .6rem;
	padding: .6rem .85rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 10px;
	font-size: .83rem;
}
.smm-activity__icon { display: grid; place-items: center; width: 26px; height: 26px; flex: none; background: var(--smm-bg-2); border-radius: 7px; }
.smm-activity__ago { margin-left: auto; font-size: .74rem; color: var(--smm-muted); white-space: nowrap; }

/* ---------------------------------------------------------------- cart & checkout */

.smm-cart__layout,
.smm-checkout__layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1.3rem; align-items: start; }
@media (max-width: 900px) { .smm-cart__layout, .smm-checkout__layout { grid-template-columns: 1fr; } }

.smm-cart__items { display: grid; gap: .7rem; }
.smm-cart__row {
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto;
	align-items: center; gap: .85rem;
	padding: .95rem 1.1rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 12px;
}
/*
 * Dar ekranda satır masaüstü düzenini koruyordu: adet kutusu bilgi sütununu
 * 77 piksele sıkıştırıyor, hizmet adı üç satıra bölünüyor ve hedef adresi
 * okunmaz hale geliyordu. Ad ile hedef üstte tam genişlikte durur, adet ve
 * tutar alt satırı paylaşır.
 */
@media (max-width: 640px) {
	.smm-cart__row {
		grid-template-columns: auto minmax(0, 1fr) auto;
		grid-template-areas:
			"ikon bilgi sil"
			"adet adet tutar";
		row-gap: .7rem; column-gap: .7rem;
	}
	.smm-cart__icon { grid-area: ikon; align-self: start; }
	.smm-cart__info { grid-area: bilgi; }
	.smm-cart__remove { grid-area: sil; align-self: start; }
	.smm-cart__qty { grid-area: adet; justify-items: start; }
	.smm-cart__price { grid-area: tutar; justify-self: end; align-self: center; font-size: 1.05rem; }
	.smm-cart__limits { text-align: start; }
}
.smm-cart__icon { display: grid; place-items: center; width: 36px; height: 36px; background: var(--smm-bg-2); border-radius: 10px; }
.smm-cart__info { display: flex; flex-direction: column; gap: .18rem; min-width: 0; }
.smm-cart__name { color: var(--smm-text); font-weight: 700; text-decoration: none; font-size: .95rem; line-height: 1.35; }
.smm-cart__name:hover { color: var(--smm-brand-text); }
.smm-cart__target {
	display: inline-flex; align-items: center; gap: .3rem; max-width: 100%;
	font-size: .77rem; color: var(--smm-muted);
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.smm-cart__target svg { flex: none; }

.smm-cart__meta { display: flex; flex-wrap: wrap; gap: .1rem .8rem; margin: .15rem 0 0; padding: 0; list-style: none; }
.smm-cart__meta li { display: inline-flex; align-items: center; gap: .28rem; font-size: .74rem; color: var(--smm-muted); }
.smm-cart__meta svg { color: var(--smm-ok); flex: none; }

.smm-cart__comments { margin-top: .3rem; font-size: .76rem; }
.smm-cart__comments summary { cursor: pointer; color: var(--smm-brand-text); }
.smm-cart__comments pre {
	margin: .4rem 0 0; padding: .5rem .6rem; max-height: 140px; overflow: auto;
	background: var(--smm-bg-2); border-radius: 8px;
	font: inherit; white-space: pre-wrap; word-break: break-word; color: var(--smm-muted);
}

.smm-cart__qty { display: grid; justify-items: center; gap: .28rem; }
.smm-cart__limits { font-size: .68rem; color: var(--smm-muted); white-space: nowrap; }
.smm-cart__fixed-qty { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 12px; border: 1px dashed var(--smm-border); border-radius: 10px; line-height: 1.1; }
.smm-cart__fixed-qty strong { font-size: 1rem; }
.smm-cart__fixed-qty span { font-size: .68rem; color: var(--smm-muted); }

.smm-cart__price { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.smm-cart__remove {
	display: grid; place-items: center;
	width: 32px; height: 32px; background: transparent; border: 1px solid var(--smm-line);
	border-radius: 8px; color: var(--smm-muted); cursor: pointer;
	/* `transition: all` odak halkasını da animasyona sokuyordu: klavyeyle
	   gelindiğinde halka anında değil 150 ms'de beliriyordu. */
	transition: border-color .15s, color .15s, background .15s;
}
.smm-cart__remove:hover { border-color: var(--smm-err); color: var(--smm-err); background: color-mix(in srgb, var(--smm-err) 7%, var(--smm-bg)); }
/* Klavyeyle gezerken bu düğmenin seçili olduğu görünmüyordu. */
.smm-cart__remove:focus-visible { outline: 2px solid var(--smm-brand); outline-offset: 2px; }

.smm-cart__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .6rem; margin-bottom: .9rem; }
.smm-cart__head h2 { margin: 0; font-size: 1.12rem; }

.smm-cart__summary { position: sticky; top: 88px; }
.smm-cart__summary-inner { background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius); padding: 1.3rem; }
.smm-cart__note { margin: .9rem 0 0; font-size: .77rem; color: var(--smm-muted); }

.smm-assure { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .45rem; font-size: .78rem; color: var(--smm-muted); }
.smm-assure li { display: flex; align-items: center; gap: .45rem; }
.smm-assure svg { color: var(--smm-ok); flex: none; }

/* ------------------------------------------------------------- step rail */

.smm-steps {
	display: flex; align-items: center; gap: .5rem;
	margin: 0 0 1.4rem; padding: 0; list-style: none;
	font-size: .84rem; color: var(--smm-muted);
}
.smm-steps__item { display: flex; align-items: center; gap: .45rem; }
.smm-steps__item + .smm-steps__item::before {
	content: ''; width: 22px; height: 1px; margin-right: .5rem; background: var(--smm-line-strong);
}
.smm-steps__dot {
	display: grid; place-items: center; width: 24px; height: 24px;
	background: var(--smm-bg-2); border: 1px solid var(--smm-line-strong); border-radius: 50%;
	font-size: .75rem; font-weight: 700;
}
.smm-steps__item.is-current .smm-steps__dot { background: var(--smm-brand); border-color: var(--smm-brand); color: var(--smm-on-brand, #fff); }
.smm-steps__item.is-current .smm-steps__label { color: var(--smm-text); font-weight: 700; }
.smm-steps__item.is-done .smm-steps__dot { background: var(--smm-ok); border-color: var(--smm-ok); color: #fff; }
@media (max-width: 520px) { .smm-steps__item:not(.is-current) .smm-steps__label { display: none; } }

/* --------------------------------------------------- empty-cart suggestions */

.smm-empty__picks { width: min(100%, 430px); margin-top: 1.6rem; text-align: left; }
.smm-empty__picks h3 { margin: 0 0 .6rem; font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--smm-muted); }
.smm-empty__picks ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: minmax(0, 1fr); gap: .45rem; }
.smm-empty__picks a {
	display: flex; align-items: center; gap: .6rem;
	padding: .65rem .8rem; background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 10px;
	color: var(--smm-text); text-decoration: none; font-size: .87rem;
}
.smm-empty__picks a:hover { border-color: var(--smm-brand); }
.smm-empty__picks span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smm-empty__picks strong { color: var(--smm-brand-text); white-space: nowrap; }

.smm-coupon { display: flex; gap: .45rem; margin-bottom: .4rem; }
.smm-coupon--tight { margin-top: .9rem; }
.smm-coupon__msg { min-height: 1.05rem; margin: 0 0 .7rem; font-size: .79rem; }
.smm-coupon__msg.is-error { color: var(--smm-err); }
.smm-coupon__msg.is-ok { color: var(--smm-ok-text); }

.smm-totals { margin: .9rem 0; }
.smm-totals > div { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--smm-line); }
.smm-totals dt, .smm-totals dd { margin: 0; }
.smm-totals dt { color: var(--smm-muted); font-size: .87rem; }
.smm-totals dd { font-weight: 700; font-variant-numeric: tabular-nums; }
.smm-totals .is-discount dd { color: var(--smm-ok-text); }
.smm-totals .is-total { border-bottom: none; padding-top: .8rem; }
.smm-totals .is-total dt { color: var(--smm-text); font-weight: 700; font-size: .98rem; }
.smm-totals .is-total dd { font-size: 1.3rem; font-weight: 800; color: var(--smm-brand-text); }

.smm-methods { display: grid; gap: .55rem; }
.smm-method {
	display: flex; gap: .8rem; align-items: flex-start;
	padding: .9rem 1.05rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 12px;
	cursor: pointer; transition: border-color .15s, background .15s;
}
.smm-method:hover { border-color: var(--smm-line-strong); }
.smm-method:has(input:checked) { border-color: var(--smm-brand); background: var(--smm-brand-soft); }
.smm-method.is-disabled { opacity: .5; cursor: not-allowed; }
.smm-method input { margin-top: .15rem; accent-color: var(--smm-brand-text); width: 20px; height: 20px; flex: none; }
.smm-method__icon { display: grid; place-items: center; width: 30px; height: 30px; flex: none; color: var(--smm-muted); }
.smm-method__body { display: flex; flex-direction: column; gap: .15rem; }
.smm-method__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; font-weight: 700; font-size: .93rem; }
.smm-method__balance { font-style: normal; font-size: .82rem; font-weight: 700; color: var(--smm-brand-text); }
.smm-method__desc { font-size: .81rem; color: var(--smm-muted); }
.smm-method__warn {
	display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
	margin-top: .4rem; padding: .45rem .6rem;
	background: color-mix(in srgb, var(--smm-warn) 10%, var(--smm-bg));
	border-radius: 8px; font-size: .78rem; color: var(--smm-text);
}
.smm-method__warn a { color: var(--smm-brand-text); font-weight: 700; }
.smm-gateway-note { margin-top: .6rem; padding: .7rem .9rem; background: var(--smm-bg-2); border-radius: 10px; font-size: .81rem; }
.smm-gateway-note--mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; word-break: break-all; }

.smm-checkout__items { margin: 0; padding: 0; list-style: none; display: grid; gap: .6rem; }
.smm-checkout__items li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: .75rem; align-items: center; padding-bottom: .6rem; border-bottom: 1px solid var(--smm-line); }
.smm-checkout__item-icon { display: grid; place-items: center; width: 26px; height: 26px; background: var(--smm-bg-2); border-radius: 7px; }
.smm-checkout__item-name { display: flex; flex-direction: column; min-width: 0; font-weight: 600; font-size: .9rem; }
.smm-checkout__item-name em { font-style: normal; font-size: .75rem; color: var(--smm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smm-checkout__item-name small { display: inline-flex; align-items: center; gap: .3rem; margin-top: .15rem; font-size: .72rem; color: var(--smm-ok-text); }
.smm-checkout__item-qty { color: var(--smm-muted); font-size: .84rem; font-variant-numeric: tabular-nums; }
.smm-checkout__item-total { font-weight: 700; font-variant-numeric: tabular-nums; }
.smm-checkout__trust { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .4rem; font-size: .78rem; color: var(--smm-muted); }
.smm-checkout__trust li { display: flex; align-items: center; gap: .4rem; }
.smm-checkout__trust svg { color: var(--smm-ok); flex: none; }

/* ---------------------------------------------------------------- account */

.smm-account { display: grid; grid-template-columns: 246px minmax(0, 1fr); gap: 1.3rem; align-items: start; }
/*
 * "1fr" izleğin en küçük boyutu içeriğin en geniş öğesi kadardır: hesap
 * hareketleri tablosu 1.000 piksele ulaşınca sütun da o kadar genişliyor ve
 * yan menüyle birlikte tüm sayfa yana kayıyordu (390 pikselde 706 piksel
 * taşma). minmax(0, 1fr) izleği ekranla sınırlar.
 */
@media (max-width: 860px) { .smm-account { grid-template-columns: minmax(0, 1fr); } }

.smm-account__nav { background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius); padding: 1.1rem; position: sticky; top: 88px; }
@media (max-width: 860px) { .smm-account__nav { position: static; } }
.smm-account__user { display: flex; gap: .7rem; align-items: center; padding-bottom: .9rem; border-bottom: 1px solid var(--smm-line); }
.smm-account__user strong { display: block; font-size: .93rem; }
/* Baş harf karosu da bir span: bu kural onu display:block yapıp harfi köşeye itiyordu. */
.smm-account__user div span { display: block; font-size: .75rem; color: var(--smm-muted); overflow: hidden; text-overflow: ellipsis; }
.smm-account__avatar { border-radius: 50%; }
.smm-account__balance { display: grid; gap: .3rem; padding: .9rem 0; border-bottom: 1px solid var(--smm-line); }
.smm-account__balance-label { font-size: .75rem; color: var(--smm-muted); }
.smm-account__balance-value { font-size: 1.45rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.smm-account__balance-value--xl { font-size: 2.1rem; color: var(--smm-brand-text); }
.smm-account__menu { display: grid; gap: .1rem; margin-top: .7rem; }
.smm-account__link {
	display: flex; gap: .6rem; align-items: center;
	padding: .6rem .7rem; border-radius: 9px;
	color: var(--smm-text); text-decoration: none; font-size: .89rem; font-weight: 500;
	transition: background .15s, color .15s;
}
.smm-account__link svg { color: var(--smm-muted); flex: none; }
.smm-account__link:hover { background: var(--smm-bg-2); color: var(--smm-text); }
.smm-account__link.is-active { background: var(--smm-brand-soft); color: var(--smm-brand-text); font-weight: 700; }
.smm-account__link.is-active svg { color: var(--smm-brand-text); }

/*
 * Telefonda yan menü ilk ekranı tek başına dolduruyordu: sekiz bağlantı alt
 * alta dizilince siparişler ya da hesap hareketleri 925 piksel aşağıda
 * kalıyor, müşteri her sekmede bir ekran boyu kaydırmak zorundaydı. Menü
 * yatay kaydırılan bir şerit olur; kullanıcı ve bakiye tek satıra iner.
 */
@media (max-width: 860px) {
	.smm-account__nav { display: grid; gap: .65rem; padding: .8rem; }
	.smm-account__user { padding-bottom: 0; border-bottom: 0; }
	.smm-account__balance {
		grid-template-columns: minmax(0, 1fr) auto; align-items: center;
		gap: .1rem .7rem; padding: .6rem .75rem; border: 1px solid var(--smm-line);
		border-bottom: 1px solid var(--smm-line); border-radius: 12px;
	}
	.smm-account__balance-label { grid-column: 1; }
	.smm-account__balance-value { grid-column: 1; font-size: 1.2rem; }
	.smm-account__balance .smm-btn { grid-column: 2; grid-row: 1 / span 2; }

	.smm-account__menu {
		display: flex; gap: .35rem; margin-top: 0; padding-bottom: .15rem;
		overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
	}
	.smm-account__menu::-webkit-scrollbar { display: none; }
	.smm-account__link {
		flex: 0 0 auto; gap: .4rem; padding: .5rem .8rem; border-radius: 999px;
		border: 1px solid var(--smm-line); font-size: .85rem; white-space: nowrap;
	}
	.smm-account__link.is-active { border-color: transparent; }
}

.smm-account__head { position: relative; margin-bottom: 1.2rem; }
.smm-account__head h1 { margin: 0 0 .25rem; font-size: 1.5rem; letter-spacing: -.02em; }
.smm-account__head p { margin: 0; color: var(--smm-muted); font-size: .89rem; }
.smm-account__mascot { position: absolute; top: -14px; right: 0; width: 76px; pointer-events: none; }
.smm-account__mascot .boostie { --bst-size: 76px; }

.smm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: .8rem; margin-bottom: 1.2rem; }
.smm-stat { padding: 1.1rem; background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius); }
.smm-stat__label { display: block; font-size: .77rem; color: var(--smm-muted); }
.smm-stat__value { display: block; margin-top: .2rem; font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

.smm-table-wrap { overflow-x: auto; }
.smm-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.smm-table th, .smm-table td { padding: .7rem .65rem; text-align: start; border-bottom: 1px solid var(--smm-line); white-space: nowrap; }
.smm-table th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--smm-muted); font-weight: 600; }
.smm-table td.is-positive { color: var(--smm-ok-text); font-weight: 700; }
.smm-table td.is-negative { color: var(--smm-err); font-weight: 700; }
.smm-table td small { display: block; font-size: .71rem; color: var(--smm-muted); font-weight: 500; }

.smm-status {
	display: inline-flex; align-items: center; gap: .3rem;
	padding: .24rem .6rem; border-radius: 6px;
	font-size: .74rem; font-weight: 700;
	background: var(--smm-bg-2); color: var(--smm-muted);
}
.smm-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.smm-status--completed { background: var(--smm-ok-soft); color: var(--smm-ok-text); }
.smm-status--inprogress, .smm-status--processing { background: color-mix(in srgb, var(--smm-brand) 10%, transparent); color: var(--smm-brand-dark); }
.smm-status--pending, .smm-status--awaiting { background: color-mix(in srgb, var(--smm-warn) 12%, transparent); color: var(--smm-warn); }
.smm-status--canceled, .smm-status--failed { background: color-mix(in srgb, var(--smm-err) 10%, transparent); color: var(--smm-err); }
.smm-status--partial, .smm-status--refunded { background: color-mix(in srgb, #7d40e7 10%, transparent); color: #6b32c9; }

.smm-progress { height: 6px; background: var(--smm-bg-2); border-radius: 999px; overflow: hidden; }
.smm-progress__bar { height: 100%; background: var(--smm-brand); border-radius: inherit; transition: width .4s ease; }
.smm-progress--sm { height: 4px; }

.smm-orders { display: grid; gap: .7rem; }
.smm-order-row {
	display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
	gap: 1rem; align-items: center;
	padding: 1rem 1.15rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 12px;
}
@media (max-width: 780px) { .smm-order-row { grid-template-columns: 1fr; } }
.smm-order-row__main { display: flex; gap: .7rem; align-items: flex-start; min-width: 0; }
.smm-order-row__icon { display: grid; place-items: center; width: 34px; height: 34px; flex: none; background: var(--smm-bg-2); border-radius: 9px; }
.smm-order-row__main h3 { margin: 0; font-size: .92rem; }
.smm-order-row__meta { display: flex; flex-wrap: wrap; gap: .4rem .8rem; margin: .25rem 0 0; font-size: .75rem; color: var(--smm-muted); }
.smm-order-row__meta code { background: var(--smm-bg-2); padding: .08rem .35rem; border-radius: 5px; }
.smm-order-row__numbers { display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem; font-size: .71rem; color: var(--smm-muted); }
.smm-order-row__numbers strong { display: block; font-size: .92rem; color: var(--smm-text); font-variant-numeric: tabular-nums; }
.smm-order-row__side { display: flex; flex-direction: column; gap: .45rem; align-items: flex-start; }

.smm-thread { display: grid; gap: .8rem; margin-bottom: 1.1rem; }
.smm-thread__msg { padding: .9rem 1.1rem; background: var(--smm-bg-2); border: 1px solid var(--smm-line); border-radius: 12px; }
.smm-thread__msg--staff { background: var(--smm-brand-soft); border-color: color-mix(in srgb, var(--smm-brand) 25%, transparent); }
.smm-thread__meta { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .4rem; font-size: .75rem; color: var(--smm-muted); }
.smm-thread__body p:last-child { margin-bottom: 0; }
.smm-reply { display: grid; gap: .6rem; justify-items: start; }
.smm-reply textarea { width: 100%; }

/* İade edilen tutar, ödenen tutardan ayırt edilebilmeli. */
.smm-order-row__refund strong { color: var(--smm-ok, #12a150); }

/* Hesap hareketinden ilgili siparişe geçiş. */
.smm-tx__order { display: inline-block; margin-left: .35rem; padding: .05rem .4rem; background: var(--smm-bg-2); border-radius: 6px; color: var(--smm-brand-text); font-size: .8rem; text-decoration: none; white-space: nowrap; }
.smm-tx__order:hover { text-decoration: underline; }

/* Ödemesi bekleyen siparişte havale/kripto talimatları. */
.smm-order-row__pay { margin-top: .6rem; padding: .75rem .9rem; background: var(--smm-brand-soft); border-radius: 10px; font-size: .88rem; }
.smm-order-row__pay > summary { cursor: pointer; font-weight: 700; color: var(--smm-brand-text); }
.smm-order-row__pay p { margin: .5rem 0; }
.smm-order-row__pay-facts { display: flex; flex-wrap: wrap; gap: .4rem 1.6rem; margin: .5rem 0 0; }
.smm-order-row__pay-facts dt { color: var(--smm-muted); font-size: .78rem; }
.smm-order-row__pay-facts dd { margin: 0; }
.smm-order-row__pay-note { color: var(--smm-muted); font-size: .8rem; }

/* Boş katalog sonucunda öneri cümlesi. */
.smm-empty__hint { margin-top: -.35rem; color: var(--smm-muted); font-size: .9rem; }

.smm-ticket-facts {
	margin: 0 0 1rem; padding: .8rem .95rem; list-style: none;
	display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .7rem 1.2rem;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 12px;
}
.smm-ticket-facts li { display: grid; gap: .15rem; min-width: 0; }
.smm-ticket-facts span { font-size: .78rem; color: var(--smm-muted); text-transform: uppercase; letter-spacing: .04em; }
.smm-ticket-facts strong { font-size: .95rem; font-weight: 600; overflow-wrap: anywhere; }

.smm-ticket-list { margin: 0; padding: 0; list-style: none; display: grid; gap: .45rem; }
.smm-ticket-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .75rem; align-items: center; padding: .75rem .9rem; background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 10px; color: var(--smm-text); text-decoration: none; }
.smm-ticket-list a:hover { border-color: var(--smm-line-strong); }
.smm-ticket-list__subject { font-weight: 600; font-size: .89rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smm-ticket-list time { font-size: .73rem; color: var(--smm-muted); }

.smm-support { display: grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); gap: 1.1rem; align-items: start; }
.smm-deposit { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 1.1rem; align-items: start; }
@media (max-width: 860px) { .smm-deposit { grid-template-columns: 1fr; } }
.smm-deposit__side { text-align: center; display: grid; gap: .5rem; justify-items: center; }
.smm-deposit__side .boostie { --bst-size: 130px; }

.smm-bonus { margin: .9rem 0; padding: .9rem 1.1rem; background: var(--smm-brand-soft); border-radius: 12px; }
.smm-bonus h3 { margin: 0 0 .4rem; font-size: .93rem; }
.smm-bonus ul { margin: 0; padding-left: 1rem; font-size: .83rem; color: var(--smm-muted); }
.smm-bonus__calc { margin: .6rem 0 0; font-weight: 700; color: var(--smm-ok-text); min-height: 1.2rem; }

.smm-copy { display: flex; gap: .45rem; }
.smm-copy .smm-input { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .84rem; }
.smm-share { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .8rem; }
.smm-checklist { margin: .9rem 0 0; padding: 0; list-style: none; display: grid; gap: .45rem; font-size: .81rem; color: var(--smm-muted); text-align: start; }
.smm-checklist li { display: flex; gap: .45rem; align-items: flex-start; }
.smm-checklist li::before { content: '✓'; color: var(--smm-ok-text); font-weight: 800; }

.smm-deflist { margin: .9rem 0 0; }
.smm-deflist > div { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--smm-line); }
.smm-deflist dt, .smm-deflist dd { margin: 0; }
.smm-deflist dt { color: var(--smm-muted); font-size: .83rem; }
.smm-deflist dd { font-weight: 600; text-align: end; word-break: break-all; font-size: .88rem; }

.smm-pagination { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: 1.1rem; }
.smm-pagination__link { padding: .42rem .75rem; background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 8px; color: var(--smm-text); text-decoration: none; font-size: .84rem; }
.smm-pagination__link.is-active { background: var(--smm-text); border-color: var(--smm-text); color: var(--smm-bg); }

/* Sütun genişliği içerikten hesaplandığı için boş sepet önerileri dar
   telefonlarda ekranı yatay kaydırıyordu. */
.smm-empty { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; gap: .7rem; padding: 2.2rem 1.3rem; text-align: center; color: var(--smm-muted); }
.smm-empty--lg { padding: 3.4rem 1.3rem; }
.smm-empty h2 { margin: 0; color: var(--smm-text); }
.smm-empty .boostie { --bst-size: 140px; }
.smm-inline-form { display: inline; }

/* ---------------------------------------------------------------- auth */

.smm-auth { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem; align-items: center; max-width: 860px; margin-inline: auto; }
@media (max-width: 780px) { .smm-auth { grid-template-columns: 1fr; } .smm-auth__art { display: none; } }
.smm-auth__art { text-align: center; }
.smm-auth__art .boostie { --bst-size: 180px; margin-inline: auto; }
.smm-auth__art h2 { margin: 1rem 0 .3rem; letter-spacing: -.02em; }
.smm-auth__art p { color: var(--smm-muted); }
.smm-auth__forms { background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius); padding: 1.5rem; box-shadow: var(--smm-shadow); }
.smm-tabs { display: flex; gap: .25rem; margin-bottom: 1.2rem; padding: .25rem; background: var(--smm-bg-2); border-radius: 10px; }
.smm-tabs__btn { flex: 1; padding: .55rem; background: transparent; border: 0; border-radius: 8px; color: var(--smm-muted); font: inherit; font-weight: 700; font-size: .88rem; cursor: pointer; transition: all .15s; }
.smm-tabs__btn.is-active { background: var(--smm-bg); color: var(--smm-text); box-shadow: var(--smm-shadow-sm); }

/* ---------------------------------------------------------------- faq, reviews, packages */

.smm-faq { display: grid; gap: .5rem; }
.smm-faq__item { background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 12px; overflow: hidden; }
.smm-faq__q { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; font-weight: 600; font-size: .95rem; cursor: pointer; list-style: none; }
.smm-faq__q::-webkit-details-marker { display: none; }
.smm-faq__chev { width: 9px; height: 9px; border-right: 2px solid var(--smm-muted); border-bottom: 2px solid var(--smm-muted); transform: rotate(45deg); transition: transform .2s; flex: none; }
.smm-faq__item[open] .smm-faq__q { border-bottom: 1px solid var(--smm-line); }
.smm-faq__item[open] .smm-faq__chev { transform: rotate(-135deg); }
.smm-faq__a { padding: 1rem 1.2rem; color: var(--smm-muted); font-size: .91rem; }
.smm-faq__a p:last-child { margin-bottom: 0; }

.smm-testimonials { display: grid; grid-template-columns: repeat(auto-fill, minmax(275px, 1fr)); gap: 1rem; }
.smm-testimonial { margin: 0; padding: 1.3rem; background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius); }
.smm-testimonial__stars { color: var(--smm-accent); }
.smm-testimonial blockquote { margin: .5rem 0 .9rem; font-size: .92rem; }
.smm-testimonial figcaption { display: flex; flex-direction: column; }
.smm-testimonial__name { font-weight: 700; font-size: .9rem; }
.smm-testimonial__role { font-size: .77rem; color: var(--smm-muted); }

.smm-price-table__title { margin: 0 0 .9rem; }
.smm-price-table__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: .8rem; }
.smm-package {
	position: relative; display: grid; gap: .2rem; justify-items: center;
	padding: 1.4rem 1rem 1.1rem; text-align: center;
	background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: var(--smm-radius);
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.smm-package:hover { box-shadow: var(--smm-shadow); transform: translateY(-2px); }
.smm-package.is-featured { border-color: var(--smm-brand); }
.smm-package__badge { position: absolute; top: -9px; padding: .18rem .55rem; background: var(--smm-brand); border-radius: 6px; color: var(--smm-on-brand, #fff); font-size: .67rem; font-weight: 700; white-space: nowrap; }
.smm-package__qty { font-size: 1.7rem; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.smm-package__name { font-size: .81rem; color: var(--smm-muted); }
.smm-package__price { margin: .35rem 0 .6rem; font-size: 1.15rem; font-weight: 800; color: var(--smm-brand-text); font-variant-numeric: tabular-nums; }
.smm-package .smm-btn { width: 100%; }

/* ---------------------------------------------------------------- code */

.smm-code { margin: .9rem 0; border: 1px solid var(--smm-line); border-radius: 12px; overflow: hidden; background: var(--smm-bg-2); }
.smm-code__head { display: flex; align-items: center; justify-content: space-between; padding: .55rem .9rem; border-bottom: 1px solid var(--smm-line); font-size: .74rem; color: var(--smm-muted); text-transform: uppercase; letter-spacing: .04em; }
.smm-code__copy { background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 7px; padding: .22rem .55rem; color: inherit; font: inherit; font-size: .71rem; cursor: pointer; }
.smm-code pre { margin: 0; padding: .9rem; overflow-x: auto; font-size: .81rem; line-height: 1.55; }
.smm-api-docs__block h3 { margin-top: 0; }
.smm-api-docs__note { margin: -.2rem 0 .8rem; font-size: .86rem; color: var(--smm-muted); }
.smm-code--wrap pre { white-space: pre-wrap; word-break: break-word; }
.smm-list { margin: .6rem 0 0; padding-left: 1.1rem; display: grid; gap: .45rem; font-size: .9rem; }
.smm-list li { line-height: 1.5; }

.smm-track__form { max-width: 620px; margin-bottom: 1.6rem; }
.smm-track__row { display: flex; gap: .5rem; }
.smm-track__fields { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem; }
.smm-track__fields .smm-field { flex: 1 1 210px; margin: 0; }
.smm-track__fields .smm-btn { flex: none; }
.smm-track__form .smm-hint { margin: .6rem 0 0; }
.smm-track__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.smm-track__head h2 { margin: 0; font-size: 1.15rem; }

@media (prefers-reduced-motion: reduce) {
	.smm-btn, .smm-card, .smm-progress__bar, .smm-package, .smm-platform { transition: none !important; transform: none !important; }
	.smm-activity__item { animation: none; }
}

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---------------------------------------------------------------- fit & flow fixes */

/* Panel headings must not inherit the page-level h2 scale. */
.smm-panel h2,
.smm-cart__summary h2,
.smm-account__body .smm-panel__header h2 { margin-top: 0; font-size: 1.12rem; }

/* Long target links have to truncate or they run into the numbers column. */
.smm-order-row__main > div { min-width: 0; }
.smm-order-row__meta { min-width: 0; }
.smm-order-row__meta span,
.smm-order-row__meta code { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smm-order-row__numbers { min-width: 0; }
.smm-order-row__numbers span { min-width: 0; }

/* Initials avatar — no external request, so it never renders as a broken image. */
.smm-avatar {
	display: grid; place-items: center; flex: none;
	width: var(--smm-avatar-size, 56px); height: var(--smm-avatar-size, 56px);
	border-radius: 50%;
	background: hsl(var(--smm-avatar-hue, 24) 68% 92%);
	color: hsl(var(--smm-avatar-hue, 24) 62% 32%);
	font-size: calc(var(--smm-avatar-size, 56px) * .38);
	font-weight: 800; letter-spacing: .02em; line-height: 1;
	user-select: none;
}
[data-theme="dark"] .smm-avatar {
	background: hsl(var(--smm-avatar-hue, 24) 40% 22%);
	color: hsl(var(--smm-avatar-hue, 24) 72% 78%);
}

/* ------------------------------------------------- sipariş alındı ekranı */

.smm-placed {
	margin-bottom: 1.6rem; padding: 1.4rem 1.5rem;
	background: linear-gradient(160deg, var(--smm-ok-soft), var(--smm-bg));
	border: 1px solid color-mix(in srgb, var(--smm-ok) 26%, var(--smm-line));
	border-radius: var(--smm-radius);
}
.smm-placed .smm-steps { margin-bottom: 1.1rem; }
.smm-placed__head { display: flex; align-items: flex-start; gap: 1rem; }
.smm-placed__mascot { --bst-size: 92px; }
.smm-placed h1 { margin: 0 0 .25rem; font-size: 1.35rem; }
.smm-placed p { margin: 0; color: var(--smm-muted); font-size: .92rem; }
.smm-placed p strong { color: var(--smm-text); }
.smm-placed__ref { display: inline-flex; align-items: center; gap: .45rem; margin-top: .55rem; font-size: .78rem; color: var(--smm-muted); }
.smm-placed__ref code { padding: .12rem .45rem; background: var(--smm-bg-2); border-radius: 6px; font-size: .78rem; }

.smm-placed__list { margin: 1.1rem 0 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
.smm-placed__list li {
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto;
	align-items: center; gap: .8rem;
	padding: .7rem .85rem; background: var(--smm-bg); border: 1px solid var(--smm-line); border-radius: 11px;
}
@media (max-width: 640px) {
	.smm-placed__list li { grid-template-columns: auto minmax(0, 1fr) auto; row-gap: .45rem; }
	.smm-placed__no { grid-column: 2 / -1; }
}
.smm-placed__icon { display: grid; place-items: center; width: 30px; height: 30px; background: var(--smm-bg-2); border-radius: 8px; }
.smm-placed__name { display: flex; flex-direction: column; min-width: 0; font-size: .9rem; font-weight: 650; }
.smm-placed__name em { font-style: normal; font-size: .75rem; color: var(--smm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smm-placed__no code { padding: .12rem .45rem; background: var(--smm-bg-2); border-radius: 6px; font-size: .76rem; }
.smm-placed__qty { font-size: .84rem; color: var(--smm-muted); font-variant-numeric: tabular-nums; }
.smm-placed__sum { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }

.smm-placed__next { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
.smm-placed__next li { display: flex; align-items: flex-start; gap: .5rem; font-size: .84rem; color: var(--smm-muted); }
.smm-placed__next svg { color: var(--smm-ok); flex: none; margin-top: .12rem; }

/* ------------------------------------------------------- referans anlatımı */

.smm-refhow { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 1.4rem; align-items: center; }
@media (max-width: 700px) { .smm-refhow { grid-template-columns: 1fr; } .smm-refhow__mascot { display: none; } }

.smm-refhow__steps { counter-reset: refstep; margin: .9rem 0 0; padding: 0; list-style: none; display: grid; gap: .85rem; }
.smm-refhow__steps li {
	position: relative; padding-left: 2.4rem;
	font-size: .88rem; line-height: 1.55; color: var(--smm-muted);
}
.smm-refhow__steps li::before {
	counter-increment: refstep; content: counter(refstep);
	position: absolute; left: 0; top: 0;
	display: grid; place-items: center; width: 26px; height: 26px;
	background: var(--smm-brand-soft); color: var(--smm-brand-text);
	border-radius: 8px; font-size: .8rem; font-weight: 800;
}
.smm-refhow__steps span { display: block; color: var(--smm-text); font-weight: 700; font-size: .95rem; }

.smm-refhow__mascot { justify-self: center; }
.smm-refhow__mascot .boostie { --bst-size: 180px; }

/* Hassas alan: mevcut şifre kutusu görsel olarak da ayrışsın. */
.smm-field--guard {
	margin-top: .3rem; padding: .9rem 1rem;
	background: var(--smm-bg-2); border: 1px dashed var(--smm-line-strong); border-radius: 11px;
}
.smm-field--guard .smm-hint { margin: .4rem 0 0; }

/* Sipariş sonrası ödeme talimatı (havale / kripto). */
.smm-placed__howto {
	margin-top: 1.1rem; padding: 1rem 1.15rem;
	background: var(--smm-bg); border: 1px solid var(--smm-warn); border-left-width: 3px;
	border-radius: 12px;
}
.smm-placed__howto h2 { display: flex; align-items: center; gap: .5rem; margin: 0 0 .6rem; font-size: 1rem; }
.smm-placed__howto h2 svg { color: var(--smm-warn); }
.smm-placed__howto-body p { margin: 0 0 .4rem; font-size: .88rem; line-height: 1.6; }
.smm-placed__howto-body p:last-child { margin-bottom: 0; }
.smm-placed__howto-facts { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; margin: .8rem 0 0; }
.smm-placed__howto-facts div { display: flex; flex-direction: column; gap: .15rem; }
.smm-placed__howto-facts dt { font-size: .74rem; color: var(--smm-muted); }
.smm-placed__howto-facts dd { margin: 0; font-size: .95rem; }
.smm-placed__howto-facts code { padding: .1rem .4rem; background: var(--smm-bg-2); border-radius: 6px; font-size: .85rem; }
.smm-placed__howto-note { margin: .8rem 0 0; font-size: .8rem; color: var(--smm-muted); }

/* Ödeme bekleyen sipariş yeşil değil, amber okunmalı. */
.smm-placed--awaiting {
	background: linear-gradient(160deg, color-mix(in srgb, var(--smm-warn) 12%, var(--smm-bg)), var(--smm-bg));
	border-color: color-mix(in srgb, var(--smm-warn) 34%, var(--smm-line));
}
.smm-placed--awaiting .smm-steps__item.is-current .smm-steps__dot { background: var(--smm-warn); border-color: var(--smm-warn); }

/* Sabit açık renkler karanlık modda beyaz bir blok bırakıyordu; token kullan. */
.smm-deposit-pending { border-color: var(--smm-warn); background: linear-gradient(180deg, color-mix(in srgb, var(--smm-warn) 10%, var(--smm-surface)), var(--smm-surface)); }
.smm-deposit-pending__head { display: flex; align-items: center; gap: 1rem; margin-bottom: .9rem; }
.smm-deposit-pending__head h2 { margin: 0 0 .2rem; font-size: 1.15rem; }
.smm-deposit-pending__head p { margin: 0; font-size: .88rem; color: var(--smm-muted); }

/* Müşteriye gösterilen sipariş çizelgesi */
.smm-timeline { list-style: none; margin: 1.1rem 0 .4rem; padding: 0; display: grid; gap: .1rem; }
.smm-timeline__item { position: relative; display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; padding: 0 0 1rem 0; }
.smm-timeline__item::before { content: ''; position: absolute; left: 6px; top: 16px; bottom: -2px; width: 2px; background: var(--smm-line); }
.smm-timeline__item:last-child { padding-bottom: 0; }
.smm-timeline__item:last-child::before { display: none; }
.smm-timeline__dot { grid-row: 1 / span 2; width: 14px; height: 14px; margin-top: 3px; border-radius: 50%; border: 2px solid var(--smm-line); background: var(--smm-surface); z-index: 1; }
.smm-timeline__label { font-size: .92rem; font-weight: 600; color: var(--smm-muted); }
.smm-timeline__note { grid-column: 2; font-size: .8rem; color: var(--smm-muted); }
.smm-timeline__item.is-done .smm-timeline__dot { border-color: #16a34a; background: #16a34a; }
.smm-timeline__item.is-done .smm-timeline__label { color: var(--smm-text); }
.smm-timeline__item.is-done::before { background: #16a34a; }
.smm-timeline__item.is-active .smm-timeline__dot { border-color: var(--smm-brand); background: var(--smm-surface); box-shadow: 0 0 0 4px color-mix(in srgb, var(--smm-brand) 18%, transparent); }
.smm-timeline__item.is-active .smm-timeline__label { color: var(--smm-text); }
.smm-timeline__item.is-failed .smm-timeline__dot { border-color: #dc2626; background: #dc2626; }
.smm-timeline__item.is-failed .smm-timeline__label { color: #b91c1c; }
.smm-track__actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.1rem; }
.smm-order-row__timeline { margin-top: .5rem; }
.smm-order-row__timeline summary { font-size: .8rem; color: var(--smm-muted); cursor: pointer; }
.smm-order-row__timeline summary:hover { color: var(--smm-brand-text); }
.smm-order-row__timeline .smm-timeline { margin-top: .7rem; }
.smm-order-row__timeline .smm-timeline__item { padding-bottom: .75rem; }
.smm-filters__tools { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.smm-filters__tools .smm-search { flex: 1 1 260px; }
.smm-sort select { min-width: 200px; }
.smm-filters__count { margin: .6rem 0 0; font-size: .82rem; color: var(--smm-muted); }
.smm-empty--inline { padding: 1.4rem; text-align: center; }
.smm-coupon--applied { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .55rem .7rem; background: var(--smm-bg-2); border: 1px dashed var(--smm-brand); border-radius: 12px; }
.smm-coupon__tag { display: inline-flex; align-items: center; gap: .45rem; font-size: .88rem; color: var(--smm-text); }
.smm-coupon__tag svg { color: var(--smm-brand-text); }
.smm-coupon__tag code { font-weight: 700; letter-spacing: .02em; }
.smm-coupon__remove { width: 28px; height: 28px; display: grid; place-items: center; background: none; border: 1px solid var(--smm-line); border-radius: 8px; color: var(--smm-muted); font-size: 1.1rem; line-height: 1; cursor: pointer; }
.smm-coupon__remove:hover { border-color: var(--smm-brand); color: var(--smm-brand-text); }

.smm-thread__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: 1rem; }

.smm-service-fallback { margin-top: 1.6rem; }
.smm-service-fallback__facts { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin: 0 0 1.2rem; padding: 0; list-style: none; font-size: .9rem; color: var(--smm-muted); }
.smm-service-fallback__facts strong { color: var(--smm-text); }

.smm-dripfeed { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .6rem; }
.smm-dripfeed__col { display: grid; gap: .25rem; font-size: .78rem; color: var(--smm-muted); }
.smm-cart__drip { margin: .35rem 0 0; font-size: .78rem; color: var(--smm-brand-text); font-weight: 600; }

/* Dekont yükleme */
.smm-receipt { margin-top: .9rem; padding-top: .9rem; border-top: 1px dashed var(--smm-line, #e6ded6); display: grid; gap: .7rem; }
.smm-receipt__list { margin: 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
.smm-receipt__list li { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; font-size: .86rem; }
.smm-receipt__list time { color: var(--smm-muted, #7a6f66); font-size: .78rem; }
.smm-receipt__ok { margin: 0; font-size: .82rem; color: var(--smm-ok-text, #0d7a3c); }
.smm-receipt__form { display: grid; gap: .5rem; }
.smm-input--file { padding: .55rem .7rem; font-size: .85rem; background: var(--smm-surface-2, #faf7f4); }
.smm-input--file::file-selector-button { margin-inline-end: .6rem; padding: .35rem .75rem; border: 1px solid var(--smm-line, #e6ded6); border-radius: 8px; background: #fff; font: inherit; font-size: .82rem; cursor: pointer; }
.smm-receipt__form .smm-hint { margin: 0; }

/* Fatura bilgileri alanı */
.smm-fieldset { margin: 1.4rem 0 0; padding: 1.1rem 1.15rem; border: 1px solid var(--smm-line, #e6ded6); border-radius: 14px; display: grid; gap: .85rem; }
.smm-fieldset legend { padding: 0 .45rem; font-weight: 700; font-size: .92rem; }
.smm-fieldset__intro { margin: 0; }
.smm-grid-2 { display: grid; gap: .85rem; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.smm-radio-row { display: flex; flex-wrap: wrap; gap: .8rem; }
.smm-radio { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; cursor: pointer; }
.smm-order-row__invoice { margin: .6rem 0 0; font-size: .86rem; }
.smm-order-row__invoice a { display: inline-flex; align-items: center; gap: .4rem; color: var(--smm-brand-text, #c2440a); text-decoration: none; font-weight: 600; }
.smm-order-row__invoice a:hover { text-decoration: underline; }

/* ------------------------------------------------------------- canlı destek */
.smm-chat { position: fixed; z-index: 95; inset-inline-end: 18px; inset-block-end: 78px; display: grid; gap: 10px; justify-items: end; }
.smm-chat__bubble { position: relative; width: 52px; height: 52px; border: 0; border-radius: 50%; cursor: pointer;
	display: grid; place-items: center; color: var(--smm-on-brand, #fff); background: linear-gradient(135deg, var(--smm-brand, #f4630e), var(--smm-brand-2, #ff8a3d));
	box-shadow: 0 16px 34px -14px rgba(196, 68, 10, .75); transition: transform .18s ease; }
.smm-chat__bubble:hover { transform: translateY(-2px) scale(1.04); }
.smm-chat__badge { position: absolute; inset-block-start: -3px; inset-inline-end: -3px; min-width: 19px; height: 19px; padding: 0 5px;
	border-radius: 999px; background: #dc2626; color: #fff; font: 700 11px/19px system-ui, sans-serif; }
.smm-chat__panel { width: min(340px, calc(100vw - 32px)); height: min(460px, calc(100vh - 160px)); height: min(460px, calc(100dvh - 160px));
	display: flex; flex-direction: column; overflow: hidden; border-radius: 16px;
	background: var(--smm-surface, #fff); border: 1px solid var(--smm-line, #e6ded6);
	box-shadow: 0 26px 60px -24px rgba(0, 0, 0, .5); }
.smm-chat__head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: linear-gradient(135deg, var(--smm-brand, #f4630e), var(--smm-brand-2, #ff8a3d)); color: var(--smm-on-brand, #fff); }
.smm-chat__avatar { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
	background: rgba(255, 255, 255, .22); font-weight: 700; font-size: 15px; }
.smm-chat__who { flex: 1; display: grid; line-height: 1.25; }
.smm-chat__who strong { font-size: 14px; }
.smm-chat__state { font-size: 11px; opacity: .9; }
.smm-chat__state::before { content: "●"; margin-inline-end: 4px; color: #7ef2a8; }
.smm-chat.is-offline .smm-chat__state::before { color: #ffd7a8; }
.smm-chat__x { border: 0; background: transparent; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; padding: 0 2px; }
.smm-chat__log { flex: 1; overflow-y: auto; padding: 14px; display: grid; gap: 9px; align-content: start; background: var(--smm-surface-2, #faf7f4); }
.smm-chat__msg { max-width: 84%; padding: 8px 11px; border-radius: 13px; font-size: 13.5px; line-height: 1.45; }
.smm-chat__msg p { margin: 0; word-break: break-word; }
.smm-chat__msg time { display: block; margin-top: 3px; font-size: 10.5px; opacity: .65; }
.smm-chat__msg--user { justify-self: end; background: var(--smm-brand, #f4630e); color: var(--smm-on-brand, #fff); border-end-end-radius: 4px; }
.smm-chat__msg--agent { justify-self: start; background: var(--smm-surface, #fff); color: var(--smm-text, #241d18); border: 1px solid var(--smm-line, #e6ded6); border-end-start-radius: 4px; }
.smm-chat__msg--system { justify-self: stretch; max-width: 100%; background: transparent; text-align: center;
	font-size: 12.5px; color: var(--smm-muted, #7a6f66); }
.smm-chat__form { display: flex; align-items: flex-end; gap: 8px; padding: 10px; border-top: 1px solid var(--smm-line, #e6ded6); background: var(--smm-surface, #fff); }
/*
 * 16px bilinçli: iOS Safari, 16px'ten küçük yazılı bir alana odaklanınca
 * sayfayı zorla yakınlaştırır ve pencere "kayar". Renk de açıkça verili:
 * "inherit" karanlık temada gövdenin açık rengini alıp açık zeminde
 * görünmez yazı üretiyordu.
 */
.smm-chat__input { flex: 1; resize: none; max-height: 120px; padding: 8px 10px; border-radius: 10px;
	border: 1px solid var(--smm-line, #e6ded6); background: var(--smm-surface-2, #faf7f4);
	color: var(--smm-text, #241d18); font: inherit; font-size: 16px; }
.smm-chat__send { flex: 0 0 auto; width: 36px; height: 36px; border: 0; border-radius: 10px; cursor: pointer;
	display: grid; place-items: center; background: var(--smm-brand, #f4630e); color: var(--smm-on-brand, #fff); }
.smm-chat__send:hover { background: #d9530a; }

/*
 * Sohbet öncesi iletişim formu: giriş yapmamış ziyaretçi mesaj yazmadan
 * önce ad soyad, e-posta ve telefon bırakır; mağaza sahibi görüşme
 * kapandıktan sonra da geri dönebilsin diye.
 */
.smm-chat__lead { flex: 1; overflow-y: auto; display: grid; gap: 10px; align-content: start;
	padding: 16px 14px; background: var(--smm-surface-2, #faf7f4); }
.smm-chat__lead-hint { margin: 0; font-size: 13px; line-height: 1.5; color: var(--smm-muted, #7a6f66); }
.smm-chat__field { width: 100%; padding: 10px 12px; border-radius: 10px;
	border: 1px solid var(--smm-line, #e6ded6); background: var(--smm-surface, #fff);
	color: var(--smm-text, #241d18); font: inherit; font-size: 16px; }
.smm-chat__field:focus { outline: 2px solid rgba(244, 99, 14, .45); outline-offset: 1px; }
.smm-chat__lead-error { margin: 0; font-size: 12.5px; color: #c2410c; }
.smm-chat__lead-go { border: 0; border-radius: 10px; padding: 11px 14px; cursor: pointer;
	background: var(--smm-brand, #f4630e); color: var(--smm-on-brand, #fff); font: inherit; font-size: 14.5px; font-weight: 600; }
.smm-chat__lead-go:hover { background: #d9530a; }
@media (max-width: 620px) {
	.smm-chat { inset-block-end: 74px; inset-inline-end: 12px; }

	/*
	 * Telefonda pencere köşe kutusu yerine tam ekran açılır: klavye
	 * açıldığında giriş alanı görünür kalır ve arkadaki sayfa kaymaz.
	 * 100dvh, iOS'ta klavye/adres çubuğuyla birlikte daralan gerçek
	 * görünür yüksekliktir.
	 */
	.smm-chat__panel {
		position: fixed; inset: 0; width: 100%;
		height: 100vh; height: 100dvh;
		border-radius: 0; z-index: 99;
	}
}

/* Pencere açıkken arkadaki sayfa kaydırılamaz; "sayfa kayıyor" hissinin
   ikinci kaynağı buydu. JS açılışta bu sınıfı ekleyip kapanışta kaldırır. */
html.smm-chat-lock, html.smm-chat-lock body { overflow: hidden; }

/*
 * Dokunmatik cihazlarda tüm eklenti form alanları en az 16px: iOS'un
 * odaklanınca sayfayı yakınlaştırması (mobildeki "kaymaların" ana
 * kaynağı) yalnızca daha küçük yazılı alanlarda tetiklenir.
 */
@media (pointer: coarse) {
	.smm-input, .smm-input--sm, .smm-input--file, .smm-chat__input,
	.smm-form select, .smm-form textarea { font-size: 16px; }
}

/* Dil değiştirici */
.smm-langs { display: flex; flex-wrap: wrap; gap: .55rem; margin: 0; padding: 0; list-style: none; font-size: .84rem; }
.smm-langs a { color: inherit; text-decoration: none; opacity: .75; }
.smm-langs a:hover { opacity: 1; text-decoration: underline; }
.smm-langs .is-current a { opacity: 1; font-weight: 700; }
.smm-langs--stacked { flex-direction: column; gap: .3rem; }