/* ==================================================
   VARIABLES GLOBALES
================================================== */

:root {
    /* Colors */
    --color-black: #292929;
    --color-white: #ffffff;
    --color-gray: #989898;
    --color-primary: #1ba8a0;
    --color-secondary: #074f5c;
    --color-accent: #17a8a2;
    --color-gray-bg: #f4f4f4;
    --color-gray-bg-light: #fafafa;
    --color-gray-light: #dddddd;
    --color-gray-medium: #dedede;
    --color-gray-dark: #525252;
    --color-gray-muted: #939393;
    --color-gray-soft: #f2f2f2;
    --color-danger: #f57069;
    --color-dark-blue: #162e36;
    --color-dark: #333;

    /* Fonts */
    --font-main: 'Poppins', Arial, Helvetica, sans-serif;

    /* Sizes */
    --header-fixe-height: 35px;
    --header-nonfixe-height: 100px;
    --badge-size: 16px;

    /* Common UI */
    --shadow-soft: 0 4px 8px rgba(41, 41, 41, 0.08);
    --shadow-menu: 0 4px 8px rgba(0, 0, 0, 0.08);
    --radius-4: 4px;
    --radius-8: 8px;
    --radius-12: 12px;
    --radius-20: 20px;
    --radius-25: 25px;
    --radius-30: 30px;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--font-main);
    color: var(--color-black);
    background-color: var(--color-gray-bg-light);
}

.header_fixe_web {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: var(--header-fixe-height);
    z-index: 2000;
    color: var(--color-white);
}

.header-fixe-gradient {
    background: linear-gradient(
        -45deg,
        var(--color-primary) 33%,
        var(--color-secondary) 20%
    );
}

.header-fixe-container {
    position: relative;
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
    z-index: 1100;
    padding: 6px 0 4px;
}

.header-fixe-left {
    float: left;
    padding-top: 2px;
}

.header-fixe-right {
    float: right;
    margin-top: -6px;
}

.header-fixe-icon {
    float: left;
}

.header-fixe-text {
    float: left;
    margin-top: 8px;
    margin-right: 8px;
    margin-left: 10px;
}

.header-fixe-retailer {
    float: right;
    margin-top: -6px;
    height: var(--header-fixe-height);
    padding-right: 60px;
    background: linear-gradient(
        -45deg,
        var(--color-primary) 21%,
        var(--color-secondary) 20%
    );
}

.header-link-white {
    color: var(--color-white);
    font-size: 12px;
}

.img-rocket,
.img-community {
    border: 0;
    height: 26px;
    width: 26px;
    margin-top: 2px;
}

.header_nonfixe_web {
    position: fixed;
    top: 20px;
    width: 100%;
    max-width: 100%;
    height: var(--header-nonfixe-height);
    z-index: 5;
    background-color: var(--color-gray-bg);
    padding: 16px 0;
    box-sizing: border-box;
    display: block;
}

.header-nonfixe-container {
    position: relative;
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
    z-index: 0;
}

.header-middle {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-logo-box {
    height: 72px;
    padding: 15px;
    box-sizing: border-box;
    background-color: var(--color-white);
    border-radius: 0 0 var(--radius-12) var(--radius-12);
    box-shadow: var(--shadow-soft);
}

.banner-section {
    padding-top: 167px;
}

.logo-img {
    border: 0;
    margin-top: 1px;
    width: 245px;
}

.form-ser {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 60px;
    flex: 1 0 0;
    margin-top: 14px;
}

.formconto {
    margin: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-30);
}

.search-wrapper {
    width: 476px;
    height: 40px;
}

.search-relative {
    position: relative;
}

.search-absolute {
    position: absolute;
    top: 0;
    width: 100%;
    box-sizing: border-box;
}

#input_search {
    position: relative;
    display: flex;
    align-items: center;
    padding: 7px 24px;
    box-sizing: border-box;
    background-color: var(--color-white);
    border-radius: var(--radius-20);
}

.search-input {
    border-right: 0;
    padding: 0;
    font-size: 12px;
    font-style: italic;
    color: var(--color-gray);
}

.search-btn {
    width: 24px;
    height: 24px;
    background-color: var(--color-white);
    padding: 0;
}

.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
    background-color: unset;
}

.header-icons-wrapper {
    display: flex;
    align-items: center;
}

.header-icon-block {
    min-width: 90px;
    text-align: center;
}

.header-icon-cart {
    min-width: 80px;
}

.header-icon-link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    margin: 0 auto;
    cursor: pointer;
}

.header-icon-relative {
    position: relative;
}

.header-icon-label {
    font-size: 12px;
    text-align: center;
}

#img-user,
.logo-user:hover > #img-user {
    background-image: url(/images/subsite/user.svg);
}

#coeur,
.logo-coeur:hover > #coeur {
    background-image: url(/images/subsite/heart.svg);
}

#img-panier,
.logo-panier:hover > #img-panier {
    background-image: url(/images/subsite/cart.svg);
}

.logo-user:hover,
.logo-coeur:hover,
.logo-panier:hover {
    background-color: var(--color-gray-bg);
    border-radius: var(--radius-4);
}

.heart2,
.nbPanier {
    width: var(--badge-size);
    height: var(--badge-size);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    font-size: 8px;
    font-weight: 700;
    line-height: normal;
    color: var(--color-white);
    background-color: var(--color-primary);
    position: absolute;
}

.heart2 {
    top: 1px;
    right: -6px;
}

.nbPanier {
    top: 20px;
    right: 15px;
}

.content-menu-desktop {
    display: flex;
    max-width: 1120px;
    margin: auto;
    width: 100%;
    height: 100%;
    justify-content: space-between;
}

.menu-other-link {
    align-self: stretch;
    justify-content: flex-start;
    align-items: center;
    display: flex;
    gap: 16px;
}

.other-link {
    align-self: stretch;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    display: flex;
    padding: 0;
}

.other-link > a:hover {
    color: var(--color-secondary) !important;
}

.link-new > a,
.link-top > a,
.link-sales > a {
    color: var(--color-accent) !important;
}

.other-link > a {
    color: var(--color-secondary);
    font-size: 14px;
    font-family: var(--font-main);
    font-weight: 600;
    word-wrap: break-word;
}

.other-link > a.link-puzzle-perso {
    font-size: 14px;
    font-family: var(--font-main);
    text-decoration: underline;
    word-wrap: break-word;
    display: flex;
    align-items: center;
}

.link-new > a.active,
.link-top > a.active,
.link-sales > a.active,
.link-bonnes-affaires > a.active {
    background-color: var(--color-secondary);
    padding: 3px 9px;
    border-radius: var(--radius-8);
    font-size: 13px;
    color: var(--color-white) !important;
}

.typo {
    font-family: var(--font-main);
}

#newsletter-form{display: flex;flex-direction: column;gap: 20px;align-items: center;width: 100%;}
.newsletter-form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    margin: 0;
}

.newsletter-title {
    color: var(--color-white);
    font-size: 20px;
    font-weight: bold;
    white-space: nowrap;
    flex-shrink: 0;
}

.insc-new {
    padding: 0;
    margin: 0;
    float: left;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.champ-mail {
    width: 100%;
    padding: 12px 16px;
    font-size: 14px;
    border: 1px solid var(--color-border-input);
    border-radius: var(--radius-25);
    box-sizing: border-box;
}

.SubmitMail {
    padding: 10px 25px;
    background-color: var(--color-accent);
    color: var(--color-white);
    border: none;
    border-radius: var(--radius-8);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-left: 0;
    border: 1px solid var(--color-accent);
}

.btn-new-fr:hover {
    background-color: var(--color-secondary);
    border: 1px solid var(--color-accent);
}

.footer-services { background: var(--color-accent); }
.footer-services__container { margin: 0 auto; max-width: 1160px; }
.footer-services__row { text-align: center; margin: 0; }

.case-foot2 {
    background-color: var(--color-accent);
    float: left;
    padding: 32px 0px !important;
    width: 100%;
    margin: 0 auto;
}

.case-foot { padding: 0; }
.case-foot :hover { background-color: var(--color-accent); }

.footer-service__img {
    border: 0px;
    cursor: pointer;
    margin-bottom: 6px;
}

.ti-sfoo {
    color: var(--color-secondary);
    font-family: var(--font-main);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}

.ti-ssfoo {
    font-family: var(--font-main);
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    color: var(--color-white);
    margin-top: 3px;
}

.ti-ssfoo-b {
    font-family: var(--font-main);
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    color: var(--color-secondary);
    margin-top: 3px;
}

.mentions {
    color: var(--color-white);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-bottom: 0;
}

.btn-footrev:hover { background-color: var(--color-accent); }

.btn-footrev {
    display: flex;
    flex-direction: column;
    padding: 6px 18px 6px 18px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 0px 0px var(--radius-4) var(--radius-4);
    background: var(--color-accent);
    cursor: pointer;
    max-width: 237px;
    margin: 0 auto;
    text-align: center;
    margin-top: 32px;
    margin-bottom: 24px;
}

.visit-rev {
    padding: 8px 16px;
    background-color: var(--color-secondary);
    border-radius: var(--radius-4);
    color: var(--color-white);
    font-size: 13px;
    font-weight: 600;
    border: 1px solid var(--color-secondary);
}

.visit-rev:hover {
    background-color: var(--color-white);
    color: var(--color-secondary);
    border: 1px solid var(--color-secondary);
}

.title-footer li {
    color: var(--color-accent);
    font-family: var(--font-main);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 0px;
    line-height: 23px;
}

.title-footer li a {
    color: var(--color-white);
    font-family: var(--font-main);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px !important;
    text-decoration: unset;
    font-style: normal !important;
}

.lien-footer a {
    color: var(--color-accent) !important;
}

.menu-link-produits {
    justify-content: flex-start;
    padding: 0;
    align-items: center;
    display: flex;
    gap: 8px;
    border-width: initial;
    border-style: none;
    border-color: initial;
    border-image: initial;
    background: none;
}

.menu-link-produits:hover {
    background: unset;
    cursor: pointer;
}

.link-produits {
    color: var(--color-secondary);
    font-size: 14px;
    font-family: var(--font-main);
    font-weight: 600;
    overflow-wrap: break-word;
    display: flex;
    align-items: center;
    gap: 4px;
}

.submenu-cols { max-width: 1120px; margin: auto; width: 100%; }
.submenu-cols { display: flex; justify-content: space-between; gap: 20px; }

.submenu-column {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.submenu-column:not(:last-child) {
    border-right: 1px solid var(--color-border);
}

.submenu {
    display: none;
    background-color: var(--color-white);
    top: 165px;
    padding: 24px 10px 24px 10px;
    position: fixed;
    width: 100%;
    z-index: 999;
    box-sizing: border-box;
    box-shadow: var(--shadow-menu);
}

.submenu a.bleu-clair {
    color: var(--color-secondary);
    font-weight: bold;
}

.submenu a {
    display: flex;
    color: var(--color-secondary);
    text-decoration: none;
}

.menu-link-produits.active + .submenu {
    display: flex;
}

.txt-aff {
    padding: 16px 24px;
    background: rgba(41, 41, 41, 0.33);
    border-top-left-radius: var(--radius-12);
    border-top-right-radius: var(--radius-12);
    border: 1px rgba(255, 255, 255, 0.70) solid;
    backdrop-filter: blur(24px);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.slider-home {
    position: relative;
    max-width: 1435px;
    margin: 0 auto;
    padding-top: 0;
}

.slider-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 310px;
    max-height: 310px;
    border-radius: var(--radius-12);
    margin: 10px 0;
}

.slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-height: 270px;
    opacity: 0;
    transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
}

.slide.active {
    opacity: 1;
    z-index: 1;
    pointer-events: auto;
}
.content-btn-slider-subsite {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    max-width: 1120px;
    display: flex;
    justify-content: space-between;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 2;
}

.content-btn-slider-subsite .prev,
.content-btn-slider-subsite .next {
    width: 32px;
    height: 32px;
    cursor: pointer;
    pointer-events: auto;
}

.content-btn-slider-subsite .prev img,
.content-btn-slider-subsite .next img {
    width: 100%;
}

.content-btn-slider-subsite .prev img {
    rotate: 180deg;
}
.dot-container {
    max-width: 1120px;
    width: 100%;
    margin: 290px auto 0;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    text-align: center;
    z-index: 2;
    position: initial;
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 12px;
    border: 1px solid var(--color-white);
    background: var(--color-gray-light);
}

.dot.active {
    background: var(--color-primary);
    border: 1px solid var(--color-white);
}
.bc-img {
    height: 290px;
    margin-bottom: 18px;
    border-radius: var(--radius-12);
    background-size: 100% auto;
    border: 2px solid var(--color-white);
    box-shadow: 0 0 4px rgba(41, 41, 41, 0.20);
    position: relative;
    overflow: hidden;
}

.bg-gris {
    background-color: var(--color-gray-bg);
}

.content-slider {
    max-width: 1243px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.image-marque {
    height: 100%;
    border-radius: var(--radius-12);
    position: relative;
    overflow: hidden;
}

.bc-img::before,
.slider-item-marque::before,
.image-marque::before {
    content: "";
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-image: inherit;
    transition: transform 0.5s ease;
    z-index: 1;
}

.content-cat:hover .bc-img::before,
#content-marque:hover .slider-item-marque::before,
.image-marque:hover::before {
    transform: scale(1.1);
}
.home-category:hover .bc-img::before,
.home-banner:hover .bc-img::before {
    transform: scale(1.1);
}
.slider-item-marque {
    width: 265px;
    height: 135px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-size: cover;
    background-position: center;
    color: var(--color-white);
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    margin-right: 12px;
    flex-direction: unset;
    position: relative;
    overflow: hidden;
}
.slider-text-marque-subsite {
    width: 100%;
    padding: 12px;
    background: rgba(41, 41, 41, 0.5);
    backdrop-filter: blur(18px);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: var(--color-white);
    font-size: 14px;
    font-family: var(--font-main);
    font-weight: 700;
    word-wrap: break-word;
    z-index: 1;
}

.bc-txt,
.slider-text-marque-subsite {
    bottom: 0;
    right: 0;
    position: relative;
}
.button-brands {
    padding: 10px 25px;
    border: 1px solid var(--color-secondary);
    border-radius: var(--radius-25);
    color: var(--color-secondary);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    background-color: var(--color-white);
    transition: all 0.3s ease;
}

.button-brands:hover {
    background-color: var(--color-secondary);
    color: var(--color-white);
}
.new-slick-prev img {
    rotate: 180deg;
}

.new-slick-arrow[aria-disabled="true"] {
    opacity: 0.3;
}

.slider-new {
    max-width: 1136px;
    margin: auto;
    display: flex !important;
    justify-content: flex-end;
    gap: 18px;
    list-style-type: none;
}

.slider-new li {
    position: relative;
}

.slider-new li:last-child::after {
    display: none;
}

.slider-new > .slick-list {
    padding-bottom: 13px;
    padding-left: 8px;
    padding-right: 8px;
    transition: width 0.5s ease;
}
.content-new-sticker {
    position: absolute;
    top: -3px;
    margin-left: 7px;
    display: flex;
    padding: 4px 11px;
    align-items: flex-end;
    gap: 10px;
    border-radius: 0 0 16px 16px;
    background: var(--color-danger);
}

.content-new-sticker span {
    color: var(--color-white);
    font-size: 11px;
    font-style: italic;
    font-weight: 600;
    line-height: normal;
}
.center-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.libelle2-acc-libelle {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-secondary);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.libelle2-acc-nbpieces {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-black);
}

.libelle2-acc-marque {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-gray-dark);
    font-style: italic;
    display: flex;
    align-items: center;
}

.content-prix-barre {
    box-sizing: border-box;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.content-prix-barre-mobile {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.prix-barre {
    display: flex;
    gap: 8px;
    align-items: center;
}

.prix-client-barre {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-secondary);
}

.prix-sans-promo-barre {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-gray-dark);
    text-decoration-line: line-through;
}

.button-add-bell {
    padding: 12px;
    border-radius: 100px;
    background: var(--color-white);
    border: 0.95px solid var(--color-black);
}

.button-add-bbell > img {
    border: none;
}

.button-add-cart {
    padding: 12px;
    border-radius: 100px;
    border: none;
    background: var(--color-primary)!important;
    box-shadow: 0px 2px 4px rgba(69, 21, 5, 0.08);
    cursor: pointer;
    transition: 
        background-color 0.3s ease-in-out,
        box-shadow 0.3s ease-in-out;
}

.button-add-cart:hover {
    background-color: var(--color-secondary)!important;
    box-shadow: 0px 8px 12px rgba(69, 21, 5, 0.12);
}

.button-add-cart:active {
    background-color: var(--color-primary);
}

.button-add-cart > img {
    border: none;
}

.infos-block-menu {
    display: none;
    flex-direction: column;
    transition: display 0.3s ease;
}

.arrow-icon {
    transition: transform 0.3s ease;
}

img[src="/images/add-to-cart.svg"] {
    content: url("/images/subsite/add-to-cart.svg");
    width: 25px;
    height: 25px;
}
img[src="/images/heart_icon.svg"] {
    content: url("/images/subsite/b-heart_icon.svg");
    width: 20px;
    height: 20px;
}
.bestseller-main-title {
    font-weight: bold;
    font-size: 20px;
    color: var(--color-secondary); 
    font-family: var(--font-main);
}

.bestseller-slider-wrapper {
    padding: 64px 0;
}

.home-presentation {
  width: 100%;
  padding: 64px 0;
}

.home-presentation__container {
  max-width: 1130px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.home-presentation__title {
  font-weight: 700;
  font-size: 20px;
  color: var(--color-secondary);
}

.home-presentation__lead,
.home-presentation__text {
  font-size: 14px;
  font-weight: 600;
}

.home-presentation__highlight {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-accent);
  margin: 0;
}

.home-categories, .home-brand {
    padding: 64px 0;
}

.home-categories__container,
.home-banners__row {
    max-width: 1130px;
    margin: 0 auto;
}

.home-categories__row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.home-category {
    flex: 1 1 30%;
}

.home-category__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-secondary);
    margin-bottom: 10px;
}

.bc-txt-subsite {
    position: absolute;
    width: 100%;
    z-index: 1;
    bottom: 0;
    right: 0;
}

.home-category__links {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    height: 40px;
    margin: 5px;
    padding: 10px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    color: var(--color-white);
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 6px;
    backdrop-filter: blur(9px);
}

.home-category__button {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 5px;
    text-align: center;
    font-weight: 600;
    color: var(--color-white);
    background-color: var(--color-secondary);
    border-radius: 6px;
}

.home-banners__row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 20px;
}

.home-banner {
    flex: 1 1 30%;
}

.home-banner__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-secondary);
    margin-bottom: 10px;
}

.home-banner__image {
    height: 130px;
}

.triangle-banner {
    position: absolute;
    z-index: 2;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 60px;
    background: var(--color-accent);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 45% 100%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.triangle-banner:hover {
    background: var(--color-secondary);
}

.banner-text {
    width: 100%;
    height: 60px;
    box-sizing: border-box;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 10px;
    padding: 10px;
    color: var(--color-white);
    font-size: 12px;
    font-weight: 600;
}

body[data-route="sylius_shop_checkout_select_shipping"]
.steps .steps-item:nth-child(2) .ret-2,
body[data-route="sylius_shop_checkout_select_payment"]
.steps .steps-item:nth-child(3) .ret-3 {
    background-color: var(--color-secondary) !important;
    color: var(--color-white) !important;
}

body[data-route="sylius_shop_checkout_select_shipping"]
.steps .steps-item:nth-child(1) .ret-1,
body[data-route="sylius_shop_checkout_select_payment"]
.steps .steps-item:nth-child(1) .ret-1,
body[data-route="sylius_shop_checkout_select_payment"]
.steps .steps-item:nth-child(2) .ret-2 {
    background-color: var(--color-primary) !important;
    color: var(--color-white) !important;
}

body[data-route="sylius_shop_checkout_select_shipping"]
.steps .steps-item:nth-child(1)::after,
body[data-route="sylius_shop_checkout_select_payment"]
.steps .steps-item:nth-child(1)::after,
body[data-route="sylius_shop_checkout_select_payment"]
.steps .steps-item:nth-child(2)::after {
    background-image: url(/images/subsite/arrow_right-o-pp.svg) !important;
}

.ret-1, .ret-2, .ret-3, .ret-4 {display: flex;padding: 0px;padding-top: 0px;width: 48px;height: 48px;margin: 0 auto;text-align: center;align-items: center;justify-content: center;}
.ret-1 {border-radius: 30px;background: var(--color-primary);color: var(--color-white);font-size: 12px;font-style: normal;font-weight: 600;box-sizing: border-box;}
.ret-2 {border-radius: 30px;background: var(--color-secondary);color: var(--color-white);font-size: 12px;font-style: normal;font-weight: 600;box-sizing: border-box;}
.ret-3 {border-radius: 30px;background: var(--color-gray-medium);color: var(--color-gray-muted);font-size: 12px;font-style: normal;font-weight: 600;box-sizing: border-box;}
.ret-4 {border-radius: 30px;background: var(--color-gray-medium);color: var(--color-gray-muted);font-size: 12px;font-style: normal;font-weight: 600;box-sizing: border-box;}

.bloc-recap-cart > div {
    color: var(--color-secondary);
    font-weight: 600;
    font-size: 16px;
}

.bout-pan-checkout-custom {
    width: 40px !important;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-left: 10px;
    border-radius: var(--radius-4);
    border: 0;

    background: var(--color-primary);
    color: var(--color-white);

    font-size: 12px;
    font-weight: 500;
    cursor: pointer;

    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.total-hors-tax {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;

    padding: 24px;
    background: var(--color-gray-bg);

    font-size: 14px;
    font-weight: 700;
    color: var(--color-dark-blue);
}

.total-hors-tax, .total-hors-tax *, .total-line{
    background: var(--color-gray-bg) !important;
}

.checkout-legal-modal-link {color: var(--color-primary);}

.bloc-recap-livraison > div:first-child {
    display: flex;
    align-items: flex-end;
    gap: 12px;

    font-size: 14px;
    font-weight: 500;
}

.pass-liv-checkout-custom {
    width: 100%;
    padding: 18px 36px;

    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;

    border-radius: 6px;
    border: none;
    box-sizing: border-box;

    background: var(--color-primary);
    box-shadow: 0px 2px 4px rgba(69, 21, 5, 0.09);

    color: var(--color-white);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;

    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.pass-liv-checkout-custom:hover,
.bout-pan-checkout-custom:hover,
.btn-pass-pan:hover,
.bt-pan-v:hover {
    background-color: var(--color-secondary);
    box-shadow: 0px 8px 12px rgba(69, 21, 5, 0.12);
}
.btn-pass-pan:active:not(input[disabled]), .btn-pass-pan:hover:not(input[disabled]) {
    background-color: var(--color-primary);
}
.pass-liv-checkout-custom:disabled {
    background-color: var(--color-primary);
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-pass-pan,
.bt-pan-v,
.modif-pan-a,
.btn-produit-p {
    background: var(--color-secondary);
}

.btn-pass-pan:hover,
.bt-pan-v:hover,
.modif-pan-a:hover,  
.btn-produit-p:hover {
    background-color: var(--color-primary);
}

input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
    background-color: var(--color-secondary) !important;
    cursor: not-allowed;
    opacity: 0.5;
}

.cgv-checkbox:checked + label,
#coche_carte:checked + label,
#cgv_pp:checked + label,
#conserver:checked + label {
    background-image: url(/images/subsite/input-checkbox-checked.svg);
    width: 18px;
    height: 18px;
}

.radio-custom input[type="radio"]:checked + label::before,
.custom-radio input[type="radio"]:checked + .radio-btn,
.custom-radio input[type="radio"]:checked + .radio-btn::after {
    border-color: var(--color-secondary) !important;
    background-color: var(--color-secondary) !important;
}

.taill-tx-pani,
.total-item-custom > strong,
.txt-pan-cen,
.text-trans {
    color: var(--color-secondary);
}

.taill-tx-pani,
.total-item-custom > strong {
    font-size: 15px;
    font-weight: 600;
}

.txt-pan-cen {
    font-size: 20px;
    font-weight: 700;
    margin-top: 32px;
    float: left;
}

.text-trans {
    font-size: 16px;
    font-weight: 600;
    margin-left: 12px;
}

.bloc-p-ti {
    background: var(--color-primary);
}

.bloc-open-recap,
.encart-pan-b {
    border: 1px solid var(--color-primary);
}

.bloc-menu-infoca.bloc-active {
    border: 1px solid var(--color-secondary);
}

.content-select-shipping .glob-div {
    margin: 0 0 64px 0;
}

.glob-div > .retour-ex,
.glob-div > .cont-ar2 {
    padding: 0;
    margin-bottom: 0 !important;
}

.recap-pan-w {
    margin-top: 15%;
    padding-top: 0;
}

.checkout-right {
    margin-top: 0;
}

img[src="/images/delivery-truck-pan.svg"] {
    content: url("/images/subsite/delivery-truck-pan.svg");
    width: 24px;
    height: 24px;
}

img[src="/images/box-iso-pan.svg"] {
    content: url("/images/subsite/box-iso-pan.svg");
    width: 24px;
    height: 24px;
}

img[src="/images/home-pan.svg"] {
    content: url("/images/subsite/home-pan.svg");
    width: 24px;
    height: 24px;
}

img[src="/images/pin-alt-pan.svg"] {
    content: url("/images/subsite/pin-alt-pan.svg");
    width: 24px;
    height: 24px;
}

img[src="/images/icon-not-paid-order.svg"] {
    content: url("/images/subsite/icon-not-paid-order.svg");
    width: 16px;
    height: 16px;
}

.tit-es-c {
    color: var(--color-secondary);
}
.thead-order-list, .reclamations-header {
    background-color: var(--color-secondary);
}

.tbody-order-list > .not-paid {
    background: unset;
    border-bottom: 1px solid var(--color-border-light);
}

.text-not-paid {
    color: var(--color-primary);
}

.pay, .pay:hover, .commande-detail-ligne-total {
    background: var(--color-secondary);
    color: var(--color-white);
}

.h5.subtotal-item-order:last-of-type{
    color: var(--color-white);
}

.total-actions, .intro-esc {
    color: var(--color-secondary);
}

.content-add-address a, .text-orange, .badge-title-address, .badge-title-status {
    color:  var(--color-primary);
}

.cube_mescoordonnees {
    background: var(--color-white);
}

#save-changes, #add-address, .btn-new-fr2, .bt-clie, .btn-produit-content {
    background: var(--color-secondary);
}

#save-changes:hover, #add-address:hover, .btn-new-fr2:hover, .bt-clie:hover, .btn-produit-content:hover {
    background-color: var(--color-primary);
    box-shadow: 0px 8px 12px 0px rgba(69, 21, 5, 0.12);
}

.content-espace-client {
    margin-bottom: 64px;
}

.btn-logout {
    color: var(--color-secondary);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    display: flex;
    padding: 8px 18px 8px 18px;
    justify-content: center;
    align-items: center;
    gap: 14px;
    border-radius: 25px;
    border: 1px solid var(--color-secondary);
    margin: 0 auto;
}
.btn-sec:hover, .btn-logout:hover {
    background-color: var(--color-secondary);
    color: var(--color-white);
}

.solde-gift-card {
    color: var(--color-primary); font-weight: 700; font-size: 18px;
}

.header-wishlist span {
    font-size: 14px;
}

.des-de {
    color: var(--color-secondary);
    font-size: 40px;
}

.des-au {
    font-size: 20px;
    font-weight: 600;
}

.slider-recent-products-wishlist .bestseller-main-title {
    color: var(--color-secondary);
    font-size: 20px;
    font-weight: 700;
}

.bestseller-nav-arrow {
    border: 1px solid var(--color-secondary)!important;
}
.bestseller-nav-arrow:hover {
    background: var(--color-secondary)!important;
}
.bestseller-nav-left:hover img, .bestseller-nav-right:hover img {
    content: url(/images/nav-arrow-right-h-hover.svg);
}
img[src="/images/nav-arrow-right-h.svg"] {
    content: url("/images/subsite/nav-arrow-right-h.svg");
}
.bestseller-main-container {max-width: 1120px!important;}

.promo-produit {
    color: var(--color-white);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px;
    border-radius: 8px 8px 0 0;
    background: var(--color-danger);
    display: flex;
    padding: 8px 14px;
    align-items: center;
    gap: 10px;
    float: left;
    margin-left: 25px;
}
#fiche_produit3 .pictures .photo .cubepartage img, .wishlist-btn {width: 24px; height: 24px;}
#fiche_produit3 .pictures .photo .wishlist-form {height: auto;}
.cubepartage {
    right: 68px;
    top: 32px;
    background: unset;
}
div.cubecoeurproduit {
    z-index: 1;
    width: 36px;
    height: 36px;
    background: unset;
    backdrop-filter: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 36px;
    top: 32px;
}
.libelle-produit > a {
    margin-top: 25px;
    font-size: 20px;
    color: var(--color-secondary);
}

.enstock-produit {
    padding: 6px 12px;
    background: var(--color-white);
    color: var(--color-secondary);
    font-size: 11px;
    border: 1px solid var(--color-secondary);
}
.nbr-pieces-produit {
    font-size: 14px;
    font-weight: 600;
    margin-left: 0;
}

.marque-produit {
    color: var(--color-black);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
.ref-produit {
    font-size: 12px;
}
.prix-promo-prod {
    float: left;
    color: var(--color-secondary);
    margin-right: 10px;
}
.prix-ok-produit {
    float: left;
    color: var(--color-secondary);
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.bul-r-pro {
    background: var(--color-secondary);
}

#fiche_produit3 .vignettes .vignette.active {
    border: 2px solid var(--color-secondary);
}
.alert-minimalist {
    background-color: var(--color-white);
    border: 1px solid var(--color-secondary);
    border-radius: 3px;
    color: var(--color-primary);
    border-radius: 6px 0px 0px 6px;
    font-weight: 600;
}
.slick-dots > li, .bestseller-dot, .slider1-dot, .slider2-dot, .slider3-dot {
    width: 4px;
    height: 4px;
    border-radius: 4px;
    background: var(--color-primary);
}
.slick-dots > .slick-active, .bestseller-dot.active, .slider1-dot.active, .slider2-dot.active, .slider3-dot.active {
    width: 12px;
    height: 4px;
    border-radius: 4px;
    background: var(--color-primary);
}
.tx-exped {max-width: none;color: var(--color-primary);padding-bottom: 0;}
.fancybox-thumbs__list a:before {border: 1.5px solid var(--color-secondary);}
.btn-produit, .bt-pp-pa, .titr-pp-0, .b-select, .btn-val-p, .b-select-modal, .pp-add-panier, .ad-cart-lis, .confirm-button {background: var(--color-secondary)!important;}
.btn-produit:hover, .bt-pp-pa:hover, .b-select:hover, .btn-val-pp:hover, .b-select-modal:hover, .pp-add-panier:hover, .ad-cart-lis:hover, .confirm-button:hover {background: var(--color-primary)!important;box-shadow: 0px 8px 12px 0px rgba(69, 21, 5, 0.12);}

.marg-tins, .titre-es-client {color: var(--color-secondary);}
.padd-log {padding: 40px 60px 20px 60px; }
.padd-log2 {padding: 90px 20px 124px 20px;}
.encart-form-log {border-radius: 6px;min-height: 393px;box-shadow: 0px 0px 4px 0px rgba(41, 41, 41, 0.20);border: 1px solid var(--color-gray-soft); background-color:var(--color-white)}
.encart-form-log2 {border-radius: 6px;min-height: 393px;box-shadow: 0px 0px 4px 0px rgba(41, 41, 41, 0.20);border: 1px solid var(--color-gray-soft);background-color:var(--color-white)}
.caract-log {text-align: right;color: var(--color-dark);font-size: 10px;text-align: right;margin-right: 25px;}
.orange {color: var(--color-secondary);}

.page-log {display:flex; gap:24px;}
#message-error-login {margin:0;padding: 0 0 15px 0;width: 50%;}
.text-error-login {
    box-sizing: border-box;
    font-size: 14px;
    margin-bottom: 0;
    border: 1px solid var(--color-secondary);
    border-radius: 8px;
    padding: 8px 0;
    text-align: center;
    color: var(--color-accent);
    background-color: var(--color-white);
    margin-right: 10px;
}
.bloc-menu-pc-subsite {
    display: flex;
    margin-left: 25px;
}
.bloc-menu-link-subsite {
    display: flex;
    gap: 10px;
}
.paginfo-menu {
    display: flex;
    padding: 8px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 4px 4px 0px 0px;
    background: var(--color-accent);
    color:var(--color-white);
}
.paginfo-txt {
    color: var(--color-white);
    font-family: poppins;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    padding: 2px 8px;
}
.paginfo-menuactiv {
    background: var(--color-secondary)!important;
}
.paginfo-menuactiv > .paginfo-txt {
    color: var(--color-white);
}

.bloc-menu-info{box-shadow: 0px 0px 4px 0px rgba(41, 41, 41, 0.20);margin-bottom: 68px;box-sizing: border-box;border: none;}
.titres-or {font-size: 20px;font-weight: bold;color: var(--color-secondary);}
input[name="radio_pp_format"]:checked {
    border-color: var(--color-primary);
}
input[name="radio_pp_format"]:checked:before {
    background: var(--color-secondary);
}

.selected-row > td > div > .pp-libelle-pieces, .selected-row > td > div > .pp-libelle-pieces > .pp-text-nbpieces, .selected-row > td > div > .pp-price-without-promotion, .selected-row > td > div > .pp-libelle-pieces > .pp-text-size, .selected-row > td > div > .pp-price {
    color: var(--color-primary);
}
.selected-row {background-color: unset;}
.tag-format-pp {background: var(--color-danger);color: var(--color-white);font-family: var(--font-main);}
.pp-price-without-promotion {
    text-decoration: line-through;
    font-size: 10px;
    font-weight: 700;
    color: var(--color-gray-dark);
}
.pp-price-color {color:var(--color-primary)}
.bulle-membre-produit {background: var(--color-primary);color: var(--color-white);}
.pop-up-format-image-pp {    border: 1px solid var(--color-secondary);background: #B9E5E8;}

.upload-title {
    color: var(--color-primary);
}

.upload-progress-bar {
    background: var(--color-primary);
}

.inti-1 {
    color: var(--Smooth-Grey-950, var(--color-black));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    margin-top: 5px;
}

.inti-2 {
    color: var(--Smooth-Grey-950, var(--color-black));
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-align: center;
    margin-top: 5px;
}

.inti-3 {
    color: var(--color-gray-muted);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    margin-top: 5px;
}

.inti-4 {
    color: var(--color-gray-muted);
    font-family: poppins;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    margin-top: 5px;
}

div.liste_boites img.boite.selected {
    border-radius: 4px;
    border: 2px solid var(--color-primary);
}

.btn-val-pp, .puzzle-cart-button {background: var(--color-secondary);}

.btn-val-pp:hover, .puzzle-cart-button:hover {
    background-color: var(--color-primary);
    box-shadow: 0px 8px 12px 0px rgba(69, 21, 5, 0.12);
}

img[src="/images/arrow_right-o-pp.svg"] {
    content: url("/images/subsite/arrow_right-o-pp.svg");
}
.change-select, #puzzle_select, #puzzle_select_box {
    box-shadow: 0px 0px 4px 0px rgba(41, 41, 41, 0.20);
    color: var(--Fountain-Blue-950, var(--color-dark-blue));
    text-align: center;
    background-color: var(--color-white);
    border: 0px;
    border-radius: 4px;
}
img[src="/images/square-on.svg"] {
    content: url("/images/subsite/input-checkbox-checked.svg");
    width: 15px;
    height: 14px;
}
div.selected {
    background: var(--International-Orange-200, var(--color-white));
    border-radius: 3px;
    color: var(--International-Orange-800, var(--color-primary));
}
div.onglet_boite:hover {
    background: unset;
    color: var(--color-primary);
}
.accessoire-add-btn.added {
    color: var(--color-primary);
    padding: 16px 16px !important;
}
.title-personalized-select-box {background: var(--Fountain-Blue-500, var(--color-primary));}
.accessoire-add-btn.added span::after {
    color: var(--color-primary);
}

img[src="/images/heart_icon_red.svg"] {
    content: url("/images/subsite/heart_icon_red.svg");
}
.all_cube_maliste {gap: 20px;}
.sup-list {width: 160px;}
.sel-list {width: 125px;}
.pic-img-list{position:relative;display:flex;height: 197px;border-radius: 12px;background-color: var(--color-white);border: none;}
.poub-list{position:absolute;right:0px;top:0;left:auto;border-radius: 44px;display: flex;width: auto;height: 40px;justify-content: center;align-items: center;cursor:pointer;border: none; background-color:var(--color-white)!important}
.btn-produit-plus {margin:0;}

.popup {width: auto;}
.cube-personnalise-bleu, .cube-personnalise-blog{
    display: none;
}
.bandeau-image {
    max-width: 1120px;
    margin: 0 auto;
    border-radius: 12px;
    margin-top: 15px;
}
.bandeau-nouveaute {
    height: 130px;
    position: relative;
    border-radius: 12px;
    background-size: cover, 50%, 50%;
    background-repeat: no-repeat;
}
.plac-poly {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 130px;
    background: var(--color-secondary);
    clip-path: polygon(100% 0%, 100% 0%, 0% 200%, 0 0%);
    align-items: center;
    justify-content: flex-end;
    width: 350px;
    border-radius: 12px 0 0 12px;
    color: var(--color-white);
}

#ConteneurSelection {
    margin: 0;
    padding: 5px 0;
    padding: 16px 0px;
    border-bottom: 1px solid var(--Smooth-Grey-100, var(--color-border-light));
    background-color: var(--color-secondary);
    color: var(--color-white) !important;
    border-radius: 6px 6px 0 0;
}

#left h2 {
    font-size: 14px !important;
    font-weight: 600;
    color: var(--color-secondary) !important;
    padding-bottom: 0px !important;
    width: 100%;
}

img[src="/images/search.svg"] {
    content: url("/images/subsite/search.svg");
    width: 18px;
}

.container_filtre .ui-slider-handle, .container_filtre_mobile .ui-slider-handle {
    background: url(/images/subsite/defilement.svg) no-repeat !important;
}

.ui-widget-header {
    background: var(--color-primary) !important;
}

.content-produit {margin-bottom: 80px;}

.pagination-nb-product {padding: 0px;border-radius: 4px;background: unset;}
.pagination-nb-product > span {font-size: 13px;font-style: normal;font-weight: 600;line-height: normal;color: var(--color-secondary);}
.pagination ul>li>a:hover, .pagination ul>li>a:focus, .pagination ul>.active>a, .pagination ul>.active>span {
    background-color: var(--color-primary);
    color: var(--color-white);
}
#text-voir-plus-btn {
    position: absolute;
    bottom: 8px;
    right: 12px;
    background-color: var(--color-white);
    color: var(--color-secondary);
    font-size: 12px;
    font-weight: 500;
    border-radius: 8px;
    padding: 6px 12px;
    cursor: pointer;
}
.bloc-marques {
    background: var(--color-secondary);
    padding: 0;
}
#bloc-marques-texte {
    max-height: 0px;
    width: 100%;
    overflow: hidden;
    transition: max-height 0.5s ease;
}
#bloc-marques-texte.expanded {
    max-height: 1000px;
    display: block;
    flex-direction: column;
    transition: max-height 0.5s ease;
}
.des-marques {
    color: var(--color-white);
    font-size: 16px;
    font-weight: 300;
    line-height: 22px;
    padding: 24px 24px 10px 24px;
    max-width: 100%;
}
#text-voir-moins-btn {
    bottom: 8px;
    right: 12px;
    background-color: var(--color-white);
    color: var(--color-secondary);
    font-size: 12px;
    font-weight: 500;
    border-radius: 8px;
    padding: 6px 12px;
    cursor: pointer;
}
.text-brands {display: flex;}
.content-text-brands {
    box-shadow: 0px 0px 4px 0px rgba(41, 41, 41, 0.20);
    border-radius: 10px;
    background: var(--color-white);
    margin-top: 30px;
    padding: 32px;
}
.capitale.actif, #voir-tout.actif {
    background: var(--color-primary);    padding-left: 12px;
}
#voir-tout {
    padding-left: 0px;
}

#adult-authors, #licenses-children {
    box-shadow: 0px 0px 4px 0px rgba(41, 41, 41, 0.20);
    border-radius: 10px;
    background: var(--color-white);
    margin-top: -40px;
    margin-bottom: 40px;

}
#licenses-children{margin-top: -71px;}
.row.equalheights  {
    padding: 32px;
}
.button-container {
    background-color: unset;
    border-radius: 0;
}
.toggle-button.active {
    color: var(--color-white);
    background-color: var(--color-primary);
    border-radius: 12px 12px 0 0;
    padding: 14px 18px;
}
.toggle-button {
    color: var(--color-white);
    background-color: var(--color-secondary);
    border-radius: 12px 12px 0 0;
    padding: 14px 18px;
}
.aut-per {font-size: 15px}
.button-container::before {content: unset;}
.toggle-button[data-target="licenses-children"]{margin-left: 10px;}

#auteur {margin-bottom: 64px;}
#auteur > h1 {font-size: 22px;color: var(--color-secondary);}
.legal-cgv h1, .plan-site h1, .legal-header h1, .title-provenance  {
    color: var(--color-secondary);
}
.btn-bleu {background: var(--color-secondary);}
.btn-bleu:hover {background: var(--color-primary);}
#pages-info > div > b > u, .link-cgv, .legal-content b u, .legal-content u b, body[data-route*="country_of_origin"] span, .sous-title-site-map {color: var(--color-primary);}
.content-missing-pieces, #plandusite, .content-provenance {margin-bottom: 80px;}
[data-route*="app_author"] .fil-ariane-content-produit {display: none;}
img[src="/images/case-coche.svg"] {
    content: url("/images/subsite/case-coche.svg");
    width: 12px;
    height: 13px;
}
.active-search img {background: var(--color-primary)!important;}
.submenu:hover, .sous-value-menu:hover, .sous-value-menu a:hover, .submenu.hover, .sous-value-menu.hover {
    background-color: var(--color-white) ;
}
.bandeau-nouveaute {
  background:
    linear-gradient(
      0deg,
      rgba(22, 46, 54, 0.40) 0%,
      rgba(22, 46, 54, 0.40) 100%
    ),
    var(--bg-left) left,
    var(--bg-right) right;

  background-size: cover, 50%, 50%;
  background-repeat: no-repeat;
}
.bloc-recap-pp-message {border-radius: 6px;border: 1px solid var(--color-secondary);background: var(--color-white);padding: 8px 12px;align-items: center;margin-top:14px ;;display: flex;}
.bloc-recap-pp-message > div {color:var(--color-primary);font-size: 12px;font-weight: 400}
img[src="/images/warning-triangle-pan.svg"] {
    content: url("/images/subsite/warning-triangle-pan.svg");
}
.toggle-societe  {color: var(--color-primary);}
#btn-new-billing-address, #btn-validate-address, #btn-new-address {background: var(--color-primary);}
.scroll-top-wrapper {border-radius: 30px;}
#input_search > .form-control {padding:0;border: none;font-style: italic;color: var(--color-gray);font-size: 12px;}
.btn-add-accessoires {
    border: var(--color-danger) 2px solid;
    border-radius: 8px;
    background-color: var(--color-white);
    padding: 8px 16px;
    color: var(--color-danger);
    font-weight: 600;
    cursor: pointer;
}
.btn-add-accessoires:hover {
    border: var(--color-danger) 2px solid;
    border-radius: 8px;
    background-color: var(--color-danger);
    padding: 10px 15px;
    color: var(--color-white);
    font-weight: 600;
}
.accessoires-heading {
    font-weight: bold;
    font-size: 20px;
    color: var(--color-secondary);
    margin-top: 64px;
    margin-bottom: 24px;
}

.checkout-custom-form input {
    border: 1px solid #dddddd;
}
.swal2-image {display: none;}
.bbtt {
    background-color: var(--color-secondary);
    border: 1px solid var(--color-secondary);
    padding: 8px 18px;
    float: left;
    margin: 0 0 0 10px;
    color: white;
    border-radius: 20px;
    font-weight: 700;
}

.bbtt:hover {
    background-color: var(--color-primary);
    border: 1px solid var(--color-primary);
}
.text-cookies {color: var(--color-primary);}
@media screen and (max-width: 500px) {
    .image-desktop {
        display: none !important;
    }
}

@media screen and (min-width: 501px) {
    .mobile-image {
        display: none !important;
    }
}

@media (min-width: 0px) and (max-width: 991px) {

    .menu-mobile-stock {
        width: 100%;
        background-color: var(--color-secondary);
        padding: 10px 0;
    }

    .menu-mobile-stock-inner {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .menu-mobile-bar {
        background: var(--color-white);
        border-bottom: 1px var(--color-border-light) solid;
        padding: 9px 16px 6px 16px;
        justify-content: space-between;
        align-items: center;
        display: flex;
    }
    .marg-log {
        margin-left: 10px;
        padding-top: 3px;
        width: 170px;
    }

    .menu-mobile-icons { display: flex; }

    .menu-mobile-icon,
    .menu-mobile-cart {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 9px 0;
        position: relative;
    }

    .menu-mobile-icon:nth-of-type(2) { margin: 9px; }

    .nbPanier {
        position: absolute;
        top: -5px;
        right: -8px;
    }

    .content-menu-mobile {
        display: none;
        flex-direction: column;
    }

    .menu-item {
        padding: 16px;
        background: var(--color-white);
        border-bottom: 1px solid var(--color-border-light);
        display: flex;
        flex-direction: column;
        gap: 10px;
        cursor: pointer;
    }

    .menu-item-header { display: flex; width: 100%; }

    .menu-item-title {
        flex: 1;
        color: var(--color-secondary);
        font-size: 14px;
        font-weight: 600;
    }

    .arrow-icon-mobile {
        transition: transform 0.3s ease;
        transform: rotate(90deg);
    }

    .submenumobile {
        display: none;
        flex-direction: column;
        gap: 8px;
    }

    .submenu-link {
        color: var(--color-secondary);
        text-decoration: none;
    }

    .submenu-link:hover { text-decoration: underline; }

    .menu-mobile-links {
        display: flex;
        flex-direction: column;
    }

    .menu-link {
        padding: 16px;
        background: var(--color-white);
        border-bottom: 1px solid var(--color-border-light);
        display: flex;
        align-items: center;
    }

    .menu-link-flex { gap: 6px; }

    .text-menu-mobile {
        color: var(--color-secondary);
        font-size: 14px;
        font-weight: 600;
        word-wrap: break-word;
    }

    .highlight-text { color: var(--color-accent); }

    .menu-made-in-france {
        height: 22px;
        margin-left: 5px;
    }

    .footer-fav-link {
        color: var(--color-white);
        display: flex;
        align-items: center;
        gap: 10px;
        text-decoration: none;
    }

    .content-footer-menu-mobile {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0;
    }

    .footer-reseller-text {
        display: flex;
        flex-direction: column;
        gap: 8px;
        align-items: center;
    }

    .footer-reseller-title {
        color: var(--color-white);
        font-size: 14px;
        font-weight: 600;
        width: 100%;
    }

    .footer-reseller-desc {
        font-size: 12px;
        font-style: normal;
        line-height: 14px;
        color: var(--color-white);
    }

    .btn-retailer {
        padding: 8px 16px;
        background-color: var(--color-secondary);
        border-radius: var(--radius-4);
        color: var(--color-white);
        font-size: 13px;
        font-weight: 600;
        text-decoration: none;
    }

    .recherche_mobile {
        width: 100%;
        background: var(--color-secondary);
    }

    .footer-menu-mobile {
        height: 100%;
        min-height: 150px;
        width: 100%;
        background-color: var(--color-secondary);
        color: var(--color-black);
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 24px 16px;
        box-sizing: border-box;
    }

    .submenumobile a:hover { text-decoration: underline; }

    .footer-menu-mobile-fav {
        position: relative;
        padding: 15px 16px;
        height: 100%;
        min-height: 50px;
        width: 100%;
        background-color: var(--color-accent);
        color: var(--color-white);
        align-items: center;
        flex-direction: column;
        gap: 12px;
        box-sizing: border-box;
        font-weight: 600;
    }

    .newsletter-form {
        flex-direction: column;
        gap: 8px;
    }

    .ti-sfoo { font-size: 12px; }

    .ti-ssfoo {
        font-size: 12px;
        font-weight: 500;
    }

    .case-foot:nth-of-type(1) { height: 165px; width: 49%; }
    .case-foot:nth-of-type(2) {
        width: 50%;
        height: 165px;
        border-left: 1px solid var(--color-white);
    }
    .case-foot:last-child { border-top: 1px solid var(--color-white); }

    .content-btn-slider-subsite .prev,
    .content-btn-slider-subsite .next {
        width: 24px;
        height: 24px;
        margin: 0 16px;
    }
    .dot-container {
        justify-content: center;
        gap: 4px;
        margin-top: 0;
    }
    .dot {
        width: 4px;
        height: 4px;
        border-radius: 50%;
    }
    .dot.active {
        width: 12px;
        height: 4px;
        border-radius: 4px;
        background: var(--color-white);
        backdrop-filter: blur(6px);
    }
    .bg-gris {background-color: var(--color-gray-bg-light);}
    .content-slider {margin: inherit;display: block;}
    .slider-item-marque {width: 296px;height: 208px;}
    .slider-new > .slick-list {padding-bottom: 12px;padding-left: 0;}
    .slider-text-marque-subsite {font-size: 14px}
    .center-container {margin-top: 15px;}

    .home-categories__row{padding-top: 24px;}
    .home-categories__row, .home-banners__row {flex-direction: column;}
    .home-category__links {width: 100%;}
    .home-categories {padding: 0;}
    .bestseller-slider-wrapper, .home-presentation, .home-brand {padding:40px 16px 0 16px;box-sizing: border-box;}
    .home-presentation {padding-bottom: 64px;}
    .bc-img3 {margin-left: 0;}

    .libelle2-acc {padding: 16px;}
	.libelle2-acc-libelle, .prix-client-barre {font-size: 14px!important;}
	.libelle2-acc-nbpieces, .libelle2-acc-marque{font-size: 12px!important;}
	.button-add-cart > img {width: 19px;}
	.prix-barre {flex-direction: column; gap: 0!important;align-items: flex-start!important;}
	.prix-sans-promo-barre {font-size: 10px!important;font-weight: 600!important;}
    .banner-section {padding-top: 0;}
    .des-au {font-size: 16px;line-height: normal !important;}
    .slider-recent-products-wishlist {padding: 0 16px;}
    #fiche_produit3 .pictures .photo .cubepartage {right: 45px;top: 25px;}
    #fiche_produit3 .pictures .photo .cubecoeur {right: 15px;top: 25px;}
    .libelle-produit {color: var(--color-secondary);}
    .marque-produit {font-size: 12px;font-weight: 500;text-decoration-line: none;}
    .ref-produit {font-size: 12px;}
    .prix-ok-produit{font-size:18px;}
    .tx-exped {
        float: left;
        color: var(--color-black);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        margin-left: 12px;
        margin-top: 0px;
        padding-bottom: 8px;
        max-width: 270px;
    }
    .intitules-haut {
        float: none;
        font-size: 14px;
    }
    .padd-log {padding: 20px;}
    .padd-log2 {padding: 20px;}
    .encart-form-log {min-height: 30px;}
    .encart-form-log2 {float: left;min-height: 30px;margin-top:15px;width: 100%;}
    .page-log {flex-direction: column;padding: 0 16px;}
    #message-error-login {width: auto;padding: 0 15px 16px;}
    .bloc-menu-pc-subsite {
        display: none !important;
    }
    .bloc-mob-inf {padding: 0 16px;}
    .side-bar, .side-bar-authors {display: none;}
    .row.equalheights {padding:0;}
    #adult-authors, #licenses-children {box-shadow: none;border-radius:0;background: unset;margin: 0;}
    #auteur .button-container {width: 100%;}
    #auteur .toggle-button {width: 48%;}
    .search-input {
        width: 100%;
        padding: 8px 12px;
        background: var(--color-white);
        border-radius: 100px;
        border: 1px var(--color-border) solid;
        justify-content: space-between;
        align-items: center;
        display: flex;
    }
    .menu_auteur span {
        border-bottom: 1px solid var(--color-border-light);
        background: var(--color-secondary);
        padding: 12px 16px;
        font-size: 13px;
        margin-bottom: 0;
        color: var(--color-white);
        border-radius: 0;
    }
    .plac-poly {
        height: 140px;
        width: 325px;
    }
    .pagination-total-products-count {display: none;}
    .bandeau-nouveaute {
        background:
        linear-gradient(
            0deg,
            rgba(22, 46, 54, 0.40) 0%,
            rgba(22, 46, 54, 0.40) 100%
        ),
        var(--bg-left) center;

        background-size: cover;
    }
    .bloc-marques, .bloc-marques .bandeau-nouveaute {
        height: 140px;
    }
    .btn-filtre-mobile {background: var(--color-secondary);}
    .ret-1, .ret-2, .ret-3, .ret-4 {font-size: 10px;padding: 0px;padding-top: 0px;width: 32px;height: 32px;margin: 0 auto;text-align: center;}

    .block-right-client, .content-form-ticket, .contclient {
        margin-bottom: 64px;
    }
    form[action="/carte-cadeau/redeem"] {flex-direction: column;}
    #gift-card-code {width: 100%!important;}
    .content-wishlist {padding: 0 16px;}
    .enstock-produit-list {display: flex;padding: 8px 14px;align-items: center;gap: 4px;border-radius: 31px;color: #1ba8a0;font-size: 12px;font-style: normal;font-weight: 400;line-height: normal;float: left;margin-right: 10px;border: 1px solid #1ba8a0;background: unset}
    .ad-cart-lis-mobile {
        padding: 12px;
        border-radius: 100px;
        border: none;
        background: var(--Orange, #1ba8a0);
        box-shadow: 0px 2px 4px 0px rgba(69, 21, 5, 0.08);
        transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        cursor: pointer;
    }
    #confirmation-modal-single-product > img {display: none;}

    .onglet_boite1.selected, .onglet_boite2.selected, .onglet_boite3.selected, .onglet_boite4.selected, .onglet_boite5.selected, .onglet_boite6.selected{border-radius: 0px!important;background: unset;border: 1px solid var(--color-secondary);}
    .onglet_boite2 {border-right: 1px solid var(--Smooth-Grey-200, #DCDCDC);}
    .page-log, .contmob-sa {padding: 0 16px;box-sizing: border-box;}
    form[name="sylius_shop_customer_registration"] > .PodBlanc > .form-group > div {width: 100% !important;}
    body[data-route="app_pieces"] .cont-site {margin: 0;}
    body[data-route="app_pieces"] .content-bandeau-image {min-height: auto;height: auto;}
    body[data-route="app_pieces"] .content-produit {padding: 0 16px;box-sizing: border-box;}
    body[data-route="app_pieces"] .tabs .tab.active {background: var(--color-secondary);}
}