/* eTicar · Ev Aksesuarları teması — modern katman
   Yazı tipi Poppins, daha küçük ve dengeli ölçüler, yumuşak köşeler, mobilde 2 sütun. */

/* ---------- Ölçek ve yazı tipi ---------- */
html[data-eti-theme] { font-size: 15px; -webkit-font-smoothing: antialiased; }
@media (max-width: 767px) { html[data-eti-theme] { font-size: 14px; } }
html[data-eti-theme] body,
html[data-eti-theme] button, html[data-eti-theme] input, html[data-eti-theme] select, html[data-eti-theme] textarea,
html[data-eti-theme] .font-sans, html[data-eti-theme] .font-serif, html[data-eti-theme] [class*="font-display"] {
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}
html[data-eti-theme] body { color: #2b2b33; letter-spacing: -0.003em; }
html[data-eti-theme] h1, html[data-eti-theme] h2, html[data-eti-theme] h3 { letter-spacing: -0.02em; }
html[data-eti-theme] .tracking-widest, html[data-eti-theme] .tracking-wider { letter-spacing: .08em !important; }

/* ---------- Kap genişliği ve kenar boşluğu (sağa sola yapışmasın) ---------- */
html[data-eti-theme] .container { max-width: 1200px !important; padding-left: 24px !important; padding-right: 24px !important; }
@media (max-width: 767px) { html[data-eti-theme] .container { padding-left: 18px !important; padding-right: 18px !important; } }

/* ---------- Bölüm boşlukları (çok büyüktü) ---------- */
html[data-eti-theme] main section.py-24 { padding-top: 64px !important; padding-bottom: 64px !important; }
html[data-eti-theme] main .py-12 { padding-top: 36px !important; padding-bottom: 36px !important; }
html[data-eti-theme] main .mb-16 { margin-bottom: 28px !important; }
@media (max-width: 767px) {
  html[data-eti-theme] main section.py-24 { padding-top: 40px !important; padding-bottom: 40px !important; }
  html[data-eti-theme] main .py-12 { padding-top: 24px !important; padding-bottom: 24px !important; }
  html[data-eti-theme] main .mb-16 { margin-bottom: 18px !important; }
  html[data-eti-theme] main .md\:flex-row.justify-between.items-end { align-items: flex-start !important; gap: 10px; }
}

/* ---------- Başlıklar ---------- */
html[data-eti-theme] main h2 { font-size: clamp(22px, 2.3vw, 30px) !important; line-height: 1.2 !important; font-weight: 600 !important; }
html[data-eti-theme] main h2 + p, html[data-eti-theme] main h2 ~ p { font-size: 14px !important; color: #6b6b76 !important; }
html[data-eti-theme] main h3 { font-weight: 600 !important; }

/* ---------- Kahraman (hero) alanı ---------- */
html[data-eti-theme] main > section:first-child { height: 64vh !important; min-height: 440px !important; max-height: 640px; }
html[data-eti-theme] main > section:first-child h1 { font-size: clamp(32px, 4.4vw, 56px) !important; line-height: 1.08 !important; font-weight: 600 !important; }
html[data-eti-theme] main > section:first-child p { font-size: clamp(14px, 1.2vw, 17px) !important; max-width: 520px; }
html[data-eti-theme] main > section:first-child .absolute.inset-0.bg-black\/40 { background: linear-gradient(90deg, rgba(20,16,12,.62) 0%, rgba(20,16,12,.25) 60%, rgba(20,16,12,.1) 100%) !important; }
@media (max-width: 767px) {
  html[data-eti-theme] main > section:first-child { height: auto !important; min-height: 420px !important; padding: 56px 0 !important; }
}

/* ---------- Düğmeler: yumuşak köşe ---------- */
html[data-eti-theme] main a[class*="px-"][class*="py-"], html[data-eti-theme] main button[class*="px-"][class*="py-"],
html[data-eti-theme] form button, html[data-eti-theme] main button.w-full {
  border-radius: 12px !important;
}
html[data-eti-theme] main > section:first-child a { border-radius: 999px !important; padding: 12px 26px !important; font-size: 13px !important; letter-spacing: .04em !important; }
html[data-eti-theme] input[type="email"], html[data-eti-theme] input[type="text"], html[data-eti-theme] input[type="search"],
html[data-eti-theme] input[type="password"], html[data-eti-theme] input[type="tel"], html[data-eti-theme] textarea, html[data-eti-theme] select {
  border-radius: 12px !important;
}

/* ---------- Görseller ve kartlar: yumuşak köşe, hafif gölge ---------- */
html[data-eti-theme] main .grid img.object-cover, html[data-eti-theme] main .snap-x img.object-cover { border-radius: 16px; }
html[data-eti-theme] main .grid > div, html[data-eti-theme] main .grid > a, html[data-eti-theme] main .snap-x > div { border-radius: 16px; }
html[data-eti-theme] main .grid [class*="aspect-"], html[data-eti-theme] main .snap-x [class*="aspect-"],
html[data-eti-theme] main .grid .overflow-hidden, html[data-eti-theme] main .snap-x .overflow-hidden { border-radius: 16px; }
html[data-eti-theme] main .grid > div:hover img.object-cover { transform: scale(1.03); }
html[data-eti-theme] main img.object-cover { transition: transform .5s ease; }
html[data-eti-theme] main .bg-gray-50 .grid > div { background: #fff; border-radius: 18px !important; box-shadow: 0 1px 2px rgba(20,20,30,.05), 0 0 0 1px rgba(20,20,30,.05); }
html[data-eti-theme] main [class*="absolute"][class*="top-"][class*="left-"][class*="bg-"] { border-radius: 999px !important; }
html[data-eti-theme] main .gap-8 { gap: 22px !important; }
@media (max-width: 767px) { html[data-eti-theme] main .gap-8 { gap: 14px !important; } }

/* ---------- Mobil: kategoriler ve ürünler 2 sütun ---------- */
@media (max-width: 767px) {
  /* yalnız kart ızgaraları (3-4 sütunlu olanlar); ürün sayfasındaki görsel+bilgi düzenine dokunulmaz */
  html[data-eti-theme] main .grid.grid-cols-1:is([class*="lg:grid-cols-3"], [class*="lg:grid-cols-4"], [class*="xl:grid-cols-4"]):has(a[href*="/product/"]):not(:has(form, input, textarea, select)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html[data-eti-theme] main .snap-x > * { width: 46vw !important; min-width: 46vw !important; flex-shrink: 0; }
  html[data-eti-theme] main .grid h3, html[data-eti-theme] main .snap-x h3 { font-size: 13px !important; line-height: 1.35 !important; }
  html[data-eti-theme] main .grid p, html[data-eti-theme] main .snap-x p { font-size: 12px !important; }
}

/* ---------- Ürün kartı ayrıntıları ---------- */
/* kalp ve indirim: yumuşak, beyaz/pastel; "sepete ekle": hap biçimli */
html[data-eti-theme] main button.absolute.top-4.right-4 { background: rgba(255,255,255,.92) !important; border-radius: 999px !important; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
html[data-eti-theme] main button.absolute.top-4.right-4 svg { color: #2b2b33 !important; }
html[data-eti-theme] main .absolute.top-4.left-4 > * { border-radius: 999px !important; padding: 3px 10px !important; background: #c2410c !important; color: #fff !important; font-size: 11px !important; letter-spacing: 0 !important; }
html[data-eti-theme] main .absolute.inset-x-4.bottom-4 button { border-radius: 999px !important; letter-spacing: .06em !important; }
html[data-eti-theme] main [class*="tracking-[0.2em]"] { letter-spacing: .06em !important; font-weight: 500 !important; color: #9a8f86 !important; }
html[data-eti-theme] main .group h3 { text-transform: none !important; }
@media (max-width: 767px) {
  html[data-eti-theme] main .absolute.inset-x-4.bottom-4 { left: 10px !important; right: 10px !important; bottom: 10px !important; }
  html[data-eti-theme] main .absolute.inset-x-4.bottom-4 button { padding: 8px 0 !important; font-size: 10.5px !important; background: rgba(17,24,39,.86) !important; }
  html[data-eti-theme] main button.absolute.top-4.right-4 { top: 10px !important; right: 10px !important; width: 32px !important; height: 32px !important; }
  html[data-eti-theme] main .absolute.top-4.left-4 { top: 10px !important; left: 10px !important; }
  html[data-eti-theme] main .flex.justify-between.items-start.gap-4 { flex-direction: column !important; gap: 2px !important; }
  html[data-eti-theme] main .flex.justify-between.items-start.gap-4 > div { align-items: flex-start !important; flex-direction: row !important; gap: 8px !important; }
  html[data-eti-theme] main [class*="aspect-[3/4]"].mb-5 { margin-bottom: 10px !important; }
  /* hero düğmeleri yan yana, küçük */
  html[data-eti-theme] main > section:first-child a { padding: 10px 18px !important; font-size: 11.5px !important; }
  html[data-eti-theme] main > section:first-child .flex-col:has(> a) { flex-direction: row !important; flex-wrap: wrap; gap: 10px !important; }
}

/* kalp düğmesi (tema !bg-gray-900 veriyor): beyaz yuvarlak */
html[data-eti-theme] main .group button.absolute[class*="top-4"][class*="right-4"],
html[data-eti-theme] main .group button.absolute[class*="top-4"][class*="right-4"][class*="bg-"] { background-color: rgba(255,255,255,.94) !important;
  /* temanın !bg-gray-900 kuralı katman önceliğiyle kazanıyor; üstüne beyaz zemin resmi çizilir */
  background-image: linear-gradient(rgba(255,255,255,.95), rgba(255,255,255,.95)) !important; }
html[data-eti-theme] main .group button.absolute[class*="top-4"][class*="right-4"] svg { color: #2b2b33 !important; stroke: #2b2b33 !important; }

/* ---------- Ürün sayfası: yumuşak düğmeler ve kutular ---------- */
html[data-eti-theme] main button:not(.rounded-full):not([class*="rounded-full"]) { border-radius: 12px !important; }
html[data-eti-theme] main .flex.items-center.border:has(> button) { border-radius: 12px !important; overflow: hidden; }
html[data-eti-theme] main .flex.items-center.border:has(> button) > button,
html[data-eti-theme] main div:has(> input[type="number"]) > button, html[data-eti-theme] main div:has(> input[type="number"]) > input { border-radius: 0 !important; }
html[data-eti-theme] main div:has(> input[type="number"]):has(> button) { border-radius: 12px !important; overflow: hidden; }
html[data-eti-theme] main .flex.border-b.overflow-x-auto > button { border-radius: 0 !important; }
html[data-eti-theme] main .flex.border-b.overflow-x-auto { border-radius: 14px 14px 0 0; overflow: hidden; }
html[data-eti-theme] main .border:has(> .flex img), html[data-eti-theme] main [class*="bg-gray-50"]:has(> button img) { border-radius: 16px !important; overflow: hidden; }

/* ---------- Üst bilgi ve menü ---------- */
html[data-eti-theme] header .bg-gray-100 { background: #f6f3ee !important; font-size: 12.5px !important; }
html[data-eti-theme] header nav a { font-size: 14px !important; font-weight: 500 !important; color: #3a3a44 !important; }
html[data-eti-theme] header nav a:hover { color: #000 !important; }

/* ---------- Ürün sayfası ---------- */
html[data-eti-theme] main h1 { font-size: clamp(24px, 2.4vw, 32px) !important; font-weight: 600 !important; line-height: 1.2 !important; }
html[data-eti-theme] main .text-3xl, html[data-eti-theme] main .text-4xl { font-size: clamp(22px, 2.2vw, 28px) !important; }

/* ---------- Alt bilgi ---------- */
html[data-eti-theme] footer { padding-top: 48px !important; }
html[data-eti-theme] footer .gap-12 { gap: 32px !important; }
html[data-eti-theme] footer .mb-12 { margin-bottom: 28px !important; }