/* ============================================================
   URUN DETAY SAYFASI — hm-ur / hm-kargo / hm-oneri   v2
   Dosya: assets/css/urun.css
   Yukleme sirasi: ... → urun-kart.css → kategori.css → urun.css → footer.css
   Bagimlilik: theme.css token'lari

   v2: bilgi karti sadelestirildi, secim kutulari yenilendi, kargo paneli
       kompakt + acilir hale getirildi, mobilde sabit aksiyon cubugu eklendi.
   ============================================================ */

.hm-ur{font-family:var(--font);}

/* ============================================================
   0) BREADCRUMB
   Eskiden ust linkler koyu/kalin, bulunulan sayfa acik griydi —
   tam tersi olmali. Kontrast bilincli olarak esikte tutuldu:
   #667380 beyaz uzerinde 4.85:1 (WCAG AA siniri 4.5:1).
   ============================================================ */
.hm-crumbwrap{
    padding:10px 0!important;
    background:#fff;
    border-bottom:1px solid var(--c-border);
}
.hm-crumb{
    display:flex!important;align-items:center;flex-wrap:wrap;gap:5px;
    margin:0!important;padding:0!important;
    background:none!important;
    font-size:12.5px;line-height:1.5;
}
.hm-crumb a{
    color:#667380!important;
    font-size:12.5px;font-weight:500!important;
    text-decoration:none;
    transition:color .16s ease;
}
.hm-crumb a:hover{color:var(--c-orange)!important;}
.hm-crumb strong{
    font-size:12.5px;font-weight:700;color:var(--c-slate);
    overflow:hidden;text-overflow:ellipsis;
}
.hm-crumb i{font-size:12px;margin-right:2px;}
/* tema kalintisina karsi: Bootstrap .breadcrumb-item::before "/" basiyor,
   tema de a::after ile ayrica ayirici koyabiliyor. Ikisi de susturuldu. */
.hm-crumb::before,
.hm-crumb::after,
.hm-crumb a::before,
.hm-crumb a::after,
.hm-crumb strong::before,
.hm-crumb strong::after{content:none!important;display:none!important;}
.hm-crumb li{list-style:none!important;}
/* ayirici: tema bazen bos <span> basiyor, onu ok'a ceviriyoruz */
.hm-crumb > span{
    display:inline-block;width:5px;height:5px;
    border-top:1.5px solid #C4CBD2;border-right:1.5px solid #C4CBD2;
    transform:rotate(45deg);
    margin:0 3px;flex:0 0 auto;
}


/* ------------------------------------------------------------
   TEMA SARMALAYICILARININ CERCEVESI KALDIRILDI
   Tema bu div'lerin hepsine cerceve + radius + golge basabiliyor.
   Icerideki bloklarin (guven bandi, akordiyon, urun kartlari) kendi
   cercevesi oldugu icin kutu-icinde-kutu goruntusu olusuyordu.
   TEK TEK degil TOPTAN sifirliyoruz ki bir sonraki sarmalayicida
   ayni sorun tekrar cikmasin. Kendi hm-* bloklarim etkilenmez.
   ------------------------------------------------------------ */
.hm-ur .product-detail,
.hm-ur .accordion-detail,
.hm-ur .product-info,
.hm-ur .tab-content,
.hm-ur .tab-pane,
.hm-ur .tab-style3,
.hm-ur .product-info-inner,
.hm-ur .single-content{
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
}

/* ------------------------------------------------------------
   FLOAT NOTRLESTIRME
   Tema bu alani float ile diziyor (.attr-detail, .detail-qty,
   .product-extra-link2 ...). Float'lar akistan ciktigi icin benim
   bloklarim onlarin hizasindan basliyor ve saga sikisiyordu:
   once kargo panelinin basligi, sonra guven seridi boyle kacti.
   Kart icindeki tum float'lari kapatiyoruz — bloklar zaten tam
   genislik, gorunum kaybi yok.
   ------------------------------------------------------------ */
.hm-ur .detail-info > *,
.hm-ur .attr-detail,
.hm-ur .detail-extralink,
.hm-ur .detail-extralink > *,
.hm-ur .product-extra-link2 > *,
.hm-ur .product-price-cover,
.hm-ur__fiyatblok,
.hm-ur__fiyat,
.hm-ur .product-price,
.hm-ur__secimler,
.hm-ur .short-desc{float:none!important;}

/* fiyat bloku her zaman kendi satirinda ve tam genislikte olsun */
.hm-ur__fiyatblok{clear:both;width:100%;}
.hm-ur__fiyat,
.hm-ur .product-price{width:100%;}
.hm-ur .current-price{flex:0 1 auto;min-width:0;}

.hm-ur .attr-detail{width:100%;}
.hm-ur .detail-info::after{content:'';display:table;clear:both;}


/* ============================================================
   1) BASLIK + FIYAT
   ============================================================ */
.hm-ur__h1{
    margin:0 0 var(--s2);
    font-size:24px;font-weight:800;line-height:1.25;
    letter-spacing:-.02em;color:var(--c-slate);
}

.hm-ur__fiyatblok{margin-bottom:var(--s2);}

.hm-ur__baslayan{
    display:inline-block;margin-bottom:2px;
    font-size:11px;font-weight:700;color:var(--c-muted);
    letter-spacing:.01em;
}

.hm-ur .product-price,
.hm-ur__fiyat{
    display:flex;flex-wrap:wrap;align-items:baseline;
    gap:4px 10px;min-width:0;
}
.hm-ur .current-price{
    font-size:30px;font-weight:800;color:var(--c-orange);
    letter-spacing:-.02em;line-height:1.1;
}
.hm-ur__kdvet{
    font-size:17px;font-weight:700;color:var(--c-orange);
    letter-spacing:-.01em;
}
.hm-ur__secbekle{
    font-size:19px!important;font-weight:700!important;
    color:var(--c-slate)!important;
}
.hm-ur__ind{
    display:inline-block;padding:3px 9px;
    background:var(--c-orange);color:#fff;
    font-size:12px;font-weight:800;border-radius:var(--r-pill);
}
.hm-ur__eski{
    font-size:14px;font-weight:600;color:var(--c-muted);
    text-decoration:line-through;
}
.hm-ur__dahil{
    margin-top:3px;
    font-size:13.5px;font-weight:500;color:var(--c-muted);
}
.hm-ur__dahil:empty{display:none;}
.hm-ur__m2{
    margin-top:5px;
    font-size:13px;font-weight:700;color:var(--c-slate);
}
.hm-ur__m2 span{font-weight:600;color:var(--c-muted);}

.hm-ur__kod{
    margin:0 0 10px;
    font-size:11.5px;font-weight:600;color:var(--c-muted);
    letter-spacing:.02em;
}
.hm-ur__lead{
    margin:0 0 var(--s3);
    font-size:13.5px;line-height:1.6;color:var(--c-muted);
    max-width:62ch;
}


/* ============================================================
   2) VARYANT SECIMLERI
   ============================================================ */
.hm-ur__secimler{margin-bottom:var(--s2);}
.hm-ur__satir{margin-bottom:12px;}
.hm-ur__etiket{
    display:block;margin-bottom:6px;
    font-size:12.5px;font-weight:700;color:var(--c-slate);
    letter-spacing:-.01em;
}
.hm-ur__sec,
.hm-ur select.variant-select:not(.hm-kargo__gizli){
    appearance:none;-webkit-appearance:none;-moz-appearance:none;
    display:block;
    width:100%!important;
    max-width:100%!important;
    min-height:50px;
    padding:13px 44px 13px 14px!important;
    background-color:#fff;
    /* ok isareti select'in KENDI arka plani — ayri bir oge olmadigi icin
       tema select genisligini kisitlasa bile disarida kalamaz */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8894' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 14px center;
    background-size:18px 18px;
    border:1.5px solid var(--c-border);
    border-radius:var(--r-md);
    font-family:var(--font);font-size:15px;font-weight:600;
    color:var(--c-slate);
    line-height:1.3;
    cursor:pointer;
    transition:border-color .16s ease, box-shadow .16s ease;
}
.hm-ur__sec:hover{border-color:#C4CBD2;}
.hm-ur__sec:focus{
    outline:none;border-color:var(--c-orange);
    box-shadow:0 0 0 3px rgba(253,87,34,.13);
}


/* ============================================================
   3) KARGO / KIRILMA ONAYI — kompakt + acilir
   ============================================================ */
.hm-kargo{
    clear:both;
    margin:0 0 var(--s3);
    padding:14px;
    background:#FFF8F5;
    border:1px solid rgba(253,87,34,.26);
    border-radius:var(--r-md);
    transition:border-color .2s ease, box-shadow .2s ease;
}
.hm-kargo.is-hata{
    border-color:var(--c-orange);
    box-shadow:0 0 0 4px rgba(253,87,34,.14);
}

/* gorsel olarak gizli ama DOM'da ve form icinde: varyant anahtarini tasiyor.
   !important sart — baska bir select kurali genisligini ezerse sayfa yana kayar. */
.hm-kargo__gizli{
    position:absolute!important;
    width:1px!important;height:1px!important;
    min-height:0!important;max-width:1px!important;
    padding:0!important;margin:-1px!important;
    overflow:hidden!important;clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;border:0!important;
    appearance:none!important;
}

.hm-kargo__ust{
    display:flex;align-items:flex-start;gap:10px;
    width:100%;float:none;position:static;
    margin-bottom:10px;
}
.hm-kargo__ic{flex:0 0 auto;width:20px;height:20px;margin-top:1px;color:var(--c-orange);}
.hm-kargo__ic svg{
    width:100%;height:100%;display:block;
    fill:none;stroke:currentColor;stroke-width:1.9;
    stroke-linecap:round;stroke-linejoin:round;
}
.hm-kargo__ozet{
    flex:1 1 auto;min-width:0;
    font-size:12.5px;line-height:1.55;color:var(--c-text);
}
.hm-kargo__ozet strong{
    display:block;margin-bottom:1px;
    font-size:13.5px;font-weight:800;color:var(--c-slate);
    letter-spacing:-.01em;
}

.hm-kargo__wa{
    display:flex;align-items:center;justify-content:center;gap:7px;
    width:100%;
    padding:11px;
    background:var(--c-wa);color:#fff!important;
    font-size:13.5px;font-weight:700;
    text-decoration:none!important;
    border-radius:var(--r-sm);
    transition:filter .2s ease;
}
.hm-kargo__wa:hover{filter:brightness(.93);}
.hm-kargo__wa i{font-size:16px;}

/* --- detay: max-height ile kirpiliyor, display:none DEGIL --- */
.hm-kargo__cb{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.hm-kargo__detay{
    max-height:0;overflow:hidden;
    transition:max-height .25s ease;
}
.hm-kargo__cb:checked ~ .hm-kargo__detay{max-height:400px;}
.hm-kargo__detay p{
    margin:12px 0 8px;
    font-size:12.5px;line-height:1.6;color:var(--c-text);
}
.hm-kargo__detay ul{
    margin:0;padding-left:17px;
    font-size:12.5px;line-height:1.65;color:var(--c-text);
}
.hm-kargo__detay strong{font-weight:700;color:var(--c-slate);}

.hm-kargo__ac{
    display:inline-flex;align-items:center;gap:5px;
    margin:10px 0 12px;
    font-size:12.5px;font-weight:700;color:var(--c-slate);
    cursor:pointer;user-select:none;
    text-decoration:underline;text-underline-offset:2px;
}
.hm-kargo__ac:hover{color:var(--c-orange);}
.hm-kargo__ac svg{
    width:13px;height:13px;
    fill:none;stroke:currentColor;stroke-width:2.4;
    stroke-linecap:round;stroke-linejoin:round;
    transition:transform .2s ease;
}
.hm-kargo__ac [data-kapa]{display:none;}
.hm-kargo__cb:checked ~ .hm-kargo__ac [data-ac]{display:none;}
.hm-kargo__cb:checked ~ .hm-kargo__ac [data-kapa]{display:inline;}
.hm-kargo__cb:checked ~ .hm-kargo__ac svg{transform:rotate(180deg);}

/* --- onay kutusu --- */
.hm-kargo__onay{
    display:flex;align-items:center;gap:10px;
    padding:12px;
    background:#fff;
    border:1.5px solid var(--c-border);
    border-radius:var(--r-sm);
    cursor:pointer;
    transition:border-color .18s ease;
}
.hm-kargo__onay:hover{border-color:var(--c-orange);}
.hm-kargo__onay input{position:absolute;opacity:0;width:1px;height:1px;}
.hm-kargo__kutu{
    flex:0 0 auto;
    width:22px;height:22px;
    border:2px solid #C4CBD2;border-radius:6px;background:#fff;
    position:relative;
    transition:background .16s ease, border-color .16s ease;
}
.hm-kargo__onay input:checked ~ .hm-kargo__kutu{background:var(--c-orange);border-color:var(--c-orange);}
.hm-kargo__onay input:checked ~ .hm-kargo__kutu::after{
    content:'';position:absolute;left:6.5px;top:2.5px;
    width:5px;height:10px;
    border-right:2.5px solid #fff;border-bottom:2.5px solid #fff;
    transform:rotate(45deg);
}
.hm-kargo__onay input:focus-visible ~ .hm-kargo__kutu{outline:2px solid var(--c-orange);outline-offset:2px;}
.hm-kargo__metin{font-size:13px;font-weight:600;line-height:1.4;color:var(--c-slate);}


/* ============================================================
   4) AKSIYON SATIRI — tema siniflari KULLANILMIYOR
   Kendi izgaramiz: adet | ana buton | WhatsApp | favori
   ============================================================ */
.hm-ur__aksiyon{
    clear:both;
    display:grid;
    grid-template-columns:auto minmax(0,1.6fr) minmax(0,1fr) auto;
    gap:10px;
    align-items:stretch;
    margin-bottom:var(--s2);
}

/* --- adet --- */
.hm-ur__adet{
    display:flex;align-items:center;
    border:1.5px solid var(--c-border);
    border-radius:var(--r-md);
    background:#fff;overflow:hidden;
}
.hm-ur__adet-b{
    width:38px;height:48px;padding:0;
    background:none;border:0;cursor:pointer;
    font-family:var(--font);font-size:19px;font-weight:600;
    color:var(--c-slate);line-height:1;
    transition:background .15s ease,color .15s ease;
}
.hm-ur__adet-b:hover{background:#F4F5F7;color:var(--c-orange);}
.hm-ur__adet .qty-val{
    min-width:26px;text-align:center;
    font-size:15px;font-weight:700;color:var(--c-slate);
}

/* --- ana buton: Sepete Ekle / Teklif Al ayni yeri paylasir --- */
.hm-ur__ekle{
    grid-column:2;
    display:flex;align-items:center;justify-content:center;
    min-height:52px;padding:0 16px;
    background:var(--c-orange);color:#fff!important;
    font-family:var(--font);font-size:15px;font-weight:700;
    text-align:center;text-decoration:none!important;
    border:0;border-radius:var(--r-md);cursor:pointer;
    transition:background .18s ease;
}
.hm-ur__ekle:hover{background:#E14A17;}
.hm-ur__ekle--teklif{background:var(--c-wa);}
.hm-ur__ekle--teklif:hover{background:#268A79;}
.hm-ur__ekle[hidden]{display:none!important;}

/* --- WhatsApp --- */
.hm-ur__wa{
    display:flex;align-items:center;justify-content:center;gap:7px;
    min-height:52px;padding:0 12px;
    background:#25A55E;color:#fff!important;
    font-size:14px;font-weight:700;
    text-decoration:none!important;
    border-radius:var(--r-md);
    transition:filter .18s ease;
}
.hm-ur__wa:hover{filter:brightness(.93);}
.hm-ur__wa svg{
    width:19px;height:19px;flex:0 0 auto;
    fill:currentColor;stroke:none;
}
.hm-ur__wa span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* --- favori --- */
.hm-ur__fav{
    display:flex;align-items:center;justify-content:center;
    width:52px;min-height:52px;padding:0;
    background:#fff;color:var(--c-slate);
    border:1.5px solid var(--c-border);border-radius:var(--r-md);
    cursor:pointer;
    transition:border-color .16s ease,color .16s ease;
}
.hm-ur__fav:hover,
.hm-ur__fav.aktif{border-color:var(--c-orange);color:var(--c-orange);}
.hm-ur__fav svg{
    width:20px;height:20px;
    fill:none;stroke:currentColor;stroke-width:1.8;
    stroke-linejoin:round;
}


/* ============================================================
   5) GUVEN SERIDI — urun kartinin altinda tam genislik bant
   ============================================================ */
.hm-guven{
    margin:var(--s5) 0 var(--s4);
    padding:var(--s3) var(--s3);
    background:#FAFBFB;
    border:1px solid var(--c-border);
    border-radius:var(--r-lg);          /* site genelinde kose yuvarlak — kare kalmisti */
}
.hm-guven__ic{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:var(--s3);
}
.hm-guven__o{
    display:flex;align-items:flex-start;gap:12px;
    padding-right:var(--s3);
    border-right:1px solid var(--c-border);
}
.hm-guven__o:last-child{border-right:0;padding-right:0;}

/* ikon: yuvarlatilmis kare, acik turuncu zemin, tek agirlikta cizgi ikon */
.hm-guven__ik{
    flex:0 0 auto;
    display:flex;align-items:center;justify-content:center;
    width:42px;height:42px;
    background:rgba(253,87,34,.09);
    border-radius:var(--r-md);
}
.hm-guven__ik svg{
    width:21px;height:21px;display:block;
    fill:none;stroke:var(--c-orange);stroke-width:1.7;
    stroke-linecap:round;stroke-linejoin:round;
}
.hm-guven__tx{min-width:0;}
.hm-guven__o h3{
    margin:1px 0 3px;
    font-size:13px;font-weight:800;color:var(--c-slate);
    letter-spacing:-.01em;
}
.hm-guven__o p{
    margin:0;
    font-size:12.5px;line-height:1.5;color:#667380;
}


/* ============================================================
   6) STOK YOK
   ============================================================ */
.hm-ur__stokyok{
    clear:both;
    margin-bottom:var(--s2);
    padding:11px 13px;
    background:#F7F8F9;
    border-left:3px solid var(--c-orange);
    border-radius:0 var(--r-sm) var(--r-sm) 0;
    font-size:12.5px;line-height:1.55;color:var(--c-text);
}
.hm-ur__stokyok strong{display:block;color:var(--c-slate);font-weight:700;margin-bottom:2px;}
.hm-ur__stokyok[hidden]{display:none!important;}

.hm-ur__uyari{
    padding:11px 13px;margin-bottom:10px;
    background:#FFF4E8;color:#8A5B00;
    border:1px solid #FFD9A8;border-radius:var(--r-sm);
    font-size:13px;line-height:1.5;
}
.hm-ur__uyari .missing-pill{
    display:inline-block;padding:2px 8px;margin:0 2px;
    background:#fff;border:1px solid #FFD9A8;border-radius:var(--r-pill);
    font-weight:700;
}


/* ============================================================
   7) MOBIL SABIT AKSIYON CUBUGU
   ============================================================ */
.hm-ur__bar{
    display:none;
    position:fixed;left:0;right:0;bottom:0;z-index:900;
    align-items:center;gap:12px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:#fff;
    border-top:1px solid var(--c-border);
    box-shadow:0 -6px 22px rgba(37,61,78,.10);
    transform:translateY(110%);
    transition:transform .24s cubic-bezier(.4,0,.2,1);
}
.hm-ur__bar.is-acik{transform:none;}
.hm-ur__bar-f{flex:1 1 auto;min-width:0;line-height:1.2;}
.hm-ur__bar-lbl{display:block;font-size:10.5px;font-weight:600;color:var(--c-muted);}
.hm-ur__bar-f strong{
    display:block;
    font-size:17px;font-weight:800;color:var(--c-orange);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hm-ur__bar-btn{
    flex:0 0 auto;
    padding:13px 22px;
    background:var(--c-orange);color:#fff;
    font-family:var(--font);font-size:14.5px;font-weight:700;
    border:0;border-radius:var(--r-md);cursor:pointer;
}


/* ============================================================
   8) ACIKLAMA SEKMESI
   ============================================================ */
.hm-ur__aciklama{
    font-size:14px;line-height:1.75;color:var(--c-text);
    max-width:88ch;
}
.hm-ur__aciklama h1,
.hm-ur__aciklama h2,
.hm-ur__aciklama h3,
.hm-ur__aciklama h4{
    margin:var(--s4) 0 var(--s1);
    font-size:16px;font-weight:800;color:var(--c-slate);
}
.hm-ur__aciklama p{margin:0 0 var(--s2);}
.hm-ur__aciklama ul,
.hm-ur__aciklama ol{margin:0 0 var(--s2);padding-left:20px;}
.hm-ur__aciklama li{margin-bottom:6px;}
.hm-ur__aciklama a{color:var(--c-orange);text-decoration:underline;}
.hm-ur__aciklama img{max-width:100%;height:auto;border-radius:var(--r-sm);}
.hm-ur__aciklama table{width:100%;border-collapse:collapse;margin:0 0 var(--s3);font-size:13px;}
.hm-ur__aciklama th,
.hm-ur__aciklama td{border:1px solid var(--c-border);padding:8px 10px;text-align:left;}
.hm-ur__aciklama th{background:#F7F8F9;font-weight:700;color:var(--c-slate);}

/* ---- URUN ACIKLAMASI: KIRPILMIS, KATLANMAMIS ----
   display:none KULLANILMIYOR. Metin ekranda cizili duruyor, sadece
   taşan kismi max-height ile kesiliyor — Google'in "gorunur icerik"
   tarafinda kaliyoruz. Ac/kapa saf CSS (gizli checkbox), JS yok. */
.hm-ur__acik{
    margin-top:var(--s4);
    width:100%;clear:both;
}
.hm-ur__acik-h{
    margin:0 0 var(--s2)!important;
    font-size:18px;font-weight:800;color:var(--c-slate);letter-spacing:-.01em;
    line-height:1.3;
}
.hm-ur__acik-cb{
    position:absolute!important;width:1px!important;height:1px!important;
    opacity:0;pointer-events:none;margin:0;padding:0;
}
.hm-ur__acik-tx{
    position:relative;
    max-height:230px;overflow:hidden;
    max-width:88ch;
}
.hm-ur__acik-tx::after{
    content:'';
    position:absolute;left:0;right:0;bottom:0;height:110px;
    background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, #fff 82%);
    pointer-events:none;
}
.hm-ur__acik-cb:checked ~ .hm-ur__acik-tx{max-height:none;}
.hm-ur__acik-cb:checked ~ .hm-ur__acik-tx::after{display:none;}
/* aciklama kisaysa JS bu sinifi ekler: kirpma da geçiş de kalkar */
.hm-ur__acik-tx.is-kisa{max-height:none;}
.hm-ur__acik-tx.is-kisa::after{display:none;}

.hm-ur__acik-more{
    display:inline-flex;align-items:center;gap:6px;
    margin-top:var(--s2);
    padding:9px 16px;
    background:#fff;border:1px solid var(--c-border);border-radius:var(--r-pill);
    font-size:13px;font-weight:700;color:var(--c-slate);
    cursor:pointer;user-select:none;
    transition:border-color .16s ease,color .16s ease,background .16s ease;
}
.hm-ur__acik-more:hover{border-color:var(--c-orange);color:var(--c-orange);}
.hm-ur__acik-more svg{
    width:15px;height:15px;
    fill:none;stroke:currentColor;stroke-width:2.4;
    stroke-linecap:round;stroke-linejoin:round;
    transition:transform .2s ease;
}
.hm-ur__acik-more [data-kapa]{display:none;}
.hm-ur__acik-cb:checked ~ .hm-ur__acik-more [data-ac]{display:none;}
.hm-ur__acik-cb:checked ~ .hm-ur__acik-more [data-kapa]{display:inline;}
.hm-ur__acik-cb:checked ~ .hm-ur__acik-more svg{transform:rotate(180deg);}
.hm-ur__acik-cb:focus-visible ~ .hm-ur__acik-more{
    outline:2px solid var(--c-orange);outline-offset:2px;
}


/* ---- AKORDIYON (sekme yerine) ----
   <details>/<summary> — JS yok, klavye ve ekran okuyucuyla calisir.
   Iki panel de kapali acilir; icerik DOM'da durdugu icin SEO etkilenmez.
   Dis cerceve KALDIRILDI: kutu ici kutu gorunumu olusuyordu. Basliklar
   tam genislikte serit, panel ic metni de tam genislikte akiyor. */
/* .product-info = aciklama + yorumlari saran TEMA div'i.
   Cerceveyi cizen buydu. Gecen tur .product-detail'i sifirlamistim,
   yanlis eleman. Burada cerceve/radius/golge/zemin tamamen kalkiyor. */
.hm-ur .product-info{
    padding:0!important;
    margin-left:0!important;margin-right:0!important;
    float:none!important;width:100%!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
}
.hm-akordiyon{
    margin-top:var(--s4);margin-bottom:var(--s4);
    width:100%;clear:both;
}
.hm-ak{
    margin-bottom:10px;
    border:0;
    border-radius:var(--r-md);
    overflow:hidden;
    background:transparent;
    width:100%;
}
.hm-ak__bas{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:15px 18px;
    background:#F5F7F8;
    border-radius:var(--r-md);
    font-size:14.5px;font-weight:800;color:var(--c-slate);
    letter-spacing:-.01em;
    cursor:pointer;list-style:none;
    transition:background .18s ease,color .18s ease,border-radius .18s ease;
}
.hm-ak__bas::-webkit-details-marker{display:none;}
.hm-ak__bas:hover{background:#EFF1F3;}
.hm-ak__bas svg{
    width:18px;height:18px;flex:0 0 auto;
    fill:none;stroke:currentColor;stroke-width:2.4;
    stroke-linecap:round;stroke-linejoin:round;
    transition:transform .2s ease;
}
.hm-ak[open] > .hm-ak__bas{
    background:var(--c-orange);color:#fff;
    border-radius:var(--r-md) var(--r-md) 0 0;
}
.hm-ak[open] > .hm-ak__bas svg{transform:rotate(180deg);}
.hm-ak__bas:focus-visible{outline:2px solid var(--c-orange);outline-offset:-2px;}
.hm-ak__ic{
    padding:var(--s3) 18px var(--s4);
    background:#fff;
    border:1px solid var(--c-border);border-top:0;
    border-radius:0 0 var(--r-md) var(--r-md);
}
.hm-ak__ic > *:first-child{margin-top:0;}
.hm-ak__ic > *:last-child{margin-bottom:0;}


/* ============================================================
   9) ONERILEN URUNLER — 4'lu tek sira
   ============================================================ */
.hm-oneri{margin-top:var(--s5);margin-bottom:var(--s5);}
.hm-oneri__h{
    margin:0 0 var(--s3);
    font-size:19px;font-weight:800;color:var(--c-slate);
    letter-spacing:-.01em;
}
.hm-oneri__grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:var(--s3);
}
.hm-oneri__grid > .hm-pc{margin-bottom:0;}
.hm-oneri__grid .hm-pc__chip:nth-child(n+3){display:none;}


/* ============================================================
   10) YORUM YILDIZLARI
   ============================================================ */
.star-rating{font-size:24px;cursor:pointer;color:#FFB400;margin-bottom:20px;}
.star-rating .las{margin-right:5px;transition:color .2s ease;}
.star-rating .las.empty{color:#DDD;}


/* ============================================================
   11) RESPONSIVE
   ============================================================ */
@media (max-width:1199px){
  .hm-oneri__grid{grid-template-columns:repeat(3, minmax(0,1fr));}
  .hm-guven__ic{grid-template-columns:repeat(2, minmax(0,1fr));gap:var(--s3) var(--s4);}
  .hm-guven__o:nth-child(2n){border-right:0;padding-right:0;}
}

@media (max-width:991px){
  .hm-ur__h1{font-size:21px;}
  .hm-oneri__grid{grid-template-columns:repeat(3, minmax(0,1fr));}
}

@media (max-width:767px){
  /* Kart icerigi dis cizgiye yapismasin — yatay padding sifirlanmisti */
  .hm-ur .detail-info{padding:var(--s3) var(--s2) var(--s2)!important;}
  .hm-ur .detail-gallery{padding:var(--s2) var(--s2) 0;}
  .hm-crumbwrap{padding:8px 0!important;}
  .hm-crumb,.hm-crumb a,.hm-crumb strong{font-size:11.5px;}
  .hm-ur__h1{font-size:19px;margin-bottom:12px;}
  .hm-ur .current-price{font-size:26px;}
  .hm-ur__kdvet{font-size:15px;}
  .hm-ur__secbekle{font-size:17px!important;}
  .hm-ur__lead{font-size:13px;margin-bottom:var(--s2);}

  /* 16px: iOS Safari daha kucuk fontta odaklaninca sayfayi zumlar */
  .hm-ur__sec,
  .hm-ur select.variant-select:not(.hm-kargo__gizli){min-height:52px;font-size:16px;}

  .hm-kargo{padding:12px;}
  .hm-kargo__ozet{font-size:12px;}

  /* aksiyon: ust satir adet + ana buton, alt satir WhatsApp + favori */
  .hm-ur__aksiyon{
      grid-template-columns:auto minmax(0,1fr) auto;
      gap:8px;
  }
  .hm-ur__ekle{grid-column:2;}
  .hm-ur__wa{grid-column:1 / span 2;}
  .hm-ur__fav{grid-column:3;}

  .hm-guven{margin:var(--s4) 0 var(--s3);padding:var(--s2);}
  .hm-guven__ic{grid-template-columns:1fr;gap:0;}
  .hm-guven__o{
      padding:12px 0;
      border-right:0;border-bottom:1px solid var(--c-border);
  }
  .hm-guven__o:first-child{padding-top:2px;}
  .hm-guven__o:last-child{border-bottom:0;padding-bottom:2px;}
  .hm-guven__ik{width:38px;height:38px;}
  .hm-guven__ik svg{width:19px;height:19px;}

  .hm-ur__bar{display:flex;}
  .hm-ur{padding-bottom:70px;}

  .hm-oneri{margin-top:var(--s4);}
  .hm-oneri__h{font-size:17px;}
  .hm-oneri__grid{grid-template-columns:repeat(2, minmax(0,1fr));gap:12px;}

  .hm-ur__acik{margin-top:var(--s3);}
  .hm-ur__acik-h{font-size:16px;}
  .hm-ur__acik-tx{max-height:200px;}
  .hm-ur__acik-more{width:100%;justify-content:center;padding:11px 16px;}

  .hm-ak__bas{padding:13px 14px;font-size:13.5px;}
  .hm-ak__ic{padding:var(--s2) 14px var(--s3);}
  .hm-akordiyon{margin-top:var(--s3);margin-bottom:var(--s3);}

  .hm-ur__aciklama{font-size:13.5px;}
  /* genis teknik tablolar: sayfayi yana kaydirmasin, kendi icinde kaysin.
     white-space:nowrap KULLANILMIYOR — hucreler sarsin ki tablo daha dar olsun */
  .hm-ur__aciklama table{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .hm-ur__aciklama th,
  .hm-ur__aciklama td{padding:7px 9px;font-size:12.5px;}

  /* Sabit cubuk acikken sabit WhatsApp ve yukari-cik butonlari
     cubugun ustune ciksin, ust uste binmesin */
  body.hm-bar-acik .whatsapp-buton{bottom:104px!important;}
  body.hm-bar-acik #scrollUp,
  body.hm-bar-acik .scrollup,
  body.hm-bar-acik #scroll-up{bottom:104px!important;}
}

/* --- cok dar ekranlar (320px SE gibi) --- */
@media (max-width:359px){
  .hm-ur .current-price{font-size:22px;}
  .hm-ur__kdvet{font-size:14px;}
  .hm-ur__ind{font-size:11px;padding:2px 7px;}
  .hm-ur__h1{font-size:17.5px;}
  .hm-ur__adet-b{width:32px;}
  .hm-ur__ekle{font-size:14px;padding:0 10px;}
  .hm-ur__bar-btn{padding:13px 16px;font-size:13.5px;}
}

@media (prefers-reduced-motion: reduce){
  .hm-ur__bar,.hm-kargo__detay,.hm-kargo__ac svg,.hm-ak__bas svg,
  .hm-ur__acik-more,.hm-ur__acik-more svg{transition:none;}
}