/* Barberman — tek stil dosyası. Standart: docs/02-sayfa-formati.md
   Tokenlar :root'ta. Eleman tabanlı sınıflar (.dugme, .kap) tip tabanlı olanlardan (.bolum) bağımsız padding taşır. */

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
	src: url("fonts/archivo-latin-ext-wdth-normal.woff2") format("woff2-variations");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
	src: url("fonts/archivo-latin-wdth-normal.woff2") format("woff2-variations");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--renk-zemin: #ffffff;
	--renk-yuzey: #eef0ee;
	--renk-murekkep: #16181a;
	--renk-ikincil: #5c6166;
	--renk-cizgi: #d5d9d6;
	--renk-vurgu: #14425a;
	--renk-vurgu-koyu: #0e3145;
	--renk-uyari: #a8382c;

	--font: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-veri: "Archivo", ui-monospace, SFMono-Regular, Menlo, monospace;

	--b1: 4px;
	--b2: 8px;
	--b3: 12px;
	--b4: 16px;
	--b6: 24px;
	--b10: 40px;
	--b16: 64px;
	--kose: 2px;
	--kap-en: 1240px;
	--kenar: clamp(16px, 4vw, 32px);
}

/* ---- Temel ---------------------------------------------------------------- */
html { scroll-behavior: auto; }
body {
	background: var(--renk-zemin);
	color: var(--renk-murekkep);
	font-family: var(--font);
	font-size: 16px;
	line-height: 26px;
	font-weight: 400;
	font-stretch: 100%;
	-webkit-font-smoothing: antialiased;
}
body h1, body h2, body h3, body h4, body .h1, body .h2, body .h3 {
	font-family: var(--font);
	color: var(--renk-murekkep);
	text-transform: none;
	letter-spacing: 0;
	margin: 0 0 var(--b3);
	text-align: left;
	text-wrap: balance;
}
body h1 { font-size: 40px; line-height: 44px; font-weight: 600; font-stretch: 112%; }
body h2 { font-size: 26px; line-height: 32px; font-weight: 600; font-stretch: 100%; }
body h3 { font-size: 19px; line-height: 26px; font-weight: 600; font-stretch: 100%; }
@media (max-width: 549px) { body h1 { font-size: 30px; line-height: 34px; } }

body p, body li { max-width: 70ch; }
body a { color: var(--renk-vurgu); text-underline-offset: 3px; }
body a:hover { color: var(--renk-vurgu-koyu); }
body :focus-visible { outline: 3px solid var(--renk-vurgu); outline-offset: 2px; }
img { height: auto; }

.kap { max-width: var(--kap-en); margin-inline: auto; padding-inline: var(--kenar); }
.screen-reader-text:focus, .skip-link:focus { clip: auto !important; height: auto; width: auto; z-index: 100000; background: #fff; padding: var(--b3) var(--b4); }

/* ---- Düğmeler --------------------------------------------------------------- */
.dugme, body .button, body button.button, body .woocommerce a.button, body input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px var(--b6);
	border: 2px solid var(--renk-vurgu);
	border-radius: var(--kose);
	background: transparent;
	color: var(--renk-vurgu);
	font: 600 16px/20px var(--font);
	text-transform: none;
	letter-spacing: 0;
	text-decoration: none;
	cursor: pointer;
	box-shadow: none;
	touch-action: manipulation;
}
.dugme:hover, body .button:hover { background: var(--renk-yuzey); color: var(--renk-vurgu-koyu); }
.dugme--birincil, body .button.alt, body .button.checkout, body .single_add_to_cart_button {
	background: var(--renk-vurgu);
	color: #fff;
}
.dugme--birincil:hover, body .button.alt:hover, body .single_add_to_cart_button:hover { background: var(--renk-vurgu-koyu); color: #fff; }
.dugme--acik { border-color: #fff; color: #fff; }
.dugme--acik:hover { background: rgba(255, 255, 255, 0.14); color: #fff; }

/* ---- Üst bar + gezinme -------------------------------------------------------- */
.ust { position: sticky; top: 0; z-index: 50; background: var(--renk-zemin); border-bottom: 1px solid var(--renk-cizgi); }
.ust__satir { display: flex; align-items: center; gap: var(--b6); padding-block: var(--b3); }
.ust__logo img { display: block; height: 40px; width: auto; }
.ust__ara { display: flex; flex: 1 1 320px; max-width: 460px; }
.ust__ara input[type="search"] {
	flex: 1; min-width: 0; height: 44px; margin: 0; padding: 0 var(--b3);
	border: 1px solid var(--renk-cizgi); border-right: 0; border-radius: var(--kose) 0 0 var(--kose);
	font: 400 16px/24px var(--font); box-shadow: none; background: #fff; color: var(--renk-murekkep);
}
.ust__ara button {
	height: 44px; margin: 0; padding: 0 var(--b4); border: 1px solid var(--renk-vurgu); border-radius: 0 var(--kose) var(--kose) 0;
	background: var(--renk-vurgu); color: #fff; font: 600 15px/20px var(--font); cursor: pointer;
}
.ust__eylem { display: flex; align-items: center; gap: var(--b4); margin-left: auto; }
.ust__eylem a:not(.dugme) { color: var(--renk-murekkep); text-decoration: none; font-weight: 500; }
.ust__eylem a:not(.dugme):hover { text-decoration: underline; }
.ust__nav { border-top: 1px solid var(--renk-cizgi); background: var(--renk-yuzey); }
.ust__nav ul { display: flex; flex-wrap: wrap; gap: var(--b1) var(--b6); list-style: none; margin: 0 auto; padding-block: 0; }
.ust__nav li { margin: 0; max-width: none; }
.ust__nav a { display: inline-block; padding: var(--b3) 0; color: var(--renk-murekkep); text-decoration: none; font-weight: 500; }
.ust__nav a:hover { color: var(--renk-vurgu); text-decoration: underline; }
.ust__menu { display: none; margin-left: auto; }
.ust__menu summary { list-style: none; cursor: pointer; padding: var(--b2) var(--b4); border: 1px solid var(--renk-cizgi); border-radius: var(--kose); font-weight: 600; }
.ust__menu summary::-webkit-details-marker { display: none; }
.ust__menu ul { position: absolute; left: 0; right: 0; top: 100%; margin: 0; padding: var(--b2) var(--kenar) var(--b4); list-style: none; background: #fff; border-bottom: 1px solid var(--renk-cizgi); }
.ust__menu li { margin: 0; max-width: none; }
.ust__menu a { display: block; padding: var(--b3) 0; color: var(--renk-murekkep); text-decoration: none; font-weight: 500; border-bottom: 1px solid var(--renk-cizgi); }

@media (max-width: 849px) {
	.ust__satir { flex-wrap: wrap; gap: var(--b3); }
	.ust__ara { order: 3; flex: 1 1 100%; max-width: none; }
	.ust__eylem, .ust__nav { display: none; }
	.ust__menu { display: block; }
	.ust__logo img { height: 34px; }
}

/* ---- Breadcrumb + sayfa başlığı ---------------------------------------------- */
.kirinti ol { display: flex; flex-wrap: wrap; gap: var(--b1) var(--b2); list-style: none; margin: 0 auto; padding-block: var(--b3); font-size: 13px; line-height: 18px; color: var(--renk-ikincil); }
.kirinti li { margin: 0; max-width: none; }
.kirinti li + li::before { content: "/"; margin-right: var(--b2); color: var(--renk-cizgi); }
.kirinti a { color: var(--renk-ikincil); }
.sayfa-baslik { margin-top: var(--b4); }
.woocommerce-breadcrumb, .breadcrumbs, .product-breadcrumb-container { display: none !important; }
/* Flatsome'un başlık şeridi (arka plan + kendi başlığı) sadeleşir */
.shop-page-title, .category-page-title, .page-title { background: none !important; }
.page-title-bg, .page-title .bg-overlay { display: none; }
.page-title-inner { padding-block: var(--b4); }
.page-title .page-title-inner h1, .shop-page-title h1 { color: var(--renk-murekkep); text-shadow: none; }

/* ---- Ana sayfa ---------------------------------------------------------------- */
.hero { display: grid; grid-template-columns: 1fr; gap: var(--b6); align-items: center; padding-block: var(--b10); }
.hero__metin > * + * { margin-top: var(--b4); }
.hero__veri { font-family: var(--font-veri); font-size: 13px; line-height: 18px; font-weight: 500; color: var(--renk-ikincil); }
.hero__dugmeler, .bant__dugmeler, .teklif__dugmeler { display: flex; flex-wrap: wrap; gap: var(--b3); }
.hero__not { font-size: 13px; line-height: 18px; color: var(--renk-ikincil); }
.hero__gorsel { display: block; background: var(--renk-yuzey); border-radius: var(--kose); }
.hero__gorsel img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; }
@media (min-width: 900px) { .hero { grid-template-columns: 5fr 6fr; gap: var(--b10); padding-block: var(--b16); } }

.bolum { padding-block: var(--b10); }
.bolum > h2 { margin-bottom: var(--b6); }
.kutular, .urun-izgara, .rehber { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--b4); }
.kutular { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.urun-izgara { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .urun-izgara { grid-template-columns: repeat(4, 1fr); } }
.rehber { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.kutular li, .urun-izgara li, .rehber li { margin: 0; max-width: none; }
.kutular a, .urun-izgara a, .rehber a { display: block; height: 100%; color: var(--renk-murekkep); text-decoration: none; border: 1px solid var(--renk-cizgi); border-radius: var(--kose); background: #fff; overflow: hidden; }
.kutular a:hover, .urun-izgara a:hover, .rehber a:hover { border-color: var(--renk-vurgu); }
.kutular img, .urun-izgara img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: var(--renk-yuzey); }
.urun-izgara img { aspect-ratio: 1 / 1; }
.kutular__ad, .urun-izgara__ad, .rehber__ad { display: block; padding: var(--b3) var(--b4) 0; font-weight: 600; }
.kutular__say, .rehber__ozet { display: block; padding: 0 var(--b4) var(--b4); color: var(--renk-ikincil); font-size: 14px; line-height: 20px; }
.urun-izgara .kart-not { padding: 0 var(--b4) var(--b4); }
.kart-not { display: block; margin-top: var(--b1); font-size: 13px; line-height: 18px; color: var(--renk-ikincil); }

.bant { background: var(--renk-vurgu); color: #fff; }
.bant__ic { display: grid; gap: var(--b6); padding-block: var(--b10); align-items: center; }
.bant h2, .bant p { color: #fff; }
@media (min-width: 900px) { .bant__ic { grid-template-columns: 1fr auto; } }

/* ---- Güven şeridi + footer ---------------------------------------------------- */
.guven { background: var(--renk-yuzey); border-top: 1px solid var(--renk-cizgi); margin-top: var(--b10); }
.guven__ic { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--b6); padding-block: var(--b6); }
.guven__baslik { font-size: 13px !important; line-height: 18px !important; font-weight: 600; margin: 0 0 var(--b1) !important; color: var(--renk-ikincil) !important; }
.guven p { margin: 0; font-size: 15px; line-height: 22px; }
.guven a { color: var(--renk-murekkep); }

.alt { background: var(--renk-murekkep); color: #d9dcda; }
.alt a { color: #fff; }
.alt__ic { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--b10); padding-block: var(--b10); }
.alt__baslik { font-size: 15px !important; line-height: 20px !important; color: #fff !important; margin: 0 0 var(--b3) !important; }
.alt ul { list-style: none; margin: 0; padding: 0; }
.alt li { margin: 0 0 var(--b2); max-width: none; }
.alt address { font-style: normal; font-size: 15px; line-height: 24px; }
.alt__sosyal { display: flex; gap: var(--b4); margin: var(--b3) 0 0; }
.alt__telif { margin: 0 auto; padding-block: var(--b4) var(--b6); border-top: 1px solid rgba(255, 255, 255, 0.16); font-size: 13px; line-height: 18px; max-width: var(--kap-en); }

.mobil-bar { display: none; }
@media (max-width: 849px) {
	.mobil-bar { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 2fr; gap: 1px; background: var(--renk-cizgi); border-top: 1px solid var(--renk-cizgi); }
	.mobil-bar a { display: flex; align-items: center; justify-content: center; min-height: 52px; background: #fff; color: var(--renk-vurgu); font-weight: 600; text-decoration: none; }
	.mobil-bar__wa { background: var(--renk-vurgu) !important; color: #fff !important; }
	body { padding-bottom: 52px; }
}

/* ---- Ürün ---------------------------------------------------------------------- */
.teklif { margin-top: var(--b6); padding-top: var(--b4); border-top: 1px solid var(--renk-cizgi); }
.teklif__fiyat { font-size: 19px; line-height: 26px; font-weight: 600; margin: 0 0 var(--b1); }
.teklif__stok { margin: 0 0 var(--b4); color: var(--renk-ikincil); }
.teklif__not { margin: var(--b3) 0 0; font-size: 14px; line-height: 20px; color: var(--renk-ikincil); }
body .product-info .product-title { font-size: 26px; line-height: 32px; font-weight: 600; }
body .product-info .price-wrapper, body .product-info .price { font-weight: 700; font-stretch: 88%; font-size: 24px; line-height: 28px; color: var(--renk-murekkep); }
body .product-short-description, body .product-short-description li { max-width: 70ch; }
.woocommerce-tabs .tabs li a { text-transform: none; font-weight: 600; letter-spacing: 0; }
table.shop_attributes th, table.shop_attributes td { padding: var(--b2) var(--b3); text-align: left; border-color: var(--renk-cizgi); }
table.shop_attributes th { width: 32%; color: var(--renk-ikincil); font-weight: 500; }

/* Kart (mağaza / kategori) */
body .products .product-small .box-text { text-align: left; padding-inline: 0; }
body .products .product-small .name, body .products .product-small .name a { font: 600 16px/22px var(--font); color: var(--renk-murekkep); text-transform: none; }
body .products .product-small .box-image { background: var(--renk-yuzey); border-radius: var(--kose); }
body .products .product-small .category, body .products .product-small .title-wrapper .category { display: none; }
.kategori-aciklama { padding-block: var(--b10); max-width: 70ch; margin-inline: auto; }
.kategori-aciklama p { max-width: 70ch; }
body .page-numbers a, body .page-numbers span { border-radius: var(--kose); }

/* Sepet / ödeme / hesap: sade */
.woocommerce-cart-form, .woocommerce-checkout { font-size: 16px; }
body .woocommerce input[type="text"], body .woocommerce input[type="email"], body .woocommerce input[type="tel"], body .woocommerce input[type="password"], body .woocommerce select, body .woocommerce textarea {
	border: 1px solid var(--renk-cizgi); border-radius: var(--kose); box-shadow: none; font: 400 16px/24px var(--font); min-height: 44px;
}

/* Rank Math / Flatsome'un kendi üst şeritleri, kayan öğeler */
.header-wrapper, #masthead, .header-bg-color { display: none; }
.back-to-top, #top-link { border-radius: var(--kose); }

@media (prefers-reduced-motion: reduce) {
	* { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}