@charset "UTF-8";

/*!
 * Version - 1.1.1
 * Copyright (c) 2025

 * L’autorisation est accordée à toute personne qui en obtient une copie de ce style.
 * Il est strictement interdit de publier(vendre) sans l'autorisation préalable des auteurs.
 * Des spécialistes sont à l'origine des documents fournis.

*/

/* Home */
/* Carousel base class */
.carousel {
    margin-bottom: .5rem;
}

.carousel-caption {
    bottom: 3rem !important;
    right: 5% !important;
    left: 5% !important;
    z-index: 10;
}

.carousel-control-next,
.carousel-control-prev {
    width: 5% !important;
    color: #000000 !important;
}

.carousel-item {
    /* height: 34rem; */
    height: auto;
}

#dmo-slides .title {
    color: #001e2b !important;
    font-weight: 700 !important;
    font-size: 3rem;
}

/* End Carousel base class */

/* Product */
.card-product {
    transition: box-shadow .3s;
    border: 0px !important;
}

.card-product .card-product-action {
    display: none;
    transition: display .3s;
}

.card-product:hover {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}

.card-product:hover .product-title {
    color: var(--primary);
}

.card-product:hover .card-product-action {
    display: flex;
    flex-direction: column;
    transition: display .3s;
}


.card-product:hover .card-hidden,
.card-product:hover .card-product-action {
    opacity: 1;
    visibility: visible
}

.card-product .product-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: transparent;
}

.card-product .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.card-product .product-title {
    margin: 0;
    font-size: .85rem;
    font-weight: normal;
    color: var(--dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color .3s;
}

.card-product .product-badge {
    --bg-color: #6AC1D5;
    --text-color: #002D3E;
    color: var(--text-color);
    background: var(--bg-color);
    padding: 1px 5px;
    font-size: 13px;
    border-radius: 2px;
    font-weight: 500;
}

.card-product .product-badge.badge-reduction {
    --bg-color: #f6e6b8;
    --text-color: #3e2500;
}


/* product buttons */

.dml-btn-view-product {
    --bs-btn-color: #FAEBB1;
    --bs-btn-bg: #6a769982 !important;
    ;
    --bs-btn-border-color: #32427082;
    --bs-btn-hover-color: #FAEBB1;
    --bs-btn-hover-bg: #324270;
    --bs-btn-hover-border-color: #324270;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #FAEBB1;
    --bs-btn-active-bg: #324270;
    --bs-btn-active-border-color: #324270;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #FAEBB1;
    --bs-btn-disabled-bg: #32427082;
    --bs-btn-disabled-border-color: #32427082;
}

.dml-btn-add-cart {
    --bs-btn-color: var(--dark);
    --bs-btn-bg: #ffc1075e !important;
    --bs-btn-border-color: #ffc1075e;
    --bs-btn-hover-color: var(--dark);
    --bs-btn-hover-bg: #ffc107;
    --bs-btn-hover-border-color: #ffc107;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: var(--dark);
    --bs-btn-active-bg: #ffc107;
    --bs-btn-active-border-color: #ffc1075e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--dark);
    --bs-btn-disabled-bg: #ffc1075e;
    --bs-btn-disabled-border-color: #ffc1075e;
}

/* End product buttons */

.countdown {
    padding: 14px 5px 26px;
    border: 1px solid #dfe2e1;
    font-size: 13px !important;
    width: 62px;
    height: 62px;
    border-radius: 2.5px;
}

.price {
    font-size: 14px !important;
}

@media only screen and (max-width: 767px) {

    /* Carousel */
    .carousel-caption {
        bottom: 0 !important;
    }

    #dmo-slides .title {
        font-size: 1.2rem !important;
    }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) and (max-width: 1180px) {

    /* Carousel */
    .carousel-caption {
        bottom: 0 !important;
    }

    #dmo-slides .title {
        font-size: 2rem !important;
    }

}