@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css');

/* Ana sayfa slider boşluk düzeltmesi */
.home-slider .aiz-carousel.dots-inside-bottom {
    margin: 0 !important;
}

.home-slider .aiz-carousel.dots-inside-bottom .slick-track {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

.home-slider .aiz-carousel.dots-inside-bottom .slick-slide {
    margin: 0 !important;
    padding: 0 !important;
}

.home-slider .aiz-carousel.dots-inside-bottom .slick-list {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.home-slider .carousel-box {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

.container-fluid {
    background: #F8F8F8 !important;
}
.category-nav-element a {
    padding: 0.5rem 0.5rem !important; /* üst-alt 0.5rem, sol-sağ 2rem */
}

.banner {
    background-color: #f8f9fa;
   /* border: 1px solid #dee2e6;*/
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    color: #adb5bd;
    text-transform: uppercase;
    letter-spacing: 2px;
    
}

.banner-col {
    position: fixed !important;
    top: 130px !important;
    width: 109px !important;
    max-width: 120px !important;
    min-width: 120px !important;
    overflow: visible;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    height: auto !important;
    z-index: 1000;
    transition: top 0.3s ease;
}

.banner-col.left-banner {
    left: 10px !important;
}

.banner-col.right-banner {
    right: 10px !important;
}

.banner-col:last-child {
    margin-right: 0;
    margin-left: 10px;
}

/* Banner reklam alanları için sticky davranış */
.banner-side {
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.banner-side:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.banner-side img {
    width: 100%;
    height: auto;
    display: block;
}

/* Ana içerik alanı için banner boşlukları */
@media (min-width: 1200px) {
    .main-content-area {
        margin-left: 140px !important;
        margin-right: 140px !important;
    }

    .container-fluid {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Mobil cihazlarda banner kolonlarını gizle */
@media (max-width: 1199px) {
    .banner-col {
        display: none !important;
    }

    .main-content-area {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

.banner-wrapper {
    /*position: fixed;*/
    width: 100%;
    max-width: inherit;
    z-index: 100;
}



.banner-side {
    margin: 0;
    overflow: visible;
    width: 120px;
    max-width: 120px;
    height: 600px;
    max-height: 600px;
    position: relative;
    display: flex;
    flex-direction: column;
}

.banner-side img {
    width: 120px;
    height: 600px;
    max-width: 120px;
    max-height: 600px;
    object-fit: cover;
    display: block;
    background: transparent;
    padding: 0;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.banner-side:hover img {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* GIF animasyon desteği */
.banner-side img[src$=".gif"] {
    object-fit: cover;
    background: transparent;
    width: 120px;
    height: 600px;
    max-width: 120px;
    max-height: 600px;
    padding: 0;
    border-radius: 8px;
}

/* Ana sayfa layout optimizasyonu */
.container-fluid .d-flex.flex-row {
    align-items: stretch;
    gap: 0;
    min-height: 100vh;
    margin: 0;
    padding: 0;
}

/* Carousel boşluk düzeltmesi */
.flex-grow-1 .aiz-carousel.gutters-10 {
    width: 100% !important;
    margin: 0 !important;
}

.flex-grow-1 .aiz-carousel.gutters-10 .carousel-box {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
}

.flex-grow-1 .slick-list {
    overflow: hidden !important;
    margin: 0 !important;
}

.flex-grow-1 .slick-track {
    margin: 0 !important;
}

.flex-grow-1 .slick-slide {
    margin: 0 !important;
    padding: 0 !important;
}

.flex-grow-1 .slick-slide img {
    margin: 0 !important;
    padding: 0 !important;
    display: block;
}

/* Orta carousel'da tüm aralıkları kaldır */
.flex-grow-1 .aiz-carousel {
    margin: 0 !important;
    padding: 0 !important;
}

.flex-grow-1 .aiz-carousel .slick-slide {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.flex-grow-1 .aiz-carousel .slick-slide > div {
    margin: 0 !important;
    padding: 0 !important;
}

.flex-grow-1 .aiz-carousel .slick-slide a {
    margin: 0 !important;
    padding: 0 !important;
    display: block;
}

/* Gutters sınıflarını tamamen sıfırla */
.flex-grow-1 .aiz-carousel.gutters-5,
.flex-grow-1 .aiz-carousel.gutters-10,
.flex-grow-1 .aiz-carousel.gutters-15 {
    width: 100% !important;
}

.flex-grow-1 .aiz-carousel.gutters-5 .carousel-box,
.flex-grow-1 .aiz-carousel.gutters-10 .carousel-box,
.flex-grow-1 .aiz-carousel.gutters-15 .carousel-box {
    padding: 0 !important;
    margin: 0 !important;
}

.flex-grow-1 {
    min-width: 0;
    flex: 1;
    width: calc(100% - 260px); /* Sol + sağ banner genişliği (120px * 2) + margin (10px * 2) çıkarılmış */
    max-width: calc(100% - 260px);
    padding: 0;
    margin: 0;
    overflow: hidden;
}


@media (max-width: 1200px) {
    .banner-col {
        display: none;
    }
    .slider-height { height: 378px; }



}

@media (max-width: 768px) {

    .banner-side {  height: 150px;}
}

/* Colors */
.text-orange {  color: #FF5733 !important;}

.aiz-category-menu:first-child {
    border-top: 0px !important;
}


/* Slider öğelerine margin ekle */
.aiz-carousel .slick-slide {
    margin: 0 3px; /* Yatay slider için yatay margin */
}

/* Dikey slider için */
.aiz-carousel.vertical .slick-slide {
    margin: 10px 0; /* Dikey slider için dikey margin */
}

.hov-animate-outline {
    position: relative;
    z-index: 1;
}


.hov-animate-outline::before,
.hov-animate-outline::after {
    border-radius: 0.5rem !important;
}

/* Kategori menüsü hover düzeltmesi */
.aiz-category-menu .category-nav-element:hover>a {
    position: relative !important; /* fixed yerine relative kullan */
    z-index: 10;
    background: var(--soft-secondary-base);
}

/* Alt kategori menüsü hover stability */
.aiz-category-menu .sub-cat-menu {
    transition: opacity 0.3s ease !important; /* Daha smooth geçiş */
    padding: 0.25rem 0.25rem 0 0.25rem !important; /* üst: 4px, sağ: 4px, alt: 0px, sol: 4px */
}

.aiz-category-menu .category-nav-element {
    position: relative; /* Parent container relative olmalı */
}

/* User dropdown menu hover düzeltmeleri */
.aiz-user-top-menu .user-top-nav-element:hover>a {
    position: relative !important; /* fixed yerine relative kullan */
    z-index: 10;
    background: var(--soft-secondary-base);
}

.aiz-user-top-menu .user-top-nav-element {
    position: relative; /* Parent container relative olmalı */
}

/* User dropdown menu stability */
.hover-user-top-menu {
    transition: opacity 0.3s ease !important; /* Daha smooth geçiş */
}

/* Alt kategori menüsü genişlik ve layout düzeltmeleri */
.aiz-category-menu .sub-cat-menu {
    min-width: 600px !important; /* Minimum genişlik garantisi */
    width: auto !important; /* Esnek genişlik */
    max-width: 800px !important; /* Maksimum genişlik sınırı */
}

/* Card columns layout düzeltmesi - yatay yerleşim için */
.sub-cat-menu .card-columns {
    column-count: 3 !important; /* 3 kolon yan yana */
    column-gap: 1rem !important; /* Kolonlar arası boşluk */
    column-fill: balance !important; /* Balanced dağılım */
}

/* Responsive design için tablet ve mobilde daha az kolon */
@media (max-width: 1200px) {
    .sub-cat-menu .card-columns {
        column-count: 2 !important;
    }
    .aiz-category-menu .sub-cat-menu {
        min-width: 500px !important;
        max-width: 650px !important;
    }
}

@media (max-width: 768px) {
    .sub-cat-menu .card-columns {
        column-count: 1 !important;
    }
    .aiz-category-menu .sub-cat-menu {
        min-width: 300px !important;
        max-width: 400px !important;
    }
}

/* Sağ boş alanı 9.33% genişlik */
@media (min-width: 1200px) {
    .right-spacer {
        flex: 0 0 9.33% !important;
        max-width: 9.33% !important;
    }
}

/* Tüm Kategoriler yazısını kategori listesi ile hizalama */
.all-category {
    margin-left: -16px !important;
}

.all-category .px-2 {
    padding-left: 8px !important;
}

/* TikTok social media icon */
.social.colored .tiktok {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.social.colored .tiktok:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

.social.colored .tiktok svg {
    width: 18px !important;
    height: 18px !important;
    fill: currentColor !important;
}


/* Kategori parent container'ını tamamen gizle */
.home-banner-area .row .position-static.d-none.d-xl-block.col-auto {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Kategori container'ı oval köşeler - çok güçlü selector */
#category-sidebar.aiz-category-menu.bg-white.rounded-0.border-top {
    border-radius: 0.75rem 0 0 0.75rem !important;
    border: none !important;
    background-color: #ffffff !important;
    overflow: hidden !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
    position: relative !important;
    z-index: 100 !important;
    margin-right: 0 !important;
}

/* Ana banner alanı slider ve kategori arasındaki boşluğu kaldır */
.home-banner-area .d-xl-flex {
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.home-banner-area .d-xl-flex .home-slider {
    margin-left: 0 !important;
    padding-left: 0 !important;
    flex: 1 !important;
}

.home-banner-area .d-xl-flex .position-static.d-none.d-xl-block {
    margin-right: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* En Çok Satan (Best Selling) hizalama düzeltmesi */
#section_best_selling .d-flex.align-items-baseline {
    align-items: center !important;
}

#section_best_selling .px-sm-3 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#section_best_selling .carousel-box {
    padding-left: 8px !important;
    padding-right: 8px !important;
}








/* Buton Hover Renk Düzeltmeleri */
/* Sepete Ekle butonu - Sistem ana rengi */
.aiz-p-hov-icon a:hover {
    background: var(--primary) !important;
    color: #fff !important;
}

/* Hemen Al butonu - Turuncu renk */
.aiz-p-hov-iconfastbuy a:hover {
    background: #f13c0a !important;
    color: #fff !important;
}

/* Modal İçinde Resim Görünüm Düzeltmeleri */
/* Sepete Ekle Modal'ındaki resim galeri düzeltmesi */
#addToCart .product-gallery {
    min-height: 200px !important;
    max-height: 280px !important;
}

#addToCart .product-gallery .carousel-box {
    min-height: 200px !important;
    max-height: 280px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#addToCart .product-gallery .carousel-box img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
}

/* Modal'daki slick carousel düzeltmesi */
#addToCart .slick-track {
    min-height: 200px !important;
    display: flex !important;
    align-items: center !important;
}

#addToCart .slick-slide {
    min-height: 200px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Logo pozisyon düzeltmesi */
/* Ana sayfa logosu 20px sola kaydırma */
.logo-bar-area .col-auto.pl-0.pr-1 {
    margin-left: -8px !important;
}

/* Alternatif: Logo container'ını kaydır */
.logo-bar-area .d-flex.align-items-center > .col-auto:first-of-type {
    transform: translateX(-20px) !important;
}

/* Mobil görünümde kategoriler sekmesini gizle */
@media (max-width: 1199px) {
    /* Ana kategoriler sekmesi */
    .all-category {
        display: none !important;
    }
    
    /* Kategoriler hover menüsü */
    .hover-category-menu,
    #click-category-menu {
        display: none !important;
    }
    
    /* Kategoriler menü butonu */
    .d-lg-none[data-target=".aiz-top-menu-sidebar"] {
        display: none !important;
    }
}

/* Tablet ve mobilde kategoriler linkini gizle */
@media (max-width: 991px) {
    .all-category,
    .hover-category-menu {
        display: none !important;
    }
}

/* Küçük mobil cihazlarda tüm kategori elementlerini gizle */
@media (max-width: 767px) {
    .all-category,
    .hover-category-menu,
    #click-category-menu,
    .aiz-category-menu {
        display: none !important;
    }
}

/* Mobil Görünüm Düzeltmeleri */
@media (max-width: 767px) {
    /* Üst boşlukları kaldır */
    .home-banner-area {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    
    .home-banner-area .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-bottom: 0 !important;
    }
    
    /* Ana container padding'lerini küçült */
    .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* Section'lar arası boşlukları küçült */
    .mb-2, .mb-md-3, .mt-2, .mt-md-3 {
        margin-bottom: 0.5rem !important;
        margin-top: 0.5rem !important;
    }
    
    /* Flash deal section'ı düzelt */
    #flash_deal {
        margin-bottom: 1rem !important;
        margin-top: 1rem !important;
    }
    
    #flash_deal .container {
        padding: 0 10px !important;
    }
    
    /* Featured Categories section'ı düzelt */
    section {
        margin-bottom: 1rem !important;
        margin-top: 1rem !important;
    }
    
    /* Best Selling ve Newest Products container düzeltmesi */
    #section_best_selling,
    #section_newest,
    #section_featured {
        margin-bottom: 1rem !important;
        margin-top: 0.5rem !important;
    }
    
    #section_best_selling .container,
    #section_newest .container,
    #section_featured .container {
        padding: 0 10px !important;
        margin: 0 !important;
    }
    
    /* Container içindeki bg-white elementleri düzelt */
    .bg-white {
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-radius: 0 !important;
    }
    
    /* Product carousel'larında padding düzeltmesi */
    .aiz-carousel {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .carousel-box {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    
    /* Header'daki gereksiz boşlukları kaldır */
    .logo-bar-area {
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }
    
    /* Banner section'larında boşluk düzeltmesi */
    .mb-2.mb-md-3.mt-2.mt-md-3 {
        margin: 0.5rem 0 !important;
    }
    
    /* Title section'larında padding düzeltmesi */
    .d-flex.mb-2.mb-md-3.align-items-baseline,
    .d-flex.align-items-baseline.justify-content-between {
        margin-bottom: 0.5rem !important;
        padding: 0.5rem 10px !important;
    }
}

/* Tablet görünümde de benzer düzeltmeler */
@media (max-width: 991px) and (min-width: 768px) {
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .mb-2.mb-md-3.mt-2.mt-md-3 {
        margin-bottom: 1rem !important;
        margin-top: 1rem !important;
    }
}

/* İçeriği ekranın tam genişliğinde göster */
@media (max-width: 767px) {
    .home-banner-area,
    #flash_deal,
    #section_best_selling,
    #section_newest,
    #section_featured {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Container'ları tam genişlik yap */
    .home-banner-area > .container,
    #flash_deal > .container,
    #section_best_selling > .container,
    #section_newest > .container,
    #section_featured > .container {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 10px !important;
    }
}

/* Home banner position-static alanını mobilde gizle */
@media (max-width: 767px) {
    .home-banner-area .position-static {
        display: none !important;
    }
    
    .home-banner-area .d-flex.flex-wrap.position-relative .position-static {
        display: none !important;
    }
}

/* Tablet görünümde de gizle */
@media (max-width: 991px) {
    .home-banner-area .position-static.d-block {
        display: none !important;
    }
}

/* Genel mobil gizleme kuralı */
@media (max-width: 1199px) {
    .home-banner-area .position-static {
        display: none !important;
    }
}

/* Mobil görünümde logoyu ortala */
@media (max-width: 767px) {
    /* Logo container'ını ortalamak için parent'ı düzenle */
    .logo-bar-area .d-flex.align-items-center {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
    
    /* Logo container'ını ortalanmış hale getir */
    .logo-bar-area .col-auto.pl-0.pr-1.d-flex.align-items-center {
        flex: none !important;
        width: auto !important;
        margin: 0 auto !important;
        justify-content: center !important;
        order: 2 !important; /* Logo'yu ortaya koy */
    }
    
    /* Menü butonunu sola taşı */
    .logo-bar-area .btn.d-lg-none {
        order: 1 !important;
        position: absolute !important;
        left: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
    
    /* Search butonunu sağa taşı */
    .logo-bar-area .btn[data-toggle="class-toggle"][data-target="#search"] {
        order: 3 !important;
        position: absolute !important;
        right: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
    
    /* Logo container'ının parent'ındaki padding'i ayarla */
    .logo-bar-area .container {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0.5rem 60px !important; /* Yan butonlar için alan bırak */
    }
    
    /* Logo kendisini ortala */
    .logo-bar-area .col-auto a {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 0 !important;
    }
}

/* Daha büyük mobil cihazlar için */
@media (max-width: 991px) and (min-width: 768px) {
    .logo-bar-area .d-flex.align-items-center {
        justify-content: space-between !important;
    }
    
    .logo-bar-area .col-auto.pl-0.pr-1.d-flex.align-items-center {
        flex: 1 !important;
        justify-content: center !important;
        margin: 0 !important;
    }
}

/* Mobil görünümde header arama bölümünü gizle */
@media (max-width: 767px) {
    /* Arama ikonu butonunu gizle */
    .d-lg-none.ml-auto.mr-0,
    .d-lg-none[data-toggle="class-toggle"][data-target=".front-header-search"] {
        display: none !important;
    }
    
    /* Arama alanını (front-header-search) gizle */
    .front-header-search {
        display: none !important;
    }
    
    /* Arama form container'ını gizle */
    .flex-grow-1.front-header-search {
        display: none !important;
    }
    
    /* Küçük cihazlar için arama ikonu container'ını gizle */
    .logo-bar-area .d-lg-none:has([data-target=".front-header-search"]) {
        display: none !important;
    }
}

/* Tablet görünümde de arama butonunu gizle */
@media (max-width: 991px) {
    .d-lg-none[data-target=".front-header-search"] {
        display: none !important;
    }
    
    .d-lg-none.ml-auto.mr-0 {
        display: none !important;
    }
}

/* Logo ortalama düzeltmesi - arama butonu kaldırıldığında */
@media (max-width: 767px) {
    /* Arama butonu kaldırıldığında logo container'ını güncelle */
    .logo-bar-area .container {
        padding: 0.5rem 15px !important; /* Sağ padding'i azalt */
    }
    
    /* Logo'yu tam ortala */
    .logo-bar-area .d-flex.align-items-center {
        justify-content: center !important;
        position: relative !important;
    }
    
    /* Menü butonunu sol köşeye yerleştir */
    .logo-bar-area .btn.d-lg-none.mr-3.mr-sm-4 {
        position: absolute !important;
        left: 15px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
    }
    
    /* Logo container'ını ortala */
    .logo-bar-area .col-auto.pl-0.pr-1 {
        margin: 0 auto !important;
        flex: none !important;
    }
}