/* ==========================================================================
   site.css — vmax.css'in ÜSTÜNE gelen küçük eklemeler.
   vmax.css'in zaten biçimlendirdiği hiçbir şey burada yeniden yazılmaz.
   1) Shopify base.css'ten taşınan birkaç kural (yalnızca görünür öğeler)
   2) Yukarı çık düğmesi
   3) Sabit WhatsApp + telefon düğmeleri (.fab)
   4) Ürün sayfası "Havale/EFT ile Satın Al" düğmesi (.cod-float)
   5) Sepet sayfası ürün listesi (.cart-*)
   6) Uyarı kutuları (.alert-ok / .alert-err)
   7) Genel form alanları (.form-*)
   8) Ürün sayfası ödeme kutusu — tek seçenek Havale / EFT (.pay-mini label.is-on)
   ========================================================================== */

/* ---------- 1. base.css'ten taşınanlar ---------- */
.visually-hidden{position:absolute!important;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);word-wrap:normal!important}
.skip-to-content-link:focus{z-index:9999;position:fixed;top:12px;left:12px;overflow:auto;width:auto;height:auto;margin:0;clip:auto;padding:12px 18px;border-radius:var(--r-full);background:var(--ink);color:var(--cream);font-weight:800;text-decoration:none;outline:2px solid var(--amber);outline-offset:2px}
.focus-none{box-shadow:none!important;outline:0!important}

/* ---------- 2. Yukarı çık düğmesi (Shrine "scroll-to-top-btn") ----------
   Bölümün kendi <style>'ı özgün değerleri (2.0rem, mobilde 1.5rem) birebir taşır. Düğme sabit
   WhatsApp/telefon düğmelerinin (.fab) üstünde dursun diye konum burada daha yüksek özgüllükle
   (.shopify-section + sınıf) 14px / 158px olarak ezilir; bölüm işaretlemesine dokunulmaz. */
.scroll-to-top-btn{--offset-x:2rem;--offset-y:2rem;--sticky-atc-offset:0px;position:fixed;bottom:calc(var(--offset-y) + var(--sticky-atc-offset) + var(--lift,0px));z-index:78;display:flex;justify-content:center;align-items:center;width:4rem;height:4rem;padding:.5rem;overflow:hidden;border:none;border-radius:50%;box-shadow:.1rem .1rem 1rem #0000004d;transition:.15s ease-in-out;cursor:pointer}
.shopify-section .scroll-to-top-btn-scroll-to-top-btn{--offset-x:14px;--offset-y:158px}
.scroll-to-top-btn-bottom-right{right:var(--offset-x)}
.scroll-to-top-btn-bottom-left{left:var(--offset-x)}
.scroll-to-top-btn-bottom-center{left:50%;transform:translate(-50%)}
.scroll-to-top-btn svg{width:2.2rem;height:2.2rem;pointer-events:none}
.scroll-to-top-btn.color-accent-1{background-color:#111;color:rgba(255,204,64,.9)}
.scroll-to-top-btn:hover{box-shadow:.1rem .2rem 1.4rem #00000066}

/* ---------- 3. Sabit WhatsApp + telefon düğmeleri ---------- */
.fab{position:fixed;right:18px;z-index:80;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.12);text-decoration:none;transition:transform .18s var(--ease-out),box-shadow .18s var(--ease-out),bottom .3s var(--ease-out)}
.fab:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.22),0 2px 4px rgba(0,0,0,.12)}
.fab:active{transform:translateY(1px)}
.fab svg{width:30px;height:30px;display:block}
.fab-tel svg{width:26px;height:26px}
.fab-wa{bottom:calc(90px + var(--lift,0px))}
.fab-tel{bottom:calc(24px + var(--lift,0px))}
/* Sabit alt satın alma çubuğu (.buybar) göründüğünde düğmeler onun üstüne kalkar (site.js ölçer) */
html.buybar-on{--lift:var(--buybar-h,0px)}

/* ---------- 4. Ürün sayfası: "Havale/EFT ile Satın Al" sabit düğmesi ---------- */
.cod-float{position:fixed;z-index:75;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 24px;border-radius:50px;background:#000;color:#fff;font-weight:800;font-size:15.5px;letter-spacing:-.01em;line-height:1.15;text-decoration:none;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.22),0 2px 6px rgba(0,0,0,.14);transition:transform .18s var(--ease-out),box-shadow .18s var(--ease-out);animation:cod-shake 6s ease-in-out infinite}
.cod-float svg{width:22px;height:22px;flex:none}
.cod-float:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.26),0 2px 6px rgba(0,0,0,.14)}
.cod-float:active{transform:translateY(1px)}
@media(max-width:749px){
  .cod-float{left:16px;right:88px;bottom:calc(16px + env(safe-area-inset-bottom));padding:0 16px;font-size:15px}
}
@media(min-width:750px){
  .cod-float{left:auto;right:92px;bottom:24px}
}
/* Mobilde/tablette sabit satın alma çubuğu, sabit satın alma düğmesinin (.cod-float) ÜSTÜNE kalkar */
@media(max-width:899px){
  html.has-cod-float .buybar{bottom:calc(var(--codbar-h,0px) + 84px);transform:translateY(calc(120% + 84px))}
  html.has-cod-float .buybar.on{transform:none}
  html.has-cod-float .buybar.is-hidden{transform:translateY(calc(120% + 84px))!important}
}
@keyframes cod-shake{
  0%,88%,100%{transform:translateX(0) rotate(0)}
  90%{transform:translateX(-3px) rotate(-1.5deg)}
  92%{transform:translateX(3px) rotate(1.5deg)}
  94%{transform:translateX(-3px) rotate(-1deg)}
  96%{transform:translateX(3px) rotate(1deg)}
  98%{transform:translateX(-1px) rotate(0)}
}
@media(prefers-reduced-motion:reduce){
  .cod-float{animation:none}
}

/* ---------- 6. Uyarı kutuları ---------- */
.alert-ok,.alert-err{border-radius:var(--r-sm);padding:14px 18px;margin:0 0 var(--sp-4);font-size:15px;font-weight:600;line-height:1.5;border:1px solid}
.alert-ok{background:rgba(30,138,95,.09);border-color:rgba(30,138,95,.35);color:#155e42}
.alert-err{background:rgba(179,38,30,.08);border-color:rgba(179,38,30,.35);color:#8a1c16}
.alert-ok a,.alert-err a{color:inherit;text-decoration:underline}
.alert-ok b,.alert-err b{font-weight:800}

/* ---------- 7. Genel form alanları (sipariş formu, sipariş sorgu, vb.) ---------- */
.form-row{margin:0 0 14px}
.form-grid-2{display:grid;gap:14px}
@media(min-width:620px){.form-grid-2{grid-template-columns:1fr 1fr}}
.form-label{display:block;margin:0 0 6px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.form-field,.form-select,.form-textarea{display:block;width:100%;font:inherit;font-size:15.5px;line-height:1.3;padding:13px 16px;border-radius:16px;border:1px solid var(--line);background:var(--paper);color:var(--ink);-webkit-appearance:none;appearance:none;transition:border-color .2s,box-shadow .2s}
.form-field::placeholder,.form-textarea::placeholder{color:var(--muted);opacity:.8}
.form-field:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(239,170,15,.18)}
.form-select{padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316130F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px 16px;cursor:pointer}
.form-select:disabled{color:var(--muted);cursor:not-allowed;background-color:var(--cream)}
.form-textarea{min-height:96px;resize:vertical}
.form-field.is-invalid,.form-select.is-invalid,.form-textarea.is-invalid{border-color:#b3261e}
.form-error{margin:6px 0 0;font-size:13px;font-weight:600;color:#b3261e}
.form-check{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;color:var(--ink-2);margin:0 0 12px}
.form-check input{width:18px;height:18px;margin:2px 0 0;flex:none;accent-color:var(--amber)}
.form-check a{text-decoration:underline}
.form-hint{margin:6px 0 0;font-size:13px;color:var(--muted);font-weight:600}
.form-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px;max-width:520px;margin:var(--sp-5) auto 0;box-shadow:var(--shadow-sm);color:var(--ink)}
@media(max-width:520px){.form-card{padding:18px 16px}}
.btn-dark{background:#000;color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.btn-dark:hover{background:#16130F}
.btn-block{width:100%}
.hp-alan{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;opacity:0}

/* ---------- 8. Ürün sayfası ödeme kutusu: tek seçenek Havale / EFT ----------
   Ödeme seçimi kalktı; .pay-mini içinde giriş (radio) olmayan tek bir <label class="is-on"> durur.
   vmax.css'in :has(input:checked) kuralıyla aynı görünüm, tıklanacak bir şey olmadığı için imleç düz. */
.pay-mini label.is-on{border-color:var(--amber);background:#ffc93317;cursor:default}
