/* Arapça Kitapevi — tema stilleri */

:root {
	--zemin: #faf6ee;
	--yuzey: #ffffff;
	--yuzey-2: #f3ecdd;
	--yazi: #1f2421;
	--soluk: #6b6a63;
	--cizgi: #e4dccb;
	--ana: #1f4d3a;
	--ana-koyu: #163a2b;
	--ana-yazi: #ffffff;
	--altin: #a87a1f;
	--altin-acik: #e9d6a6;
	--golge: 0 1px 2px rgba(31, 36, 33, .06), 0 4px 14px rgba(31, 36, 33, .06);
	--yaricap: 10px;
	--genislik: 1200px;
	--tr: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--baslik: "Literata", Georgia, serif;
	--ar: "Noto Naskh Arabic", "Amiri", "Traditional Arabic", serif;
	--ar-baslik: "Noto Naskh Arabic", "Amiri", serif;
	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root {
		--zemin: #151815;
		--yuzey: #1d211e;
		--yuzey-2: #252a26;
		--yazi: #e8e4da;
		--soluk: #a19e94;
		--cizgi: #333a35;
		--ana: #7cc4a1;
		--ana-koyu: #9dd6b9;
		--ana-yazi: #0f1a14;
		--altin: #d8b05a;
		--altin-acik: #4a3d1f;
		--golge: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 14px rgba(0, 0, 0, .3);
		color-scheme: dark;
	}
}

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

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

body {
	margin: 0;
	background: var(--zemin);
	color: var(--yazi);
	font: 16px/1.6 var(--tr);
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

a { color: var(--ana); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--altin); }
img { max-width: 100%; height: auto; display: block; }

h1, h2, h3 { font-family: var(--baslik); font-weight: 600; line-height: 1.25; margin: 0 0 .6em; }
h1 { font-size: clamp(1.7rem, 3vw, 2.3rem); }
h2 { font-size: clamp(1.3rem, 2.2vw, 1.6rem); }

.ar { font-family: var(--ar); font-size: 1.15em; line-height: 1.9; unicode-bidi: isolate; }

.kap { width: 100%; max-width: var(--genislik); margin: 0 auto; padding: 0 16px; }
.icerik { flex: 1; padding-bottom: 48px; }
.soluk { color: var(--soluk); }
.bos { color: var(--soluk); padding: 32px 0; }

.gorunmez {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap;
}
.atla { position: absolute; left: -999px; top: 8px; background: var(--ana); color: var(--ana-yazi); padding: 8px 12px; z-index: 100; }
.atla:focus { left: 8px; }

:focus-visible { outline: 2px solid var(--altin); outline-offset: 2px; }

/* ---------- Düğmeler ---------- */

.dugme, .buyuk-ara button,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt, .woocommerce button.button.alt {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	background: var(--ana); color: var(--ana-yazi);
	border: 1px solid var(--ana); border-radius: 8px;
	padding: 10px 18px; font: 600 15px/1.2 var(--tr);
	text-decoration: none; cursor: pointer;
}
.dugme:hover, .buyuk-ara button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover {
	background: var(--ana-koyu); border-color: var(--ana-koyu); color: var(--ana-yazi);
}
.dugme.ikincil { background: transparent; color: var(--ana); }
.dugme.ikincil:hover { background: var(--yuzey-2); color: var(--ana); }
.dugme.buyuk { padding: 13px 22px; font-size: 16px; }
.dugme.kucuk { padding: 6px 12px; font-size: 14px; }

/* ---------- Üst bilgi ---------- */

.ust {
	background: var(--yuzey);
	border-bottom: 1px solid var(--cizgi);
	position: sticky; top: 0; z-index: 50;
}
.admin-bar .ust { top: 32px; }
.ust-ic { display: flex; align-items: center; gap: 24px; min-height: 68px; }

.logo-yazi { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--yazi); }
.logo-isaret {
	width: 40px; height: 40px; border-radius: 9px;
	display: grid; place-items: center;
	background: var(--ana); color: var(--altin-acik);
	font: 700 26px/1 "Amiri", var(--ar); padding-bottom: 4px;
}
.logo-ad { font: 600 1.2rem/1.1 var(--baslik); white-space: nowrap; }
.custom-logo { max-height: 52px; width: auto; }

.ana-menu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; }
.ana-menu a { display: block; padding: 8px 12px; border-radius: 8px; color: var(--yazi); text-decoration: none; font-weight: 500; }
.ana-menu a:hover, .ana-menu .current-menu-item > a { background: var(--yuzey-2); color: var(--ana); }
.ana-menu .sub-menu { display: none; }

.ust-araclar { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.ust-ara input {
	width: 240px; padding: 9px 14px; border-radius: 999px;
	border: 1px solid var(--cizgi); background: var(--zemin); color: var(--yazi);
	font: 15px var(--tr);
}
.ust-ara input:focus { outline: none; border-color: var(--ana); background: var(--yuzey); }
.hesap, .sepet { position: relative; color: var(--yazi); padding: 8px; border-radius: 8px; display: grid; place-items: center; }
.hesap:hover, .sepet:hover { background: var(--yuzey-2); color: var(--ana); }
.sepet .sayi {
	position: absolute; top: 0; right: 0; min-width: 18px; height: 18px; border-radius: 9px;
	background: var(--altin); color: #fff; font: 700 11px/18px var(--tr); text-align: center; padding: 0 4px;
}

.menu-dugme { display: none; background: none; border: 0; padding: 10px; cursor: pointer; color: var(--yazi); }
.menu-dugme .cizgi, .menu-dugme .cizgi::before, .menu-dugme .cizgi::after {
	display: block; width: 22px; height: 2px; background: currentColor; position: relative; content: "";
}
.menu-dugme .cizgi::before { position: absolute; top: -7px; }
.menu-dugme .cizgi::after { position: absolute; top: 7px; }

@media (max-width: 960px) {
	.ust-ic { flex-wrap: wrap; gap: 8px 12px; padding-top: 10px; padding-bottom: 10px; }
	.menu-dugme { display: block; order: 3; }
	.ust-araclar { order: 2; }
	.ana-menu { display: none; order: 5; width: 100%; }
	.menu-acik .ana-menu { display: block; }
	.ana-menu ul { flex-direction: column; padding-bottom: 8px; }
	.ust-ara { order: 6; }
	.ust-ara input { width: 160px; }
}
@media (max-width: 600px) {
	.admin-bar .ust { top: 0; }
	.ust { position: static; }
	.ust-araclar { width: 100%; order: 6; }
	.ust-ara { flex: 1; }
	.ust-ara input { width: 100%; }
	.logo { flex: 1; }
}

/* ---------- Vitrin (ana sayfa) ---------- */

.vitrin {
	background:
		radial-gradient(circle at 85% 20%, rgba(168, 122, 31, .18), transparent 40%),
		linear-gradient(135deg, var(--ana) 0%, var(--ana-koyu) 100%);
	color: #fff;
	padding: 64px 0 56px;
	margin-bottom: 24px;
	position: relative;
	overflow: hidden;
}
@media (prefers-color-scheme: dark) {
	.vitrin { background: radial-gradient(circle at 85% 20%, rgba(216, 176, 90, .14), transparent 40%), linear-gradient(135deg, #1d3b2e 0%, #12261d 100%); }
}
.vitrin::after {
	content: "ك ت ب";
	position: absolute; right: 4%; bottom: -30px;
	font: 700 180px/1 "Amiri", var(--ar); color: rgba(255, 255, 255, .05);
	pointer-events: none; direction: rtl;
}
.vitrin-ic { position: relative; z-index: 1; max-width: 820px; text-align: center; }
.vitrin h1 { color: #fff; font-size: clamp(1.9rem, 4.2vw, 2.9rem); }
.vitrin-metin { font-size: 1.1rem; opacity: .9; margin: 0 auto 28px; max-width: 620px; }
.vitrin-sayi { margin: 16px 0 0; opacity: .75; font-size: .95rem; }

.buyuk-ara { display: flex; gap: 8px; max-width: 640px; margin: 0 auto; }
.buyuk-ara input {
	flex: 1; min-width: 0; padding: 14px 18px; border-radius: 10px; border: 1px solid var(--cizgi);
	font: 17px var(--tr); background: var(--yuzey); color: var(--yazi);
}
.vitrin .buyuk-ara input { border: 0; box-shadow: 0 6px 24px rgba(0, 0, 0, .18); }
.vitrin .buyuk-ara button { background: var(--altin); border-color: var(--altin); color: #fff; padding: 14px 24px; }
.vitrin .buyuk-ara button:hover { background: #8f6716; border-color: #8f6716; }
@media (max-width: 600px) {
	.vitrin { padding: 40px 0 36px; }
	.buyuk-ara { flex-direction: column; }
}

/* ---------- Bölüm şeritleri ---------- */

.serit { margin: 40px 0; }
.serit-bas { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--cizgi); padding-bottom: 8px; margin-bottom: 20px; }
.serit-bas h2 { margin: 0; }
.tumu { font-weight: 600; text-decoration: none; white-space: nowrap; }

/* ---------- Kitap kartları ---------- */

.woocommerce ul.products, ul.products.kitaplar {
	list-style: none; margin: 0 0 24px; padding: 0;
	display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 28px 20px;
}
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product, ul.products li.kart {
	width: auto !important; margin: 0 !important; float: none !important; padding: 0;
}
@media (max-width: 600px) {
	.woocommerce ul.products, ul.products.kitaplar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; }
}

.kart-baglanti { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: var(--yazi); height: 100%; }
.kapak {
	display: block; aspect-ratio: 2 / 3; border-radius: 4px 8px 8px 4px; overflow: hidden;
	box-shadow: var(--golge); background: var(--yuzey-2);
	transition: transform .18s ease, box-shadow .18s ease;
	position: relative;
}
.kapak::before { /* sırt gölgesi */
	content: ""; position: absolute; inset: 0 auto 0 0; width: 8px; z-index: 1;
	background: linear-gradient(90deg, rgba(0, 0, 0, .18), rgba(0, 0, 0, 0));
}
.kart-baglanti:hover .kapak { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(31, 36, 33, .16); }
.kapak img, .kapak .kapak-resim { width: 100%; height: 100%; object-fit: cover; }

.kart-govde { display: flex; flex-direction: column; gap: 2px; }
.kart-baslik { font-weight: 600; line-height: 1.35; }
.kart-baglanti:hover .kart-baslik { color: var(--ana); }
.kart-ar { font-size: 1.05rem; line-height: 1.7; color: var(--soluk); text-align: left; }
.kart-yazar { color: var(--soluk); font-size: .92rem; }
.kart-fiyat { margin-top: 4px; font-weight: 600; color: var(--altin); font-size: .95rem; }
.kart-fiyat del { color: var(--soluk); font-weight: 400; }
.ucretsiz { color: var(--ana); font-weight: 600; }

/* Çizilmiş kapak (görsel yoksa) */
.kapak-cizim {
	display: flex; width: 100%; height: 100%; padding: 10%;
	color: #f6ecd2;
}
.kapak-cerceve {
	flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12%;
	border: 1.5px solid rgba(233, 214, 166, .65); outline: 1px solid rgba(233, 214, 166, .3); outline-offset: 4px;
	border-radius: 2px; padding: 12% 8%; text-align: center;
}
.kapak-baslik { font: 700 1.25rem/1.6 var(--ar-baslik); overflow-wrap: anywhere; }
span.kapak-baslik:not(.ar) { font: 600 1rem/1.35 var(--baslik); }
.kapak-yazar { font: .85rem/1.5 var(--ar); opacity: .85; }
span.kapak-yazar:not(.ar) { font: .78rem/1.4 var(--tr); }
.kapak-cizim.yesil { background: linear-gradient(160deg, #2a5c47, #183d2e); }
.kapak-cizim.lacivert { background: linear-gradient(160deg, #26406b, #172845); }
.kapak-cizim.bordo { background: linear-gradient(160deg, #6e2632, #45161e); }
.kapak-cizim.kahve { background: linear-gradient(160deg, #6a4a2b, #402b17); }
.kapak-cizim.mor { background: linear-gradient(160deg, #4f3466, #2f1f3f); }
.kapak-cizim.petrol { background: linear-gradient(160deg, #1f5a63, #12363c); }
.kapak-tek .kapak-cizim { aspect-ratio: 2 / 3; border-radius: 4px 10px 10px 4px; box-shadow: var(--golge); }
.kapak-tek .kapak-baslik { font-size: 2rem; }
.kapak-tek .kapak-yazar { font-size: 1.15rem; }

/* ---------- Konu kartları ---------- */

.konu-kartlari { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.konu-kartlari > li > a {
	display: flex; flex-direction: column; gap: 2px; padding: 16px 18px;
	background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--yaricap);
	text-decoration: none; color: var(--yazi); border-left: 4px solid var(--altin);
}
.konu-kartlari > li > a:hover { border-color: var(--ana); border-left-color: var(--ana); }
.konu-ad { font: 600 1.05rem var(--baslik); }
.konu-kartlari.genis { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.alt-konular { list-style: none; margin: 8px 0 0; padding: 0 0 0 20px; font-size: .95rem; }
.alt-konular li { padding: 2px 0; }

/* ---------- Liste sayfası düzeni ---------- */

.yol { font-size: .9rem; color: var(--soluk); padding: 18px 0 8px; }
.yol a { color: var(--soluk); text-decoration: none; }
.yol a:hover { color: var(--ana); }
.yol .ayrac { margin: 0 8px; opacity: .6; }

.liste-ic { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 36px; align-items: start; }
@media (max-width: 860px) {
	.liste-ic { grid-template-columns: minmax(0, 1fr); }
	.kenar { order: 2; }
}
.liste-ana .woocommerce-products-header__title, .liste-ana h1.page-title { margin-top: 0; }
.term-description, .yazar-bilgi { color: var(--soluk); margin-bottom: 16px; }
.yazar-ar { font-size: 1.6rem; color: var(--yazi); margin: -.4em 0 .2em; text-align: left; }

.woocommerce .woocommerce-result-count { color: var(--soluk); font-size: .92rem; margin: 6px 0 18px; }
.woocommerce .woocommerce-ordering select {
	padding: 8px 10px; border-radius: 8px; border: 1px solid var(--cizgi); background: var(--yuzey); color: var(--yazi); font: 14px var(--tr);
}

.kutu { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--yaricap); padding: 16px 18px; margin-bottom: 18px; }
.kutu-baslik { font-size: 1rem; margin: 0 0 10px; font-family: var(--tr); text-transform: uppercase; letter-spacing: .06em; color: var(--soluk); }
.terim-liste { list-style: none; margin: 0; padding: 0; }
.terim-liste li { display: flex; justify-content: space-between; gap: 8px; padding: 4px 0; }
.terim-liste a { text-decoration: none; color: var(--yazi); }
.terim-liste a:hover, .terim-liste .secili a { color: var(--ana); font-weight: 600; }
.terim-liste .sayi { color: var(--soluk); font-size: .85rem; }
.kutu .tumu { display: inline-block; margin-top: 8px; font-size: .92rem; }

.woocommerce nav.woocommerce-pagination ul { border: 0; display: flex; gap: 6px; justify-content: center; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
	border-radius: 8px; min-width: 40px; padding: 10px; border: 1px solid var(--cizgi); background: var(--yuzey); color: var(--yazi);
}
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--ana); color: var(--ana-yazi); border-color: var(--ana); }

/* ---------- Kitap sayfası ---------- */

.woocommerce div.product { display: grid; grid-template-columns: minmax(220px, 340px) minmax(0, 1fr); gap: 20px 48px; margin-top: 8px; }
.woocommerce div.product div.images, .woocommerce div.product div.summary,
.woocommerce div.product .kapak-tek { width: auto !important; float: none !important; margin: 0 !important; }
.woocommerce div.product .woocommerce-tabs, .woocommerce div.product .serit { grid-column: 1 / -1; }
@media (max-width: 760px) {
	.woocommerce div.product { grid-template-columns: minmax(0, 1fr); }
	.woocommerce div.product div.images, .woocommerce div.product .kapak-tek { max-width: 260px; margin: 0 auto !important; width: 100% !important; }
}
.woocommerce div.product div.images img { border-radius: 4px 10px 10px 4px; box-shadow: var(--golge); }

.woocommerce div.product .product_title { margin-bottom: .2em; }
.urun-ar-baslik { font: 700 1.9rem/1.7 var(--ar-baslik); margin: 0 0 4px; text-align: left; }
.urun-yazar { font-size: 1.1rem; margin: 0 0 16px; }
.urun-yazar a { font-weight: 600; text-decoration: none; }
.woocommerce div.product p.price { color: var(--altin); font-size: 1.4rem; font-weight: 600; margin: 0 0 16px; }

.kunye { width: 100%; border-collapse: collapse; margin: 8px 0 20px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--yaricap); overflow: hidden; }
.kunye th, .kunye td { text-align: left; padding: 9px 14px; border-bottom: 1px solid var(--cizgi); vertical-align: top; }
.kunye tr:last-child th, .kunye tr:last-child td { border-bottom: 0; }
.kunye th { width: 32%; font-weight: 600; color: var(--soluk); background: var(--yuzey-2); font-size: .92rem; }
.kunye td .ar { display: block; text-align: right; }
@media (max-width: 480px) {
	.kunye th, .kunye td { display: block; width: 100%; }
	.kunye th { border-bottom: 0; padding-bottom: 2px; }
}

.indirme { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 20px; }
.indirme .dosyalar { list-style: none; margin: 0; padding: 0; width: 100%; }
.indirme .dosyalar li { display: flex; gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--cizgi); }
.indirme .dosyalar li span { flex: 1; }
.indirme-sayi, .indirme-not { width: 100%; margin: 4px 0 0; color: var(--soluk); font-size: .92rem; }

.woocommerce div.product form.cart { margin-bottom: 20px; }
.woocommerce div.product form.cart .quantity { display: none; } /* dijital kitap: adet yok */

.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 24px 0 0; border-bottom: 1px solid var(--cizgi); }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { background: none; border: 0; border-radius: 0; margin: 0; padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 10px 16px; color: var(--soluk); font-weight: 600; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--ana); box-shadow: inset 0 -2px 0 var(--ana); }
.woocommerce div.product .woocommerce-tabs .panel { padding: 20px 0; max-width: 780px; }

/* ---------- WooCommerce genel ---------- */

.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-notice {
	background: var(--yuzey); color: var(--yazi); border-top-color: var(--ana); border-radius: 8px;
}
.woocommerce-message::before, .woocommerce-info::before { color: var(--ana); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select {
	padding: 10px 12px; border: 1px solid var(--cizgi); border-radius: 8px; background: var(--yuzey); color: var(--yazi);
}
.woocommerce span.onsale { background: var(--altin); }

/* ---------- Sayfalar ---------- */

.sayfa { padding-top: 32px; }
.yazi { max-width: 780px; }
.yazi-ozet { padding: 18px 0; border-bottom: 1px solid var(--cizgi); }
.bulunamadi { text-align: center; }
.bulunamadi .buyuk-ara { margin-top: 20px; }

.harfler { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 24px; }
.harfler a { min-width: 36px; padding: 6px 10px; text-align: center; border-radius: 8px; background: var(--yuzey); border: 1px solid var(--cizgi); text-decoration: none; font-weight: 600; }
.harf-grup h2 { color: var(--altin); border-bottom: 1px solid var(--cizgi); padding-bottom: 4px; }
.yazar-liste { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 4px 24px; }
.yazar-liste a { display: flex; align-items: baseline; gap: 10px; padding: 6px 0; text-decoration: none; color: var(--yazi); }
.yazar-liste a:hover span:first-child { color: var(--ana); }
.yazar-liste .ar { color: var(--soluk); font-size: 1rem; }
.yazar-liste .soluk { margin-left: auto; font-size: .85rem; }

/* ---------- Alt bilgi ---------- */

.alt { background: var(--yuzey); border-top: 1px solid var(--cizgi); padding: 36px 0 20px; font-size: .95rem; }
.alt-ic { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 28px; }
@media (max-width: 760px) { .alt-ic { grid-template-columns: 1fr; } }
.alt-ad { font: 600 1.1rem var(--baslik); margin: 0; }
.alt .telif p { margin: 0 0 8px; color: var(--soluk); }
.alt ul { list-style: none; margin: 0; padding: 0; }
.alt ul li { padding: 3px 0; }
.alt-son { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--cizgi); font-size: .88rem; }
