/* ==========================================================================
   Sevgili Metal - kurumsal duzeltme katmani
   --------------------------------------------------------------------------
   style.css tema tarafindan derlenmis bir dosyadir (32 bin satir + source map).
   Oraya yazilan her sey tema guncellendiginde kaybolur. Bu yuzden siteye ait
   tum ozellestirmeler bu dosyada tutulur ve style.css'ten SONRA yuklenir.

   Bolumler:
     1. Erisilebilirlik
     2. Header
     3. Dil secici
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. ERISILEBILIRLIK
   -------------------------------------------------------------------------- */

/* Klavye kullanicisi her sayfada 30 menu baglantisini tek tek gecmek zorunda
   kalmasin diye ilk sirada duran, sadece odaklaninca gorunen atlama baglantisi. */
.icerige-atla {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 1000;
    padding: 12px 20px;
    background: #fff;
    color: #181818;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 4px 16px rgba(16, 24, 40, 0.15);
}

.icerige-atla:focus {
    left: 8px;
    top: 8px;
}

/* Tema, odak halkasini pek cok yerde kaldiriyor. Fare kullanicisini rahatsiz
   etmeden (":focus-visible" sadece klavyede tetiklenir) geri getiriyoruz. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid var(--color-primary, #ff4f18);
    outline-offset: 2px;
}


/* --------------------------------------------------------------------------
   2. HEADER
   -------------------------------------------------------------------------- */

/* Sayfa asagi kayinca menuyu ustte sabitler.
   Tema kendi ".header--sticky" sinifini main.js ile yonetiyor ama yer tutucu
   birakmadigi icin sabitlendigi anda icerik header yuksekligi kadar zipliyor.
   Bunun yerine site.js kendi yer tutucusunu ekleyip ".is-sticky" sinifini
   yonetiyor; tema JS'i bu basliga hic dokunmuyor. */
.heder-two.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    background: #fff;
    box-shadow: 0 4px 20px rgba(16, 24, 40, 0.08);
}

/* NOT: burada bir "yukaridan kayarak in" animasyonu denendi ve kaldirildi.
   translateY(-100%) -> 0 animasyonu tarayici sekmeyi kisitladiginda (arka planda
   kalan sekme, dusuk pil modu) baslangic karesinde takilip basligi ekranin
   disinda birakiyordu. Sabit baslikta gosteris riske degmez. */

/* Sabitlenince ust bilgi seridi (adres/telefon/e-posta) gizlenir; boylece
   menu ekranin daha az yerini kaplar ve icerik gorunur kalir.
   Secici tema kadar uzun tutuldu: tema ayni ogeye 5 sinifli bir kuralla
   "display: flex" veriyor, daha kisa bir secici onu gecemez. */
.heder-two.is-sticky .header-two-container .header-main-wrapper .rts-header-right .top {
    display: none;
}

/* Ust bilgi seridindeki iletisim bilgileri tek satirda, esit araliklarla. */
.heder-two .header-two-container .header-main-wrapper .rts-header-right .top .end-top {
    gap: 28px;
    flex-wrap: wrap;
}

/* Ust seritteki adres cok uzun oldugunda menuyu asagi itiyordu. */
.heder-two .header-two-container .header-main-wrapper .rts-header-right .top .end-top .single-info p {
    margin-bottom: 0;
    max-width: 560px;
}

/* Menu basliklarinin kelime ortasindan bolunmesini engeller.
   "E-Katalog" dar ekranda "E-" / "Katalog" diye iki satira dusuyordu. */
.heder-two .main-nav-desk nav > ul > li > a {
    white-space: nowrap;
}

/* Tema, ust seviye menu basliklarini <a href="javascript:void(0)"> olarak
   basiyor. Tiklanamaz olduklari halde el imleci cikmasi kafa karistiriyor. */
.heder-two .main-nav-desk nav > ul > li.has-droupdown > a.nav-link {
    cursor: default;
}

.heder-two .main-nav-desk nav > ul > li.has-droupdown .submenu a {
    cursor: pointer;
}

/* Bulunulan sayfanin menude belli olmasi. Kurumsal sitede kullanicinin
   nerede oldugunu gormesi temel beklenti. */
.heder-two .main-nav-desk nav ul li.aktif > a {
    color: var(--color-primary, #ff4f18);
}

/* Ucuncu seviye acilir menude "min-width: none" gecersiz bir degerdi,
   tarayici satiri komple yok sayiyordu. Gercek bir sinir veriyoruz. */
.sub-dropdown .submenu.third-lvl {
    min-width: 220px;
}


/* --------------------------------------------------------------------------
   3. DIL SECICI
   -------------------------------------------------------------------------- */

/* Onceki hali: buton icinde "width: 60%" verilmis bayrak gorseli. Bayraklarin
   en/boy orani birbirinden farkli oldugu icin her biri baska boyutta cikiyordu.
   Artik hepsi ayni olcude.

   Bayragin yaninda dil kodu yazmiyor: aktif dil, sonuk gosterilen digerlerinin
   arasinda tam opaklik ve renkli cerceveyle ayirt ediliyor. Yazi gerekmiyor,
   ekran okuyucu icin baglantida aria-label var. */
.dil-secici {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dil-secici .dil-link {
    display: inline-flex;
    align-items: center;
    padding: 2px;
    border-radius: 3px;
    line-height: 0;
    font-size: 12px;
    font-weight: 600;
    color: #3e3e3e;
    text-decoration: none;
    opacity: 0.45;
    transition: opacity 0.2s ease;
}

.dil-secici .dil-link img {
    width: 24px;
    height: 16px;
    object-fit: cover;
    display: block;
    border-radius: 2px;
    /* Beyaz agirlikli bayraklar (Almanya, Cin, Rusya) beyaz zeminde
       kenarsiz kaldiginda dagilmis gorunuyordu. */
    box-shadow: 0 0 0 1px rgba(16, 24, 40, 0.15);
}

.dil-secici .dil-link:hover,
.dil-secici .dil-link:focus-visible {
    opacity: 1;
}

.dil-secici .dil-link.aktif {
    opacity: 1;
    cursor: default;
}

.dil-secici .dil-link.aktif img {
    box-shadow: 0 0 0 2px var(--color-primary, #ff4f18);
}

/* Yan menudeki (mobil) dil secici, sosyal medya listesiyle ayni hizada dursun. */
.side-bar .dil-secici {
    flex-wrap: wrap;
    margin-top: 20px;
}


/* --------------------------------------------------------------------------
   4. ANASAYFA - BANNER (SLIDER)
   -------------------------------------------------------------------------- */

/* Ust yazi (b_one-pre).
   Tema bu yaziya koyu lacivert (--color-primary: #004288) veriyor. Fotograf da
   koyu oldugu icin okunmuyordu; onceki cozum satir ici style ile beyaza cevirip
   dort yone siyah golge vermekti (text-shadow: -1px -1px 0 #000, ...), bu da
   harflerin etrafinda kalin bir kontur birakiyordu.

   Golgeye gerek yok: temanin banner'inda zaten soldan saga karartma katmani var
   (.rts-banner-one::after) ve H1 ile aciklama metni ayni yerde golgesiz okunuyor.
   Ust yazi da onlarla ayni sekilde sadece beyaz. */
.rts-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .rts-banner-one .banner-one-wrapper .b_one-pre {
    color: #fff;
    text-shadow: none;
}

/* Temanin karartmasi solda tamamen opak baslayip %81'de bitiyor
   (linear-gradient(90deg, #101010 2.78%, transparent 81.61%)). Bu, sol kenarda
   fotografi tamamen kapatiyor, sag tarafta ise acik renkli fotograflarda yaziyi
   savunmasiz birakiyor. Ayni yon ve ayni renk korunarak sol kenar biraz
   acildi, karartma sag tarafa dogru daha uzun tutuldu. */
.rts-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .rts-banner-one::after {
    background: linear-gradient(90deg,
            rgba(16, 16, 16, 0.90) 0%,
            rgba(16, 16, 16, 0.72) 38%,
            rgba(16, 16, 16, 0.34) 68%,
            rgba(16, 16, 16, 0) 92%);
}


/* --------------------------------------------------------------------------
   5. ANASAYFA - URUN KATEGORI KARTLARI
   -------------------------------------------------------------------------- */

/* Onceki hali Bootstrap'in ham "card card-body border-primary" bilesenidir:
   temanin tipografisini, kenarlik kalinligini ve hover davranisini hic
   kullanmiyor, mavi cerceveyle sayfadan kopuk duruyordu.
   Izgara duzeni ve yerlesim aynen korundu; sadece kartin kendisi temanin
   dilini kullaniyor. */
/* Kartlarin bulundugu satir "align-items-center" tasiyor (bolumun geri kalani
   icin oyle olmasi gerekiyor). Bu, sutunlarin yuksekligi icerige gore kalmasina
   ve iki satirlik isme sahip kartlarin yaninda tek satirlik kartlarin dikeyde
   ortalanip kaymasina yol aciyordu. Sadece kategori sutunlari esnetiliyor;
   bolumdeki diger ogeler etkilenmiyor. */
.kategori-kart-kolon {
    align-self: stretch;
}

.kategori-kart {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    height: 100%;
    min-height: 76px;
    padding: 18px 22px;
    background: #fff;
    border: 1px solid #E4E7EC;
    color: #1B1B1B;
    font-family: var(--font-primary);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, color 0.25s ease;
}

.kategori-kart .ad {
    /* Uzun kategori adlari kartin disina tasmasin. */
    min-width: 0;
}

/* Ok, kart uzerine gelinince soldan kayarak belirir. Bos dururken yer
   kaplamasin diye gorunurlugu degisiyor, genisligi degil. */
.kategori-kart i {
    flex: 0 0 auto;
    color: var(--color-primary);
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.kategori-kart:hover,
.kategori-kart:focus-visible {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.08);
    color: var(--color-primary);
}

.kategori-kart:hover i,
.kategori-kart:focus-visible i {
    opacity: 1;
    transform: translateX(0);
}


/* --------------------------------------------------------------------------
   6. FOOTER - E-BULTEN GERI BILDIRIMI
   -------------------------------------------------------------------------- */

/* Bos mesaj kutusu yer kaplayip formu asagi itmesin: metin girene kadar
   yuksekligi sifir kalir. */
.ebulten-mesaj {
    margin: 10px 0 0;
    min-height: 0;
    font-size: 14px;
    line-height: 1.45;
    color: #B9BFC7;
}

.ebulten-mesaj:empty {
    display: none;
}

.ebulten-mesaj.basarili {
    color: #4ADE80;
}

/* Koyu footer zemininde okunabilen bir uyari tonu. */
.ebulten-mesaj.hata {
    color: #FCA5A5;
}


/* --------------------------------------------------------------------------
   7. KURUMSAL SAYFALAR
   -------------------------------------------------------------------------- */

/* Yonetim panelinden metne satir sonu girildiginde ekranda da satir sonu
   olarak gorunsun. Su an veritabanindaki metinlerde hic satir sonu yok
   (kontrol edildi), bu yuzden bugun gorunum degismez; metinler duzenlenip
   madde madde yazildiginda calisir hale gelir.
   pre-line secildi (pre degil): fazladan bosluklar yine sadelestirilir,
   sadece satir sonlari korunur. */
.main-content-area-about-p .disc {
    white-space: pre-line;
}

/* --- YouTube videosu (tiklayinca yuklenen surum) ---
   Onceki hali sabit width="1250" height="700" idi; 1250 pikselden dar her
   ekranda kutunun disina tasiyordu. Simdi 16:9 oraninda, kapsayicisina
   uyan esnek bir kutu. */
.video-kutu {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    overflow: hidden;
}

/* aspect-ratio desteklemeyen eski tarayicilar icin yedek oran. */
@supports not (aspect-ratio: 16 / 9) {
    .video-kutu {
        height: 0;
        padding-bottom: 56.25%;
    }
}

.video-kutu iframe,
.video-kutu .video-oynat {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.video-oynat {
    display: block;
    padding: 0;
    background: none;
    cursor: pointer;
}

.video-oynat img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.video-ikon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 68px;
    height: 48px;
    pointer-events: none;
}

.video-ikon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.video-ikon-zemin {
    fill: #212121;
    fill-opacity: 0.8;
    transition: fill 0.2s ease, fill-opacity 0.2s ease;
}

.video-ikon-ok {
    fill: #fff;
}

.video-oynat:hover .video-ikon-zemin,
.video-oynat:focus-visible .video-ikon-zemin {
    fill: #f00;
    fill-opacity: 1;
}


/* --------------------------------------------------------------------------
   8. GALERI BUYUTECI (imageview eklentisi)
   --------------------------------------------------------------------------
   Anasayfadaki "Uretim Tesisimiz" gorsellerine tiklayinca acilan tam ekran
   goruntuleyici.

   SORUN: eklenti kendine "z-index: 1" veriyor. Sayfadaki bircok sabit oge bunun
   cok uzerinde:
       .progress-wrap (sag alt kaydirma gostergesi)   z-index 10000
       .side-bar      (yan menu)                      z-index  1900
       yapiskan header                                z-index   999
   Kullanici bu bolume kaydirdiginda header sabitlenmis oluyor ve goruntuleyicinin
   ustune biniyordu. Kapatma (x) dugmesi tam da header'in hamburger butonunun
   altina denk geldigi icin tiklama header'a gidiyor, goruntuleyici kapanmiyordu.
   -------------------------------------------------------------------------- */

.imageview {
    /* .progress-wrap'in 10000'inin de uzerinde olmali. */
    z-index: 100000;
}

/* Kapatma ikonu 80x80 kutunun icinde "background-position: 30px 50%" ile
   soldan 30px kaymis duruyordu; ortalandi. */
.imageview .hide {
    background-position: center;
}

/* Ok dugmeleri de ayni sekilde ortalandi. */
.imageview .prev,
.imageview .next {
    background-position: center;
}

/* Goruntuleyici acikken arka plandaki sayfa kaymasin. */
html.galeri-acik,
html.galeri-acik body {
    overflow: hidden;
}


/* --------------------------------------------------------------------------
   9. BLOG LISTESI
   -------------------------------------------------------------------------- */

/* _Layout.cshtml icindeki satir ici <style> blogundan tasindi.
   Blog/Index.cshtml'de kart basligi gorsele yapisik duruyordu. */
.single-news-area-start-five .content {
    padding: 10px;
}
