@charset "UTF-8";

/* ==========================================================================
   DEZ COLLECTION — Mağaza Tasarım Sistemi
   --------------------------------------------------------------------------
   Tek kaynak. Kurallar önce telefon için kurulur, ekran genişledikçe aynı
   sistem açılır — telefon ve bilgisayar aynı dili konuşur.

   Yön: sıcak beyaz zemin, mürekkep siyahı yazı, ince gri çizgi. Renk yok;
   fotoğraf öne çıkar. Bronz ton yalnızca indirim rozetinde ve vurguda.

   Tipografi iki sesli: başlıklar Playfair (serif, editoryal), gövde ve
   arayüz Jost (sans, sakin).

     01 Değişkenler        12 Mobil menü          23 Sekmeler
     02 Sıfırlama          13 Mobil alt menü      24 Sepet sayfası
     03 Tipografi          14 Kapak / slayt       25 Kasa
     04 Yerleşim           15 Bölüm başlığı       26 Hesap sayfaları
     05 Gizlenenler        16 Ürün ızgarası       27 Butonlar
     06 Duyuru + üst şerit 17 Ürün kartı          28 Form alanları
     07 Masaüstü başlık    18 Kategori kartı      29 Tablo / sayfalama
     08 Masaüstü menü      19 Breadcrumb          30 Altbilgi
     09 Arama              20 Filtre çubuğu       31 Hareket
     10 Mini sepet         21 Yan sütun           32 Kırılım noktaları
     11 Mobil başlık       22 Ürün detay
   ========================================================================== */


/* ==========================================================================
   01. Değişkenler
   ========================================================================== */

:root {
	/* Renk — sıcak nötr eksen. Saf siyah/beyaz yerine bir tık kırık tonlar,
	   ekranda daha pahalı durur ve göz yormaz. */
	--bg:         #ffffff;
	--surface:    #ffffff;
	--ink:        #15110f;
	--ink-soft:   #5b534e;
	--ink-faint:  #948b85;
	--line:       #e9e5e1;
	--line-dark:  #d3ccc6;
	--fill:       #f7f5f3;
	--fill-warm:  #f2eeea;
	--accent:     #8a6a4f;
	--sale:       #9c2f2a;
	--ok:         #2f6b4f;

	/* Tipografi */
	--serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
	--sans:  'Jost', 'Helvetica Neue', Helvetica, Arial, sans-serif;

	/* Boşluk ölçeği — 4 katları. Sayfa boyunca yalnızca bunlar kullanılır. */
	--s1: 4px;
	--s2: 8px;
	--s3: 12px;
	--s4: 16px;
	--s5: 24px;
	--s6: 32px;
	--s7: 48px;
	--s8: 64px;
	--s9: 88px;

	/* Sayfa kenar boşluğu — kırılım noktalarında büyür */
	--pad: 16px;

	/* Ölçüler */
	--head-h:   58px;
	--bottom-h: 56px;
	--max:      1680px;

	/* Yüzey etkileri */
	--radius: 0px;
	--shadow-sm: 0 1px 2px rgba(21, 17, 15, 0.04);
	--shadow:    0 10px 30px rgba(21, 17, 15, 0.07);
	--shadow-lg: 0 20px 50px rgba(21, 17, 15, 0.11);

	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--fast: 0.18s;
	--slow: 0.32s;

	/* Katman sırası — z-index tahmini bitsin */
	--z-menu:    100;
	--z-header:  200;
	--z-overlay: 9000;
	--z-drawer:  9100;
}


/* ==========================================================================
   02. Sıfırlama
   --------------------------------------------------------------------------
   Bootstrap 3 ve eski tema CSS'i üstte duruyor; burada yalnızca tasarımı
   engelleyen varsayılanlar geri alınır.
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	background: var(--bg);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 0.01em;
	line-height: 1.6;
	margin: 0;
	overflow-x: hidden;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Çekmece açıkken arka sayfa kaymasın */
body.dz-locked { overflow: hidden; }

img {
	border: 0;
	height: auto;
	max-width: 100%;
	vertical-align: middle;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color var(--fast) var(--ease), opacity var(--fast) var(--ease);
}

a:hover, a:focus { color: var(--ink); outline: none; text-decoration: none; }

/* Klavyeyle gezenler için görünür odak — fare kullanınca çıkmaz */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 2px solid var(--ink);
	outline-offset: 2px;
}

ul, ol { list-style: none; margin: 0; padding: 0; }

button, input, select, textarea { font-family: inherit; font-size: inherit; }
button { cursor: pointer; }

hr { border: 0; border-top: 1px solid var(--line); margin: var(--s5) 0; }

table { border-collapse: collapse; width: 100%; }

/* Bootstrap ızgarası artık taşıyıcı değil; grid/flex devraldı */
.row { margin-left: 0; margin-right: 0; }
.row::before, .row::after { display: none; }
[class*="col-"] { padding-left: 0; padding-right: 0; }

.panel, .well, .thumbnail, .form-control, .input-group-addon {
	background: none;
	border-radius: var(--radius);
	box-shadow: none;
}

/* Ekran okuyucuya bırakılan metin */
.dz-sr {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}


/* ==========================================================================
   03. Tipografi
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	color: var(--ink);
	font-family: var(--sans);
	font-weight: 400;
	letter-spacing: 0.01em;
	line-height: 1.3;
	margin: 0 0 var(--s3);
}

h1 { font-size: 22px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
h5, h6 { font-size: 12px; }

p { margin: 0 0 var(--s3); }
p:last-child { margin-bottom: 0; }

strong, b { font-weight: 500; }
small { font-size: 12px; }

/* Serif ses — sayfa ve bölüm başlıkları, ürün adı */
.dz-serif,
.dz-display,
.dz-page-title,
.dz-category-title,
.product_heading,
h1.product_heading {
	font-family: var(--serif);
	font-weight: 400;
	letter-spacing: 0.005em;
}

/* Aralıklı büyük harf — etiketler, menü, buton */
.dz-label,
.dz-eyebrow,
.dz-section-title,
.breadcrumb,
.btn,
input[type="submit"],
#menu > ul > li > a,
.mobile-menu > li > a {
	font-weight: 400;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.dz-eyebrow {
	color: var(--ink-faint);
	display: block;
	font-size: 10px;
	margin-bottom: var(--s2);
}

.dz-muted { color: var(--ink-soft); }
.dz-faint { color: var(--ink-faint); }

/* Yönetici panelinden gelen serbest metin (açıklama, bilgi sayfası) */
.dz-rte { color: var(--ink-soft); font-size: 14px; line-height: 1.75; }
.dz-rte p { margin-bottom: var(--s4); }
.dz-rte img { height: auto !important; max-width: 100% !important; }
.dz-rte h1, .dz-rte h2, .dz-rte h3 { color: var(--ink); margin: var(--s6) 0 var(--s3); }
.dz-rte ul { list-style: disc; margin: 0 0 var(--s4); padding-left: var(--s5); }
.dz-rte ol { list-style: decimal; margin: 0 0 var(--s4); padding-left: var(--s5); }
.dz-rte li { margin-bottom: var(--s1); }
.dz-rte a { border-bottom: 1px solid var(--line-dark); color: var(--ink); }
.dz-rte table { display: block; overflow-x: auto; white-space: nowrap; }


/* ==========================================================================
   04. Yerleşim
   ========================================================================== */

.outer-wrapper, .site-wrapper { overflow-x: hidden; width: 100%; }

.container {
	margin: 0 auto;
	max-width: var(--max);
	padding-left: var(--pad);
	padding-right: var(--pad);
	width: 100%;
}

/* Kenardan kenara bloklar (kapak, tam genişlik banner) */
.dz-bleed { margin-left: calc(var(--pad) * -1); margin-right: calc(var(--pad) * -1); }

.main-row.full-width > .container { max-width: none; padding: 0; }
.main-row { width: 100%; }

.main-col, .sub-col, .sub-row, .row {
	float: none;
	min-width: 0;
	width: 100%;
}

.sub-row { display: block; }

#content { padding-bottom: var(--s7); }

.dz-page { padding: var(--s5) 0 var(--s7); }

/* Başlık ile altbilgi arasındaki içerik alanı */
.dz-main { min-height: 40vh; width: 100%; }

/* hidden özniteliği her yerde saklasın */
[hidden] { display: none !important; }

/* Sayfa başlığı bloğu — kategori, sepet, hesap sayfalarında ortak */
.dz-page-head {
	border-bottom: 1px solid var(--line);
	margin-bottom: var(--s5);
	padding-bottom: var(--s4);
}

.dz-page-title {
	font-size: 24px;
	margin: 0;
}

.dz-page-sub { color: var(--ink-faint); font-size: 12px; margin: var(--s2) 0 0; }


/* ==========================================================================
   05. Gizlenenler
   --------------------------------------------------------------------------
   Eski temadan ve panelden kalan süs öğeleri. Hiçbiri işlevsel değil;
   yalnızca görünümü bozuyordu.
   ========================================================================== */

#loader-wrapper, #loader, .loader-section { display: none !important; }

img[src*="footer-logo"] { display: none !important; }

img[src*="anasayfa2/"],
img[src*="catalog/123"],
img[src*="anasayfa/1.jpg"],
img[src*="anasayfa/9.jpg"],
img[src*="anasayfa/10.jpg"] { display: none !important; }

/* Ürün kartındaki geri sayım sayacı — kart düzenini bozuyordu.
   Fırsat modülünün kendi sayacı (.timer-grid) aşağıda biçimlendirilir. */
.product-thumb .timer,
.product-thumb [class*="countdown"] { display: none !important; }

/* Fırsat köşesi geri sayımı.
   Betiğin ürettiği yapı: .timer-grid > .box-time-date > span.number + düz
   metin ("GÜN"). Kutucuklar ürün kartının içinde durduğu için dar alana
   sığmalı: nowrap + esnek genişlik ile hep tek satırda kalır. */
.timer-grid {
	display: flex;
	flex-wrap: nowrap;
	font-family: var(--sans) !important;
	gap: 2px;
	margin: var(--s2) 0 0;
}

.timer-grid > .box-time-date,
.timer-grid > div {
	background: var(--fill);
	color: var(--ink-faint);
	flex: 1 1 0;
	font-family: var(--sans) !important;
	font-size: 8px !important;
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 1.2;
	min-width: 0;
	padding: 5px 2px;
	text-align: center;
	text-transform: uppercase;
}

/* Rakam — kutucuğun üst satırı */
.timer-grid .number {
	color: var(--ink);
	display: block;
	font-size: 13px !important;
	letter-spacing: 0;
	margin-bottom: 1px;
}

h2:empty, h3:empty, h4:empty,
.dz-section-title:empty,
.box-heading:empty { display: none !important; }

.hombick1 { display: none; }

/* Sayfanın en tepesinde açık duran giriş formu. Telefonda site açılır
   açılmaz ilk görünen şey buydu; artık çekmece olarak açılıyor. */
.login-block { display: none; }

/* Karşılaştırma özelliği mağazada kullanılmıyor */
#compare-total, .product-compare, .comparing { display: none !important; }


/* ==========================================================================
   06. Duyuru ve üst şerit
   ========================================================================== */

.dz-announce {
	background: var(--ink);
	color: #fff;
	font-size: 10px;
	letter-spacing: 0.16em;
	overflow: hidden;
	padding: var(--s2) var(--pad);
	text-align: center;
	text-transform: uppercase;
}

.dz-announce a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

#top {
	background: var(--surface);
	border-bottom: 1px solid var(--line);
	font-size: 11px;
	padding: 0;
}

#top .container {
	align-items: center;
	display: flex;
	justify-content: space-between;
	min-height: 36px;
}

#top a, #top .btn, #top span, #top strong {
	background: none;
	border: 0;
	box-shadow: none;
	color: var(--ink-soft);
	font-size: 11px;
	font-weight: 300;
	letter-spacing: 0.1em;
	min-height: 0;
	padding: 0;
	text-transform: uppercase;
}

#top a:hover, #top .btn:hover { color: var(--ink); }

#top-links { align-items: center; display: flex; gap: var(--s5); }
#top-links li { border: 0 !important; padding: 0; }

#top .dropdown-menu {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 0;
	box-shadow: var(--shadow);
	min-width: 140px;
	padding: var(--s1) 0;
}

#top .dropdown-menu a { display: block; padding: var(--s2) var(--s3); }
#top .dropdown-menu a:hover { background: var(--fill); }


/* ==========================================================================
   07. Masaüstü başlık
   ========================================================================== */

#header {
	background: var(--surface);
	border-bottom: 1px solid var(--line);
	padding: 0;
	position: relative;
	z-index: var(--z-header);
}

#header .container {
	align-items: center;
	display: flex;
	gap: var(--s6);
	justify-content: space-between;
	min-height: 84px;
}

#logo { flex: 0 0 auto; margin: 0; }

#logo img {
	display: block;
	max-height: 52px;
	transition: opacity var(--fast) var(--ease);
	width: auto;
}

#logo a:hover img { opacity: 0.75; }

#logo h1 {
	font-family: var(--serif);
	font-size: 24px;
	letter-spacing: 0.12em;
	margin: 0;
	text-transform: uppercase;
}

/* Başlığın sağ ucu — hesap, favori, sepet */
.dz-header-actions {
	align-items: center;
	display: flex;
	flex: 0 0 auto;
	gap: var(--s4);
}

.dz-icon-btn {
	align-items: center;
	background: none;
	border: 0;
	color: var(--ink);
	display: inline-flex;
	justify-content: center;
	min-height: 44px;
	min-width: 44px;
	padding: 0;
	position: relative;
}

.dz-icon-btn:hover { color: var(--accent); }
.dz-icon-btn .fa { font-size: 17px; }

/* Sayaç rozeti — sepet ve favori sayısı */
.dz-count {
	background: var(--ink);
	border-radius: 999px;
	color: #fff;
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 16px;
	min-width: 16px;
	padding: 0 4px;
	position: absolute;
	right: 2px;
	text-align: center;
	top: 4px;
}

/* Başlık çubuğu sayfayla birlikte yukarıda kalır; kaydırınca gölge alır.
   Mobil ve masaüstü sürümlerinden yalnızca biri aynı anda görünür, bu
   yüzden ikisi de yapışkan olabilir. */
.stk {
	background: var(--surface);
	position: sticky;
	top: 0;
	transition: box-shadow var(--slow) var(--ease);
	width: 100%;
	z-index: var(--z-header);
}

.stk.dz-stuck { box-shadow: var(--shadow-sm); }

/* "Tüm kategoriler" açılır düğmesi — menü şeridinin solunda */
.hepkat1 { flex: 0 0 auto; position: relative; }
.hepkat { margin: 0; }
.hepkat > li { list-style: none; }


/* ==========================================================================
   08. Masaüstü menü
   --------------------------------------------------------------------------
   supermenu eklentisinin kendi CSS'i üstte; buradaki kurallar onu sadeleştirir.
   ========================================================================== */

#menu, #supermenu, .navbar {
	background: var(--surface) !important;
	border: 0;
	border-bottom: 1px solid var(--line);
	border-radius: 0;
	margin: 0;
	min-height: 0;
}

#menu .container { display: flex; justify-content: center; }

/* supermenu kendi <nav id="supermenu"> yapısını getirir; menü listesi
   doğrudan onun altındadır. .container > ul ise supermenu kapalıyken
   devreye giren yalın kategori menüsüdür. */
#menu > ul,
#menu .container > ul,
#menu .navbar-nav,
#supermenu > ul,
.supermenu > ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s7);
	justify-content: center;
	margin: 0;
	padding: 0;
}

#menu > ul > li,
#menu .container > ul > li,
#supermenu > ul > li,
.supermenu > ul > li {
	background: none !important;
	border: 0 !important;
	float: none;
	position: relative;
}

#menu > ul > li > a,
#menu .container > ul > li > a,
#supermenu > ul > li > a,
.supermenu > ul > li > a {
	background: none !important;
	color: var(--ink) !important;
	display: block;
	font-size: 11px;
	letter-spacing: 0.14em;
	padding: var(--s4) 0;
	position: relative;
	text-transform: uppercase;
}

/* Alt çizgi soldan açılır */
#menu > ul > li > a::after,
#menu .container > ul > li > a::after,
#supermenu > ul > li > a::after,
.supermenu > ul > li > a::after {
	background: var(--ink);
	bottom: 10px;
	content: "";
	height: 1px;
	left: 0;
	position: absolute;
	right: 0;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--slow) var(--ease);
}

#menu > ul > li:hover > a::after,
#menu > ul > li.active > a::after,
#menu .container > ul > li:hover > a::after,
#supermenu > ul > li:hover > a::after,
.supermenu > ul > li:hover > a::after { transform: scaleX(1); }

/* Açılır katman */
#menu .dropdown-menu,
#supermenu .sub-menu,
.supermenu .sub-menu,
.supermenu .mega-menu {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 0;
	box-shadow: var(--shadow);
	margin: 0;
	min-width: 220px;
	padding: var(--s3) 0;
}

#menu .dropdown-menu a,
#supermenu .sub-menu a,
.supermenu .sub-menu a {
	background: none !important;
	color: var(--ink-soft) !important;
	display: block;
	font-size: 12px;
	letter-spacing: 0.03em;
	padding: var(--s2) var(--s5);
	text-transform: none;
}

#menu .dropdown-menu a:hover,
#supermenu .sub-menu a:hover,
.supermenu .sub-menu a:hover { background: var(--fill) !important; color: var(--ink) !important; }

/* Mega menü sütun başlıkları */
.supermenu .mega-menu h4,
.supermenu .column-title {
	color: var(--ink);
	font-size: 10px;
	letter-spacing: 0.14em;
	margin: 0 0 var(--s2);
	padding: 0 var(--s5);
	text-transform: uppercase;
}


/* ==========================================================================
   09. Arama
   ========================================================================== */

#search, .autosearch-wrapper {
	flex: 1 1 auto;
	max-width: 380px;
	position: relative;
}

#search .input-group, .autosearch-wrapper .input-group { display: block; width: 100%; }

#search .form-control,
#search input[type="text"],
.autosearch-wrapper input[type="text"],
.autosearch-wrapper .search_query {
	background: var(--fill);
	border: 1px solid transparent;
	border-radius: var(--radius);
	box-shadow: none;
	color: var(--ink);
	font-size: 12px;
	height: 44px;
	letter-spacing: 0.02em;
	padding: 0 46px 0 var(--s4);
	transition: background var(--fast) var(--ease), border-color var(--fast) var(--ease);
	width: 100%;
}

#search input:focus,
.autosearch-wrapper input[type="text"]:focus {
	background: var(--surface);
	border-color: var(--line-dark);
	outline: none;
}

#search input::placeholder,
.autosearch-wrapper input::placeholder { color: var(--ink-faint); }

/* Arama düğmesi — PNG ikon yerine SVG büyüteç */
#search .btn,
#search button,
.autosearch-wrapper .button-search {
	align-items: center;
	background: none !important;
	border: 0;
	color: var(--ink) !important;
	display: flex;
	height: 44px;
	justify-content: center;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 46px;
}

.autosearch-wrapper .button-search img { display: none; }

.autosearch-wrapper .button-search::before,
#search button::before {
	background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M15.8 15.8 20.5 20.5'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
	content: "";
	height: 18px;
	width: 18px;
}

.autosearch-wrapper .category_filter { display: none; }

/* Canlı öneri kutusu */
.autosearch-wrapper .dropdown-menu,
.autosearch-results,
.autosearch-wrapper ul.dropdown-menu {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 0;
	box-shadow: var(--shadow);
	left: 0;
	margin: 0;
	max-height: 70vh;
	overflow-y: auto;
	padding: 0;
	right: 0;
	width: 100%;
}

.autosearch-wrapper .dropdown-menu li > a,
.autosearch-results li > a {
	align-items: center;
	border-bottom: 1px solid var(--line);
	color: var(--ink);
	display: flex;
	font-size: 12px;
	gap: var(--s3);
	padding: var(--s2) var(--s3);
	white-space: normal;
}

.autosearch-wrapper .dropdown-menu li > a:hover { background: var(--fill); }
.autosearch-wrapper .dropdown-menu img { max-width: 44px; }

/* Mobil arama çekmecesi — başlığın altından iner */
.mobile-search {
	background: var(--surface);
	border-bottom: 1px solid var(--line);
	display: none;
	left: 0;
	padding: var(--s3) var(--pad);
	position: absolute;
	right: 0;
	top: 100%;
	z-index: var(--z-header);
}

body.search-active .mobile-search { display: block; }
.mobile-search .autosearch-wrapper { max-width: none; }


/* ==========================================================================
   10. Mini sepet
   ========================================================================== */

#cart { flex: 0 0 auto; }

#cart > .btn,
#cart .dropdown-toggle {
	align-items: center;
	background: none !important;
	border: 0;
	box-shadow: none;
	color: var(--ink) !important;
	display: inline-flex;
	font-size: 11px;
	gap: var(--s2);
	letter-spacing: 0.1em;
	min-height: 44px;
	padding: 0;
	text-transform: uppercase;
	width: auto;
}

#cart > .btn:hover { color: var(--accent) !important; }
#cart .fa { font-size: 17px; }
#cart-total { font-size: 11px; font-weight: 400; }

#cart .dropdown-menu {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 0;
	box-shadow: var(--shadow-lg);
	left: auto;
	margin: 0;
	max-width: calc(100vw - 24px);
	min-width: 320px;
	padding: 0;
	right: 0;
	width: 380px;
}

#cart .dropdown-menu table,
#cart .dropdown-menu .table { margin: 0; table-layout: auto; width: 100%; }

#cart .dropdown-menu td {
	background: none;
	border: 0;
	border-bottom: 1px solid var(--line);
	padding: var(--s3);
	vertical-align: middle;
}

#cart .dropdown-menu td.text-left {
	overflow-wrap: anywhere;
	white-space: normal;
	width: auto;
}

#cart .dropdown-menu td.text-left a {
	color: var(--ink);
	display: block;
	font-size: 12px;
	line-height: 1.45;
}

#cart .dropdown-menu td.text-center { width: 68px; }
#cart .dropdown-menu img { background: var(--fill); border: 0; max-width: 56px; }

#cart .dropdown-menu .table-bordered td { border-bottom: 1px solid var(--line); font-size: 12px; }

#cart .dropdown-menu p.text-right { display: flex; gap: var(--s2); margin: 0; padding: var(--s3); }

#cart .dropdown-menu p.text-right a {
	align-items: center;
	border: 1px solid var(--ink);
	color: var(--ink);
	display: inline-flex;
	flex: 1 1 0;
	font-size: 10px;
	justify-content: center;
	letter-spacing: 0.12em;
	min-height: 44px;
	text-transform: uppercase;
}

#cart .dropdown-menu p.text-right a:last-child { background: var(--ink); color: #fff; }
#cart .dropdown-menu p.text-right a strong { font-weight: 400; }
#cart .dropdown-menu p.text-right .fa { display: none; }

#cart .dropdown-menu .btn-danger {
	background: none;
	border: 0;
	color: var(--ink-faint);
	min-height: 32px;
	min-width: 32px;
	padding: 0;
}

#cart .dropdown-menu .btn-danger:hover { color: var(--sale); }

/* Boş sepet */
#cart .dropdown-menu p.text-center {
	color: var(--ink-faint);
	font-size: 12px;
	margin: 0;
	padding: var(--s7) var(--s4);
}


/* ==========================================================================
   11. Mobil başlık
   ========================================================================== */

.mobile-header {
	align-items: center;
	background: var(--surface);
	border-bottom: 1px solid var(--line);
	display: flex;
	height: var(--head-h);
	justify-content: space-between;
	padding: 0 var(--pad);
	position: relative;
	width: 100%;
	z-index: var(--z-header);
}

.mobile-header .container,
.mobile-header .row {
	align-items: center;
	display: flex;
	justify-content: space-between;
	padding: 0;
	width: 100%;
}

.mobile-header [class*="col-"] {
	flex: 0 0 auto;
	float: none;
	margin: 0 !important;
	padding: 0 !important;
	width: auto;
}

.mobile-header .col-xs-8 { flex: 1 1 auto; text-align: center; }

.mobile-header #logo img {
	display: inline-block;
	max-height: 34px;
	width: auto;
}

.mobile-header a,
.mobile-header button,
.to-navigation,
.to-search,
.to-account,
.to-cart {
	align-items: center;
	background: none;
	border: 0;
	color: var(--ink);
	display: inline-flex;
	justify-content: center;
	min-height: 44px;
	min-width: 40px;
	padding: 0;
}

.mobile-header .fa { font-size: 17px; }
.mobile-header svg.icon { display: block; height: 21px; width: 21px; }
.mobile-header svg path, .mobile-header svg circle, .mobile-header svg line { stroke: var(--ink) !important; }

/* Hamburger — üç çizgi, açıkken çarpıya döner.
   Yalnızca başlıktaki düğme; alt sabit menüdeki menü ikonu SVG (bölüm 13). */
.mobile-header .to-navigation { position: relative; width: 40px; }

.mobile-header .to-navigation::before,
.mobile-header .to-navigation::after,
.mobile-header .to-navigation span {
	background: var(--ink);
	content: "";
	height: 1px;
	left: 9px;
	position: absolute;
	transition: transform var(--slow) var(--ease), opacity var(--fast) var(--ease);
	width: 22px;
}

.mobile-header .to-navigation::before { top: 15px; }
.mobile-header .to-navigation span { top: 21px; }
.mobile-header .to-navigation::after { top: 27px; }

body.menu-expanded .mobile-header .to-navigation::before { transform: translateY(6px) rotate(45deg); }
body.menu-expanded .mobile-header .to-navigation span { opacity: 0; }
body.menu-expanded .mobile-header .to-navigation::after { transform: translateY(-6px) rotate(-45deg); }

/* Mobil başlıktaki sepet bağlantısı ve sayı rozeti */
.dz-mobile-cart { position: relative; }
.dz-mobile-cart .dz-count { right: 0; top: 6px; }


/* ==========================================================================
   12. Mobil menü paneli
   ========================================================================== */

.mobile-menu-wrapper {
	background: var(--surface);
	bottom: 0;
	box-shadow: var(--shadow-lg);
	left: 0;
	max-width: 88vw;
	overflow-y: auto;
	position: fixed;
	top: 0;
	transform: translateX(-100%);
	transition: transform var(--slow) var(--ease);
	-webkit-overflow-scrolling: touch;
	width: 320px;
	z-index: var(--z-drawer);
}

body.menu-expanded .mobile-menu-wrapper,
.mobile-menu-wrapper.open { transform: translateX(0); }

.mobile-menu-inner { padding: 0 0 var(--s8); }

/* Panel başlığı */
.dz-drawer-head {
	align-items: center;
	border-bottom: 1px solid var(--line);
	display: flex;
	height: var(--head-h);
	justify-content: space-between;
	padding: 0 var(--s5);
}

.dz-drawer-title {
	font-size: 11px;
	letter-spacing: 0.16em;
	margin: 0;
	text-transform: uppercase;
}

.dz-drawer-close {
	background: none;
	border: 0;
	color: var(--ink);
	font-size: 22px;
	line-height: 1;
	min-height: 44px;
	min-width: 44px;
	padding: 0;
}

ul.mobile-menu { border-top: 0; margin: 0 0 var(--s5); }

.mobile-menu li { border-bottom: 1px solid var(--line); }

.mobile-menu li a {
	align-items: center;
	color: var(--ink);
	display: flex;
	font-size: 12px;
	gap: var(--s3);
	letter-spacing: 0.1em;
	min-height: 52px;
	padding: 0 var(--s5);
	width: 100%;
}

.mobile-menu li a:active { background: var(--fill); }
.mobile-menu .fa { color: var(--ink-faint); font-size: 15px; width: 20px; }

/* Çekmecenin alt bölümü — hesap ve sepet bağlantıları */
.dz-drawer-links { border-top: 8px solid var(--fill); margin-top: var(--s5); }
.dz-drawer-links a { letter-spacing: 0.06em; text-transform: none; }

/* Panelin içindeki kategori menüsü */
.mobile-menu-inner .yo-menu,
.mobile-menu-inner .supermenu { border: 0; margin: 0; }

.mobile-menu-inner > ul > li > a {
	font-size: 12px;
	letter-spacing: 0.12em;
	min-height: 52px;
	padding: var(--s4) var(--s5);
	text-transform: uppercase;
}

/* Alt kategoriler — sağdaki ok düğmesiyle katlanır */
.mobile-menu-wrapper li { position: relative; }

.mobile-menu-wrapper .dz-toggle {
	background: none;
	border: 0;
	height: 52px;
	position: absolute;
	right: 0;
	top: 0;
	width: 52px;
	z-index: 2;
}

.mobile-menu-wrapper .dz-toggle::before,
.mobile-menu-wrapper .dz-toggle::after {
	background: var(--ink-soft);
	content: "";
	height: 1px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: opacity var(--fast) var(--ease);
	width: 11px;
}

.mobile-menu-wrapper .dz-toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.mobile-menu-wrapper li.dz-open > .dz-toggle::after { opacity: 0; }

/* Alt liste varsayılan olarak kapalı */
.mobile-menu-wrapper .sub-menu {
	display: none;
	background: var(--fill);
	border-bottom: 1px solid var(--line);
}

.mobile-menu-wrapper li.dz-open > .sub-menu { display: block; }

.mobile-menu-wrapper .sub-menu li { border: 0; }

.mobile-menu-wrapper .sub-menu a {
	color: var(--ink-soft);
	font-size: 12px;
	letter-spacing: 0.04em;
	min-height: 46px;
	padding-left: var(--s7);
	text-transform: none;
}

.site-wrapper-overlay {
	background: rgba(21, 17, 15, 0.4);
	bottom: 0;
	left: 0;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	right: 0;
	top: 0;
	transition: opacity var(--slow) var(--ease);
	z-index: var(--z-overlay);
}

body.menu-expanded .site-wrapper-overlay,
body.login-active .site-wrapper-overlay {
	opacity: 1;
	pointer-events: auto;
}

/* Hesap çekmecesi — sağdan girer */
.dz-account-drawer {
	background: var(--surface);
	bottom: 0;
	box-shadow: var(--shadow-lg);
	max-width: 88vw;
	overflow-y: auto;
	padding: 0 0 var(--s8);
	position: fixed;
	right: 0;
	top: 0;
	transform: translateX(100%);
	transition: transform var(--slow) var(--ease);
	width: 320px;
	z-index: var(--z-drawer);
}

body.login-active .dz-account-drawer { transform: translateX(0); }

.dz-account-drawer .dz-drawer-body { padding: var(--s5); }
.dz-account-drawer .form-group { margin-bottom: var(--s4); }

.dz-account-links {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(2, 1fr);
	background: var(--line);
	border: 1px solid var(--line);
}

.dz-account-links a {
	align-items: center;
	background: var(--surface);
	color: var(--ink);
	display: flex;
	flex-direction: column;
	font-size: 10px;
	gap: var(--s2);
	justify-content: center;
	letter-spacing: 0.08em;
	min-height: 86px;
	padding: var(--s3);
	text-align: center;
	text-transform: uppercase;
}

.dz-account-links a:active { background: var(--fill); }
.dz-account-links .fa { font-size: 18px; }


/* ==========================================================================
   13. Mobil alt sabit menü
   ========================================================================== */

#altsabitmenu {
	background: rgba(255, 255, 255, 0.96);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-top: 1px solid var(--line);
	bottom: 0;
	display: flex;
	height: calc(var(--bottom-h) + env(safe-area-inset-bottom, 0px));
	left: 0;
	padding-bottom: env(safe-area-inset-bottom, 0px);
	position: fixed;
	right: 0;
	z-index: 900;
}

#altsabitmenu ul { display: flex; width: 100%; }
#altsabitmenu li { display: flex; flex: 1 1 0; }

#altsabitmenu a {
	align-items: center;
	border: 0;
	color: var(--ink);
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	font-size: 9px;
	gap: 3px;
	justify-content: center;
	letter-spacing: 0.08em;
	min-height: var(--bottom-h);
	position: relative;
	text-transform: uppercase;
}

/* İkonlar SVG olarak çizilir; eski PNG'ler bulanıktı */
#altsabitmenu a::before {
	background-position: center;
	background-repeat: no-repeat;
	background-size: 21px 21px;
	content: "";
	display: block;
	height: 21px;
	width: 21px;
}

#altsabitmenu .to-navigation::before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E");
	position: static;
	transform: none;
}

#altsabitmenu .to-account::before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c0-4 3.6-6 8-6s8 2 8 6'/%3E%3C/svg%3E");
}

#altsabitmenu .to-homepage::before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5 12 4l8 6.5V20H4z'/%3E%3C/svg%3E");
}

#altsabitmenu .to-contactus::before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a12 12 0 0 0 5 5L15 13l5 2v4a1 1 0 0 1-1 1A16 16 0 0 1 4 5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

#altsabitmenu .to-wishlist::before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.3A3.7 3.7 0 0 1 12 8a3.7 3.7 0 0 1 7 2.7C19 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}

#altsabitmenu .tshoppingcart::before {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 7.5h13l-1 12h-11z'/%3E%3Cpath d='M9 7.5V6a3 3 0 0 1 6 0v1.5'/%3E%3C/svg%3E");
}

/* Alt menüdeki menü düğmesi başlıktaki hamburgerden farklı çizilir */
#altsabitmenu .to-navigation { width: auto; }
#altsabitmenu .to-navigation::after,
#altsabitmenu .to-navigation span { display: none; }

/* Alt menüdeki sepet sayacı */
#altsabitmenu .tshoppingcart[data-count]:not([data-count="0"])::after {
	background: var(--ink);
	border-radius: 999px;
	color: #fff;
	content: attr(data-count);
	font-size: 9px;
	line-height: 15px;
	min-width: 15px;
	padding: 0 4px;
	position: absolute;
	right: calc(50% - 18px);
	text-align: center;
	top: 6px;
}


/* ==========================================================================
   14. Kapak / slayt
   --------------------------------------------------------------------------
   Kenardan kenara tek fotoğraf. Yükseklik burada sabitlenir; slayt betiği
   ne ölçerse ölçsün kapak taşamaz.
   ========================================================================== */

.swiper-viewport, .swiper-container {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	margin: 0;
	max-width: 100% !important;
	overflow: hidden !important;
	position: relative;
	width: 100% !important;
}

.swiper-viewport {
	height: 66vh;
	max-height: 480px;
	min-height: 340px;
}

.swiper-container, .swiper-wrapper, .swiper-slide, .swiper-slide > a { height: 100%; }

.swiper-wrapper { display: flex; }

/* DİKKAT: slaytın genişliğine ve kenar boşluğuna buradan karışma.
   Swiper her slayta satır içi width + margin-right yazar ve kaydırma
   adımını ona göre hesaplar. Bu değerler CSS'ten ezilirse adım ile
   gerçek genişlik uyuşmaz, slaytlar kayar ve yan yana görünür. */
.swiper-slide {
	flex-shrink: 0;
	overflow: hidden;
	position: relative;
}

.swiper-slide img {
	display: block;
	height: 100% !important;
	object-fit: cover;
	object-position: center 22%;
	width: 100% !important;
}

/* Alt kenara doğru koyulaşan perde — üstteki yazı her fotoğrafta okunur */
.swiper-slide > a::after {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0) 58%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.dz-slide-caption {
	bottom: 0;
	color: #fff;
	display: block;
	left: 0;
	padding: 0 var(--pad) var(--s6);
	position: absolute;
	right: 0;
	text-align: left;
	z-index: 2;
}

.dz-slide-title {
	color: #fff;
	font-family: var(--serif);
	font-size: 26px;
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.15;
	margin: 0;
}

.dz-slide-text {
	color: rgba(255, 255, 255, 0.88);
	font-size: 12px;
	letter-spacing: 0.06em;
	margin: var(--s2) 0 0;
}

.dz-slide-cta {
	background: #fff;
	color: var(--ink);
	display: inline-flex;
	font-size: 10px;
	letter-spacing: 0.16em;
	margin-top: var(--s4);
	min-height: 44px;
	padding: 0 var(--s6);
	text-transform: uppercase;
}

.swiper-pager .swiper-button-next,
.swiper-pager .swiper-button-prev {
	background: none;
	color: #fff;
	height: 44px;
	margin-top: -22px;
	opacity: 0.8;
	width: 44px;
}

.swiper-pager .swiper-button-next:hover,
.swiper-pager .swiper-button-prev:hover { opacity: 1; }

.swiper-pagination-bullet {
	background: #fff;
	border-radius: 0;
	height: 2px;
	opacity: 0.4;
	transition: opacity var(--fast) var(--ease);
	width: 26px;
}

.swiper-pagination-bullet-active { opacity: 1; }


/* ==========================================================================
   15. Bölüm başlığı ve modüller
   ========================================================================== */

.dz-module { margin: 0 0 var(--s7); }

.dz-section-head {
	align-items: baseline;
	display: flex;
	gap: var(--s4);
	justify-content: space-between;
	margin: 0 0 var(--s5);
	padding: 0 var(--pad);
}

.dz-section-title {
	color: var(--ink);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0.18em;
	margin: 0 0 var(--s5);
	padding: 0 var(--pad);
	text-align: left;
	text-transform: uppercase;
}

.dz-section-head .dz-section-title { margin: 0; padding: 0; }

.dz-section-link {
	color: var(--ink-faint);
	flex: 0 0 auto;
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
}

.dz-section-link:hover { color: var(--ink); }

.dz-module > .dz-section-title:first-child { margin-top: var(--s7); }

/* Eski tema başlık süsleri (üçgen gölge, renkli zemin) kaldırıldı */
.dz-section-title span,
h2 span::before, h2 span::after { background: none !important; border: 0 !important; }


/* ==========================================================================
   16. Ürün ızgarası
   --------------------------------------------------------------------------
   Tek ızgara sınıfı bütün listelemelerde kullanılır: ana sayfa modülleri,
   kategori, arama, marka ve benzer ürünler. Bootstrap sütunları içeride
   nötrlenir ki şablonlardaki col-* sınıfları düzeni bozmasın.
   ========================================================================== */

.dz-grid {
	display: grid;
	gap: var(--s6) var(--s2);
	grid-template-columns: repeat(2, 1fr);
	margin: 0;
	padding: 0 var(--pad);
}

.dz-grid::before, .dz-grid::after { display: none; }

.dz-grid > .leftrightx,
.dz-grid > .product-layout,
.dz-grid > [class*="col-"] {
	display: flex;
	float: none;
	margin: 0;
	min-width: 0;
	padding: 0;
	width: 100%;
}

.dz-grid > .leftrightx > .product-layout,
.dz-grid > [class*="col-"] > .product-layout {
	display: flex;
	margin: 0;
	width: 100%;
}

/* Liste görünümü — kart tam satır kaplar */
.dz-grid > .leftrightx.product-list { grid-column: 1 / -1; }

.dz-grid > .product-list .product-thumb { flex-direction: row; gap: var(--s4); }
.dz-grid > .product-list .product-thumb .image { flex: 0 0 34%; margin: 0; }
.dz-grid > .product-list .product-thumb .caption { justify-content: center; }

/* Yatay kayan şerit — dar alanlarda ızgara yerine kullanılabilir */
.dz-rail {
	display: flex;
	gap: var(--s3);
	overflow-x: auto;
	padding: 0 var(--pad) var(--s2);
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.dz-rail::-webkit-scrollbar { height: 2px; }
.dz-rail::-webkit-scrollbar-thumb { background: var(--line-dark); }
.dz-rail > * { flex: 0 0 62%; scroll-snap-align: start; }


/* ==========================================================================
   17. Ürün kartı
   ========================================================================== */

.product-thumb {
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	display: flex;
	flex-direction: column;
	margin: 0;
	overflow: visible;
	position: relative;
	text-align: left;
	width: 100%;
}

/* Fotoğraf kutusu — sabit 4:5 oran, kartlar hep aynı hizada kalır */
.product-thumb .image {
	background: var(--fill);
	float: none !important;
	margin: 0 0 var(--s3);
	overflow: hidden;
	padding: 0 !important;
	position: relative;
	width: 100% !important;
}

.product-thumb .image > a {
	display: block;
	padding-bottom: 125%;
	position: relative;
	width: 100%;
}

.product-thumb .image img {
	height: 100%;
	left: 0;
	object-fit: cover;
	position: absolute;
	top: 0;
	transition: transform 0.6s var(--ease), opacity var(--slow) var(--ease);
	width: 100%;
}

/* İkinci fotoğraf — masaüstünde üzerine gelince görünür (bkz. bölüm 32) */
.product-thumb .image img.hover-image { opacity: 0; }

.product-thumb .rating { display: none !important; }

.product-thumb .caption {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 0;
	text-align: left !important;
}

/* Ürün adları çok uzun ("İpek Bambu 4 Sezon Şal Mavi İnce Kumaş Özel Gümüş
   Deri Baskılı Tasarım Şal Eşarp") ve kart yüksekliklerini bozuyordu.
   En fazla iki satır gösterilir; tam ad ürün sayfasında görünür. */
.product-thumb .caption h4 {
	display: -webkit-box;
	font-size: 12px;
	font-weight: 300;
	letter-spacing: 0.02em;
	line-height: 1.45;
	margin: 0 0 var(--s2);
	max-height: 2.9em;
	overflow: hidden;
	text-overflow: ellipsis;
	text-transform: none;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.product-thumb .caption h4 a { color: var(--ink); }
.product-thumb .caption h4 a:hover { color: var(--ink-soft); }

/* Panelden gelen kısa açıklama kartta yer kaplıyordu */
.product-thumb .caption p:not(.price) { display: none; }

.product-thumb .price {
	color: var(--ink);
	display: flex;
	flex-wrap: wrap;
	font-size: 13px;
	font-weight: 400;
	gap: var(--s2);
	letter-spacing: 0.01em;
	margin: auto 0 0;
	padding: 0;
}

.product-thumb .price-new { color: var(--ink); }

.product-thumb .price-old {
	color: var(--ink-faint);
	font-weight: 300;
	text-decoration: line-through;
}

.product-thumb .price-old + .price-new { color: var(--sale); }
.product-thumb .price-tax { display: none; }

/* İndirim rozeti */
.product-thumb .indirims { background: none; padding: 0; }

.product-thumb .discount {
	background: var(--accent);
	color: #fff;
	font-size: 10px;
	font-weight: 400;
	left: 0;
	letter-spacing: 0.08em;
	line-height: 1;
	padding: var(--s2) var(--s2);
	position: absolute;
	top: 0;
	z-index: 3;
}

.product-thumb .discount b { font-weight: 400; }

/* Stok bitti perdesi */
.product-thumb .miktar::after {
	background: rgba(21, 17, 15, 0.8);
	color: #fff;
	content: "TÜKENDİ";
	font-size: 10px;
	letter-spacing: 0.1em;
	padding: var(--s2);
	position: absolute;
	right: 0;
	top: 0;
	z-index: 3;
}

/* Hızlı işlem düğmeleri — mobilde gizli, masaüstünde fotoğrafta belirir */
.product-thumb .button-group { display: none; }

/* Düğme ikonları: PNG'ler bulanıktı, yerlerine SVG çizim kondu */
.product-thumb .button-group button img { display: none; }

.product-thumb .button-group button {
	background-position: center;
	background-repeat: no-repeat;
	background-size: 17px 17px;
}

.product-thumb .button-group button:nth-child(1) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M15.8 15.8 20 20'/%3E%3C/svg%3E");
}

.product-thumb .button-group button:nth-child(2) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 7.5h13l-1 12h-11z'/%3E%3Cpath d='M9 7.5V6a3 3 0 0 1 6 0v1.5'/%3E%3C/svg%3E");
}

.product-thumb .button-group button:nth-child(3) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315110f' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.3A3.7 3.7 0 0 1 12 8a3.7 3.7 0 0 1 7 2.7C19 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}

.product-thumb .button-group button:hover:nth-child(1) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M15.8 15.8 20 20'/%3E%3C/svg%3E");
}

.product-thumb .button-group button:hover:nth-child(2) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 7.5h13l-1 12h-11z'/%3E%3Cpath d='M9 7.5V6a3 3 0 0 1 6 0v1.5'/%3E%3C/svg%3E");
}

.product-thumb .button-group button:hover:nth-child(3) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.3A3.7 3.7 0 0 1 12 8a3.7 3.7 0 0 1 7 2.7C19 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}


/* ==========================================================================
   18. Kategori kartı
   ========================================================================== */

.dz-grid-cat {
	display: grid;
	gap: var(--s2);
	grid-template-columns: repeat(2, 1fr);
	padding: 0 var(--pad);
}

.dz-grid-cat > [class*="col-"] { float: none; padding: 0; width: 100%; }

.dz-grid-cat .product-thumb { margin: 0; position: relative; }
.dz-grid-cat .image { margin: 0; }
.dz-grid-cat .image > a { padding-bottom: 128%; }

.dz-grid-cat .image::after {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.46), rgba(0, 0, 0, 0) 58%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.dz-grid-cat .kategory {
	bottom: 0;
	left: 0;
	padding: var(--s4);
	position: absolute;
	right: 0;
	z-index: 2;
}

.dz-grid-cat h4 { margin: 0; }

.dz-grid-cat h4 a {
	color: #fff;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.dz-grid-cat .baslak {
	color: rgba(255, 255, 255, 0.82);
	display: block;
	font-size: 10px;
	letter-spacing: 0.1em;
	margin-top: var(--s1);
	text-transform: uppercase;
}


/* ==========================================================================
   19. Breadcrumb ve sayfa başlığı
   ========================================================================== */

.breadcrumb {
	background: none;
	font-size: 10px;
	letter-spacing: 0.1em;
	margin: 0;
	padding: var(--s4) var(--pad);
}

.breadcrumb > li { color: var(--ink-faint); display: inline; }
.breadcrumb > li a { color: var(--ink-faint); }
.breadcrumb > li a:hover { color: var(--ink); }
.breadcrumb > li:last-child a { color: var(--ink); }
.breadcrumb > li + li::before { color: var(--line-dark); content: "/"; padding: 0 var(--s2); }

.dz-category-head {
	margin-bottom: var(--s5);
	padding: 0 var(--pad);
}

.dz-category-title,
#content > h1,
#content > h2:first-of-type {
	font-size: 22px;
	font-weight: 400;
	letter-spacing: 0.01em;
	margin: 0 0 var(--s2);
	text-transform: none;
}

#content > h1, #content > h2:first-of-type { padding: 0 var(--pad); }
.dz-category-head .dz-category-title { padding: 0; }

.dz-category-desc {
	color: var(--ink-soft);
	font-size: 13px;
	line-height: 1.7;
	margin-top: var(--s3);
	max-width: 70ch;
}

.dz-category-desc img { display: none; }


/* ==========================================================================
   20. Filtre / sıralama çubuğu
   ========================================================================== */

#product-category > .row,
.product-filter,
.dz-toolbar {
	align-items: center;
	border-bottom: 1px solid var(--line);
	border-top: 1px solid var(--line);
	display: flex;
	flex-wrap: wrap;
	gap: var(--s3);
	justify-content: space-between;
	margin: 0 0 var(--s5);
	padding: var(--s2) var(--pad);
}

.product-filter .btn-group { display: none; }

.dz-toolbar-group { align-items: center; display: flex; gap: var(--s2); }

.product-filter select,
#input-sort,
#input-limit,
.selecting {
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: var(--ink);
	cursor: pointer;
	font-size: 11px;
	height: 40px;
	letter-spacing: 0.08em;
	max-width: 180px;
	padding: 0 var(--s5) 0 0;
	text-transform: uppercase;
	width: auto;

	/* Kendi oku — tarayıcı varsayılanı her yerde farklı görünüyordu */
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%2315110f' stroke-width='1.3'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E");
	background-position: right 4px center;
	background-repeat: no-repeat;
	background-size: 10px 7px;
}

.product-filter label,
.dz-toolbar label {
	color: var(--ink-faint);
	font-size: 10px;
	letter-spacing: 0.1em;
	margin: 0;
	text-transform: uppercase;
}

.dz-result-count { color: var(--ink-faint); font-size: 11px; letter-spacing: 0.06em; }

/* Arama sayfasındaki gelişmiş arama kutusu */
.dz-search-panel {
	background: var(--fill);
	margin: 0 var(--pad) var(--s6);
	padding: var(--s5);
}

.dz-search-row {
	display: grid;
	gap: var(--s4);
	grid-template-columns: 1fr;
}

.dz-search-panel .form-group { margin: 0; }

.dz-search-panel .form-control,
.dz-search-panel select {
	background-color: var(--surface);
	border: 1px solid var(--line-dark);
	padding: 0 var(--s3);
}

.dz-search-checks {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s5);
	margin: var(--s3) 0 var(--s4);
}

.dz-search-panel .btn { width: 100%; }

/* Sekmeli ürün modülü — sekme çubuğu ile ızgara aynı kenar boşluğunu kullanır */
.dz-tabs-module .nav-tabs { margin-top: 0; }
.dz-tabs-module .tab-content { padding: var(--s5) 0 0; }
.dz-tabs-module .tab-content > .tab-pane { display: none; }
.dz-tabs-module .tab-content > .tab-pane.active { display: block; }


/* ==========================================================================
   21. Yan sütun
   ========================================================================== */

#column-left, #column-right { margin: 0 0 var(--s5); }

.yo-menu, .box, .list-group {
	background: none;
	border: 0;
	border-radius: 0;
	margin: 0 0 var(--s6);
}

.yo-menu .yo-heading,
.box .box-heading,
.list-group .list-group-item.heading {
	background: none !important;
	border: 0;
	border-bottom: 1px solid var(--line);
	color: var(--ink) !important;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.16em;
	padding: var(--s3) var(--pad);
	text-transform: uppercase;
}

.yo-menu .yo-heading i { color: var(--ink) !important; }
.yo-menu .yo-wrapper { background: none; border: 0; padding: 0; }

.yo-menu ul.yo-fm, .yo-menu ul.yo-am,
.yo-menu ul.yo-fm ul, .yo-menu ul.yo-am ul {
	background: none;
	margin: 0;
	padding: 0;
}

.yo-menu ul.yo-fm li, .yo-menu ul.yo-am li {
	background: none !important;
	border: 0;
	border-bottom: 1px solid var(--line);
	float: none;
	width: 100%;
}

.yo-menu ul.yo-fm li a, .yo-menu ul.yo-am li a {
	background: none !important;
	color: var(--ink-soft) !important;
	display: block;
	font-size: 11px;
	font-weight: 300;
	letter-spacing: 0.1em;
	padding: var(--s3) var(--pad) !important;
	text-transform: uppercase;
}

.yo-menu ul.yo-fm li a span, .yo-menu ul.yo-am li a span { color: inherit !important; }

.yo-menu ul.yo-fm li a:hover, .yo-menu ul.yo-am li a:hover,
.yo-menu ul.yo-fm li a:hover span {
	background: none !important;
	color: var(--ink) !important;
}

.yo-menu ul.yo-fm li.active > a, .yo-menu ul.yo-fm li a.active,
.yo-menu ul.yo-am li a.active, .yo-menu ul.yo-fm li a.active span {
	background: none !important;
	color: var(--ink) !important;
	font-weight: 400;
}

.yo-menu ul.yo-fm li li a, .yo-menu ul.yo-am li li a {
	font-size: 11px;
	padding-left: var(--s6) !important;
	text-transform: none;
}

.yo-menu .am-badge, .yo-menu .fm-badge {
	background: none;
	color: var(--ink-faint);
	float: right;
	font-size: 10px;
}

/* Yan sütundaki ürün listesi tek sütuna iner */
#column-left .product-thumb, #column-right .product-thumb { flex-direction: row; gap: var(--s3); }
#column-left .product-thumb .image, #column-right .product-thumb .image { flex: 0 0 76px; margin: 0; }
#column-left .product-thumb .button-group, #column-right .product-thumb .button-group { display: none !important; }


/* ==========================================================================
   22. Ürün detay
   ========================================================================== */

.dz-product { padding: 0 var(--pad); }

/* Fotoğraf sütunu */
.dz-gallery { margin: 0 0 var(--s5); }

.dz-gallery-main {
	background: var(--fill);
	margin: 0 0 var(--s2);
	overflow: hidden;
	position: relative;
}

.dz-gallery-main > a, .dz-gallery-main > img {
	display: block;
	width: 100%;
}

/* Telefonda fotoğraflar yan yana kaydırılır — sayfa upuzun olmaz.
   Masaüstünde iki sütunlu ızgaraya döner (bölüm 32). */
.thumbnails, .product-image {
	display: flex;
	gap: var(--s1);
	list-style: none;
	margin: 0 0 var(--s5);
	overflow-x: auto;
	padding: 0;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.thumbnails::-webkit-scrollbar { height: 2px; }
.thumbnails::-webkit-scrollbar-thumb { background: var(--line-dark); }

.thumbnails > li, .thumbnails > div {
	flex: 0 0 86%;
	margin: 0;
	scroll-snap-align: center;
}

.thumbnails .thumbnail,
.thumbnails a.thumbnail {
	background: var(--fill);
	border: 0;
	border-radius: 0;
	display: block;
	margin: 0;
	padding: 0;
}

.thumbnails img, .product-image img {
	background: var(--fill);
	display: block;
	width: 100%;
}

/* Ek fotoğraflar — ana görselin altında küçük kareler */
.dz-thumbs {
	display: grid;
	gap: var(--s1);
	grid-template-columns: repeat(4, 1fr);
	margin-top: var(--s1);
}

.dz-thumbs li { margin: 0; }
.dz-thumbs .thumbnail { opacity: 0.7; transition: opacity var(--fast) var(--ease); }
.dz-thumbs .thumbnail:hover { opacity: 1; }

/* Bilgi sütunu */
.urun, .dz-product-info { padding: 0; }

.product_heading, h1.product_heading {
	font-size: 22px;
	font-weight: 400;
	letter-spacing: 0.01em;
	line-height: 1.3;
	margin: 0 0 var(--s3);
	text-transform: none;
}

.product-info .rating { margin: 0 0 var(--s4); }
.product-info .rating p { color: var(--ink-faint); font-size: 11px; margin: 0; }
.product-info .rating .fa-star { color: var(--accent); }
.product-info .rating a { color: var(--ink-soft); }

.product_infos { margin: 0 0 var(--s4); }

.product_infos ul li {
	color: var(--ink-soft);
	font-size: 12px;
	padding: var(--s1) 0;
}

.product_infos .desc { color: var(--ink-faint); }
.product_infos strong { color: var(--ink); font-weight: 400; }

/* Fiyat bloğu */
.para { margin: 0 0 var(--s5); }

.mainprice, .product-price {
	border-bottom: 1px solid var(--line);
	border-top: 1px solid var(--line);
	color: var(--ink);
	float: none !important;
	margin: 0 0 var(--s5);
	padding: var(--s4) 0;
	width: 100% !important;
}

.mainprice ul { margin: 0; }
.mainprice li { list-style: none; }

.mainprice h1 {
	color: var(--ink);
	display: inline;
	font-family: var(--sans);
	font-size: 24px;
	font-weight: 400;
	letter-spacing: 0.01em;
	margin: 0;
}

.mainprice .desc1 {
	color: var(--ink-faint);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.mainprice .price-old,
.mainprice li > span[style*="line-through"] {
	color: var(--ink-faint) !important;
	font-size: 15px;
	margin-right: var(--s3);
	text-decoration: line-through;
}

.mainprice .price-new { color: var(--sale); }
.mainprice li[style*="min-height"] h1 { color: var(--sale); }

/* Varyant seçimi */
#product { margin: 0 0 var(--s5); }

#product .form-group { float: none !important; margin-bottom: var(--s5); width: 100% !important; }
#product .ciz { float: none !important; padding: 0 !important; width: 100% !important; }

#product label.control-label {
	color: var(--ink-faint);
	display: block;
	font-size: 10px;
	letter-spacing: 0.12em;
	margin-bottom: var(--s2);
	text-transform: uppercase;
}

#product .required label.control-label::after { color: var(--sale); content: " *"; }

/* Beden/renk seçenekleri düğme gibi görünür */
#product .radio, #product .checkbox { display: inline-block; margin: 0 var(--s2) var(--s2) 0; }

#product .radio label, #product .checkbox label {
	border: 1px solid var(--line-dark);
	color: var(--ink);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	font-size: 12px;
	gap: var(--s2);
	letter-spacing: 0.06em;
	min-height: 44px;
	padding: 0 var(--s4);
	transition: border-color var(--fast) var(--ease), background var(--fast) var(--ease);
}

#product .radio label:hover, #product .checkbox label:hover { border-color: var(--ink); }
#product .radio input, #product .checkbox input { margin: 0; }
#product .radio img, #product .checkbox img { border: 0; max-width: 30px; }

/* Adet ve sepete ekle */
.dz-buy {
	display: flex;
	flex-direction: column;
	gap: var(--s2);
	margin: var(--s5) 0 0;
}

.dz-qty {
	align-items: center;
	border: 1px solid var(--line-dark);
	display: inline-flex;
	height: 52px;
	width: 132px;
}

.dz-qty button {
	background: none;
	border: 0;
	color: var(--ink);
	font-size: 18px;
	height: 100%;
	line-height: 1;
	width: 44px;
}

.dz-qty input {
	border: 0 !important;
	height: 100% !important;
	padding: 0 !important;
	text-align: center;
	width: 44px !important;
}

#button-cart, #button-hizli {
	font-size: 11px;
	letter-spacing: 0.16em;
	min-height: 52px;
	width: 100%;
}

#button-cart { background: var(--ink); border-color: var(--ink); color: #fff; }
#button-cart:hover { background: #000; border-color: #000; }

#button-hizli { background: none; border-color: var(--ink); color: var(--ink); }
#button-hizli:hover { background: var(--ink); color: #fff; }

/* Adet alanı — footer betiği input'u .dz-qty ile sarar */
#product .form-group.qty { margin-bottom: var(--s4); }

/* Favoriye ekle bağlantısı */
.dz-wish {
	color: var(--ink-soft);
	font-size: 11px;
	letter-spacing: 0.1em;
	margin-top: var(--s4);
	text-decoration: none;
	text-transform: uppercase;
}

.dz-wish:hover { color: var(--sale); }
.dz-wish .fa { margin-right: var(--s1); }

/* Yorum yıldız seçimi */
.dz-rating-input {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
}

.dz-rating-input input { margin: 0; }

/* Etiketler */
.dz-tags {
	border-top: 1px solid var(--line);
	font-size: 12px;
	margin: var(--s6) var(--pad) 0;
	padding-top: var(--s4);
}

.dz-tags a { color: var(--ink-soft); text-decoration: underline; text-underline-offset: 3px; }
.dz-tags a:hover { color: var(--ink); }

/* Ürün sayfası güven satırı */
.dz-assurance {
	border-top: 1px solid var(--line);
	display: grid;
	gap: var(--s3);
	margin-top: var(--s5);
	padding-top: var(--s4);
}

.dz-assurance li {
	align-items: center;
	color: var(--ink-soft);
	display: flex;
	font-size: 11px;
	gap: var(--s2);
	letter-spacing: 0.04em;
}

.dz-assurance .fa { color: var(--ink); font-size: 14px; width: 18px; }


/* ==========================================================================
   23. Sekmeler
   ========================================================================== */

.nav-tabs {
	border-bottom: 1px solid var(--line);
	display: flex;
	flex-wrap: wrap;
	gap: var(--s6);
	margin: var(--s7) 0 0;
	padding: 0 var(--pad);
}

.nav-tabs > li { float: none; margin: 0; }

.nav-tabs > li > a,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	background: none !important;
	border: 0 !important;
	border-bottom: 1px solid transparent !important;
	border-radius: 0;
	color: var(--ink-faint) !important;
	font-size: 11px;
	letter-spacing: 0.14em;
	margin: 0;
	padding: var(--s3) 0;
	text-transform: uppercase;
}

.nav-tabs > li > a:hover { color: var(--ink-soft) !important; }

.nav-tabs > li.active > a {
	border-bottom-color: var(--ink) !important;
	color: var(--ink) !important;
}

/* Eski temadaki üçgen gölge süsleri */
.nav-tabs > li > a::before, .nav-tabs > li > a::after { display: none !important; }

.tab-content { padding: var(--s5) var(--pad); }
.tab-content p { color: var(--ink-soft); line-height: 1.75; }

/* Yorum bloğu */
#tab-review .form-group { margin-bottom: var(--s5); }
#tab-review .dz-section-title { margin: var(--s6) 0 var(--s4); padding: 0; }

.dz-review { border-bottom: 1px solid var(--line); padding: var(--s5) 0; }
.dz-review:last-of-type { border-bottom: 0; }

.dz-review-head {
	align-items: baseline;
	display: flex;
	gap: var(--s3);
	justify-content: space-between;
	margin-bottom: var(--s1);
}

.dz-review-head strong { font-size: 13px; font-weight: 400; }
.dz-review-head .dz-faint { font-size: 11px; }
.dz-review .rating { margin-bottom: var(--s2); }
.dz-review .rating .fa-star { color: var(--accent); }
.dz-review .rating .fa-star-o { color: var(--line-dark); }
.dz-review p { color: var(--ink-soft); font-size: 13px; line-height: 1.7; margin: 0; }


/* ==========================================================================
   24. Sepet sayfası
   ========================================================================== */

#checkout-cart { padding-bottom: var(--s7); }

/* Şablonda başlık iki kez basılıyor; ikincisi gizlenir */
#content > h1 + h1, #content .container > h1 + h2 { display: none; }

.table-responsive { border: 0; margin: 0 0 var(--s5); overflow-x: auto; }

#content .table {
	border: 0;
	font-size: 13px;
	margin: 0 0 var(--s5);
	width: 100%;
}

#content .table > thead > tr > td,
#content .table > thead > tr > th {
	background: none;
	border: 0;
	border-bottom: 1px solid var(--line);
	color: var(--ink-faint);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.1em;
	padding: var(--s3) var(--s2);
	text-transform: uppercase;
}

#content .table > tbody > tr > td {
	background: none;
	border: 0;
	border-bottom: 1px solid var(--line);
	padding: var(--s4) var(--s2);
	vertical-align: middle;
}

#content .table img {
	background: var(--fill);
	border: 0;
	border-radius: 0;
	max-width: 76px;
}

#content .table a { color: var(--ink); }
#content .table small { color: var(--ink-faint); display: block; font-size: 11px; }

/* Adet kutusu */
.input-group { display: flex; gap: var(--s1); }
.input-group .form-control { min-width: 0; text-align: center; }
.input-group-btn { display: flex; gap: var(--s1); }

.input-group-btn .btn {
	min-height: 44px;
	min-width: 44px;
	padding: 0;
}

.input-group-btn .btn-danger { background: none; border-color: var(--line-dark); color: var(--ink-soft); }
.input-group-btn .btn-danger:hover { background: var(--sale); border-color: var(--sale); color: #fff; }

/* Sepet satırları — telefonda da tablo gibi sıkışmaz */
.dz-cart-list { border-top: 1px solid var(--line); margin: 0 0 var(--s5); }

.dz-cart-item {
	border-bottom: 1px solid var(--line);
	display: flex;
	gap: var(--s4);
	padding: var(--s4) 0;
}

.dz-cart-thumb { flex: 0 0 88px; }

.dz-cart-thumb img {
	background: var(--fill);
	display: block;
	width: 100%;
}

.dz-cart-body { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }

.dz-cart-name {
	color: var(--ink);
	display: block;
	font-size: 13px;
	line-height: 1.45;
	margin-bottom: var(--s2);
}

.dz-cart-options {
	color: var(--ink-faint);
	font-size: 11px;
	margin: 0 0 var(--s2);
}

.dz-cart-options li { padding: 1px 0; }

.dz-cart-controls {
	align-items: flex-end;
	display: flex;
	flex-wrap: wrap;
	gap: var(--s3);
	justify-content: space-between;
	margin-top: auto;
	padding-top: var(--s3);
}

.dz-cart-controls .input-group { flex: 0 0 auto; width: auto; }
.dz-cart-controls .form-control { border: 1px solid var(--line-dark); height: 44px; text-align: center; width: 56px; }

.dz-cart-price { text-align: right; }
.dz-cart-price span { display: block; font-size: 11px; }
.dz-cart-price strong { font-size: 15px; font-weight: 400; }

.dz-cart-extras { margin: var(--s6) 0 0; }
.dz-continue { display: block; margin-top: var(--s4); text-align: center; width: 100%; }

/* Toplam kutusu */
.dz-cart-summary {
	background: var(--fill);
	margin: 0 0 var(--s5);
	padding: var(--s5);
}

.dz-cart-summary .table { margin: 0; }
.dz-cart-summary .table td { border: 0; padding: var(--s2) 0; }
.dz-cart-summary .table tr:last-child td { border-top: 1px solid var(--line-dark); font-size: 16px; padding-top: var(--s3); }

.buttons {
	display: flex;
	flex-direction: column;
	gap: var(--s2);
	margin-top: var(--s5);
}

.buttons .pull-left, .buttons .pull-right { float: none !important; width: 100%; }
.buttons .btn { width: 100%; }


/* ==========================================================================
   25. Kasa
   --------------------------------------------------------------------------
   Hem standart kasa hem quickcheckout eklentisi aynı görünümü kullanır.
   Yalnızca yerleşim değişir; alan adları ve AJAX akışı korunur.
   ========================================================================== */

#checkout-checkout, #quickcheckout, .quickcheckout-content { max-width: 100%; }

#quickcheckout [class*="col-"],
#checkout-checkout [class*="col-"] {
	float: none;
	max-width: 100%;
	width: 100%;
}

#quickcheckout .panel,
#checkout-checkout .panel,
.quickcheckout-content .panel {
	background: none;
	border: 0;
	border-top: 1px solid var(--line);
	border-radius: 0;
	box-shadow: none;
	margin: 0 0 var(--s1);
}

#quickcheckout .panel-heading,
#checkout-checkout .panel-heading,
.quickcheckout-content .panel-heading {
	background: none;
	border: 0;
	color: var(--ink);
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.14em;
	padding: var(--s5) 0 var(--s3);
	text-transform: uppercase;
}

#quickcheckout .panel-heading a,
#checkout-checkout .panel-heading a { color: var(--ink); }

#quickcheckout .panel-body,
#checkout-checkout .panel-body,
.quickcheckout-content .panel-body { padding: 0 0 var(--s5); }

#quickcheckout .form-horizontal .form-group,
#checkout-checkout .form-horizontal .form-group,
.quickcheckout-content .form-horizontal .form-group {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
	margin: 0 0 var(--s4);
}

#quickcheckout .form-horizontal .control-label,
#checkout-checkout .form-horizontal .control-label {
	flex: 0 0 auto;
	padding: 0 0 var(--s1);
	text-align: left;
	width: 100%;
}

#quickcheckout .form-horizontal .form-group > div,
#checkout-checkout .form-horizontal .form-group > div {
	flex: 1 1 200px;
	min-width: 0;
	padding: 0;
	width: auto;
}

#quickcheckout .radio, #quickcheckout .checkbox,
#checkout-checkout .radio, #checkout-checkout .checkbox { margin: 0 0 var(--s3); }

/* Ödeme ve kargo seçenekleri — tıklanabilir satırlar */
.dz-choice, #quickcheckout .radio label, #checkout-checkout .radio label {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-size: 13px;
	gap: var(--s3);
	min-height: 48px;
	padding: 0;
	width: 100%;
}

.dz-choice input, #quickcheckout .radio input { flex: 0 0 auto; margin: 0; }

/* Sipariş özeti kutusu */
.dz-order-summary {
	background: var(--fill);
	margin: var(--s5) 0;
	padding: var(--s5);
}

.dz-order-summary h3 {
	font-size: 11px;
	letter-spacing: 0.14em;
	margin: 0 0 var(--s4);
	text-transform: uppercase;
}

.dz-order-summary .table td { border: 0; font-size: 13px; padding: var(--s2) 0; }

/* Adım göstergesi */
.dz-steps {
	display: flex;
	gap: var(--s5);
	list-style: none;
	margin: 0 0 var(--s6);
	padding: 0 var(--pad);
}

.dz-steps li {
	color: var(--ink-faint);
	font-size: 10px;
	letter-spacing: 0.12em;
	padding-bottom: var(--s2);
	text-transform: uppercase;
}

.dz-steps li.active { border-bottom: 1px solid var(--ink); color: var(--ink); }

/* Ödeme yöntemi logoları */
#quickcheckout img[src*="payment"], .payment-logo img { max-height: 26px; width: auto; }


/* ==========================================================================
   26. Hesap sayfaları ve içerik kutuları
   ========================================================================== */

#content .well {
	background: none;
	border: 1px solid var(--line);
	border-radius: 0;
	box-shadow: none;
	margin: 0 0 var(--s4);
	padding: var(--s5);
}

#content .well h2 {
	font-family: var(--serif);
	font-size: 18px;
	margin: 0 0 var(--s3);
}

/* Giriş / kayıt sayfası — iki kutu yan yana, mobilde alt alta */
.dz-auth {
	display: grid;
	gap: var(--s4);
	grid-template-columns: 1fr;
	padding: 0 var(--pad);
}

.dz-auth-card {
	border: 1px solid var(--line);
	display: flex;
	flex-direction: column;
	padding: var(--s5);
}

.dz-auth-card h2 {
	font-family: var(--serif);
	font-size: 20px;
	margin: 0 0 var(--s2);
}

.dz-auth-card > p { color: var(--ink-soft); font-size: 13px; }
.dz-auth-card form { margin-top: var(--s4); }
.dz-auth-card .btn { margin-top: var(--s2); width: 100%; }

.dz-auth-card .dz-forgot {
	color: var(--ink-faint);
	display: inline-block;
	font-size: 11px;
	letter-spacing: 0.06em;
	margin-top: var(--s2);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---- Hesap formları -------------------------------------------------
   Kayıt, bilgi düzenleme, adres, şifre ve iade formlarının hepsi
   Bootstrap'in form-horizontal ızgarasını kullanıyor. Etiket üstte,
   alan altta olacak şekilde tek sütuna indirilir. */
.form-horizontal .form-group {
	display: block;
	margin: 0 0 var(--s5);
}

.form-horizontal .control-label,
.form-horizontal [class*="col-sm-"],
.form-horizontal [class*="col-md-"] {
	float: none;
	padding: 0;
	text-align: left;
	width: 100%;
}

.form-horizontal .control-label { display: block; margin-bottom: var(--s2); }

.form-horizontal fieldset { border: 0; margin: 0 0 var(--s7); padding: 0; }

.form-horizontal legend,
#content legend {
	border: 0;
	border-bottom: 1px solid var(--line);
	color: var(--ink);
	font-family: var(--serif);
	font-size: 18px;
	font-weight: 400;
	margin: 0 0 var(--s5);
	padding: 0 0 var(--s3);
	width: 100%;
}

/* Onay kutusu satırları (üyelik sözleşmesi, bülten) */
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline { margin: 0 var(--s5) 0 0; }

.form-horizontal .buttons { align-items: center; }

/* Hesap ana sayfası — bölümler kart ızgarasında */
.dz-account-grid {
	display: grid;
	gap: var(--s6);
	grid-template-columns: 1fr;
	padding: 0 var(--pad);
}

.dz-account-block .dz-section-title { margin: 0 0 var(--s2); padding: 0; }

/* Hesap menüsü — bağlantı listesi */
.dz-account-nav {
	border-top: 1px solid var(--line);
	margin: 0 0 var(--s5);
}

.dz-account-nav a {
	align-items: center;
	border-bottom: 1px solid var(--line);
	color: var(--ink);
	display: flex;
	font-size: 13px;
	justify-content: space-between;
	min-height: 52px;
	padding: 0 var(--s1);
}

.dz-account-nav a::after { color: var(--ink-faint); content: "›"; font-size: 16px; }
.dz-account-nav a:hover { color: var(--ink-soft); }

/* Site haritası — iç içe kategori listeleri okunabilir kalmalı */
#information-sitemap #content ul { margin: 0 0 var(--s3); }
#information-sitemap #content ul ul { border-left: 1px solid var(--line); margin: var(--s1) 0 var(--s2) var(--s2); padding-left: var(--s4); }
#information-sitemap #content li { padding: var(--s1) 0; }
#information-sitemap #content > .row { display: grid; gap: var(--s6); grid-template-columns: 1fr; padding: 0 var(--pad); }
#information-sitemap #content a { color: var(--ink-soft); }
#information-sitemap #content a:hover { color: var(--ink); }

/* Bilgi sayfaları — okunabilir satır uzunluğu */
.dz-article { padding: 0 var(--pad); }
.dz-article .dz-rte { max-width: 75ch; }

/* İletişim sayfasındaki bilgi kutusu */
#information-contact .panel {
	background: var(--fill);
	border: 0;
	margin-bottom: var(--s6);
}

#information-contact .panel-body { padding: var(--s5); }

#information-contact .panel-body .row {
	display: grid;
	gap: var(--s5);
	grid-template-columns: 1fr;
}

#information-contact address { font-style: normal; margin: var(--s2) 0; }
#information-contact .img-thumbnail { border: 0; padding: 0; }

.list-unstyled li { padding: var(--s1) 0; }
#content ul.list-unstyled a { color: var(--ink-soft); }
#content ul.list-unstyled a:hover { color: var(--ink); }

/* Sipariş kartı */
.dz-orders { padding: 0 var(--pad); }

.dz-order-card {
	border: 1px solid var(--line);
	margin: 0 0 var(--s3);
	padding: var(--s5);
}

.dz-order-meta {
	display: grid;
	gap: var(--s4);
	grid-template-columns: repeat(2, 1fr);
	margin-bottom: var(--s4);
}

.dz-order-meta .dz-eyebrow { margin-bottom: 2px; }
.dz-order-meta > div { font-size: 13px; min-width: 0; overflow-wrap: anywhere; }

/* Adres defteri */
.dz-address-grid {
	display: grid;
	gap: var(--s3);
	grid-template-columns: 1fr;
	margin-bottom: var(--s5);
	padding: 0 var(--pad);
}

.dz-address-card {
	border: 1px solid var(--line);
	display: flex;
	flex-direction: column;
	padding: var(--s5);
}

.dz-address-card address {
	color: var(--ink-soft);
	flex: 1 1 auto;
	font-size: 13px;
	font-style: normal;
	line-height: 1.7;
	margin: 0 0 var(--s4);
}

.dz-address-actions { align-items: center; display: flex; gap: var(--s4); }
.dz-address-actions .btn-link { color: var(--ink-faint); }
.dz-address-actions .btn-link:hover { color: var(--sale); }

/* Sipariş tamamlandı ekranı */
.dz-success {
	margin: 0 auto;
	max-width: 560px;
	padding: var(--s8) var(--pad);
	text-align: center;
}

.dz-success-mark {
	align-items: center;
	border: 1px solid var(--line-dark);
	border-radius: 50%;
	color: var(--ok);
	display: inline-flex;
	font-size: 22px;
	height: 68px;
	justify-content: center;
	margin-bottom: var(--s5);
	width: 68px;
}

.dz-success .dz-page-title { margin-bottom: var(--s4); }
.dz-success .dz-rte { margin-bottom: var(--s6); }

.dz-order-card-head {
	align-items: center;
	border-bottom: 1px solid var(--line);
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
	justify-content: space-between;
	margin-bottom: var(--s3);
	padding-bottom: var(--s3);
}

.dz-badge {
	background: var(--fill-warm);
	color: var(--ink-soft);
	display: inline-block;
	font-size: 10px;
	letter-spacing: 0.1em;
	padding: var(--s1) var(--s2);
	text-transform: uppercase;
}

.dz-badge-ok { background: #edf5f0; color: var(--ok); }
.dz-badge-wait { background: var(--fill-warm); color: var(--accent); }


/* ==========================================================================
   27. Butonlar
   ========================================================================== */

/* Temel düğme. Seçiciler tek sınıf düzeyinde tutulur — "button.btn" gibi
   daha güçlü bir seçici, altta gelen .btn-default / .btn-link varyantlarını
   ezer ve ikincil düğmeler de dolu siyah çıkardı. */
.btn, input[type="submit"], .dz-btn {
	align-items: center;
	background: var(--ink);
	border: 1px solid var(--ink);
	border-radius: var(--radius);
	box-shadow: none;
	color: #fff;
	display: inline-flex;
	font-size: 11px;
	font-weight: 400;
	justify-content: center;
	letter-spacing: 0.14em;
	line-height: 1;
	min-height: 48px;
	padding: 0 var(--s6);
	text-align: center;
	text-transform: uppercase;
	transition: background var(--fast) var(--ease), color var(--fast) var(--ease),
	            border-color var(--fast) var(--ease), opacity var(--fast) var(--ease);
	white-space: normal;
}

.btn:hover, .btn:focus, input[type="submit"]:hover,
.btn-danger:hover, .btn-primary:hover, .btn-inverse:hover {
	background: #000;
	border-color: #000;
	color: #fff;
}

/* Renkli Bootstrap varyantları tek dile indirilir */
.btn-danger, .btn-warning, .btn-info, .btn-primary, .btn-success, .btn-inverse {
	background: var(--ink);
	border-color: var(--ink);
	color: #fff;
}

.btn-default, .dz-btn-outline {
	background: none;
	border-color: var(--line-dark);
	color: var(--ink);
}

.btn-default:hover, .dz-btn-outline:hover {
	background: var(--ink);
	border-color: var(--ink);
	color: #fff;
}

.btn-link {
	background: none;
	border: 0;
	color: var(--ink);
	letter-spacing: 0.04em;
	min-height: 0;
	padding: 0;
	text-decoration: underline;
	text-transform: none;
	text-underline-offset: 3px;
}

.btn-link:hover, .btn-link:focus { background: none; color: var(--ink-soft); }

.btn-block { display: flex; width: 100%; }
.btn-xs, .btn-sm { font-size: 10px; min-height: 38px; padding: 0 var(--s4); }
.btn-lg { min-height: 54px; }

.btn[disabled], .btn.disabled { opacity: 0.4; pointer-events: none; }

/* Yükleniyor durumu — data-loading-text kullanan düğmelerde */
.btn.dz-loading { color: transparent !important; pointer-events: none; position: relative; }

.btn.dz-loading::after {
	animation: dz-spin 0.7s linear infinite;
	border: 1.5px solid rgba(255, 255, 255, 0.35);
	border-radius: 50%;
	border-top-color: #fff;
	content: "";
	height: 16px;
	left: calc(50% - 8px);
	position: absolute;
	top: calc(50% - 8px);
	width: 16px;
}

.btn-default.dz-loading::after, .dz-btn-outline.dz-loading::after {
	border-color: rgba(21, 17, 15, 0.25);
	border-top-color: var(--ink);
}

@keyframes dz-spin { to { transform: rotate(360deg); } }

/* Yukarı çık düğmesi */
#back-top, .scroll-to-top, #scrollToTop {
	background: var(--surface) !important;
	border: 1px solid var(--line-dark);
	border-radius: 0;
	bottom: calc(var(--bottom-h) + var(--s4));
	color: var(--ink) !important;
	height: 44px;
	right: var(--s4);
	width: 44px;
}


/* ==========================================================================
   28. Form alanları
   ========================================================================== */

.form-control,
input[type="text"], input[type="email"], input[type="password"],
input[type="tel"], input[type="number"], input[type="search"],
select, textarea {
	background: none;
	border: 0;
	border-bottom: 1px solid var(--line-dark);
	border-radius: var(--radius);
	box-shadow: none;
	color: var(--ink);
	font-size: 14px;
	font-weight: 300;
	height: 48px;
	max-width: 100%;
	padding: 0;
	transition: border-color var(--fast) var(--ease);
	width: 100%;
}

textarea, textarea.form-control {
	height: auto;
	line-height: 1.6;
	min-height: 110px;
	padding: var(--s3) 0;
}

.form-control:focus,
input:focus, select:focus, textarea:focus {
	border-bottom-color: var(--ink);
	box-shadow: none;
	outline: none;
}

select.form-control, select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%2315110f' stroke-width='1.3'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E");
	background-position: right 2px center;
	background-repeat: no-repeat;
	background-size: 10px 7px;
	cursor: pointer;
	padding-right: var(--s5);
}

.form-control::placeholder { color: var(--ink-faint); }

label { font-weight: 400; margin-bottom: var(--s1); }

.control-label {
	color: var(--ink-faint);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.form-group { margin-bottom: var(--s5); }
.form-group.required .control-label::after { color: var(--sale); content: " *"; }

/* Onay kutusu ve seçim düğmesi — dokunma alanı 44px */
.checkbox label, .radio label,
.checkbox-inline, .radio-inline {
	align-items: center;
	color: var(--ink-soft);
	cursor: pointer;
	display: inline-flex;
	font-size: 13px;
	gap: var(--s2);
	min-height: 44px;
	padding: 0;
}

.checkbox input, .radio input { margin: 0; position: static; }

.has-error .form-control { border-bottom-color: var(--sale); }
.text-danger { color: var(--sale); font-size: 11px; }
.text-success { color: var(--ok); }
.text-muted { color: var(--ink-faint); }

/* Tarayıcının otomatik doldurma sarısı */
input:-webkit-autofill,
input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 60px var(--bg) inset;
	-webkit-text-fill-color: var(--ink);
}


/* ==========================================================================
   29. Tablo, sayfalama, uyarı, boş durum
   ========================================================================== */

.pagination {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s1);
	justify-content: center;
	margin: var(--s7) 0 0;
	padding: 0 var(--pad);
}

.pagination > li { display: inline-flex; }

.pagination > li > a, .pagination > li > span {
	align-items: center;
	background: none;
	border: 0;
	color: var(--ink-soft);
	display: inline-flex;
	font-size: 12px;
	justify-content: center;
	min-height: 44px;
	min-width: 40px;
	padding: 0 var(--s2);
	text-align: center;
}

.pagination > .active > span,
.pagination > .active > a,
.pagination > li > a:hover {
	background: none;
	border-bottom: 1px solid var(--ink);
	color: var(--ink);
}

.results, .dz-results {
	color: var(--ink-faint);
	font-size: 11px;
	letter-spacing: 0.06em;
	margin-top: var(--s3);
	padding: 0 var(--pad);
	text-align: center;
}

.alert {
	align-items: flex-start;
	background: var(--fill);
	border: 0;
	border-left: 2px solid var(--ink);
	border-radius: 0;
	color: var(--ink);
	display: flex;
	font-size: 13px;
	gap: var(--s2);
	margin: 0 var(--pad) var(--s4);
	padding: var(--s4);
}

.alert .fa { margin-top: 3px; }
.alert-success { background: #eef5f1; border-left-color: var(--ok); color: var(--ok); }
.alert-danger { background: #fbf0ef; border-left-color: var(--sale); color: var(--sale); }
.alert-info, .alert-warning { background: var(--fill-warm); border-left-color: var(--accent); }

.alert .close {
	background: none;
	border: 0;
	color: inherit;
	font-size: 18px;
	margin-left: auto;
	opacity: 0.5;
	padding: 0 0 0 var(--s3);
	text-shadow: none;
}

.alert .close:hover { opacity: 1; }

/* Boş durum — sepet boş, sonuç yok, favori yok */
.dz-empty {
	color: var(--ink-soft);
	padding: var(--s9) var(--pad);
	text-align: center;
}

.dz-empty-icon {
	color: var(--line-dark);
	display: block;
	font-size: 40px;
	margin-bottom: var(--s4);
}

.dz-empty-title {
	color: var(--ink);
	font-family: var(--serif);
	font-size: 20px;
	margin: 0 0 var(--s2);
}

.dz-empty p { color: var(--ink-faint); font-size: 13px; margin: 0 0 var(--s5); }

/* Şablonlarda sonuç yokken basılan düz paragraf */
#content > p:only-of-type {
	color: var(--ink-faint);
	padding: var(--s8) var(--pad);
	text-align: center;
}

/* Yükleniyor iskeleti */
.dz-skeleton {
	animation: dz-pulse 1.4s ease-in-out infinite;
	background: var(--fill);
}

@keyframes dz-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }


/* ==========================================================================
   30. Altbilgi
   ========================================================================== */

footer {
	background: var(--surface);
	border-top: 1px solid var(--line);
	color: var(--ink-soft);
	margin-top: var(--s8);
	padding: 0 0 calc(var(--bottom-h) + var(--s4));
}

footer .container { padding-left: var(--pad); padding-right: var(--pad); }

.footer_content { width: 100%; }
.footer_right_bottom { align-items: center; display: flex; }
.hombick { padding: var(--s6) 0; }

/* Bülten kutusu — panelden gelen modül */
.hombick input[type="text"], .hombick input[type="email"] { max-width: 320px; }

/* Güven şeridi */
.footer-top {
	background: var(--fill);
	border: 0;
	padding: var(--s5) 0;
}

/* Güven şeridinin HTML'i panelden geliyor ve birkaç kat sarmalayıcı
   içeriyor (inner > col-lg-12 > box-module > row.box-outer > col-md-2).
   Buraya ızgara uygulamak içerideki Bootstrap sütunlarını çökertiyordu;
   maddeler alt alta diziliyordu. Artık Bootstrap'in kendi sütunlarına
   dokunmuyoruz, yalnızca maddenin içini biçimlendiriyoruz. */
.footer-top .box-outer, .footer-top .row { margin: 0; }

.footer-top .column, .footer-top [class*="col-"] { padding: 0 var(--s2); }

/* Genel sıfırlamada .row clearfix'i kapatılmıştı; burada float kullanan
   Bootstrap sütunları var, o yüzden yükseklik çökmesin diye geri verilir. */
.footer-top .row::after,
.footer-top .box-outer::after {
	clear: both;
	content: "";
	display: table;
}

/* Telefonda col-xs-12 yüzünden altı madde alt alta uzuyordu; ikişerli olur */
@media (max-width: 767px) {
	.footer-top .column { float: left; width: 50%; }
	.footer-top .column:nth-child(odd) { clear: left; }
}

/* Şeritteki tek tek maddeler — yalnızca .reassurances hedeflenir.
   Ara sarmalayıcılara dokunulmaz, yoksa Bootstrap sütunları bozulur. */
.footer-top .reassurances {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: var(--s1);
	text-align: center;
}

/* Panelden gelen satır içi renkler sistemi eziyordu */
.footer-top [style*="color"] { color: var(--ink-soft) !important; }

.footer-top .icon-name, .footer-top .fa {
	color: var(--ink) !important;
	font-size: 18px !important;
	line-height: 1;
}

.footer-top h4, .footer-top .description h4 {
	color: var(--ink) !important;
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.12em;
	margin: 0;
	text-transform: uppercase;
}

.footer-top p, .footer-top .description p {
	color: var(--ink-faint) !important;
	font-size: 10px;
	margin: 0;
}

.footer-top .box-module-pavreassurances .box-module-pavreassurances { margin: 0; padding: 0; }

/* Sütunlar */
.footer_content_top {
	display: grid;
	gap: var(--s5);
	grid-template-columns: 1fr;
	padding: var(--s6) 0 var(--s5);
}

.footer_content_top > .column,
.footer_content_top > [class*="col-"],
.content_footer_leftcol {
	float: none;
	padding: 0;
	width: 100%;
}

footer h5, footer .column h5 {
	color: var(--ink);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.16em;
	margin: 0 0 var(--s3);
	text-transform: uppercase;
}

footer ul li { margin: 0; }

footer ul li a, footer .column ul li a {
	color: var(--ink-soft);
	display: inline-block;
	font-size: 13px;
	font-weight: 300;
	padding: var(--s1) 0;
}

footer ul li a:hover { color: var(--ink); }

footer .firm, footer .address, footer .phoneno, footer .email {
	font-size: 13px;
	padding: var(--s1) 0;
}

.footer_about {
	border-top: 1px solid var(--line);
	color: var(--ink-faint);
	font-size: 12px;
	line-height: 1.7;
	padding: var(--s5) 0 0;
}

/* Sosyal medya */
.link-follow {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s2);
	margin: var(--s4) 0 0;
	padding: 0;
}

.link-follow li { float: none; margin: 0; }

.link-follow li a {
	align-items: center;
	background: none;
	border: 1px solid var(--line-dark);
	border-radius: 50%;
	color: var(--ink);
	display: inline-flex;
	height: 42px;
	justify-content: center;
	overflow: hidden;
	width: 42px;
}

.link-follow li a:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.link-follow li a .fa { font-size: 15px; }

/* Ekran okuyucu metni ikonun yanında görünüyordu */
.link-follow li a span {
	height: 1px;
	left: -9999px;
	overflow: hidden;
	position: absolute;
	width: 1px;
}

.footer_content_bottom {
	align-items: center;
	border-top: 1px solid var(--line);
	display: flex;
	flex-direction: column;
	gap: var(--s4);
	margin-top: var(--s5);
	padding: var(--s5) 0 0;
	text-align: center;
}

.footer_left_bottom, .footer-bottom {
	border: 0;
	font-size: 11px;
	letter-spacing: 0.04em;
	margin: 0;
	padding: 0;
}

.footer_left_bottom p { color: var(--ink-faint); margin: 0 0 var(--s3); }
.footer_left_bottom a { color: var(--ink-soft); }

footer img[src*="banka"], .footer_payment {
	display: block;
	margin: 0 auto;
	max-width: 300px;
	opacity: 0.7;
}


/* ==========================================================================
   31. Hareket
   --------------------------------------------------------------------------
   Kaydırdıkça belirme. Sınıflar footer.twig'deki gözlemci tarafından
   eklenir; betik çalışmazsa .dz-anim hiç kurulmaz ve içerik görünür kalır.
   ========================================================================== */

.dz-anim .dz-grid > *,
.dz-anim .dz-reveal {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.5s var(--ease), transform 0.5s var(--ease);
}

.dz-anim .dz-grid.dz-in > *,
.dz-anim .dz-reveal.dz-in {
	opacity: 1;
	transform: none;
}

/* Kartlar sırayla belirir — ilk sekiz karta kademeli gecikme */
.dz-anim .dz-grid.dz-in > *:nth-child(1) { transition-delay: 0.02s; }
.dz-anim .dz-grid.dz-in > *:nth-child(2) { transition-delay: 0.06s; }
.dz-anim .dz-grid.dz-in > *:nth-child(3) { transition-delay: 0.10s; }
.dz-anim .dz-grid.dz-in > *:nth-child(4) { transition-delay: 0.14s; }
.dz-anim .dz-grid.dz-in > *:nth-child(5) { transition-delay: 0.18s; }
.dz-anim .dz-grid.dz-in > *:nth-child(6) { transition-delay: 0.22s; }
.dz-anim .dz-grid.dz-in > *:nth-child(7) { transition-delay: 0.26s; }
.dz-anim .dz-grid.dz-in > *:nth-child(8) { transition-delay: 0.30s; }


/* ==========================================================================
   32. Kırılım noktaları
   ========================================================================== */

/* --- Büyük telefon ------------------------------------------------------ */
@media (min-width: 480px) {
	.dz-grid { gap: var(--s6) var(--s3); }
	.swiper-viewport { max-height: 540px; }
	.dz-rail > * { flex-basis: 44%; }
}

/* --- Tablet ------------------------------------------------------------- */
@media (min-width: 768px) {
	:root { --pad: 28px; }

	body { font-size: 14px; }

	.dz-grid { gap: var(--s7) var(--s4); grid-template-columns: repeat(3, 1fr); }
	.dz-grid-cat { gap: var(--s4); grid-template-columns: repeat(3, 1fr); }
	.dz-rail > * { flex-basis: 30%; }

	.swiper-viewport { height: 60vh; max-height: 600px; }
	.dz-slide-title { font-size: 38px; }
	.dz-slide-caption { padding-bottom: var(--s7); }

	.dz-section-title { font-size: 12px; }

	.footer_content_top { grid-template-columns: repeat(2, 1fr); gap: var(--s6); }

	.footer_content_bottom { flex-direction: row; justify-content: space-between; text-align: left; }
	.footer_left_bottom p { margin-bottom: var(--s2); }
	.footer_payment, footer img[src*="banka"] { margin: 0; }

	/* Fotoğraflar kaydırmalı şeritten iki sütunlu ızgaraya geçer */
	.thumbnails, .product-image {
		display: grid;
		gap: var(--s2);
		grid-template-columns: repeat(2, 1fr);
		overflow: visible;
	}

	.thumbnails > li, .thumbnails > div { flex: none; }
	.thumbnails > .dz-gallery-main { grid-column: 1 / -1; }

	.dz-page-title { font-size: 30px; }
	.product_heading, h1.product_heading { font-size: 26px; }

	.dz-auth { grid-template-columns: repeat(2, 1fr); gap: var(--s5); }

	.dz-account-grid { grid-template-columns: repeat(2, 1fr); gap: var(--s7); }

	.dz-search-row { grid-template-columns: 2fr 1fr; }
	.dz-search-panel .btn { width: auto; }

	#information-contact .panel-body .row { grid-template-columns: repeat(3, 1fr); }
	#information-sitemap #content > .row { grid-template-columns: repeat(2, 1fr); }
	.dz-order-meta { grid-template-columns: repeat(4, 1fr); }

	/* Tablette yazılar okunur boyuta geldiği için alttaki metin
	   maddelerine gerek kalmaz. */
	.dz-band-points { display: none; }

	/* Tablette ızgara 3 sütun; 12 ürün = 4 tam sıra */
	#latest > .leftrightx:nth-child(-n+12),
	#featured > .leftrightx:nth-child(-n+12),
	#bestseller > .leftrightx:nth-child(-n+12),
	#special > .leftrightx:nth-child(-n+12) { display: flex; }
	.dz-address-grid { grid-template-columns: repeat(3, 1fr); }

	.dz-assurance { grid-template-columns: repeat(2, 1fr); }

	.dz-cart-thumb { flex-basis: 120px; }
	.dz-continue { width: auto; }

	.buttons { flex-direction: row; justify-content: space-between; }
	.buttons .btn { width: auto; }

	.dz-buy { flex-direction: row; align-items: stretch; }
	.dz-buy #button-cart { flex: 1 1 auto; }
	.dz-buy #button-hizli { flex: 1 1 auto; margin-top: 0; }

	#quickcheckout .form-horizontal .control-label,
	#checkout-checkout .form-horizontal .control-label { width: auto; }
}

/* --- Laptop ------------------------------------------------------------- */
@media (min-width: 992px) {
	:root { --pad: 40px; }

	#altsabitmenu { display: none; }
	footer { padding-bottom: var(--s7); }

	.dz-grid { gap: var(--s8) var(--s5); grid-template-columns: repeat(4, 1fr); }
	.dz-grid-cat { gap: var(--s5); grid-template-columns: repeat(3, 1fr); }

	/* Geniş ekranda kategori kartı bu kadar uzun olunca sayfayı yoruyor */
	.dz-grid-cat .image > a { padding-bottom: 108%; }

	.footer_content_top { grid-template-columns: repeat(4, 1fr); gap: var(--s6); }

	.swiper-viewport { height: 68vh; max-height: 680px; }
	.dz-slide-title { font-size: 46px; }
	.dz-slide-caption { padding-bottom: var(--s8); }

	.dz-module { margin-bottom: var(--s9); }
	.dz-section-title, .dz-section-head { margin-bottom: var(--s6); }

	#content { padding-bottom: var(--s9); }

	.dz-category-title, #content > h1 { font-size: 28px; }
	.dz-page-title { font-size: 34px; }

	/* Kart fotoğrafında ikinci görsel ve hızlı işlemler */
	.product-thumb:hover .image img:not(.hover-image) { transform: scale(1.03); }
	.product-thumb .image:hover img.hover-image { opacity: 1; }

	.product-thumb .button-group {
		background: none;
		border: 0;
		bottom: var(--s3);
		display: flex;
		gap: var(--s1);
		justify-content: center;
		left: 0;
		opacity: 0;
		padding: 0;
		position: absolute;
		right: 0;
		transform: translateY(6px);
		transition: opacity var(--slow) var(--ease), transform var(--slow) var(--ease);
		z-index: 4;
	}

	.product-thumb:hover .button-group { opacity: 1; transform: none; }

	.product-thumb .button-group button {
		align-items: center;
		background-color: rgba(255, 255, 255, 0.96);
		border: 0;
		border-radius: 50%;
		display: inline-flex;
		height: 40px;
		justify-content: center;
		padding: 0;
		transition: background-color var(--fast) var(--ease);
		width: 40px;
	}

	.product-thumb .button-group button:hover { background-color: var(--ink); }

	/* Yan sütunlu sayfalarda iki kolon.
	   Boşluk yalnızca gerçekten SOL sütun varsa açılır. Daha önce burada
	   "#content.col-sm-9" da vardı; sayfada yalnızca sağ sütun olduğunda
	   solda 250px'lik boş bir şerit bırakıyor, içeriği gereksiz daraltıyordu. */
	#column-left { float: left; padding-right: var(--s6); width: 250px; }
	#column-left + #content { margin-left: 250px; }
	#column-right { float: right; padding-left: var(--s6); width: 250px; }

	/* Ürün detay iki sütun */
	.dz-product-layout {
		display: grid;
		gap: var(--s8);
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
		align-items: start;
	}

	.dz-product-layout > * { min-width: 0; }

	/* Bilgi sütunu ekranda kalır, fotoğraflar kayarken okunur */
	.dz-product-sticky { position: sticky; top: var(--s5); }

	.thumbnails, .product-image { gap: var(--s2); }

	/* Kasa: form solda, özet sağda */
	.dz-checkout-layout {
		display: grid;
		gap: var(--s7);
		grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
		align-items: start;
	}

	.dz-order-summary { margin: 0; position: sticky; top: var(--s5); }

	.dz-auth { gap: var(--s7); max-width: 1000px; margin: 0 auto; }
	.dz-auth-card { padding: var(--s7); }

	.dz-assurance { grid-template-columns: repeat(2, 1fr); }
}

/* --- Geniş masaüstü ----------------------------------------------------- */
@media (min-width: 1400px) {
	:root { --pad: 56px; }
	.dz-grid { gap: var(--s9) var(--s5); }
	.dz-slide-title { font-size: 54px; }
}

/* --- Çok geniş ekran ---------------------------------------------------- */
@media (min-width: 1800px) {
	.dz-grid { grid-template-columns: repeat(5, 1fr); }
}

/* --- Hareketi azalt tercihi --------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}

	.dz-anim .dz-grid > *,
	.dz-anim .dz-reveal { opacity: 1; transform: none; }
}

/* ==========================================================================
   33. Ana sayfa görsel şeritleri
   --------------------------------------------------------------------------
   İki hazır görsel: tasarım tescil bandı (yatay, 2,5:1) ve kargo
   kampanyası (kare). Oranları çok farklı olduğu için ayrı davranırlar.
   ========================================================================== */

.dz-band { margin: var(--s8) 0; }

/* Görseller her zaman TAM gösterilir — kırpma yok. Daha önce tescil bandı
   telefonda object-fit ile kırpılıyordu ve tasarımın kenarları kesik
   görünüyordu. */
.dz-band img {
	display: block;
	height: auto;
	width: 100%;
}

/* --- Tescil bandı ------------------------------------------------------- */

.dz-band-wide { margin-bottom: var(--s7); }

/* Bandın altındaki dört madde — mobilde görselden kırpıldığı için
   metin olarak basılır, masaüstünde gizlenir (görselde zaten var). */
.dz-band-points {
	border-bottom: 1px solid var(--line);
	border-top: 1px solid var(--line);
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(2, 1fr);
	background: var(--line);
	margin: 0;
}

.dz-band-points li {
	align-items: center;
	background: var(--surface);
	color: var(--ink-soft);
	display: flex;
	font-size: 10px;
	justify-content: center;
	letter-spacing: 0.1em;
	min-height: 46px;
	padding: var(--s2);
	text-align: center;
	text-transform: uppercase;
}

/* --- Kargo kampanyası --------------------------------------------------- */

.dz-band-square { padding: 0 var(--pad); }

.dz-band-square a {
	display: block;
	margin: 0 auto;
	max-width: 620px;
	transition: opacity var(--fast) var(--ease);
}

.dz-band-square a:hover { opacity: 0.92; }


/* --- Ana sayfa ürün listesinin uzunluğu ---------------------------------
   "Yeni Ürünler" modülü 30 ürünle geliyordu ve tek başına sayfanın
   yaklaşık 4500 pikselini kaplıyordu; altındaki şeritlere kimse
   ulaşamıyordu. Ana sayfada liste kısaltılır — ürünler kategori
   sayfalarında zaten tam listeleniyor.
   Kalıcı çözüm: panelden modülün ürün limitini düşürmek (o zaman sayfa
   ağırlığı da azalır); buradaki kural yalnızca görünümü toparlar. */
#latest > .leftrightx:nth-child(n+9),
#featured > .leftrightx:nth-child(n+9),
#bestseller > .leftrightx:nth-child(n+9),
#special > .leftrightx:nth-child(n+9) { display: none; }


/* --- Yazdırma ----------------------------------------------------------- */
/* ========================================================================== 
   34. VEILED ESİNTİLİ EDİTORYAL KATMAN
   --------------------------------------------------------------------------
   Bu bölüm yalnızca görsel katmandır. Twig akışı, modül verisi, sepet,
   favori, ödeme ve çekmece davranışları değiştirilmez.

   Referans dili: tam genişlik kapak, ince sans arayüz metni, zarif serif
   başlıklar, 2:3 moda fotoğrafları, sıkı ürün ızgarası ve bol dikey ritim.
   ========================================================================== */

:root {
	--bg:        #ffffff;
	--surface:   #ffffff;
	--ink:       #090909;
	--ink-soft:  #343230;
	--ink-faint: #77736f;
	--line:      #dedbd7;
	--line-dark: #c8c3be;
	--fill:      #f5f2ef;
	--fill-warm: #eee9e4;
	--accent:    #090909;
	--sale:      #955c4c;
	--pad:       14px;
	--head-h:    61px;
	--bottom-h:  54px;
}

body {
	color: var(--ink);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.005em;
	line-height: 1.5;
}

h1, h2,
.product_heading,
.dz-category-title,
.dz-page-title,
.dz-section-title,
.dz-empty-title {
	font-family: var(--serif);
	font-weight: 400;
	letter-spacing: -0.02em;
}

.container { max-width: var(--max); }

/* --- Duyuru, başlık ve menü ------------------------------------------ */

.dz-announce {
	align-items: center;
	background: var(--fill-warm);
	color: var(--ink);
	display: flex;
	font-size: 10px;
	font-weight: 400;
	justify-content: center;
	letter-spacing: 0.08em;
	min-height: 38px;
	padding: 7px var(--pad);
	text-transform: none;
}

.dz-announce a { color: var(--ink); }

#top { background: rgba(255, 255, 255, 0.82); }
#top .container { min-height: 31px; }

#top a, #top .btn, #top span, #top strong {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.055em;
	text-transform: none;
}

#header { background: rgba(255, 255, 255, 0.82); }

#header .container {
	min-height: 72px;
	padding-left: 24px;
	padding-right: 24px;
}

#logo img { max-height: 44px; }

.dz-header-actions { gap: 6px; }
.dz-icon-btn { min-height: 42px; min-width: 38px; }
.dz-icon-btn .fa { font-size: 15px; }

#search, .autosearch-wrapper { max-width: 320px; }

#search .form-control,
#search input[type="text"],
.autosearch-wrapper input[type="text"],
.autosearch-wrapper .search_query {
	background: rgba(255, 255, 255, 0.64);
	border: 0;
	border-bottom: 1px solid rgba(9, 9, 9, 0.28);
	font-size: 11px;
	height: 40px;
	padding-left: 12px;
}

#menu, #supermenu, .navbar {
	background: rgba(255, 255, 255, 0.82) !important;
}

#menu > ul,
#menu .container > ul,
#menu .navbar-nav,
#supermenu > ul,
.supermenu > ul { gap: clamp(22px, 3vw, 50px); }

#menu > ul > li > a,
#menu .container > ul > li > a,
#supermenu > ul > li > a,
.supermenu > ul > li > a {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.055em;
	padding: 11px 0;
	text-transform: none;
}

#menu > ul > li > a::after,
#menu .container > ul > li > a::after,
#supermenu > ul > li > a::after,
.supermenu > ul > li > a::after { bottom: 7px; }

/* Ana sayfada başlık kapağın üzerinde durur. :has desteklemeyen eski
   tarayıcılarda mevcut beyaz başlık güvenli geri dönüş olarak kalır. */
body:has(#content .swiper-viewport) .stk {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.66) 72%, rgba(255, 255, 255, 0));
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

body:has(.dz-announce):has(#content .swiper-viewport) .stk { top: 38px; }

body:has(#content .swiper-viewport) .stk #top,
body:has(#content .swiper-viewport) .stk #header,
body:has(#content .swiper-viewport) .stk #menu,
body:has(#content .swiper-viewport) .stk #supermenu,
body:has(#content .swiper-viewport) .stk .navbar {
	background: transparent !important;
	border-color: rgba(9, 9, 9, 0.14);
}

body:has(#content .swiper-viewport) .stk.dz-stuck {
	background: rgba(255, 255, 255, 0.97);
	box-shadow: 0 1px 0 rgba(9, 9, 9, 0.12);
	position: fixed;
	top: 0;
}

body:has(#content .swiper-viewport) #logo img { mix-blend-mode: multiply; }

/* Mobil başlık işlevini korur; yalnızca daha ince ve kapak üstünde. */
.mobile-header {
	background: rgba(255, 255, 255, 0.96);
	height: var(--head-h);
	padding: 0 12px;
	position: sticky;
	top: 0;
}

body:has(#content .swiper-viewport) .mobile-header {
	background: rgba(255, 255, 255, 0.94);
	border-bottom-color: rgba(9, 9, 9, 0.12);
	margin-bottom: calc(var(--head-h) * -1);
}

.mobile-header #logo img { max-height: 30px; }
.mobile-header a, .mobile-header button { min-width: 38px; }

/* --- Kapak / slayt ----------------------------------------------------- */

.swiper-viewport {
	height: min(133vw, 70svh);
	max-height: 620px;
	min-height: 500px;
}

.swiper-slide img { object-position: center 20%; }

.swiper-slide > a::after {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.44), rgba(0, 0, 0, 0.02) 62%);
}

.dz-slide-caption {
	align-items: center;
	display: flex;
	flex-direction: column;
	padding: 0 24px 44px;
	text-align: center;
}

.dz-slide-title {
	color: #faf4f0;
	font-size: 29px;
	letter-spacing: -0.02em;
	line-height: 1.08;
}

.dz-slide-text {
	color: rgba(250, 244, 240, 0.92);
	font-size: 11px;
	letter-spacing: 0.02em;
	line-height: 1.4;
	max-width: 440px;
}

.dz-slide-cta {
	align-items: center;
	background: transparent;
	border: 1px solid rgba(250, 244, 240, 0.88);
	color: #faf4f0;
	font-size: 10px;
	font-weight: 400;
	justify-content: center;
	letter-spacing: 0.06em;
	margin-top: 18px;
	min-height: 42px;
	min-width: 142px;
	padding: 0 22px;
	text-transform: none;
}

.dz-slide-cta:hover { background: #faf4f0; color: var(--ink); }

.swiper-pagination-bullet { height: 1px; width: 34px; }

/* --- Bölümler ve editoryal ritim -------------------------------------- */

.dz-module { margin-bottom: 72px; }

.dz-section-title {
	font-size: clamp(27px, 7vw, 38px);
	letter-spacing: -0.025em;
	line-height: 1.08;
	margin-bottom: 24px;
	padding: 0 var(--pad);
	text-transform: none;
}

.dz-section-head {
	margin-bottom: 24px;
	padding: 0 var(--pad);
}

.dz-section-head .dz-section-title { margin: 0; padding: 0; }

.dz-section-link {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.04em;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-transform: none;
}

.dz-module > .dz-section-title:first-child { margin-top: 68px; }

/* Ana sayfa ürün modülleri Veiled'daki gibi yatay raydır. Kartların ve
   butonların HTML'i değişmez; sepete ekleme davranışı aynen kalır. */
#superdeal,
#latest,
#featured,
#bestseller,
#special,
#tab-latestq,
#tab-featuredq,
#tab-bestsellerq,
#tab-specialq {
	display: flex;
	gap: 2px;
	grid-template-columns: none;
	overflow-x: auto;
	padding: 0;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

#superdeal::-webkit-scrollbar,
#latest::-webkit-scrollbar,
#featured::-webkit-scrollbar,
#bestseller::-webkit-scrollbar,
#special::-webkit-scrollbar,
#tab-latestq::-webkit-scrollbar,
#tab-featuredq::-webkit-scrollbar,
#tab-bestsellerq::-webkit-scrollbar,
#tab-specialq::-webkit-scrollbar { display: none; }

#superdeal > .leftrightx,
#latest > .leftrightx,
#featured > .leftrightx,
#bestseller > .leftrightx,
#special > .leftrightx,
#tab-latestq > .leftrightx,
#tab-featuredq > .leftrightx,
#tab-bestsellerq > .leftrightx,
#tab-specialq > .leftrightx {
	flex: 0 0 58.5vw;
	scroll-snap-align: start;
	width: auto;
}

/* --- Ürün ızgarası ve kartlar ----------------------------------------- */

.dz-grid {
	column-gap: 2px;
	row-gap: 54px;
	padding: 0;
}

.product-thumb .image {
	background: var(--fill);
	margin-bottom: 10px;
}

/* Moda fotoğrafı oranı: 2:3. Swiper slaytlarına dokunulmaz. */
.product-thumb .image > a { padding-bottom: 150%; }

.product-thumb .image img {
	object-fit: contain;
	transition-duration: 0.45s;
}

.product-thumb .caption { padding: 0 9px; }

.product-thumb .caption h4 {
	font-family: var(--serif);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: -0.015em;
	line-height: 1.25;
	margin-bottom: 6px;
	max-height: 2.5em;
}

.product-thumb .price {
	font-size: 11px;
	font-weight: 400;
	gap: 6px;
	letter-spacing: 0.01em;
}

.product-thumb .price-old { font-size: 10px; }

.indirims { left: 8px; right: auto; top: 8px; }

.indirims .discount,
.discount {
	background: rgba(250, 244, 240, 0.94);
	color: var(--ink);
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.04em;
	min-height: 24px;
	padding: 5px 8px;
}

.miktar::after {
	background: rgba(9, 9, 9, 0.88);
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.06em;
}

/* --- Kategori / koleksiyon sayfaları ---------------------------------- */

.breadcrumb {
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.055em;
	padding-bottom: 14px;
	padding-top: 14px;
}

.dz-category-head {
	margin: 0 auto 42px;
	max-width: 760px;
	padding: 40px var(--pad) 0;
	text-align: center;
}

.dz-eyebrow {
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.dz-category-title,
#content > h1 {
	font-size: clamp(32px, 9vw, 46px);
	line-height: 1.05;
}

.dz-category-desc {
	color: var(--ink-soft);
	font-size: 12px;
	line-height: 1.6;
	margin-left: auto;
	margin-right: auto;
	max-width: 560px;
}

.dz-toolbar {
	border-bottom: 1px solid var(--line);
	border-top: 1px solid var(--line);
	margin-bottom: 2px;
	min-height: 50px;
	padding: 0 var(--pad);
}

.dz-toolbar label,
.dz-toolbar select {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.04em;
}

.dz-grid-cat { gap: 2px; }

.dz-grid-cat .kategory {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
	bottom: 0;
	left: 0;
	padding: 34px 14px 14px;
	position: absolute;
	right: 0;
	z-index: 2;
}

.dz-grid-cat .product-thumb { position: relative; }
.dz-grid-cat .product-thumb .image { margin: 0; }
.dz-grid-cat .product-thumb .image img { object-fit: cover; }

.dz-grid-cat .kategory h4,
.dz-grid-cat .kategory h4 a {
	color: #faf4f0;
	font-family: var(--serif);
	font-size: 18px;
	font-weight: 400;
	letter-spacing: -0.015em;
}

.dz-grid-cat .baslak {
	color: rgba(250, 244, 240, 0.9);
	font-family: var(--sans);
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.055em;
	margin-top: 4px;
	text-transform: none;
}

/* --- Ürün detay -------------------------------------------------------- */

.dz-product { padding-top: 10px; }
.dz-product-layout { gap: 42px; }
.thumbnails, .product-image { gap: 2px; }
.thumbnail { border: 0; padding: 0; }

.product_heading, h1.product_heading {
	font-size: 28px;
	letter-spacing: -0.025em;
	line-height: 1.08;
	margin-bottom: 16px;
}

.mainprice h1,
.mainprice .price-new {
	font-family: var(--sans);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.01em;
}

.mainprice { margin-bottom: 24px; }

.dz-product-info .control-label {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.055em;
	text-transform: none;
}

.dz-buy { gap: 8px; }

.dz-buy #button-cart,
.dz-buy #button-hizli {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.055em;
	min-height: 46px;
	text-transform: none;
}

.nav-tabs {
	border-bottom: 1px solid var(--line);
	border-top: 1px solid var(--line);
}

.nav-tabs > li > a {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.055em;
	text-transform: none;
}

/* --- Düğme ve formlar ------------------------------------------------- */

.btn, input[type="submit"], .dz-btn {
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.055em;
	min-height: 42px;
	text-transform: none;
}

.form-control,
input[type="text"], input[type="email"], input[type="password"],
input[type="tel"], input[type="number"], select, textarea {
	font-size: 12px;
	font-weight: 400;
}

/* --- Altbilgi ----------------------------------------------------------- */

.footer-top {
	background: var(--surface);
	border-bottom: 1px solid var(--line);
	border-top: 1px solid var(--line);
}

footer {
	background: var(--fill-warm);
	margin-top: 88px;
	padding-top: 68px;
}

footer h5 {
	font-family: var(--serif);
	font-size: 18px;
	font-weight: 400;
	letter-spacing: -0.015em;
	text-transform: none;
}

footer ul li a, footer .column ul li a {
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.01em;
}

.footer_content_top { gap: 42px 24px; }
.footer_about, .footer_content_bottom { border-color: rgba(9, 9, 9, 0.16); }

.link-follow li a {
	border-color: rgba(9, 9, 9, 0.3);
	height: 38px;
	width: 38px;
}

/* --- Mobil alt navigasyon: işlev korunur, görsel ağırlık azalır ------- */

#altsabitmenu {
	background: rgba(255, 255, 255, 0.93);
	height: calc(var(--bottom-h) + env(safe-area-inset-bottom, 0px));
}

#altsabitmenu a {
	font-size: 8px;
	font-weight: 400;
	gap: 2px;
	letter-spacing: 0.04em;
	text-transform: none;
}

#altsabitmenu a::before { background-size: 18px 18px; height: 18px; width: 18px; }

@media (min-width: 480px) {
	#superdeal > .leftrightx,
	#latest > .leftrightx,
	#featured > .leftrightx,
	#bestseller > .leftrightx,
	#special > .leftrightx,
	#tab-latestq > .leftrightx,
	#tab-featuredq > .leftrightx,
	#tab-bestsellerq > .leftrightx,
	#tab-specialq > .leftrightx { flex-basis: 46vw; }
}

@media (min-width: 768px) {
	:root { --pad: 22px; }

	.swiper-viewport {
		height: 58vw;
		max-height: 700px;
		min-height: 560px;
	}

	.dz-slide-title { font-size: 38px; }
	.dz-slide-caption { padding-bottom: 54px; }

	#superdeal > .leftrightx,
	#latest > .leftrightx,
	#featured > .leftrightx,
	#bestseller > .leftrightx,
	#special > .leftrightx,
	#tab-latestq > .leftrightx,
	#tab-featuredq > .leftrightx,
	#tab-bestsellerq > .leftrightx,
	#tab-specialq > .leftrightx { flex-basis: 35vw; }

	.dz-grid { grid-template-columns: repeat(3, 1fr); }
	.dz-grid-cat { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 992px) {
	:root { --pad: 32px; }

	.swiper-viewport {
		height: 50vw;
		max-height: 760px;
		min-height: 600px;
	}

	.dz-slide-title { font-size: 42px; }
	.dz-slide-caption { padding-bottom: 64px; }

	.dz-module { margin-bottom: 112px; }
	.dz-section-title { font-size: clamp(36px, 3.2vw, 48px); margin-bottom: 30px; }
	.dz-section-head { margin-bottom: 30px; }
	.dz-module > .dz-section-title:first-child { margin-top: 96px; }

	#superdeal > .leftrightx,
	#latest > .leftrightx,
	#featured > .leftrightx,
	#bestseller > .leftrightx,
	#special > .leftrightx,
	#tab-latestq > .leftrightx,
	#tab-featuredq > .leftrightx,
	#tab-bestsellerq > .leftrightx,
	#tab-specialq > .leftrightx {
		flex-basis: min(23.5vw, 360px);
	}

	.dz-grid {
		grid-template-columns: repeat(4, 1fr);
		row-gap: 72px;
	}

	.dz-grid-cat { grid-template-columns: repeat(3, 1fr); }

	.product-thumb:hover .image img:not(.hover-image) { transform: scale(1.015); }

	.product-thumb .button-group { bottom: 10px; gap: 2px; }

	.product-thumb .button-group button {
		border-radius: 0;
		height: 38px;
		width: 38px;
	}

	.dz-category-head { margin-bottom: 64px; padding-top: 64px; }
	.dz-category-title, #content > h1 { font-size: 52px; }

	.dz-product-layout {
		gap: 48px;
		grid-template-columns: minmax(0, 1.5fr) minmax(360px, 1fr);
	}

	.dz-product-sticky { top: 30px; }
	.product_heading, h1.product_heading { font-size: 30px; }

	footer { margin-top: 120px; padding-top: 88px; }
}

@media (min-width: 1400px) {
	:root { --pad: 40px; }
	.dz-grid { gap: 82px 2px; }
}

@media (min-width: 1800px) {
	.dz-grid { grid-template-columns: repeat(4, 1fr); }
}


/* ========================================================================== 
   35. CANLI MAGAZA KALITE DUZELTMELERI
   --------------------------------------------------------------------------
   Chrome'da gercek musteri akislariyla dogrulanan gorsel sorunlari giderir.
   Sepet, favori, arama, Swiper ve odeme isleyislerine dokunulmaz.
   ========================================================================== */

/* Veiled duzeni: her ekranda tek, sade baslik. OpenCart sepet sayacinin
   gorunmeyen tek veri kaynagi ayri tutulur; yinelenen kimlik uretilmez. */
.stk.hidden-xs.hidden-sm.hidden-md { display: none !important; }
.stk.hidden-lg {
	display: block !important;
	height: var(--head-h);
}

.dz-cart-source { display: none !important; }

.dz-drawer-locale {
	border-top: 1px solid var(--line);
	display: flex;
	gap: 8px;
	padding: 18px 20px;
}

.dz-drawer-locale > .pull-left,
.dz-drawer-locale > .dz-drawer-language {
	flex: 1 1 0;
	float: none;
	list-style: none;
	margin: 0;
	min-width: 0;
	padding: 0;
}

.dz-drawer-locale form,
.dz-drawer-locale .btn-group,
.dz-drawer-language > li,
.dz-drawer-language > li > a { display: block; width: 100%; }

.dz-drawer-language > li > a { padding: 0; }
.dz-drawer-language:empty { display: none; }

.dz-drawer-locale .dropdown-toggle {
	align-items: center;
	display: flex;
	gap: 6px;
	justify-content: center;
	min-height: 44px;
	width: 100%;
}

.dz-drawer-locale .dropdown-menu { min-width: 100%; }

.mobile-header {
	background: #f7f5f1;
	border-bottom: 1px solid rgba(9, 9, 9, 0.12);
	justify-content: flex-start;
	padding-left: var(--pad);
	padding-right: var(--pad);
}

.mobile-header #logo {
	left: 50%;
	margin: 0;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
}

.mobile-header .to-search { margin-left: 2px; }
.mobile-header .to-account { margin-left: auto; }
.mobile-header .dz-mobile-cart { margin-left: 2px; }

/* Ana sayfada baslik kapagin uzerinde kalir; beyaz logo zemini mevcut JPG
   logonun kenarlarini gostermeden acik kapaklarla kaynasir. */
body:has(#content .swiper-viewport) .mobile-header {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.82));
	border-bottom-color: rgba(9, 9, 9, 0.1);
}

/* Veiled'da mobil alt cubuk yoktur. Bu cubuk urun ve sepet aksiyonlarini
   ortuyordu; ayni islevler ust baslik ve menu cekmecesinde zaten bulunur. */
#altsabitmenu { display: none !important; }

/* Ana sayfadaki eski, buyuk guven ikonlari kapak ile urun rayinin arasini
   boluyordu. Guven metinleri altbilgide kalmaya devam eder. */
#common-home .box-module-pavreassurances,
body:has(#content .swiper-viewport) .box-module-pavreassurances { display: none !important; }

/* Urun raylari ekran kenarlarina kadar uzanir; kart olculeri degismez. */
#superdeal,
#latest,
#featured,
#bestseller,
#special,
#tab-latestq,
#tab-featuredq,
#tab-bestsellerq,
#tab-specialq {
	margin-left: calc(var(--pad) * -1);
	margin-right: calc(var(--pad) * -1);
	width: calc(100% + (var(--pad) * 2));
}

/* 4:5 kaynak fotograflar 2:3 moda cercevesini bos bant birakmadan doldurur. */
.product-thumb .image img { object-fit: cover; }

.product-thumb .caption {
	align-items: center;
	text-align: center;
}

.product-thumb .caption h4 {
	font-size: 12px;
	line-height: 1.25;
	text-align: center;
}

.product-thumb .price {
	justify-content: center;
	text-align: center;
}

/* Kategori sayfasi Veiled koleksiyonlari gibi tam genislikte ve kenarsizdir. */
#product-category #column-left { display: none; }
#product-category #column-left + #content {
	float: none;
	margin-left: 0;
	width: 100%;
}

#product-category .breadcrumb,
#product-product .breadcrumb { display: none; }

#product-category .dz-category-head {
	margin-bottom: 40px;
	padding-top: 40px;
}

#product-category .dz-grid {
	margin-left: calc(var(--pad) * -1);
	margin-right: calc(var(--pad) * -1);
	width: calc(100% + (var(--pad) * 2));
}

#filterArea {
	position: sticky;
	top: var(--head-h);
}

/* Urun detayinda sag modul kolonu galeriyi sikistirmasin. */
#product-product #column-right { display: none; }
#product-product #content {
	float: none;
	width: 100%;
}

#product-product .thumbnails .thumbnail {
	aspect-ratio: 2 / 3;
	overflow: hidden;
}

#product-product .thumbnails .thumbnail img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

/* Panelde etiketi bos gelen hizli al butonu bos bir cerceve olusturmasin. */
#button-hizli:empty { display: none; }

.dz-buy #button-cart:only-child { flex: 1 1 100%; }

/* Altbilgi Veiled'daki gibi daha kisa ve okunakli kalir. */
footer {
	padding-bottom: 32px;
	padding-top: 0;
}

.footer_content_top { padding: 28px 0 20px; }

footer ul li a,
footer .column ul li a,
footer .firm,
footer .address,
footer .phoneno,
footer .email {
	font-size: 11px;
	line-height: 1.45;
	padding-bottom: 2px;
	padding-top: 2px;
}

.footer_content_bottom {
	gap: 12px;
	margin-top: 20px;
	padding-top: 20px;
}

/* QuickCheckout'in gercek kok kimligi quickcheckoutconfirm'dir. Onceki
   quickcheckout secicileri bu eklentide eslesmedigi icin Bootstrap kolonlari
   ve global input-group kurali yatay tasma yapiyordu. */
#quickcheckoutconfirm,
#quickcheckoutconfirm #quickcheckout-disable,
#quickcheckoutconfirm .quickcheckout-content { max-width: 100%; }

#quickcheckoutconfirm .quickcheckout-content { overflow-x: hidden; }

#quickcheckoutconfirm .input-group {
	display: flex;
	gap: 0;
	max-width: 100%;
	width: 100%;
}

#quickcheckoutconfirm .input-group .form-control {
	flex: 1 1 0;
	min-width: 0;
	width: 1% !important;
}

#quickcheckoutconfirm .input-group-btn {
	display: flex;
	flex: 0 0 auto;
	gap: 0;
	min-width: 44px;
	width: auto;
}

#quickcheckoutconfirm .input-group-btn .btn {
	flex: 0 0 44px;
	min-width: 44px;
}

@media (max-width: 767px) {
	:root { --pad: 14px; }

	.mobile-header .to-navigation,
	.mobile-header .to-search,
	.mobile-header .to-account,
	.mobile-header .dz-mobile-cart {
		min-width: 38px;
		width: 38px;
	}

	/* Veiled mobil koleksiyonlari iki tam, kenarsiz sutundur. */
	#product-category .dz-category-head {
		margin-bottom: 28px;
		padding-top: 28px;
	}

	#product-category .dz-toolbar { margin-bottom: 0; }

	#product-category .dz-grid {
		column-gap: 2px;
		row-gap: 42px;
	}

	/* Mobil urun fotografi Veiled gibi ekran genisliginde 2:3 kapaktir. */
	#product-product #content { padding-left: 0; padding-right: 0; }
	#product-product .dz-product { padding-left: 0; padding-right: 0; }
	#product-product .dz-product-layout { display: block; }
	#product-product .dz-gallery {
		margin-left: calc(var(--pad) * -1);
		margin-right: calc(var(--pad) * -1);
		width: calc(100% + (var(--pad) * 2));
	}
	#product-product .thumbnails {
		gap: 2px;
		margin: 0;
		padding: 0;
	}

	#product-product .thumbnails > li {
		flex: 0 0 100%;
		width: 100%;
	}

	#product-product .thumbnails .thumbnail {
		background: var(--fill);
		margin: 0;
	}

	#product-product .thumbnails .thumbnail img {
		height: 100%;
		object-fit: cover;
		width: 100%;
	}

	#product-product .dz-product-info {
		margin-left: calc(var(--pad) * -1);
		margin-right: calc(var(--pad) * -1);
		padding: 28px 20px 0;
		width: calc(100% + (var(--pad) * 2));
	}

	#product-product .product_heading,
	#product-product h1.product_heading {
		font-size: 24px;
		line-height: 1.12;
	}

	/* Mobil kasada Bootstrap kolonlari ust uste gelir ve tam genislik kullanir. */
	#quickcheckoutconfirm [class*="col-"] {
		float: none;
		margin-left: 0;
		margin-right: 0;
		max-width: 100%;
		padding-left: 0;
		padding-right: 0;
		width: 100%;
	}

	/* Siparis tablosu telefonda kart duzenine doner; alan adlari ve AJAX
	   dugmeleri aynen korunur. */
	#quickcheckoutconfirm .quickcheckout-cart,
	#quickcheckoutconfirm .quickcheckout-cart tbody { display: block; width: 100%; }
	#quickcheckoutconfirm .quickcheckout-cart thead { display: none; }

	#quickcheckoutconfirm .quickcheckout-cart tbody > tr {
		border-bottom: 1px solid var(--line);
		display: grid;
		gap: 8px 12px;
		grid-template-columns: 64px minmax(0, 1fr);
		padding: 14px 0;
		width: 100%;
	}

	#quickcheckoutconfirm .quickcheckout-cart tbody > tr > td {
		border: 0;
		display: block;
		min-width: 0 !important;
		padding: 0;
		text-align: left;
		width: auto !important;
	}

	#quickcheckoutconfirm .quickcheckout-cart tr:has(.quantity) .image {
		grid-row: 1 / span 4;
	}

	#quickcheckoutconfirm .quickcheckout-cart tr:has(.quantity) .image img {
		height: auto;
		width: 64px;
	}

	#quickcheckoutconfirm .quickcheckout-cart tr:has(.quantity) .name,
	#quickcheckoutconfirm .quickcheckout-cart tr:has(.quantity) .quantity,
	#quickcheckoutconfirm .quickcheckout-cart tr:has(.quantity) .total {
		grid-column: 2;
	}

	#quickcheckoutconfirm .quickcheckout-cart tr:has(.quantity) .price1 { display: none; }
	#quickcheckoutconfirm .quickcheckout-cart .quantity .input-group { max-width: 176px; }

	#quickcheckoutconfirm .quickcheckout-cart tbody > tr:not(:has(.quantity)) {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	#quickcheckoutconfirm .quickcheckout-cart tbody > tr:not(:has(.quantity)) td:last-child {
		text-align: right;
	}
}

@media (min-width: 992px) {
	.stk.hidden-lg { height: 76px; }

	.mobile-header {
		height: 76px;
		padding-left: 28px;
		padding-right: 28px;
	}

	.mobile-header .to-navigation { width: 44px; }
	.mobile-header .to-search { margin-left: auto; }
	.mobile-header .to-account { margin-left: 2px; }
	.mobile-header #logo img { max-height: 38px; }

	body:has(#content .swiper-viewport) .stk.hidden-lg { top: 0; }

	#product-category .dz-category-head {
		margin-bottom: 48px;
		padding-top: 48px;
	}

	#product-product .dz-product-layout {
		gap: 48px;
		grid-template-columns: minmax(0, 1.5fr) minmax(380px, 1fr);
	}
}

/* ========================================================================== 
   36. NET URUN GORSELLERI + EDITORYAL ANA SAYFA
   --------------------------------------------------------------------------
   Kategori kartlari 560x700 onbellekten beslenir; burada yalnizca netlik ve
   sunum oranlari korunur. Ana sayfadaki kare kargo gorseli bosluk birakmadan
   metinli bir kampanya paneline, ardindaki alan da iki koleksiyon kartina
   donusur. Sepet, urun ve odeme davranislarina dokunulmaz.
   ========================================================================== */

#product-category .product-thumb .image,
#product-special .product-thumb .image {
	background: #f5f2ee;
}

#product-category .product-thumb .image img,
#product-special .product-thumb .image img {
	backface-visibility: hidden;
	image-rendering: auto;
	transform: translateZ(0);
}

.dz-band-shipping {
	margin: 56px 0 80px;
	padding: 0;
}

.dz-shipping-card {
	background: #e9f1f5;
	display: grid;
	grid-template-columns: minmax(500px, 620px) minmax(0, 1fr);
	margin: 0 auto;
	max-width: 1440px;
	overflow: hidden;
}

.dz-band-square .dz-shipping-visual {
	display: block;
	height: 100%;
	margin: 0;
	max-width: none;
	overflow: hidden;
}

.dz-band-square .dz-shipping-visual img {
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
	width: 100%;
}

.dz-shipping-card:hover .dz-shipping-visual img { transform: scale(1.018); }

.dz-shipping-copy {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(48px, 6vw, 100px);
}

.dz-shipping-copy h2 {
	color: #172b3a;
	font-family: var(--serif);
	font-size: clamp(38px, 3.6vw, 58px);
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.02;
	margin: 14px 0 22px;
	max-width: 720px;
}

.dz-shipping-copy > p {
	color: #43525c;
	font-size: 15px;
	line-height: 1.75;
	margin: 0;
	max-width: 610px;
}

.dz-shipping-benefits {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 24px;
	list-style: none;
	margin: 30px 0 34px;
	padding: 0;
}

.dz-shipping-benefits li {
	color: #263a47;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.1em;
	position: relative;
	text-transform: uppercase;
}

.dz-shipping-benefits li:not(:last-child)::after {
	color: #83919a;
	content: "·";
	position: absolute;
	right: -15px;
}

.dz-band-square .dz-shipping-link {
	align-items: center;
	border-bottom: 1px solid #172b3a;
	color: #172b3a;
	display: inline-flex;
	font-size: 12px;
	font-weight: 500;
	gap: 16px;
	letter-spacing: 0.12em;
	margin: 0;
	max-width: none;
	padding: 0 0 8px;
	text-transform: uppercase;
}

.dz-band-square .dz-shipping-link:hover,
.dz-band-square .dz-shipping-link:focus { color: #172b3a; gap: 22px; }

.dz-editorial {
	margin: 104px auto 96px;
	max-width: 1280px;
	padding: 0 var(--pad);
}

.dz-editorial-head {
	margin-bottom: 34px;
	text-align: center;
}

.dz-editorial-head h2 {
	font-family: var(--serif);
	font-size: clamp(36px, 3.4vw, 52px);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.08;
	margin: 12px 0 0;
}

.dz-editorial-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dz-editorial-item {
	aspect-ratio: 4 / 5;
	background: #eee9e4;
	display: block;
	overflow: hidden;
	position: relative;
}

.dz-editorial-item::after {
	background: linear-gradient(to top, rgba(16, 13, 11, 0.62), rgba(16, 13, 11, 0.02) 54%);
	bottom: 0;
	content: "";
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
}

.dz-editorial-item img {
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
	width: 100%;
}

.dz-editorial-item:hover img { transform: scale(1.025); }

.dz-editorial-copy {
	align-items: flex-end;
	bottom: 0;
	color: #fff;
	display: flex;
	justify-content: space-between;
	left: 0;
	padding: clamp(24px, 3.5vw, 48px);
	position: absolute;
	right: 0;
	z-index: 1;
}

.dz-editorial-copy strong {
	font-family: var(--serif);
	font-size: clamp(28px, 2.5vw, 42px);
	font-weight: 400;
	line-height: 1.05;
}

.dz-editorial-copy em {
	border-bottom: 1px solid rgba(255, 255, 255, 0.9);
	font-size: 11px;
	font-style: normal;
	letter-spacing: 0.12em;
	padding-bottom: 6px;
	text-transform: uppercase;
}

@media (min-width: 992px) {
	#common-home .dz-module { margin-bottom: 72px; }
}

@media (max-width: 767px) {
	.dz-band-shipping { margin: 40px 0 58px; }

	.dz-shipping-card { grid-template-columns: minmax(0, 1fr); }
	.dz-band-square .dz-shipping-visual { height: auto; }
	.dz-band-square .dz-shipping-visual img { height: auto; object-fit: contain; }
	.dz-shipping-copy { padding: 34px 24px 38px; }
	.dz-shipping-copy h2 { font-size: 34px; margin: 10px 0 16px; }
	.dz-shipping-copy > p { font-size: 14px; line-height: 1.65; }
	.dz-shipping-benefits { gap: 9px 18px; margin: 24px 0 28px; }
	.dz-shipping-benefits li { font-size: 9px; }
	.dz-shipping-benefits li:not(:last-child)::after { right: -11px; }

	.dz-editorial {
		margin: 64px 0 70px;
		max-width: none;
		padding: 0;
	}

	.dz-editorial-head { margin-bottom: 24px; padding: 0 var(--pad); text-align: left; }
	.dz-editorial-head h2 { font-size: 34px; }

	.dz-editorial-grid {
		display: flex;
		gap: 10px;
		overflow-x: auto;
		padding: 0 var(--pad) 8px;
		scroll-padding-left: var(--pad);
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.dz-editorial-grid::-webkit-scrollbar { display: none; }
	.dz-editorial-item { flex: 0 0 82vw; scroll-snap-align: start; }
	.dz-editorial-copy { padding: 24px 20px; }
	.dz-editorial-copy strong { font-size: 29px; }
}

/* ==========================================================================
   37. ANA SAYFA — HIYERARSI VE AKIS
   --------------------------------------------------------------------------
   Dort konu: (a) kapaga marka cumlesi ve tek bir cagri butonu, (b) urun adi
   ile fiyatin okunur boyuta cikmasi, (c) masaustunde urun listelerinin yatay
   serit yerine izgara olmasi, (d) baslik olceklerinin urun bilgisiyle
   dengelenmesi. Sepet, favori, arama ve Swiper isleyislerine dokunulmaz.
   ========================================================================== */

/* --- (a) Kapak uzeri marka blogu --------------------------------------- */

/* Blok home.twig icinde durur, betik onu buraya tasir. Tasinmadiysa
   gorunmez — yarim bir metin blogu sayfanin basinda kalmaz. */
.dz-hero-overlay { display: none; }

.swiper-viewport { position: relative; }

.swiper-viewport > .dz-hero-overlay {
	align-items: flex-end;
	bottom: 0;
	display: flex;
	justify-content: center;
	left: 0;
	/* Slaytin kendi baglantisi altta calismaya devam etsin */
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 3;
}

/* Fotograf acik renkliyken de yazi okunsun diye alttan yumusak koyulasma */
.swiper-viewport > .dz-hero-overlay::before {
	background: linear-gradient(to top, rgba(12, 9, 8, 0.58), rgba(12, 9, 8, 0) 62%);
	bottom: 0;
	content: "";
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

.dz-hero-copy {
	color: #fff;
	max-width: 720px;
	padding: 0 var(--pad) clamp(30px, 5.5vh, 74px);
	position: relative;
	text-align: center;
}

.dz-hero-eyebrow {
	color: rgba(255, 255, 255, 0.86);
	display: block;
	font-family: var(--sans);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.24em;
	margin-bottom: 12px;
	text-transform: uppercase;
}

.dz-hero-title {
	color: #fff;
	font-family: var(--serif);
	font-size: clamp(30px, 4.6vw, 62px);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.04;
	margin: 0;
	text-shadow: 0 1px 24px rgba(12, 9, 8, 0.32);
}

.dz-hero-sub {
	color: rgba(255, 255, 255, 0.9);
	font-family: var(--sans);
	font-size: clamp(13px, 1.15vw, 16px);
	line-height: 1.6;
	margin: 14px auto 0;
	max-width: 480px;
}

.dz-hero-cta {
	background: #fff;
	border: 1px solid #fff;
	color: var(--ink);
	display: inline-block;
	font-family: var(--sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	margin-top: clamp(20px, 2.6vh, 32px);
	min-height: 46px;
	padding: 15px 34px;
	/* Sarmalayici pointer-events:none — buton yeniden tiklanabilir olmali */
	pointer-events: auto;
	text-transform: uppercase;
	transition: background 0.3s var(--ease), color 0.3s var(--ease);
}

.dz-hero-cta:hover,
.dz-hero-cta:focus {
	background: transparent;
	color: #fff;
}

/* Slayt gostergeleri marka blogunun altinda kalmasin */
.swiper-viewport .swiper-pagination { z-index: 4; }

/* --- (b) Urun adi ve fiyat okunur boyutta ------------------------------ */

/* Sayfanin satis yuzu buydu ama en kucuk yazisiydi: ad 13px, fiyat 11px. */
.product-thumb .caption h4 {
	font-size: 15px;
	line-height: 1.3;
	margin-bottom: 7px;
	max-height: 2.6em;
}

.product-thumb .price {
	font-size: 14px;
	gap: 8px;
	letter-spacing: 0.005em;
}

.product-thumb .price-old { font-size: 12px; }

/* --- (c) Masaustunde urun listeleri izgara ------------------------------ */

/* Telefonda yatay serit dogru cozum; masaustunde ekrana dort kart siginca
   kalan dordu sagda gizli kaliyordu ve kaydirma ipucu yoktu. Genis ekranda
   ayni sekiz urun 4x2 izgara olarak tek bakista gorunur. */
@media (min-width: 992px) {
	/* Dort esit sutun, tasma yok. Serit kurallari (flex, overflow-x,
	   scroll-snap, negatif kenar boslugu) burada geri aliniyor. */
	#superdeal,
	#latest,
	#featured,
	#bestseller,
	#special,
	#tab-latestq,
	#tab-featuredq,
	#tab-bestsellerq,
	#tab-specialq {
		column-gap: 2px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-left: 0;
		margin-right: 0;
		overflow-x: visible;
		row-gap: 72px;
		scroll-snap-type: none;
		width: auto;
	}

	/* Izgara yerine sarmalayan esnek kutu: bolumde dortten az urun varsa
	   (ornegin Firsat Kosesi'nde iki tane) kartlar sagda bosluk birakmak
	   yerine ortalanir; kart olcusu her bolumde ayni kalir. */
	#superdeal > .leftrightx,
	#latest > .leftrightx,
	#featured > .leftrightx,
	#bestseller > .leftrightx,
	#special > .leftrightx,
	#tab-latestq > .leftrightx,
	#tab-featuredq > .leftrightx,
	#tab-bestsellerq > .leftrightx,
	#tab-specialq > .leftrightx {
		flex: 0 0 calc(25% - 1.5px);
		max-width: calc(25% - 1.5px);
		scroll-snap-align: none;
		width: auto;
	}

	.product-thumb .caption h4 { font-size: 16px; }
	.product-thumb .price { font-size: 15px; }
	.product-thumb .price-old { font-size: 13px; }
}

@media (min-width: 1400px) {
	#superdeal,
	#latest,
	#featured,
	#bestseller,
	#special,
	#tab-latestq,
	#tab-featuredq,
	#tab-bestsellerq,
	#tab-specialq { row-gap: 82px; }
}

/* --- (d) Baslik olcekleri urun bilgisiyle dengelendi -------------------- */

@media (min-width: 992px) {
	/* 48px'e kadar cikan bolum basligi 12px'lik urun adinin yaninda
	   orantisiz duruyordu. */
	.dz-section-title { font-size: clamp(30px, 2.5vw, 38px); }

	/* Kampanya seridi urun bolumlerinden daha baskin gorunmesin */
	.dz-shipping-copy h2 { font-size: clamp(28px, 2.5vw, 38px); }
	.dz-editorial-head h2 { font-size: clamp(28px, 2.5vw, 38px); }
}

/* --- Kampanya seridi telefonda daha derli toplu ------------------------- */

@media (max-width: 767px) {
	/* Serit 732px ile kapaktan (500px) uzundu; tek duyuru icin fazlaydi.
	   Gorsel KIRPILMIYOR — yukseklik sinirlaniyor, object-fit: contain
	   oldugu gibi kaliyor, gorselin tamami gorunmeye devam ediyor. */
	.dz-band-square .dz-shipping-visual img { max-height: 40vh; }

	.dz-shipping-copy { padding: 26px 22px 30px; }
	.dz-shipping-copy h2 { font-size: 27px; margin: 8px 0 12px; }
	.dz-shipping-copy > p { font-size: 14px; line-height: 1.6; }
	.dz-shipping-benefits { margin: 18px 0 22px; }

	.dz-section-title { font-size: 24px; }
	.dz-editorial-head h2 { font-size: 27px; }
	.dz-hero-sub { font-size: 13px; }
}

/* ==========================================================================
   38. HAREKET — GIRIS ANIMASYONLARI VE MIKRO ETKILESIMLER
   --------------------------------------------------------------------------
   Doz "orta": belirme mesafesi 14px yerine 24px, sure 0.5s yerine 0.7s.
   Fark edilir ama sakin kalir. Animasyonu goren bloklarin listesi
   footer.twig icindeki gozlemcide durur; buradaki kurallar yalnizca
   gorunumu tanimlar. Gozlemci calismazsa 1,6 sn'lik guvenlik agi her seyi
   gorunur yapar — hicbir icerik gizli kalmaz.

   "Hareketi azalt" tercihi acik olan cihazlarda bolum 32'deki kural tum
   bunlari devre disi birakir.
   ========================================================================== */

/* --- Doz ---------------------------------------------------------------- */

.dz-anim .dz-grid > *,
.dz-anim .dz-reveal {
	transform: translateY(24px);
	transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}

/* Kademeli gecikmeler de biraz acildi */
.dz-anim .dz-grid.dz-in > *:nth-child(1) { transition-delay: 0.03s; }
.dz-anim .dz-grid.dz-in > *:nth-child(2) { transition-delay: 0.09s; }
.dz-anim .dz-grid.dz-in > *:nth-child(3) { transition-delay: 0.15s; }
.dz-anim .dz-grid.dz-in > *:nth-child(4) { transition-delay: 0.21s; }
.dz-anim .dz-grid.dz-in > *:nth-child(5) { transition-delay: 0.27s; }
.dz-anim .dz-grid.dz-in > *:nth-child(6) { transition-delay: 0.33s; }
.dz-anim .dz-grid.dz-in > *:nth-child(7) { transition-delay: 0.39s; }
.dz-anim .dz-grid.dz-in > *:nth-child(8) { transition-delay: 0.45s; }

/* --- Kapak marka blogu: satirlar sirayla gelir -------------------------- */

/* Blogun kendisi degil, icindeki dort satir animasyon alir. Gozlemcinin
   ekledigi .dz-reveal bu blokta notrlenir ki iki animasyon ust uste
   binmesin. */
.dz-anim .dz-hero-copy.dz-reveal {
	opacity: 1;
	transform: none;
	transition: none;
}

.dz-anim .dz-hero-copy > * {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.dz-anim .dz-hero-copy.dz-in > * { opacity: 1; transform: none; }

.dz-anim .dz-hero-copy.dz-in > *:nth-child(1) { transition-delay: 0.15s; }
.dz-anim .dz-hero-copy.dz-in > *:nth-child(2) { transition-delay: 0.28s; }
.dz-anim .dz-hero-copy.dz-in > *:nth-child(3) { transition-delay: 0.41s; }
.dz-anim .dz-hero-copy.dz-in > *:nth-child(4) { transition-delay: 0.54s; }

/* --- Koleksiyon kartlari sirayla --------------------------------------- */

.dz-anim .dz-editorial-item.dz-in:nth-child(2) { transition-delay: 0.12s; }

/* --- Kapakta cok yavas yakinlasma (Ken Burns) --------------------------- */

/* DIKKAT: yalnizca <img> olceklenir. Slaytin kendi genisligine, kenar
   bosluguna veya konumuna dokunulmaz — Swiper kaydirma adimini onlara gore
   hesapliyor (bkz. devir notu 2.5). Slaytin overflow: hidden olmasi
   buyuyen fotografi kendi cercevesinde tutar. */
@keyframes dz-kenburns {
	from { transform: scale(1); }
	to   { transform: scale(1.06); }
}

.swiper-slide-active img {
	animation: dz-kenburns 6s var(--ease) both;
}

/* --- Urun karti: imlec uzerindeyken ------------------------------------- */

@media (min-width: 992px) {
	/* Fotograf biraz daha belirgin ve daha yavas yakinlasir */
	.product-thumb .image img:not(.hover-image) { transition-duration: 0.7s; }
	.product-thumb:hover .image img:not(.hover-image) { transform: scale(1.045); }

	/* Hizli islem dugmeleri alttan suzulur, ucu birbiri ardina gelir */
	.product-thumb .button-group {
		transform: translateY(14px);
		transition-duration: 0.42s;
	}

	.product-thumb .button-group button {
		opacity: 0;
		transform: translateY(8px);
		transition: background-color var(--fast) var(--ease),
		            opacity 0.38s var(--ease),
		            transform 0.38s var(--ease);
	}

	.product-thumb:hover .button-group button { opacity: 1; transform: none; }

	.product-thumb:hover .button-group button:nth-child(1) { transition-delay: 0.05s; }
	.product-thumb:hover .button-group button:nth-child(2) { transition-delay: 0.11s; }
	.product-thumb:hover .button-group button:nth-child(3) { transition-delay: 0.17s; }

	/* Urun adinin altinda soldan saga buyuyen ince cizgi.
	   text-decoration yerine arka plan kullanildi: kalinligi ve mesafesi
	   kontrol edilebiliyor, yazi tipine gore zipzip oynamiyor. */
	.product-thumb .caption h4 a {
		background-image: linear-gradient(var(--ink), var(--ink));
		background-position: 0 100%;
		background-repeat: no-repeat;
		background-size: 0 1px;
		padding-bottom: 2px;
		transition: background-size 0.45s var(--ease), color var(--fast) var(--ease);
	}

	.product-thumb:hover .caption h4 a { background-size: 100% 1px; }
}

/* --- Buton ve baglanti mikro hareketleri -------------------------------- */

/* Kampanya baglantisindaki ok ilerler */
.dz-shipping-link span {
	display: inline-block;
	transition: transform 0.35s var(--ease);
}

.dz-shipping-link:hover span,
.dz-shipping-link:focus span { transform: translateX(6px); }

/* Koleksiyon kartinin "Kesfet" yazisi karta gelindiginde kayar */
.dz-editorial-copy em { transition: transform 0.4s var(--ease); }
.dz-editorial-item:hover .dz-editorial-copy em { transform: translateX(5px); }

/* Basilirken hafif coker — dokunusun karsiligi hissedilir */
.btn:active,
.dz-hero-cta:active,
.product-thumb .button-group button:active { transform: translateY(1px); }

.dz-hero-cta { transition: background 0.3s var(--ease), color 0.3s var(--ease), transform var(--fast) var(--ease); }

/* ==========================================================================
   39. BEYMEN OLCEGI — TIPOGRAFI VE MASAUSTU KATEGORI CUBUGU
   --------------------------------------------------------------------------
   Olculer beymen.com/tr uzerinden dogrudan olculdu:

     govde ................ 16px / 400
     ana menu ............. 15px / 500 / ls 0.5px, satir 64px
     bolum basligi ........ 22px / 500 / ls 2px, BUYUK HARF
     banner basligi ....... 22px / 600 / ls 1px
     urun adi ............. 17px / 500
     fiyat ................ 16px / 400  (#111)
     eski fiyat ........... 13px / 500  (#6d6d6d)
     "Kesfet" baglantisi .. 14px / 500 / ls 1px
     kucuk etiket ......... 11px / 500 / ls 1px
     buton ................ 15px / 700
     urun gorsel orani .... 5:7

   Referansta serif yazi hic yok; --serif degiskeni sans aileye baglandi,
   boylece tum sablonlardaki var(--serif) kullanimlari tek noktadan doner.
   Sepet, arama, favori ve odeme isleyislerine dokunulmaz.
   ========================================================================== */

:root {
	--serif: 'Jost', 'Helvetica Neue', Arial, sans-serif;
}

/* --- Govde -------------------------------------------------------------- */

body {
	font-size: 16px;
	letter-spacing: normal;
	line-height: 1.5;
}

/* --- Basliklar ---------------------------------------------------------- */

/* Serif icin ayarlanmis negatif harf araliklari sans'ta sikisik duruyor;
   referanstaki gibi pozitif aralik ve buyuk harf kullanildi. */
.dz-section-title,
.dz-editorial-head h2,
.dz-category-title,
.dz-page-title,
#content > h1 {
	font-family: var(--sans);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 2px;
	line-height: 1.25;
	text-transform: uppercase;
}

.dz-shipping-copy h2 {
	font-family: var(--sans);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.3;
	text-transform: uppercase;
}

.dz-hero-title {
	font-family: var(--sans);
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.2;
	text-transform: uppercase;
}

.dz-hero-sub { font-size: 16px; }

.dz-hero-eyebrow,
.dz-eyebrow {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 1px;
}

/* --- Urun karti --------------------------------------------------------- */

.product-thumb .caption h4,
.product-thumb .caption h4 a {
	color: #111;
	font-family: var(--sans);
	font-size: 17px;
	font-weight: 500;
	letter-spacing: normal;
	line-height: 1.3;
}

.product-thumb .caption h4 { max-height: 2.7em; }

.product-thumb .price,
.product-thumb .price-new {
	color: #111;
	font-size: 16px;
	font-weight: 400;
	letter-spacing: normal;
}

.product-thumb .price-old {
	color: #6d6d6d;
	font-size: 13px;
	font-weight: 500;
}

/* Referanstaki urun gorseli 5:7 — 2:3'ten bir tik genis */
.product-thumb .image > a { padding-bottom: 140%; }

/* --- Baglanti ve butonlar ----------------------------------------------- */

.dz-editorial-copy em,
.dz-shipping-link {
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 1px;
}

.btn,
.dz-hero-cta {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.5px;
}

/* --- Masaustu kategori cubugu ------------------------------------------- */

/* Mobilde gizli: orada kategoriler soldan acilan cekmecede kaliyor. */
.dz-topnav { display: none; }

@media (min-width: 992px) {
	.dz-topnav {
		background: #fff;
		border-bottom: 1px solid var(--line);
		border-top: 1px solid var(--line);
		display: block;
	}

	.dz-topnav-inner {
		align-items: center;
		display: flex;
		flex-wrap: nowrap;
		margin: 0 auto;
		max-width: 1240px;
		overflow-x: auto;
		padding: 0 var(--pad);
		scrollbar-width: none;
	}

	.dz-topnav-inner::-webkit-scrollbar { display: none; }

	/* .mobile-menu sinifi cekmecede de kullaniliyor; buradaki kurallar
	   yalnizca cubuk icindeki kopyayi hedefler. */
	.dz-topnav .mobile-menu {
		display: flex;
		list-style: none;
		margin: 0;
		padding: 0;
	}

	.dz-topnav .mobile-menu > li {
		border: 0;
		margin: 0;
		padding: 0;
		position: relative;
	}

	.dz-topnav .mobile-menu > li > a,
	.dz-topnav-extra {
		align-items: center;
		color: var(--ink);
		display: flex;
		font-family: var(--sans);
		font-size: 15px;
		font-weight: 500;
		height: 64px;
		letter-spacing: 0.5px;
		padding: 0 17px;
		text-transform: none;
		transition: color var(--fast) var(--ease);
		white-space: nowrap;
	}

	.dz-topnav .mobile-menu > li > a::after { display: none; }

	.dz-topnav .mobile-menu > li > a:hover,
	.dz-topnav-extra:hover { color: var(--ink-soft); }

	/* Etkin bagi alttan ince cizgiyle isaretle */
	.dz-topnav .mobile-menu > li > a::before {
		background: var(--ink);
		bottom: 0;
		content: "";
		height: 2px;
		left: 17px;
		position: absolute;
		right: 17px;
		transform: scaleX(0);
		transition: transform 0.3s var(--ease);
	}

	.dz-topnav .mobile-menu > li:hover > a::before { transform: scaleX(1); }

	/* Alt kategorisi olan basliklarda uzerine gelince acilan liste */
	.dz-topnav .sub-menu {
		background: #fff;
		border: 1px solid var(--line);
		display: none;
		left: 0;
		list-style: none;
		margin: 0;
		min-width: 210px;
		padding: 10px 0;
		position: absolute;
		top: 100%;
		z-index: 9000;
	}

	.dz-topnav .mobile-menu > li:hover .sub-menu { display: block; }

	.dz-topnav .sub-menu > li > a {
		color: var(--ink-soft);
		display: block;
		font-size: 14px;
		font-weight: 400;
		letter-spacing: 0.3px;
		padding: 9px 18px;
	}

	.dz-topnav .sub-menu > li > a:hover { background: var(--fill); color: var(--ink); }

	.dz-topnav-extra { margin-left: auto; }
}

/* ==========================================================================
   40. GORSEL DUZELTMELER
   --------------------------------------------------------------------------
   Canli sayfadan gorulen kusurlar.
   ========================================================================== */

/* --- Urun kartlari ayni yukseklikte degildi ----------------------------- */

/* Bolum 36'da object-fit: contain verilmisti. Urun fotograflari ayni
   en-boy oraninda olmadigi icin kare olanlar kutunun ortasinda kucuk
   kaliyor, uzun olanlar kutuyu dolduruyordu; izgara satiri hizasiz
   gorunuyordu. Referans sitede kutu her zaman dolu.

   Ust kenardan hizalanir: sal ve bone fotograflarinda basligin gorunmesi
   onemli, kirpma alt taraftan olur. */
.product-thumb .image img {
	object-fit: cover;
	object-position: center top;
}

/* --- Menu yazilari tutarli buyuk harf ----------------------------------- */

/* Kategoriler panelde buyuk harf girilmis (SAL, ESARP BONE), sablondan
   gelen "Kampanyalar" ise kucuk harfti; cubukta ikisi yan yana bozuk
   duruyordu. */
@media (min-width: 992px) {
	.dz-topnav .mobile-menu > li > a,
	.dz-topnav-extra { text-transform: uppercase; }
}

/* --- Baslik ve kategori cubugu ayni zemin ------------------------------- */

/* Logonun arkasindaki beyaz ile cubugun beyazi ayni degiskene baglandi. */
.dz-topnav { background: var(--surface); }

/* --- Ana sayfada kategori cubugu gorunmuyordu --------------------------- */

/* Sebep: sayfada kapak slayti varsa basligi akistan cikarip fotografin
   uzerine bindiren bir kural vardi. Slayt yalnizca ana sayfada oldugu icin
   orada baslik absolute oluyor, hemen altindaki kategori cubugu yukari
   kayip basligin altinda kaliyordu — ikisi de top: 0 noktasindaydi.
   Diger sayfalarda baslik akista kaldigi icin cubuk gorunuyordu.

   Referans sitede baslik kapagin uzerine binmiyor: opak durur ve icerigi
   asagi iter. Kural bu yuzden geri alindi. */
body:has(#content .swiper-viewport) .stk {
	background: var(--surface);
	position: sticky;
}

/* :has desteklemeyen tarayicilarda yukaridaki kural hic uygulanmaz; o
   durumda da baslik zaten bolum 09'daki sticky degerini kullanir. */

/* ==========================================================================
   41. BASLIK DUZENI VE ALTBILGI OLCULERI
   --------------------------------------------------------------------------
   Referans basligin masaustu duzeni: solda logo, ortada acik arama kutusu,
   sagda ikonlar ve her birinin altinda adi. Altbilgi yazilari 10-11px ile
   okunmayacak kadar kucuktu.
   ========================================================================== */

/* --- Altbilgi okunur boyutta ------------------------------------------- */

footer h5,
footer .column h5 {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1px;
	margin-bottom: 18px;
}

footer,
footer p,
footer address,
footer li,
footer a,
footer .footer_content_top a {
	font-size: 15px;
	line-height: 1.75;
}

footer .footer_content_bottom,
footer .footer_content_bottom p,
footer .footer_left_bottom p {
	font-size: 13px;
}

/* --- Altbilgi oncesindeki bosluk --------------------------------------- */

/* Tescil bandi ile altbilgi arasinda 256px bos alan kaliyordu:
   footer'in ust bosluklari (margin 120 + padding 88) bandin kendi alt
   boslugunun ustune biniyordu. */
@media (min-width: 992px) {
	footer { margin-top: 56px; padding-top: 56px; }
}

/* --- Masaustu baslik duzeni -------------------------------------------- */

/* Ikon adlari yalnizca masaustunde; mobilde 44px'lik dokunma alanini
   bozmamak icin gizli. Favori bagi da mobilde cekmecede zaten var. */
.dz-icon-label { display: none; }

/* .dz-icon-btn kurali ayni ozgullukte oldugu icin tek sinif yetmiyordu */
.mobile-header .dz-header-wishlist { display: none; }

@media (min-width: 992px) {
	/* Kategoriler artik yatay cubukta; hamburger masaustunde gereksiz. */
	.mobile-header .to-navigation { display: none; }

	/* Arama kutusu acik oldugu icin buyutec dugmesine gerek kalmadi. */
	.mobile-header .to-search { display: none; }

	/* Siralama order ile sabitlendi: space-between tek basina yeterli
	   degildi, gizlenen hamburger ve buyutec yuzunden ogeler dagiliyordu. */
	.mobile-header {
		gap: 22px;
		justify-content: flex-start;
		padding-left: var(--pad);
		padding-right: var(--pad);
	}

	/* Logo mobil basligi ortalamak icin position: absolute ile akistan
	   cikarilmisti; masaustunde akisa geri aliniyor. Aksi halde yer
	   kaplamadigi icin ikonlar sola topluyor ve arama kutusu logonun
	   uzerine biniyordu. */
	/* !important gerekli: bolum 11'deki mobil kurali daha yuksek ozgullukte
	   ve absolute konumu oradan geliyor. */
	#logo {
		left: auto !important;
		margin: 0 auto 0 0 !important;
		order: 1 !important;
		position: static !important;
		right: auto !important;
		transform: none !important;
	}

	.mobile-header .to-account       { order: 3; }
	.mobile-header .dz-header-wishlist { order: 4; }
	.mobile-header .dz-mobile-cart   { order: 5; }

	/* Arama kutusu .mobile-header'in kardesi oldugu icin akista araya
	   giremiyor; basligin ortasina konumlandiriliyor. Boylece mobildeki
	   "buyutece bas, kutu asagi acilsin" davranisi hic degismiyor. */
	.stk { position: sticky; }

	.mobile-search {
		display: block;
		left: 50%;
		max-width: 460px;
		position: absolute;
		top: 38px;
		transform: translate(-50%, -50%);
		width: 38%;
		z-index: 5;
	}

	.mobile-search .autosearch-wrapper,
	.mobile-search form,
	.mobile-search .input-group { margin: 0; width: 100%; }

	.mobile-search input[type="text"],
	.mobile-search .form-control {
		border: 1px solid var(--line);
		border-radius: 0;
		font-size: 15px;
		height: 44px;
		width: 100%;
	}

	/* Sagdaki ucluyu tek grup halinde tut */
	.mobile-header .dz-header-wishlist { display: inline-flex; }

	.mobile-header .to-account,
	.mobile-header .dz-header-wishlist,
	.mobile-header .dz-mobile-cart {
		align-items: center;
		display: inline-flex;
		flex-direction: column;
		gap: 4px;
		height: auto;
		justify-content: center;
		width: auto;
	}

	.dz-icon-label {
		color: var(--ink);
		display: block;
		font-family: var(--sans);
		font-size: 12px;
		font-weight: 400;
		letter-spacing: 0.2px;
		line-height: 1;
		white-space: nowrap;
	}

	/* Sepet sayaci ikonun kosesinde kalsin, adin ustune binmesin */
	.dz-mobile-cart { position: relative; }
	.dz-mobile-cart .dz-count { top: -4px; right: -8px; }
}

/* ==========================================================================
   42. ARAMA KUTUSU VE FORM YAZILARI
   --------------------------------------------------------------------------
   Iki sorun:
   (a) Masaustundeki arama kutusu goruyor ama tiklanmiyor du — .mobile-header
       z-index: 200 tasiyor, kutuya verilen 5 onun altinda kaliyordu, baslik
       tiklamayi yutuyordu.
   (b) Hesap sayfalarinda form etiketleri 10px, alan yazilari 12px'ti.
       Referans sitede govde 16px, kucuk etiket 13px. Okunur olculere cekildi.
   ========================================================================== */

/* --- (a) Arama kutusu --------------------------------------------------- */

@media (min-width: 992px) {
	/* Basligin uzerine cikmali ki tiklama kutuya ulassin */
	.mobile-search { z-index: 210; }

	/* Alan yari saydamdi (0.64), basligin arkasindaki gecis altindan
	   goruntuye siziyordu. !important gerekli: ezen kural "#search ..."
	   seklinde id tasiyor, ozgullugu sinif zincirinden yuksek. */
	.mobile-search .autosearch-wrapper { background: transparent !important; }

	.mobile-search input[type="text"],
	.mobile-search .form-control,
	.mobile-search .search_query {
		background: #fff !important;
		border: 1px solid var(--line) !important;
		color: var(--ink);
		font-size: 15px;
		height: 46px;
		padding: 0 48px 0 16px;
	}

	.mobile-search input[type="text"]:focus,
	.mobile-search .form-control:focus,
	.mobile-search .search_query:focus {
		border-color: var(--ink-faint);
		box-shadow: none;
		outline: none;
	}

	.mobile-search input::placeholder,
	.mobile-search .search_query::placeholder {
		color: var(--ink-faint);
		font-size: 14px;
	}

	/* Buyutec dugmesi alanin sag ucunda dursun */
	.mobile-search button,
	.mobile-search .btn {
		align-items: center;
		background: transparent;
		border: 0;
		display: flex;
		height: 46px;
		justify-content: center;
		position: absolute;
		right: 0;
		top: 0;
		width: 48px;
		z-index: 2;
	}

	.mobile-search .input-group { position: relative; }
}

/* --- (b) Form ve hesap sayfasi yazilari --------------------------------- */

/* Etiketler: 10px okunmuyordu */
.control-label,
label,
.form-group > label,
.radio label,
.checkbox label,
.radio-inline,
.checkbox-inline {
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.2px;
}

/* Alanlarin kendi yazisi: 12px kucuktu. 15px hem okunur hem mobilde
   iOS'un otomatik yakinlastirmasina yakin (16px esigi). */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="search"],
select,
textarea {
	font-size: 15px;
}

/* Sayfa alt aciklamalari ve yardim metinleri */
.dz-page-sub,
.help-block,
.text-danger,
.dz-forgot {
	font-size: 14px;
}

/* Giris/kayit kartlarindaki aciklama metinleri 13px kaliyordu.
   #content on eki gerekli: sayfa icindeki .dz-forgot'u daha ozgul bir
   kural 11px'te tutuyordu. */
#content .dz-forgot { font-size: 14px; }

.dz-auth-card p,
.dz-auth-form p { font-size: 15px; }

/* "Hesap Olustur" gibi kart ici alt basliklar */
.dz-auth-card p strong {
	display: inline-block;
	font-size: 17px;
	font-weight: 500;
	margin-bottom: 2px;
}

/* Hesap sayfalarindaki listeler ve tablolar */
#content table,
#content table td,
#content table th,
.table > tbody > tr > td,
.table > thead > tr > th {
	font-size: 15px;
}

/* Uyari ve bilgi kutulari */
.alert { font-size: 15px; }

/* ==========================================================================
   43. KARE LOGO YERLESIMI
   --------------------------------------------------------------------------
   Yeni marka logosu kare (1:1): ustte D monogrami, altinda "DEZ Collection"
   ve "HIJAB". Onceki logo 255x47 idi, yani orani 5.43 — neredeyse serit.
   Eski olculerle (max-height 38-52px) kare logo 38x38'e sikisir ve altindaki
   iki satir yazi okunmaz hale gelir.

   Bu yuzden logo yuksekligi buyutuldu ve baslik yuksekligi ona gore acildi.
   Genislik daima auto: logo hangi oranda olursa olsun bozulmadan sigar, ileride
   yatay bir surum yuklenirse bu kurallar yine dogru calisir.
   ========================================================================== */

/* --- Telefon ------------------------------------------------------------ */

@media (max-width: 991px) {
	/* Kare logo mobil basligin ortasinda; baslik biraz aciliyor ki
	   logonun alt satirlari sikismasin. */
	.mobile-header { height: 68px; }
	.stk.hidden-lg { height: 68px; }

	.mobile-header #logo {
		height: auto !important;
		max-height: none !important;
		max-width: none !important;
		width: auto !important;
	}

	.mobile-header #logo img {
		height: 52px !important;
		max-height: 52px !important;
		max-width: none !important;
		object-fit: contain;
		width: auto !important;
	}
}

/* --- Masaustu ----------------------------------------------------------- */

@media (min-width: 992px) {
	.mobile-header { height: 92px; }

	/* Baslik seridine sabit 76px verilmisti (.stk.hidden-lg). Logo
	   buyudugu icin serit de aciliyor; aksi halde kategori cubugu
	   basligin ustune biniyor. */
	.stk.hidden-lg { height: 92px; }

	/* !important ve acik yukseklik gerekli: bolum 11 ile bolum 35'te
	   .mobile-header #logo img icin ayni ozgullukte max-height kurallari
	   var ve img'in max-width: 100% degeri kapsayiciyi 38px'e kilitliyordu.
	   72px'te "DEZ Collection" satiri rahat okunuyor; daha kucugunde
	   HIJAB satiri kayboluyor. */
	.mobile-header #logo {
		height: auto !important;
		max-height: none !important;
		max-width: none !important;
		width: auto !important;
	}

	.mobile-header #logo a { display: block; }

	.mobile-header #logo img {
		height: 72px !important;
		max-height: 72px !important;
		max-width: none !important;
		object-fit: contain;
		width: auto !important;
	}

	/* Arama kutusu basligin dikey ortasinda kalmali — baslik yukseldigi
	   icin konum da guncellendi. */
	.mobile-search { top: 46px; }
}

/* --- Altbilgi ----------------------------------------------------------- */

/* Kare logo altbilgide rahat durur; burada oldugu gibi gosterilir. */
footer #logo img,
footer img[src*="logo"] {
	height: auto;
	margin-bottom: 18px;
	max-height: 110px;
	max-width: 160px;
	object-fit: contain;
	width: auto;
}

/* --- Menu cekmecesi ----------------------------------------------------- */

/* Cekmecenin ust seridinde marka isareti — "TÜMÜ GÖSTER" yazisinin
   yaninda kucuk bir logo dengeyi kuruyor. */
.dz-drawer-head #logo img,
.dz-drawer-head img[src*="logo"] {
	height: auto;
	max-height: 44px;
	width: auto;
}

/* ==========================================================================
   44. PREMIUM BASLIK, LOGO VE KAPAK
   --------------------------------------------------------------------------
   Marka logosu yatay (2172x724, oran 3:1) ve basligin ana unsuru olmali.
   Onceki bolumde kare logo varsayilarak yukseklik sabitlenmisti; yatay
   logoda bu 156px'lik kucuk bir seride donusuyordu.

   Bu bolum onceki logo/baslik kurallarinin uzerine yazar; oncekiler
   silinmedi ki kare bir logo geri yuklenirse taban davranis dursun.
   ========================================================================== */

/* --- Yazi tipi rolleri -------------------------------------------------- */

:root {
	--serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--sans: 'Jost', 'Helvetica Neue', Arial, sans-serif;
}

/* Basliklar serife doner; govde, menu ve arayuz sans kalir. */
.dz-hero-title,
.dz-section-title,
.dz-editorial-head h2,
.dz-shipping-copy h2,
.dz-category-title,
.dz-page-title,
#content > h1 {
	font-family: var(--serif);
	font-weight: 500;
	letter-spacing: 0.02em;
	text-transform: none;
}

/* Serif govdesi sans'a gore kucuk goründügü icin punto biraz acildi */
.dz-section-title,
.dz-editorial-head h2,
.dz-category-title,
.dz-page-title,
#content > h1 { font-size: 30px; }

.dz-shipping-copy h2 { font-size: 32px; }

/* --- Logo --------------------------------------------------------------- */

/* Genislik esas alinir, yukseklik oranla gelir; max-height yalnizca
   guvenlik siniri. Boylece yatay da kare de logo bozulmadan sigar. */
@media (min-width: 992px) {
	.mobile-header #logo {
		align-items: center;
		display: flex !important;
		height: auto !important;
		max-height: none !important;
		max-width: none !important;
		width: auto !important;
	}

	.mobile-header #logo a {
		display: block;
		line-height: 0;
	}

	.mobile-header #logo img {
		height: auto !important;
		max-height: 96px !important;
		max-width: none !important;
		object-fit: contain;
		width: clamp(240px, 17vw, 320px) !important;
	}

	/* --- Baslik olculeri --------------------------------------------- */

	.mobile-header {
		height: 112px;
		margin: 0 auto;
		max-width: 1750px;
	}

	.stk.hidden-lg { height: 112px; }

	/* Arama kutusu basligin dikey ortasinda */
	.mobile-search { top: 56px; }

	/* --- Arama alani -------------------------------------------------- */

	.mobile-search {
		max-width: 560px;
		width: clamp(460px, 34vw, 560px);
	}

	.mobile-search input[type="text"],
	.mobile-search .form-control,
	.mobile-search .search_query {
		background-image: none !important;
		border: 1px solid #e3dfda !important;
		border-radius: 2px;
		font-size: 15px;
		height: 48px;
		padding: 0 52px 0 20px;
	}

	/* Alanda iki buyutec gorunuyordu: modulun kendi PNG'si (image/ara.png)
	   ile tema CSS'inin bastigi SVG. PNG ve olasi ikinci katman kapatilip
	   tek kaynak birakildi — dugmenin ::before SVG'si. */
	.mobile-search button img,
	.mobile-search .button-search img,
	.mobile-search .autosearch-submit img,
	.mobile-search .fa-search,
	.mobile-search .glyphicon-search { display: none !important; }

	.mobile-search .button-search::after,
	.mobile-search .autosearch-submit::after { content: none !important; }

	.mobile-search button,
	.mobile-search .button-search {
		height: 48px;
		width: 52px;
	}

	/* --- Hesap ikonlari ----------------------------------------------- */

	.mobile-header .to-account,
	.mobile-header .dz-header-wishlist,
	.mobile-header .dz-mobile-cart { gap: 6px; }

	.dz-icon-label { font-size: 12px; letter-spacing: 0.3px; }

	.mobile-header .to-account:hover .dz-icon-label,
	.mobile-header .dz-header-wishlist:hover .dz-icon-label,
	.mobile-header .dz-mobile-cart:hover .dz-icon-label { opacity: 0.6; }

	/* --- Kategori cubugu ---------------------------------------------- */

	/* KAMPANYALAR "margin-left: auto" ile sagda kopuk duruyordu; artik
	   butun menu ortalaniyor ve o da grubun bir parcasi. Arasindaki
	   nefes payi ayirici cizgiyle veriliyor. */
	.dz-topnav-inner {
		justify-content: center;
		max-width: 1750px;
	}

	.dz-topnav .mobile-menu > li > a,
	.dz-topnav-extra {
		font-size: 14px;
		height: 62px;
		letter-spacing: 1.2px;
		padding: 0 26px;
	}

	.dz-topnav-extra {
		margin-left: 26px;
		position: relative;
	}

	.dz-topnav-extra::before {
		background: var(--line);
		content: "";
		height: 18px;
		left: -13px;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		width: 1px;
	}

	.stk.hidden-lg + .dz-topnav .mobile-menu > li > a:hover { opacity: 0.62; }
}

/* --- Tablet ------------------------------------------------------------- */

@media (min-width: 992px) and (max-width: 1199px) {
	.mobile-header #logo img { width: 230px !important; }
	.mobile-search { width: clamp(300px, 28vw, 400px); }
	.dz-topnav .mobile-menu > li > a,
	.dz-topnav-extra { font-size: 13px; padding: 0 16px; }
}

/* --- Telefon ------------------------------------------------------------ */

@media (max-width: 991px) {
	/* Yatay logoda yukseklik degil genislik sinirlanir */
	.mobile-header #logo img {
		height: auto !important;
		max-height: 54px !important;
		object-fit: contain;
		width: clamp(150px, 48vw, 200px) !important;
	}
}

/* --- Kapak: metin solda, fotograf sagda -------------------------------- */

/* Referans moda sitelerindeki duzen: yazi sol kenarda, fotograf sagi
   doldurur. Slayt yapisina dokunulmadi — yalnizca ustteki yazi blogu
   sola alindi ve arkasina soldan acilan yumusak bir perde kondu. */
@media (min-width: 992px) {
	.swiper-viewport > .dz-hero-overlay {
		align-items: center;
		justify-content: flex-start;
	}

	.swiper-viewport > .dz-hero-overlay::before {
		background: linear-gradient(to right, rgba(252, 250, 248, 0.94) 0%, rgba(252, 250, 248, 0.82) 26%, rgba(252, 250, 248, 0) 52%);
	}

	.dz-hero-copy {
		max-width: 560px;
		padding: 0 0 0 clamp(40px, 5vw, 92px);
		text-align: left;
	}

	.dz-hero-eyebrow {
		color: var(--ink-soft);
		font-size: 11px;
		letter-spacing: 0.22em;
	}

	.dz-hero-title {
		color: var(--ink);
		font-size: clamp(38px, 3.9vw, 58px);
		letter-spacing: 0.01em;
		line-height: 1.12;
		text-shadow: none;
	}

	.dz-hero-sub {
		color: var(--ink-soft);
		margin-left: 0;
		max-width: 420px;
	}

	/* Cerceveli ince buton — referanstaki gibi */
	.dz-hero-cta {
		background: transparent;
		border: 1px solid var(--ink);
		color: var(--ink);
		font-size: 12px;
		letter-spacing: 0.18em;
		padding: 17px 34px;
	}

	.dz-hero-cta:hover,
	.dz-hero-cta:focus {
		background: var(--ink);
		color: #fff;
	}
}

/* ==========================================================================
   45. TESCIL BANDI — TEKRAR EDEN MADDELER
   --------------------------------------------------------------------------
   Yeni tescil gorselinin icinde dort madde (tasarim tescilli, ozgun tasarim,
   kaliteli kumas, ozenli paketleme) zaten yaziyor. Altindaki metin listesi
   masaustunde ayni bilgiyi ikinci kez veriyordu.

   Telefonda gorselin yazilari kucuk kaldigi icin liste orada duruyor.
   ========================================================================== */

@media (min-width: 768px) {
	.dz-band-wide .dz-band-points { display: none; }
}

/* ==========================================================================
   46. ESKI TEMADAN KALAN RENKLER
   --------------------------------------------------------------------------
   Canli sayfadan olculen degerler:
     .mobile-header  -> rgb(247, 245, 241)  bej
     .footer-top     -> rgb(255, 255, 255)  altbilgi bej iken beyaz kutu
     guven seridi    -> 10px yazi

   Marka paleti beyaz / siyah / kirik beyaz uzerine kurulu; baslik ve
   altbilgi seritleri buna cekildi. Altin ton (--accent) arayuzden
   kaldirildi, yalnizca indirim rozetinde birakildi.
   ========================================================================== */

/* --- Baslik beyaz ------------------------------------------------------- */

/* .stk zaten beyazdi ama icindeki .mobile-header bej kaliyordu; kategori
   ve urun sayfalarinda ust barin bozuk gorunmesinin sebebi buydu. */
.stk,
.mobile-header {
	background: var(--surface);
}

/* Arama kutusu artik ayni beyaz zeminde; etrafinda kutu gorunmez */
.mobile-search { background: transparent; }

/* --- Guven seridi altbilgiyle butunlesir -------------------------------- */

/* Beyaz zemin, bej altbilginin ortasinda ayri bir kutu gibi duruyordu.
   DIKKAT: yalnizca renk ve yazi olcusu degisiyor — bu blogun ic
   sarmalayicilarina (container > box-outer > inner > column) grid ya da
   flex verilirse Bootstrap sutunlari cokup maddeler alt alta dizilir. */
.footer-top {
	background: transparent;
	border-top: 1px solid var(--line);
}

/* 10px okunmuyordu. Ikonlar disarida tutuldu: yildiz seciciyle onlar da
   13px'e inip kuculuyordu. */
.footer-top .reassurances {
	font-size: 13px;
	letter-spacing: 0.3px;
}

.footer-top .reassurances .fa,
.footer-top .reassurances i,
.footer-top .reassurances svg,
.footer-top .reassurances img {
	font-size: 22px;
	height: auto;
}

.footer-top .reassurances h3,
.footer-top .reassurances h4,
.footer-top .reassurances strong,
.footer-top .reassurances b {
	color: var(--ink);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.8px;
}

.footer-top .reassurances p,
.footer-top .reassurances span,
.footer-top .reassurances small {
	color: var(--ink-soft);
	font-size: 12px;
}

/* --- Altin ton arayuzden kalkti ----------------------------------------- */

/* Ikon ve baglanti hover'lari bronza donuyordu; notr griye alindi. */
.dz-icon-btn:hover { color: var(--ink-soft); }
#cart > .btn:hover { color: var(--ink-soft) !important; }

/* Yildiz ve bekleme rozeti de ayni sekilde */
.product-info .rating .fa-star,
.dz-review .rating .fa-star { color: var(--ink); }

.dz-badge-wait { background: var(--fill); color: var(--ink-soft); }

/* Sayfalama baglantilari */
.pagination > li > a,
.pagination > li > span,
.dz-pagination a,
.dz-pagination span {
	color: var(--ink-soft);
	font-size: 14px;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > li > a:hover { color: var(--ink); }

.dz-results,
.text-right.pagination-info { color: var(--ink-soft); font-size: 13px; }

/* ==========================================================================
   47. ARAMA ONERILERI (autocomplete)
   --------------------------------------------------------------------------
   Modulun urettigi yapi Bootstrap 3 float'ina dayaniyor:

     <li class="media">
       <a class="media-left"><img class="pull-left"></a>
       <div class="media-body"><a><span>ad</span></a><div class="price"></div></div>
     </li>
     <li class="clearfix"></li>      <- her urunden sonra bos satir

   float calismadigi icin gorsel ustte, ad ve fiyat alt satirlarda kaliyordu;
   aradaki bos li de her kaydin arasini aciyordu. Satir artik flex: solda
   sabit olculu gorsel, saginda ad ve fiyat, dikey ortali.
   Modulun JS'ine ve HTML'ine dokunulmadi — arama davranisi aynen calisir.
   ========================================================================== */

.autosearch-wrapper .dropdown-menu {
	border: 1px solid var(--line);
	border-radius: 0;
	box-shadow: 0 12px 34px rgba(21, 17, 15, 0.10);
	margin-top: 6px;
	max-height: 70vh;
	overflow-y: auto;
	padding: 6px 0;
	width: 100%;
}

/* Urunler arasindaki bos ayirici satir */
.autosearch-wrapper .dropdown-menu > li.clearfix { display: none; }

.autosearch-wrapper .dropdown-menu > li.media {
	align-items: center;
	border-bottom: 1px solid var(--line);
	display: flex;
	gap: 14px;
	margin: 0;
	padding: 10px 16px;
	transition: background var(--fast) var(--ease);
}

.autosearch-wrapper .dropdown-menu > li.media:last-of-type { border-bottom: 0; }
.autosearch-wrapper .dropdown-menu > li.media:hover { background: var(--fill); }

/* Gorsel — sabit olcu, kirpilarak oturur */
.autosearch-wrapper .dropdown-menu .media-left {
	display: block;
	flex: 0 0 auto;
	line-height: 0;
	margin: 0;
	padding: 0;
	width: 54px;
}

.autosearch-wrapper .dropdown-menu .media-left img,
.autosearch-wrapper .dropdown-menu img.pull-left {
	background: var(--fill);
	display: block;
	float: none !important;
	height: 70px;
	margin: 0;
	max-width: none;
	object-fit: cover;
	object-position: center top;
	width: 54px;
}

/* Ad ve fiyat */
.autosearch-wrapper .dropdown-menu .media-body {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0;
	width: auto;
}

.autosearch-wrapper .dropdown-menu .media-body > a {
	color: var(--ink);
	display: block;
	padding: 0;
	white-space: normal;
}

.autosearch-wrapper .dropdown-menu .media-body > a:hover { background: none; }

.autosearch-wrapper .dropdown-menu .media-body span {
	display: -webkit-box;
	font-family: var(--sans);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.35;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.autosearch-wrapper .dropdown-menu .price {
	font-family: var(--sans);
	font-size: 14px;
	font-weight: 500;
	margin-top: 5px;
}

.autosearch-wrapper .dropdown-menu .price .price-old {
	color: var(--ink-faint);
	font-size: 12px;
	font-weight: 400;
	margin-right: 7px;
	text-decoration: line-through;
}

.autosearch-wrapper .dropdown-menu .price .price-new { color: var(--sale); }
.autosearch-wrapper .dropdown-menu .price-tax { display: none; }

/* Kategori basliklari */
.autosearch-wrapper .dropdown-menu > li.dropdown-header {
	color: var(--ink-faint);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.12em;
	padding: 12px 16px 6px;
	text-transform: uppercase;
}

@media (max-width: 991px) {
	.autosearch-wrapper .dropdown-menu > li.media { padding: 9px 14px; }
	.autosearch-wrapper .dropdown-menu .media-left,
	.autosearch-wrapper .dropdown-menu .media-left img { width: 48px; }
	.autosearch-wrapper .dropdown-menu .media-left img { height: 62px; }
	.autosearch-wrapper .dropdown-menu .media-body span { font-size: 13px; }
	.autosearch-wrapper .dropdown-menu .price { font-size: 13px; }
}

/* ==========================================================================
   48. ARAMA ALANI — FAZLA ALT CIZGI
   --------------------------------------------------------------------------
   .mobile-search kapsayicisinin alt kenarligi kutudan daha genis uzanip
   basligi ikiye bolen bir cizgi birakiyordu. Cizgi mobilde anlamli (arama
   asagi acilan bir panel olarak geliyor), masaustunde degil.
   ========================================================================== */

@media (min-width: 992px) {
	.mobile-search {
		border-bottom: 0;
		box-shadow: none;
	}
}

/* ==========================================================================
   49. GORSEL NETLIGI VE IZGARA OLCULERI
   --------------------------------------------------------------------------
   Canli sitede olculerek bulunan uc kusur:

   1) URUN DETAYINDA ILK FOTOGRAF DISINDAKILER BULANIKTI
      Sablon ek fotograflar icin panelin "ek resim" onbellegini kullaniyordu;
      o onbellek 90x100 uretiliyor, galeri kutusu ise ~365px genisliginde.
      Gorsel dort kat buyutuluyordu. Cozum sablonda: artik 900x900 buyuk
      onbellek kullaniliyor (product.twig). Burada da galeri kutusu 900px
      kaynagi buyutmeyecek orana cekildi.

   2) KART FOTOGRAFLARI FARKLI BUYUKLUKTE GORUNUYORDU
      Kutu 5:7 (%140) idi, onbellek ise 560x700 yani 4:5 uretiyor. Aradaki
      fark kenarlardan kirpiliyor, kartlar "yakinlastirilmis" duruyordu.
      Kutu onbellekle ayni orana (4:5) cekildi: artik hicbir sey kirpilmiyor
      ve butun kartlar birebir ayni cerceveyi gosteriyor.

      NOT: Kalan esitsizlik CSS'ten cozulemez. OpenCart farkli en-boy
      oranindaki fotograflari onbellege alirken bosluklari BEYAZ ile
      dolduruyor; bant fotografin icine islenmis oluyor. Kare cekilmis
      urunlerde 560x700 kutunun alt ve ustunde 70'er piksel beyaz kaliyor.
      Bunun icin gorsel onbelleginin yeniden uretilmesi gerekiyor
      (bkz. gorsel_duzelt.php).

   3) IZGARA TELEFONDA EKRAN KENARINA YAPISIYORDU
      Kenar boslugu sifir, sutun araligi 2px idi; sayfa tasmis gibi
      duruyordu. Olculu bir kenar boslugu ve sutun araligi verildi.
   ========================================================================== */

/* --- 1. Urun detay galerisi --------------------------------------------- */

/* Buyuk onbellek 900x900 kare. Kutu 2:3 iken 900px kaynak 1095px'e
   buyutuluyor ve fotografin genisliginin ucte biri kirpiliyordu.
   4:5 oraninda kaynak neredeyse birebir gosteriliyor. */
#product-product .thumbnails .thumbnail { aspect-ratio: 4 / 5; }

/* --- 2. Kart fotograf kutusu -------------------------------------------- */

.product-thumb .image > a { padding-bottom: 125%; }

/* --- 3. Izgara kenar boslugu ve araliklari ------------------------------- */

/* #product-category ile baslayan kurallar da eziliyor: onlarin ozgullugu
   daha yuksek oldugu icin ayni secicilerle tekrarlanmasi gerekiyor. */
.dz-grid,
#product-category .dz-grid,
#product-special .dz-grid,
#product-search .dz-grid {
	column-gap: 8px;
	padding-left: 12px;
	padding-right: 12px;
	row-gap: 40px;
}

@media (min-width: 768px) {
	.dz-grid,
	#product-category .dz-grid,
	#product-special .dz-grid,
	#product-search .dz-grid {
		column-gap: 14px;
		padding-left: 24px;
		padding-right: 24px;
		row-gap: 54px;
	}
}

@media (min-width: 992px) {
	.dz-grid,
	#product-category .dz-grid,
	#product-special .dz-grid,
	#product-search .dz-grid {
		column-gap: 18px;
		padding-left: 32px;
		padding-right: 32px;
		row-gap: 64px;
	}
}

@media (min-width: 1400px) {
	.dz-grid,
	#product-category .dz-grid,
	#product-special .dz-grid,
	#product-search .dz-grid {
		column-gap: 22px;
		padding-left: 40px;
		padding-right: 40px;
		row-gap: 72px;
	}
}

/* --- Ana sayfa urun modulleri de ayni araliga getirildi ----------------- */

/* Ana sayfadaki "Yeni Urunler", "Firsat Kosesi" gibi bolumler kategori
   izgarasindan farkli bir kurala bagli (esnek sarmalayan kutu, id
   secicileriyle). Sutun araligi orada 2px kalirsa ayni sayfada iki farkli
   olcu gorunuyordu. Kart genisligi araliga bagli oldugu icin flex-basis
   de birlikte guncellenir: 4 sutun, aralarinda 3 aralik. */
@media (min-width: 992px) {
	#superdeal,
	#latest,
	#featured,
	#bestseller,
	#special,
	#tab-latestq,
	#tab-featuredq,
	#tab-bestsellerq,
	#tab-specialq { column-gap: 18px; }

	#superdeal > .leftrightx,
	#latest > .leftrightx,
	#featured > .leftrightx,
	#bestseller > .leftrightx,
	#special > .leftrightx,
	#tab-latestq > .leftrightx,
	#tab-featuredq > .leftrightx,
	#tab-bestsellerq > .leftrightx,
	#tab-specialq > .leftrightx {
		flex: 0 0 calc(25% - 13.5px);
		max-width: calc(25% - 13.5px);
	}
}

@media (min-width: 1400px) {
	#superdeal,
	#latest,
	#featured,
	#bestseller,
	#special,
	#tab-latestq,
	#tab-featuredq,
	#tab-bestsellerq,
	#tab-specialq { column-gap: 22px; }

	#superdeal > .leftrightx,
	#latest > .leftrightx,
	#featured > .leftrightx,
	#bestseller > .leftrightx,
	#special > .leftrightx,
	#tab-latestq > .leftrightx,
	#tab-featuredq > .leftrightx,
	#tab-bestsellerq > .leftrightx,
	#tab-specialq > .leftrightx {
		flex: 0 0 calc(25% - 16.5px);
		max-width: calc(25% - 16.5px);
	}
}

/* ==========================================================================
   50. URUN SAYFASI OKUNABILIRLIGI
   --------------------------------------------------------------------------
   Canli sayfadan olculen degerler kucuktu; en onemlisi satis fiyati indirimli
   eski fiyattan daha kucuk cikiyordu:

       satis fiyati 13px   /  ustu cizili eski fiyat 15px
       Sepete At    10px   /  ADET etiketi 10px
       urun kodu    11px   /  sekme basligi 11px

   Musterinin odeyecegi rakam sayfanin en buyuk ikinci yazisi olmali, ustu
   cizili olan ise ondan kucuk ve soluk. Birincil dugmenin de okunmasi
   gerekiyor. Olculer asagida bu siraya gore duzeltildi.

   Kart izgarasi ve diger sayfalar disarida birakildi (#product-product
   kapsami) — oralarda mevcut olcekler zaten dengeli.
   ========================================================================== */

/* --- Fiyat -------------------------------------------------------------- */

#product-product .mainprice h1,
#product-product .mainprice .price-new {
	font-size: 28px;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.15;
	margin: 0;
}

#product-product .mainprice .price-old {
	font-size: 16px;
	font-weight: 400;
	margin-right: 10px;
}

/* Indirimli fiyat mercan kirmizisi kalir, eski fiyat soluk griye duser. */
#product-product .mainprice .price-old + .price-new { color: var(--sale); }

#product-product .mainprice li.dz-faint { font-size: 13px; }

/* --- Sepete At ---------------------------------------------------------- */

/* 10px bir birincil dugme icin okunmuyordu; harf araligi da genisti. */
#product-product .dz-buy #button-cart,
#product-product .dz-buy #button-hizli,
#product-product #button-cart,
#product-product #button-hizli {
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.06em;
	min-height: 54px;
}

/* --- Adet etiketi ve secenek etiketleri --------------------------------- */

#product-product #product label.control-label,
#product-product .dz-qty-label { font-size: 12px; }

/* --- Urun kodu / stok satiri -------------------------------------------- */

#product-product .dz-assurance li {
	font-size: 13px;
	line-height: 1.7;
}

/* --- Yildiz altindaki yorum baglantisi ---------------------------------- */

#product-product .rating a { font-size: 12px; }

/* --- Sekmeler ve aciklama metni ----------------------------------------- */

#product-product .nav-tabs > li > a {
	font-size: 13px;
	letter-spacing: 0.1em;
}

#product-product .tab-content,
#product-product #tab-description,
#product-product #tab-description p,
#product-product #tab-description li,
#product-product #tab-description td {
	font-size: 15px;
	line-height: 1.75;
}

/* --- Bos aciklama madde isareti ----------------------------------------- */

/* Panelde aciklamasi girilmemis urunlerde metin editoru <li><br></li>
   birakiyor; sekmede sahipsiz bir madde isareti gorunuyordu. Icerigi
   yalnizca satir sonundan ibaret olan maddeler gizlenir. Kalici cozum
   panelden aciklama girmek — arama motorlari icin de gerekli. */
#product-product #tab-description li:has(> br:only-child) { display: none; }
#product-product #tab-description ul:has(> li:only-child > br:only-child) { display: none; }

/* --- Telefonda bir tik daha kucuk, yine de rahat okunur ----------------- */

@media (max-width: 767px) {
	#product-product .mainprice h1,
	#product-product .mainprice .price-new { font-size: 24px; }

	#product-product .dz-buy #button-cart,
	#product-product .dz-buy #button-hizli,
	#product-product #button-cart,
	#product-product #button-hizli { font-size: 15px; min-height: 52px; }

	#product-product #tab-description,
	#product-product #tab-description p,
	#product-product #tab-description li { font-size: 15px; }
}

@media print {
	.dz-topnav { display: none !important; }

	#top, #header, #menu, .mobile-header, .stk, footer, #altsabitmenu,
	.mobile-menu-wrapper, .site-wrapper-overlay, .button-group { display: none !important; }

	body { color: #000; font-size: 12px; }
	.container { max-width: none; padding: 0; }
}
