img.logo.img-fluid{
    max-width: 45%;
    margin: 15px;
}
.header-bottom .navbar-brand .logo{
    width: 90px;
}
.header-top{
    display: none;
}
.footer .footer__block__content-list a {
    width: fit-content;
}
#menu-mobile.menu--mobile .menu__list a{
    width: 100%;
}
.header {
    --header-bg: transparent;
}
.product__description-short.rich-text {
    margin: 10% 0;
}
.bx-prev::before {
    content: "◀";
}
.bx-next::before {
    content: "️️▶";
}
.navbar-brand.d-block{
    text-align: center;
}
.bx-wrapper .bx-controls-direction a{
    top:50%;
    height: 42px;
    width: 30px;
}
.container .table{
    padding: 15px 0;
}
#menu-mobile .menu__list .menu__link{
    font-size: 20px;
}
#header{
    position: fixed;
    top: 0;
    width: 100%;
    box-shadow: none;
}
#index #header ,#index #header .header-bottom , #index #header .header-nav{
    background:transparent;
}
#cms #home-slider , #product #home-slider ,#cart #home-slider ,#authentication #home-slider,#contact #home-slider,#category #home-slider,
#registration #home-slider,#my-account #home-slider,#identity #home-slider,#address #home-slider,#history #home-slider,#order-slip #home-slider,
#module-blockwishlist-lists #home-slider,#module-psgdpr-gdpr #home-slider,#module-ps_emailalerts-account #home-slider,#view #home-slider,
#prices-drop #home-slider,#new-products #home-slider,#best-sales #home-slider,#sitemap #home-slider,#checkout #home-slider,#pagenotfound #home-slider,
#addresses #home-slider,#password #home-slider,#stores #home-slider,#manufacturer #home-slider,#guest-tracking #home-slider
{
    display: none;
}
#cms #wrapper ,#contact #wrapper ,#category #wrapper,#authentication #wrapper,#registration #wrapper,#product #wrapper,#contact #wrapper,#cart #wrapper,
#my-account #wrapper,#identity #wrapper,#address #wrapper,#history #wrapper,#order-slip #wrapper,#view #wrapper, #module-blockwishlist-lists #wrapper,
#module-psgdpr-gdpr #wrapper,#module-ps_emailalerts-account #wrapper,#prices-drop #wrapper,#new-products #wrapper,#best-sales #wrapper,#checkout #wrapper,
#sitemap #wrapper,#pagenotfound #wrapper,#addresses #wrapper,#password #wrapper,#stores #wrapper,#manufacturer #wrapper,#guest-tracking #wrapper
{
    padding-top: 84px;
}
#wrapper.wrapper{
    margin-bottom: 2%;
}
.table-cell video.img-thumbnail,.img-thumbnail{
    border: none !important;
    border-radius: 15px;
}
#custom-text{
    padding: 4rem 1rem 0;
}
#index #boixhome{
margin: 4% 0;
}
.page-product .product__images .carousel{
    width: 85%;
    margin: 15px 0;
}
.page-product .product__add-to-cart{
    margin-bottom: 0;
}

#index #carousel{
    display: block;
}
#cms #carousel , #product #carousel ,#cart #carousel ,#authentication #carousel,#contact #carousel,#category #carousel,
#registration #carousel,#my-account #carousel,#identity #carousel,#address #carousel,#history #carousel,#order-slip #carousel,
#module-blockwishlist-lists #carousel,#module-psgdpr-gdpr #carousel,#module-ps_emailalerts-account #carousel,#view #carousel,
#prices-drop #carousel,#new-products #carousel,#best-sales #carousel,#sitemap #carousel,#checkout #carousel,#pagenotfound #carousel,
#addresses #carousel
{
    display: none;
}
.custom-text__content h1{
    font-size: clamp(22px, 3vw, 36px);
}
.description p {
    font-size: clamp(16px, 1vw, 28px);
}
/* Reset default Bootstrap ratio padding */
.ratio-homeSlider {
    min-height: 0;
    aspect-ratio: 16 / 9; /* Enforce 16:9 aspect ratio */
    width: 100%;
    max-width: 100vw;
    position: relative;
    overflow: hidden;
}
.carousel-control-prev,.carousel-control-next{
    z-index: 3;
}

.ratio-homeSlider::before {
    padding-top: 0 !important;
}

/* Full-screen carousel with 16:9 aspect ratio */
#home-slider {
    width: 100%;
    max-width: 100vw;
    aspect-ratio: 16 / 9;
    position: relative;
    overflow: hidden;
}

#home-slider .carousel,
#home-slider .carousel-inner,
#home-slider .carousel-item,
#home-slider .carousel-item figure {
    width: 100%;
    height: 100%;
    margin: 0;
    aspect-ratio: 16 / 9;
}

/* Images in carousel */
#home-slider .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* YouTube video container */
.yt_video {
    position: relative;
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

/* YouTube iframe - maintain 16:9 with object-fit */
.yt_video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensure video fills container while maintaining 16:9 */
    border: none;
    z-index: 1;
    box-sizing: unset;
}

/* Fallback for browsers without object-fit support */
@supports not (object-fit: cover) {
    .yt_video iframe {
        top: 50%;
        left: 50%;
        width: 100vw;
        height: 56.25vw; /* 16:9 aspect ratio */
        min-height: 100%;
        min-width: 177.78%; /* 16:9 aspect ratio */
        transform: translate(-50%, -50%);
    }
}

/* Video overlay for interaction or effects */
.yt_video .video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    z-index: 2;
    pointer-events: auto;
}

/* Fallback for browsers without aspect-ratio support */
@supports not (aspect-ratio: 16 / 9) {
    #home-slider,
    #home-slider .carousel,
    #home-slider .carousel-inner,
    #home-slider .carousel-item,
    #home-slider .carousel-item figure,
    .yt_video {
        height: 0;
        padding-bottom: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
    }
}

/* Media Queries for Responsive Design */

/* Tablets and smaller screens */
@media (max-width: 768px) {
    #home-slider,
    #home-slider .carousel,
    #home-slider .carousel-inner,
    #home-slider .carousel-item,
    #home-slider .carousel-item figure,
    .yt_video {
        max-height: calc(100vh - 64px);
    }

    @supports (aspect-ratio: 16 / 9) {
        #home-slider,
        #home-slider .carousel,
        #home-slider .carousel-inner,
        #home-slider .carousel-item,
        #home-slider .carousel-item figure,
        .yt_video {
            height: auto;
            max-height: calc(100vh - 64px);
        }
    }

    @supports not (aspect-ratio: 16 / 9) {
        #home-slider,
        #home-slider .carousel,
        #home-slider .carousel-inner,
        #home-slider .carousel-item,
        #home-slider .carousel-item figure,
        .yt_video {
            height: 0;
            padding-bottom: 56.25%;
            max-height: calc(100vh - 64px);
        }
    }
}

/* Small screens (e.g., mobile phones) */
@media (max-width: 576px) {
    #home-slider,
    #home-slider .carousel,
    #home-slider .carousel-inner,
    #home-slider .carousel-item,
    #home-slider .carousel-item figure,
    .yt_video {
        max-height: calc(100vh - 80px); /* Increased offset for smaller screens */
    }

    @supports (aspect-ratio: 16 / 9) {
        #home-slider,
        #home-slider .carousel,
        #home-slider .carousel-inner,
        #home-slider .carousel-item,
        #home-slider .carousel-item figure,
        .yt_video {
            height: auto;
            max-height: calc(100vh - 80px);
        }
    }
}

/* Very small screens (e.g., narrow mobile devices) */
@media (max-width: 400px) {
    #home-slider,
    #home-slider .carousel,
    #home-slider .carousel-inner,
    #home-slider .carousel-item,
    #home-slider .carousel-item figure,
    .yt_video {
        max-height: calc(100vh - 100px); /* Extra offset for very small screens */
    }
}

/* Wide screens (aspect ratio >= 16:9) */
@media (min-aspect-ratio: 16/9) {
    #home-slider,
    #index .yt_video {
        width: 100vw;
        height: 56.25vw; /* Maintain 16:9 */
        max-height: 100vh;
    }

    .yt_video iframe {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}


/* High-resolution displays (e.g., Retina) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    #home-slider .carousel-item img {
        image-rendering: optimizeQuality; /* Improve image quality */
    }
}

#content-wrapper {
    padding-bottom: 0;
}
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}
.table {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0;
    border-radius: 8px;
    transition: opacity 0.3s ease;
}
.table-cell {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 15px;
    transition: ease 0.5s;
}
.table-cell .texte{
    padding: 0 15px;
}
.table-cell .span_to_img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}
.description p:last-child{
    margin-bottom: 0;
}
.texte .description ul{
    list-style: disc;
    padding-left: 15px;
}
#product #wrapper .container{
    margin-bottom: 50px;
}


header .header-bottom,nav.header-bottom,.offcanvas
,.footer .footer__main,.footer{
    background-color: #4A7043;
}
.material-icons{
    cursor: pointer;
}
.header-bottom,.header-top {
    border-bottom: none;
}
.header-block__action-btn:hover,.carousel-caption,.carousel .carousel-content p
,.main-menu__mobile .menu a, .main-menu__mobile .menu li:not(.h5),button.btn-close.text-reset,.main-menu__title
,.js-back-button,.js-back-button:hover,.header-block--active .header-block, .header-block--active .header-block__icon
,.main-menu__tree > li .menu-container a[data-depth="1"]{
    color: white ;
}
.main-menu__tree > li .menu-container {
    background-color: #4a7043;
    border-top: 1px solid #4a7043;
}
.btn-close {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}
.main-menu__tree > li .menu-container a[data-depth="1"]:hover{
    color: #00c062;
}
.header a:not(.dropdown-item):not(.btn):hover,.header a:not(.dropdown-item):not(.btn):hover i
,.header-block__action-btn,.header a:not(.dropdown-item):not(.btn){
    color: white;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: #4a7043;
}
.account-menu > a.active .link-item, .account-menu > a.active .link-item i
, .account-menu > a:hover .link-item, .account-menu > a:hover .link-item i {
    color: #4a7043;
}
.wishlist-list-item:hover .wishlist-list-item-title {
    color: #6a7375 !important;
}
.cart__item .product-line__actions a::after {
    background: #c0392b;
}

a,.cart-summary__show i {
    color: black;
}
.customer-link a span:hover, .customer-link__link span:hover{
    background-color: #4a7043;
}
.carousel .carousel-indicators button.active {
    background-color: #4A7043;
}
.header-block__badge{
    background-color: #bbb ;
}
/* product */
.thumbnails__container .thumbnail.active img{
    border: 2px solid #4A7043;
}
.wishlist-toast.success {
    background-color: #6B8E23 !important;
    border-color: #6B8E23 !important;
}
.wishlist-product-combinations a:hover {
    color: #bbb !important;
}
.wishlist-button-add i {
    color: #ff0000 !important;
}
.custom-checkbox input[type="checkbox"] + span.color.active, .custom-checkbox input[type="checkbox"] + span.color:hover
, .variant-links .color.active, .variant-links .color:hover, label .color.active, label .color:hover{
    border: 2px solid #4A7043;
}
.product__discount-percentage,.product__current-price{
    color: red;
}

/* product flags */
.badge.discount {
    background-color: white;
    border: 1px solid #A93226;
    color: #A93226;
}
.badge {
    background-color: #A93226;
    margin: .25rem;
    font-size: 22px;
}
.item-product svg.replaced-svg path{
    fill: #4A7043;
}


/* form */
.form-check-input:checked {
    background-color: #4A7043;
    border-color: #4A7043;
}
.form-control::placeholder, .modal.product-comment-modal .form-control::placeholder, .modal.product-comment-modal textarea::placeholder{
    color: #cdd7cb;
}
.form-control:focus, .modal.product-comment-modal .form-control:focus, .modal.product-comment-modal textarea:focus,.form-select:focus {
    border-color: #4A7043;
    box-shadow: 0 0 0 .25rem rgba(74, 112, 67, 0.33);
}

/* footer */
.email-subscription .email-subscription__content__inputs input[type="email"] {
color: black;
}
.footer .footer__block__content-list a.logout{
    color: #dee2e6;
}
.footer .footer__block__content-list:hover a.logout{
    color: #ffffff;
}





/*icon */
#search_widget form i{
    color: #2b542c;
}

/* btn */
.all-product-link.btn i,.btn-link:hover,.btn:first-child:active{
    color: #FFBFBF ;
}
.btn-link {
    color: black;
}
.btn-outline-primary {
    --bs-btn-color: #C0392B;
    --bs-btn-border-color: #C0392B;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #C0392B;
    --bs-btn-hover-border-color: #C0392B;
    --bs-btn-focus-shadow-rgb: 13,110,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #C0392B;
    --bs-btn-active-border-color: #C0392B;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    --bs-btn-disabled-color: #C0392B;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #C0392B;
    --bs-gradient: none;
}
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #C0392B;
    --bs-btn-border-color: #C0392B;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #A93226;
    --bs-btn-hover-border-color: #A93226;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #A93226;
    --bs-btn-active-border-color: #A93226;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #C0392B;
    --bs-btn-disabled-border-color: #C0392B;
}

@media (max-width: 1200px) {
    #cms #wrapper ,#contact #wrapper ,#category #wrapper,#authentication #wrapper,#registration #wrapper,#product #wrapper,#contact #wrapper,#cart #wrapper,
    #my-account #wrapper,#identity #wrapper,#address #wrapper,#history #wrapper,#order-slip #wrapper,#view #wrapper, #module-blockwishlist-lists #wrapper,
    #module-psgdpr-gdpr #wrapper,#module-ps_emailalerts-account #wrapper,#prices-drop #wrapper,#new-products #wrapper,#best-sales #wrapper,#checkout #wrapper,
    #sitemap #wrapper,#pagenotfound #wrapper,#addresses #wrapper,#password #wrapper,#stores #wrapper,#manufacturer #wrapper,#guest-tracking #wrapper
    {
        padding-top: 63px;
    }

    img.logo.img-fluid{
        max-width: 40%;
        margin: 0;
    }
    .navbar-brand.d-block{
        text-align: left;
    }
}

@media (max-width: 1024px) {
    .description p:last-child {
        margin-bottom: 15px;
    }
    .table-cell .span_to_img {
        width: 100%;
        max-width: 100%;
        max-height: 100%;
    }
    .table-cell .texte {
        padding:15px 0;
    }
    .table {
        display: block;
        padding: 15px 0;
    }
    .table-cell {
        width: 100%;
    }
}

@media (max-width: 975px) {

}

@media (min-width: 767px) {
    .menu-hide{
        display: none;
    }
}
@media (max-width: 767px) {

    .header {
        --header-bg: #2E6F40;
    }
    #cms #wrapper, #contact #wrapper, #category #wrapper, #authentication #wrapper,
    #registration #wrapper, #product #wrapper, #contact #wrapper, #cart #wrapper, #my-account #wrapper,
    #identity #wrapper, #address #wrapper, #history #wrapper, #order-slip #wrapper, #view #wrapper,
    #module-blockwishlist-lists #wrapper, #module-psgdpr-gdpr #wrapper, #module-ps_emailalerts-account #wrapper,
    #prices-drop #wrapper, #new-products #wrapper, #best-sales #wrapper, #checkout #wrapper, #sitemap #wrapper,
    #pagenotfound #wrapper, #addresses #wrapper, #password #wrapper {
        padding-top: 48px;
    }
    main{
        min-height: calc(100vh - 460px);
    }
    .page-product .product__images .carousel{
        width: 100%;
    }
}


