﻿.kontorluyazi {
    /*color: black;*/
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
}

.mycloader {
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    opacity: 1;
    z-index: 999999999;
    background-image: url(/img/loading.svg);
    background-repeat: no-repeat;
    background-size: 80px;
    background-position: center;
}
/* Sonsuz kaydirmada sayfali baglantilar HTML'de kalir ama gorunmez:
   arama motorlari ve JS kapali tarayicilar listeyi yine de gezebilir. */
.gezinme-gizli {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Mobil bar: telefon/tablette ekranin altina sabit hizli erisim cubugu. Renkler
   panelden gelir ve satir ici yazilir (Vue sablonu <style> etiketini atiyor). */
.mobil-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030; display: none; align-items: stretch; height: calc(58px + env(safe-area-inset-bottom, 0px)); padding-bottom: env(safe-area-inset-bottom, 0px); border-top: 1px solid rgba(0,0,0,.08); box-shadow: 0 -2px 12px rgba(0,0,0,.08); transform: translateZ(0); }
.mobil-bar a { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 0 4px; min-width: 0; text-decoration: none; }
.mobil-bar a + a { border-left: 1px solid rgba(0,0,0,.10); }
.mobil-bar a:active { background: rgba(0,0,0,.06); }
.mobil-bar .icon { font-size: 22px; line-height: 1; }
.mobil-bar span { font-size: 11px; line-height: 1.1; font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 992px) {
    .mobil-bar { display: flex; }
    /* Bar iceriği ortmesin: govdeye bar kadar bosluk, yapisik sepet barin ustune. */
    body.mobil-barli { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px)) !important; }
    body.mobil-barli .stickyCart { bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
    body.mobil-barli #site-scroll { bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
    /* Urun sayfasinda yapisik sepet (57px) barin ustunde durur; footer ikisinin de altinda kalmasin. */
    body.urun-sayfasi.mobil-barli { padding-bottom: calc(58px + 60px + env(safe-area-inset-bottom, 0px)) !important; }
}
/* Yapisik sepet acikken footer'in son satiri gorunsun: urun sayfasi govdesi template-product sinifini
   tasir, tema betigi yapisik sepet gorununce 70px bosluk verir, gizlenince sifirlar (sabit bosluk yok). */

/* Urun sayfasi: Sepete Ekle + WhatsApp yan yana, dar ekranda alt alta tam genislik. */
.urun-butonlar { display: flex; gap: 8px; flex-wrap: wrap; }
.urun-butonlar .btn { flex: 1 1 0; min-width: 0; white-space: nowrap; }
.whatsapp-siparis, .whatsapp-siparis:hover, .whatsapp-siparis:focus { background: #25D366 !important; border-color: #25D366 !important; color: #fff !important; }
.whatsapp-siparis:hover { background: #1ebe5b !important; border-color: #1ebe5b !important; }
@media (max-width: 767px) {
    .urun-butonlar { flex-direction: column; }
    .urun-butonlar .btn { width: 100%; }
}

/* Ana sayfa giris metni; section-header'in el yazisi fontuna girmesin. */
.giris-metni { max-width: 860px; font-family: inherit; }
.giris-metni p { font-family: inherit; font-size: 15px; line-height: 1.7; }

/* Urun rozetleri: indirim yuzdesi solda, stok durumu sagda, ucretsiz kargo ust serit. */
.product-image, .zoompro-span { position: relative; }
.urun-kargo-serit { position: absolute; left: 0; right: 0; top: 0; z-index: 2; background: #1f8a4c; color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .3px; text-transform: uppercase; text-align: center; padding: 3px 6px; }
.urun-kargo-serit + .urun-rozetler { top: 26px; }
.urun-rozetler { position: absolute; left: 0; right: 0; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: flex-start; padding: 6px; pointer-events: none; }
.urun-rozetler .lbl { display: inline-block; margin: 0; padding: 4px 10px; font-size: 11px; font-weight: 600; color: #fff; text-transform: uppercase; border-radius: 0; }
.urun-rozetler .urun-rozet-indirim { background: #f54337; margin-right: auto; }
.urun-rozetler .urun-rozet-stok { background: #374151; margin-left: auto; }
.urun-indirim-etiketi { display: inline-block; background: #f54337; color: #fff; font-size: 12px; font-weight: 600; padding: 2px 8px; vertical-align: middle; }

/* Ust bar: solda telefon/e-posta, ortada sagdan sola kayan duyuru, sagda sosyal ikonlar. */
.ust-bar { font-size: 13px; line-height: 1; }
.ust-bar-ic { display: flex; align-items: center; gap: 16px; height: 34px; }
.ust-bar-sol, .ust-bar-sag { display: flex; align-items: center; gap: 14px; flex: 0 0 auto; white-space: nowrap; }
.ust-bar-sol a, .ust-bar-sag a { text-decoration: none; display: inline-flex; align-items: center; gap: 5px; opacity: .95; }
.ust-bar-sol a:hover, .ust-bar-sag a:hover { opacity: 1; text-decoration: underline; }
.ust-bar-sag a .icon { font-size: 14px; }
.ust-bar-orta { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.ust-bar-kayan { display: inline-block; white-space: nowrap; padding-left: 100%; animation: ust-bar-kay 22s linear infinite; }
.ust-bar-orta:hover .ust-bar-kayan { animation-play-state: paused; }
@keyframes ust-bar-kay { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .ust-bar-kayan { animation: none; padding-left: 0; } .ust-bar-orta { text-align: center; text-overflow: ellipsis; } }
@media (max-width: 767px) { .ust-bar-ic { height: 30px; gap: 10px; } .ust-bar { font-size: 12px; } }

/* Kategori slider'i: 970x220 (mobil 390x185) bant, ilk gorsel oncelikli. */
.kategori-slider { max-width: 970px; margin-left: auto; margin-right: auto; overflow: hidden; }
.kategori-slayt img { display: block; width: 100%; height: auto; aspect-ratio: 970 / 220; object-fit: cover; }
@media (max-width: 767px) { .kategori-slayt img { aspect-ratio: 390 / 185; } }
.kategori-slider:not(.slick-initialized) .kategori-slayt + .kategori-slayt { display: none; }

/* Masaustu WhatsApp dugmesi (mobil bar gorunmedigi genisliklerde). */
.whatsapp-sabit { position: fixed; right: 22px; bottom: 90px; z-index: 1029; width: 56px; height: 56px; border-radius: 50%; background: #25D366; color: #fff; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(0,0,0,.25); text-decoration: none; }
.whatsapp-sabit:hover { background: #1ebe5b; color: #fff; }
.whatsapp-sabit .icon { font-size: 30px; line-height: 1; }
/* Kategori aciklamasi (panelden) urun listesinin ustunde. */
.kategori-aciklama { max-width: 860px; font-size: 15px; line-height: 1.7; }
/* Urun gorselleri surukleyip indirilemez. */
.product-image img, .product-details-img img, .kategori-slider img { -webkit-user-drag: none; user-select: none; }

/* Avantaj seridi (Hizli Alisveris / Guvenli Alisveris ...): ikon solda, baslik + aciklama sagda. */
.avantaj-seridi { background: #fff; padding: 34px 0; border-top: 1px solid #f0f0f0; }
.avantaj-izgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px 28px; }
.avantaj { display: flex; align-items: center; gap: 14px; min-width: 0; }
.avantaj .icon { font-size: 44px; line-height: 1; color: #f2b90f; flex: 0 0 auto; }
.avantaj img { width: 56px; height: 56px; object-fit: contain; flex: 0 0 auto; }
.avantaj h3 { font-size: 15px; font-weight: 700; text-transform: uppercase; margin: 0 0 2px; letter-spacing: .2px; }
.avantaj span { font-size: 12.5px; color: #555; display: block; line-height: 1.35; }
@media (max-width: 991px) { .avantaj-izgara { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .avantaj-izgara { grid-template-columns: 1fr; } .avantaj-seridi { padding: 24px 0; } }

/* Yatay tasma: gizli hesap kutusu (#accountBox) dar ekranda 6px disari tasiyor, yerlesim
   gorunumu genisliyor ve sabit mobil bar sayfanin basinda ekranin altina kayiyordu. */
html, body { overflow-x: hidden; }
@supports (overflow: clip) { html, body { overflow-x: clip; } }
@media (max-width: 991px) { #accountBox { right: 0 !important; left: auto !important; max-width: calc(100vw - 16px); } }

/* Ust bilgi cubugu: logo bir tik kucuk; masaustu arama kutusu daha genis ve ikonlardan ayrik. */
.header .logoImg { max-width: 200px; }
.header .logoImg img { max-height: 84px; width: auto; }
@media (max-width: 991px) { .header .logoImg { max-width: 160px; } .header .logoImg img { max-height: 66px; } }
.header-5 .minisearch-inline, .header-5 .minisearch-inline.minisearch-inline { max-width: 340px; width: 340px; }
.header-5 .icons-col { white-space: nowrap; }
#siteNav { white-space: nowrap; }
/* Genis ekranda (>=1400) menu ve ikon sutunlari 5/5, arama 340px; altinda menu 6, ikonlar 4 ve arama daralir. */
@media (max-width: 1399px) { .header-5 .minisearch-inline, .header-5 .minisearch-inline.minisearch-inline { width: 280px; max-width: 280px; } .header-5 .search-parent.iconset { margin-right: 16px; } }
@media (max-width: 1199px) { .header-5 .minisearch-inline, .header-5 .minisearch-inline.minisearch-inline { width: 225px; max-width: 225px; } .header-5 .search-parent.iconset { margin-right: 10px; } }
.header-5 .search-parent.iconset { margin-right: 28px; }
.header-5 .minisearch-inline .search-input { font-size: 15px; height: 42px; }
/* Mobil arama satiri (logonun altinda). */
.mobil-arama { position: relative; }
.mobil-arama .form-control { height: 44px; padding-right: 46px; border: 1px solid #ddd; border-radius: 6px; font-size: 15px; }
.mobil-arama-btn { position: absolute; right: 0; top: 0; width: 46px; height: 44px; border: 0; background: transparent; color: #444; font-size: 20px; }
