/* Styletics tema (2026-10). Tek stil dosyasi: temel, ust alan, hesap/sepet kartlari, mobil cekmece, alt alan, telefon alt cubugu,
   ana sayfa, cerez bildirimi. Kendi sablonumuzu kullanan sayfalarda (html.stl-ozel) Bootstrap yuklenmez; diger sayfalarda
   (html.stl-std) Bootstrap 3 + varsayilan stil yuklenir, bu yuzden ortak parcalarin kurallari acik ve sinif bazlidir. */

/* ---------- Degiskenler ---------- */
:root {
  --gul: #7d2a4b; --gul-koyu: #5a1e36; --gul-acik: rgba(125, 42, 75, .08);
  --yazi: #2b2429; --soluk: #6c6569; --soluk2: #8a8186; --cizgi: #e6e1e2; --cizgi2: #ece7e9;
  --zemin: #f8f8f8; --zemin2: #f6f6f4; --bant: #f3ecee; --kart: #fff;
  --alt: #46162a; --alt-son: #3a1224;
  --baslik: "Jost", "Futura", "Century Gothic", "Segoe UI", sans-serif;
  --govde: "DM Sans", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --sar: 1280px;
  --cam-zemin: rgba(255, 255, 255, .7);
  --cam-filtre: blur(10px) saturate(1.5);
  --cam-golge: 0 4px 6px rgba(43, 36, 41, .08), 0 0 18px rgba(43, 36, 41, .08), inset 3px 3px 3px rgba(255, 255, 255, .55), inset -3px -3px 3px rgba(255, 255, 255, .55);
  --kart-cam: rgba(255, 255, 255, .9);
  --kart-golge: 0 18px 40px rgba(43, 36, 41, .14), 0 2px 6px rgba(43, 36, 41, .06), inset 2px 2px 2px rgba(255, 255, 255, .6), inset -2px -2px 2px rgba(255, 255, 255, .6);
  /* Simgeler (cizgi, 24x24) */
  --i-ig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='5.5'/%3E%3Ccircle cx='12' cy='12' r='4.2'/%3E%3Ccircle cx='17.4' cy='6.6' r='.6' fill='black'/%3E%3C/svg%3E");
  --i-wa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413z'/%3E%3C/svg%3E");
  --i-kisi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
  --i-araba: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20.5' r='1.3'/%3E%3Ccircle cx='18' cy='20.5' r='1.3'/%3E%3Cpath d='M1.5 2.5h3.2l2.5 12.1a1.8 1.8 0 0 0 1.8 1.4h8.8a1.8 1.8 0 0 0 1.75-1.38L21.8 7H5.6'/%3E%3C/svg%3E");
  --i-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h10'/%3E%3C/svg%3E");
  --i-kapat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  --i-kalp: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1.1L12 21l7.8-7.5 1-1.1a5.5 5.5 0 0 0 0-7.8z'/%3E%3C/svg%3E");
  --i-kalp-dolu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1.1L12 21l7.8-7.5 1-1.1a5.5 5.5 0 0 0 0-7.8z'/%3E%3C/svg%3E");
  --i-ev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5L12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E");
  --i-balon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E");
  --i-soru: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M9.2 9.3a2.9 2.9 0 0 1 5.6 1c0 1.9-2.8 2.6-2.8 2.6M12 16.8h.01'/%3E%3C/svg%3E");
  --i-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
  --i-giris: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpath d='M10 17l5-5-5-5M15 12H3'/%3E%3C/svg%3E");
  --i-uye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='8.5' cy='7' r='4'/%3E%3Cpath d='M20 8v6M23 11h-6'/%3E%3C/svg%3E");
  --i-paket: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5M12 13v8'/%3E%3C/svg%3E");
  --i-cikis: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E");
  --i-geri: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E");
  --i-asagi-kalin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M1.5 8.2 4.4 5.3 12 12.9l7.6-7.6 2.9 2.9L12 18.7z'/%3E%3C/svg%3E");
  --i-menu-j: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M170 214h684v84h-684v-84zM170 640v-86h684v86h-684zM854 384v86h-684v-86h684zM598 726v84h-428v-84h428z'/%3E%3C/svg%3E"); /* Journal "subject" simgesi (mobil menu) */
  --i-bilgi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M512 42.667c-260.267 0-469.333 209.067-469.333 469.333s209.067 469.333 469.333 469.333 469.333-209.067 469.333-469.333-209.067-469.333-469.333-469.333zM512 896c-213.333 0-384-170.667-384-384s170.667-384 384-384c213.333 0 384 170.667 384 384s-170.667 384-384 384z'/%3E%3Cpath d='M512 469.333c-25.6 0-42.667 17.067-42.667 42.667v170.667c0 25.6 17.067 42.667 42.667 42.667s42.667-17.067 42.667-42.667v-170.667c0-25.6-17.067-42.667-42.667-42.667z'/%3E%3Cpath d='M482.133 311.467c-8.533 8.533-12.8 17.067-12.8 29.867s4.267 21.333 12.8 29.867c8.533 8.533 17.067 12.8 29.867 12.8s21.333-4.267 29.867-12.8c8.533-8.533 12.8-17.067 12.8-29.867s-4.267-21.333-12.8-29.867c-17.067-17.067-42.667-17.067-59.733 0z'/%3E%3C/svg%3E");
  --i-ayar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M1024 605.312v-186.624c-91.648-32.683-116.309-34.219-129.152-65.237-12.928-31.104 3.541-49.877 45.184-137.515l-131.968-131.968c-86.443 41.088-106.155 58.197-137.557 45.184-31.019-12.885-32.768-37.931-65.152-129.152h-186.667c-32.597 91.477-34.133 116.267-65.237 129.152-32.085 13.355-51.328-4.267-137.515-45.184l-131.968 131.968c41.685 87.68 58.112 106.368 45.184 137.557-12.885 31.019-37.589 32.597-129.152 65.195v186.667c91.264 32.427 116.267 34.133 129.152 65.195 12.971 31.317-3.456 49.792-45.184 137.515l131.968 131.968c85.291-40.533 105.387-58.581 137.515-45.184 31.061 12.885 32.597 37.547 65.237 129.152h186.624c32.341-90.923 34.091-116.181 65.579-129.323 31.787-13.141 50.603 4.224 137.173 45.312l131.968-131.968c-41.6-87.467-58.112-106.325-45.184-137.515 12.8-30.976 37.547-32.555 129.152-65.195zM816 637.909c-24.619 59.477-2.901 104.875 20.821 152.661l-46.251 46.251c-46.635-23.168-92.203-45.909-152.448-20.907-59.563 24.789-76.373 72.235-93.355 122.752h-65.451c-16.981-50.56-33.749-98.005-93.141-122.667-60.544-25.088-106.965-1.92-152.704 20.821l-46.208-46.251c23.765-47.701 45.483-93.013 20.779-152.747-24.704-59.349-72.149-76.117-122.709-93.099v-65.408c50.56-16.981 98.005-33.749 122.667-93.184 24.661-59.477 2.901-104.917-20.821-152.704l46.251-46.251c46.165 22.955 92.245 45.952 152.747 20.821 59.392-24.619 76.16-72.107 93.141-122.667h65.451c16.981 50.56 33.792 98.005 93.184 122.667 60.544 25.088 106.923 1.92 152.704-20.821l46.251 46.251c-23.723 47.829-45.44 93.312-20.821 152.747 24.619 59.349 72.064 76.117 122.667 93.141v65.451c-50.688 16.981-98.219 33.749-122.752 93.141zM512 384c70.571 0 128 57.429 128 128s-57.429 128-128 128-128-57.429-128-128 57.429-128 128-128zM512 298.667c-117.845 0-213.333 95.488-213.333 213.333s95.488 213.333 213.333 213.333 213.333-95.488 213.333-213.333-95.488-213.333-213.333-213.333z'/%3E%3C/svg%3E");
  --i-tamam: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}

/* Masaustunde canli sitedeki ince gri kaydirma cubugu (Journal: .desktop ::-webkit-scrollbar) */
@media (hover: hover) and (pointer: fine) {
  ::-webkit-scrollbar { width: 10px; height: 10px; }
  ::-webkit-scrollbar-track { background: #eee; }
  ::-webkit-scrollbar-thumb { background: #928b8f; border: 3px solid #eee; border-radius: 10px; }
}

/* ---------- Temel ---------- */
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 110px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--zemin); color: var(--yazi); font-family: var(--govde); font-size: 15px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
/* Sifirlamalar :where() icinde (ozgulluk 0): bilesen kurallarini (logo yuksekligi, dugme yazisi) ezmesinler */
:where(html.stl-ozel) *, :where(html.stl-ozel) *::before, :where(html.stl-ozel) *::after { box-sizing: border-box; }
:where(html.stl-ozel) :where(img, video) { max-width: 100%; height: auto; }
:where(html.stl-ozel) a { color: inherit; }
:where(html.stl-ozel) button { font: inherit; color: inherit; }
.stl-sar { width: 100%; max-width: var(--sar); margin: 0 auto; padding-inline: 20px; box-sizing: border-box; }
@media (min-width: 1321px) { .stl-sar { padding-inline: 0; } }
:focus-visible { outline: 2px solid var(--gul); outline-offset: 3px; }
/* Telefonda basarken cikan gri kutu ve fareyle tiklanan baglantidaki cerceve (Bootstrap a:focus) yok; klavyede :focus-visible kalir */
html { -webkit-tap-highlight-color: transparent; }
a:focus:not(:focus-visible), button:focus:not(:focus-visible), [tabindex]:focus:not(:focus-visible) { outline: none; }
/* Gorseller ve baglantilar basili tutup suruklenemez (eski sitedeki gibi; Firefox icin stl.js dragstart) */
img, a { -webkit-user-drag: none; user-drag: none; }
img { -webkit-user-select: none; user-select: none; }
.stl-atla { position: absolute; left: 12px; top: -60px; z-index: 2000; padding: 10px 16px; border-radius: 999px; background: var(--gul); color: #fff !important; font-weight: 600; text-decoration: none; }
.stl-atla:focus { top: 12px; }
[hidden] { display: none !important; }

/* Ortak dugmeler */
.stl-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 999px; border: 1.5px solid var(--gul); background: var(--gul); color: #fff !important; font: 600 14px/1 var(--govde); text-decoration: none !important; cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease; }
.stl-btn:hover { background: var(--gul-koyu); border-color: var(--gul-koyu); }
.stl-btn-cizgi { background: transparent; color: var(--gul) !important; }
.stl-btn-cizgi:hover { background: var(--gul-acik); border-color: var(--gul); }

/* Maske simgeleri: background currentColor + mask */
.stl-ikon { position: relative; display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--yazi); cursor: pointer; text-decoration: none !important; transition: background .15s ease; }
.stl-ikon::before { content: ""; width: 23px; height: 23px; background: currentColor; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-ikon:hover { background: var(--gul-acik); }
.stl-ikon-ig { --m: var(--i-ig); color: var(--gul); }
.stl-ikon-ig::before { width: 22px; height: 22px; }
.stl-ikon-wa { --m: var(--i-wa); color: #2d9d63; }
.stl-ikon-wa::before { width: 19px; height: 19px; }
.stl-ikon-hesap { --m: var(--i-kisi); }
.stl-ikon-sepet { --m: var(--i-araba); }
.stl-ikon-menu { --m: var(--i-menu); }

/* ---------- Ust serit ---------- */
.stl-serit { background: var(--gul); color: #f1dfe6; text-align: center; }
.stl-serit p { margin: 0; padding: 7.75px 12px; font: 600 13px/19.5px var(--govde); letter-spacing: 0; }

/* ---------- Ust alan: yuzen cam cubuk ---------- */
.stl-baslik { position: sticky; top: 0; z-index: 1000; padding: 12px 0 14px; pointer-events: none; }
.stl-cubuk { pointer-events: auto; position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; width: min(var(--sar), calc(100% - 40px)); height: 64px; margin: 0 auto; padding: 0 22px; border-radius: 18px; box-sizing: border-box; }
/* Cam katman ayri: cubugun kendisinde backdrop-filter olsaydi icindeki acilir kartlar arkayi bulaniklastiramazdi */
.stl-cubuk::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; background: var(--cam-zemin); -webkit-backdrop-filter: var(--cam-filtre); backdrop-filter: var(--cam-filtre); box-shadow: var(--cam-golge); }
.stl-logo { justify-self: start; display: block; line-height: 0; }
.stl-logo img { display: block; width: auto; height: 44px; }
.stl-menu { display: flex; justify-content: center; }
/* Canli sitede hesaplanan deger: Journal'in kurali 4px 0 bosluk ve 1.5 satir yuksekligi veriyor */
.stl-menu a { padding: 4px 0; font: 500 15px/1.5 var(--baslik); letter-spacing: .16em; text-transform: uppercase; color: var(--yazi) !important; text-decoration: none !important; white-space: nowrap;
  background: linear-gradient(var(--gul), var(--gul)) center bottom / 0 1.5px no-repeat; transition: background-size .3s ease, color .2s ease; }
.stl-menu a:hover { color: var(--gul) !important; background-size: 100% 1.5px; }
.stl-simgeler { justify-self: end; display: flex; align-items: center; gap: 6px; }
.stl-ikon-menu { display: none; }

/* Acilir cam kartlar (hesap, sepet): fareyle uzerine gelince / klavye odaginda */
.stl-hesap, .stl-sepet { position: relative; }
.stl-acilir { position: absolute; top: calc(100% + 18px); right: -12px; z-index: 40; padding: 7px; border-radius: 18px; background: var(--kart-cam); -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6); border: 1px solid rgba(255, 255, 255, .7); box-shadow: var(--kart-golge);
  opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s; text-align: left; }
.stl-acilir::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; } /* fare simgeden karta gecerken kapanmasin */
@media (hover: hover) and (min-width: 1024px) {
  .stl-hesap:hover > .stl-acilir, .stl-sepet:hover > .stl-acilir { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
}
.stl-hesap:focus-within > .stl-acilir, .stl-sepet:focus-within > .stl-acilir, .stl-acilir.acik { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.stl-hesap-kart { min-width: 210px; }
.stl-hesap-kart a { display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-radius: 12px; font: 500 12.5px/1.2 var(--baslik); letter-spacing: .14em; text-transform: uppercase; color: var(--yazi) !important; white-space: nowrap; text-decoration: none !important; }
.stl-hesap-kart a:hover, .stl-hesap-kart a:focus-visible { background: var(--gul-acik); color: var(--gul) !important; outline: none; }
.stl-hesap-kart a::before { content: ""; width: 18px; height: 18px; flex: none; background: currentColor; -webkit-mask: var(--k) center / contain no-repeat; mask: var(--k) center / contain no-repeat; }
.stl-hesap-kart hr { margin: 5px 10px; border: 0; border-top: 1px solid rgba(43, 36, 41, .1); }
.stl-hesap-selam { margin: 6px 14px 4px; font-size: 13px; color: var(--soluk); }
.stl-hesap-kart .k-giris { --k: var(--i-giris); }
.stl-hesap-kart .k-uye { --k: var(--i-uye); }
.stl-hesap-kart .k-hesap { --k: var(--i-kisi); }
.stl-hesap-kart .k-siparis { --k: var(--i-paket); }
.stl-hesap-kart .k-favori { --k: var(--i-kalp); }
.stl-hesap-kart .k-cikis { --k: var(--i-cikis); }

/* Sepet */
.stl-sepet-adet { position: absolute; top: 2px; right: 0; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: var(--gul); color: #fff; border: 2px solid #fff; font: 700 10px/13px var(--govde); text-align: center; box-sizing: border-box; }
.stl-sepet-adet.sifir { display: none; }
.stl-sepet-kart { width: 380px; padding: 8px; border-radius: 20px; }
.stl-sepet-liste { list-style: none; margin: 0; padding: 0; max-height: min(60vh, 420px); overflow: auto; }
.stl-sepet-liste li { display: grid; grid-template-columns: 54px 1fr auto 30px; align-items: center; gap: 10px; padding: 8px 4px; }
.stl-sepet-liste li + li { border-top: 1px solid rgba(43, 36, 41, .08); }
.stl-sepet-foto img { display: block; width: 54px; height: 54px; border-radius: 12px; background: #fff; object-fit: cover; box-shadow: 0 0 0 1px rgba(43, 36, 41, .07); }
.stl-sepet-ad { min-width: 0; }
.stl-sepet-ad a, .stl-sepet-ad > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 500 13.5px/1.35 var(--govde); color: var(--yazi) !important; text-decoration: none !important; }
.stl-sepet-ad a:hover { color: var(--gul) !important; }
.stl-sepet-ad small, .stl-sepet-adet-satir { display: block; font-size: 12.5px; color: var(--soluk2); }
.stl-sepet-tutar { font-size: 13.5px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.stl-sepet-sil { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #a39aa0; cursor: pointer; display: grid; place-items: center; }
.stl-sepet-sil::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--i-kapat) center / contain no-repeat; mask: var(--i-kapat) center / contain no-repeat; }
.stl-sepet-sil:hover { background: var(--gul-acik); color: var(--gul); }
.stl-sepet-toplam { width: 100%; margin: 4px 0 12px; border-collapse: collapse; border-top: 1px solid rgba(43, 36, 41, .1); }
.stl-sepet-toplam td { padding: 4px 6px; font-size: 13px; color: var(--soluk); border: 0; }
.stl-sepet-toplam td + td { text-align: right; white-space: nowrap; }
.stl-sepet-toplam tr:first-child td { padding-top: 10px; }
.stl-sepet-toplam tr:last-child td { padding-top: 8px; font-size: 15.5px; font-weight: 700; color: var(--yazi); }
.stl-sepet-dugmeler { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.stl-sepet-kart:has(.stl-sepet-bos) { width: 272px; }
.stl-sepet-bos { display: grid; justify-items: center; gap: 3px; padding: 16px 12px 14px; text-align: center; }
.stl-sepet-bos b { font-size: 15px; font-weight: 600; color: var(--yazi); }
.stl-sepet-bos small { font-size: 13px; color: var(--soluk); }
.stl-sepet-bos-ikon { width: 48px; height: 48px; margin-bottom: 8px; border-radius: 50%; background: var(--gul-acik); display: grid; place-items: center; }
.stl-sepet-bos-ikon::before { content: ""; width: 22px; height: 22px; background: var(--gul); -webkit-mask: var(--i-araba) center / contain no-repeat; mask: var(--i-araba) center / contain no-repeat; }
.stl-sepet.guncellendi .stl-sepet-adet { animation: stlZipla .5s ease; }
@keyframes stlZipla { 40% { transform: scale(1.35); } }

/* Bildirim (sepete / favorilere eklendi) */
.stl-bildirim { position: fixed; left: 16px; right: 16px; bottom: calc(96px + env(safe-area-inset-bottom, 0px)); z-index: 10070; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 10px; width: fit-content; margin-inline: auto; padding: 12px 16px; border-radius: 16px; box-sizing: border-box;
  background: rgba(43, 36, 41, .92); color: #fff; font-size: 14px; box-shadow: 0 12px 30px rgba(43, 36, 41, .25); animation: stlCamAc .2s ease-out; }
.stl-bildirim a { color: #fff !important; font-weight: 700; text-decoration: underline !important; text-underline-offset: 3px; white-space: nowrap; }
@media (min-width: 1024px) { .stl-bildirim { bottom: 28px; } }

/* ---------- Mobil cekmece ---------- */
.stl-cekmece { position: fixed; inset: 0; z-index: 10040; background: rgba(43, 36, 41, .4); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); animation: stlSol .2s ease-out; }
.stl-cekmece-kutu { position: absolute; top: 0; bottom: 0; left: 0; width: min(340px, 86vw); display: flex; flex-direction: column; gap: 18px; padding: 16px 18px 24px; overflow: auto; background: #fff; box-shadow: 12px 0 40px rgba(43, 36, 41, .2); animation: stlKay .22s ease-out; }
.stl-cekmece-ust { display: flex; justify-content: space-between; align-items: center; }
.stl-cekmece-ust img { height: 48px; width: auto; }
.stl-cekmece-kapat { width: 40px; height: 40px; border: 0; border-radius: 50%; background: #f3f0f1; display: grid; place-items: center; cursor: pointer; }
.stl-cekmece-kapat::before { content: ""; width: 18px; height: 18px; background: var(--yazi); -webkit-mask: var(--i-kapat) center / contain no-repeat; mask: var(--i-kapat) center / contain no-repeat; }
.stl-cekmece-menu, .stl-cekmece-hesap { display: grid; }
.stl-cekmece-menu a, .stl-cekmece-hesap a { padding: 13px 4px; border-bottom: 1px solid var(--cizgi2); font-size: 16px; font-weight: 500; color: var(--yazi) !important; text-decoration: none !important; }
.stl-cekmece-menu .stl-cekmece-ana { font: 500 15px/1.4 var(--baslik); letter-spacing: .14em; text-transform: uppercase; color: var(--gul) !important; }
.stl-cekmece-hesap a { font-size: 14.5px; color: var(--soluk) !important; }
.stl-cekmece-sosyal { display: flex; align-items: center; gap: 6px; margin-top: auto; }
.stl-cekmece-tel { margin-left: auto; font-weight: 600; color: var(--gul) !important; text-decoration: none !important; }
html.stl-cekmece-acik body { overflow: hidden; }
@keyframes stlSol { from { opacity: 0; } to { opacity: 1; } }
@keyframes stlKay { from { transform: translateX(-24px); opacity: .6; } to { transform: none; opacity: 1; } }

/* ---------- Telefon ve tablet ust alan ---------- */
@media (max-width: 1023px) {
  .stl-baslik { padding: 0; }
  /* Canli sitedeki Journal mobil basligi: 30px serit (11px), 80px cubuk, 96x60 logo (20px sol bosluk),
     50px menu alani (33px simge) + 65px sepet alani (28px simge) */
  .stl-serit p { padding: 6.75px 12px; font: 400 11px/16.5px var(--govde); letter-spacing: -0.01em; color: #fff; }
  .stl-cubuk { width: 100%; height: 80px; padding: 0 0 0 20px; gap: 0; border-radius: 0; grid-template-columns: 1fr auto; }
  .stl-cubuk::after { background: rgba(255, 255, 255, .86); box-shadow: 0 1px 0 rgba(43, 36, 41, .06); }
  .stl-baslik.kaydi .stl-cubuk::after { background: rgba(252, 250, 250, .72); box-shadow: 0 6px 20px rgba(43, 36, 41, .1); }
  .stl-logo img { height: 60px; }
  .stl-simgeler { gap: 0; }
  .stl-menu, .stl-simgeler > .stl-ikon-ig, .stl-simgeler > .stl-ikon-wa, .stl-hesap { display: none; }
  .stl-ikon-menu { display: inline-grid; order: 2; width: 50px; height: 80px; border-radius: 0; --m: var(--i-menu-j); }
  .stl-ikon-menu::before { width: 33px; height: 33px; }
  .stl-sepet .stl-ikon-sepet { width: 65px; height: 80px; border-radius: 0; }
  .stl-ikon-sepet::before { width: 28px; height: 28px; }
  .stl-ikon-menu:hover, .stl-sepet .stl-ikon-sepet:hover { background: transparent; }
  .stl-sepet .stl-sepet-adet { top: 20px; right: 10px; }
  .stl-sepet { order: 3; }
  .stl-sepet-kart { display: none; } /* telefonda sepet simgesi dogrudan sepet sayfasina gider */
}

/* ---------- Alt alan: urun seridi ---------- */
.stl-urun-serit { background: var(--bant); padding: 30px 0 45px; }
.stl-sekmeler { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 38px; }
.stl-sekmeler button { height: 38px; padding: 0 18px; border: 1.5px solid #c9aeb9; border-radius: 999px; background: #fff; color: var(--yazi); font: 700 14px/1.2 var(--govde); cursor: pointer; white-space: nowrap; }
.stl-sekmeler button:hover { border-color: var(--gul); color: var(--gul); }
.stl-sekmeler button[aria-selected="true"] { background: var(--gul); border-color: var(--gul); color: #fff; }
.stl-minikler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.stl-mini-noktalar { display: none; }
.stl-mini { display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 10px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 16px; }
.stl-mini-foto { flex: none; line-height: 0; }
.stl-mini-foto img { width: 70px; height: 70px; border-radius: 12px; object-fit: contain; background: #fff; }
.stl-mini-bilgi { flex: 1; min-width: 0; display: grid; gap: 2px; }
.stl-mini-ad { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 500 13.5px/1.35 var(--govde); color: var(--yazi) !important; text-decoration: none !important; }
.stl-mini-ad:hover { color: var(--gul) !important; }
.stl-mini-fiyat { font-size: 15px; line-height: 1.35; font-weight: 700; font-variant-numeric: tabular-nums; }
.stl-yildiz { font-size: 13px; line-height: 13px; letter-spacing: 1px; width: max-content; color: transparent; background: linear-gradient(90deg, #b8913e calc(var(--puan, 0) * 20%), #e3dcd5 0); -webkit-background-clip: text; background-clip: text; }
.stl-yorum-yok { font-size: 12px; line-height: 13px; color: var(--soluk2); }
.stl-mini-dugmeler { display: flex; gap: 4px; margin-top: 2px; }
.stl-mini-btn { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--gul); cursor: pointer; display: grid; place-items: center; }
.stl-mini-btn::before { content: ""; width: 17px; height: 17px; background: currentColor; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-mini-btn:hover { background: var(--gul-acik); }
.stl-mini-sepet { --m: var(--i-araba); }
.stl-mini-favori { --m: var(--i-kalp); }
.stl-mini-btn.eklendi { --m: var(--i-tamam); }

/* ---------- Alt alan ---------- */
.stl-alt { background: var(--alt); color: rgba(255, 255, 255, .72); }
/* Canli siteyle ayni izgara: 2-1-1-1 sutun, her sutunda 20px yan + 20px alt bosluk */
.stl-alt-izgara { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 0; padding-block: 40px 20px; }
.stl-alt-izgara > * { padding: 0 20px 20px; min-width: 0; }
.stl-alt-marka p { margin: 0; font-size: 14.5px; line-height: 1.5; }
.stl-alt-marka .stl-alt-ad { margin: 0 0 15px; font: 400 30px/1.1 var(--baslik); letter-spacing: .01em; color: #fff; }
.stl-alt-sosyal { display: flex; gap: 10px; margin-top: 18px; }
.stl-alt-sosyal a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16); transition: background .15s ease; }
.stl-alt-sosyal a:hover { background: rgba(255, 255, 255, .16); }
.stl-alt-sosyal a::before { content: ""; width: 20px; height: 20px; background: #fff; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-alt-sosyal .stl-ikon-ig { --m: var(--i-ig); }
.stl-alt-sosyal .stl-ikon-wa { --m: var(--i-wa); }
.stl-alt h2 { margin: 0 0 14px; padding: 0 0 11.6px; position: relative; font: 500 17px/1.2 var(--baslik); letter-spacing: 0; color: #fff; text-transform: none; }
.stl-alt h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 24px; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .28); }
.stl-alt ul { list-style: none; margin: 0; padding: 0; }
.stl-alt li a { display: inline-block; padding: 4px 0; font: 400 14px/1.5 var(--govde); color: rgba(255, 255, 255, .72) !important; text-decoration: none !important; transition: color .15s ease; }
.stl-alt li a:hover { color: #fff !important; text-decoration: underline !important; text-underline-offset: 3px; }
.stl-alt-son { background: var(--alt-son); }
.stl-alt-son .stl-sar { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding-block: 16px; }
.stl-alt-son p { margin: 0; font-size: 13px; line-height: 1.5; color: rgba(255, 255, 255, .6); }
.stl-odeme { display: flex; align-items: center; gap: 14px; }
/* Odeme logolari canli sitedeki gibi tek renk gri */
.stl-odeme svg { width: 39px; height: 25px; display: block; }
.stl-odeme svg .z { fill: #949494; }
.stl-odeme svg .o { fill: var(--alt-son); }
.stl-odeme img { display: block; width: auto; filter: brightness(0) invert(.58); }
.stl-odeme .stl-odeme-troy { height: 22px; }
.stl-odeme .stl-odeme-paytr { height: 16px; }

/* ---------- Telefon alt cam cubugu + iletisim paneli ---------- */
.stl-alt-cubuk { display: none; }
@media (max-width: 1023px) {
  .stl-alt-cubuk { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 10030; display: flex; height: 50px; padding: 0; border-radius: 22px;
    background: rgba(255, 255, 255, .2); -webkit-backdrop-filter: blur(8px) saturate(1.5) brightness(1.04); backdrop-filter: blur(8px) saturate(1.5) brightness(1.04);
    box-shadow: 0 4px 6px rgba(43, 36, 41, .12), 0 0 16px rgba(43, 36, 41, .1), inset 3px 3px 3px rgba(255, 255, 255, .5), inset -3px -3px 3px rgba(255, 255, 255, .5); box-sizing: border-box; }
  .stl-alt-cubuk > a, .stl-alt-cubuk > button { display: flex; flex: 1 1 auto; flex-direction: column; align-items: center; justify-content: center; padding: 0 10px 4px; border: 0; border-radius: 0; background: transparent; color: var(--yazi) !important; font: 600 10.5px/15.75px var(--govde); text-decoration: none !important; text-shadow: 0 0 10px rgba(255, 255, 255, .9); cursor: pointer; padding: 0; }
  .stl-alt-cubuk > *::before { content: ""; width: 21px; height: 21px; margin-bottom: 2px; background: var(--gul); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
  .stl-alt-cubuk [aria-expanded="true"] { color: var(--gul) !important; }
  .stl-alt-cubuk .ab-ana { --m: var(--i-ev); }
  .stl-alt-cubuk .ab-hesap { --m: var(--i-kisi); }
  .stl-alt-cubuk .ab-iletisim { --m: var(--i-balon); }
  .stl-alt-cubuk .ab-sss { --m: var(--i-soru); }
  /* Cubuk koyu bordo alt alanin ustune gelince (stl.js html'e stl-cam-koyu ekler): koyu cam, beyaz yazi */
  html.stl-cam-koyu .stl-alt-cubuk { background: rgba(255, 255, 255, .08); box-shadow: 0 4px 8px rgba(0, 0, 0, .28), 0 0 16px rgba(0, 0, 0, .2), inset 3px 3px 3px rgba(255, 255, 255, .28), inset -3px -3px 3px rgba(255, 255, 255, .28); }
  html.stl-cam-koyu .stl-alt-cubuk > a, html.stl-cam-koyu .stl-alt-cubuk > button { color: #fff !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .35); }
  html.stl-cam-koyu .stl-alt-cubuk > *::before { background: #fff; }
  /* Yuzen cubugun kapladigi bosluk alt alanin koyu seridinde: sayfa sonunda cubugun arkasi da koyu kalsin (yazilar beyaz) */
  /* canli sitedeki gibi: alt alan bitince yuzen cubuk icin 72px acik zemin (body), koyu seritte 45px */
  .stl-alt-son { padding-bottom: 45px; }
  html:not(.stl-r-product-product):not(.stl-r-checkout-checkout) body { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
  html.stl-r-product-product .stl-alt-son, html.stl-r-checkout-checkout .stl-alt-son { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); } /* yapiskan sepet / odeme cubugu */
}
.stl-iletisim { position: fixed; left: 10px; right: 10px; bottom: calc(80px + env(safe-area-inset-bottom, 0px)); z-index: 10050; display: grid; gap: 6px; padding: 8px; border-radius: 22px;
  background: rgba(252, 249, 250, .86); border: 1px solid rgba(255, 255, 255, .7); -webkit-backdrop-filter: blur(18px) saturate(1.7); backdrop-filter: blur(18px) saturate(1.7);
  box-shadow: 0 16px 40px rgba(43, 36, 41, .22), inset 0 1px 0 rgba(255, 255, 255, .8); animation: stlCamAc .22s ease-out; }
.stl-iletisim a { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: rgba(255, 255, 255, .72); color: var(--yazi) !important; text-decoration: none !important; }
.stl-iletisim b { display: block; font-size: 15px; font-weight: 700; }
.stl-iletisim small { display: block; font-size: 12.5px; color: var(--soluk); margin-top: 1px; }
.stl-il-ikon { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.stl-il-ikon::before { content: ""; width: 20px; height: 20px; background: #fff; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-il-wa .stl-il-ikon { background: #25d366; --m: var(--i-wa); }
.stl-il-tel .stl-il-ikon { background: var(--gul); --m: var(--i-tel); }
@keyframes stlCamAc { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
@media (min-width: 1024px) { .stl-iletisim { display: none !important; } }

@media (max-width: 1023px) {
  .stl-minikler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stl-alt-izgara { grid-template-columns: 1fr 1fr; gap: 26px 32px; padding-block: 36px 30px; }
  .stl-alt-izgara > * { padding: 0; }
  .stl-alt-marka { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  /* Canli sitedeki Journal mobil serit: 20px kenar, iki kart tam gorunur (158px), altta sayfa noktalari */
  .stl-urun-serit { padding: 20px 0; }
  .stl-urun-serit .stl-sar, .stl-alt .stl-sar { padding-inline: 20px; }
  .stl-sekmeler button { height: 36px; padding: 0 15px; font-size: 13.5px; }
  .stl-minikler { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .stl-minikler::-webkit-scrollbar { display: none; }
  .stl-mini { flex: 0 0 calc((100% - 20px) / 2); flex-direction: column; align-items: stretch; gap: 8px; padding: 10px; scroll-snap-align: start; }
  .stl-mini-foto img { width: 100%; height: auto; aspect-ratio: 1; }
  .stl-mini-noktalar { display: flex; justify-content: center; gap: 8px; margin-top: 7px; }
  .stl-mini-noktalar button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: #e2e2e2; cursor: pointer; }
  .stl-mini-noktalar button[aria-current="true"] { background: var(--gul); }
  .stl-mini-noktalar[hidden] { display: none; }
  /* Alt alan: marka tam genislikte, iki sutun (40px ara), "Musteri Hizmetleri" altta tam genislikte; basliklarda cizgi yok */
  .stl-alt-izgara { gap: 42px 40px; padding-block: 40px; }
  .stl-alt-izgara nav:last-child { grid-column: 1 / -1; }
  .stl-alt h2 { padding-bottom: 0; }
  .stl-alt h2::after { display: none; }
  .stl-alt-son .stl-sar { justify-content: center; row-gap: 13px; padding-block: 20px; }
  .stl-alt-son p { flex-basis: 100%; text-align: left; }
}

/* ---------- Ana sayfa ---------- */
.stl-ana { --s-gul: var(--gul); --s-soluk: var(--soluk); font-size: 16px; line-height: 1.6; }
.stl-ana h1, .stl-ana h2, .stl-ana h3 { font-family: var(--baslik); font-weight: 300; line-height: 1.12; letter-spacing: -0.015em; text-wrap: balance; margin: 0; color: var(--yazi); }
.stl-ana p { margin: 0; }
.stl-ana ul { list-style: none; margin: 0; padding: 0; }
.stl-ana figure { margin: 0; }
.stl-ana blockquote { margin: 0; padding: 0; border: 0; }
.stl-ana a { text-decoration: none; }
.stl-ana section { scroll-margin-top: 110px; }
.stl-ana img, .stl-ana video { display: block; }
.stl-ust-etiket { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--gul); font-weight: 700; }
.stl-buton { display: inline-flex; align-items: center; gap: 8px; padding: 14px 24px; border-radius: 999px; font-weight: 700; font-size: 15px; line-height: 1.2; border: 1.5px solid transparent; cursor: pointer; transition: background .15s ease, color .15s ease, transform .15s ease; }
.stl-buton-dolu { background: var(--gul); color: #fff !important; }
.stl-buton-dolu:hover { background: var(--gul-koyu); }
.stl-buton-cizgi { border-color: var(--gul); color: var(--gul) !important; background: transparent; }
.stl-buton-cizgi:hover { background: var(--gul); color: #fff !important; }
.stl-buton:active { transform: translateY(1px); }
.stl-bant { background: var(--bant); box-shadow: 0 0 0 100vmax var(--bant); clip-path: inset(0 -100vmax); }

.stl-acilis { padding-block: 40px 36px; }
.stl-acilis .stl-sar { display: grid; grid-template-columns: 1.02fr 1fr; gap: 56px; align-items: center; }
.stl-acilis-metin { display: grid; gap: 22px; min-width: 0; }
.stl-acilis h1 { font-size: clamp(34px, 4.4vw, 56px); }
.stl-acilis h1 em { font-style: normal; color: var(--gul); }
.stl-giris { font-size: 18px; color: var(--soluk); max-width: 34em; }
.stl-acilis-butonlar { display: flex; gap: 12px; flex-wrap: wrap; }
.stl-acilis-video { position: relative; border-radius: 22px; overflow: hidden; aspect-ratio: 16 / 11; background: #ecebe8; }
.stl-acilis-video video { width: 100%; height: 100%; object-fit: cover; }
.stl-video-etiket { position: absolute; left: 16px; bottom: 16px; border: 0; border-radius: 999px; padding: 8px 14px 8px 10px; font: 600 13px/1.2 var(--govde); display: flex; align-items: center; gap: 8px; cursor: pointer; color: var(--yazi);
  background: rgba(255, 255, 255, .5); -webkit-backdrop-filter: blur(10px) saturate(1.5) brightness(1.05); backdrop-filter: blur(10px) saturate(1.5) brightness(1.05);
  box-shadow: 0 4px 6px rgba(20, 10, 15, .12), 0 0 16px rgba(20, 10, 15, .1), inset 2px 2px 2px rgba(255, 255, 255, .55), inset -2px -2px 2px rgba(255, 255, 255, .55); }
.stl-nokta { width: 22px; height: 22px; border-radius: 50%; background: var(--gul); display: grid; place-items: center; }
.stl-nokta svg { width: 10px; height: 10px; fill: #fff; }
.stl-rozet { position: absolute; right: 16px; top: 16px; color: #fff; border-radius: 14px; padding: 12px 14px 10px; font-size: 12px; line-height: 1.35; width: 214px;
  background: linear-gradient(140deg, rgba(125, 42, 75, .7), rgba(90, 30, 54, .6)); -webkit-backdrop-filter: blur(10px) saturate(1.5); backdrop-filter: blur(10px) saturate(1.5);
  box-shadow: 0 4px 8px rgba(30, 10, 20, .16), 0 0 18px rgba(30, 10, 20, .12), inset 2px 2px 2px rgba(255, 255, 255, .2), inset -2px -2px 2px rgba(255, 255, 255, .2); }
.stl-rozet-dizi { display: grid; overflow: hidden; }
.stl-rozet-dizi p { grid-area: 1 / 1; opacity: 0; transform: translateY(12px); transition: opacity .55s ease, transform .55s ease; }
.stl-rozet-dizi p.aktif { opacity: 1; transform: none; transition-delay: .3s; }
.stl-rozet-dizi p.cikan { opacity: 0; transform: translateY(-12px); transition-duration: .3s; }
.stl-rozet b { display: block; font: 400 20px/1.35 var(--baslik); color: #fff; }
.stl-rozet-noktalar { display: flex; gap: 2px; margin: 3px 0 -6px -3px; }
.stl-rozet-noktalar button { -webkit-appearance: none; appearance: none; display: block; width: 24px; height: 18px; padding: 8px 3px; margin: 0; border: 0; border-radius: 4px; background: rgba(255, 255, 255, .35); background-clip: content-box; cursor: pointer; transition: background-color .3s ease; }
.stl-rozet-noktalar button:hover { background-color: rgba(255, 255, 255, .7); }
.stl-rozet-noktalar button.aktif { background-color: #fff; }
.stl-rozet-noktalar button:focus-visible { outline: 2px solid #fff; outline-offset: 0; }

.stl-guven { padding-block: 8px 48px; }
.stl-guven ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.stl-guven li { display: flex; gap: 12px; align-items: center; background: var(--kart); border-radius: 12px; padding: 14px 16px; border: 1px solid var(--cizgi); }
.stl-guven svg { width: 26px; height: 26px; flex: none; stroke: var(--gul); fill: none; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.stl-guven b { display: block; font-size: 15px; }
.stl-guven small { color: var(--soluk); font-size: 13px; }

.stl-bolum { padding-block: 72px; }
.stl-bolum-bas { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 32px; flex-wrap: wrap; }
.stl-bolum-bas h2, .stl-hikaye-metin h2 { font-size: clamp(28px, 3.4vw, 42px); }
.stl-bolum-bas p { color: var(--soluk); max-width: 30em; }
.stl-bolum-bas p a { color: var(--gul); text-decoration: underline; text-underline-offset: 3px; }

.stl-modeller { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.stl-model { background: var(--kart); border-radius: 22px; padding: 18px; display: grid; gap: 14px; grid-template-rows: auto auto 1fr auto auto; border: 1px solid var(--cizgi); position: relative; }
.stl-model-foto { aspect-ratio: 1; border-radius: 16px; overflow: hidden; background: #fff; display: grid; place-items: start center; }
.stl-model-foto img { width: 92%; height: 92%; object-fit: contain; transition: transform .4s ease; }
.stl-model:hover .stl-model-foto img { transform: scale(1.03); }
.stl-model-rozet { position: absolute; top: 28px; left: 28px; z-index: 1; background: var(--gul); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border-radius: 999px; padding: 5px 10px; }
.stl-model h3 { font-size: 28px; font-weight: 400; }
.stl-kimin { color: var(--soluk); font-size: 15px; margin-top: 4px; }
.stl-ozellikler { display: flex; flex-wrap: wrap; gap: 6px; align-content: start; }
.stl-ozellikler span { font-size: 12.5px; background: var(--zemin2); border-radius: 999px; padding: 5px 10px; font-weight: 500; font-variant-numeric: tabular-nums; }
.stl-model-alt { display: flex; justify-content: space-between; align-items: end; gap: 12px; border-top: 1px solid var(--cizgi); padding-top: 14px; }
.stl-fiyat { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; line-height: 1.3; }
.stl-fiyat small { display: block; font-size: 12px; font-weight: 600; color: var(--gul); letter-spacing: 0; }
.stl-renk-secim { display: grid; justify-items: end; gap: 6px; }
.stl-renk-adi { font-size: 12.5px; line-height: 1.2; color: var(--soluk); }
.stl-renkler { display: flex; gap: 6px; align-items: center; }
.stl-renk { -webkit-appearance: none; appearance: none; width: 22px; height: 22px; padding: 0; margin: 0; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--cizgi); cursor: pointer; transition: box-shadow .15s ease; }
.stl-renk:hover { box-shadow: 0 0 0 1.5px #b98a9d; }
.stl-renk.secili { box-shadow: 0 0 0 2px var(--gul); }
.stl-model-dugmeler { display: grid; grid-template-columns: 1.3fr 1fr; gap: 8px; }
.stl-model .stl-model-dugmeler .stl-buton { justify-content: center; width: 100%; padding: 12px 14px; font-family: var(--govde); font-size: 14px; white-space: nowrap; }
.stl-sepete-ekle { background: var(--gul); border-color: var(--gul); color: #fff; }
.stl-sepete-ekle:hover { background: var(--gul-koyu); border-color: var(--gul-koyu); }
.stl-sepete-ekle::before { content: ""; width: 18px; height: 18px; flex: none; background: currentColor; -webkit-mask: var(--m, var(--i-araba)) center / contain no-repeat; mask: var(--m, var(--i-araba)) center / contain no-repeat; }
.stl-sepete-ekle.eklendi { --m: var(--i-tamam); }
.stl-sepete-ekle.ekleniyor { opacity: .75; cursor: progress; }

.stl-farklar { margin-top: 20px; background: var(--kart); border-radius: 22px; border: 1px solid var(--cizgi); }
.stl-farklar summary { cursor: pointer; list-style: none; padding: 18px 22px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.stl-farklar summary::-webkit-details-marker { display: none; }
.stl-arti { width: 28px; height: 28px; border-radius: 50%; background: var(--zemin2); display: grid; place-items: center; transition: transform .2s; flex: none; }
.stl-farklar[open] .stl-arti { transform: rotate(45deg); }
.stl-tablo-kutu { overflow-x: auto; padding: 0 22px 22px; }
.stl-tablo-kutu table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 14.5px; font-variant-numeric: tabular-nums; }
.stl-tablo-kutu th, .stl-tablo-kutu td { text-align: left; padding: 12px; border-top: 1px solid var(--cizgi); vertical-align: top; }
.stl-tablo-kutu thead th { padding: 11px 12px; font: 400 19px/1.6 var(--baslik); border-top: 0; }
.stl-tablo-kutu tbody th { color: var(--soluk); font-weight: 500; width: 24%; }

.stl-adimlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; counter-reset: stladim; }
.stl-adim { display: grid; gap: 14px; align-content: start; }
.stl-adim-foto { aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; background: var(--kart); }
.stl-adim-foto img { width: 100%; height: 100%; object-fit: cover; }
.stl-adim h3 { font-size: 23px; font-weight: 400; display: flex; gap: 12px; align-items: baseline; }
.stl-adim h3::before { display: inline-grid; counter-increment: stladim; content: counter(stladim); font: 700 13px/1 var(--govde); color: #fff; background: var(--gul); width: 26px; height: 26px; border-radius: 50%; place-items: center; flex: none; transform: translateY(-3px); }
.stl-adim p { color: var(--soluk); }

.stl-galeri { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 300px); gap: 16px; overflow-x: auto; padding-bottom: 12px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.stl-galeri figure { scroll-snap-align: start; display: grid; gap: 10px; }
.stl-kare { position: relative; aspect-ratio: 4 / 5; border-radius: 18px; overflow: hidden; background: var(--kart); }
.stl-kare img { width: 100%; height: 100%; object-fit: cover; }
.stl-galeri figcaption { font-size: 15px; font-weight: 600; }
.stl-galeri figcaption small { display: block; font-weight: 400; color: var(--soluk); font-size: 13.5px; }
.stl-galeri-not { margin-top: 18px; display: inline-flex; gap: 10px; align-items: center; flex-wrap: wrap; background: var(--kart); border: 1px solid var(--cizgi); border-radius: 999px; padding: 10px 16px; font-size: 14px; }
.stl-galeri-not b { color: var(--gul); }
.stl-seviye { position: absolute; left: 10px; top: 10px; display: inline-flex; align-items: flex-end; gap: 3px; padding: 6px 11px 6px 9px; border-radius: 999px; color: var(--yazi); font-size: 11.5px; font-weight: 700; line-height: 1;
  background: rgba(255, 255, 255, .5); -webkit-backdrop-filter: blur(10px) saturate(1.5) brightness(1.05); backdrop-filter: blur(10px) saturate(1.5) brightness(1.05);
  box-shadow: 0 4px 6px rgba(20, 10, 15, .12), 0 0 16px rgba(20, 10, 15, .1), inset 2px 2px 2px rgba(255, 255, 255, .55), inset -2px -2px 2px rgba(255, 255, 255, .55); }
.stl-seviye i { display: inline-block; width: 4px; border-radius: 2px; background: #e6d6dd; }
.stl-seviye i:nth-child(1) { height: 6px; }
.stl-seviye i:nth-child(2) { height: 9px; }
.stl-seviye i:nth-child(3) { height: 12px; margin-right: 5px; }
.stl-seviye[data-seviye="1"] i:nth-child(1), .stl-seviye[data-seviye="2"] i:nth-child(-n+2), .stl-seviye[data-seviye="3"] i { background: var(--gul); }

.stl-hikaye .stl-sar { display: grid; grid-template-columns: 1fr 1.1fr; gap: 56px; align-items: center; }
.stl-hikaye-foto { border-radius: 22px; overflow: hidden; aspect-ratio: 1; }
.stl-hikaye-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.stl-hikaye-metin { display: grid; gap: 18px; min-width: 0; }
.stl-hikaye-metin > p { color: var(--soluk); font-size: 17px; max-width: 34em; }
.stl-hikaye-metin > .stl-alinti, .stl-alinti { font: 300 21px/1.4 var(--baslik); color: var(--yazi) !important; border-left: 2px solid var(--gul); padding-left: 18px; }

.stl-yorumlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.stl-yorum { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 22px; padding: 24px; display: grid; gap: 14px; grid-template-rows: auto 1fr auto; }
.stl-yildiz-metin { color: #a8823a; letter-spacing: 2px; font-size: 15px; }
.stl-yorum blockquote { font-size: 16.5px; line-height: 1.55; }
.stl-yorum footer { font-size: 13.5px; color: var(--soluk); display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.stl-yorum footer b { color: var(--yazi); }

.stl-sss { display: grid; gap: 10px; max-width: 820px; }
.stl-sss details { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; }
.stl-sss summary { cursor: pointer; list-style: none; padding: 18px 20px; font-weight: 700; display: flex; justify-content: space-between; gap: 12px; }
.stl-sss summary::-webkit-details-marker { display: none; }
.stl-sss summary::after { content: "+"; font-size: 22px; line-height: 1; color: var(--gul); transition: transform .2s; }
.stl-sss details[open] summary::after { transform: rotate(45deg); }
.stl-sss details p { padding: 0 20px 18px; color: var(--soluk); max-width: 62ch; }

@media (max-width: 900px) {
  .stl-acilis { padding-block: 16px 24px; }
  .stl-acilis .stl-sar, .stl-hikaye .stl-sar { grid-template-columns: 1fr; gap: 24px; }
  .stl-acilis-video { order: -1; aspect-ratio: 4 / 3.2; }
  .stl-guven ul { grid-template-columns: 1fr 1fr; }
  .stl-modeller, .stl-adimlar, .stl-yorumlar { grid-template-columns: 1fr; }
  .stl-bolum { padding-block: 52px; }
}
@media (max-width: 600px) {
  /* Karsilastirma tablosu: satirlar izgaraya doner (3 model sutunu + tam genislikte ozellik adi), yana kaydirma yok */
  /* canli sitedeki mobil tablo: ozellik adi kucuk, kalin, buyuk harfli gri baslik; model sutunlari arasi 10px */
  .stl-tablo-kutu { padding: 0 16px 16px; }
  .stl-tablo-kutu table { min-width: 0; }
  .stl-tablo-kutu thead tr, .stl-tablo-kutu tbody tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 10px; }
  .stl-tablo-kutu thead th:first-child { display: none; }
  .stl-tablo-kutu tbody th { grid-column: 1 / -1; width: auto; padding: 12px 6px 3px; font-size: 11.5px; font-weight: 700; line-height: 1.6; letter-spacing: .06em; text-transform: uppercase; color: #8a8287; border-top-color: #eee8ea; }
  .stl-tablo-kutu tbody td { border-top: 0; padding: 2px 6px 11px; font-size: 13.5px; line-height: 1.4; overflow-wrap: anywhere; }
  .stl-tablo-kutu thead th { padding: 12px 6px 10px; font-size: 17px; line-height: 1.2; }
}
@media (max-width: 420px) {
  .stl-sar { padding-inline: 16px; }
  .stl-guven li { padding: 12px; gap: 10px; }
  .stl-guven b { font-size: 14px; }
  .stl-rozet { right: 12px; top: 12px; padding: 10px 12px 9px; }
  .stl-rozet b { font-size: 18px; }
}

/* ---------- Urun sayfasi ---------- */
.stl-urun-sayfa { padding: 6px 0 70px; }
.stl-urun-ad { margin: 24px 0 30px; font: 300 clamp(26px, 2.75vw, 38px)/1.15 var(--baslik); letter-spacing: -0.015em; color: #333; text-wrap: balance; }
/* Canli site: iki esit sutun (640 + 640), bilgi sutununda 40px sol bosluk */
.stl-urun-ust { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; align-items: start; }

/* Galeri: solda kucuk gorseller, sagda kaydirilabilir buyuk gorsel */
/* Kucuk gorsel sutunu ana gorselin yuksekliginde (absolute): fazlasi kendi icinde kayar, sayfayi uzatmaz */
.stl-galeri-urun { position: relative; }
.stl-galeri-urun:not([data-adet="1"]) { padding-left: 84px; }
.stl-gu-ana { position: relative; }
.stl-gu-kaydir { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: 22px; border: 1px solid #e6e1e2; background: #fff; }
.stl-gu-kaydir::-webkit-scrollbar { display: none; }
.stl-gu-kare { display: block; aspect-ratio: 1; scroll-snap-align: start; cursor: zoom-in; line-height: 0; }
.stl-gu-kare img { width: 100%; height: 100%; object-fit: contain; }
.stl-urun-rozet { position: absolute; top: 6px; right: 6px; z-index: 1; padding: 4px 10px; border-radius: 999px; background: var(--gul); color: #fff; font-size: 10.5px; line-height: 1; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.stl-gu-noktalar { display: none; }
.stl-gu-kucukler { position: absolute; top: -5px; bottom: 0; left: 0; width: 79px; display: flex; flex-direction: column; gap: 0; overflow-y: auto; scrollbar-width: none; }
.stl-gu-kucukler::-webkit-scrollbar { display: none; }
.stl-gu-kucuk { flex: none; width: 79px; height: 79px; padding: 5px; border: 0; border-radius: 12px; background: transparent; cursor: pointer; }
.stl-gu-kucuk img { width: 100%; height: 100%; object-fit: contain; border: 1px solid #e2e2e2; border-radius: 12px; background: #fff; transition: border-color .15s ease; }
.stl-gu-kucuk:hover img { border-color: #d6c3cb; }
.stl-gu-kucuk.secili img { border-color: var(--gul); }

/* Bilgi kolonu */
.stl-urun-bilgi { display: grid; gap: 0; min-width: 0; padding-left: 40px; padding-bottom: 51px; }
.stl-puan-satir { display: flex; align-items: center; flex-wrap: wrap; margin: 0 0 15px; padding: 10px 0 25px; border-bottom: 1px solid #e2e2e2; font-size: 14px; line-height: 1.5; color: #333; }
.stl-puan-satir a { color: #5a1e36 !important; font-weight: 400; text-decoration: none !important; }
.stl-puan-satir a:hover { text-decoration: underline !important; text-underline-offset: 3px; }
.stl-yildiz-buyuk { margin-right: 5px; font-size: 18px; line-height: 15px; letter-spacing: 3px; } /* canli sitede 5 yildiz 90x15 */
.stl-puan-satir .stl-sekme-ac { margin: 0 2px; }
.stl-puan-satir > span[aria-hidden="true"] { margin: 0 4px; font-weight: 700; } /* canli sitedeki kalin "-" ve bosluklar */
.stl-puan-sayi { color: var(--yazi); }
.stl-yorum-yok-buyuk { color: var(--soluk); }
/* Yorum yoksa (canli site): "Henuz yorum yok ·" + kalin bordo "Ilk yorumu siz yazin" (kalem simgesi, 6px ara) */
.stl-puan-yok { gap: 6px; }
.stl-puan-satir .stl-ilk-yorum { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--gul) !important; }
.stl-ilk-yorum::before { content: ""; display: inline-block; flex: none; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E") center / contain no-repeat; }
.stl-fiyat-blok { display: flex; align-items: flex-start; gap: 26px; flex-wrap: wrap; min-height: 90px; }
.stl-fiyat-sol { padding-right: 0; }
.stl-urun-fiyat { margin: 0; padding-right: 20px; font-size: 30px; font-weight: 700; line-height: 1; letter-spacing: -0.015em; font-variant-numeric: tabular-nums; color: var(--yazi); }
.stl-ozel-fiyat { display: inline-flex; align-items: center; gap: 6px; margin: 8px 0 0; padding: 4px 10px; border-radius: 999px; background: #f3ecee; color: var(--gul); font-size: 13px; line-height: 1.5; font-weight: 600; }
.stl-ozel-fiyat::before { content: ""; width: 11px; height: 13px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4l-7.2 7.2a2 2 0 0 1-2.8 0L2 12V2h10l8.6 8.6a2 2 0 0 1 0 2.8z'/%3E%3Ccircle cx='7' cy='7' r='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4l-7.2 7.2a2 2 0 0 1-2.8 0L2 12V2h10l8.6 8.6a2 2 0 0 1 0 2.8z'/%3E%3Ccircle cx='7' cy='7' r='1.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.stl-urun-durum { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; font-size: 12px; line-height: 18px; color: #4a4247; }
.stl-urun-durum li { display: flex; align-items: center; }
.stl-urun-durum li b { margin-right: 3px; font-weight: 500; color: var(--soluk); }
.stl-urun-durum li::before { content: ""; width: 16px; height: 16px; flex: none; margin-right: 7px; background: var(--gul); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-urun-durum .d-stok { gap: 5px; line-height: 24px; color: #50ad55; font-weight: 700; text-transform: uppercase; }
.stl-urun-durum .d-stok::before { background: #50ad55; --m: var(--i-tamam); }
.stl-urun-durum .d-stok-yok { color: #b3261e; font-weight: 700; }
.stl-urun-durum .d-stok-yok::before { background: #b3261e; --m: var(--i-kapat); }
.stl-urun-durum .d-kod { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4l-7.2 7.2a2 2 0 0 1-2.8 0L2 12V2h10l8.6 8.6a2 2 0 0 1 0 2.8z'/%3E%3Ccircle cx='7' cy='7' r='1.5'/%3E%3C/svg%3E"); }
.stl-urun-durum .d-kargo { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.5h11v9h-11z'/%3E%3Cpath d='M13.5 9.5h4l3 3v3h-7'/%3E%3Ccircle cx='6.5' cy='17' r='1.7'/%3E%3Ccircle cx='17' cy='17' r='1.7'/%3E%3C/svg%3E"); }
.stl-urun-durum .d-taksit { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='5.5' width='19' height='13' rx='2'/%3E%3Cpath d='M2.5 10h19M6.5 15h4'/%3E%3C/svg%3E"); }

.stl-renk-sec { margin: 17px 0 15px; }
.stl-renk-baslik { margin: 0 0 8px; font-size: 13.5px; line-height: 1.5; color: var(--soluk); }
.stl-renk-baslik b { color: var(--yazi); }
.stl-renk-liste { display: flex; flex-wrap: wrap; gap: 8px; }
.stl-renk-secenek { display: inline-flex; align-items: center; gap: 9px; height: 38px; padding: 7px 16px 7px 8px; border: 1px solid #e6e1e2; border-radius: 999px; background: #fff; color: var(--yazi) !important; font-size: 14px; line-height: 1.5; font-weight: 600; text-decoration: none !important; box-sizing: border-box; transition: border-color .15s ease; }
.stl-renk-secenek i { width: 22px; height: 22px; flex: none; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .14); }
.stl-renk-secenek:hover { border-color: #b98a9d; }
.stl-renk-secenek.secili { border-color: var(--gul); box-shadow: inset 0 0 0 1px var(--gul); }

.stl-sepet-form { display: flex; align-items: stretch; gap: 10px; }
.stl-adet { position: relative; display: flex; align-items: stretch; flex: none; width: 60px; height: 45px; border: 1px solid var(--soluk); border-radius: 12px; background: #fff; box-sizing: border-box; overflow: hidden; }
.stl-adet-oklar { display: grid; grid-template-rows: 1fr 1fr; width: 26px; border-left: 1px solid var(--soluk); }
.stl-adet button { width: 100%; height: 100%; padding: 0; border: 0; background: transparent; color: var(--yazi); font-size: 0; cursor: pointer; display: grid; place-items: center; }
.stl-adet button::before { content: ""; width: 10px; height: 10px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.stl-adet .stl-adet-azalt::before { transform: rotate(180deg); }
.stl-adet button:hover { color: var(--gul); }
.stl-adet input { flex: 1; min-width: 0; width: auto; height: 100%; padding: 0 0 0 2px; border: 0; background: transparent; text-align: center; font: 400 15px var(--govde); color: #555; -moz-appearance: textfield; }
.stl-adet input::-webkit-outer-spin-button, .stl-adet input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.stl-sepete-ekle-buyuk { flex: 1; height: 45px; padding: 13px 18px; gap: 5px; font-size: 16px; line-height: 1; font-weight: 700; }
.stl-sepete-ekle-buyuk::before, .stl-ys-ekle::before { content: ""; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--m, var(--i-araba)) center / contain no-repeat; mask: var(--m, var(--i-araba)) center / contain no-repeat; }
.stl-sepete-ekle-buyuk.eklendi, .stl-ys-ekle.eklendi { --m: var(--i-tamam); }
.stl-btn[disabled] { opacity: .55; cursor: not-allowed; }
/* Favori: canli sitedeki gibi sepet satirinin altinda, ust cizgili satirda kirmizi kalpli yazi */
.stl-favori-satir { display: flex; margin: 15px 0 15px; padding-top: 10px; border-top: 1px solid #e2e2e2; }
.stl-favori-satir .stl-favori-btn { display: inline-flex; align-items: center; gap: 5px; width: auto; height: auto; padding: 3px; border: 0; border-radius: 3px; background: transparent; color: var(--soluk); font: 400 12px/1 var(--govde); cursor: pointer; }
.stl-favori-satir .stl-favori-btn::before { width: 17px; height: 17px; background: #dd0e1c; }
.stl-favori-satir .stl-favori-btn:hover { background: transparent; color: var(--gul); }
.stl-favori-btn { flex: none; width: 52px; height: 52px; border: 1.5px solid var(--cizgi); border-radius: 50%; background: #fff; color: var(--gul); cursor: pointer; display: grid; place-items: center; transition: border-color .15s ease, background .15s ease; }
.stl-favori-btn::before { content: ""; width: 21px; height: 21px; background: currentColor; -webkit-mask: var(--i-kalp) center / contain no-repeat; mask: var(--i-kalp) center / contain no-repeat; }
.stl-favori-btn:hover { border-color: var(--gul); background: var(--gul-acik); }
.stl-favori-btn.eklendi::before { -webkit-mask-image: var(--i-kalp-dolu); mask-image: var(--i-kalp-dolu); }
.stl-minimum { margin: -6px 0 0; font-size: 13px; color: var(--soluk); }
.stl-wa-sor { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 14px 0 18px; padding: 10px 14px; border: 1px solid #e6e1e2; border-radius: 999px; background: #fff; color: var(--yazi) !important; font-size: 14px; line-height: 1.5; font-weight: 600; text-decoration: none !important; transition: border-color .15s ease; }
.stl-wa-sor::before { content: ""; width: 19px; height: 19px; background: #2d9d63; -webkit-mask: var(--i-wa) center / contain no-repeat; mask: var(--i-wa) center / contain no-repeat; }
.stl-wa-sor:hover { border-color: #2d9d63; }
.stl-urun-guven { list-style: none; margin: 2px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.stl-urun-guven li { display: grid; grid-template-columns: 26px 1fr; column-gap: 10px; align-items: center; align-content: center; padding: 10px 12px; border: 1px solid #e6e1e2; border-radius: 12px; background: #fff; }
.stl-urun-guven li::before { content: ""; grid-row: 1 / 3; width: 22px; height: 22px; background: var(--gul); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-urun-guven b { font-size: 13px; line-height: 1.35; color: #333; }
.stl-urun-guven small { font-size: 12px; color: #777; line-height: 1.35; }
.stl-urun-guven .g-kargo { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.5h11v9h-11z'/%3E%3Cpath d='M13.5 9.5h4l3 3v3h-7'/%3E%3Ccircle cx='6.5' cy='17' r='1.7'/%3E%3Ccircle cx='17' cy='17' r='1.7'/%3E%3C/svg%3E"); }
.stl-urun-guven .g-taksit { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='5.5' width='19' height='13' rx='2'/%3E%3Cpath d='M2.5 10h19M6.5 15h4'/%3E%3C/svg%3E"); }
.stl-urun-guven .g-garanti { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7.5 3v5.5c0 4.6-3.2 8.3-7.5 9.5-4.3-1.2-7.5-4.9-7.5-9.5V6z'/%3E%3Cpath d='M8.8 12l2.2 2.2 4.4-4.4'/%3E%3C/svg%3E"); }
.stl-urun-guven .g-iade { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12a8 8 0 1 0 2.4-5.7'/%3E%3Cpath d='M4 4v4.5h4.5'/%3E%3C/svg%3E"); }

/* Alt bolumler */
.stl-urun-bolum { margin-top: 30px; }
.stl-urun-bolum > h2 { margin: 0 0 14px; font: 300 clamp(24px, 2.4vw, 32px)/1.1 var(--baslik); letter-spacing: -0.01em; color: #333; }
.stl-urun-video { margin: 0; max-width: 720px; }
.stl-urun-video video { display: block; width: 100%; height: auto; border-radius: 16px; background: #eee; }
.stl-urun-video figcaption { margin-top: 6px; font-size: 13px; line-height: 1.5; color: #666; }

/* Pembe "Bu urun" sutunu ve kutu ici bosluk yeni tasarimda kaliyor (kullanici tercihi: alt koseleri de yuvarlak, kenardan bosluklu) */
.stl-kars-kutu { overflow-x: auto; padding: 8px; background: #fff; border: 1px solid #e6e1e2; border-radius: 22px; }
.stl-karsilastir table { width: 100%; min-width: 640px; border-collapse: separate; border-spacing: 0; font-size: 14.5px; line-height: 1.5; color: var(--soluk); font-variant-numeric: tabular-nums; }
.stl-karsilastir th, .stl-karsilastir td { padding: 12px; text-align: left; vertical-align: top; border-top: 1px solid #eee8ea; }
.stl-karsilastir thead th { padding: 11px 12px; border-top: 0; font: 400 19px/1.5 var(--baslik); color: #333; }
.stl-karsilastir thead th span { display: block; margin-top: 2px; font: 400 12px/1.5 var(--baslik); color: #777; }
.stl-karsilastir thead em { display: inline-block; margin-left: 4px; padding: 2px 8px; border-radius: 999px; background: var(--gul); color: #fff; font: 600 11px/1.5 var(--baslik); font-style: normal; vertical-align: 3px; }
.stl-karsilastir tbody th { width: 22%; padding: 11px 12px; font-weight: 500; color: var(--soluk); }
.stl-karsilastir .aktif { background: #f8eef2; }
.stl-karsilastir thead .aktif { border-radius: 14px 14px 0 0; }
.stl-karsilastir tbody tr:last-child .aktif { border-radius: 0 0 14px 14px; }
.stl-kars-fiyat td { font-weight: 700; font-size: 16px; color: var(--soluk); }
.stl-kars-bag a { display: inline-block; margin: 2px 6px 2px 0; padding: 6px 12px; border: 1px solid var(--gul); border-radius: 999px; color: var(--gul) !important; font-size: 13px; line-height: 1.5; font-weight: 400; text-decoration: none !important; }
.stl-kars-bag a:hover { background: var(--gul); color: #fff !important; }
.stl-kars-not { margin: 8px 0 0; font-size: 13px; line-height: 1.5; color: #666; }

/* Sekmeler */
.stl-sekme-baslik { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 30px; margin-bottom: 19px; border-bottom: 1px solid #ddd; }
.stl-sekme-baslik button { position: relative; padding: 0 0 8px; border: 0; background: transparent; color: var(--soluk); font: 600 15px/1.25 var(--govde); cursor: pointer; }
.stl-sekme-baslik button::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--gul); transform: scaleX(0); transition: transform .2s ease; }
.stl-sekme-baslik button:hover { color: var(--yazi); }
.stl-sekme-baslik button[aria-selected="true"] { color: var(--yazi); }
.stl-sekme-baslik button[aria-selected="true"]::after { transform: none; }
.stl-sekme { max-width: 900px; margin: 0 auto; font-size: 15px; line-height: 1.65; color: #333; }
.stl-sekme.stl-aciklama { max-width: none; }
.stl-aciklama .stl-desc { max-width: 900px; margin: 0 auto 30px; text-align: left; }
.stl-aciklama h2, .stl-aciklama h3 { font-family: var(--baslik); font-weight: 400; line-height: 1.1; color: #333; }
.stl-aciklama h2 { margin: 0 0 12px; font-size: 24px; }
.stl-aciklama h3 { margin: 26px 0 10px; font-size: 18px; }
.stl-aciklama p { margin: 0 0 15px; }
.stl-aciklama ul, .stl-aciklama ol { margin: 0 0 10px; padding-left: 22px; }
.stl-aciklama li { margin-bottom: 6px; }
.stl-aciklama img { max-width: 100%; height: auto; }
.stl-aciklama .stl-desc-imgs img { display: block; width: 100%; max-width: 1000px; height: auto; margin: 0 auto 12px; }
.stl-aciklama table { width: 100%; border-collapse: collapse; margin: 0 0 16px; }
.stl-aciklama .stl-spec { border: 1px solid #e2e2e2; }
.stl-aciklama .stl-spec th, .stl-aciklama .stl-spec td { padding: 9px 12px; border-bottom: 1px solid #eee; text-align: left; vertical-align: top; }
.stl-aciklama .stl-spec th { width: 45%; font-weight: 600; color: #555; background: #fafafa; }
.stl-aciklama .stl-spec td { padding: 12px; color: var(--soluk); background: #fff; }
.stl-aciklama .stl-spec tr:nth-child(even) td { background: #fafafa; }
.stl-ozellik-tablo { width: 100%; border-collapse: collapse; font-size: 14px; }
.stl-ozellik-tablo th { padding: 18px 0 8px; text-align: left; font: 400 19px/1.3 var(--baslik); color: var(--yazi); }
.stl-ozellik-tablo tbody:first-child th { padding-top: 0; }
.stl-ozellik-tablo td { padding: 9px 12px 9px 0; border-top: 1px solid var(--cizgi2); vertical-align: top; }
.stl-ozellik-tablo td:first-child { width: 38%; color: var(--soluk); }

/* Yorumlar */
.stl-yorum-kartlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.stl-yorum-kart { padding: 18px 20px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; }
.stl-yk-ust { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
.stl-yk-tarih { font-size: 12.5px; color: var(--soluk2); }
.stl-yorum-kart p { margin: 0 0 8px; }
.stl-yk-yazar { font-size: 13.5px; color: var(--yazi); }
.stl-yorum-bos { margin: 0; padding: 18px 20px; border-radius: 18px; background: #fff; border: 1px dashed #dccdd3; color: var(--soluk); }
.stl-sayfalama .pagination { display: flex; gap: 6px; list-style: none; margin: 14px 0 0; padding: 0; }
.stl-sayfalama .pagination a, .stl-sayfalama .pagination span { display: grid; place-items: center; min-width: 36px; height: 36px; padding: 0 10px; border: 1.5px solid var(--cizgi); border-radius: 999px; color: var(--yazi) !important; text-decoration: none !important; font-size: 14px; }
.stl-sayfalama .pagination .active span { background: var(--gul); border-color: var(--gul); color: #fff !important; }
.stl-yorum-yaz { margin-top: 26px; padding: 22px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 20px; scroll-margin-top: 110px; }
.stl-yorum-yaz h3 { margin: 0 0 14px; font: 400 21px/1.3 var(--baslik); color: var(--yazi); }
.stl-yorum-yaz form { display: grid; gap: 14px; }
.stl-puan-sec { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: 2px; margin: 0; padding: 0; border: 0; }
.stl-puan-sec legend { float: left; width: 100%; margin-bottom: 4px; font-size: 13.5px; font-weight: 600; color: var(--yazi); }
.stl-puan-sec input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.stl-puan-sec label { font-size: 28px; line-height: 1; color: #e3dcd5; cursor: pointer; transition: color .1s ease; }
.stl-puan-sec label:hover, .stl-puan-sec label:hover ~ label, .stl-puan-sec input:checked ~ label { color: #b8913e; }
.stl-puan-sec input:focus-visible + label { outline: 2px solid var(--gul); outline-offset: 2px; border-radius: 4px; }
.stl-alan { display: grid; gap: 6px; }
.stl-alan span { font-size: 13.5px; font-weight: 600; color: var(--yazi); }
.stl-alan input, .stl-alan textarea { width: 100%; padding: 12px 14px; border: 1.5px solid var(--cizgi); border-radius: 14px; background: #fff; font: 15px/1.5 var(--govde); color: var(--yazi); box-sizing: border-box; }
.stl-alan input:focus, .stl-alan textarea:focus { outline: none; border-color: var(--gul); box-shadow: 0 0 0 3px rgba(125, 42, 75, .12); }
.stl-alan small { font-size: 12.5px; color: var(--soluk2); }
.stl-yorum-mesaj { margin: 0; padding: 10px 14px; border-radius: 12px; background: #eef7f1; color: #1f6b42; font-size: 14px; }
.stl-yorum-mesaj.hata { background: #fbeaea; color: #9c2a22; }
.stl-yorum-yaz .stl-btn { justify-self: start; padding: 0 24px; }
.stl-yorum-giris { margin: 0; color: var(--soluk); }
.stl-yorum-giris a { color: var(--gul) !important; font-weight: 600; }
#paytr_taksit_tablosu { margin-top: 14px; min-height: 40px; overflow-x: auto; }

/* Buyuk gorsel penceresi */
.stl-buyutec { width: min(94vw, 1000px); max-width: none; max-height: 94vh; padding: 0; border: 0; border-radius: 22px; background: #fff; overflow: hidden; }
.stl-buyutec::backdrop { background: rgba(43, 36, 41, .7); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.stl-buyutec img { display: block; width: 100%; height: auto; max-height: 94vh; object-fit: contain; }
.stl-buyutec button { position: absolute; z-index: 1; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); box-shadow: 0 4px 14px rgba(43, 36, 41, .15); cursor: pointer; display: grid; place-items: center; }
.stl-buyutec button::before { content: ""; width: 20px; height: 20px; background: var(--yazi); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-bu-kapat { top: 12px; right: 12px; --m: var(--i-kapat); }
.stl-bu-onceki, .stl-bu-sonraki { top: 50%; margin-top: -22px; }
.stl-bu-onceki { left: 12px; --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E"); }
.stl-bu-sonraki { right: 12px; --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E"); }
.stl-bu-sayac { position: absolute; left: 50%; bottom: 12px; margin: 0; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .9); font-size: 12.5px; transform: translateX(-50%); }
.stl-buyutec.tek .stl-bu-onceki, .stl-buyutec.tek .stl-bu-sonraki, .stl-buyutec.tek .stl-bu-sayac { display: none; }

/* Yapiskan sepet cubugu (telefon): urun sayfasinda alt menunun yerini alir */
.stl-yapiskan-sepet { display: none; }
@media (max-width: 1023px) {
  html.stl-r-product-product .stl-alt-cubuk { display: none; }
  .stl-yapiskan-sepet { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 10030; display: flex; align-items: center; gap: 5px; height: 56px; padding: 10px; border-radius: 22px; box-sizing: border-box;
    background: rgba(255, 255, 255, .2); -webkit-backdrop-filter: blur(8px) saturate(1.5) brightness(1.04); backdrop-filter: blur(8px) saturate(1.5) brightness(1.04);
    box-shadow: 0 4px 6px rgba(43, 36, 41, .12), 0 0 16px rgba(43, 36, 41, .1), inset 3px 3px 3px rgba(255, 255, 255, .5), inset -3px -3px 3px rgba(255, 255, 255, .5); }
  .stl-ys-adet { height: 36px; }
  .stl-ys-adet input { font-size: 16px; }
  .stl-ys-adet .stl-adet-oklar button { background: #eee; }
  .stl-ys-ekle { flex: none; height: 36px; padding: 0 18px; gap: 4px; font-size: 16px; line-height: 1; font-weight: 700; }
  .stl-yapiskan-sepet .stl-favori-btn { width: 34px; height: 36px; margin-left: auto; padding: 7px; border: 0; border-radius: 3px; background: transparent; color: #dd0e1c; }
  .stl-yapiskan-sepet .stl-favori-btn::before { width: 20px; height: 20px; }
  /* Canli sitedeki Journal mobil urun sayfasi: 20px kenar, 28px baslik, puan > ozellik listesi > 30px fiyat, sayfa ici sepet satiri yok */
  .stl-urun-sayfa .stl-sar { padding-inline: 20px; }
  .stl-urun-sayfa { padding-top: 0; }
  .stl-urun-ad { margin: 30px 0 20px; font-size: 28px; line-height: 1.15; }
  .stl-urun-ust { gap: 0; }
  .stl-urun-bilgi { padding: 0 0 51px; }
  .stl-gu-noktalar { position: absolute; left: 0; right: 0; bottom: 10px; margin: 0; }
  .stl-puan-satir { padding-top: 20px; }
  .stl-puan-satir a { text-decoration: underline !important; }
  .stl-fiyat-blok { flex-direction: column-reverse; flex-wrap: nowrap; align-items: stretch; gap: 0; min-height: 0; }
  .stl-fiyat-blok .stl-urun-durum { margin-bottom: 20px; padding-bottom: 23px; border-bottom: 1px solid #e2e2e2; }
  .stl-urun-fiyat { font-size: 30px; }
  .stl-sepet-form, .stl-favori-satir { display: none; }
  /* Sekmeler akordeon (stl.js basliklari iceriklerin ustune tasir): acik olan bordo */
  .akordeon .stl-sekme-baslik { display: none; }
  .akordeon > button[aria-controls] { display: flex; align-items: center; width: 100%; padding: 15px 5px 15px 0; border: 0; border-top: 1px solid #e2e2e2; background: transparent; color: var(--soluk); font: 400 14px/15.4px var(--baslik); text-align: left; cursor: pointer; }
  .akordeon > button[aria-selected="true"] { color: var(--gul); }
  .akordeon > .stl-sekme { padding-bottom: 20px; }
  html.stl-r-product-product .stl-bildirim { bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  html.stl-r-product-product #stl-cerez { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .stl-yapiskan-sepet { background: #fbf9fa !important; } }

@media (max-width: 1023px) {
  .stl-urun-ust { grid-template-columns: 1fr; gap: 0; }
  .stl-galeri-urun:not([data-adet="1"]) { padding-left: 0; }
  .stl-gu-kucukler { display: none; }
  .stl-gu-noktalar { display: flex; justify-content: center; gap: 6px; }
  .stl-gu-noktalar i { width: 7px; height: 7px; border-radius: 50%; background: #dccdd3; transition: background .2s ease, width .2s ease; }
  .stl-gu-noktalar i.aktif { width: 18px; border-radius: 4px; background: var(--gul); }
  .stl-urun-bolum { margin-top: 30px; }
}
@media (max-width: 600px) {
  .stl-fiyat-sol { padding-right: 0; border-right: 0; flex: 1 1 100%; }
  .stl-aciklama .stl-spec td { font-size: 13px; } /* canli sitede telefonda ozellik tablosu degerleri 13px */
  .stl-sekme-baslik { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; gap: 20px; scrollbar-width: none; }
  .stl-sekme-baslik button { white-space: nowrap; }
  .stl-yorum-yaz { padding: 18px; }
  /* Karsilastirma: telefonda satirlar izgara (3 model + tam genislikte ozellik adi) */
  /* canli sitedeki mobil tablo: kucuk, kalin, buyuk harfli gri ozellik adi; model sutunlari arasi 10px */
  .stl-kars-kutu { padding: 8px; }
  .stl-karsilastir table { min-width: 0; }
  .stl-karsilastir thead tr, .stl-karsilastir tbody tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 10px; }
  .stl-karsilastir thead th:first-child { display: none; }
  .stl-karsilastir tbody th { grid-column: 1 / -1; width: auto; padding: 12px 6px 3px; font-size: 11.5px; font-weight: 700; line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: #8a8287; border-top-color: #eee8ea; }
  .stl-karsilastir tbody td { border-top: 0; padding: 2px 6px 11px; font-size: 13.5px; line-height: 1.4; overflow-wrap: anywhere; }
  .stl-karsilastir .stl-kars-fiyat td { font-size: 15px; }
  .stl-karsilastir thead th { padding: 12px 6px 10px; font-size: 17px; line-height: 1.2; }
  .stl-karsilastir thead th span { line-height: 1.2; }
  .stl-karsilastir thead em { display: block; width: max-content; margin: 2px 0 0; line-height: 1.2; }
  .stl-karsilastir .stl-kars-bag td { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
  .stl-karsilastir .stl-kars-bag a { margin: 0; padding: 5px 10px; font-size: 12.5px; line-height: 1.4; }
  .stl-karsilastir .aktif { border-radius: 0; }
}

/* ---------- Ortak sayfa basligi (canli site: Jost 300 38px, #333, ust/alt 30px) ---------- */
.stl-sayfa-baslik { margin: 24px 0 30px; font: 300 clamp(28px, 3vw, 38px)/1.15 var(--baslik); letter-spacing: -0.015em; color: #333; }
.stl-sayfa-giris { margin: -6px 0 26px; max-width: 46em; font-size: 16px; color: var(--soluk); }
.stl-gizli { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Aciklama metni (urun + kategori aciklamalarindaki .stl-desc; canli sitedeki kurallar) ---------- */
.stl-desc { max-width: 900px; margin: 0 auto 30px; font-size: 15px; line-height: 1.65; color: #333; text-align: left; }
.stl-desc h2 { margin: 0 0 12px; font: 400 24px/1.1 var(--baslik); color: #333; }
.stl-desc h3 { margin: 26px 0 10px; font: 400 18px/1.1 var(--baslik); color: #333; }
.stl-desc p { margin: 0 0 15px; }
.stl-desc ul, .stl-desc ol { margin: 0 0 10px; padding-left: 22px; }
.stl-desc li { margin-bottom: 6px; }

/* ---------- Urun listeleri (kategori, arama): canli sitedeki Journal karti ---------- */
.stl-liste-sayfa { padding: 6px 0 52px; }
.stl-liste-aciklama { margin: 49px 0 0; }
/* Katli aciklama (canli sitedeki Journal "expand" blogu): 80px, altta 40px'lik solma + ortada kucuk bordo dugme */
.stl-katla { position: relative; max-height: 80px; overflow: hidden; }
.stl-katla.acik { max-height: none; overflow: visible; }
.stl-katla-perde { position: absolute; left: 0; right: 0; bottom: 0; height: 40px; display: flex; justify-content: center; align-items: flex-end; background: linear-gradient(rgba(248, 248, 248, 0), var(--zemin)); }
.stl-katla.acik .stl-katla-perde { position: static; height: auto; background: none; }
.stl-katla-btn { display: flex; align-items: center; gap: 5px; height: 20px; padding: 2px 6px; border: 0; border-radius: 3px; background: var(--gul); color: #fff; font: 400 12px/12px var(--govde); cursor: pointer; }
.stl-katla-btn::before { content: ""; width: 12px; height: 12px; background: currentColor; -webkit-mask: var(--i-asagi-kalin) center / contain no-repeat; mask: var(--i-asagi-kalin) center / contain no-repeat; transition: transform .2s ease; }
.stl-katla.acik .stl-katla-btn::before { transform: rotate(180deg); }
.stl-katla-btn:hover { background: var(--gul-koyu); }
.stl-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding-top: 20px; } /* basligin 30px alt boslugunun ustune (marj birlesmesin diye dolgu) */
.stl-kart { position: relative; display: flex; flex-direction: column; padding: 12px; background: #fff; border: 1px solid #e6e1e2; border-radius: 22px; transition: box-shadow .2s ease; }
.stl-kart:hover { box-shadow: 0 12px 30px rgba(43, 36, 41, .08); }
.stl-kart-foto { position: relative; display: block; aspect-ratio: 1; border-radius: 16px; overflow: hidden; line-height: 0; }
.stl-kart-foto img { width: 100%; height: 100%; object-fit: contain; transition: transform .4s ease; }
.stl-kart:hover .stl-kart-foto img { transform: scale(1.03); }
.stl-kart-foto .stl-urun-rozet { top: 5px; right: 5px; }
/* Puan: yildizlar gorselin alt kenarina binerek ortada; yorum yoksa gorselin hemen altinda soluk yazi */
.stl-kart-puan { position: relative; height: 0; text-align: center; }
.stl-kart-puan .stl-yildiz { position: absolute; left: 50%; bottom: 3px; padding: 5px; margin: 0; transform: translateX(-50%); font-size: 14px; line-height: 13px; letter-spacing: 4px; }
.stl-kart-puan .stl-yorum-yok { position: absolute; left: 0; right: 0; top: 0; font-size: 12px; line-height: 13px; color: var(--soluk2); }
.stl-kart-ad { margin: 15px 0 0; padding-left: 10px; font: 400 16px/1.3 var(--baslik); letter-spacing: 0; }
.stl-kart-ad a { color: var(--yazi) !important; text-decoration: none !important; }
.stl-kart-ad a:hover { color: var(--gul) !important; }
.stl-kart-ad a::after { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; } /* tum kart tiklanir */
/* Canli sitedeki gibi: 16px/24px satir icinde 19px fiyat kutusu, altinda 3px bosluklu "Sitemize ozel fiyat" */
.stl-kart-fiyat { flex: 1; margin: 5px 0 15px; padding-left: 10px; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; color: var(--yazi); }
.stl-kart-fiyat > span { display: inline-flex; font-size: 19px; line-height: 19px; letter-spacing: -0.01em; }
.stl-kart-fiyat small { display: block; margin-top: 3px; font-size: 11px; line-height: 1; font-weight: 600; color: var(--gul); }
.stl-kart-dugmeler { position: relative; z-index: 1; display: flex; align-items: center; gap: 5px; padding: 0 0 15px 10px; }
.stl-kart-adet { width: 50px; height: 33px; border-color: #e2e2e2; border-radius: 10px; }
.stl-kart-adet .stl-adet-oklar { width: 20px; border-left-color: #e2e2e2; }
.stl-kart-adet input { font-size: 13px; }
.stl-kart-adet button::before { width: 8px; height: 8px; }
.stl-kart-sepet { height: 40px; padding: 10px 16px; gap: 3.4px; border: 0; font-size: 14px; line-height: 1; font-weight: 700; }
.stl-kart-sepet::before { content: ""; width: 17px; height: 17px; background: currentColor; -webkit-mask: var(--m, var(--i-araba)) center / contain no-repeat; mask: var(--m, var(--i-araba)) center / contain no-repeat; }
.stl-kart-sepet.eklendi { --m: var(--i-tamam); }
.stl-kart .stl-favori-btn { width: 30px; height: 26px; margin-left: auto; padding: 3px; border: 0; border-radius: 3px; background: transparent; color: #928b8f; }
.stl-kart .stl-favori-btn::before { width: 20px; height: 20px; }
.stl-kart .stl-favori-btn:hover { background: transparent; color: var(--gul); }
.stl-liste-sonuc-alt { margin: 20px 0 0; font-size: 13px; line-height: 1.5; letter-spacing: 1px; color: #333; }
.stl-bos-liste { padding: 22px; border: 1px dashed #dccdd3; border-radius: 18px; background: #fff; color: var(--soluk); }
.stl-bos-liste a { color: var(--gul) !important; font-weight: 600; }
/* Arama sayfasi: canli sitedeki (Journal) arama kriterleri formu + arac cubugu + tablo/liste gorunumu */
.stl-arama-satir { display: flex; align-items: center; gap: 20px; margin-bottom: 10px; }
.stl-arama-satir input, .stl-arama-satir select { box-sizing: border-box; height: 38px; padding: 6px 12px; border: 1px solid #e2e2e2; border-radius: 3px; background-color: #fff; color: #555; font: 400 14px/18.2px var(--govde); }
.stl-arama-satir input { flex: 1; min-width: 0; }
.stl-arama-satir select { flex: none; width: 40%; height: 34px; }
.stl-arama-satir input:focus, .stl-arama-satir select:focus { border-color: var(--gul); outline: 0; }
.stl-arama-sec { display: flex; align-items: center; gap: 7px; width: max-content; font-size: 14px; line-height: 21px; color: #333; cursor: pointer; }
.stl-arama-sec input { width: 13px; height: 13px; margin: 0; accent-color: var(--gul); }
.stl-arama-btn { display: block; width: 100%; height: 39px; margin-top: 20px; padding: 13px 18px; border: 0; border-radius: 3px; background: var(--gul); color: #fff; font: 400 13px/13px var(--govde); text-transform: uppercase; cursor: pointer; }
.stl-arama-btn:hover { background: var(--gul-koyu); }
.stl-arama-alt-baslik { margin: 15px 0; font: 400 17px/20.4px var(--baslik); color: #333; }
.stl-arama-alt-baslik::after { content: ""; display: block; width: 50px; height: 1px; margin-top: 10px; background: var(--gul); }
.stl-arama-bos { margin: 0; font-size: 14px; color: #333; }
.stl-arama-sayfa { padding-bottom: 20px; }
.stl-arama-sayfa .stl-kartlar:not(.liste) { padding-top: 10px; }
.stl-arac { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; padding: 15px 0; border-block: 1px solid #e2e2e2; }
.stl-gorunum { display: flex; align-items: center; height: 27px; }
.stl-gorunum-btn { display: block; padding: 0; border: 0; background: #333; cursor: pointer; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-gorunum-btn:hover, .stl-gorunum-btn[aria-pressed="true"]:hover { background: var(--gul); }
.stl-gorunum-btn.g-tablo { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 819 1024'%3E%3Cpath d='M103.813 304.364v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M103.813 615.818v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M103.813 927.272v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M409.5 304.364v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M409.5 615.818v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M409.5 927.272v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M715.187 304.364v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M715.187 615.818v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3Cpath d='M715.187 927.272v0c-57.677 0-103.818-46.141-103.818-103.818v0c0-57.677 46.141-103.818 103.818-103.818v0c57.677 0 103.818 46.141 103.818 103.818v0c0 57.677-46.141 103.818-103.818 103.818z'/%3E%3C/svg%3E"); width: 14.4px; height: 18px; }
.stl-gorunum-btn.g-liste { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1008 1024'%3E%3Cpath d='M94.494 732.504c-50.4 0-94.501 44.101-94.501 94.501s44.101 94.501 94.501 94.501 94.501-44.101 94.501-94.501-44.101-94.501-94.501-94.501zM314.997 890.006h693.011v-126.002h-693.011v126.002zM94.494 417.499c-50.4 0-94.501 44.101-94.501 94.501s44.101 94.501 94.501 94.501 94.501-44.101 94.501-94.501-44.101-94.501-94.501-94.501zM314.997 575.001h693.011v-126.002h-693.011v126.002zM94.494 102.494c-50.4 0-94.501 44.101-94.501 94.501s44.101 94.501 94.501 94.501 94.501-44.101 94.501-94.501-44.101-94.501-94.501-94.501zM314.997 133.995v126.002h693.011v-126.002h-693.011z'/%3E%3C/svg%3E"); width: 18.7px; height: 19px; margin-left: 10px; }
.stl-arac-karsilastir { display: flex; align-items: center; gap: 5px; margin-left: 10px; padding-left: 15px; font-size: 14px; line-height: 27px; color: var(--gul-koyu) !important; text-decoration: none !important; }
.stl-arac-karsilastir::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M512 0c-282.581 0-512 229.419-512 512s229.419 512 512 512c282.581 0 512-229.419 512-512s-229.419-512-512-512zM512 85.333c235.477 0 426.667 191.189 426.667 426.667s-191.189 426.667-426.667 426.667-426.667-191.189-426.667-426.667 191.189-426.667 426.667-426.667zM597.333 597.333h-384v85.333h384v128l213.333-170.667-213.333-170.667v128zM426.667 341.333h384v85.333h-384v128l-213.333-170.667 213.333-170.667v128z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M512 0c-282.581 0-512 229.419-512 512s229.419 512 512 512c282.581 0 512-229.419 512-512s-229.419-512-512-512zM512 85.333c235.477 0 426.667 191.189 426.667 426.667s-191.189 426.667-426.667 426.667-426.667-191.189-426.667-426.667 191.189-426.667 426.667-426.667zM597.333 597.333h-384v85.333h384v128l213.333-170.667-213.333-170.667v128zM426.667 341.333h384v85.333h-384v128l-213.333-170.667 213.333-170.667v128z'/%3E%3C/svg%3E") center / contain no-repeat; }
.stl-arac-karsilastir:hover { color: var(--gul) !important; }
.stl-arac-secim { display: flex; gap: 10px; margin-left: auto; }
.stl-arac-kutu { display: flex; height: 26px; }
.stl-arac-kutu span { display: flex; align-items: center; padding: 5px 10px; border-radius: 3px 0 0 3px; background: #eee; color: #555; font-size: 12px; line-height: 18px; }
.stl-arac-kutu select { height: 26px; padding: 0; border: 1px solid #e2e2e2; border-radius: 0 3px 3px 0; background-color: #fff; color: #555; font: 400 12px var(--govde); }
.stl-kart-aciklama { display: none; }
/* Liste gorunumu: solda gorsel, sagda ad, kisa aciklama, fiyat ve dugmeler; urunler arasinda cizgi */
@media all {
  .stl-kartlar.liste { display: block; padding-top: 0; }
  .stl-kartlar.liste .stl-kart { display: grid; grid-template-columns: 27.5% minmax(0, 1fr); grid-template-rows: auto auto auto auto 1fr; column-gap: 20px; margin-bottom: 25px; padding: 0 0 25px; border: 0; border-bottom: 1px solid #e2e2e2; border-radius: 0; background: none; box-shadow: none; }
  .stl-kartlar.liste .stl-kart-foto { grid-row: 1 / 6; box-sizing: border-box; border: 1px solid #e2e2e2; border-radius: 0; }
  .stl-kartlar.liste .stl-kart-foto img { border-radius: 5px; }
  .stl-kartlar.liste .stl-kart:hover .stl-kart-foto img { transform: none; }
  .stl-kartlar.liste .stl-kart-puan { display: none; }
  .stl-kartlar.liste .stl-kart-ad { margin: 5px 0 5px; padding: 0; font-size: 22px; line-height: 28.6px; }
  .stl-kartlar.liste .stl-kart-aciklama { display: block; margin: 5px 0 10px; font-size: 14px; line-height: 21px; color: #6c6569; }
  .stl-kartlar.liste .stl-kart-fiyat { flex: none; margin: 0 0 10px; padding: 0; font-size: 22px; line-height: 33px; letter-spacing: normal; color: #333; }
  .stl-kartlar.liste .stl-kart-fiyat > span { font-size: 22px; line-height: 22px; letter-spacing: normal; }
  .stl-kartlar.liste .stl-kart-dugmeler { align-self: start; margin-top: 5px; padding: 0; }
  .stl-kartlar.liste .stl-kart-adet { width: 50px; height: 38px; border-color: #6c6569; border-radius: 3px; }
  .stl-kartlar.liste .stl-kart-sepet { height: 38px; padding: 13px 23.2px 13px 18px; gap: 8.4px; border-radius: 3px; font-size: 13px; font-weight: 400; text-transform: uppercase; }
  .stl-kartlar.liste .stl-kart-sepet::before { width: 16px; height: 16px; }
  .stl-kartlar.liste .stl-kart .stl-favori-btn { width: 38px; height: 38px; margin-left: 0; border: 1px solid #6c6569; border-radius: 3px; color: #46162a; }
  .stl-kartlar.liste .stl-kart .stl-favori-btn::before { width: 16px; height: 16px; }
}
@media (max-width: 760px) {
  /* canli sitedeki mobil arama: arac cubugu yok, secim kutusu etiketleri 12px */
  .stl-arama-satir { flex-direction: column; align-items: stretch; gap: 10px; }
  .stl-arama-satir select { width: 100%; }
  .stl-arac-karsilastir, .stl-arac-secim { display: none !important; } /* telefonda yalniz tablo/liste dugmeleri */
  .stl-arama-sec { font-size: 12px; line-height: 18px; }
  .stl-bilgi-icerik .stl-spec td { font-size: 13px; }
}
@media (max-width: 1100px) { .stl-kartlar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  /* Canli sitedeki Journal mobil liste: tek sutun, tam genislikte kart; adet kutusu + yalniz simgeli yuvarlak sepet dugmesi */
  .stl-sayfa-baslik { margin: 30px 0 20px; }
  /* Journal sayfalarinda telefonda kenar boslugu 20px, baslik ust alanin 30px altinda (ana sayfanin kendi duzeni 16px) */
  main .stl-sar { padding-inline: 20px; }
  main .stl-ana .stl-sar { padding-inline: 16px; }
  main :is(.stl-liste-sayfa, .stl-bilgi-sayfa, .stl-iletisim-sayfa, .stl-hesap-sayfa, .stl-hata-sayfa) { padding-top: 0; }
  .stl-kartlar { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .stl-kart-ad { font-size: 14px; line-height: 1.3; }
  .stl-kart-adet { height: 37px; }
  .stl-kart-sepet { width: 52px; padding: 10px 16px; gap: 0; font-size: 0; }
  .stl-kart-sepet::before { width: 20px; height: 20px; }
}

/* ---------- Bilgi sayfalari (sozlesmeler, Hakkimizda, SSS): canli sitedeki duzen ---------- */
/* Solda 1020px icerik (30px sag bosluk), sagda 260px "Bilgi Sayfalari" menusu (30px sol bosluk) */
.stl-bilgi-sayfa { padding: 6px 0 0; }
.stl-bilgi-duzen { display: grid; grid-template-columns: minmax(0, 1fr) 260px; }
.stl-bilgi-icerik { min-width: 0; padding: 0 30px 20px 0; font-size: 14px; line-height: 1.5; color: #333; overflow-wrap: anywhere; }
.stl-bilgi-icerik h1, .stl-bilgi-icerik h2, .stl-bilgi-icerik h3, .stl-bilgi-icerik h4 { margin: 26px 0 10px; font-family: var(--baslik); font-weight: 400; line-height: 1.1; color: #333; }
.stl-bilgi-icerik h1, .stl-bilgi-icerik h2 { font-size: 24px; }
.stl-bilgi-icerik h3 { margin: 0 0 15px; font-size: 24px; } /* duz metin sayfalari (Journal varsayilani) */
.stl-bilgi-icerik .stl-desc h2 { margin-bottom: 12px; }
.stl-bilgi-icerik .stl-desc h3 { margin: 26px 0 10px; font-size: 18px; }
.stl-bilgi-icerik h4 { font-size: 16px; }
.stl-bilgi-icerik > :first-child, .stl-bilgi-icerik .stl-desc > :first-child { margin-top: 0; }
.stl-bilgi-icerik p { margin: 0 0 15px; }
.stl-bilgi-icerik ul, .stl-bilgi-icerik ol { margin: 0 0 10px; padding-left: 40px; }
.stl-bilgi-icerik li { margin-bottom: 0; }
.stl-bilgi-icerik .stl-desc ul, .stl-bilgi-icerik .stl-desc ol { padding-left: 22px; }
.stl-bilgi-icerik .stl-desc li { margin-bottom: 6px; }
.stl-bilgi-icerik hr { margin: 20px 0; border: 0; border-top: 1px solid #eee; }
.stl-bilgi-icerik a { display: inline-block; color: var(--gul-koyu) !important; text-decoration: underline; }
.stl-bilgi-icerik a:hover { color: var(--gul) !important; }
.stl-bilgi-icerik table { width: 100%; margin: 0 0 18px; border-collapse: collapse; }
.stl-bilgi-icerik td, .stl-bilgi-icerik th { padding: 9px 12px; border: 1px solid #e2e2e2; text-align: left; vertical-align: top; }
/* Ozellik tablosu (.stl-spec; cerez politikasi): urun aciklamasindaki tabloyla ayni, cift satirlar acik gri */
.stl-bilgi-icerik .stl-spec { border: 1px solid #e2e2e2; }
.stl-bilgi-icerik .stl-spec th, .stl-bilgi-icerik .stl-spec td { border: 0; border-bottom: 1px solid #eee; }
.stl-bilgi-icerik .stl-spec th { width: 45%; font-weight: 600; color: #555; background: #fafafa; }
.stl-bilgi-icerik .stl-spec td { padding: 12px; color: var(--soluk); background: #fff; }
.stl-bilgi-icerik .stl-spec tr:nth-child(even) td { background: #fafafa; }
.stl-bilgi-icerik img { max-width: 100%; height: auto; }
.stl-bilgi-icerik .stl-desc { margin: 0 45px 30px; max-width: none; }
.stl-bilgi-yan { padding: 0 0 30px 30px; border-left: 1px solid #e2e2e2; }
.stl-bilgi-yan h2, .stl-yan-baslik, .stl-kutu-baslik { margin: 0 0 15px; font: 400 17px/1.2 var(--baslik); color: #333; }
.stl-bilgi-yan h2::after, .stl-yan-baslik::after, .stl-kutu-baslik::after { content: ""; display: block; width: 50px; height: 1px; margin-top: 10px; background: var(--gul); }
.stl-bilgi-yan ul, .stl-hesap-yan ul { margin: 0; padding: 0; list-style: none; }
.stl-bilgi-yan a, .stl-hesap-yan a { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 15px; line-height: 1.5; color: var(--yazi) !important; text-decoration: none !important; }
.stl-bilgi-yan a::before, .stl-hesap-yan a::before { content: ""; flex: none; width: 20px; height: 18px; background: #928b8f; -webkit-mask: var(--m, var(--i-bilgi)) center / contain no-repeat; mask: var(--m, var(--i-bilgi)) center / contain no-repeat; }
.stl-hesap-yan a { --m: var(--i-ayar); }
.stl-bilgi-yan a:hover, .stl-hesap-yan a:hover { color: var(--gul) !important; }
/* SSS: stl.js her h3 + ardindakileri <details>'e cevirir; canli sitedeki Journal akordeonu gibi cizgili satirlar */
.stl-sss-sayfa .stl-bilgi-icerik { padding-bottom: 41px; } /* canli sitede akordeonun altinda bos aciklama satiri (21px) var */
.stl-sss-sayfa details { border-top: 1px solid #e2e2e2; }
.stl-sss-sayfa details:first-child { border-top: 0; }
.stl-sss-sayfa summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 15px 5px 15px 0; cursor: pointer; list-style: none; font: 400 14px/1.1 var(--baslik); text-transform: uppercase; color: var(--soluk); }
.stl-sss-sayfa summary::-webkit-details-marker { display: none; }
.stl-sss-cevap { padding: 0 0 20px; font-size: 14px; line-height: 1.5; color: #333; }
.stl-sss-cevap > :last-child { margin-bottom: 0; }
@media (max-width: 1023px) {
  .stl-bilgi-duzen { grid-template-columns: minmax(0, 1fr); }
  .stl-bilgi-icerik { padding-right: 0; }
  .stl-bilgi-icerik .stl-desc { margin: 0 0 30px; }
  .stl-bilgi-yan { padding: 20px 0 0; border-top: 1px solid #e2e2e2; border-left: 0; }
}
/* 404 ve bos sepet (canli site): baslik, tek satir, tam genislikte "Devam" */
.stl-hata-sayfa { padding: 6px 0 20px; }
.stl-hata-sayfa p { margin: 0 0 15px; font-size: 14px; line-height: 21px; color: #333; }
.stl-hata-devam { display: flex; align-items: center; justify-content: center; height: 39px; margin-top: 20px; padding: 13px 18px; border-radius: 3px; background: var(--gul); color: #fff !important; font: 400 13px/13px var(--govde); text-transform: uppercase; text-decoration: none !important; }
.stl-hata-devam:hover { background: var(--gul-koyu); }
.stl-hata-devam.sepet { font-weight: 700; text-transform: none; }

/* ---------- Iletisim: canli sitedeki duzen ----------
   Solda %30 genislikte 4 bilgi karti (10px aralik), sagda 20px bosluktan sonra harita: kartlarla ayni yukseklikte. */
.stl-iletisim-sayfa { padding: 6px 0 40px; }
.stl-il-izgara { display: grid; grid-template-columns: 30% minmax(0, 1fr); align-items: stretch; }
.stl-il-kartlar { display: grid; gap: 10px; align-content: start; }
.stl-il-kart { display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; background: #fff; border: 1px solid #ece7e9; border-radius: 18px; }
.stl-il-kart::before { content: ""; flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--gul-acik) var(--m) center / 20px 20px no-repeat; }
.stl-il-kart.k-adres { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024' fill='%237d2a4b'%3E%3Cpath d='M512 0c-234.667 0-426.667 192-426.667 426.667 0 315.733 388.267 580.267 401.067 588.8 8.533 4.267 17.067 8.533 25.6 8.533s17.067-4.267 25.6-8.533c12.8-8.533 401.067-273.067 401.067-588.8 0-234.667-192-426.667-426.667-426.667zM512 930.133c-81.067-59.733-341.333-273.067-341.333-503.467 0-187.733 153.6-341.333 341.333-341.333s341.333 153.6 341.333 341.333c0 230.4-260.267 443.733-341.333 503.467z'/%3E%3Cpath d='M512 256c-93.867 0-170.667 76.8-170.667 170.667s76.8 170.667 170.667 170.667c93.867 0 170.667-76.8 170.667-170.667s-76.8-170.667-170.667-170.667zM512 512c-46.933 0-85.333-38.4-85.333-85.333s38.4-85.333 85.333-85.333c46.933 0 85.333 38.4 85.333 85.333s-38.4 85.333-85.333 85.333z'/%3E%3C/svg%3E"); }
.stl-il-kart.k-tel { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024' fill='%237d2a4b'%3E%3Cpath d='M810.667 85.333c0-47.104-38.229-85.333-85.333-85.333h-426.667c-47.104 0-85.333 38.229-85.333 85.333v853.333c0 47.104 38.229 85.333 85.333 85.333h426.667c47.104 0 85.333-38.229 85.333-85.333v-853.333zM448 85.333h128c11.776 0 21.333 9.557 21.333 21.333s-9.557 21.333-21.333 21.333h-128c-11.776 0-21.333-9.557-21.333-21.333s9.557-21.333 21.333-21.333zM512 938.667c-23.595 0-42.667-19.115-42.667-42.667s19.072-42.667 42.667-42.667c23.552 0 42.624 19.115 42.624 42.667s-19.072 42.667-42.624 42.667zM725.333 810.667h-426.667v-598.357h426.667v598.357z'/%3E%3C/svg%3E"); }
.stl-il-kart.k-eposta { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 819 1024' fill='%237d2a4b'%3E%3Cpath d='M-0.003 214.179h819.007v595.641h-819.007v-595.641zM683.913 288.635h-548.825l274.412 213.431 274.412-213.431zM74.453 335.797v399.57h670.097v-399.57l-335.049 260.596-335.049-260.596z'/%3E%3C/svg%3E"); }
.stl-il-kart.k-saat { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024' fill='%237d2a4b'%3E%3Cpath d='M512 512h128v85.333h-213.333v-256h85.333v170.667zM896 469.333h-45.653c-10.709-85.589-51.968-161.792-112.939-217.301-54.741-49.749-52.395-95.872-79.189-252.032h-335.104c-26.795 156.16-24.448 202.283-79.189 252.032-71.253 64.853-115.925 157.909-115.925 261.291 0 103.424 44.715 196.523 116.053 261.376 54.613 49.664 52.565 96.725 79.061 249.301h335.104c26.539-152.576 24.448-199.637 79.104-249.301 61.653-56.064 103.296-133.291 113.493-220.032h45.184v-85.333zM490.667 789.333c-153.131 0-277.333-124.203-277.333-277.333s124.203-277.333 277.333-277.333 277.333 124.203 277.333 277.333-124.203 277.333-277.333 277.333z'/%3E%3C/svg%3E"); }
.stl-il-kart h2 { margin: 1px 0 4px; font: 500 17px/1.3 var(--baslik); letter-spacing: 0; color: #2b2429; }
.stl-il-kart p { margin: 0; font-size: 14px; line-height: 1.6; color: #4a4247; }
.stl-il-kart a { color: var(--gul) !important; font-weight: 600; text-decoration: none !important; }
.stl-il-kart a:hover { text-decoration: underline !important; text-underline-offset: 3px; }
.stl-il-kart small { font-size: 12.5px; color: #8a8186; }
.stl-il-kart .stl-il-wa { color: #1f7a4d !important; }
.stl-harita { position: relative; min-height: 360px; margin-left: 20px; border: 1px solid #ece7e9; border-radius: 22px; overflow: hidden; }
.stl-harita iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 760px) {
  .stl-il-izgara { grid-template-columns: minmax(0, 1fr); }
  .stl-harita { min-height: 300px; margin: 14px 0 0; }
}

/* ---------- Giris, kayit, parolami unuttum: canli sitedeki Journal duzeni ----------
   Baslik tam genislikte; solda 990px icerik (30px sag bosluk), sagda 260px "Hesabim" menusu (sol cizgi, 30px ic bosluk).
   Yatay form: 150px etiket + alan (kayitta 500px), alanlar arasi 8px; tam genislikte yuvarlak bordo dugmeler. */
.stl-hesap-sayfa { padding: 6px 0 0; }
.stl-hesap-duzen { display: grid; grid-template-columns: minmax(0, 1fr) 260px; }
.stl-hesap-icerik { min-width: 0; padding: 0 30px 20px 0; font-size: 14px; line-height: 21px; color: #333; }
.stl-hesap-icerik p { margin: 0 0 15px; }
.stl-hesap-icerik a { color: var(--gul-koyu) !important; }
.stl-hesap-icerik a:hover { color: var(--gul) !important; }
.stl-hesap-duzen > #column-right { padding: 0 0 50px 30px; border-left: 1px solid #e2e2e2; }
.stl-giris-kutular { display: grid; grid-template-columns: minmax(0, 473fr) minmax(0, 487fr); column-gap: 30px; }
.stl-giris-kutu { display: flex; flex-direction: column; min-width: 0; }
.stl-hesap-btn { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: 39px; margin-top: auto; padding: 13px 18px; border: 0; border-radius: 999px; background: var(--gul); color: #fff !important; font: 700 13px/13px var(--govde); text-decoration: none !important; cursor: pointer; }
.stl-hesap-btn:hover { background: var(--gul-koyu); color: #fff !important; }
.stl-hesap-icerik .stl-hesap-btn, .stl-hesap-icerik .stl-hesap-btn:hover { color: #fff !important; }
.stl-hesap-btn.ikincil { background: var(--gul-koyu); }
.stl-hesap-btn.ikincil:hover { background: var(--gul); }
.stl-yatay-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.stl-yatay-form legend { width: 100%; margin: 10px 0 15px; padding: 0; font: 400 20px/30px var(--baslik); color: #333; }
.stl-yatay-form .stl-fs-bulten { margin-top: 20px; }
.stl-form-grup { display: flex; flex-wrap: wrap; align-items: flex-start; margin-bottom: 8px; }
.stl-etiket { display: flex; flex: none; width: 150px; padding: 7px 0 5px; font-size: 14px; line-height: 21px; font-weight: 400; color: #333; }
.zorunlu > .stl-etiket::after { content: "*"; margin: 3px 0 0 3px; font-size: 17px; line-height: 17px; color: #dd0e1c; }
.stl-form-alan { flex: 1; min-width: 0; }
.stl-yatay-form input[type="text"], .stl-yatay-form input[type="email"], .stl-yatay-form input[type="tel"], .stl-yatay-form input[type="password"], .stl-yatay-form select {
  box-sizing: border-box; display: block; width: 500px; max-width: 100%; height: 42px; padding: 6px 12px; border: 1px solid #e6e1e2; border-radius: 10px; background-color: #fff; color: #555; font: 400 14px/18.2px var(--govde); }
.stl-yatay-form input:focus, .stl-yatay-form select:focus { border-color: var(--gul); outline: 0; }
.stl-giris-form .stl-form-grup > input { flex: 1; width: auto; min-width: 0; }
.stl-unuttum { flex-basis: 100%; margin: 10px 0; }
.stl-unuttum a, .stl-kayit-giris a, .stl-kvkk-not a { display: inline-block; text-decoration: underline; }
.stl-alan-hatasi { margin: 4px 0 0 !important; font-size: 13px; line-height: 1.4; color: #dd0e1c; }
.stl-radyolar { display: flex; gap: 10px; }
.stl-radyo { display: flex; align-items: center; gap: 7px; height: 33px; padding-left: 20px; cursor: pointer; }
.stl-radyo input { width: 13px; height: 13px; margin: 0 0 0 -20px; accent-color: var(--gul); }
.stl-hesap-icerik .stl-kayit-giris { margin-bottom: 30px; } /* canli sitede 20px + ilk basligin 10px ust boslugu */
.stl-hesap-icerik .stl-kvkk-not { margin: 10px 0 0; font-size: 13px; line-height: 19.5px; color: #666; }
.stl-kayit-onay { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.stl-form-dugmeler { display: flex; gap: 20px; margin-top: 20px; }
.stl-form-dugmeler .stl-hesap-btn { flex: 1; margin-top: 0; }
@media (max-width: 1023px) {
  .stl-hesap-duzen { grid-template-columns: minmax(0, 1fr); }
  .stl-hesap-icerik { padding-right: 0; }
  .stl-hesap-duzen > #column-right { display: block !important; padding: 20px 0 30px; border-left: 0; border-top: 1px solid #e2e2e2; }
}
@media (max-width: 760px) {
  /* Canli sitedeki Journal mobil: yan menu yok; giris kutulari alt alta; etiket (12px) ustte, alan tam genislikte; radyolar 12px */
  .stl-hesap-duzen > #column-right, .stl-bilgi-yan { display: none !important; }
  .stl-giris-kutular { grid-template-columns: minmax(0, 1fr); row-gap: 30px; }
  .stl-giris-kutu > .stl-hesap-btn { margin-top: 0; }
  .stl-hesap-icerik { padding-bottom: 7px; }
  .stl-form-grup { margin-bottom: 3px; }
  .stl-etiket { padding: 7px 0 2px; font-size: 12px; line-height: 18px; }
  .stl-giris-form .stl-form-grup > input { flex: 1 1 100%; }
  .stl-form-alan { flex-basis: 100%; }
  .stl-yatay-form input[type="text"], .stl-yatay-form input[type="email"], .stl-yatay-form input[type="tel"], .stl-yatay-form input[type="password"], .stl-yatay-form select { width: 100%; font-size: 16px; }
  .stl-form-dugmeler { flex-direction: column; gap: 10px; }
  .stl-radyo { height: 18px; font-size: 12px; line-height: 18px; }
}

/* ---------- Uyari kutulari ---------- */
.stl-uyari { margin: 0 0 16px; padding: 12px 16px; border-radius: 14px; background: #fff7e6; color: #7a5410; font-size: 14px; }
.stl-uyari.basari { background: #eef7f1; color: #1f6b42; }
.stl-uyari.hata { background: #fbeaea; color: #9c2a22; }

/* ---------- Sepet sayfasi ---------- */
.stl-sepet-sayfa { padding: 10px 0 56px; }
.stl-sepet-izgara { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.stl-sepet-urunler { display: grid; gap: 10px; transition: opacity .2s ease; }
.stl-sepet-urunler.gonderiliyor { opacity: .55; pointer-events: none; }
.stl-ss-satir { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto auto 34px; align-items: center; gap: 16px; padding: 14px 16px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 20px; }
.stl-ss-foto { display: block; width: 88px; height: 88px; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px rgba(43, 36, 41, .06); }
.stl-ss-foto img { width: 100%; height: 100%; object-fit: contain; }
.stl-ss-bilgi { display: grid; gap: 4px; min-width: 0; }
.stl-ss-ad { font-weight: 600; font-size: 15px; line-height: 1.35; color: var(--yazi) !important; text-decoration: none !important; }
a.stl-ss-ad:hover { color: var(--gul) !important; }
.stl-ss-bilgi small { font-size: 12.5px; color: var(--soluk2); }
.stl-ss-stok { font-style: normal; font-size: 12.5px; color: #b3261e; font-weight: 600; }
.stl-ss-satir .stl-adet { width: auto; height: 42px; } /* sepette: [-] sayi [+] (urun sayfasindaki 60px'lik oklu kutudan ayri) */
.stl-ss-satir .stl-adet button { width: 32px; font-size: 18px; line-height: 1; }
.stl-ss-satir .stl-adet button::before { content: none; }
.stl-ss-satir .stl-adet input { flex: none; width: 40px; padding: 0; }
.stl-ss-tutar { min-width: 96px; text-align: right; font-size: 16px; font-variant-numeric: tabular-nums; }
.stl-sepet-ozet { position: sticky; top: 100px; display: grid; gap: 14px; padding: 22px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 22px; }
.stl-sepet-ozet h2 { margin: 0; font: 400 22px/1.3 var(--baslik); color: var(--yazi); }
.stl-ozet-tablo { width: 100%; border-collapse: collapse; font-size: 14px; }
.stl-ozet-tablo td { padding: 6px 0; color: var(--soluk); }
.stl-ozet-tablo td + td { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--yazi); }
.stl-ozet-tablo tr:last-child td { padding-top: 12px; border-top: 1px solid var(--cizgi); font-size: 18px; font-weight: 700; color: var(--yazi); }
.stl-btn-tamamla { height: 54px; font-size: 16px; }
.stl-kupon { display: grid; gap: 6px; padding-top: 14px; border-top: 1px solid var(--cizgi2); }
.stl-kupon label { font-size: 13.5px; font-weight: 600; color: var(--yazi); }
.stl-kupon-satir { display: flex; gap: 8px; }
.stl-kupon-satir input { flex: 1; min-width: 0; height: 44px; padding: 0 14px; border: 1.5px solid var(--cizgi); border-radius: 999px; font: 14px var(--govde); color: var(--yazi); text-transform: uppercase; }
.stl-kupon-satir input:focus { outline: none; border-color: var(--gul); }
.stl-kupon-satir .stl-btn { height: 44px; padding: 0 16px; }
.stl-kupon-mesaj { margin: 0; font-size: 13px; color: #9c2a22; }
.stl-ozet-guven { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; color: var(--soluk); }
.stl-ozet-guven li { display: flex; gap: 8px; align-items: center; }
.stl-ozet-guven li::before { content: ""; width: 15px; height: 15px; flex: none; background: #2d8a57; -webkit-mask: var(--i-tamam) center / contain no-repeat; mask: var(--i-tamam) center / contain no-repeat; }
.stl-devam { justify-self: center; font-size: 13.5px; color: var(--gul) !important; font-weight: 600; }
@media (max-width: 900px) {
  .stl-sepet-izgara { grid-template-columns: 1fr; }
  .stl-sepet-ozet { position: static; }
}
@media (max-width: 600px) {
  .stl-ss-satir { grid-template-columns: 72px minmax(0, 1fr) 30px; grid-template-areas: "foto bilgi sil" "foto adet tutar"; gap: 8px 12px; padding: 12px; }
  .stl-ss-foto { grid-area: foto; width: 72px; height: 72px; align-self: start; }
  .stl-ss-bilgi { grid-area: bilgi; }
  .stl-ss-satir .stl-adet { grid-area: adet; justify-self: start; height: 38px; }
  .stl-ss-tutar { grid-area: tutar; min-width: 0; align-self: center; grid-column: 2 / 4; justify-self: end; }
  .stl-ss-sil { grid-area: sil; align-self: start; }
}

/* ---------- Varsayilan sablonlu sayfalar: odeme adimlari, hesap, giris/kayit (Bootstrap 3 ustune yeni tasarim) ---------- */
html.stl-std #stl-icerik { padding: 10px 0 56px; }
html.stl-std #stl-icerik .breadcrumb { display: none; } /* canli sitede de gizliydi */
html.stl-std #stl-icerik h1 { margin: 6px 0 22px; font-size: clamp(28px, 3vw, 38px); line-height: 1.15; letter-spacing: -0.01em; }
html.stl-std #stl-icerik h2 { font-size: 24px; line-height: 1.25; margin: 0 0 12px; }
html.stl-std #stl-icerik legend { padding: 0 0 8px; margin: 18px 0 14px; border: 0; border-bottom: 1px solid var(--cizgi); font: 400 20px/1.3 var(--baslik); color: var(--yazi); }
html.stl-std #stl-icerik p { line-height: 1.6; }
html.stl-std #stl-icerik label, html.stl-std #stl-icerik .control-label { font-size: 13.5px; font-weight: 600; color: var(--yazi); }
html.stl-std #stl-icerik .radio label, html.stl-std #stl-icerik .checkbox label { font-weight: 400; font-size: 14px; }
html.stl-std #stl-icerik .form-control { height: 46px; padding: 10px 14px; border: 1.5px solid var(--cizgi); border-radius: 14px; box-shadow: none; font: 15px/1.4 var(--govde); color: var(--yazi); }
html.stl-std #stl-icerik textarea.form-control { height: auto; }
html.stl-std #stl-icerik .form-control:focus { border-color: var(--gul); box-shadow: 0 0 0 3px rgba(125, 42, 75, .12); }
html.stl-std #stl-icerik .has-error .form-control { border-color: #c2413a; }
html.stl-std #stl-icerik .text-danger { color: #b3261e; font-size: 12.5px; }
html.stl-std #stl-icerik .btn { height: 44px; padding: 0 22px; border-radius: 999px; font: 600 14px/42px var(--govde); text-shadow: none; box-shadow: none; }
html.stl-std #stl-icerik .btn-xs, html.stl-std #stl-icerik .btn-sm { height: 34px; padding: 0 14px; line-height: 32px; font-size: 13px; }
html.stl-std #stl-icerik .btn-default { background: #fff; border: 1.5px solid var(--cizgi); color: var(--yazi); }
html.stl-std #stl-icerik .btn-default:hover { border-color: var(--gul); color: var(--gul); }
html.stl-std #stl-icerik .btn-danger { background: #fff; border: 1.5px solid #e2b4b0; color: #9c2a22; }
html.stl-std #stl-icerik .btn-info, html.stl-std #stl-icerik .btn-success { background: var(--gul); border-color: var(--gul); color: #fff; }
html.stl-std #stl-icerik .well { padding: 26px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 22px; box-shadow: none; }
html.stl-std #stl-icerik .well h2 { font-size: 24px; }
html.stl-std #stl-icerik .panel { border: 1px solid var(--cizgi2); border-radius: 18px; box-shadow: none; overflow: hidden; margin-bottom: 12px; }
html.stl-std #stl-icerik .panel-default > .panel-heading { padding: 16px 20px; background: #fff; border: 0; }
html.stl-std #stl-icerik .panel-title { font: 600 15.5px/1.3 var(--govde); color: var(--yazi); }
html.stl-std #stl-icerik .panel-title a { color: var(--gul) !important; text-decoration: none; }
html.stl-std #stl-icerik .panel-body { padding: 20px; border-top: 1px solid var(--cizgi2) !important; }
html.stl-std #stl-icerik .table { background: #fff; border-color: var(--cizgi2); }
html.stl-std #stl-icerik .table > thead > tr > td, html.stl-std #stl-icerik .table > tbody > tr > td, html.stl-std #stl-icerik .table > thead > tr > th { padding: 10px 12px; border-color: var(--cizgi2); vertical-align: middle; }
html.stl-std #stl-icerik .table-bordered { border-radius: 14px; border-collapse: separate; border-spacing: 0; overflow: hidden; }
html.stl-std #stl-icerik .img-thumbnail { border-radius: 12px; border-color: var(--cizgi2); }
html.stl-std #stl-icerik .alert { border: 0; border-radius: 14px; padding: 12px 16px; font-size: 14px; }
html.stl-std #stl-icerik .alert-success { background: #eef7f1; color: #1f6b42; }
html.stl-std #stl-icerik .alert-danger { background: #fbeaea; color: #9c2a22; }
html.stl-std #stl-icerik .alert-info, html.stl-std #stl-icerik .alert-warning { background: #fff7e6; color: #7a5410; }
html.stl-std #stl-icerik .alert .close { opacity: .5; }
html.stl-std #stl-icerik .pagination > li > a, html.stl-std #stl-icerik .pagination > li > span { margin: 0 3px; border-radius: 999px !important; border: 1.5px solid var(--cizgi); color: var(--yazi); }
html.stl-std #stl-icerik .pagination > .active > span { background: var(--gul); border-color: var(--gul); color: #fff; }
html.stl-std #stl-icerik .list-group { border-radius: 18px; overflow: hidden; border: 1px solid var(--cizgi2); background: #fff; }
html.stl-std #stl-icerik .list-group-item { border: 0; border-top: 1px solid var(--cizgi2); padding: 12px 16px; font-size: 14px; color: var(--yazi) !important; }
html.stl-std #stl-icerik .list-group-item:first-child { border-top: 0; border-radius: 0; }
html.stl-std #stl-icerik .list-group-item:hover, html.stl-std #stl-icerik .list-group-item.active { background: var(--gul-acik); color: var(--gul) !important; }
/* Hesap menusu: kullanilmayan bolumler (dosyalar, otomatik odemeler, puan, bakiye) gizli */
html.stl-std #stl-icerik .list-group a[href*="account/download"], html.stl-std #stl-icerik .list-group a[href*="account/recurring"],
html.stl-std #stl-icerik .list-group a[href*="account/reward"], html.stl-std #stl-icerik .list-group a[href*="account/transaction"],
html.stl-std #stl-icerik #content a[href*="account/download"], html.stl-std #stl-icerik #content a[href*="account/recurring"],
html.stl-std #stl-icerik #content a[href*="account/reward"], html.stl-std #stl-icerik #content a[href*="account/transaction"] { display: none; }
html.stl-std #stl-icerik #content ul.list-unstyled li:has(> a[href*="account/download"]),
html.stl-std #stl-icerik #content ul.list-unstyled li:has(> a[href*="account/recurring"]),
html.stl-std #stl-icerik #content ul.list-unstyled li:has(> a[href*="account/reward"]),
html.stl-std #stl-icerik #content ul.list-unstyled li:has(> a[href*="account/transaction"]) { display: none; }
html.stl-std #stl-icerik #content > ul.list-unstyled { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; margin-bottom: 26px; }
html.stl-std #stl-icerik #content > ul.list-unstyled li a { display: block; padding: 14px 16px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 14px; color: var(--yazi) !important; text-decoration: none; font-weight: 500; }
html.stl-std #stl-icerik #content > ul.list-unstyled li a:hover { border-color: var(--gul); color: var(--gul) !important; }
/* Hesabim kutulari */
.stl-hesap-kutular { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.stl-hk { position: relative; display: grid; gap: 3px; padding: 18px 18px 18px 64px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; color: var(--yazi) !important; text-decoration: none !important; transition: border-color .15s ease; }
.stl-hk:hover { border-color: var(--gul); }
.stl-hk::before { content: ""; position: absolute; left: 16px; top: 50%; width: 36px; height: 36px; margin-top: -18px; border-radius: 50%; background: var(--gul-acik); }
.stl-hk::after { content: ""; position: absolute; left: 25px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: var(--gul); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.stl-hk b { font-size: 15px; }
.stl-hk small { font-size: 12.5px; color: var(--soluk); }
.stl-hk.k-bilgi { --m: var(--i-kisi); }
.stl-hk.k-parola { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10.5' width='16' height='10' rx='2'/%3E%3Cpath d='M8 10.5V7a4 4 0 0 1 8 0v3.5'/%3E%3C/svg%3E"); }
.stl-hk.k-adres { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E"); }
.stl-hk.k-favori { --m: var(--i-kalp); }
.stl-hk.k-siparis { --m: var(--i-paket); }
.stl-hk.k-iade { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12a8 8 0 1 0 2.4-5.7'/%3E%3Cpath d='M4 4v4.5h4.5'/%3E%3C/svg%3E"); }
/* ---------- Ortak: geri baglantisi, durum rozetleri, bos durum ---------- */
.stl-geri { display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 2px; font-size: 13.5px; font-weight: 600; color: var(--soluk) !important; text-decoration: none !important; }
.stl-geri::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--i-geri) center / contain no-repeat; mask: var(--i-geri) center / contain no-repeat; }
.stl-geri:hover { color: var(--gul) !important; }
.stl-durum { display: inline-flex; align-items: center; justify-self: start; padding: 5px 12px; border-radius: 999px; background: var(--gul-acik); color: var(--gul) !important; font-size: 12.5px; font-weight: 700; line-height: 1.2; white-space: nowrap; text-decoration: none !important; }
.stl-durum.d-tamam { background: #e8f5ec; color: #1d6a40 !important; }
.stl-durum.d-kargo { background: #e8f0fb; color: #1f4f8a !important; }
.stl-durum.d-hazir, .stl-durum.d-bekle { background: #fff3dd; color: #7a5410 !important; }
.stl-durum.d-iptal { background: #f1eef0; color: #6c6569 !important; }
.stl-bos-kart, .stl-iade-bos { padding: 22px; border: 1px dashed #dccdd3; border-radius: 18px; background: #fff; color: var(--soluk); }
.stl-bos-kart p { margin: 0 0 14px; }

/* ---------- Siparislerim ---------- */
.stl-siparisler { display: grid; gap: 12px; }
.stl-sk { display: block; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; overflow: hidden; color: var(--yazi) !important; text-decoration: none !important; transition: border-color .15s ease, box-shadow .15s ease; }
.stl-sk:hover { border-color: #d8c3cc; box-shadow: 0 6px 18px rgba(43, 36, 41, .06); }
.stl-sk-ust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: center; gap: 10px 16px; padding: 14px 18px; background: #fbf8f9; border-bottom: 1px solid var(--cizgi2); }
.stl-sk-ust > span:not(.stl-durum), .stl-sd-ozet > span:not(.stl-durum) { display: grid; gap: 1px; min-width: 0; }
.stl-sk-ust small, .stl-sd-ozet small { font-size: 12px; color: var(--soluk); }
.stl-sk-ust b, .stl-sd-ozet b { font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stl-sk-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 12px 18px; }
.stl-sk-kargo { flex-basis: 100%; order: 3; margin-top: -4px; font-size: 13px; color: var(--soluk); }
.stl-sk-kargo b { color: var(--yazi); }
.stl-sk-gorseller { display: flex; align-items: center; gap: 8px; flex: none; }
.stl-sk-gorseller img, .stl-iade-kart img, .stl-iade-siparis li img { width: 60px; height: 60px; flex: none; object-fit: contain; border-radius: 12px; background: var(--zemin2); border: 1px solid var(--cizgi2); }
.stl-sk-gorseller em { font-style: normal; font-size: 13px; font-weight: 700; color: var(--soluk); }
.stl-sk-ozet { flex: 1; min-width: 0; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stl-sk-detay { flex: none; font-size: 13.5px; font-weight: 700; color: var(--gul); }
.stl-sk-detay::after { content: " \203A"; }

/* ---------- Siparis detayi ---------- */
html.stl-std #stl-icerik .stl-sd-ozet { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: center; gap: 10px 16px; margin: 0 0 14px; padding: 16px 20px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; }
.stl-ilerleme { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 14px; padding: 18px 12px 16px; list-style: none; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; }
.stl-ilerleme li { position: relative; display: grid; justify-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--soluk2); text-align: center; }
.stl-ilerleme li span { position: relative; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #f1eef0; color: var(--soluk); font-size: 13px; font-weight: 700; }
.stl-ilerleme li + li::before { content: ""; position: absolute; top: 14px; right: 50%; width: 100%; height: 3px; background: #ece7e9; }
.stl-ilerleme li.gecti { color: var(--yazi); }
.stl-ilerleme li.gecti span { background: var(--gul); color: #fff; }
.stl-ilerleme li.gecti::before { background: var(--gul) !important; }
.stl-ilerleme li.simdi span { box-shadow: 0 0 0 5px rgba(125, 42, 75, .15); }
.stl-sd-not { margin: -4px 0 14px; padding: 10px 14px; border-radius: 12px; background: #fff7e6; color: #7a5410; font-size: 13.5px; }
.stl-sd-kart { margin: 0 0 14px; padding: 18px 20px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; }
html.stl-std #stl-icerik .stl-sd-kart h2 { margin: 0 0 12px; font-size: 19px; }
.stl-sd-kart .stl-sd-not { margin: 12px 0 0; }
.stl-sd-kart address { margin: 0; font-size: 14px; line-height: 1.55; }
/* Kargo takibi + fatura indirme (panelden girilen takip no / yuklenen PDF) */
.stl-kargo-satir { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0; }
.stl-kargo-satir > span:first-child { display: grid; gap: 2px; }
.stl-kargo-satir small { font-size: 12.5px; color: var(--soluk); }
.stl-kargo-satir b { font-size: 16px; letter-spacing: .02em; }
.stl-kargo-dugmeler { display: flex; flex-wrap: wrap; gap: 8px; }
.stl-sd-kart .stl-fatura-indir { margin-top: 12px; }
.stl-sd-not.stl-not-bilgi { background: #eef5f0; color: #1d5a3a; }
.stl-sd-alt { display: block; margin-top: 6px; font-size: 13px; color: var(--soluk); }
.stl-sd-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.stl-sd-urunler { margin: 0; padding: 0; list-style: none; }
.stl-sd-urunler li { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; grid-template-areas: "foto bilgi tutar" "foto islem islem"; align-items: center; gap: 6px 16px; padding: 14px 0; }
.stl-sd-urunler li + li { border-top: 1px solid var(--cizgi2); }
.stl-sd-urunler li:first-child { padding-top: 0; }
.stl-sd-foto { grid-area: foto; display: block; width: 88px; height: 88px; border-radius: 14px; overflow: hidden; background: var(--zemin2); border: 1px solid var(--cizgi2); }
.stl-sd-foto img { width: 100%; height: 100%; object-fit: contain; }
.stl-sd-bilgi { grid-area: bilgi; display: grid; gap: 3px; min-width: 0; }
.stl-sd-bilgi a { color: var(--yazi) !important; }
.stl-sd-bilgi b { font-size: 15px; }
.stl-sd-bilgi small { font-size: 12.5px; color: var(--soluk); }
.stl-sd-tutar { grid-area: tutar; font-size: 15px; font-weight: 700; white-space: nowrap; }
.stl-sd-islem { grid-area: islem; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.stl-sd-islem:empty { display: none; }
.stl-toplamlar { margin: 0; }
.stl-toplamlar > div { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; font-size: 14px; }
.stl-toplamlar dt { font-weight: 400; color: var(--soluk); }
.stl-toplamlar dd { font-weight: 600; text-align: right; }
.stl-toplamlar > div.son { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--cizgi2); font-size: 17px; }
.stl-toplamlar > div.son dt { color: var(--yazi); font-weight: 600; }
.stl-toplamlar > div.son dd { font-weight: 800; }
.stl-ucretsiz { color: #1d6a40; }
.stl-gecmis { margin: 0; padding: 0 0 0 18px; list-style: none; border-left: 2px solid var(--cizgi2); }
.stl-gecmis li { position: relative; display: grid; gap: 2px; padding: 0 0 16px 6px; font-size: 14px; }
.stl-gecmis li:last-child { padding-bottom: 0; }
.stl-gecmis li::before { content: ""; position: absolute; left: -26px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: #d8cdd1; box-shadow: 0 0 0 3px #fff; }
.stl-gecmis li:first-child::before { background: var(--gul); }
.stl-gecmis small { font-size: 12.5px; color: var(--soluk); }
.stl-gecmis li > div { margin-top: 6px; padding: 10px 12px; border-radius: 12px; background: #faf8f9; font-size: 13.5px; line-height: 1.55; }
.stl-bilgi-liste { margin: 0; }
.stl-bilgi-liste > div { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 12px; padding: 7px 0; font-size: 14px; }
.stl-bilgi-liste > div + div { border-top: 1px solid var(--cizgi2); }
.stl-bilgi-liste dt { font-weight: 400; color: var(--soluk); }
.stl-bilgi-liste dd { font-weight: 600; }

/* ---------- Iade taleplerim + iade formu ---------- */
.stl-iade-liste, .stl-iade-siparisler { display: grid; gap: 10px; margin-bottom: 8px; }
.stl-iade-kart { display: flex; align-items: center; gap: 14px; padding: 12px 16px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 16px; color: var(--yazi) !important; text-decoration: none !important; }
.stl-iade-kart:hover { border-color: #d8c3cc; }
.stl-iade-kart > span:not(.stl-durum), .stl-iade-siparis li > span { display: grid; gap: 2px; flex: 1; min-width: 0; font-size: 14px; }
.stl-iade-kart small, .stl-iade-siparis small { font-size: 12.5px; color: var(--soluk); }
html.stl-std #stl-icerik h2.stl-iade-baslik { margin-top: 26px; }
.stl-iade-not { max-width: 46em; color: var(--soluk); font-size: 14px; }
.stl-iade-siparis { background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; overflow: hidden; }
.stl-iade-siparis header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; background: #fbf8f9; border-bottom: 1px solid var(--cizgi2); }
.stl-iade-siparis header span { display: grid; gap: 2px; }
.stl-iade-siparis header a { font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.stl-iade-siparis ul { list-style: none; margin: 0; padding: 0; }
.stl-iade-siparis li { display: flex; align-items: center; gap: 14px; padding: 12px 16px; }
.stl-iade-siparis li + li { border-top: 1px solid var(--cizgi2); }
.stl-iade-urun { display: flex; align-items: center; gap: 16px; margin: 0 0 18px; padding: 14px 16px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 18px; }
.stl-iade-urun img { width: 88px; height: 88px; flex: none; object-fit: contain; border-radius: 14px; background: var(--zemin2); }
.stl-iade-urun > span { display: grid; gap: 3px; min-width: 0; }
.stl-iade-urun b { font-size: 16px; }
.stl-iade-urun small { font-size: 13px; color: var(--soluk); }
.stl-iade-urun.stl-iade-urun-ic { margin: 0 0 10px; padding: 0; border: 0; border-radius: 0; }
.stl-iade-form { max-width: 720px; }
html.stl-std #stl-icerik .stl-iade-form legend { margin: 6px 0 10px; padding: 0; border: 0; font: 600 15px/1.3 var(--govde); }
.stl-iade-adet { max-width: 200px; }
.stl-secimler { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.stl-secimler-yan { grid-template-columns: repeat(2, minmax(0, 140px)); }
html.stl-std #stl-icerik .stl-secim { position: relative; display: block; margin: 0; cursor: pointer; font-weight: 400; }
.stl-secim input { position: absolute; opacity: 0; pointer-events: none; }
.stl-secim span { display: flex; align-items: center; min-height: 46px; padding: 10px 14px 10px 40px; border: 1.5px solid var(--cizgi); border-radius: 14px; background: #fff; font-size: 14px; line-height: 1.3; transition: border-color .15s ease, background .15s ease; }
.stl-secim span::before { content: ""; position: absolute; left: 14px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border: 1.5px solid #b9adb2; border-radius: 50%; background: #fff; box-sizing: border-box; }
.stl-secim input:checked + span { border-color: var(--gul); background: var(--gul-acik); }
.stl-secim input:checked + span::before { border: 5px solid var(--gul); }
.stl-secim input:focus-visible + span { outline: 2px solid var(--gul); outline-offset: 2px; }
.stl-iki-alan { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
html.stl-std #stl-icerik .stl-onay-kutu { margin: 6px 0 14px; }
html.stl-std #stl-icerik .stl-iade-form .buttons { margin-top: 8px; }

/* ---------- Odeme sayfasi: iki adim + sabit siparis ozeti ---------- */
html.stl-r-checkout-checkout [hidden] { display: none !important; }
html.stl-r-checkout-checkout #stl-icerik { padding-bottom: 64px; }
.stl-ok-ust { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; margin-bottom: 18px; }
html.stl-std #stl-icerik .stl-ok-ust h1 { margin: 0; }
.stl-ok-adimlar { display: flex; align-items: center; gap: 22px; margin: 0; padding: 0; list-style: none; }
.stl-ok-adimlar li { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border-radius: 999px; background: #fff; border: 1px solid var(--cizgi2); font-size: 13.5px; font-weight: 600; color: var(--soluk); }
.stl-ok-adimlar li + li::before { content: ""; position: absolute; right: 100%; top: 50%; width: 22px; height: 2px; background: var(--cizgi); }
.stl-ok-adimlar li span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #f1eef0; font-size: 12.5px; }
.stl-ok-adimlar li.aktif { border-color: var(--gul); color: var(--gul); }
.stl-ok-adimlar li.aktif span, .stl-ok-adimlar li.gecti span { background: var(--gul); color: #fff; }
.stl-ok-adimlar li.gecti { color: var(--yazi); cursor: pointer; }
.stl-ok { display: grid; grid-template-columns: minmax(0, 1fr) 370px; align-items: start; gap: 24px; }
.stl-ok-sol { display: grid; gap: 14px; min-width: 0; }
.stl-ok-bolum { padding: 22px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 22px; }
html.stl-std #stl-icerik .stl-ok-bolum h2 { margin: 0 0 14px; font-size: 21px; }
html.stl-std #stl-icerik .stl-ok-bolum h3 { margin: 4px 0 12px; font: 600 16px/1.3 var(--govde); }
.stl-adres-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
html.stl-std #stl-icerik .stl-adres-kart { position: relative; display: block; min-height: 120px; margin: 0; padding: 14px 14px 14px 42px; border: 1.5px solid var(--cizgi); border-radius: 16px; background: #fff; cursor: pointer; font-weight: 400; text-align: left; transition: border-color .15s ease, background .15s ease; }
.stl-adres-kart:hover { border-color: #cdb4bf; }
html.stl-std #stl-icerik .stl-adres-kart:has(input:checked) { border-color: var(--gul); background: #fdf9fa; box-shadow: inset 0 0 0 1px var(--gul); }
.stl-adres-kart input { position: absolute; left: 15px; top: 17px; margin: 0; accent-color: var(--gul); width: 16px; height: 16px; }
.stl-ak-ic { display: grid; gap: 2px; padding-right: 54px; font-size: 13.5px; line-height: 1.45; }
.stl-ak-ic b { margin-bottom: 2px; font-size: 14.5px; }
.stl-ak-ic small { font-size: 13px; color: #4f474c; }
.stl-ak-ic em { justify-self: start; margin-top: 6px; padding: 3px 10px; border-radius: 999px; background: var(--gul-acik); color: var(--gul); font-style: normal; font-size: 12px; font-weight: 600; }
.stl-ak-duzenle { position: absolute; right: 12px; top: 12px; font-size: 12.5px; font-weight: 600; }
html.stl-std #stl-icerik .stl-adres-yeni { display: grid; place-items: center; padding: 14px; border-style: dashed; color: var(--gul); font: 600 14px/1.3 var(--govde); }
.stl-yeni-adres { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--cizgi2); }
html.stl-std #stl-icerik .stl-ayni { display: flex; align-items: center; gap: 10px; margin: 16px 0 0; font-size: 14.5px; font-weight: 600; cursor: pointer; }
.stl-ayni input, .stl-ok-sozlesme input { width: 18px; height: 18px; margin: 0; accent-color: var(--gul); flex: none; }
.stl-fatura-secim, .stl-teslimat-ayri { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--cizgi2); }
.stl-ok-ipucu { margin: 10px 0 0; font-size: 13px; color: var(--soluk); }
.stl-ok-adres-ozet { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 18px; padding: 12px 14px; border-radius: 14px; background: #faf7f8; font-size: 13.5px; }
.stl-ok-adres-ozet span { min-width: 0; }
.stl-odeme-secenekler { display: grid; gap: 10px; }
html.stl-std #stl-icerik .stl-secim-kart { position: relative; display: block; margin: 0; cursor: pointer; font-weight: 400; }
.stl-secim-kart input { position: absolute; left: 16px; top: 19px; margin: 0; width: 18px; height: 18px; accent-color: var(--gul); }
.stl-secim-kart > span { display: grid; gap: 3px; padding: 15px 16px 15px 46px; border: 1.5px solid var(--cizgi); border-radius: 16px; background: #fff; transition: border-color .15s ease, background .15s ease; }
.stl-secim-kart > span b { font-size: 15px; }
.stl-secim-kart > span b img { max-height: 22px; width: auto; vertical-align: middle; }
.stl-secim-kart > span small { font-size: 13px; color: var(--soluk); }
.stl-secim-kart:has(input:checked) > span { border-color: var(--gul); background: #fdf9fa; box-shadow: inset 0 0 0 1px var(--gul); }
.stl-siparis-notu { margin-top: 14px; }
.stl-siparis-notu summary { display: inline-flex; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--gul); list-style: none; }
.stl-siparis-notu summary::-webkit-details-marker { display: none; }
.stl-siparis-notu summary::before { content: "+"; margin-right: 6px; }
.stl-siparis-notu[open] summary::before { content: "\2212"; }
.stl-siparis-notu textarea { margin-top: 10px; }
#collapse-checkout-confirm { margin-top: 18px; }
#collapse-checkout-confirm iframe { width: 100% !important; border: 0; }
html.stl-r-checkout-checkout #collapse-checkout-confirm.stl-gizli-onay { display: none !important; }
.stl-ok-ozet { position: sticky; top: 104px; display: grid; gap: 14px; padding: 22px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 22px; box-shadow: 0 10px 30px rgba(43, 36, 41, .06); }
html.stl-std #stl-icerik .stl-ok-ozet h2 { margin: 0; font-size: 20px; }
.stl-ok-urunler { display: grid; gap: 12px; margin: 0; padding: 0 0 14px; list-style: none; border-bottom: 1px solid var(--cizgi2); }
.stl-ok-urunler li { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.stl-ok-urunler img { width: 56px; height: 56px; object-fit: contain; border-radius: 12px; background: var(--zemin2); border: 1px solid var(--cizgi2); }
.stl-ok-urunler li > span:not(.stl-ok-tutar) { display: grid; gap: 2px; min-width: 0; font-size: 13.5px; line-height: 1.35; }
.stl-ok-urunler small { font-size: 12.5px; color: var(--soluk); }
.stl-ok-tutar { font-size: 14px; font-weight: 700; white-space: nowrap; }
html.stl-std #stl-icerik .stl-ok-sozlesme { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 12px; border-radius: 14px; background: #faf7f8; font-size: 13px; font-weight: 400; line-height: 1.5; cursor: pointer; }
.stl-ok-sozlesme input { margin-top: 1px; }
html.stl-std #stl-icerik .stl-ok-sozlesme.dikkat { box-shadow: inset 0 0 0 1.5px #c2413a; }
html.stl-std #stl-icerik .stl-ok-dugme { height: 52px; font-size: 15.5px; line-height: 50px; }
html.stl-std #stl-icerik .stl-ok-dugme.yukleniyor, .stl-ok-cubuk .btn.yukleniyor { opacity: .7; cursor: progress; }
.stl-ok-guven { margin: -4px 0 0; font-size: 12.5px; color: var(--soluk); text-align: center; }
html.stl-std #stl-icerik .stl-ok-ozet .stl-ok-uyari { margin: 0; }
html.stl-r-checkout-checkout #stl-icerik .stl-test-bant { margin: 0 0 16px; padding: 12px 16px; border-radius: 14px; background: #fff3cd; border: 1.5px solid #e0b100; color: #5c4400; font-size: 14px; }
html.stl-r-checkout-checkout #stl-icerik .stl-test-bant a { color: #5c4400; font-weight: 700; text-decoration: underline; }
html.stl-r-checkout-checkout #stl-icerik .stl-odeme-uye { margin: 0; padding: 14px 20px; border: 1px solid var(--cizgi2); border-radius: 18px; background: #fff; }
html.stl-r-checkout-checkout #stl-icerik .stl-odeme-uye p { display: flex; align-items: center; justify-content: space-between; gap: 6px 14px; flex-wrap: wrap; margin: 0; font-size: 14px; color: var(--soluk); }
html.stl-r-checkout-checkout #stl-icerik .stl-odeme-uye p b { color: var(--yazi); }
html.stl-r-checkout-checkout #stl-icerik #stl-giris-kutu { padding-top: 14px; font-size: 13.5px; }
html.stl-r-checkout-checkout #stl-icerik #stl-giris-kutu.collapse.in { display: grid; gap: 10px; }
.stl-giris-alanlar { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; }
/* OpenCart'in adres formlari (misafir, yeni adres, farkli teslimat): etiket ustte, alanlar iki sutun */
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .row { margin: 0; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .row > .col-sm-6 { width: 100%; padding: 0; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .row > .col-sm-6 + .col-sm-6 { margin-top: 0; padding-top: 0; border-top: 0; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum fieldset#account, html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum fieldset#address,
html.stl-r-checkout-checkout #stl-icerik #payment-new, html.stl-r-checkout-checkout #stl-icerik #shipping-new { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum legend { grid-column: 1 / -1; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .form-group:has([name="address_1"]), html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .form-group:has([name="address_2"]) { grid-column: 1 / -1; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .form-horizontal .form-group { margin-left: 0; margin-right: 0; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .form-horizontal .control-label { float: none; width: auto; padding: 0 0 6px; text-align: left; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .form-horizontal .form-group > [class*="col-sm-"] { float: none; width: auto; padding: 0; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .buttons { display: flex; justify-content: flex-end; margin-top: 8px; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum .buttons .pull-right { float: none !important; }
html.stl-r-checkout-checkout #stl-icerik .stl-ok-uyari { margin-bottom: 14px; }
.stl-ok-cubuk { display: none; }
@media (max-width: 1023px) {
  .stl-ok { grid-template-columns: minmax(0, 1fr); }
  .stl-ok-ozet { position: static; }
  html.stl-std #stl-icerik .stl-ok-ozet .stl-ok-dugme { display: none; }
  html.stl-r-checkout-checkout .stl-alt-cubuk { display: none; }
  html.stl-r-checkout-checkout #stl-icerik { padding-bottom: 110px; }
  .stl-ok-cubuk { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 10030; display: flex; align-items: center; gap: 12px; height: 64px; padding: 6px 6px 6px 16px; border-radius: 22px; box-sizing: border-box;
    background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: blur(10px) saturate(1.5); backdrop-filter: blur(10px) saturate(1.5); box-shadow: 0 4px 6px rgba(43, 36, 41, .12), 0 0 16px rgba(43, 36, 41, .1); }
  .stl-ok-cubuk-toplam { display: grid; line-height: 1.15; white-space: nowrap; }
  .stl-ok-cubuk-toplam small { font-size: 11.5px; color: var(--soluk); }
  .stl-ok-cubuk-toplam b { font-size: 17px; font-variant-numeric: tabular-nums; }
  html.stl-std #stl-icerik .stl-ok-cubuk .btn { flex: 1; height: 50px; line-height: 48px; font-size: 15px; }
  html.stl-r-checkout-checkout .stl-bildirim { bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
}

/* ---------- Basari sayfasi (siparis, iade talebi) ---------- */
.stl-basari { max-width: 640px; margin: 10px auto 0; padding: 30px 28px; background: #fff; border: 1px solid var(--cizgi2); border-radius: 24px; text-align: center; }
.stl-basari-simge { position: relative; display: block; width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; background: #e8f5ec; }
.stl-basari-simge::after { content: ""; position: absolute; inset: 18px; background: #1d6a40; -webkit-mask: var(--i-tamam) center / contain no-repeat; mask: var(--i-tamam) center / contain no-repeat; }
html.stl-std #stl-icerik .stl-basari h1 { margin: 0 0 8px; font-size: clamp(24px, 3vw, 32px); }
.stl-basari-no { font-size: 16px; }
.stl-basari-metin { color: #4f474c; font-size: 14.5px; }
.stl-basari-banka { margin: 18px 0 4px; padding: 18px; border-radius: 16px; background: #faf7f8; text-align: left; font-size: 14px; }
html.stl-std #stl-icerik .stl-basari-banka h2 { margin: 0 0 8px; font-size: 18px; }
.stl-basari-ipucu { margin: 10px 0 0; font-size: 13px; color: var(--soluk); }
.stl-basari-dugmeler { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }

@media (max-width: 767px) {
  .stl-sk-ust, html.stl-std #stl-icerik .stl-sd-ozet { grid-template-columns: 1fr 1fr; }
  .stl-sk-ust .stl-durum, .stl-sd-ozet .stl-durum { grid-column: 1 / -1; }
  .stl-sk-alt { flex-wrap: wrap; }
  .stl-sk-ozet { flex-basis: 100%; order: 2; white-space: normal; }
  .stl-sk-detay { margin-left: auto; }
  .stl-ilerleme li { font-size: 11.5px; }
  .stl-sd-iki { grid-template-columns: 1fr; gap: 0; }
  .stl-sd-urunler li { grid-template-columns: 72px minmax(0, 1fr); grid-template-areas: "foto bilgi" "foto tutar" "islem islem"; }
  .stl-sd-foto { width: 72px; height: 72px; }
  .stl-sd-tutar { justify-self: start; }
  .stl-bilgi-liste > div { grid-template-columns: 1fr; gap: 2px; }
  .stl-iki-alan { grid-template-columns: 1fr; }
  .stl-iade-siparis li { flex-wrap: wrap; }
  .stl-iade-siparis li .btn { margin-left: 74px; }
  .stl-ok-bolum { padding: 18px 16px; border-radius: 18px; }
  .stl-ok-adimlar { gap: 16px; }
  .stl-ok-adimlar li { padding-right: 10px; font-size: 12.5px; }
  .stl-ok-adimlar li + li::before { width: 16px; }
  .stl-giris-alanlar { grid-template-columns: 1fr; }
  html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum fieldset#account, html.stl-r-checkout-checkout #stl-icerik .stl-ok-bolum fieldset#address,
  html.stl-r-checkout-checkout #stl-icerik #payment-new, html.stl-r-checkout-checkout #stl-icerik #shipping-new { grid-template-columns: 1fr; }
  .stl-basari { padding: 24px 18px; }
}

@media (max-width: 767px) {
  html.stl-std #stl-icerik #column-right, html.stl-std #stl-icerik #column-left { margin-top: 24px; }
  html.stl-std #stl-icerik .row > .col-sm-6 + .col-sm-6 { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--cizgi2); }
  html.stl-std #stl-icerik .well { padding: 20px 18px; }
}

/* ---------- Cerez bildirimi ---------- */
/* Ortalama transform'suz (left/right + margin auto): acilis animasyonu transform kullaniyor, ikisi cakisinca bildirim kayiyordu */
#stl-cerez { position: fixed; left: 16px; right: 16px; bottom: 20px; z-index: 10060; display: flex; align-items: center; gap: 20px; max-width: 760px; margin-inline: auto; padding: 16px 18px; box-sizing: border-box;
  border-radius: 18px; background: rgba(255, 255, 255, .78); border: 1px solid rgba(255, 255, 255, .8); -webkit-backdrop-filter: blur(18px) saturate(1.7); backdrop-filter: blur(18px) saturate(1.7);
  box-shadow: 0 16px 40px rgba(43, 36, 41, .2), inset 0 1px 0 rgba(255, 255, 255, .8); font-family: var(--govde); animation: stlCamAc .25s ease-out; }
#stl-cerez .stl-cerez-metin { flex: 1; min-width: 0; }
#stl-cerez .stl-cerez-baslik { display: block; margin: 0 0 3px; font: 500 16px/1.3 var(--baslik); color: var(--yazi); }
#stl-cerez p { margin: 0; font-size: 13px; line-height: 1.5; color: #4a4247; }
#stl-cerez p a { color: var(--gul) !important; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
#stl-cerez .stl-cerez-btns { display: flex; gap: 8px; }
#stl-cerez .stl-cerez-btns button { height: 42px; padding: 0 18px; border-radius: 999px; font: 600 14px/1 var(--govde); white-space: nowrap; cursor: pointer; }
#stl-cerez .stl-cerez-kabul { background: var(--gul); border: 1.5px solid var(--gul); color: #fff; }
#stl-cerez .stl-cerez-kabul:hover { background: var(--gul-koyu); border-color: var(--gul-koyu); }
#stl-cerez .stl-cerez-yonet { background: transparent; border: 1.5px solid var(--gul); color: var(--gul); }
#stl-cerez .stl-cerez-yonet:hover { background: var(--gul-acik); }
@media (max-width: 1023px) { #stl-cerez { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); } }
@media (max-width: 600px) {
  #stl-cerez { flex-direction: column; padding: 14px 14px 12px; gap: 10px; align-items: stretch; }
  #stl-cerez .stl-cerez-baslik { font-size: 15px; }
  #stl-cerez p { font-size: 12.5px; line-height: 1.45; }
  #stl-cerez .stl-cerez-btns button { flex: 1; height: 40px; padding: 0 10px; }
}
html.stl-cerez-panel-acik body { overflow: hidden; }
#stl-cerez-panel { position: fixed; inset: 0; z-index: 10080; display: grid; place-items: center; padding: 16px; background: rgba(43, 36, 41, .45); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); animation: stlSol .2s ease-out; }
#stl-cerez-panel .stl-cp-kutu { position: relative; width: 100%; max-width: 560px; max-height: calc(100dvh - 32px); overflow: auto; padding: 26px 26px 20px; border-radius: 22px; background: #fff; box-shadow: 0 24px 60px rgba(43, 36, 41, .3); font-family: var(--govde); color: var(--yazi); text-align: left; box-sizing: border-box; }
#stl-cerez-panel h2 { margin: 0 44px 8px 0; font: 400 24px/1.2 var(--baslik); color: var(--yazi); }
#stl-cerez-panel p { margin: 0; font-size: 13.5px; line-height: 1.55; color: #4a4247; }
#stl-cerez-panel p a { color: var(--gul) !important; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
#stl-cerez-panel button { font-family: inherit; cursor: pointer; }
#stl-cerez-panel .stl-cp-kapat { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: #f3f0f1; color: var(--yazi); font-size: 15px; line-height: 1; display: grid; place-items: center; }
#stl-cerez-panel .stl-cp-kapat:hover { background: #ebe4e7; }
#stl-cerez-panel .stl-cp-hepsi { display: flex; justify-content: flex-end; gap: 8px; margin: 16px 0 4px; }
#stl-cerez-panel .stl-cp-hepsi button { height: 40px; padding: 0 18px; border: 1.5px solid #d9d2d5; border-radius: 999px; background: #fff; color: var(--yazi); font-size: 14px; font-weight: 600; }
#stl-cerez-panel .stl-cp-hepsi button:hover { border-color: var(--gul); color: var(--gul); }
#stl-cerez-panel .stl-cp-grup { padding: 16px 0; border-top: 1px solid var(--cizgi2); }
#stl-cerez-panel .stl-cp-ust { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 6px; }
#stl-cerez-panel h3 { margin: 0; font: 700 16px/1.3 var(--govde); color: var(--yazi); }
#stl-cerez-panel .stl-cp-her { font-size: 12.5px; font-weight: 600; color: var(--gul); white-space: nowrap; }
#stl-cerez-panel .stl-cp-anahtar { position: relative; display: inline-block; flex: none; width: 46px; height: 26px; margin: 0; cursor: pointer; }
#stl-cerez-panel .stl-cp-anahtar input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; z-index: 1; }
#stl-cerez-panel .stl-cp-anahtar span[aria-hidden] { position: absolute; inset: 0; border-radius: 999px; background: #cfc7cb; transition: background .2s ease; }
#stl-cerez-panel .stl-cp-anahtar span[aria-hidden]::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); transition: transform .2s ease; }
#stl-cerez-panel .stl-cp-anahtar input:checked + span { background: var(--gul); }
#stl-cerez-panel .stl-cp-anahtar input:checked + span::after { transform: translateX(20px); }
#stl-cerez-panel .stl-cp-anahtar input:focus-visible + span { outline: 2px solid var(--gul); outline-offset: 2px; }
#stl-cerez-panel .stl-cp-gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#stl-cerez-panel .stl-cp-kaydet { display: block; width: 100%; height: 48px; margin-top: 6px; border: 0; border-radius: 999px; background: var(--gul); color: #fff; font-size: 15px; font-weight: 600; }
#stl-cerez-panel .stl-cp-kaydet:hover { background: var(--gul-koyu); }
@media (max-width: 600px) {
  #stl-cerez-panel { padding: 10px; align-items: end; }
  #stl-cerez-panel .stl-cp-kutu { padding: 22px 18px 16px; border-radius: 20px; max-height: calc(100dvh - 20px); }
  #stl-cerez-panel h2 { font-size: 21px; }
  #stl-cerez-panel .stl-cp-hepsi button { flex: 1; }
}

/* ---------- Varsayilan sablonlu sayfalar (Bootstrap): ortak parcalarin ustune yazilmasin ---------- */
html.stl-std body { font-family: var(--govde); font-size: 15px; color: var(--yazi); background: var(--zemin); }
html.stl-std .stl-baslik *, html.stl-std .stl-alt *, html.stl-std .stl-urun-serit *, html.stl-std .stl-alt-cubuk *, html.stl-std .stl-cekmece *, html.stl-std .stl-iletisim *, html.stl-std #stl-cerez * { box-sizing: border-box; }
html.stl-std #stl-icerik { padding-top: 10px; min-height: 40vh; }
html.stl-std #stl-icerik > .container { max-width: var(--sar); width: auto; padding-inline: 20px; }
@media (min-width: 1321px) { html.stl-std #stl-icerik > .container { padding-inline: 0; } } /* canli sitedeki gibi icerik 1280px, ust alanla ayni hizada */
html.stl-std .breadcrumb { background: transparent; padding: 8px 0; margin: 0 0 12px; font-size: 13px; }
html.stl-std .btn-primary { background: var(--gul); border-color: var(--gul); border-radius: 999px; }
html.stl-std .btn-primary:hover, html.stl-std .btn-primary:focus { background: var(--gul-koyu); border-color: var(--gul-koyu); }
html.stl-std #stl-icerik a:not(.btn) { color: var(--gul); }
html.stl-std #stl-icerik h1, html.stl-std #stl-icerik h2 { font-family: var(--baslik); font-weight: 300; color: var(--yazi); }

/* Varsayilan sablonlu uye sayfalari (Hesabim, Siparislerim, Adreslerim...): canli sitedeki Journal cercevesi.
   Baslik ustte (ust alanin 30px altinda), solda 990px icerik, sagda 260px "Hesabim" menusu (sol cizgi, icerikle ayni hizada). */
html.stl-std #stl-icerik .stl-yan-baslik { margin: 0 0 15px; font: 400 17px/1.2 var(--baslik); color: #333; }
@media (min-width: 1024px) {
  html.stl-std[class*="stl-r-account-"] #stl-icerik { padding-top: 0; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik > .container > .row { display: flex; margin: 0; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik > .container > .row > #content { float: none; flex: 1 1 auto; width: auto; min-width: 0; padding: 0 30px 20px 0; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik > .container > .row > #content > h1 { margin: 30px 0; letter-spacing: -0.015em; color: #333; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik > .container > .row > #column-right { float: none; flex: 0 0 260px; width: 260px; margin-top: 104px; padding: 0 0 30px 30px; border-left: 1px solid #e2e2e2; box-sizing: border-box; }
}
/* Basligi h2 olan sayfa (Adreslerim) ve "Siparislerim" geri baglantisi: baslik hizasi bozulmasin */
html.stl-std[class*="stl-r-account-"] #content { position: relative; }
html.stl-std[class*="stl-r-account-"] #content:not(:has(> h1)) > h2:first-of-type { margin: 30px 0; font: 300 clamp(28px, 3vw, 38px)/1.15 var(--baslik); letter-spacing: -0.015em; color: #333; }
html.stl-std[class*="stl-r-account-"] #content > .stl-geri { position: absolute; top: 4px; left: 0; margin: 0; }
/* Uye sayfalarindaki varsayilan formlar (Hesap bilgilerim, parola, adres): canli sitedeki kayit formu gibi
   (150px sol etiket, 500px alan, kirmizi yildiz sonda, tam genislikte yuvarlak Geri / Devam) */
html.stl-std[class*="stl-r-account-"] #stl-icerik legend { margin: 10px 0 15px; padding: 0; border: 0; font: 400 20px/30px var(--baslik); color: #333; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .form-group { display: flex; flex-wrap: wrap; align-items: flex-start; margin: 0 0 8px; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .control-label { display: flex; float: none; width: 150px; padding: 7px 0 5px; text-align: left; font-size: 14px; font-weight: 400; line-height: 21px; color: #333; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .form-group > div[class*="col-sm-"] { float: none; flex: 1; width: auto; min-width: 0; padding: 0; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-group.required .control-label::before { content: none; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-group.required .control-label::after { content: "*"; margin: 3px 0 0 3px; font-size: 17px; line-height: 17px; color: #dd0e1c; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .form-control { width: 500px; max-width: 100%; height: 42px; padding: 6px 12px; border: 1px solid #e6e1e2; border-radius: 10px; font: 400 14px/18.2px var(--govde); color: #555; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal textarea.form-control { height: auto; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons { display: flex; gap: 20px; margin-top: 20px; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons::before, html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons::after { content: none; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons .pull-left, html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons .pull-right { float: none !important; flex: 1; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons .btn { display: flex; align-items: center; justify-content: center; width: 100%; height: 39px; padding: 13px 18px; border: 0; border-radius: 999px; font: 700 13px/13px var(--govde); }
html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons .btn-default { background: var(--gul-koyu); color: #fff !important; }
html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons .btn-default:hover { background: var(--gul); }
@media (max-width: 1023px) {
  html.stl-std[class*="stl-r-account-"] #stl-icerik { padding-top: 0; }
  html.stl-std[class*="stl-r-account-"] #content > h1, html.stl-std[class*="stl-r-account-"] #content:not(:has(> h1)) > h2:first-of-type { margin: 30px 0 20px; font-size: 28px; }
  html.stl-std[class*="stl-r-account-"] #content > .stl-geri { top: 6px; }
}
@media (max-width: 767px) {
  html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .control-label { padding: 7px 0 2px; font-size: 12px; line-height: 18px; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .form-group > div[class*="col-sm-"] { flex-basis: 100%; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik .form-horizontal .form-control { width: 100%; font-size: 16px; }
  html.stl-std[class*="stl-r-account-"] #stl-icerik .buttons { flex-direction: column; gap: 10px; }
}

/* ---------- Cam desteklemeyen tarayici / seffaflik azaltma ---------- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .stl-cubuk::after, .stl-acilir, #stl-cerez, .stl-iletisim { background: rgba(255, 255, 255, .97); }
  .stl-alt-cubuk { background: #fbf9fa !important; }
  .stl-rozet { background: rgba(125, 42, 75, .92); }
  .stl-video-etiket, .stl-seviye { background: rgba(255, 255, 255, .94); }
}
@media (prefers-reduced-transparency: reduce) {
  .stl-cubuk::after, .stl-acilir, #stl-cerez, .stl-iletisim, .stl-alt-cubuk { background: #fff !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .stl-rozet { background: rgba(125, 42, 75, .94); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .stl-video-etiket, .stl-seviye { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  .stl-acilir, .stl-menu a, .stl-model-foto img, .stl-buton, .stl-arti, .stl-rozet-dizi p { transition: none; }
  .stl-cekmece, .stl-cekmece-kutu, .stl-iletisim, #stl-cerez, #stl-cerez-panel, .stl-bildirim { animation: none; }
}