/* ============================================================================
   fp_ux_pdp_mob_r1.css  -  29.10.2026
   URUN SAYFASI - MOBIL fiyat ve satin alma gorunurlugu.

   SORUN: mobilde buyuk kapak gorseli + guven alani ekranin tamamini
   dolduruyor; fiyat, platform secimi ve satin alma alani katlamanin cok
   altinda kaliyor.

   KAPSAM: TUM kurallar `.gs-product-page` altinda ve <=767.98px medya
   sorgusunda. Masaustu siparis ozeti (.gs-pd-buybox) ve satin alma isleyisi
   DOKUNULMAZ. Ikinci bir fiyat hesabi YOK: sabit seritteki tutar mevcut
   updateTotalPrice() akisinin `.js-pd-total-price-sync` kancasindan beslenir.

   GERI ALMA: bu dosyayi silmek + product.php'deki iki blogu kaldirmak
   eski gorunume birebir doner.
   ========================================================================== */

@media (max-width: 767.98px) {

    /* --- 1) Kompakt kapak -------------------------------------------------
       Oran BOZULMAZ, icerik KIRPILMAZ: cerceve genisligi daraltilir, yuksek
       ekranlarda bir miktar daha buyuk kalabilsin diye max-height degil
       max-width kullanilir (object-fit: cover degismiyor). */
    html body .gs-product-page .gs-cover {
        margin-inline: auto;
    }
    html body .gs-product-page .gs-cover-frame {
        max-width: min(62vw, 240px);
        margin-inline: auto;
    }
    @media (min-height: 760px) {
        html body .gs-product-page .gs-cover-frame {
            max-width: min(70vw, 280px);
        }
    }

    /* --- 2) Ust blok -------------------------------------------------------
       29.10.2026 (ikinci tur, kullanici karari): basliga eklenen ust fiyat
       satiri ve "Secenekler ve satin alma" kisayolu GERI ALINDI. Fiyat eskisi
       gibi sayfa icindeki satin alma seridinde kalir; o alana dokunulmaz.
       Buraya yeniden kural EKLENMEZ. */

    /* --- 2b) Kategori / platform pilleri YAN YANA -------------------------
       SORUN: pil seridi zaten `flex-wrap:wrap` idi, ama iki pil satira
       sigmadigi icin alt alta dusuyordu (390px'te olculdu: kapsayici 274px,
       pil genislikleri 147 + 163 + 6 bosluk = 316px).
       COZUM: sarma kapatilir, pillerin dolgusu/puntosu bir tik kucultulur ve
       etiketler gerekirse ucte "..." ile kisalir. Dar ekranda kisalma olur
       ama IKI PIL de gorunur kalir; kategori adi zaten hemen ustteki
       kirinti yolunda (breadcrumb) tam haliyle duruyor.

       !important ve derin secici ZORUNLU: ayni kurallari product.php
       icindeki satir ici <style> blogu (~2096) `html body .gs-product-page
       .gs-pd-mob-hero-head__top > .gs-pp-switch--mob ...` ile ve !important
       ile veriyor; o blok sayfada BU dosyadan SONRA geliyor. Bir sinif daha
       (.gs-pd-mob-hero-head) eklenerek ozgulluk yukseltildi.
       GERI ALMA: bu blogu silmek yeterli, pil serisi eski haline doner. */
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob {
        flex-wrap: nowrap !important;
        gap: 5px !important;
        min-width: 0 !important;
    }
    /* `__top` sag tarafta 42px'i favori (kalp) dugmesine AYIRIYOR; dugme ise
       yalniz GIRIS YAPMIS kullaniciya basiliyor. Misafirde o 42px bos duruyor
       ve pil etiketleri gereksiz yere kisaliyordu. Kalp yoksa ayirma kaldirilir
       -> etiketler cogu cihazda tam gorunur. :has() desteklenmeyen tarayicida
       kural uygulanmaz, davranis bugunku gibi kalir. */
    html body .gs-product-page .gs-pd-mob-hero-head:not(:has(.gs-pd-fav)) .gs-pd-mob-hero-head__top {
        padding-right: 0 !important;
    }
    /* Kalp VARSA: ayirma tum `__top` yerine YALNIZ pil satirina uygulanir.
       Kalp mutlak konumlu ve sadece BIRINCI satirda duruyor (olculdu:
       y=161, pil satiri); ikinci satirdaki puan/yorum ozeti o 42px'e
       ihtiyac duymuyordu ve bosu bosuna daraliyordu.
       Kural --dupcat (platform varyanti olan, grid duzenli) hale ozgu;
       diger yerlesimlerde eski davranis aynen korunur. */
    html body .gs-product-page .gs-pd-mob-hero-head--dupcat:has(.gs-pd-fav) .gs-pd-mob-hero-head__top {
        padding-right: 0 !important;
    }
    html body .gs-product-page .gs-pd-mob-hero-head--dupcat:has(.gs-pd-fav) .gs-pd-mob-hero-head__top > .gs-pp-switch--mob {
        padding-right: 42px !important;
    }
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob > .gs-pp-switch__btn {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        padding: 5px 9px !important;
        font-size: 11px !important;
        /* DIKKAT: butona `overflow:hidden` VERILMEZ. Secili pilin onay rozeti
           butonun DISINA tasan mutlak konumlu bir oge; gizlenince rozet
           kirpilip etiketin uzerine biniyor (olculdu). Kisaltma yalnizca
           etiket uzerinde yapilir. */
    }
    /* Secili pilin onay rozeti (::after) mutlak konumlu ve `right:-5px` ile
       butonun sag kenarina oturuyor; dar satirda etiketin son harfinin ve
       "..." isaretinin uzerine biniyordu. Sag dolgu rozet genisligi kadar
       artirilir, etiket rozetin solunda biter. */
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob > .gs-pp-switch__btn--active {
        padding-right: 20px !important;
    }
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob > .gs-pp-switch__btn > .gs-pp-switch__label {
        /* `display:block` SART: tema etiketi `display:flex` yapiyor ve
           text-overflow bir FLEX kapsayicinin anonim metnine UYGULANMIYOR;
           metin "..." olmadan sertce kesiliyordu (olculdu). */
        display: block !important;
        font-size: 11px !important;
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob > .gs-pp-switch__btn > .gs-pp-switch__logo,
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob > .gs-pp-switch__btn > i {
        flex: 0 0 auto !important;
        width: 16px !important;
        height: 16px !important;
        font-size: 15px !important;
    }
    /* Kalp (favori) dugmesi serit icindeyse kendi genisligini korusun. */
    html body .gs-product-page .gs-pd-mob-hero-head .gs-pd-mob-hero-head__top > .gs-pp-switch--mob > .gs-pd-fav {
        flex: 0 0 auto !important;
    }

    /* --- 3) Kompakt guven alani ------------------------------------------
       Ayrintilar ZATEN kullanici isteginle acilan <details> icinde
       (gs-pd-trust-collapse, mobilde kapali). Burada yalniz ozet satirinin
       kapladigi dusey alan kisaltilir. */
    html body .gs-product-page .gs-pd-photo-meta {
        margin-top: 10px !important;
    }
    html body .gs-product-page .gs-pd-etbis-bar {
        padding-block: 8px;
    }
    html body .gs-product-page .gs-etbis-symbol__img {
        width: 34px;
        height: 34px;
    }
    html body .gs-product-page .gs-pd-trustpanel .gs-logo-text .gs-auth-text,
    html body .gs-product-page .gs-pd-trustpanel .gs-logo-text .gs-dept-text {
        font-size: 8.5px;
        letter-spacing: 0.02em;
    }
    html body .gs-product-page .gs-pd-trustpanel .gs-logo-text .gs-reg-text {
        font-size: 10px;
    }
    html body .gs-product-page .gs-pd-license-disclosure__summary {
        padding-block: 8px;
    }
    /* Guven alani satin alma blogunun ALTINA tasindiginda ust bosluk
       (JS: fp_ux_pdp_mob_r1.js trustMover). Tasima yapilmazsa bu sinif hic
       olusmaz ve kural etkisizdir. */
    html body .gs-product-page .gs-pd-photo-meta.fp-ux-photo-meta--after-buy {
        margin-top: 14px !important;
    }

    /* --- 4) Sabit satin alma seridi ---------------------------------------
       Konum: mobil alt gezinmenin (ve varsa cerez bildiriminin) USTUNDE.
       Yukseklik fp_ux_overlays_r1.js tarafindan olculup --fp-ovl-buybar-h'ye
       yazilir; cerez bildirimi ve push kutusu o degeri kullanir. */
    html body .fp-ux-pdp-stickybuy {
        position: fixed;
        left: 0;
        right: 0;
        bottom: var(--fp-ovl-nav-h, 0px);
        z-index: 999;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 9px 12px 10px;
        background: rgba(11, 16, 24, 0.94);
        border-top: 1px solid rgba(255, 255, 255, 0.10);
        box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.45);
        -webkit-backdrop-filter: blur(14px) saturate(140%);
        backdrop-filter: blur(14px) saturate(140%);
        transform: translateY(120%);
        transition: transform 0.26s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.26s;
        will-change: transform;
        /* Kapaliyken ODAK SIRASINDAN da cikar (ekran okuyucu ve Tab). */
        visibility: hidden;
    }
    html body .fp-ux-pdp-stickybuy.is-on {
        transform: none;
        visibility: visible;
    }
    /* Alt gezinme kaydirmada gizlenince serit dibe iner ve guvenli alani alir. */
    html body.gs-pd-mobbars-hidden .fp-ux-pdp-stickybuy {
        bottom: 0;
        padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    }
    html body .fp-ux-pdp-stickybuy__price {
        display: flex;
        flex-direction: column;
        gap: 1px;
        min-width: 0;
        flex: 0 1 auto;
    }
    html body .fp-ux-pdp-stickybuy__lbl {
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: rgba(148, 163, 184, 0.9);
        line-height: 1.1;
    }
    html body .fp-ux-pdp-stickybuy__val {
        font-size: 17px;
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.01em;
        color: #f1f5f9;
        white-space: nowrap;
    }
    html body .fp-ux-pdp-stickybuy__actions {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-left: auto;
        min-width: 0;
        flex: 1 1 auto;
        justify-content: flex-end;
    }
    html body .fp-ux-pdp-stickybuy__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        min-height: 44px;
        padding: 10px 14px;
        border-radius: var(--fp-r, 12px);
        border: 1px solid transparent;
        font-size: 13.5px;
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: -0.01em;
        white-space: nowrap;
        cursor: pointer;
    }
    html body .fp-ux-pdp-stickybuy__btn--cart {
        background: rgba(255, 255, 255, 0.07);
        border-color: rgba(255, 255, 255, 0.16);
        color: #e2e8f0;
        flex: 0 0 auto;
        padding-inline: 12px;
    }
    html body .fp-ux-pdp-stickybuy__btn--buy {
        background: linear-gradient(135deg, #00c0ff, #0b74e8);
        color: #04121a;
        box-shadow: 0 8px 20px -8px rgba(11, 116, 232, 0.65);
        flex: 0 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* 375-430px: iki buton + tutar tek satira sigmiyordu, "Hemen Satin Al"
       ekranin disina tasiyordu (olculdu). Sepete Ekle ikona iner; erisilebilir
       ad butonun aria-label'inda KALIR. */
    @media (max-width: 430px) {
        html body .fp-ux-pdp-stickybuy__btn--cart .fp-ux-pdp-stickybuy__btn-lbl {
            display: none;
        }
        html body .fp-ux-pdp-stickybuy__btn--cart {
            padding-inline: 11px;
        }
        html body .fp-ux-pdp-stickybuy__btn--cart i {
            font-size: 19px;
        }
    }
    html body .fp-ux-pdp-stickybuy__btn:focus-visible {
        outline: 2px solid rgba(125, 211, 252, 0.9);
        outline-offset: 2px;
    }
    @media (max-width: 359.98px) {
        html body .fp-ux-pdp-stickybuy {
            gap: 8px;
            padding-inline: 10px;
        }
        html body .fp-ux-pdp-stickybuy__val { font-size: 15.5px; }
        html body .fp-ux-pdp-stickybuy__btn { font-size: 12.5px; padding-inline: 11px; }
        html body .fp-ux-pdp-stickybuy__btn--cart .fp-ux-pdp-stickybuy__btn-lbl { display: none; }
    }

    /* Sayfa sonu seridin ALTINDA kalmasin. */
    html body.fp-ux-pdp-has-stickybuy {
        padding-bottom: calc(var(--fp-ovl-buybar-h, 0px) + 8px);
    }

    @media (prefers-reduced-motion: reduce) {
        html body .fp-ux-pdp-stickybuy { transition: none; }
    }
}

/* Masaustunde serit HIC render edilmesin (markup d-md-none ile de korunur). */
@media (min-width: 768px) {
    html body .fp-ux-pdp-stickybuy {
        display: none !important;
    }
}
