@charset "utf-8";

/* CSS Document */

:root {

    --navbar-height: 60px;

}



/* =======================================================

   🟨 STICKY ETİKET BUTONLAR

======================================================= */
.bm-tabs-sticky-wrapper {

    position: sticky;

    top: var(--navbar-height);

    z-index: 1050;

    padding: 10px 0;

    will-change: transform;

	padding: 25px 0 10px;

    transition: all 0.3s ease;

	



}

/* SCROLL OLDUĞUNDA GÖRÜNÜMÜ NETLEŞTİR */

.bm-tabs-sticky-wrapper.scrolled {

     background: rgba(255, 255, 255, 0.05);

    backdrop-filter: blur(10px); 

    box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* Sayfadan ayrıştığını belli eder */

}


/* İç hizalama */

.product-tabs-wrapper {

    display: flex;

    justify-content: center; /* İçerideki butonları yatayda ortalar */

    flex-wrap: wrap;

    gap: 12px;

    width: 100%; /* Alanın tamamını kaplamasını sağla */

    margin: 0 auto; /* Dış garantör olarak ortala */

}


/* Buton */

.btn-product-tab {    

	background-color: #ffffff;  

	

	border: 1px solid #dadada;    

	border-bottom: 2px solid #b99b24;    

	border-radius: 5px;    

	color: #333;    

	padding: 8px 14px 4px;    

	font-family: 'Quicksand', sans-serif;    

	font-size: 0.7rem;    

	font-weight: 800; 

	line-height: 0.8rem;

	transition: all 0.3s ease;    

	min-width: 130px;    

	max-width: 150px;    

	height: 50px;}



/* Hover */

.btn-product-tab:hover {

    background: #fff;

    box-shadow: 0 5px 15px rgba(0,0,0,0.08);

    transform: translateY(-2px);

}



/* Active */

.btn-product-tab.active {

    background: #d4af37;

    color: #fff;

    border-color: #d4af37;

}

 .bm-tabs-sticky-wrapper.scrolled .product-tabs-wrapper {

    background: rgba(250, 250, 250, 0.01);

    backdrop-filter: blur(48px);



    border-radius: 5px 8px;

	padding: 0 5px;

}