/* =====================================================================
   ek-duzen.css — Laravel sürümüyle gelen küçük görsel iyileştirmeler.
   Mevcut tema dosyalarına dokunulmaz; bu dosya en son yüklenir.
   ===================================================================== */

/* 1) Ürün görselleri esnemesin: kutu aynı (250px), resim orantılı ortalanır */
.single-product-wrap .product-image img{
  object-fit:contain;
  object-position:center;
  background:#fff;
}

/* 2) Ürün kartı: fareyle üzerine gelince hafif yükselme + gölge */
@media (hover:hover) and (min-width:768px){
  .single-product-wrap{
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
    will-change:transform;
  }
  .single-product-wrap:hover{
    transform:translateY(-6px);
    box-shadow:0 16px 34px rgba(16,42,54,.14), 0 4px 10px rgba(27,154,168,.10) !important;
    border-color:#cfe6e9 !important;
  }
  /* Temanın eski köşeli beyaz hover katmanı kapatılır (yuvarlak kart görünümü korunur) */
  .single-product-wrap::before{ display:none !important; }
  /* Kaydırmalı (carousel) satırlarda yükselen kartın gölgesi kesilmesin */
  .product-active .owl-stage-outer{ padding:10px 0 22px; margin:-10px 0 -22px; }
}

/* 3) Çerez ayarları düğmesi sağ alta (WhatsApp/telefon düğmeleriyle çakışmasın) */
.cerez-reopen{ left:auto !important; right:16px; }

/* 4) Mobil başlık: arama kutusunun altındaki boş alan kaldırıldı */
@media (max-width:991px){
  .header-middle{ padding-bottom:12px !important; }
  .header-middle .logo{ padding-bottom:16px !important; }
  .header-middle-right:not(:has(.lang-flags)){ display:none !important; }
}

/* 5) Kategori başlığı ve açıklaması */
.kategori-bas{ margin:26px 0 0; }
.kategori-bas h1{ font-size:24px; font-weight:700; color:#16323f; margin:0; line-height:1.3; }
.kategori-bas .kat-aciklama{ margin:10px 0 0; line-height:1.75; color:#3a4a57; font-size:15px; max-width:980px; }
.kategori-bas .kat-sayi{ color:#7a8893; font-size:13.5px; margin-top:4px; }

/* 6) Ürün galerisi küçük resimleri */
.urunGaleri-thumbs{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:12px; }
.urunGaleri-thumbs img{ width:84px !important; height:84px; object-fit:contain; background:#fff; margin:0 !important;
  border:2px solid #e6ecef !important; border-radius:8px !important; cursor:pointer; transition:border-color .2s; }
.urunGaleri-thumbs img:hover, .urunGaleri-thumbs img.secili{ border-color:#1B9AA8 !important; }
.urunGaleri-main-img{ max-width:100%; }

/* 7) Arama önerileri */
.hm-searchbox{ position:relative; }
.arama-oneri{ position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:1000; background:#fff;
  border:1px solid #e3eaee; border-radius:12px; box-shadow:0 16px 36px rgba(16,42,54,.16); overflow:hidden; display:none; text-align:left; }
.arama-oneri.acik{ display:block; }
.arama-oneri a{ display:flex; align-items:center; gap:12px; padding:8px 12px; color:#22313b; text-decoration:none; font-size:14px; line-height:1.35; border-bottom:1px solid #f1f4f6; }
.arama-oneri a:last-child{ border-bottom:0; }
.arama-oneri a:hover, .arama-oneri a.aktif{ background:#f2f9fa; color:#15808C; }
.arama-oneri img{ width:44px; height:44px; object-fit:contain; background:#fff; border:1px solid #edf1f3; border-radius:6px; flex:0 0 44px; }
.arama-oneri .tumu{ justify-content:center; font-weight:600; color:#15808C; background:#fafcfd; }
.arama-oneri .bos{ padding:12px; color:#7a8893; font-size:13.5px; }

/* 8) Mobil sabit alt çubuk: WhatsApp | Ara (masaüstünde görünmez) */
.mobil-cubuk{ display:none; }
@media (max-width:767px){
  .mobil-cubuk{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:9990; background:#fff;
    box-shadow:0 -4px 18px rgba(0,0,0,.12); padding:8px 10px calc(8px + env(safe-area-inset-bottom)); gap:8px; }
  .mobil-cubuk a{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; height:46px; border-radius:10px;
    color:#fff !important; font-weight:700; font-size:15px; text-decoration:none; }
  .mobil-cubuk .mc-wp{ background:#25D366; }
  .mobil-cubuk .mc-ara{ background:#1B9AA8; }
  .mobil-cubuk i{ font-size:20px; }
  body{ padding-bottom:64px; }
  /* Mobilde yüzen yuvarlak düğmeler alt çubukla aynı işi yapıyor — gizlenir */
  .whatsapp, .telefon{ display:none !important; }
  .cerez-reopen{ bottom:74px !important; }
  #scrollUp{ bottom:74px !important; }
}

/* 9) 404 sayfası düğmesi */
.btn-404{ display:inline-block; padding:12px 28px; border-radius:30px; background:#1B9AA8; color:#fff !important;
  font-weight:600; text-decoration:none; transition:background .2s; }
.btn-404:hover{ background:#15808C; color:#fff !important; }

/* 10) Mobilde ürün sayfası: resim ve bilgiler alt alta (yan yana sıkışmasın) */
@media (max-width:767px){
  .product__details--section .row-cols-md-2 > .col{ flex:0 0 100%; max-width:100%; }
  .product__details--info{ margin-top:10px; }
}

/* =====================================================================
   11) TİPOGRAFİ — sağlık sektörüne uygun, net ve okunaklı yazılar
   Gövde: Nunito Sans (yumuşak, güven veren, geniş harfli → küçük boyutta net)
   Başlık: Manrope (temiz, kurumsal, medikal markalarda yaygın)
   goz-konforu.css'in yazıları inceltip grileştiren ayarları burada dengelenir.
   ===================================================================== */
:root{
  --font-govde:'Nunito Sans','Segoe UI',Roboto,Arial,sans-serif;
  --font-baslik:'Manrope','Nunito Sans','Segoe UI',Roboto,Arial,sans-serif;
  --yazi-koyu:#1d2a33;      /* gövde metni: beyaz zeminde ~14:1 kontrast */
  --yazi-ikincil:#4b5963;   /* ikincil metin (eski #888 → daha okunur) */
}
html, body{
  -webkit-font-smoothing:auto !important;
  -moz-osx-font-smoothing:auto !important;
  text-rendering:optimizeLegibility;
}
body{
  font-family:var(--font-govde) !important;
  font-size:15px;
  color:var(--yazi-koyu) !important;
}
/* Gövde metinleri (ikon fontlarına dokunulmaz) */
body :is(p,li,a,span,div,td,th,label,input,textarea,select,button,small,strong,b,em,font,center):not([class*="fa-"]):not(.fa):not([class*="zmdi"]):not([class*="icon"]){
  font-family:var(--font-govde) !important;
}
p, li, td, .product__details--info__desc, .li-blog-details p, .about-text-wrap p, .sf-policy{
  color:var(--yazi-koyu);
  line-height:1.75;
}
.product__details--info__desc, .li-blog-details p, .about-text-wrap p, .sf-policy p, .sf-policy li{ font-size:15.5px; }

/* Başlıklar: Manrope, net kalınlık */
body :is(h1,h2,h3,h4,h5,h6),
.product__details--info__title, .section__heading--maintitle, .li-section-title h2, .li-section-title h2 span,
.footer-block-title, .li-blog-heading, .li-blog-heading a, .category-heading h2, .contact-page-title,
.shipping-text h2, .slider-content h2, .kategori-bas h1{
  font-family:var(--font-baslik) !important;
  font-weight:700 !important;
  letter-spacing:-.01em;
  color:#16252f;
}
.slider-content h2 font{ font-family:var(--font-baslik) !important; }
.product_desc_info h4, .product_desc_info h4 a{ font-weight:700 !important; color:#1b2a33 !important; font-size:15px; line-height:1.4; }

/* Menü ve gezinme: biraz daha dolgun */
.hb-menu nav > ul > li > a{ font-weight:700 !important; letter-spacing:.2px; font-size:14.5px; }
.hb-dropdown li a, .category-menu-list ul li a{ font-weight:600; color:#24333c; }
.breadcrumb-content li, .breadcrumb-content li a{ font-weight:600; }

/* Footer: soluk gri yerine okunur ikincil renk */
.footer .des li, .footer .des li a, .footer .info, .footer-block ul li a, .shipping-text p, .copyright span{
  color:var(--yazi-ikincil) !important;
}
.footer-block ul li a:hover, .footer .des li a:hover{ color:#15808C !important; }
.footer .des li span{ color:#1d2a33; font-weight:700; }

/* Form alanları */
input, textarea, select{ color:var(--yazi-koyu); font-size:15px; }
::placeholder{ color:#7b8792; opacity:1; }

/* =================================================================
   12. SLIDER YAZILARI — modern (v1.5)
   İçerik, renk ayarı ve resimler korunur; yalnız görünüm.
   Panelde seçilen başlık rengi (bolumc) başlık üstündeki vurgu
   çizgisinde kullanılır; başlık her resimde okunsun diye beyaz.
================================================================= */
.slider-active .single-slide::before{
  background:linear-gradient(90deg,
    rgba(7,26,36,.84) 0%, rgba(7,26,36,.66) 30%,
    rgba(7,26,36,.30) 55%, rgba(7,26,36,0) 76%) !important;
}
.slider-active .slider-content{ position:relative; z-index:2; max-width:600px; }

/* Başlık */
.slider-active .slider-content > h2{
  position:relative;
  padding-top:24px;
  color:#fff !important;
  font-family:var(--font-baslik) !important;
  font-size:46px !important;
  font-weight:800 !important;
  line-height:1.08 !important;
  letter-spacing:-.022em !important;
  max-width:540px !important;
  margin:0 0 18px !important;
  text-shadow:0 2px 22px rgba(0,0,0,.28) !important;
}
.slider-active .slider-content > h2 font{
  color:inherit !important; font:inherit !important; letter-spacing:inherit !important;
  text-shadow:inherit !important;
}
.slider-active .slider-content > h2::before{
  content:""; position:absolute; left:0; top:0;
  width:58px; height:4px; border-radius:4px;
  background:var(--vurgu, #1B9AA8);
  box-shadow:0 0 0 1px rgba(255,255,255,.12);
}
.slider-active .slider-content > h2::after{
  content:""; position:absolute; left:66px; top:0;
  width:14px; height:4px; border-radius:4px;
  background:#1B9AA8; opacity:.85;
}

/* Açıklama: paneldeki renkli/vurgulu yazılar tek tip, okunaklı beyaz */
.slider-active .slider-content > h3{
  color:rgba(255,255,255,.92) !important;
  font-family:var(--font-govde) !important;
  font-size:17px !important;
  font-weight:500 !important;
  line-height:1.6 !important;
  letter-spacing:0 !important;
  max-width:480px !important;
  margin:0 0 30px !important;
  text-shadow:0 1px 12px rgba(0,0,0,.3) !important;
}
.slider-active .slider-content > h3 *{
  color:inherit !important; background:transparent !important;
  font-family:inherit !important; font-size:inherit !important;
  line-height:inherit !important; text-shadow:inherit !important;
}
.slider-active .slider-content > h3 p{ margin:0 0 6px !important; }
.slider-active .slider-content > h3 p:last-child{ margin-bottom:0 !important; }
.slider-active .slider-content > h3 b,
.slider-active .slider-content > h3 strong{ font-weight:inherit !important; color:inherit !important; }

/* Düğme: hap biçimli, ok simgeli, yazı tam ortada */
.slider-active .slider-content .slide-btn{ height:auto !important; width:auto !important; background:none !important; border:0 !important; }
.slider-active .slider-content .slide-btn .links{
  display:inline-flex !important; align-items:center; justify-content:center; gap:10px;
  height:52px !important; line-height:1 !important; width:auto !important;
  padding:0 30px !important;
  border-radius:999px !important;
  background:#1B9AA8 !important; color:#fff !important;
  font-family:var(--font-baslik) !important; font-weight:700 !important;
  font-size:14px !important; letter-spacing:.08em !important; text-transform:uppercase;
  box-shadow:0 12px 28px rgba(27,154,168,.40) !important;
  transition:background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease !important;
}
.slider-active .slider-content .slide-btn .links::after{
  content:"\2192"; font-size:18px; line-height:1; transition:transform .25s ease;
}
.slider-active .slider-content .slide-btn .links:hover{
  background:#fff !important; color:#137883 !important;
  transform:translateY(-2px);
  box-shadow:0 16px 32px rgba(0,0,0,.25) !important;
}
.slider-active .slider-content .slide-btn .links:hover::after{ transform:translateX(4px); }

/* İlerleme çubuğu: ince, marka rengi */
.slider-active .slider-progress{ background:rgba(27,154,168,.85) !important; height:3px !important; }

@media (max-width:1199px){
  .slider-active .slider-content > h2{ font-size:38px !important; max-width:460px !important; }
}
@media (max-width:991px){
  .slider-active .slider-content > h2{ font-size:32px !important; max-width:420px !important; }
  .slider-active .slider-content > h3{ font-size:16px !important; max-width:420px !important; margin-bottom:24px !important; }
}
@media (max-width:767px){
  .slider-active .single-slide::before{
    background:linear-gradient(90deg, rgba(7,26,36,.82) 0%, rgba(7,26,36,.62) 60%, rgba(7,26,36,.38) 100%) !important;
  }
  .slider-active .slider-content{ padding-left:26px !important; padding-right:22px; max-width:100%; }
  .slider-active .slider-content > h2{ font-size:27px !important; max-width:100% !important; padding-top:18px; margin-bottom:12px !important; }
  .slider-active .slider-content > h3{ font-size:14.5px !important; line-height:1.55 !important; max-width:100% !important; margin-bottom:20px !important; }
  .slider-active .slider-content .slide-btn .links{ height:46px !important; padding:0 24px !important; font-size:13px !important; }
}
