:root {
    /* Bodyminute Raw Colors */
    --color-white: oklch(1 0 0);
    /* Blue */
    --color-blue-50: oklch(0.941 0.0285 279.36);
    --color-blue-100: oklch(0.8901 0.054 278.35);
    --color-blue-200: oklch(0.7806 0.1115 274.54);
    --color-blue-300: oklch(0.6636 0.1778 269.63);
    --color-blue-400: oklch(0.5556 0.2403 261.22);
    --color-blue-500: oklch(0.4423 0.1912 261.21);
    --color-blue-600: oklch(0.379 0.1642 261.2);
    --color-blue-700: oklch(0.3171 0.1372 261.3);
    --color-blue-800: oklch(0.2649 0.1138 260.91);
    --color-blue-900: oklch(0.2021 0.0872 260.97);
    --color-blue-950: oklch(0.154 0.0655 260.73);

    /* Pink */
    --color-pink-50: oklch(0.9596 0.018 351.15);
    --color-pink-100: oklch(0.9261 0.0335 349.09);
    --color-pink-200: oklch(0.8512 0.0739 348.73);
    --color-pink-300: oklch(0.7661 0.128 348.9);
    --color-pink-400: oklch(0.6885 0.1861 348.45);
    --color-pink-500: oklch(0.6041 0.1997 348.51);
    --color-pink-600: oklch(0.5141 0.1701 348.05);
    --color-pink-700: oklch(0.4232 0.1407 348.17);
    --color-pink-800: oklch(0.3249 0.1083 348.66);
    --color-pink-900: oklch(0.2344 0.0766 348.27);
    --color-pink-950: oklch(0.186 0.0606 349.14);

    /* Gray */
    --color-gray-50: oklch(0.9885 0.0054 274.97);
    --color-gray-100: oklch(0.9849 0.0029 264.54);
    --color-gray-200: oklch(0.8901 0.0152 277.83);
    --color-gray-300: oklch(0.9523 0.0083 271.33);
    --color-gray-400: oklch(0.9318 0.011 274.89);
    --color-gray-500: oklch(0.8901 0.0152 277.83);
    --color-gray-600: oklch(0.8235 0.0253 278.29);
    --color-gray-700: oklch(0.6749 0.0434 275.99);
    --color-gray-800: oklch(0.5475 0.0458 275.66);
    --color-gray-900: oklch(0.4251 0.0423 274);
    --color-gray-950: oklch(0.2293 0.0766 270.65);

    /* Red */
    --color-red-50: oklch(0.9741 0.0097 17.32);
    --color-red-100: oklch(0.9741 0.0097 17.32);
    --color-red-200: oklch(0.8331 0.0723 18.72);
    --color-red-300: oklch(0.7531 0.113 20.06);
    --color-red-400: oklch(0.5858 0.1788 24.53);
    --color-red-500: oklch(0.4987 0.1487 24.28);
    --color-red-600: oklch(0.4063 0.1181 24.02);

    /**
     ** Bodyminute Semantic Colors
    */
    --color-text-tertiary: var(--color-gray-950);
    --color-text-secondary: var(--color-gray-800);
    --color-text-critical: var(--color-red-600);
    --color-text-inverted: var(--color-white);
    --color-text-brand: var(--color-blue-500);

    --color-link: var(--color-blue-500);
    --color-link-hover: var(--color-blue-600);
    --color-link-active: var(--color-blue-700);

    --color-icon: var(--color-gray-600);

    --color-surface-primary: var(--color-blue-500);
    --color-surface-primary-hover: var(--color-blue-400);
    --color-surface-primary-active: var(--color-blue-600);
    --color-surface-primary-disabled: color-mix(
            in oklch,
            var(--color-surface-primary) 50%,
            transparent
    );

    --color-surface-secondary: var(--color-pink-200);
    --color-surface-secondary-light: var(--color-pink-50);
    --color-surface-secondary-lighter: var(--color-pink-100);
    --color-surface-secondary-hover: var(--color-pink-300);
    --color-surface-secondary-active: var(--color-pink-400);
    --color-surface-secondary-disabled: color-mix(
            in oklch,
            var(--color-surface-secondary) 50%,
            transparent
    );

    --color-surface-tertiary: var(--color-white);
    --color-surface-tertiary-hover: var(--color-gray-200);
    --color-surface-tertiary-active: var(--color-gray-400);
    --color-surface-tertiary-disabled: color-mix(in oklch, var(--color-white) 50%, transparent);

    /* Black alphas */
    --color-primary-alpha-10: oklch(0.4423 0.1912 261.21 / 0.1);
    --color-primary-alpha-20: oklch(0.4423 0.1912 261.21 / 0.2);
    --color-primary-alpha-30: oklch(0.4423 0.1912 261.21 / 0.3);
    --color-primary-alpha-40: oklch(0.4423 0.1912 261.21 / 0.4);
    --color-primary-alpha-50: oklch(0.4423 0.1912 261.21 / 0.5);

    /* Pink alphas */
    --color-pink-alpha-10: oklch(0.8512 0.0739 348.73 / 0.1);
    --color-pink-alpha-20: oklch(0.8512 0.0739 348.73 / 0.2);
    --color-pink-alpha-30: oklch(0.8512 0.0739 348.73 / 0.3);
    --color-pink-alpha-40: oklch(0.8512 0.0739 348.73 / 0.4);
    --color-pink-alpha-50: oklch(0.8512 0.0739 348.73 / 0.5);

    /* Black alphas */
    --color-black-alpha-10: oklch(0.167 0.0522 270.72 / 0.1);
    --color-black-alpha-20: oklch(0.167 0.0522 270.72 / 0.2);
    --color-black-alpha-30: oklch(0.167 0.0522 270.72 / 0.3);
    --color-black-alpha-40: oklch(0.167 0.0522 270.72 / 0.4);
    --color-black-alpha-50: oklch(0.167 0.0522 270.72 / 0.5);

    --color-border: var(--color-gray-200);
    --color-overlay: var(--color-black-alpha-50);

    /* Bodyminute Typography System */

    --font-size-xs: 0.75rem;
    --line-height-xs: 1.33;
    --letter-spacing-xs: 0.02em;

    --font-size-sm: 0.875rem;
    --line-height-sm: 1.4;
    --letter-spacing-sm: 0.02em;

    --font-size-md: 1rem;
    --line-height-md: 1.5;
    --letter-spacing-md: 0.02em;

    --font-size-lg: 1.125rem;
    --line-height-lg: 1.5;
    --letter-spacing-lg: 0.02em;

    --font-size-xl: clamp(1.125rem, 1rem + 0.5vw, 1.25rem);
    --line-height-xl: 1.33;
    --letter-spacing-xl: 0.02em;

    --font-size-2xl: clamp(1.25rem, 1rem + 1vw, 1.5rem);
    --line-height-2xl: 1.333;
    --letter-spacing-2xl: 0.02em;

    --font-size-3xl: clamp(1.5rem, 1rem + 2vw, 2rem);
    --line-height-3xl: 1.25;
    --letter-spacing-3xl: 0.02em;

    --font-size-4xl: clamp(1.75rem, 1rem + 3vw, 2.5rem);
    --line-height-4xl: 1.2;
    --letter-spacing-4xl: 0.02em;

    --font-size-5xl: clamp(2rem, 1rem + 4vw, 2.75rem);
    --line-height-5xl: 1.2;
    --letter-spacing-5xl: 0.02em;

    --font-size-6xl: clamp(2.5rem, 1rem + 5vw, 3rem);
    --line-height-6xl: 1.2;
    --letter-spacing-6xl: 0.02em;

    --radius-full: 999rem;
    --radius-sm: 0.375rem;
    --radius-base: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1.5rem;

    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
}
.text-2xs {
    font-size: var(--font-size-2xs);
    line-height: var(--line-height-2xs);
    letter-spacing: var(--letter-spacing-2xs);
}
.text-xs {
    font-size: var(--font-size-xs);
    line-height: var(--line-height-xs);
    letter-spacing: var(--letter-spacing-xs);
}
.text-sm {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-sm);
    letter-spacing: var(--letter-spacing-sm);
}
.text-md {
    font-size: var(--font-size-md);
    line-height: var(--line-height-md);
    letter-spacing: var(--letter-spacing-md);
}
.text-lg {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-lg);
    letter-spacing: var(--letter-spacing-lg);
}
.text-xl {
    font-size: var(--font-size-xl);
    line-height: var(--line-height-xl);
    letter-spacing: var(--letter-spacing-xl);
}
.text-2xl {
    font-size: var(--font-size-2xl);
    line-height: var(--line-height-2xl);
    letter-spacing: var(--letter-spacing-2xl);
}
.text-3xl {
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-3xl);
    letter-spacing: var(--letter-spacing-3xl);
}
.text-4xl {
    font-size: var(--font-size-4xl);
    line-height: var(--line-height-4xl);
    letter-spacing: var(--letter-spacing-4xl);
}
.text-5xl {
    font-size: var(--font-size-5xl);
    line-height: var(--line-height-5xl);
    letter-spacing: var(--letter-spacing-5xl);
}
.text-button {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-sm);
    letter-spacing: var(--letter-spacing-sm);
}
.text-button {
    font-weight: 600;
    text-transform: uppercase;
}
.link-underline {
    position: relative;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
}
.link-underline:before {
        content: '';
        position: absolute;
        bottom: -4px;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: currentColor;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s ease-in-out;
    }
.link-underline:hover::before {
        transform: scaleX(1);
    }
.is-heading-text {
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-3xl);
    letter-spacing: var(--letter-spacing-3xl);
}
.is-heading-text {
    color: var(--color-text-brand);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
}
@each $size in xs, sm, md, lg, xl {
    .has-padding-x-$(size) {
        padding-inline-start: var(--wp--preset--spacing--$(size));
        padding-inline-end: var(--wp--preset--spacing--$(size));
    }

    .has-padding-y-$(size) {
        padding-block-start: var(--wp--preset--spacing--$(size));
        padding-block-end: var(--wp--preset--spacing--$(size));
    }

    .has-margin-x-$(size) {
        margin-inline-start: var(--wp--preset--spacing--$(size));
        margin-inline-end: var(--wp--preset--spacing--$(size));
    }

    .has-margin-y-$(size) {
        margin-block-start: var(--wp--preset--spacing--$(size));
        margin-block-end: var(--wp--preset--spacing--$(size));
    }
}
@media (max-width: 767px) {
    @each $size in xs, sm, md, lg, xl {
        .has-padding-x-$(size)-mobile {
            padding-inline-start: var(--wp--preset--spacing--$(size));
            padding-inline-end: var(--wp--preset--spacing--$(size));
        }

        .has-padding-y-$(size)-mobile {
            padding-block-start: var(--wp--preset--spacing--$(size));
            padding-block-end: var(--wp--preset--spacing--$(size));
        }

        .has-margin-x-$(size)-mobile {
            margin-inline-start: var(--wp--preset--spacing--$(size));
            margin-inline-end: var(--wp--preset--spacing--$(size));
        }

        .has-margin-y-$(size)-mobile {
            margin-block-start: var(--wp--preset--spacing--$(size));
            margin-block-end: var(--wp--preset--spacing--$(size));
        }
    }
}
.focus-ring {
    outline: 2px solid var(--color-primary-alpha-20);
    outline-offset: 2px;
}
.container {
    box-sizing: border-box;
    width: min(100%, var(--wp--style--global--wide-size, 1260px));
    margin-inline: auto;
    padding-inline: var(--wp--preset--spacing--md, 1rem);
}
.card.card-product {
    padding: 0;
    border: 0;
    background: var(--color-gray-100);
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 0.5rem;
}
.card-product__image img {
            aspect-ratio: 3/4;
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }
.card-product__content {
        padding: 0 1.5rem .5rem;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        align-items: center;
    }
.card-product__badge {
        padding: 0.375rem 0.75rem;
    }
.card-product__badge {
    font-size: var(--font-size-xs);
    line-height: var(--line-height-xs);
    letter-spacing: var(--letter-spacing-xs);
    }
.card-product__badge {
        background: var(--color-surface-secondary-lighter);
        border-radius: var(--radius-sm);
        color: var(--color-text-brand);
        width: -moz-fit-content;
        width: fit-content;
        position: absolute;
        top: 0.75rem;
        left: 0.75rem;
        font-weight: var(--fw-medium);
    }
.card-product__meta {
        color: var(--color-text-brand);
    }
.card-product__meta {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-sm);
    letter-spacing: var(--letter-spacing-sm);
    }
.card-product__title {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-lg);
    letter-spacing: var(--letter-spacing-lg);
    }
.card-product__title {
        font-weight: var(--fw-semibold);
        margin: 0;
    }
.card-product__title a {
            color: var(--color-text-brand);
            text-decoration: none;
            transition: color 0.2s ease;
        }
.card-product__title a:hover,
            .card-product__title a:focus {
                color: var(--color-link-hover);
            }
.card-product__title a:focus-visible {
                outline: 2px solid var(--color-border-brand);
                outline-offset: 2px;
                border-radius: var(--radius-sm);
            }
.card-product__heading {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
    }
.card-product__price {
        display: flex;
        gap: 0.75rem;
        justify-content: center;
    }
.card-product__price {
    font-size: var(--font-size-md);
    line-height: var(--line-height-md);
    letter-spacing: var(--letter-spacing-md);
    }
.card-product__price-discounted {
            color: var(--color-text-brand);
            font-weight: var(--fw-semibold);
        }
.card-product__price-original {
            color: var(--color-text-secondary);
            text-decoration: line-through;
        }
.card-product__cta {
        margin-top: auto;
        padding: 0 1.5rem .5rem;
    }
.bm-shopify-products--carousel .swiper-pagination {
    display: none;
}
/* Fallback when carousel JS is not yet initialized/cached. */
@media (max-width: 639px) {
    .bm-shopify-products--carousel:not([data-carousel-initialized="true"]) .swiper-wrapper {
        gap: 16px;
    }

    .bm-shopify-products--carousel:not([data-carousel-initialized="true"]) .swiper-slide {
        width: calc((100% - 16px) / 1.5);
        flex: 0 0 calc((100% - 16px) / 1.5);
    }
}

.bm-selector {
    margin-top: 8px;
}

.bm-selector__header {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-bottom: 12px;
}

.bm-selector__search {
    flex: 1;
}

.bm-selector__reset {
    flex-shrink: 0;
}

.bm-selector__loading,
.bm-selector__empty {
    padding: 16px;
    text-align: center;
    color: #757575;
}

.bm-selector__loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.bm-selector__list {
    max-height: 250px;
    overflow-y: auto;

}

.bm-selector__no-results {
    padding: 16px;
    text-align: center;
    color: #757575;
    margin: 0;
}

.bm-product-selector {
    margin-top: 8px;
}

/* Résultats de recherche en haut */

.bm-product-selector__results {
    margin-top: 12px;
    margin-bottom: 20px;
}

.bm-product-selector__results-title {
    margin: 0 0 8px 0;
    font-size: 11px;
    font-weight: 600;
    color: #1e1e1e;
    text-transform: uppercase;
}

.bm-product-selector__results-list {
    max-height: 250px;
    overflow-y: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: white;
}

.bm-product-selector__result-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    transition: all 0.2s ease;
}

.bm-product-selector__result-item:last-child {
    border-bottom: none;
}

.bm-product-selector__result-item:hover {
    background-color: #f5f5f5;
}

.bm-product-selector__result-item.is-selected {
    background-color: #e6f2ff;
    border-left: 3px solid #0073aa;
}

.bm-product-selector__result-image {
    width: 45px;
    height: 45px;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
    border: 1px solid #e0e0e0;
}

.bm-product-selector__result-info {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.bm-product-selector__result-title {
    font-size: 13px;
    font-weight: 500;
    color: #1e1e1e;
    flex: 1;
}

.bm-product-selector__selected-title {
    margin: 0 0 12px 0;
    font-size: 11px;
    font-weight: 600;
    color: #1e1e1e;
    text-transform: uppercase;
}

.bm-product-selector__selected-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bm-product-selector__selected-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    background: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: move;
    transition: all 0.2s ease;
}

.bm-product-selector__selected-item:hover {
    background-color: #f5f5f5;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.bm-product-selector__drag-handle {
    color: #999;
    cursor: grab;
    flex-shrink: 0;
}

.bm-product-selector__drag-handle:active {
    cursor: grabbing;
}

.bm-product-selector__selected-text {
    flex: 1;
    font-size: 13px;
    color: #1e1e1e;
    font-weight: 500;
}

.bm-product-selector__remove {
    flex-shrink: 0;
    min-width: auto !important;
    padding: 4px !important;
}

.bm-product-selector__remove svg {
    width: 18px;
    height: 18px;
}

.bm-product-selector__hint {
    padding: 16px;
    text-align: center;
    color: #757575;
    font-size: 12px;
    margin: 12px 0 0 0;
    font-style: italic;
}

