/* ==========================================================================
   SHOP - LISTING & GRIDS
   ========================================================================== */

.archive-grid .products,
.related ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    row-gap: 40px;
}

/* Carte produit */
.card-produit {
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: space-between;
}

.card-produit .card-image {
    border-radius: 12px;
    aspect-ratio: 1;
    object-fit: cover;
    overflow: hidden;
}

.card-produit img {
    transform: scale3d(1, 1, 1);
    transition: transform 0.4s ease;
}

.card-produit .card-image:hover img {
    transform: scale3d(1.1, 1.1, 1);
}

.card-produit .card-cat {
    margin-top: 1rem;
}

.card-produit .card-cat a {
    font-size: 0.8rem;
    color: var(--c-primaire);
    opacity: 0.8;
    margin: 8px 0 4px 0;
    font-weight: 500;
    text-transform: uppercase;
}

.card-produit .card-cat a:hover {
    opacity: 1;
}

.card-produit h2 {
    font-size: 1.125rem;
    font-weight: 500;
    margin: 0.2rem 0 0.5rem;
}

/* Bouton produit */
.card-produit .button {
    background: var(--bg-btn-primary);
    color: var(--c-btn-primary);
    width: 100%;
    border-radius: var(--s-radius);
}


/* ==========================================================================
   SHOP - RESPONSIVE
   ========================================================================== */

@media screen and (max-width: 1024px) {
    .archive-grid .products,
    .related ul {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* ==========================================================================
   MINI CART
   ========================================================================== */

.mini-cart-header {
    height: var(--h_header);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mini-cart-dropdown {
    height: 100dvh;
    background: #fff;
    position: fixed;
    z-index: 999999999;
    top: 0;
    right: 0;
    box-shadow: -4px 0 4px #00000021;
    padding: 0 1rem;
    width: 100%;
    max-width: 450px;
}

.mini-cart-dropdown table {
    width: 100%;
}

.mini-cart-items {
    max-height: 60%;
    overflow-y: auto;
}

.mini-cart-dropdown tr {
    display: flex;
    gap: 10px;
    margin-bottom: 2rem;
}

.mini-cart-dropdown tr td {
    width: auto;
}

.mini-cart-qty {
    font-size: 0.8rem;
}

.mini-cart-subtotal {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.mini-cart-btn {
    background: #000;
    color: #fff;
    justify-content: center;
}

.mini-cart-btn.outline {
    background: #fff;
    color: #000;
}

.mini-cart-info {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.mini-cart-line-total {
    vertical-align: initial;
}

.mini-cart-price {
    margin-bottom: 1rem;
}

.mini-cart-title {
    margin: 1rem 0 2rem;
    font-size: 0.8rem;
}

.mini-cart-actions {
    display: flex;
    gap: 0.5rem;
}

.mini-cart-actions a {
    width: 100%;
}

.mini-cart-dropdown thead {
    display: none;
}

.mini-cart-dropdown img {
    max-width: 70px;
}

.mini-cart-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1rem;
}


/* ==========================================================================
   SINGLE PRODUCT
   ========================================================================== */

.type-product .product-gallery {
    position: relative;
}

.type-product .onsale {
    right: 10px;
    left: auto;
}

.single-product-image img {
    aspect-ratio: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.type-product h1 {
    margin-bottom: 1rem;
}

.woocommerce-product-details__short-description {
    opacity: .7;
    margin-bottom: 2rem;
}

.price {
    margin-bottom: 1rem;
}

.cart {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-top: 1rem;
}

.single_add_to_cart_button {
    background-color: var(--bg-btn-primary);
    color: var(--c-btn-primary);
    width: 100%;
}

.product_meta {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: 1rem;
}

/* Tabs produit */
.wc-tabs {
    list-style: none;
}

.wc-tabs li a {
    height: 40px;
    display: inline-flex;
    align-items: center;
    padding: 0 20px;
    background-color: var(--cc-primaire);
    border-radius: 6px;
}

.wc-tabs li.active a {
    background-color: var(--bg-btn-primary);
    color: var(--c-btn-primary);
}

.woocommerce-Tabs-panel {
    margin-top: 1rem;
    padding: 2rem;
    border-radius: 12px;
    background-color: var(--cc-primaire);
}

.woocommerce-Tabs-panel ul {
    margin: 0 0 1rem 20px;
    line-height: 1.4;
}

.woocommerce-Tabs-panel p {
    margin-bottom: 1rem;
    line-height: 1.4;
}

.woocommerce-Tabs-panel h2 {
    margin-bottom: 1rem;
}

/* Galerie Embla */
.embla__viewport,
.embla__thumbnails img {
    border-radius: 12px;
}

.embla__viewport img {
    width: 100%;
    height: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

.embla__thumbnails {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 100px;
}

.embla--main-slider {
    display: flex;
    flex-direction: row-reverse;
    gap: 20px;
}

.embla__button {
    position: absolute;
    bottom: 20px;
    right: 20px;
}

.embla__button--prev {
    transform: translateX(-100%);
    margin-right: 10px;
}

/* Wrapper galerie/infos produit */
.product-summary-gallery-wrapper {
    display: flex;
    gap: 100px;
    margin-bottom: 4rem;
}

.product-summary-gallery-wrapper > div {
    width: 50%;
}

/* Produits liés */
.related {
    margin-top: 4rem;
}

.related h2 {
    margin-bottom: 1rem;
}

/* Quantité */
.quantity {
    display: inline-flex;
    background: #F4F4F4;
    border-radius: 6px;
}

.quantity input {
    border: none;
    width: 40px;
    text-align: center;
    background: #F4F4F4;
}

.quantity button {
    height: 40px;
    width: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* -------------------------------
   SINGLE PRODUCT - Responsive
   ------------------------------- */
@media screen and (max-width: 1024px) {
    .type-product .embla__thumbnails {
        max-width: 70px;
        min-width: 70px;
    }

    .type-product .product-summary-gallery-wrapper {
        flex-direction: column;
    }

    .type-product .product-summary-gallery-wrapper > div {
        width: 100%;
    }
}


/* ==========================================================================
   ACCOUNT (Mon compte)
   ========================================================================== */

.bizzet-coupons-header {
    padding: 1.2rem;
    background: #F4F4F4;
    border-radius: 12px;
}

.woocommerce-MyAccount-content table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 12px;
    overflow: hidden;
    background: #F4F4F4;
}

.woocommerce-MyAccount-content table th,
.woocommerce-MyAccount-content table td {
    text-align: left;
    padding: 1.2rem;
}

.woocommerce-MyAccount-content table thead {
    background-color: var(--bg-btn-primary);
    color: var(--c-btn-primary);
}

.woocommerce-MyAccount-content .button {
    width: 100%;
    border-radius: 6px;
    background-color: var(--bg-btn-primary);
    color: var(--c-btn-primary);
}

.woocommerce-MyAccount-content .button:nth-child(2) {
    background-color: var(--c-btn-primary);
    color: var(--bg-btn-primary);
}

.bizzet-coupon-actions {
    display: flex;
    gap: 10px;
}


.woocommerce-MyAccount-content{
	
	h2{
		margin: 1rem 0
	}
	mark{
		background:#F4F4F4;
		padding:6px 12px;
		display:inline-flex;
		border-radius:12px
	}
	
	tbody td,tfoot td,tfoot th{
		padding: 0.7rem 1.2rem;
		line-height:1;
	}
	
	.order-again a.button{
			width:auto !important;
		margin-top:1rem;
		}
	
	.woocommerce-customer-details{
		display:inline-flex;
		flex-direction:column;
		margin-top: 1rem;
		width:100%;
		max-width:400px;
		
		
		
		h2{
			margin:0;
		}
	}
	
	address{
		padding:1.2rem;
		background:#F4F4F4;
		border-bottom-left-radius:12px;
		border-bottom-right-radius:12px;
		line-height:1.5
	}
	
	.woocommerce-column__title{
	background-color: var(--bg-btn-primary);
	padding:1.2rem;
		color:white;
		font-size:1rem;
		font-weight:bold;
		border-top-left-radius:12px;
		border-top-right-radius:12px;
		
	}
}


/* ==========================================================================
   MODAL / FILTER DESKTOP
   ========================================================================== */

.modal-desktop-on #secondary {
    display: none;
}

.modal-desktop-on.modal-filter-open #secondary {
    display: block;
    position: fixed;
    right: 0;
    top: 0;
    height: 100dvh;
    max-width: 500px;
    background: #fff;
    z-index: 99;
    box-shadow: 0 0 10px #00000036;
}

.modal-desktop-on #secondary {
    position: relative;
    max-width: 0;
}

.sidebar-widgets,
.widget_block {
    height: 100%;
}

#bizzet-filter-container {
    display: flex;
    justify-content: space-between;
    height: 100%;
}

.bizzet-filter-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow-y: auto;
}

.modal-filter-open {
    overflow: hidden !important;
}

#bizzet-filter-toggle {
    display: flex;
    align-items: center;
    gap: 5px;
}


/* ==========================================================================
   MESSAGES / ALERTES
   ========================================================================== */

.woocommerce-message {
    background: #e1ffe1;
    color: green;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 12px;
    margin-bottom: 1rem;
}

.woocommerce-message .button {
    background-color: var(--bg-btn-primary);
    color: var(--c-btn-primary);
}


/* ==========================================================================
   DIVERS / UTILITAIRES
   ========================================================================== */

.products svg {
    color: #fff;
}

.card-cont {
    position: relative;
}

.onsale {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 9;
    height: 30px;
    background: #F4F4F4;
    padding: 0 12px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

@media screen and (max-width: 1024px) {
    #bizzet_header {
        position: relative;
        z-index: 999;
    }

    .ifsid {
        flex-direction: column-reverse !important;
    }

    .sidebar {
        max-width: 100%;
    }
}
