/* eTicar · tüm temalar için ortak modern katman (tema dosyasından önce yüklenir)
   Poppins, dengeli ölçek, kenar boşlukları, mobilde 2 sütun kart ızgarası, yumuşak form köşeleri. */
/* Yazı tipi: her tema kendi sektörel yazı tipini korur (ortak katman yazı tipine dokunmaz) */
html[data-eti-theme] { font-size: 15px; -webkit-font-smoothing: antialiased; }
@media (max-width: 767px) { html[data-eti-theme] { font-size: 14px; } }

/* ---------- Bildirimler (sepete eklendi vb.): koyu, yumuşak, modern ---------- */
html[data-eti-theme] [data-sonner-toaster] [data-sonner-toast] {
  background: rgba(20, 20, 26, .94) !important; color: #fff !important; border: 0 !important; border-radius: 16px !important;
  box-shadow: 0 20px 44px -14px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 255, 255, .06) inset !important;
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); padding: 14px 18px 14px 16px !important; gap: 10px !important;
  font-size: 14px !important; font-weight: 500 !important; letter-spacing: -0.005em;
}
html[data-eti-theme] [data-sonner-toast] [data-title] { color: #fff !important; font-weight: 600 !important; }
html[data-eti-theme] [data-sonner-toast] [data-description] { color: rgba(255, 255, 255, .72) !important; }
html[data-eti-theme] [data-sonner-toast] [data-icon] { width: 26px !important; height: 26px !important; border-radius: 999px; display: inline-flex !important; align-items: center; justify-content: center; flex-shrink: 0; }
html[data-eti-theme] [data-sonner-toast][data-type="success"] [data-icon] { background: rgba(74, 222, 128, .16); color: #4ade80 !important; }
html[data-eti-theme] [data-sonner-toast][data-type="error"] [data-icon] { background: rgba(248, 113, 113, .16); color: #f87171 !important; }
html[data-eti-theme] [data-sonner-toast][data-type="info"] [data-icon], html[data-eti-theme] [data-sonner-toast][data-type="warning"] [data-icon] { background: rgba(250, 204, 21, .16); color: #facc15 !important; }
html[data-eti-theme] [data-sonner-toast] [data-icon] svg { width: 16px !important; height: 16px !important; color: inherit !important; fill: currentColor; }
html[data-eti-theme] [data-sonner-toast] [data-close-button] { left: auto !important; right: -7px !important; top: -7px !important; transform: none !important;
  background: #fff !important; color: #111 !important; border: 0 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .25) !important; }
@media (max-width: 767px) { html[data-eti-theme] [data-sonner-toaster] { --offset: 12px !important; } }
html[data-eti-theme] h1, html[data-eti-theme] h2, html[data-eti-theme] h3 { letter-spacing: -0.02em; }

/* Kap: kenarlara yapışmasın, çok geniş ekranda dağılmasın */
/* masaüstünde iç boşluk temada kalır (yarım ekranlık hero kapları kendi boşluğunu kullanır); yalnız çok geniş ekranda daralt */
html[data-eti-theme] .container { max-width: 1200px !important; }
@media (min-width: 768px) and (max-width: 1279px) { html[data-eti-theme] .container { padding-left: max(24px, 2rem) !important; padding-right: max(24px, 2rem) !important; } }
html[data-eti-theme] main [class*="max-w-[1400px]"], html[data-eti-theme] main [class*="max-w-[1600px]"], html[data-eti-theme] main .max-w-7xl, html[data-eti-theme] main .max-w-screen-2xl { max-width: 1200px !important; }
@media (max-width: 767px) { html[data-eti-theme] .container { padding-left: 16px !important; padding-right: 16px !important; } }

/* Başlıklar: dev değil */
html[data-eti-theme] main h2 { font-size: clamp(21px, 2.2vw, 30px) !important; line-height: 1.2 !important; }
html[data-eti-theme] main section:first-child h1 { font-size: clamp(30px, 4.2vw, 54px) !important; line-height: 1.1 !important; }

/* Bölüm boşlukları: masaüstünde 64px, mobilde 40px üstü kırpılır */
html[data-eti-theme] main section.py-24, html[data-eti-theme] main section.py-28, html[data-eti-theme] main section.py-32,
html[data-eti-theme] main section[class*="lg:py-24"], html[data-eti-theme] main section[class*="lg:py-32"] { padding-top: 64px !important; padding-bottom: 64px !important; }
@media (max-width: 767px) {
  html[data-eti-theme] main section.py-24, html[data-eti-theme] main section.py-28, html[data-eti-theme] main section.py-32, html[data-eti-theme] main section.py-20, html[data-eti-theme] main section.py-16,
  html[data-eti-theme] main section[class*="lg:py-24"], html[data-eti-theme] main section[class*="lg:py-32"] { padding-top: 38px !important; padding-bottom: 38px !important; }
  html[data-eti-theme] main .mb-16, html[data-eti-theme] main .mb-12 { margin-bottom: 20px !important; }
}

/* Mobil: kart ızgaraları 2 sütun (ürün sayfasının görsel+bilgi düzenine dokunulmaz) */
@media (max-width: 767px) {
  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"], [class*="lg:grid-cols-5"]) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  html[data-eti-theme] main .grid h3 { font-size: 13.5px !important; line-height: 1.35 !important; }
}

/* Mobil: kategori ızgaraları 2 sütun, dev görseller kısalır, kart üstü yazı kutuları küçülür */
@media (max-width: 767px) {
  /* yalnız içinde başka ızgara olmayan (en içteki) kategori ızgarası */
  html[data-eti-theme] main .grid.grid-cols-1:has(a[href*="category="]):not(:has(.grid)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; grid-auto-rows: auto !important; }
  html[data-eti-theme] main .grid.grid-cols-1:has(a[href*="category="]):not(:has(.grid)) > * { grid-column: auto !important; grid-row: auto !important; }
  html[data-eti-theme] main .grid.grid-cols-1:has(a[href*="category="]) p { font-size: 11.5px !important; line-height: 1.35 !important; }
  html[data-eti-theme] main .grid.grid-cols-1:has(a[href*="category="]) [class*="absolute"][class*="bottom-"] { left: 8px !important; right: 8px !important; bottom: 8px !important; padding: 8px 10px !important; border-radius: 12px !important; }
  html[data-eti-theme] main .grid.grid-cols-1:has(a[href*="category="]) .mb-6 { margin-bottom: 8px !important; }
  /* görselin üstündeki yazı kutusunda dar ekranda yalnız kategori adı kalsın */
  html[data-eti-theme] main .grid.grid-cols-1:has(a[href*="category="]) [class*="absolute"][class*="bottom-"] p:not(:first-child) { display: none !important; }
}

/* ---------- Başlık logosu: her temada dengeli boyut ---------- */
html[data-eti-theme] header a img, html[data-eti-theme] header .flex-shrink-0 img { max-height: 44px !important; width: auto !important; max-width: 190px !important; object-fit: contain !important; }
@media (max-width: 767px) { html[data-eti-theme] header a img, html[data-eti-theme] header .flex-shrink-0 img { max-height: 34px !important; max-width: 150px !important; } }

/* ---------- Mobil çekmece menü ---------- */
html.eti-dr-lock, html.eti-dr-lock body { overflow: hidden !important; }
.eti-dr { position: fixed; inset: 0; z-index: 2147483000; font-family: inherit; }
.eti-dr-bg { position: absolute; inset: 0; background: rgba(12, 12, 16, .45); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; transition: opacity .25s; }
.eti-dr-panel { position: absolute; top: 0; bottom: 0; left: 0; width: min(88vw, 380px); background: #fff; color: #1d1d22; display: flex; flex-direction: column;
  border-radius: 0 22px 22px 0; box-shadow: 20px 0 60px -20px rgba(0, 0, 0, .4); transform: translateX(-104%); transition: transform .28s cubic-bezier(.2, .8, .2, 1); }
.eti-dr.on .eti-dr-bg { opacity: 1; } .eti-dr.on .eti-dr-panel { transform: none; }
.eti-dr-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 10px 20px; }
.eti-dr-logo img { max-height: 34px; max-width: 170px; width: auto; object-fit: contain; display: block; }
.eti-dr-logo strong { font-size: 18px; font-weight: 700; color: #1d1d22; }
.eti-dr-x { width: 40px; height: 40px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: #f3f3f5; color: #1d1d22; border: 0; }
.eti-dr-search { margin: 4px 16px 12px; display: flex; align-items: center; gap: 8px; padding: 0 14px; height: 46px; border-radius: 14px; background: #f3f3f5; color: #6b6b75; }
.eti-dr-search input { flex: 1; min-width: 0; border: 0 !important; outline: 0; background: transparent; font-size: 15px; color: #1d1d22; height: 100%; padding: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
.eti-dr-body { flex: 1; overflow-y: auto; padding: 0 16px 16px; -webkit-overflow-scrolling: touch; }
.eti-dr-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 2px 0 18px; }
.eti-dr-q { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 2px; border-radius: 14px; background: #f7f7f9; font-size: 11.5px; font-weight: 600; color: #34343c; text-decoration: none; text-align: center; }
.eti-dr-q span { position: relative; display: inline-flex; width: 36px; height: 36px; border-radius: 12px; align-items: center; justify-content: center; background: #fff; color: var(--eti-ac, #111); box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.eti-dr-q b { position: absolute; top: -5px; right: -7px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--eti-ac, #111); color: #fff; font-size: 10.5px; line-height: 18px; text-align: center; }
.eti-dr-h { font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8a8a94; margin: 6px 4px 8px; }
.eti-dr-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 18px; }
.eti-dr-row { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 14px; color: #1d1d22; text-decoration: none; font-size: 15px; font-weight: 500; }
.eti-dr-row:active, .eti-dr-row:hover { background: #f5f5f7; }
.eti-dr-row img, .eti-dr-row i { width: 40px; height: 40px; border-radius: 12px; object-fit: cover; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; background: #f3f3f5; color: var(--eti-ac, #111); }
.eti-dr-row span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eti-dr-row > svg { color: #b4b4bd; flex-shrink: 0; }
.eti-dr-all span { font-weight: 600; }
.eti-dr-pages { display: flex; flex-wrap: wrap; gap: 8px; }
.eti-dr-link { padding: 8px 14px; border-radius: 999px; background: #f5f5f7; color: #34343c; font-size: 13.5px; font-weight: 500; text-decoration: none; }
.eti-dr-foot { border-top: 1px solid #eeeef1; padding: 12px 20px calc(14px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 8px; }
.eti-dr-foot a { display: flex; align-items: center; gap: 10px; color: #4a4a54; font-size: 14px; text-decoration: none; }
.eti-dr-foot svg { color: var(--eti-ac, #111); }
@media (prefers-reduced-motion: reduce) { .eti-dr-panel, .eti-dr-bg { transition: none; } }

/* Mahalle kutusu (ilçe seçilince) */
.eti-mh { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.eti-mh label { font-size: 12px; font-weight: 600; color: #4b5563; }
.eti-mh input { height: 44px; padding: 0 14px; border: 1px solid #d9dce3; border-radius: 12px; font-size: 14.5px; background: #fff; width: 100%; }
.eti-mh input:focus { outline: 2px solid rgba(0,0,0,.12); border-color: #9aa0ab; }

/* Formlar */
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; }
