/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

.header-wrapper,
body.boxed .is-sticky-section,
body.boxed header,
body.framed,
body.framed .header-wrapper,
body.framed header {
	max-width: 100% !important;
}

.header .flex-row {
	height: 100% !important;
}

.header-button,
.nav-vertical .social-icons {
	display: block !important;
	width: 100% !important;
}

.header-vertical-menu__opener {
	align-items: center !important;
	background-color: var(--fs-color-primary) !important;
	display: flex !important;
	flex-direction: row !important;
	font-size: 0.9em !important;
	font-weight: 600 !important;
	height: 50px !important;
	justify-content: space-between !important;
	padding: 12px 15px !important;
	width: 250px !important;
}


/*************** ADD MOBILE ONLY CSS HERE  ***************/
@media only screen and (max-width: 48em) {

}

/* === YATTA GÖRSEL ORAN STANDARDİZASYONU — MOBİL (16:9) === */

/* Ürün ana liste, galeri ve kategori görselleri için ortak oran */
@media (max-width: 768px) {
  .product-small .box-image img,
  .woocommerce ul.products li.product a img,
  .woocommerce-product-gallery__image img,
  .category-image img,
  .ux-img,
  .ux-img img {
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: auto;
    border-radius: 8px; /* isteğe bağlı */
    display: block;
  }

  /* Görsel taşma engeli */
  .box-image, 
  .woocommerce-product-gallery__image, 
  .category-image, 
  .ux-img {
    overflow: hidden;
  }
}

/* 📱 Mobil uyumlu sabit görsel oranı */
@media only screen and (max-width: 768px) {
  .woocommerce ul.products li.product a img,
  .woocommerce div.product div.images img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3; /* 4:3 oran sabit */
    object-fit: cover; /* Görseli orantılı keser */
    border-radius: 10px;
  }
}

/* === DROPDOWN OKLARI HİZALAMA DÜZELTME === */
.nav-dropdown .icon-angle-down,
.nav-dropdown .icon-angle-right,
.nav-dropdown .toggle .icon-angle-down {
  display: inline-block !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  margin-left: 5px !important; /* ok ile metin arası boşluk */
  position: relative !important;
  top: 0 !important;
}

/* Menü başlıklarıyla hizalamayı sabitle */
.nav-dropdown > li > a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  line-height: 1.4em !important;
  padding: 10px 15px !important;
}

/* Mobil görünüm için özel düzeltme */
@media (max-width: 768px) {
  .nav-dropdown .icon-angle-down {
    font-size: 0.8em !important;
    margin-top: 0 !important;
  }
}

/* === Masaüstü görünüm BOXED LAYOUT ARKAPLAN BEYAZLATMA === */
html {
    background-color: #ffffff !important;
}