/**
 * MODERN HEADER DESIGN - SEARCH IMPOSANTE
 * Tailwind/Shopify Style - Version Optimisée
 * ===========================================
 */

html {
  box-sizing: border-box;
  /* font-size: calc(var(--adw-font-body-scale) * 62.5%); */
  height: 100%;
}

body {
  overflow-x: hidden;
  font-family: var(--adw-font-family);
  background-color: #f8f9fc;
}

#wrapper {
  padding-top: 0;
  background: #f6f6f6;
}
 
#custom-text h1 {
  font-size: var(--adw-font-3xl);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin-top: 0px;
}

#custom-text p {
  font-size: var(--adw-font-md);
  color: var(--adw-text-medium);
  line-height: 1.6;
}
/** Boutton **/

/* ============================================
   SYSTÈME DE BOUTONS - BASE
   ============================================ */

.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--adw-space-sm);
  border: 0;
  cursor: pointer;
  font-family: var(--adw-font-family);
  font-weight: var(--adw-font-medium);
  text-decoration: none;
  letter-spacing: 0.02em;
  line-height: 1.2;
  border-radius: var(--adw-buttons-radius-small);
  position: relative;
  overflow: hidden;
  transition: all var(--adw-transition-normal);
  -webkit-appearance: none;
  appearance: none;
  white-space: nowrap;
  user-select: none;
}

/* Effet de brillance au survol */
.button::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
  transition: left var(--adw-transition-slow);
}

.button:hover::before {
  left: 100%;
}

/* États de base */
.button:hover {
  transform: translateY(-2px);
}

.button:active {
  transform: translateY(0);
  transition: all var(--adw-transition-fast);
}

.button:focus-visible {
  outline: 3px solid var(--adw-primary-soft);
  outline-offset: 2px;
}

.button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* ============================================
   VARIANTES DE COULEUR
   ============================================ */

/* PRIMARY - Couleur principale */
.button--primary {
  background-color: var(--adw-primary);
  color: var(--adw-text-white);
  box-shadow: 0 2px 8px rgba(230, 37, 79, 0.25);
}

.button--primary:hover {
  background-color: var(--adw-primary-dark);
  box-shadow: 0 6px 16px rgba(230, 37, 79, 0.35);
}

.button--primary:active {
  box-shadow: 0 2px 8px rgba(230, 37, 79, 0.25);
}

/* SECONDARY - Couleur secondaire */
.button--secondary {
  background-color: var(--adw-secondary);
  color: var(--adw-text-white);
  box-shadow: 0 2px 8px rgba(74, 71, 69, 0.25);
}

.button--secondary:hover {
  background-color: var(--adw-secondary-dark);
  box-shadow: 0 6px 16px rgba(74, 71, 69, 0.35);
}

.button--secondary:active {
  box-shadow: 0 2px 8px rgba(74, 71, 69, 0.25);
}

/* ACCENT - Couleur d'accent */
.button--accent {
  background-color: var(--adw-accent);
  color: var(--adw-text-dark);
  box-shadow: 0 2px 8px rgba(227, 216, 176, 0.35);
}

.button--accent:hover {
  background-color: var(--adw-accent-dark);
  box-shadow: 0 6px 16px rgba(227, 216, 176, 0.45);
}

.button--accent:active {
  box-shadow: 0 2px 8px rgba(227, 216, 176, 0.35);
}

/* TEXT - Version minimaliste */
.button--text {
  background-color: transparent;
  color: var(--adw-primary);
  box-shadow: none;
  border: 2px solid var(--adw-bg-dark-dark);
}

.button--text::before {
  display: none; /* Pas d'effet brillant pour text */
}

.button--text:hover {
  background-color: var(--adw-primary-soft);
  border-color: var(--adw-primary);
  box-shadow: 0 4px 12px rgba(230, 37, 79, 0.1);
}

.button--text:active {
  background-color: rgba(230, 37, 79, 0.15);
  box-shadow: none;
}

/* BLACK - Couleur bouton par défaut du thème */
.button--black {
  background-color: rgb(var(--adw-color-button));
  color: rgb(var(--adw-color-button-text));
  box-shadow: 0 2px 8px rgba(var(--adw-color-button), 0.3);
}

.button--black:hover {
  background-color: rgba(var(--adw-color-button), 0.85);
  box-shadow: 0 6px 16px rgba(var(--adw-color-button), 0.4);
}

.button--black:active {
  background-color: rgba(var(--adw-color-button), 0.9);
  box-shadow: 0 2px 8px rgba(var(--adw-color-button), 0.3);
}

/* Version outline du black */
.button--black-outline {
  background-color: transparent;
  color: rgb(var(--adw-color-button));
  border: 2px solid rgb(var(--adw-color-button));
  box-shadow: none;
}

.button--black-outline::before {
  display: none; /* Pas d'effet brillant pour outline */
}

.button--black-outline:hover {
  background-color: rgb(var(--adw-color-button));
  color: rgb(var(--adw-color-button-text));
  box-shadow: 0 4px 12px rgba(var(--adw-color-button), 0.25);
}

.button--black-outline:active {
  background-color: rgba(var(--adw-color-button), 0.9);
  box-shadow: 0 2px 8px rgba(var(--adw-color-button), 0.2);
}

/* ============================================
   TAILLES
   ============================================ */

/* SMALL */
.button--sm {
  font-size: var(--adw-font-sm);
  padding: var(--adw-space-sm) var(--adw-space-lg);
  min-height: 2.5rem;
  min-width: 8rem;
}

/* MEDIUM (default) */
.button--md {
  font-size: var(--adw-font-base);
  padding: var(--adw-space-md) var(--adw-space-xl);
  min-height: 3.5rem;
  min-width: 12rem;
}

/* LARGE */
.button--lg {
  font-size: var(--adw-font-lg);
  padding: var(--adw-space-lg) calc(var(--adw-space-xl) * 1.5);
  min-height: 4.5rem;
  min-width: 14rem;
  letter-spacing: 0.05em;
}

/* ============================================
   VARIANTES SPÉCIALES
   ============================================ */

/* Bouton pleine largeur */
.button--full {
  width: 100%;
  min-width: 100%;
}

/* Bouton avec icône */
.button--icon {
  gap: var(--adw-space-sm);
}

.button--icon svg,
.button--icon i {
  width: 1.25em;
  height: 1.25em;
  transition: transform var(--adw-transition-normal);
}

.button--icon:hover svg,
.button--icon:hover i {
  transform: translateX(3px);
}

/* Bouton loading */
.button--loading {
  pointer-events: none;
  position: relative;
  color: transparent !important;
}

.button--loading::after {
  content: "";
  position: absolute;
  width: 1.2em;
  height: 1.2em;
  top: 50%;
  left: 50%;
  margin-left: -0.6em;
  margin-top: -0.6em;
  border: 2px solid currentColor;
  border-radius: 50%;
  border-right-color: transparent;
  animation: button-spin 0.6s linear infinite;
}

@keyframes button-spin {
  to {
    transform: rotate(360deg);
  }
}

.text-right{
  text-align: right;
}

/* ============================================
   HEADER TOP STRUCTURE
   ============================================ */

.header-top {
  background: var(--adw-bg-white);
  border-bottom: 1px solid var(--adw-border-light);
  padding: 1.25rem 0; /* Plus de padding pour header plus imposant */
  position: relative;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
  top: 0;
  z-index: 999;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

/* Container - Base 1440px */
.header-top .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 2rem;
}

/* Grid Layout - Search prend le maximum d'espace */
.header-grid {
  display: grid;
  grid-template-columns: minmax(120px, 200px) 1fr minmax(auto, 280px);
  align-items: center;
  gap: 1.5rem;
  width: 100%;
}

/* Header Sticky Clone - Version compacte qui apparaît au scroll */
.header-sticky-clone {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  z-index: 2000;

  /* Caché par défaut */
  transform: translateY(-100%);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}

/* Visible au scroll */
.header-sticky-clone.is-visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* Contenu du header sticky */
.header-sticky-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0.75rem 0;
  min-height: 60px;
}

/* Menu hamburger dans le sticky */
.header-sticky-menu {
  display: flex;
  align-items: center;
}

.header-sticky-menu .adw-hamburger {
  /* Réutiliser les styles de votre hamburger existant */
  padding: 0.5rem;
}

/* Logo dans le sticky - version compacte */
.header-sticky-logo {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-sticky-logo img {
  max-height: 40px;
  width: auto;
  transition: max-height 0.3s ease;
}

/* Actions dans le sticky */
.header-sticky-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* Responsive - Mobile */
@media (max-width: 767px) {
  .header-sticky-content {
    padding: 0.5rem 0;
    min-height: 50px;
  }

  .header-sticky-logo img {
    max-height: 32px;
  }

  .header-sticky-actions {
    gap: 0.5rem;
  }
}

/* Animation pour les icônes du sticky */
.header-sticky-clone .action-icon {
  width: 20px;
  height: 20px;
}

.header-sticky-clone .action-text {
  display: none;
}

@media (min-width: 768px) {
  .header-sticky-clone .action-text {
    display: inline;
  }
}

/* Badge panier dans le sticky */
.header-sticky-clone .cart-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  font-size: 10px;
}

/* Espacer le contenu pour éviter qu'il passe sous le sticky */
body.has-sticky-header {
  padding-top: 0;
}

body.has-sticky-header.sticky-active {
  /* Ajouter un padding si nécessaire pour éviter les sauts */
}

/* ============================================
   LOGO SECTION - Compact
   ============================================ */

.header-logo {
  display: flex;
  align-items: center;
  min-width: 120px;
  max-width: 200px;
}

.logo-wrapper {
  margin: 0;
  line-height: 1;
  width: 100%;
}

.logo-wrapper a {
  display: block;
}

.logo-wrapper img {
  max-height: 48px;
  max-width: 100%;
  height: auto;
  width: auto;
  display: block;
  transition: opacity 0.2s ease;
}

.logo-wrapper img:hover {
  opacity: 0.85;
}

/* ============================================
   SEARCH SECTION - IMPOSANTE
   ============================================ */

.header-search {
  flex: 1;
  max-width: 100%;
  width: 100%;
  margin: 0 1rem;
}

.search-widget {
  width: 100%;
}

.search-form {
  position: relative;
  width: 100%;
}

.search-input-wrapper {
  position: relative;
  width: 100%;
}

/* Search Input - GRANDE ET IMPOSANTE */
.search-input {
  width: 100%;
  height: 52px; /* Hauteur imposante */
  padding: 0 3.5rem 0 3.5rem;
  border: 2px solid var(--adw-border-light);
  border-radius: var(--adw-buttons-radius-small);
  font-family: var(--adw-font-family);
  font-size: 1rem;
  font-weight: 400;
  color: var(--adw-text-dark);
  background: #f8f9fa; /* Fond légèrement gris */
  transition: all 0.2s ease;
  outline: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.search-input:hover {
  border-color: var(--adw-border-medium);
  background: var(--adw-bg-white);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.search-input:focus {
  border-color: var(--adw-primary);
  background: var(--adw-bg-white);
  box-shadow: 0 0 0 4px rgba(230, 37, 79, 0.1), 0 2px 8px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
}

.search-input::placeholder {
  color: #9a9593;
  font-weight: 400;
}

/* Icône de recherche - Plus grande */
.search-icon {
  position: absolute;
  left: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--adw-text-medium);
  pointer-events: none;
  transition: color 0.2s ease;
  width: 22px;
  height: 22px;
}

.search-input:focus ~ .search-icon,
.search-input:not(:placeholder-shown) ~ .search-icon {
  color: var(--adw-primary);
}

/* Bouton Clear - Plus visible */
.search-clear {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0.625rem;
  cursor: pointer;
  color: var(--adw-text-light);
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
 border-radius: var(--adw-buttons-radius-small);
}

.search-clear svg {
  width: 20px;
  height: 20px;
}

.search-input:not(:placeholder-shown) ~ .search-clear {
  opacity: 1;
  visibility: visible;
}

.search-clear:hover {
  color: var(--adw-primary);
  background: rgba(230, 37, 79, 0.1);
  transform: translateY(-50%) scale(1.1);
}

#search_widget form input {
  padding: 10px 20px 10px 50px;
}

/* ============================================
   HEADER ACTIONS - USER & CART
   ============================================ */

.header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  justify-content: flex-end;
}

.header-action-item {
  position: relative;
}

.action-link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem;
  border-radius: var(--adw-buttons-radius-small);
  font-family: var(--adw-font-family);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--adw-text-dark);
  text-decoration: none;
  transition: all 0.2s ease;
  white-space: nowrap;
  cursor: pointer;
}

.action-link:hover {
  background: #f8f9fa !important;
  color: var(--adw-primary) !important;
}

.action-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  stroke: currentColor;
  transition: transform 0.2s ease;
}

.action-link:hover .action-icon {
  transform: scale(1.1);
}

.action-text {
  display: inline-block;
}

/* ============================================
   CART SPECIFIC
   ============================================ */

.cart-icon-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.cart-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  background: var(--adw-primary);
  color: white;
  font-size: 0.625rem;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  padding: 0 4px;
  border: 2px solid white;
  animation: cartBounce 0.4s ease;
}

@keyframes cartBounce {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}

.cart-preview.active .action-link {
  background: rgba(230, 37, 79, 0.1);
  color: var(--adw-primary);
}

.cart-preview.active .action-link:hover {
  background: var(--adw-primary);
  color: white;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

/* Large Desktop (>1440px) */
@media (min-width: 1441px) {
  .header-top .container {
    padding: 0 2.5rem;
  }

  .header-grid {
    gap: 2rem;
  }

  .search-input {
    height: 56px; /* Encore plus imposant */
    font-size: 1.063rem;
  }
}

/* Desktop Standard (1200px-1440px) */
@media (min-width: 1200px) and (max-width: 1440px) {
  .header-top .container {
    padding: 0 2rem;
  }
}

/* Tablette Large (992px-1199px) */
@media (max-width: 1199px) {
  .header-top .container {
    padding: 0 1.5rem;
  }

  .header-grid {
    gap: 1.25rem;
  }

  .header-search {
    margin: 0 0.75rem;
  }

  .search-input {
    height: 48px;
    font-size: 0.938rem;
  }

  .action-text {
    display: none;
  }

  .action-link {
    padding: 0.625rem;
  }
}

/* Tablette (768px-991px) */
@media (max-width: 991px) {
  .header-top {
    padding: 1rem 0;
  }

  .header-top .container {
    padding: 0 1.25rem;
  }

  .header-grid {
    grid-template-columns: auto 1fr;
    gap: 1rem;
  }

  .header-search {
    grid-column: 1 / -1;
    max-width: 100%;
    order: 3;
    margin: 0;
  }

  .search-input {
    height: 48px;
    font-size: 0.938rem;
  }

  .header-logo {
    min-width: 100px;
    max-width: 150px;
  }

  .logo-wrapper img {
    max-height: 40px;
  }

  .header-actions {
    justify-content: flex-end;
    gap: 0.25rem;
  }
}

/* Smartphone (576px-767px) */
@media (max-width: 767px) {
  .header-top {
    padding: 0.75rem 0;
  }

  .header-top .container {
    padding: 0 1rem;
  }

  .header-grid {
    gap: 0.75rem;
  }

  .header-logo {
    min-width: 80px;
    max-width: 120px;
  }

  .logo-wrapper img {
    max-height: 36px;
  }

  .search-input {
    height: 44px;
    padding: 0 3rem 0 3rem;
    font-size: 0.938rem;
    border-radius: 8px;
  }

  .search-icon {
    left: 1rem;
    width: 20px;
    height: 20px;
  }

  .search-clear {
    right: 0.75rem;
  }

  .search-clear svg {
    width: 18px;
    height: 18px;
  }

  .action-icon {
    width: 22px;
    height: 22px;
  }

  .cart-badge {
    font-size: 0.563rem;
    min-width: 16px;
    height: 16px;
    top: -4px;
    right: -6px;
  }
}

/* Très Petit Écran (<576px) */
@media (max-width: 575px) {
  .header-top .container {
    padding: 0 0.75rem;
  }

  .header-grid {
    gap: 0.5rem;
  }

  .header-logo {
    min-width: 70px;
    max-width: 100px;
  }

  .logo-wrapper img {
    max-height: 32px;
  }

  .search-input {
    height: 42px;
    border-radius: 8px;
    font-size: 0.875rem;
  }

  .action-link {
    padding: 0.5rem;
  }

  .action-icon {
    width: 20px;
    height: 20px;
  }
}

/* ============================================
   ANIMATIONS & INTERACTIONS
   ============================================ */

/* Scroll Effect */
.header-top.scrolled {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 0.875rem 0;
}

.header-top.scrolled .search-input {
  height: 48px;
}

.header-top.scrolled .logo-wrapper img {
  max-height: 40px;
}

/* Focus Visible */
.action-link:focus-visible,
.search-input:focus-visible {
  outline: 2px solid var(--adw-primary);
  outline-offset: 2px;
}

/* Loading State */
.search-widget.loading .search-icon {
  animation: rotate 1s linear infinite;
}

@keyframes rotate {
  from {
    transform: translateY(-50%) rotate(0deg);
  }
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}

.logo-wrapper img {
  max-height: 58px;
}

/* Logo Hover */
.header-logo a {
  display: block;
  border-radius: 4px;
  transition: transform 0.2s ease;
}

.header-logo a:hover {
  transform: scale(1.02);
}

#displayNavFullWidth {
  padding: 1rem 0;
}

@media only screen and (min-width: 768px) {
  #search_widget.adwcore-search_widget {
    float: none;
    margin-bottom: 0;
  }
}

/* ============================================
   FEATURED PRODUCTS - Style BlackMarket.fr
   ============================================ */

.adwcore__featured-products {
  padding: var(--adw-space-xl) 0;
  /* background-color: var(--adw-bg-light); */
}

/* Container */
.featured-products__container {
  max-width: var(--adw-container-max-width);
  margin: 0 auto;
  padding: 0 var(--adw-space-md);
}

@media (min-width: 768px) {
  .featured-products__container {
    padding: 0 var(--adw-space-xl);
  }
}

/* ============================================
   HEADER
   ============================================ */

.featured-products__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--adw-space-lg);
  margin-bottom: var(--adw-space-xl);
  padding-bottom: var(--adw-space-lg);
  border-bottom: 1px solid var(--adw-border-light);
}

@media (max-width: 767px) {
  .featured-products__header {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Titre */
.featured-products__title-wrapper {
  flex: 1;
}

.featured-products__title {
  font-size: var(--adw-font-2xl);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin: 0 0 var(--adw-space-xs) 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.featured-products__subtitle {
  display: block;
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-normal);
  color: var(--adw-text-medium);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* Lien header */
.featured-products__link {
  flex-shrink: 0;
  white-space: nowrap;
}

.featured-products__link:hover {
  color: var(--adw-black) !important;
}

@media (max-width: 767px) {
  .featured-products__link {
    display: none; /* Caché sur mobile, on utilise le bouton footer */
  }
}

.featured-products__link svg {
  width: 1.2em;
  height: 1.2em;
  transition: transform var(--adw-transition-normal);
}

.featured-products__link:hover svg {
  transform: translateX(4px);
}

/* ============================================
   GRILLE DE PRODUITS
   ============================================ */

.featured-products__grid {
  margin-bottom: var(--adw-space-xl);
}

.featured-products__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--adw-space-md);
}

/* Responsive Grid */
@media (min-width: 576px) {
  .featured-products__list {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--adw-space-lg);
  }
}

@media (min-width: 768px) {
  .featured-products__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .featured-products__list {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1400px) {
  .featured-products__list {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* Item de produit */
.featured-products__item {
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: var(--adw-bg-white);
  border-radius: 8px;
  overflow: hidden;
  transition: all var(--adw-transition-normal);
  box-shadow: var(--adw-shadow-sm);
}

.featured-products__item:hover {
  transform: translateY(-4px);
  box-shadow: var(--adw-shadow-lg);
}

/* ============================================
   FOOTER (Mobile uniquement)
   ============================================ */

.featured-products__footer {
  display: block;
}

@media (min-width: 768px) {
  .featured-products__footer {
    display: none; /* Masqué sur desktop */
  }
}

.featured-products__footer .button {
  justify-content: space-between;
}

/* ============================================
   VARIANTE DARK (Style BlackMarket)
   ============================================ */

.adwcore__featured-products--dark {
  background-color: var(--adw-bg-dark);
}

.adwcore__featured-products--dark .featured-products__header {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

.adwcore__featured-products--dark .featured-products__title {
  color: var(--adw-text-white);
}

.adwcore__featured-products--dark .featured-products__subtitle {
  color: rgba(255, 255, 255, 0.6);
}

.adwcore__featured-products--dark .featured-products__item {
  background-color: var(--adw-secondary);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.adwcore__featured-products--dark .featured-products__item:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.featured-products__item {
  animation: fadeInUp 0.6s ease backwards;
}

.featured-products__item:nth-child(1) {
  animation-delay: 0.05s;
}
.featured-products__item:nth-child(2) {
  animation-delay: 0.1s;
}
.featured-products__item:nth-child(3) {
  animation-delay: 0.15s;
}
.featured-products__item:nth-child(4) {
  animation-delay: 0.2s;
}
.featured-products__item:nth-child(5) {
  animation-delay: 0.25s;
}
.featured-products__item:nth-child(6) {
  animation-delay: 0.3s;
}
.featured-products__item:nth-child(7) {
  animation-delay: 0.35s;
}
.featured-products__item:nth-child(8) {
  animation-delay: 0.4s;
}
/* ============================================
   SPLIDE CAROUSEL - PRODUITS EN VEDETTE
   ============================================ */

/* Container principal */
.featured-products-splide__list.splide {
  position: relative;
  margin: 0 auto;
  max-width: 100%;
  padding: 0;
}

/* Track et liste */
.featured-products-splide__list .splide__track {
  overflow: hidden;
  border-radius: 0;
  padding: 1rem 0 !important; /* écrase le padding-left/right injecté par Splide JS */
}

.featured-products-splide__list .splide__list {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  align-items: stretch;
}

.featured-products-splide__list .splide__slide {
  flex-shrink: 0;
  list-style: none;
  box-sizing: border-box;
  height: auto;
  display: flex;
}

/* Produits - Structure verticale complète */
.featured-products-splide__list .featured-products__item {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.featured-products-splide__list .product-miniature,
.products.featured-products__list .product-miniature,
.adw-bestsellers-carousel .product-miniature {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
  transition: all 0.3s ease;
  border: 1px solid #e9e9e9;
}

.featured-products-splide__list .product-miniature:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.featured-products-splide__list .thumbnail-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
}

/* Image produit - hauteur fixe pour alignement */
.featured-products-splide__list .thumbnail-top {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.featured-products-splide__list .thumbnail-image-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
}

.featured-products-splide__list .thumbnail-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Description produit - flex-grow pour remplir l'espace */
.featured-products-splide__list .product-description {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 1rem;
  gap: 0.5rem;
  min-height: 8rem;
}

.featured-products-splide__list .product-title {
  font-size: 0.875rem;
  line-height: 1.4;
  margin: 0;
  flex: 1;
}

.product-miniature .thumbnail-container:focus .product-description::after,
.product-miniature .thumbnail-container:hover .product-description::after {
  display: none;
}

.featured-products-splide__list .product-price-and-shipping {
  margin-top: inherit;
  font-weight: 600;
  color: var(--primary-color, #e6254f);
}

/* ============================================
   FLÈCHES DE NAVIGATION
   ============================================ */

.featured-products-splide__list .splide__arrows {
  position: relative;
}

.featured-products-splide__list .splide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--primary-color, #e6254f);
  color: white;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  opacity: 0.9;
}

.featured-products-splide__list .splide__arrow:hover:not(:disabled) {
  background: var(--secondary-color, #4a4745);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  opacity: 1;
  transform: translateY(-50%) scale(1.05);
}

.featured-products-splide__list .splide__arrow--prev {
  left: -1.5rem;
}

.featured-products-splide__list .splide__arrow--next {
  right: -1.5rem;
}

.featured-products-splide__list .splide__arrow:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  background: #ccc;
}

.featured-products-splide__list .splide__arrow svg {
  width: 1.5rem;
  height: 1.5rem;
  fill: currentColor;
}

/* Alternative: Icônes avec chevrons purs CSS */
.featured-products-splide__list .splide__arrow::before {
  content: "";
  display: block;
  width: 0.625rem;
  height: 0.625rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}

.featured-products-splide__list .splide__arrow--prev::before {
  transform: rotate(-135deg);
  margin-left: 0.25rem;
}

.featured-products-splide__list .splide__arrow--next::before {
  transform: rotate(45deg);
  margin-right: 0.25rem;
}

/* Masquer le SVG si vous utilisez ::before */
.featured-products-splide__list .splide__arrow svg {
  display: none;
}

/* ============================================
   PAGINATION
   ============================================ */

.featured-products-splide__list .splide__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1.5rem 0 0;
  margin: 0;
  list-style: none;
  position: relative;
  bottom: 0;
}

.featured-products-splide__list .splide__pagination__page {
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  background: #d1d1d1;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  margin: 0;
}

.featured-products-splide__list .splide__pagination__page:hover {
  background: var(--secondary-color, #4a4745);
  transform: scale(1.2);
}

.featured-products-splide__list .splide__pagination__page.is-active {
  background: var(--primary-color, #e6254f);
  width: 1.875rem;
  border-radius: 0.3125rem;
}

/* ============================================
   RESPONSIVE - TABLETTE
   ============================================ */

@media (max-width: 992px) {
  .featured-products-splide__list .splide__arrow {
    width: 2.5rem;
    height: 2.5rem;
  }

  .featured-products-splide__list .splide__arrow--prev {
    left: -0.75rem;
  }

  .featured-products-splide__list .splide__arrow--next {
    right: -0.75rem;
  }

  .featured-products-splide__list .product-description {
    padding: 0.875rem;
  }
}

/* ============================================
   RESPONSIVE - MOBILE
   ============================================ */

@media (max-width: 768px) {
  .featured-products-splide__list .splide__arrow {
    width: 2.25rem;
    height: 2.25rem;
    background: rgba(230, 37, 79, 0.95);
  }

  .featured-products-splide__list .splide__arrow::before {
    width: 0.5rem;
    height: 0.5rem;
  }

  .featured-products-splide__list .splide__arrow--prev {
    left: 0.5rem;
    transform: translateY(-50%);
  }

  .featured-products-splide__list .splide__arrow--next {
    right: 0.5rem;
    transform: translateY(-50%);
  }

  .featured-products-splide__list .product-description {
    padding: 0.75rem;
  }

  .featured-products-splide__list .product-title {
    font-size: 0.8125rem;
  }
}

/* ============================================
   RESPONSIVE - PETIT MOBILE
   ============================================ */

@media (max-width: 576px) {
  .featured-products-splide__list .splide__arrow {
    width: 2rem;
    height: 2rem;
  }

  .featured-products-splide__list .splide__arrow--prev {
    left: 0.25rem;
  }

  .featured-products-splide__list .splide__arrow--next {
    right: 0.25rem;
  }

  .featured-products-splide__list .splide__pagination {
    padding: 1rem 0 0;
    gap: 0.375rem;
  }

  .featured-products-splide__list .splide__pagination__page {
    width: 0.5rem;
    height: 0.5rem;
  }

  .featured-products-splide__list .splide__pagination__page.is-active {
    width: 1.5rem;
  }

  .featured-products-splide__list .product-description {
    padding: 0.625rem;
  }
}

/* SOLUTION */
@media (max-width: 430px) {
  .featured-products-splide__list .splide__slide {
    width: calc(100% - 4.45rem) !important; /* = 1 produit */
    /* margin-right: 0.25rem !important; */
  }

  .featured-products-splide__list .splide__track {
    padding-left: 0;
    padding-right: 0;
  }

  .featured-products-splide__list .product-miniature:hover,
  .featured-products__item:hover {
    transform: none;
  }
}

/* ============================================
   AJUSTEMENTS POUR FLAGS & WISHLIST
   ============================================ */

.featured-products-splide__list .product-flags {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.featured-products-splide__list .product-flag {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 0.25rem;
}

.featured-products-splide__list .wishlist-button-add {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  z-index: 2;
  background: rgba(255, 255, 255, 0.95);
  border: none;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.featured-products-splide__list .wishlist-button-add:hover {
  background: var(--primary-color, #e6254f);
  color: white;
  transform: scale(1.1);
}

/* ============================================
   LOADER (optionnel)
   ============================================ */

.featured-products-splide__list.is-loading {
  opacity: 0.6;
  pointer-events: none;
}

.featured-products-splide__list.is-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 3rem;
  height: 3rem;
  border: 3px solid var(--primary-color, #e6254f);
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

/* ============================================
   PRODUCT MINIATURE - Optimized
   Style: Tailwind CSS / BlackMarket.fr
   Conserve les sélecteurs PrestaShop par défaut
   ============================================ */

/* Container principal */
.js-product.product {
  position: relative;
  height: 100%;
}

.product-miniature {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--adw-bg-white);
  border-radius: 12px;
  overflow: hidden;
  transition: all var(--adw-transition-normal);
  box-shadow: var(--adw-shadow-sm);
}

.product-miniature:hover {
  /* box-shadow: var(--adw-shadow-lg); */
  /* transform: translateY(-4px); */
}

/* ============================================
   THUMBNAIL CONTAINER
   ============================================ */

.thumbnail-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* ============================================
   THUMBNAIL TOP (Image + Actions)
   ============================================ */

.thumbnail-top {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--adw-bg-light);
}

/* Lien image */
.thumbnail.product-thumbnail {
  display: block;
  text-decoration: none;
}

.thumbnail-image-wrapper {
  position: relative;
  width: 100%;
  /* Ratio 4:5 */
  /* padding-bottom: 125%; */
  padding-bottom: 99%;
  overflow: hidden;
}

.thumbnail.product-thumbnail picture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.thumbnail.product-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--adw-transition-slow);
  background: #fff;
}

.product-miniature:hover .thumbnail.product-thumbnail img {
  transform: scale(1.05);
}

/* Overlay */
.thumbnail-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.02) 50%,
    rgba(0, 0, 0, 0.1) 100%
  );
  opacity: 0;
  transition: opacity var(--adw-transition-normal);
  pointer-events: none;
}

.product-miniature:hover .thumbnail-overlay {
  opacity: 1;
}

/* ============================================
   PRODUCT FLAGS (Badges)
   ============================================ */

.product-flags {
  position: absolute;
  top: var(--adw-space-sm);
  left: var(--adw-space-sm);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--adw-space-xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-flag {
  display: inline-block;
  padding: var(--adw-space-xs) var(--adw-space-sm);
  font-size: var(--adw-font-xs);
  font-weight: var(--adw-font-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 4px;
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.product-flag.new {
  background-color: var(--adw-primary);
  color: var(--adw-text-white);
}

.product-flag.discount {
  background-color: var(--adw-error);
  color: var(--adw-text-white);
}

.product-flag.pack {
  background-color: var(--adw-info);
  color: var(--adw-text-white);
}

.product-flag.online-only {
  background-color: var(--adw-secondary);
  color: var(--adw-text-white);
}

.product-flag.on-sale {
  background-color: var(--adw-accent);
  color: var(--adw-text-dark);
}

/* ============================================
   HIGHLIGHTED INFORMATIONS (Quick View + Variants)
   ============================================ */

.highlighted-informations {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--adw-space-md);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--adw-space-sm);
  opacity: 0;
  transform: translateY(10px);
  transition: all var(--adw-transition-normal);
  z-index: 3;
}

.product-miniature:hover .highlighted-informations {
  opacity: 1;
  transform: translateY(0);
}

.highlighted-informations.no-variants {
  justify-content: center;
}

/* ============================================
   QUICK VIEW
   ============================================ */

.quick-view {
  display: flex;
  align-items: center;
  gap: var(--adw-space-xs);
  padding: var(--adw-space-sm) var(--adw-space-md);
  background-color: var(--adw-bg-white);
  color: var(--adw-text-dark);
  border: none;
  border-radius: 8px;
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-medium);
  text-decoration: none;
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  box-shadow: var(--adw-shadow-md);
}

.quick-view:hover {
  background-color: var(--adw-primary);
  color: var(--adw-text-white);
  transform: translateY(-2px);
  box-shadow: var(--adw-shadow-lg);
}

.quick-view-icon {
  flex-shrink: 0;
}

.quick-view-text {
  white-space: nowrap;
}

@media (max-width: 767px) {
  .quick-view-text {
    display: none;
  }

  .quick-view {
    padding: var(--adw-space-sm);
  }
}

/* ============================================
   VARIANT LINKS
   ============================================ */

.variant-links {
  display: flex;
  gap: var(--adw-space-xs);
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
}

.variant-links a {
  display: block;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid var(--adw-bg-white);
  cursor: pointer;
  transition: all var(--adw-transition-fast);
  box-shadow: var(--adw-shadow-sm);
  overflow: hidden;
}

.variant-links a:hover {
  transform: scale(1.15);
  box-shadow: var(--adw-shadow-md);
}

.variant-links a span {
  display: block;
  width: 100%;
  height: 100%;
}

/* ============================================
   PRODUCT DESCRIPTION
   ============================================ */

.product-description {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: var(--adw-space-md);
  gap: var(--adw-space-sm);
}

@media (min-width: 1024px) {
  .product-description {
    padding: var(--adw-space-lg);
  }
}

/* ============================================
   PRODUCT TITLE
   ============================================ */

.product-title {
  margin: 0;
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-medium);
  line-height: 1.4;
  min-height: 2.8em; /* 2 lignes */
}

.product-miniature .product-title a {
  color: var(--adw-text-dark);
  text-decoration: none;
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-semibold);
  transition: color var(--adw-transition-fast);
  display: flex;
  /* -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; */
  overflow: hidden;
  justify-content: flex-start;
  align-items: center;
  min-height: 4rem;
}

.product-miniature .product-description {
  padding: 0.25rem 0.55rem 0.7rem;
}

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

/* ============================================
   PRODUCT REVIEWS
   ============================================ */

.product-list-reviews {
  min-height: 20px;
}

/* ============================================
   PRODUCT PRICE AND SHIPPING
   ============================================ */

.product-price-and-shipping {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--adw-space-sm);
  flex-wrap: wrap;
  margin-top: auto;
}

/* Prix avec réduction */
.product-prices {
  display: flex;
  align-items: baseline;
  gap: var(--adw-space-sm);
  flex-wrap: wrap;
}

/* Prix */
.price {
  font-weight: var(--adw-font-bold);
  line-height: 1;
}

.price-current,
.price-single {
  font-size: var(--adw-font-lg);
  color: var(--adw-primary);
  font-weight: var(--adw-font-medium);  
  letter-spacing: -1px;
}

.regular-price,
.price-regular {
  font-size: var(--adw-font-sm);
  color: var(--adw-text-medium);
  text-decoration: line-through;
  font-weight: var(--adw-font-normal);
}

/* Pourcentage de réduction */
.discount-percentage,
.discount-amount {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--adw-space-xs) var(--adw-space-sm);
  background-color: var(--adw-error);
  color: var(--adw-text-white);
  font-size: var(--adw-font-xs);
  font-weight: var(--adw-font-bold);
  border-radius: 4px;
  white-space: nowrap;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 575px) {
  .product-description {
    padding: var(--adw-space-sm);
  }

  .product-title {
    font-size: var(--adw-font-sm);
    min-height: auto;
  }

  .price-current,
  .price-single {
    font-size: var(--adw-font-md);
  }
}

/* ============================================
   VARIANTE DARK MODE
   ============================================ */

.product-miniature--dark {
  background-color: var(--adw-secondary);
}

.product-miniature--dark .product-title a {
  color: var(--adw-text-white);
}

.product-miniature--dark .product-title a:hover {
  color: var(--adw-primary-light);
}

.product-miniature--dark .quick-view {
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--adw-text-white);
  backdrop-filter: blur(8px);
}

.product-miniature--dark .quick-view:hover {
  background-color: var(--adw-primary);
  color: var(--adw-text-white);
}

/* ============================================
   ANIMATIONS & LOADING
   ============================================ */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.product-miniature {
  animation: fadeInUp 0.6s ease backwards;
}

/* Délai progressif pour l'animation */
.js-product:nth-child(1) .product-miniature {
  animation-delay: 0.05s;
}
.js-product:nth-child(2) .product-miniature {
  animation-delay: 0.1s;
}
.js-product:nth-child(3) .product-miniature {
  animation-delay: 0.15s;
}
.js-product:nth-child(4) .product-miniature {
  animation-delay: 0.2s;
}
.js-product:nth-child(5) .product-miniature {
  animation-delay: 0.25s;
}
.js-product:nth-child(6) .product-miniature {
  animation-delay: 0.3s;
}
.js-product:nth-child(7) .product-miniature {
  animation-delay: 0.35s;
}
.js-product:nth-child(8) .product-miniature {
  animation-delay: 0.4s;
}

/* Loading skeleton */
@keyframes shimmer {
  0% {
    background-position: -500px 0;
  }
  100% {
    background-position: 500px 0;
  }
}

.product-miniature--loading .thumbnail-image-wrapper {
  background: linear-gradient(
    90deg,
    var(--adw-bg-light) 0%,
    #f0f0f0 50%,
    var(--adw-bg-light) 100%
  );
  background-size: 500px 100%;
  animation: shimmer 1.5s infinite;
}

/* ============================================
   PRODUCT FLAGS (Badges) - Version optimisée
   ============================================ */

.product-flags {
  position: absolute;
  top: var(--adw-space-sm);
  left: var(--adw-space-sm);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--adw-space-xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-flags li.product-flag {
  /* padding: 0.25rem 0.5rem; */
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 0.25rem;
  color: #fff;
  margin-top: 0px;
}

.product-flag:hover {
  transform: translateX(-2px);
  box-shadow: var(--adw-shadow-md);
}

/* NEW - Nouveau */
.product-flags li.product-flag.new {
  background-color: var(--adw-primary);
  color: var(--adw-text-white);
}

/* ON SALE - Promo */
.product-flags li.product-flag.on-sale {
  background-color: var(--adw-accent);
  color: var(--adw-text-dark);
}

/* DISCOUNT - Réduction */
.product-flags li.product-flag.discount {
  background-color: var(--adw-error);
  color: var(--adw-text-white);
}

/* OUT OF STOCK - Rupture de stock */
.product-flags li.product-flag.out_of_stock {
  background-color: var(--adw-secondary);
  color: var(--adw-text-white);
}

/* PACK - Pack */
.product-flags li.product-flag.pack {
  background-color: var(--adw-info);
  color: var(--adw-text-white);
}

/* ONLINE ONLY - En ligne uniquement */
.product-flags li.product-flag.online-only {
  background-color: var(--adw-secondary-light);
  color: var(--adw-text-white);
}

/* DISPONIBLE - Disponible */
.product-flags li.product-flag.available {
  background-color: var(--adw-success);
  color: var(--adw-text-white);
}

/* DERNIERS ARTICLES - Last items */
.product-flags li.product-flag.last-items {
  background-color: var(--adw-warning);
  color: var(--adw-text-white);
}

/* CUSTOM - Personnalisé */
.product-flags li.product-flag.custom {
  background-color: var(--adw-accent-dark);
  color: var(--adw-text-dark);
}

/* ============================================
   VARIANTES DE STYLE
   ============================================ */

/* Version outline (contour) */
.product-flag--outline {
  background-color: transparent;
  border: 2px solid currentColor;
  backdrop-filter: blur(12px);
}

.product-flag.new.product-flag--outline {
  color: var(--adw-primary);
  background-color: rgba(230, 37, 79, 0.1);
}

.product-flag.on-sale.product-flag--outline {
  color: var(--adw-accent-dark);
  background-color: rgba(227, 216, 176, 0.3);
}

.product-flag.out_of_stock.product-flag--outline {
  color: var(--adw-secondary);
  background-color: rgba(74, 71, 69, 0.1);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 575px) {
  .product-flags {
    top: var(--adw-space-xs);
    left: var(--adw-space-xs);
    gap: 4px;
  }

  .product-flag {
    font-size: 0.65rem;
    padding: 4px var(--adw-space-sm);
  }
}

@media (min-width: 768px) {
  .product-flag {
    padding: var(--adw-space-sm) var(--adw-space-lg);
    width: fit-content !important;
  }
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes badgeSlideIn {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.product-flag {
  animation: badgeSlideIn 0.4s ease backwards;
}

.product-flag:nth-child(1) {
  animation-delay: 0.1s;
}
.product-flag:nth-child(2) {
  animation-delay: 0.15s;
}
.product-flag:nth-child(3) {
  animation-delay: 0.2s;
}
.product-flag:nth-child(4) {
  animation-delay: 0.25s;
}

/* ============================================
   VARIANTE DARK MODE
   ============================================ */

.product-miniature--dark .product-flag {
  backdrop-filter: blur(12px);
}

.product-miniature--dark .product-flag.new {
  background-color: var(--adw-primary-light);
}

.product-miniature--dark .product-flag.on-sale {
  background-color: var(--adw-accent-light);
  color: var(--adw-text-dark);
}

.product-miniature--dark .product-flag.out_of_stock {
  background-color: var(--adw-secondary-light);
}

/* ============================================
   VERSION AVEC ICÔNES (optionnel)
   ============================================ */

.product-flag--with-icon {
  display: inline-flex;
  align-items: center;
  gap: var(--adw-space-xs);
}

.product-flag--with-icon svg,
.product-flag--with-icon i {
  width: 1em;
  height: 1em;
}

/* Exemples d'icônes inline pour les badges */
.product-flag.new::before {
  content: "✨";
  margin-right: 4px;
}

.product-flag.on-sale::before {
  content: "🔥";
  margin-right: 4px;
}

.product-flag.out_of_stock::before {
  content: "⚠️";
  margin-right: 4px;
}

/* ============================================
   VERSION GRADIENT (Premium)
   ============================================ */

.product-flag--gradient.new {
  background: linear-gradient(
    135deg,
    var(--adw-primary) 0%,
    var(--adw-primary-dark) 100%
  );
  color: var(--adw-text-white);
}

.product-flag--gradient.on-sale {
  background: linear-gradient(
    135deg,
    var(--adw-accent-light) 0%,
    var(--adw-accent-dark) 100%
  );
  color: var(--adw-text-dark);
}

.product-flag--gradient.out_of_stock {
  background: linear-gradient(
    135deg,
    var(--adw-secondary-light) 0%,
    var(--adw-secondary-dark) 100%
  );
  color: var(--adw-text-white);
}

.product-flag--gradient.discount {
  background: linear-gradient(135deg, #ff6b6b 0%, var(--adw-error) 100%);
  color: var(--adw-text-white);
}

/* ============================================
   FOOTER FEATURES - Section avantages
   ============================================ */
body#index .page-footer {
  display: none;
}

.footer-features {
  background-color: var(--adw-bg-light);
  padding: var(--adw-space-xl) 0;
  border-top: 1px solid var(--adw-border-light);
}

.footer-features__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--adw-space-lg);
}

@media (min-width: 768px) {
  .footer-features__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .footer-features__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.footer-feature {
  display: flex;
  align-items: center;
  gap: var(--adw-space-md);
}

.footer-feature__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--adw-primary-soft);
  color: var(--adw-primary);
  border-radius: 12px;
}

.footer-feature__content {
  flex: 1;
}

.footer-feature__title {
  margin: 0 0 var(--adw-space-xs) 0;
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
}

.footer-feature__text {
  margin: 0;
  font-size: var(--adw-font-sm);
  color: var(--adw-text-medium);
}

/* ============================================
   FOOTER CONTAINER
   ============================================ */

.footer-container {
  background-color: var(--adw-secondary);
  color: var(--adw-text-white);
  padding-top: var(--adw-space-xl);
}

.footer-container .adwcore-container {
  padding: 0 var(--adw-space-md);
  flex-direction: column;
}

/* ============================================
   NEWSLETTER
   ============================================ */

.footer-newsletter {
  padding: calc(var(--adw-space-xl) * 2) 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-newsletter__content {
  display: grid;
  gap: var(--adw-space-xl);
  align-items: center;
}

@media (min-width: 768px) {
  .footer-newsletter__content {
    grid-template-columns: 1fr 1.5fr;
  }
}

.footer-newsletter__title {
  margin: 0 0 var(--adw-space-sm) 0;
  font-size: var(--adw-font-xl);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-white);
}

.footer-newsletter__description {
  margin: 0;
  font-size: var(--adw-font-base);
  color: rgba(255, 255, 255, 0.7);
}

.footer-newsletter__input-group {
  display: flex;
  gap: var(--adw-space-sm);
  align-items: flex-start;
}

.footer-newsletter__input-group-row {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.footer-newsletter__input-group-conditions {
  margin-top: 1rem;
  max-width: 30rem;
}

.footer-newsletter__input-group-conditions p {
  font-size: var(--adw-font-xs);
  color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 767px) {
  .footer-newsletter__input-group {
    flex-direction: column;
  }
}

.footer-newsletter__input {
  flex: 1;
  padding: var(--adw-space-md) var(--adw-space-lg);
  font-size: var(--adw-font-base);
  color: var(--adw-text-dark);
  background-color: var(--adw-bg-white);
  border: 2px solid transparent;
  border-radius: var(--adw-buttons-radius-small);
  transition: all var(--adw-transition-normal);
}

.footer-newsletter__input:focus {
  outline: none;
  border-color: var(--adw-primary);
  box-shadow: 0 0 0 4px var(--adw-primary-soft);
}

.footer-newsletter__button {
  flex-shrink: 0;
}

@media (max-width: 767px) {
  .footer-newsletter__button {
    width: 100%;
  }
}

/* ============================================
   FOOTER MAIN - Colonnes de liens
   ============================================ */

.footer-main {
  padding: calc(var(--adw-space-xl) * 2) 0;
}

.footer-main__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--adw-space-xl);
}

@media (min-width: 768px) {
  .footer-main__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .footer-main__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.footer-column__title {
  margin: 0 0 var(--adw-space-lg) 0;
  font-size: var(--adw-font-md);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-white);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.footer-column__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--adw-space-sm);
}

.footer-column__list a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: var(--adw-font-base);
  transition: color var(--adw-transition-fast);
  display: inline-block;
}

.footer-column__list a:hover {
  color: var(--adw-primary-light);
  transform: translateX(4px);
}

/* Contact list avec icônes */
.footer-column__list--contact li {
  display: flex;
  align-items: flex-start;
  gap: var(--adw-space-sm);
}

.footer-column__list--contact svg {
  flex-shrink: 0;
  margin-top: 3px;
  color: var(--adw-primary);
}

/* ============================================
   FOOTER AFTER - Social + Payment
   ============================================ */

.footer-after {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--adw-space-xl);
  padding: var(--adw-space-xl) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

@media (max-width: 767px) {
  .footer-after {
    flex-direction: column;
    text-align: center;
  }
}

/* Social Media */
.footer-social__title,
.footer-payment__title {
  margin: 0 0 var(--adw-space-md) 0;
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-semibold);
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.footer-social__links {
  display: flex;
  gap: var(--adw-space-sm);
}

.footer-social__link {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--adw-text-white);
  border-radius: 50%;
  transition: all var(--adw-transition-normal);
  text-decoration: none;
}

.footer-social__link:hover {
  background-color: var(--adw-primary);
  transform: translateY(-2px);
}

/* Payment Methods */
.footer-payment__methods {
  display: flex;
  gap: var(--adw-space-sm);
  align-items: center;
}

.footer-payment__methods img {
  height: 32px;
  width: auto;
  opacity: 0.8;
  transition: opacity var(--adw-transition-fast);
}

.footer-payment__methods img:hover {
  opacity: 1;
}

/* ============================================
   FOOTER BOTTOM - Copyright
   ============================================ */

.footer-bottom {
  padding: var(--adw-space-lg) 0;
}

.footer-bottom__content {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--adw-space-md);
  flex-wrap: wrap;
}

@media (max-width: 767px) {
  .footer-bottom__content {
    flex-direction: column;
    text-align: center;
  }
}

.footer-bottom__copyright,
.footer-bottom__prestashop {
  margin: 0;
  font-size: var(--adw-font-sm);
  color: rgba(255, 255, 255, 0.5);
}

.footer-bottom__links {
  display: flex;
  gap: var(--adw-space-sm);
  align-items: center;
}

.footer-bottom__links a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: var(--adw-font-sm);
  transition: color var(--adw-transition-fast);
}

.footer-bottom__links a:hover {
  color: var(--adw-primary-light);
}

.footer-bottom__separator {
  color: rgba(255, 255, 255, 0.3);
}

.footer-bottom a {
  color: inherit;
  text-decoration: none;
  transition: color var(--adw-transition-fast);
}

.footer-bottom a:hover {
  color: var(--adw-primary-light);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 575px) {
  .footer-features {
    padding: var(--adw-space-lg) 0;
  }

  .footer-feature {
    gap: var(--adw-space-sm);
  }

  .footer-feature__icon {
    width: 40px;
    height: 40px;
  }

  .footer-newsletter {
    padding: var(--adw-space-xl) 0;
  }

  .footer-main {
    padding: var(--adw-space-xl) 0;
  }
}

/** LYCEE ****/

/* 5 colonnes sur grands écrans */
@media (min-width: 992px) {
  .col-lg-2-4,
  .col-xl-2-4 {
    flex: 0 0 20%;
    max-width: 20%;
  }
}

/* Responsive breakpoints */
/* Mobile: 2 colonnes */
/* Tablet (576px+): 3 colonnes */
/* Desktop (768px+): 4 colonnes */
/* Large (992px+): 5 colonnes */

/*** A outer un bouton avec une classe .btn-primary AJOUTER AU PANIER  sur les vignettes ***/

/* =============================================================================
   WRAPPER DU BOUTON
   ========================================================================== */
.product-add-to-cart-wrapper {
  position: absolute;
  bottom: 0px;
  right: 0px;
  z-index: 10;
  opacity: 1;
  /* transform: translateY(10px);
  transition: var(--btn-cart-transition); */
}

.product-add-to-cart-wrapper.has-variants {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-end;
}

/* Affichage au survol du produit */
.product-miniature:hover .product-add-to-cart-wrapper {
  /* opacity: 1;
  transform: translateY(0); */
}

.product-variations-count {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
  background-color: var(--adw-secondary);
  color: var(--adw-text-white);
  padding: 0.25rem 0.5rem;
  border-radius: var(--adw-buttons-radius-small);
  font-size: var(--adw-font-xs);
  font-weight: var(--adw-font-semibold);
  margin-top: 0px;
}

.product-miniature .thumbnail-container {
  position: relative;
  overflow: visible;
  margin-bottom: 0px;
}

.according-to-reference {
  font-size: var(--adw-font-md);
  color: var(--adw-primary);
  font-weight: var(--adw-font-norma);
  letter-spacing: -1px;
}

/* =============================================================================
   BOUTON ADD TO CART
   ========================================================================== */

.product-add-to-cart-wrapper.indisponible .btn-add-not-cart {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--btn-cart-size);
  height: var(--btn-cart-size);
  padding: 0;
  background-color: var(--btn-cart-bg-indisponible);
  border: none;
  border-radius: var(--btn-cart-border-radius) 0 0 0;
  cursor: pointer;
  transition: var(--btn-cart-transition);
  overflow: visible;
}

.product-add-to-cart-wrapper.indisponible .btn-add-not-cart i {
  margin-right: 0px;
}

.btn-add-to-cart {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--btn-cart-size);
  height: var(--btn-cart-size);
  padding: 0;
  background-color: var(--btn-cart-bg);
  border: none;
  /* border-radius: var(--btn-cart-border-radius); */
  border-radius: var(--btn-cart-border-radius) 0 0 0;
  cursor: pointer;
  transition: var(--btn-cart-transition);
  /* box-shadow: 0 4px 12px var(--btn-cart-shadow); */
  overflow: visible;
}

/* État hover */
.btn-add-to-cart:hover {
  background-color: var(--btn-cart-bg-hover);
  /* transform: scale(1.1) translateY(-2px);
  box-shadow: 0 6px 20px var(--btn-cart-shadow-hover); */
}

/* État focus (accessibilité) */
.btn-add-to-cart:focus {
  outline: 2px solid var(--btn-cart-bg);
  outline-offset: 3px;
}

/* État active (clic) */
.btn-add-to-cart:active {
  transform: scale(0.95);
  box-shadow: 0 2px 8px var(--btn-cart-shadow);
}

/* État disabled */
.btn-add-to-cart:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* =============================================================================
   ICÔNE SVG
   ========================================================================== */
.btn-add-to-cart .cart-icon {
  width: var(--btn-cart-icon-size);
  height: var(--btn-cart-icon-size);
  color: var(--btn-cart-color);
  stroke: currentColor;
  transition: var(--btn-cart-transition);
}

/* Animation de l'icône au hover */
.btn-add-to-cart:hover .cart-icon {
  transform: scale(1.1);
}

/* Animation de l'icône au clic */
.btn-add-to-cart:active .cart-icon {
  transform: scale(0.9);
}

/* =============================================================================
   TOOLTIP
   ========================================================================== */
.btn-tooltip {
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(10px);
  padding: 8px 12px;
  background-color: var(--tooltip-bg);
  color: var(--tooltip-color);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
 border-radius: var(--adw-buttons-radius-small);
  box-shadow: 0 4px 12px var(--tooltip-shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: var(--tooltip-transition);
  z-index: 100;
}

/* Flèche du tooltip */
.btn-tooltip::after {
  content: "";
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 6px;
  border-color: transparent transparent transparent var(--tooltip-bg);
}

/* Affichage du tooltip au hover */
.btn-add-to-cart:hover .btn-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

/* Affichage du tooltip au hover */
.btn-add-not-cart:hover .btn-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

/* =============================================================================
   ÉTATS DE CHARGEMENT
   ========================================================================== */
.btn-add-to-cart.is-loading {
  pointer-events: none;
}

.btn-add-to-cart.is-loading .cart-icon {
  animation: cartLoading 1s linear infinite;
}

@keyframes cartLoading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* =============================================================================
   ÉTAT DE SUCCÈS
   ========================================================================== */
.btn-add-to-cart.is-success {
  background-color: #111111;
  animation: successPulse 0.6s ease;
}

@keyframes successPulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
}

/* =============================================================================
   RESPONSIVE
   ========================================================================== */

/* Tablettes */
@media (max-width: 992px) {
  :root {
    --btn-cart-size: 4rem;
    --btn-cart-icon-size: 1rem;
  }

  /* .product-add-to-cart-wrapper {
    bottom: 10px;
    right: 10px;
  } */

  .btn-tooltip {
    font-size: 12px;
    padding: 6px 10px;
  }
}

/* Mobile */
@media (max-width: 576px) {
  /* Toujours visible sur mobile */
  /* .product-add-to-cart-wrapper {
    opacity: 1;
    transform: translateY(0);
  } */

  :root {
    --btn-cart-size: 4rem;
    --btn-cart-icon-size: 2rem;
  }

  /* .product-add-to-cart-wrapper {
    bottom: 8px;
    right: 8px;
  } */

  /* Tooltip caché sur mobile (remplacé par aria-label) */
  .btn-tooltip {
    display: none;
  }
}

/* =============================================================================
   VARIANTES DE POSITIONNEMENT
   ========================================================================== */

/* Variante: Bouton en haut à droite */
.product-add-to-cart-wrapper.position-top-right {
  top: 12px;
  bottom: auto;
  right: 12px;
}

/* Variante: Bouton en bas à gauche */
.product-add-to-cart-wrapper.position-bottom-left {
  bottom: 12px;
  right: auto;
  left: 12px;
}

.product-add-to-cart-wrapper.position-bottom-left .btn-tooltip {
  right: auto;
  left: calc(100% + 12px);
  transform: translateY(-50%) translateX(-10px);
}

.product-add-to-cart-wrapper.position-bottom-left .btn-tooltip::after {
  right: auto;
  left: -6px;
  border-width: 6px 6px 6px 0;
  border-color: transparent var(--tooltip-bg) transparent transparent;
}

.product-add-to-cart-wrapper.position-bottom-left
  .btn-add-to-cart:hover
  .btn-tooltip {
  transform: translateY(-50%) translateX(0);
}

/* =============================================================================
   VARIANTES DE STYLE
   ========================================================================== */

/* Variante: Bouton carré */
.btn-add-to-cart.style-square {
  border-radius: 8px;
}

/* Variante: Bouton secondaire */
.btn-add-to-cart.style-secondary {
  --btn-cart-bg: #4a4745;
  --btn-cart-bg-hover: #3a3937;
  --btn-cart-shadow: rgba(74, 71, 69, 0.3);
  --btn-cart-shadow-hover: rgba(74, 71, 69, 0.5);
}

/* Variante: Bouton avec bordure */
.btn-add-to-cart.style-outline {
  background-color: transparent;
  border: 2px solid var(--btn-cart-bg);
  box-shadow: none;
}

.btn-add-to-cart.style-outline .cart-icon {
  color: var(--btn-cart-bg);
}

.btn-add-to-cart.style-outline:hover {
  background-color: var(--btn-cart-bg);
}

.btn-add-to-cart.style-outline:hover .cart-icon {
  color: var(--btn-cart-color);
}

/* =============================================================================
   ACCESSIBILITÉ
   ========================================================================== */

/* Mode contraste élevé */
@media (prefers-contrast: high) {
  .btn-add-to-cart {
    border: 2px solid var(--btn-cart-color);
  }

  .btn-tooltip {
    border: 1px solid var(--btn-cart-color);
  }
}

/* Réduction des animations */
@media (prefers-reduced-motion: reduce) {
  .btn-add-to-cart,
  .btn-tooltip,
  .product-add-to-cart-wrapper,
  .cart-icon {
    transition: none;
    animation: none;
  }
}

/* Mode sombre */
@media (prefers-color-scheme: dark) {
  :root {
    --tooltip-bg: #1f1f1f;
    --tooltip-shadow: rgba(0, 0, 0, 0.5);
  }
}

/* ============================================
   PAGE CATEGORY
     - VIGNETTES PRODUITS
   ============================================ */

body:not(#index) .adwcore-wrapper {
  padding: var(--adw-space-lg) 0;
}

/* ============================================
   GRILLE DE PRODUITS - RESPONSIVE FLEX
   5 produits par ligne sur desktop
   ============================================ */

/* Container principal */
.adwcore-products.row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.5rem; /* Gestion des gutters */
  gap: 1rem 0; /* Gap vertical entre les lignes */
}

/* Reset des classes Bootstrap col-* */
.adwcore-products.row > .product {
  /* Reset toutes les classes col-* */
  flex: 0 0 auto;
  padding: 0 0.5rem; /* Gutter horizontal */
}

/* ============================================
   BREAKPOINTS RESPONSIVE
   ============================================ */

/* Mobile < 576px : 2 produits par ligne */
@media (max-width: 575px) {
  /* .adwcore-products.row > .product {
    width: 50%;
    flex-basis: 50%;
  } */

  .product-add-to-cart-wrapper.has-variants .btn-add-to-cart, 
  .product-add-to-cart-wrapper .btn-add-to-cart{
    width: 3rem;
    height: 3rem;
  }
}

/* Mobile 576-767px : 3 produits par ligne */
@media (min-width: 576px) and (max-width: 767px) {
  .adwcore-products.row > .product {
    width: 33.333333%;
    flex-basis: 33.333333%;
  }
}

/* Tablette 768-991px : 4 produits par ligne */
@media (min-width: 768px) and (max-width: 991px) {
  .adwcore-products.row > .product {
    width: 25%;
    flex-basis: 25%;
  }
}

/* Desktop 992-1199px : 5 produits par ligne */
@media (min-width: 992px) and (max-width: 1199px) {
  .adwcore-products.row > .product {
    width: 20%;
    flex-basis: 20%;
  }
}

/* Large Desktop ≥ 1200px : 5 produits par ligne */
@media (min-width: 1200px) {
  .adwcore-products.row > .product {
    width: 20%;
    flex-basis: 20%;
  }
}

/* Extra Large ≥ 1440px : Option 6 produits (décommentez si besoin) */
/*
@media (min-width: 1440px) {
    .adwcore-products.row > .product {
        width: 16.666667%;
        flex-basis: 16.666667%;
    }
}
*/

/* ============================================
   PRODUCT CARD - UNIFORMISATION
   ============================================ */

.adwcore-products.row .product-miniature {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e9e9e9;
  border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
  transition: all 0.3s ease;
}

.adwcore-products.row .product-miniature:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
  /* border-color: var(--adw-primary, #e6254f); */
}

.adwcore-products.row .thumbnail-container {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Image produit - Ratio 1:1 */
.adwcore-products.row .thumbnail-top {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #f5f5f5;
}

.adwcore-products.row .thumbnail-image-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.adwcore-products.row .thumbnail-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.adwcore-products.row .product-miniature:hover .thumbnail-image-wrapper img {
  transform: scale(1.08);
}

/* Description produit */
.adwcore-products.row .product-description {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 1rem;
  gap: 0.5rem;
}

.adwcore-products.row .product-title {
  font-size: 0.875rem;
  line-height: 1.4;
  margin: 0;
  flex: 1;
  min-height: 2.4em; /* Alignement des hauteurs */
}

.adwcore-products.row .product-title a {
  color: var(--adw-text-dark, #1a1a1a);
  text-decoration: none;
  display: flex;
  /* -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; */
  overflow: hidden;
  transition: color 0.2s ease;
  height: 6rem;
}

.adwcore-products.row .product-title a:hover {
  color: var(--adw-primary, #e6254f);
}

/* Prix */
.adwcore-products.row .product-price-and-shipping {
  margin-top: 0.5rem;
  font-weight: 600;
  color: var(--adw-primary, #e6254f);
}

.adwcore-products.row .price {
  font-size: 1.125rem;
}

/* Bouton ajouter au panier */
/* .adwcore-products.row .product-add-to-cart {
    margin-top: auto;
}

.adwcore-products.row .btn-add-to-cart {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: var(--adw-black, #1a1a1a);
    color: #fff;
    border: none;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.adwcore-products.row .btn-add-to-cart:hover {
    background: var(--adw-primary, #e6254f);
    transform: translateY(-2px);
} */

/* Flags produit (Nouveau, Promo, etc.) */
.adwcore-products.row .product-flags {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.adwcore-products.row .product-flag {
  /* padding: 0.25rem 0.5rem; */
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 0.25rem;
  color: #fff;
}

.adwcore-products.row .product-flag.new {
  background: var(--adw-primary, #e6254f);
}

.adwcore-products.row .product-flag.on-sale {
  background: #ff9800;
}

.adwcore-products.row .product-flag.out_of_stock {
  background: #999;
}

/* Compteur de variations */
/* .adwcore-products.row .product-variations-count {
    position: absolute;
    bottom: 0.5rem;
    right: 0.5rem;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
} */

/* @media (max-width: 1450px) {
    .adwcore-products.products .js-product.product {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (max-width: 1200px) {
    .adwcore-products.products .js-product.product {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        max-width: 33.33333%;
    }
}

@media (max-width: 993px) {
    .adwcore-products.products .js-product.product {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
} */

/* ============================================
   AJUSTEMENTS MOBILE
   ============================================ */

@media (max-width: 567px) {
    .adwcore-products.row {
        margin: 0;
        gap: 0.5rem 0;
        flex-direction: column;
    }

    .adwcore-products.row > .product, 
    .adwcore-products.products .js-product.product {
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0;
    }

    .adwcore-products.row .thumbnail-container {
        display: flex;
        flex-direction: row;
        align-items: stretch;
    }

    .adwcore-products.row .thumbnail-top {
        flex: 0 0 120px;
        width: 120px;
        min-height: 120px;
    }

    .adwcore-products.row .thumbnail-top .thumbnail {
        height: 100%;
    }

    .adwcore-products.row .thumbnail-top .thumbnail-image-wrapper {
        height: 100%;
    }

    .adwcore-products.row .thumbnail-top .thumbnail-image-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 10px 0 0 10px;
    }

    .adwcore-products.row .product-description {
        flex: 1;
        padding: 0.75rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 0.25rem;
    }

    .adwcore-products.row .product-title {
        font-size: 0.813rem;
        line-height: 1.3;
        margin: 0;
    }

    .adwcore-products.row .product-title a {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .adwcore-products.row .adwcore__product-price-and-shipping {
        margin: 0;
    }

    .adwcore-products.row .price {
        font-size: 1rem;
        font-weight: 700;
    }

    .adwcore-products.row .price-variable {
        font-size: 0.75rem;
    }

    /* Variations count — repositionner */
    .adwcore-products.row .product-variations-count {
        position: static;
        display: inline-block;
        font-size: 0.688rem;
        padding: 0.125rem 0.5rem;
        margin: 0;
        width: fit-content;
    }

    /* Flags — repositionner dans l'image */
    .adwcore-products.row .product-flags {
        position: absolute;
        top: 0.375rem;
        left: 0.375rem;
    }

    .adwcore-products.row .product-flags li {
        font-size: 0.625rem;
        padding: 0.125rem 0.375rem;
    }

    /* Bouton panier — compact à droite */
    .adwcore-products.row .product-add-to-cart {
        margin: 0;
    }

    .adwcore-products.row .product-add-to-cart-wrapper {
        display: flex;
    }

    .adwcore-products.row .btn-add-to-cart {
        padding: 0.5rem;
        font-size: 0.75rem;
    }

    /* Reviews masquer sur mobile list */
    .adwcore-products.row .product-list-reviews-adw {
        display: none;
    }
}

/* Très petit mobile */
@media (max-width: 375px) {
  .adwcore-products.row .product-title {
    font-size: 0.75rem;
    min-height: auto;
  }

  .adwcore-products.row .price {
    font-size: 0.9375rem;
  }
}

/* ============================================
   SOUS-CATÉGORIES - BLACKMARKET DESIGN
   Design moderne et responsive avec style BlackMarket
   ============================================ */

/* ============================================
   Variables CSS - BlackMarket Theme
   ============================================ */
/* :root {
    --adw-primary: #E6254F;
    --adw-primary-dark: #c41d3f;
    --adw-secondary: #4A4745;
    --adw-accent: #E3D8B0;
    --adw-black: #1a1a1a;
    --adw-gray-900: #2d2d2d;
    --adw-gray-100: #f5f5f5;
    --adw-white: #ffffff;
} */

/* ============================================
   Container Principal
   ============================================ */
.adwcore-subcategories#subcategories {
  background: var(--adw-white);
  border: none;
  border-radius: 0.375rem;
  /* padding: 2.5rem 2rem;
    margin: 2rem 0; */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* ============================================
   Titre Section
   ============================================ */
.adwcore-subcategories .subcategory-heading {
  font-size: 2rem;
  font-weight: 700;
  color: var(--adw-black);
  margin: 0 0 2rem 0;
  padding-bottom: 1rem;
  border-bottom: 3px solid var(--adw-primary);
  position: relative;
  letter-spacing: -0.02em;
}

.adwcore-subcategories .subcategory-heading::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 80px;
  height: 3px;
  background: var(--adw-accent);
}

/* ============================================
   Grille de Sous-catégories
   ============================================ */
.adwcore-subcategories .subcategories-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
}

/* Breakpoints Grid */
@media (min-width: 576px) {
  .adwcore-subcategories .subcategories-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}

@media (min-width: 992px) {
  .adwcore-subcategories .subcategories-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
}

@media (min-width: 1200px) {
  .adwcore-subcategories .subcategories-list {
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
  }
}

/* ============================================
   Card Sous-catégorie
   ============================================ */
.adwcore-subcategories .subcategories-list > li {
  background: var(--adw-white);
  border: 2px solid #e9e9e9;
  border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.adwcore-subcategories .subcategories-list > li:hover {
  border-color: var(--adw-primary);
  box-shadow: 0 8px 24px rgba(230, 37, 79, 0.15);
  transform: translateY(-4px);
}

/* ============================================
   Image Sous-catégorie
   ============================================ */
.adwcore-subcategories .subcategory-image {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--adw-gray-100);
  aspect-ratio: 4 / 3;
}

.adwcore-subcategories .subcategory-image a {
  display: block;
  width: 100%;
  height: 100%;
}

.adwcore-subcategories .subcategory-image picture {
  display: block;
  width: 100%;
  height: 100%;
}

.adwcore-subcategories .subcategory-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.adwcore-subcategories .subcategories-list > li:hover .subcategory-image img {
  transform: scale(1.08);
}

/* Overlay gradient sur l'image au hover */
.adwcore-subcategories .subcategory-image::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(26, 26, 26, 0) 50%,
    rgba(26, 26, 26, 0.3) 100%
  );
  opacity: 0;
  transition: opacity 0.3s ease;
}

.adwcore-subcategories
  .subcategories-list
  > li:hover
  .subcategory-image::after {
  opacity: 1;
}

/* ============================================
   Contenu Card
   ============================================ */
.adwcore-subcategories .subcategories-list > li h5 {
  margin: 0;
  padding: 1.25rem 1.25rem 0.75rem;
}

.adwcore-subcategories .subcategory-name {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--adw-black);
  text-decoration: none;
  display: block;
  transition: color 0.2s ease;
  line-height: 1.4;
}

.adwcore-subcategories .subcategory-name:hover {
  color: var(--adw-primary);
}

/* ============================================
   Description
   ============================================ */
.adwcore-subcategories .cat_desc {
  padding: 0 1.25rem 1.25rem;
  color: var(--adw-secondary);
  font-size: 0.875rem;
  line-height: 1.6;
  flex: 1;

  /* Limiter la hauteur de la description */
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.adwcore-subcategories .cat_desc p {
  margin: 0 0 0.5rem 0;
}

.adwcore-subcategories .cat_desc p:last-child {
  margin-bottom: 0;
}

/* Style pour le texte formaté */
.adwcore-subcategories .cat_desc .cf0,
.adwcore-subcategories .cat_desc .cf1 {
  color: inherit;
}

.adwcore-subcategories .cat_desc .cf1 {
  font-weight: 500;
}

/* ============================================
   Bouton "Voir plus" (optionnel)
   ============================================ */
.adwcore-subcategories .subcategory-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  margin: 0 1.25rem 1.25rem;
  background: var(--adw-black);
  color: var(--adw-white);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: var(--adw-buttons-radius-small);
  transition: all 0.3s ease;
}

.adwcore-subcategories .subcategory-cta:hover {
  background: var(--adw-primary);
  transform: translateX(4px);
}

.adwcore-subcategories .subcategory-cta svg {
  width: 16px;
  height: 16px;
  transition: transform 0.3s ease;
}

.adwcore-subcategories .subcategory-cta:hover svg {
  transform: translateX(4px);
}

/* ============================================
   Badge "Nouveau" (si catégorie récente)
   ============================================ */
.adwcore-subcategories .subcategory-badge {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 10;
  padding: 0.375rem 0.75rem;
  background: var(--adw-primary);
  color: var(--adw-white);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  border-radius: 0.375rem;
  letter-spacing: 0.05em;
  box-shadow: 0 2px 8px rgba(230, 37, 79, 0.3);
}

/* ============================================
   Responsive - Mobile
   ============================================ */
@media (max-width: 767px) {
  .adwcore-subcategories#subcategories {
    padding: 1.5rem 1rem;
    margin: 1rem 0;
    border-radius: var(--adw-buttons-radius-small);
  }

  .adwcore-subcategories .subcategory-heading {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .adwcore-subcategories .subcategories-list {
    gap: 1.25rem;
  }

  .adwcore-subcategories .subcategory-name {
    font-size: 1rem;
  }

  .adwcore-subcategories .cat_desc {
    font-size: 0.8125rem;
    -webkit-line-clamp: 3;
  }

  .adwcore-subcategories .subcategories-list > li h5 {
    padding: 1rem 1rem 0.5rem;
  }

  .adwcore-subcategories .cat_desc {
    padding: 0 1rem 1rem;
  }
}

/* Très petit mobile */
@media (max-width: 375px) {
  .adwcore-subcategories .subcategory-heading {
    font-size: 1.25rem;
  }

  .adwcore-subcategories .subcategory-name {
    font-size: 0.9375rem;
  }

  .adwcore-subcategories .cat_desc {
    -webkit-line-clamp: 2;
  }
}

/* ============================================
   Mode Sombre (optionnel)
   ============================================ */
@media (prefers-color-scheme: dark) {
  .adwcore-subcategories#subcategories {
    background: var(--adw-gray-900);
  }

  .adwcore-subcategories .subcategory-heading {
    color: var(--adw-white);
  }

  .adwcore-subcategories .subcategories-list > li {
    background: var(--adw-black);
    border-color: #333;
  }

  .adwcore-subcategories .subcategory-name {
    color: var(--adw-white);
  }

  .adwcore-subcategories .cat_desc {
    color: #aaa;
  }
}

/* ============================================
   Print Styles
   ============================================ */
@media print {
  .adwcore-subcategories .subcategories-list {
    display: block;
  }

  .adwcore-subcategories .subcategories-list > li {
    page-break-inside: avoid;
    margin-bottom: 1rem;
  }

  .adwcore-subcategories .subcategory-image::after {
    display: none;
  }
}

/* ============================================
   Animation d'entrée (optionnel)
   ============================================ */
@media (prefers-reduced-motion: no-preference) {
  .adwcore-subcategories .subcategories-list > li {
    animation: fadeInUp 0.5s ease-out backwards;
  }

  .adwcore-subcategories .subcategories-list > li:nth-child(1) {
    animation-delay: 0.1s;
  }
  .adwcore-subcategories .subcategories-list > li:nth-child(2) {
    animation-delay: 0.2s;
  }
  .adwcore-subcategories .subcategories-list > li:nth-child(3) {
    animation-delay: 0.3s;
  }
  .adwcore-subcategories .subcategories-list > li:nth-child(4) {
    animation-delay: 0.4s;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================
   États - Sans image
   ============================================ */
.adwcore-subcategories .subcategory-image:empty {
  background: linear-gradient(135deg, var(--adw-gray-100) 0%, #e0e0e0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.adwcore-subcategories .subcategory-image:empty::before {
  content: "📁";
  font-size: 3rem;
  opacity: 0.3;
}

/* ============================================
   Accessibilité
   ============================================ */
.adwcore-subcategories .subcategory-name:focus,
.adwcore-subcategories .subcategory-image a:focus {
  outline: 3px solid var(--adw-primary);
  outline-offset: 2px;
}

/* Respecter la préférence de mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  .adwcore-subcategories .subcategories-list > li,
  .adwcore-subcategories .subcategory-image img,
  .adwcore-subcategories .subcategory-name {
    transition: none;
    animation: none;
  }

  .adwcore-subcategories .subcategories-list > li:hover {
    transform: none;
  }

  .adwcore-subcategories .subcategories-list > li:hover .subcategory-image img {
    transform: none;
  }
}

/* ============================================
   PAGINATION - BLACKMARKET DESIGN
   Design moderne et responsive avec style BlackMarket
   ============================================ */

/* ============================================
   Variables CSS - BlackMarket Theme
   ============================================ */
/* :root {
    --adw-primary: #E6254F;
    --adw-primary-dark: #c41d3f;
    --adw-primary-light: #ff4d75;
    --adw-secondary: #4A4745;
    --adw-accent: #E3D8B0;
    --adw-black: #1a1a1a;
    --adw-gray-900: #2d2d2d;
    --adw-gray-700: #4d4d4d;
    --adw-gray-500: #808080;
    --adw-gray-300: #cccccc;
    --adw-gray-200: #e6e6e6;
    --adw-gray-100: #f5f5f5;
    --adw-white: #ffffff;
} */

/* ============================================
   Container Principal
   ============================================ */
.adwcore-pagination.pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 2rem 0;
  margin: 2rem 0 0 0;
  border-top: 1px solid var(--adw-gray-200);
}

/* Reset des colonnes Bootstrap */
.adwcore-pagination .col-md-4,
.adwcore-pagination .col-md-6 {
  width: auto;
  max-width: none;
  padding: 0;
  margin: 0;
  flex: 0 0 auto;
}

.adwcore-pagination .offset-md-2 {
  margin-left: 0;
}

/* ============================================
   Résumé Pagination (Affichage X-Y de Z)
   ============================================ */
.adwcore-pagination-summary {
  font-size: 0.9375rem;
  color: var(--adw-gray-700);
  font-weight: 500;
  white-space: nowrap;
}

/* ============================================
   Liste des Pages
   ============================================ */
.adwcore-pagination .page-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  background: transparent;
}

.adwcore-pagination .page-list li {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ============================================
   Liens et Boutons de Pagination
   ============================================ */
.adwcore-pagination .page-list a,
.adwcore-pagination .page-list .spacer {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 0.75rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--adw-gray-700);
  background: var(--adw-white);
  border: 2px solid var(--adw-gray-300);
  border-radius: var(--adw-buttons-radius-small);
  text-decoration: none;
  transition: all 0.2s ease;
  cursor: pointer;
}

/* Hover state */
.adwcore-pagination .page-list a:hover:not(.disabled) {
  color: var(--adw-primary);
  border-color: var(--adw-primary);
  background: var(--adw-gray-100);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(230, 37, 79, 0.15);
}

/* Active/Current page */
.adwcore-pagination .page-list li.current a,
.adwcore-pagination .page-list a.current {
  color: var(--adw-white);
  background: var(--adw-primary);
  border-color: var(--adw-primary);
  cursor: default;
  font-weight: 700;
}

.adwcore-pagination .page-list li.current a:hover {
  transform: none;
  box-shadow: none;
}

/* Disabled state */
.adwcore-pagination .page-list a.disabled {
  color: var(--adw-gray-300);
  border-color: var(--adw-gray-200);
  background: var(--adw-gray-100);
  cursor: not-allowed;
  pointer-events: none;
}

/* ============================================
   Boutons Previous/Next
   ============================================ */
.adwcore-pagination .page-list .previous,
.adwcore-pagination .page-list .next {
  gap: 0.375rem;
  padding: 0 1rem;
  font-weight: 600;
}

.adwcore-pagination .page-list .previous:hover:not(.disabled),
.adwcore-pagination .page-list .next:hover:not(.disabled) {
  background: var(--adw-primary);
  border-color: var(--adw-primary);
  color: var(--adw-white);
}

/* Icônes Material */
.adwcore-pagination .page-list .material-icons {
  font-size: 1.25rem;
  line-height: 1;
}

/* ============================================
   Spacer (...)
   ============================================ */
.adwcore-pagination .page-list .spacer {
  border: none;
  background: transparent;
  color: var(--adw-gray-500);
  cursor: default;
  pointer-events: none;
  font-weight: 700;
}

/* ============================================
   Responsive - Tablette
   ============================================ */
@media (max-width: 991px) {
  .adwcore-pagination.pagination {
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem 0;
  }

  .adwcore-pagination-summary {
    order: 2;
    text-align: center;
  }

  .adwcore-pagination .page-list {
    order: 1;
    justify-content: center;
  }
}

/* ============================================
   Responsive - Mobile
   ============================================ */
@media (max-width: 767px) {
  .adwcore-pagination.pagination {
    padding: 1.25rem 0;
    gap: 1rem;
  }

  .adwcore-pagination-summary {
    font-size: 0.875rem;
  }

  .adwcore-pagination .page-list {
    gap: 0.375rem;
  }

  .adwcore-pagination .page-list a,
  .adwcore-pagination .page-list .spacer {
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.625rem;
    font-size: 0.875rem;
  }

  /* Cacher le texte Previous/Next, garder seulement les icônes */
  .adwcore-pagination .page-list .previous,
  .adwcore-pagination .page-list .next {
    min-width: 2.25rem;
    padding: 0;
    font-size: 0;
  }

  .adwcore-pagination .page-list .material-icons {
    font-size: 1.125rem;
  }

  /* Limiter le nombre de pages visibles sur mobile */
  .adwcore-pagination
    .page-list
    li:not(.current):not(:has(.previous)):not(:has(.next)) {
    display: none;
  }

  /* Garder la page courante et ses voisines */
  .adwcore-pagination .page-list li.current,
  .adwcore-pagination .page-list li.current + li,
  .adwcore-pagination .page-list li.current + li + li {
    display: block;
  }
}

/* Très petit mobile */
@media (max-width: 375px) {
  .adwcore-pagination .page-list a {
    min-width: 2rem;
    height: 2rem;
    font-size: 0.8125rem;
  }

  .adwcore-pagination-summary {
    font-size: 0.8125rem;
  }
}

/* ============================================
   Variante - Pagination Compacte (optionnel)
   ============================================ */
.adwcore-pagination.compact {
  padding: 1rem 0;
}

.adwcore-pagination.compact .page-list a {
  min-width: 2rem;
  height: 2rem;
  font-size: 0.875rem;
}

/* ============================================
   Variante - Pagination Pills (optionnel)
   ============================================ */
.adwcore-pagination.pills .page-list a {
  border-radius: 2rem;
}

/* ============================================
   Variante - Pagination Sans Bordure (optionnel)
   ============================================ */
.adwcore-pagination.borderless .page-list a {
  border: none;
  background: var(--adw-gray-100);
}

.adwcore-pagination.borderless .page-list a:hover:not(.disabled) {
  background: var(--adw-gray-200);
}

.adwcore-pagination.borderless .page-list li.current a {
  background: var(--adw-primary);
}

/* ============================================
   Accessibilité
   ============================================ */
.adwcore-pagination .page-list a:focus-visible {
  outline: 3px solid var(--adw-primary);
  outline-offset: 2px;
}

/* Respecter la préférence de mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  .adwcore-pagination .page-list a {
    transition: none;
  }

  .adwcore-pagination .page-list a:hover:not(.disabled) {
    transform: none;
  }
}

/* ============================================
   Mode Sombre (optionnel)
   ============================================ */
@media (prefers-color-scheme: dark) {
  .adwcore-pagination.pagination {
    border-top-color: #333;
  }

  .adwcore-pagination-summary {
    color: #ccc;
  }

  .adwcore-pagination .page-list a {
    background: var(--adw-gray-900);
    color: #ccc;
    border-color: #444;
  }

  .adwcore-pagination .page-list a:hover:not(.disabled) {
    background: var(--adw-black);
    border-color: var(--adw-primary);
  }

  .adwcore-pagination .page-list a.disabled {
    background: #222;
    color: #555;
    border-color: #333;
  }
}

/* ============================================
   Print Styles
   ============================================ */
@media print {
  .adwcore-pagination.pagination {
    display: none;
  }
}

/* ============================================
   Animation d'Apparition (optionnel)
   ============================================ */
@media (prefers-reduced-motion: no-preference) {
  .adwcore-pagination .page-list li {
    animation: fadeIn 0.3s ease-out backwards;
  }

  .adwcore-pagination .page-list li:nth-child(1) {
    animation-delay: 0.05s;
  }
  .adwcore-pagination .page-list li:nth-child(2) {
    animation-delay: 0.1s;
  }
  .adwcore-pagination .page-list li:nth-child(3) {
    animation-delay: 0.15s;
  }
  .adwcore-pagination .page-list li:nth-child(4) {
    animation-delay: 0.2s;
  }
  .adwcore-pagination .page-list li:nth-child(5) {
    animation-delay: 0.25s;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================
   États Spéciaux
   ============================================ */

/* Première et dernière page */
.adwcore-pagination .page-list li:first-child a {
  font-weight: 600;
}

.adwcore-pagination .page-list li:last-child a {
  font-weight: 600;
}

/* Focus trap pour navigation clavier */
.adwcore-pagination .page-list a:focus {
  z-index: 10;
}

/* ============================================
   Scrollspy (optionnel - retour en haut)
   ============================================ */
.adwcore-pagination-scroll-top {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  background: var(--adw-primary);
  color: var(--adw-white);
  border-radius: 50%;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(230, 37, 79, 0.3);
}

.adwcore-pagination-scroll-top:hover {
  background: var(--adw-primary-dark);
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(230, 37, 79, 0.4);
}

.adwcore-pagination-scroll-top .material-icons {
  font-size: 1.5rem;
}

/* Position sticky pour pagination en haut */
.adwcore-pagination.sticky-top {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--adw-white);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  padding: 1rem 0;
}

/* ============================================
   SIDEBAR STICKY - BLACKMARKET DESIGN
   Sidebar collante avec comportement responsive intelligent
   ============================================ */

/* ============================================
   Variables CSS - BlackMarket Theme
   ============================================ */
:root {
  --adw-primary: #e6254f;
  --adw-primary-dark: #c41d3f;
  --adw-secondary: #4a4745;
  --adw-accent: #e3d8b0;
  --adw-black: #1a1a1a;
  --adw-gray-900: #2d2d2d;
  --adw-gray-700: #4d4d4d;
  --adw-gray-600: #666666;
  --adw-gray-500: #808080;
  --adw-gray-300: #cccccc;
  --adw-gray-200: #e6e6e6;
  --adw-gray-100: #f5f5f5;
  --adw-white: #ffffff;
}

/* ============================================
   Container Principal - Sticky Sidebar
   ============================================ */
.adwcore-sidebar-sticky#left-column {
  /* Desktop uniquement : sticky */
  position: sticky;
  top: 90px; /* Hauteur du header + marge */
  height: fit-content;
  max-height: calc(100vh - 110px); /* Viewport height - top - bottom margin */
  overflow-y: auto;
  overflow-x: hidden;

  /* Scrollbar personnalisée */
  scrollbar-width: thin;
  scrollbar-color: var(--adw-gray-300) transparent;
}

/* Scrollbar WebKit (Chrome, Safari) */
.adwcore-sidebar-sticky#left-column::-webkit-scrollbar {
  width: 6px;
}

.adwcore-sidebar-sticky#left-column::-webkit-scrollbar-track {
  background: transparent;
}

.adwcore-sidebar-sticky#left-column::-webkit-scrollbar-thumb {
  background: var(--adw-gray-300);
  border-radius: 3px;
}

.adwcore-sidebar-sticky#left-column::-webkit-scrollbar-thumb:hover {
  background: var(--adw-gray-500);
}

/* ============================================
   Block Categories - Design Moderne
   ============================================ */
.adwcore-sidebar-sticky .block-categories {
  background: var(--adw-white);
  border-radius: var(--adw-buttons-radius-small);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid var(--adw-gray-200);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* ============================================
   CATEGORY HEADER - Layout Image 1/3 + Content 2/3
   L'image s'adapte à la hauteur du contenu
   ============================================ */

#js-product-list-header .block-category {
  border-radius: var(--adw-buttons-radius-small);
  background: var(--adw-white);
  border: 1px solid var(--adw-gray-200);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  margin-bottom: 2rem;
  padding: 1.25rem 1.25rem;
}

/* Layout Grid - Image 1/3 + Contenu 2/3 */
.block-category-inner {
  display: grid !important;
  grid-template-columns: 1fr 2fr;
  gap: 2rem;
  align-items: stretch; /* Important: permet à l'image de prendre toute la hauteur */
}

/* Image de catégorie - Prend 100% de la hauteur disponible */
.category-cover {
  /* position: relative; */
  /* width: 100%; */
  /* Prend toute la hauteur du conteneur */
  /* height: 100%;  */
  min-height: 330px; /* Hauteur minimale */
  overflow: hidden;
  border-radius: var(--adw-buttons-radius-small);
  background: var(--adw-gray-100);
}

.category-cover picture {
  display: block;
  width: 100%;
  height: 100%;
}

.category-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover; /* L'image remplit tout l'espace */
  object-position: center;
  transition: transform 0.3s ease;
}

/* Effet hover sur l'image */
.category-cover:hover img {
  transform: scale(1.05);
}

/* Contenu de la catégorie */
.category-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
  padding-left: 0;
  justify-content: center;
}

/* Si pas de description, centrer le titre */
.category-content:not(:has(.category-description)) {
  justify-content: center;
}

/* Titre de la catégorie */
.category-title {
  font-size: 2rem;
  font-weight: 700;
  color: var(--adw-secondary);
  margin: 0;
  line-height: 1.2;
  font-family: "Roboto", sans-serif;
}

/* Titre plus grand quand pas de description */
.category-content:not(:has(.category-description)) .category-title {
  font-size: 2.5rem;
}

/* Description de la catégorie */
.category-description {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--adw-text-color);
  margin: 0;
}

.category-description p {
  margin: 0 0 1rem 0;
}

.category-description p:last-child {
  margin-bottom: 0;
}

/* Style pour les spans de couleur (cf0) */
.category-description .cf0 {
  display: block;
}

/* ============================================
   RESPONSIVE - Layout 1/3 + 2/3 maintenu jusqu'à 768px
   ============================================ */

/* Tablette moyenne - GARDE le layout horizontal */
@media (max-width: 991px) {
  .block-category-inner {
    grid-template-columns: 1fr 2fr;
    gap: 1.5rem;
  }

  .category-cover {
    min-height: 180px;
  }

  .category-content {
    padding: 1rem;
    padding-left: 0;
  }

  .category-title {
    font-size: 1.75rem;
  }

  .category-content:not(:has(.category-description)) .category-title {
    font-size: 2rem;
  }

  .category-description {
    font-size: 0.95rem;
  }
}

/* Tablette petite - TOUJOURS en layout horizontal */
@media (max-width: 767px) and (min-width: 577px) {
  .block-category-inner {
    grid-template-columns: 1fr 2fr;
    gap: 1.25rem;
  }

  .category-cover {
    min-height: 160px;
  }

  .category-content {
    padding: 0.75rem;
    padding-left: 0;
  }

  .category-title {
    font-size: 1.5rem;
  }

  .category-content:not(:has(.category-description)) .category-title {
    font-size: 1.75rem;
  }

  .category-description {
    font-size: 0.9rem;
    line-height: 1.5;
  }
}

/* Mobile - SEULEMENT ICI on passe en vertical (< 576px) */
@media (max-width: 576px) {
  #js-product-list-header .block-category {
    margin-bottom: 1.5rem;
  }

  .block-category-inner {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .category-cover {
    height: auto;
    aspect-ratio: 4 / 3;
    max-height: 220px;
    min-height: auto;
  }

  .category-content {
    padding: 0.75rem;
    padding-top: 0;
  }

  .category-title {
    font-size: 1.5rem;
  }

  .category-content:not(:has(.category-description)) .category-title {
    font-size: 1.75rem;
    text-align: center;
  }

  .category-description {
    font-size: 0.875rem;
    line-height: 1.5;
  }
}

/* ============================================
   CAS SPÉCIFIQUES
   ============================================ */

/* Si pas d'image du tout - pleine largeur pour le contenu */
.block-category-inner:not(:has(.category-cover)) {
  grid-template-columns: 1fr;
  padding: 2rem;
}

.block-category-inner:not(:has(.category-cover)) .category-content {
  padding: 0;
  max-width: 800px;
}

/* Si pas de contenu du tout - image avec ratio fixe */
.block-category-inner:not(:has(.category-content)) {
  grid-template-columns: 1fr;
  place-items: center;
  padding: 2rem;
}

.block-category-inner:not(:has(.category-content)) .category-cover {
  max-width: 400px;
  margin: 0 auto;
  aspect-ratio: 1 / 1;
  height: auto;
}

/* ============================================
   SIDEBAR CATEGORIES (existant - inchangé)
   ============================================ */

.adwcore-sidebar-sticky .block-categories {
  background: var(--adw-white);
  border-radius: var(--adw-buttons-radius-small);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid var(--adw-gray-200);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* ============================================
   AMÉLIORATIONS VISUELLES
   ============================================ */

/* Animation au chargement */
@media (prefers-reduced-motion: no-preference) {
  .block-category-inner {
    animation: fadeInUp 0.6s ease;
  }

  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}
/* ============================================
   Menu Catégories - Structure
   ============================================ */
.adwcore-sidebar-sticky .category-top-menu,
.adwcore-sidebar-sticky .category-sub-menu {
  list-style: none;
  padding: 0;
  margin: 0;
  padding-top: 0.5rem;
}

.adwcore-sidebar-sticky .category-top-menu > li:first-child {
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--adw-primary);
}

/* Lien Accueil */
.adwcore-sidebar-sticky .category-top-menu > li:first-child a {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--adw-black);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: color 0.2s ease;
}

.adwcore-sidebar-sticky .category-top-menu > li:first-child a:hover {
  color: var(--adw-primary);
}

/* ============================================
   Catégories Niveau 0 (Principal)
   ============================================ */
.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="0"] {
  margin-bottom: 0.5rem;
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="0"] > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--adw-gray-900);
  background: var(--adw-gray-100);
  border-radius: var(--adw-buttons-radius-small);
  text-decoration: none;
  transition: all 0.2s ease;
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="0"] > a:hover {
  background: var(--adw-primary);
  color: var(--adw-white);
}

/* Icône Toggle (+ / -) */
.adwcore-sidebar-sticky .navbar-toggler.collapse-icons {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  margin-left: 0.5rem;
  top: 0.754rem;
}

.adwcore-sidebar-sticky .navbar-toggler .material-icons {
  font-size: 1.25rem;
  color: var(--adw-gray-600);
  transition: transform 0.3s ease;
}

.adwcore-sidebar-sticky .navbar-toggler .material-icons.add {
  display: block;
}

.adwcore-sidebar-sticky .navbar-toggler .material-icons.remove {
  display: none;
}

/* État ouvert */
.adwcore-sidebar-sticky
  .navbar-toggler[aria-expanded="true"]
  .material-icons.add {
  display: none;
}

.adwcore-sidebar-sticky
  .navbar-toggler[aria-expanded="true"]
  .material-icons.remove {
  display: block;
  transform: rotate(180deg);
}

/* ============================================
   Catégories Niveau 1 (Sous-catégories)
   ============================================ */
.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"] {
  margin-left: 0.75rem;
  border-left: 2px solid var(--adw-gray-200);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"]:hover {
  color: var(--adw-primary);
  border-left-color: var(--adw-primary);
  background: var(--adw-gray-100);
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"] > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0.875rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--adw-gray-700);
  text-decoration: none;
  transition: all 0.2s ease;
  border-left: 3px solid transparent;
  margin-left: -2px;
  width: 100%;
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"] > a:hover {
  color: var(--adw-primary);
  border-left-color: var(--adw-primary);
  background: var(--adw-gray-100);
}

/* Flèches dépliables (niveau 1) */
.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"] .arrows {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  cursor: pointer;
}

.adwcore-sidebar-sticky .arrows .material-icons {
  font-size: 1rem;
  color: var(--adw-gray-500);
  transition: transform 0.3s ease;
}

.adwcore-sidebar-sticky .arrows .arrow-right {
  display: block;
}

.adwcore-sidebar-sticky .arrows .arrow-down {
  display: none;
}

/* État ouvert (niveau 1) */
.adwcore-sidebar-sticky .arrows[aria-expanded="true"] .arrow-right {
  display: none;
}

.adwcore-sidebar-sticky .arrows[aria-expanded="true"] .arrow-down {
  display: block;
}

/* ============================================
   Catégories Niveau 2
   ============================================ */
.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="2"] {
  margin-left: 1.5rem;
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="2"] > a {
  display: block;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--adw-gray-600);
  text-decoration: none;
  transition: all 0.2s ease;
  border-radius: 0.375rem;
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="2"] > a:hover {
  color: var(--adw-primary);
  background: var(--adw-gray-100);
  padding-left: 1rem;
}

/* ============================================
   Collapse Animations
   ============================================ */
/* .adwcore-sidebar-sticky .collapse {
    transition: height 0.3s ease-out;
}

.adwcore-sidebar-sticky .collapse:not(.show) {
    display: none;
}

.adwcore-sidebar-sticky .collapsing {
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease;
} */

/* ============================================
   Search Filters - Design
   ============================================ */
.adwcore-sidebar-sticky #search_filters_wrapper,
.adwcore-sidebar-sticky #search_filters_suppliers,
.adwcore-sidebar-sticky #search_filters_brands {
  background: var(--adw-white);
  border-radius: var(--adw-buttons-radius-small);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid var(--adw-gray-200);
}

/* .adwcore-sidebar-sticky .facet-label, */
.adwcore-sidebar-sticky .facet .h6 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--adw-black);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem !important;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--adw-primary);
}

.adwcore-sidebar-sticky .facet ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.adwcore-sidebar-sticky .facet ul li {
  margin-bottom: 0.5rem;
}

.adwcore-sidebar-sticky .facet ul li a {
  display: block;
  padding: 0.5rem 0.75rem;
  font-size: 0.9375rem;
  color: var(--adw-gray-700);
  text-decoration: none;
  border-radius: 0.375rem;
  transition: all 0.2s ease;
}

.adwcore-sidebar-sticky .facet ul li a:hover {
  color: var(--adw-primary);
  background: var(--adw-gray-100);
  padding-left: 1rem;
}

#search_filters .facet .facet-label .custom-checkbox,
#search_filters .facet .facet-label .custom-radio {
  top: 0px;
  margin-right: 0;
}
#search_filters .facet .facet-label a,
#search_filters_brands .facet .facet-label a,
#search_filters_suppliers .facet .facet-label a {
  margin-top: 0px;
}

.facet-label {
  display: flex;
  align-items: center;
}

/* ============================================
   Responsive - Tablette
   ============================================ */
@media (max-width: 991px) {
  .adwcore-sidebar-sticky#left-column {
    position: relative;
    top: 0;
    max-height: none;
    overflow-y: visible;
    margin-bottom: 2rem;
  }

  .adwcore-sidebar-sticky .block-categories {
    padding: 1.25rem;
  }
}

/* ============================================
   Responsive - Mobile
   ============================================ */
@media (max-width: 767px) {
  .adwcore-sidebar-sticky#left-column {
    /* Option 1: Cacher complètement sur mobile */
    /* display: none; */

    /* Option 2: Accordion mobile */
    margin-bottom: 1.5rem;
  }

  .adwcore-sidebar-sticky .block-categories {
    padding: 1rem;
    margin-bottom: 1rem;
  }

  .adwcore-sidebar-sticky .category-top-menu > li:first-child a {
    font-size: 1rem;
  }

  .adwcore-sidebar-sticky .category-sub-menu > li[data-depth="0"] > a {
    padding: 0.625rem 0.875rem;
    font-size: 0.9375rem;
  }

  .adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"] > a {
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
  }

  .adwcore-sidebar-sticky .category-sub-menu > li[data-depth="2"] > a {
    font-size: 0.8125rem;
    padding: 0.5rem 0.625rem;
  }
}

/* ============================================
   Variante : Sidebar Mobile Offcanvas (Optionnel)
   ============================================ */
@media (max-width: 767px) {
  /* Décommentez pour activer le mode offcanvas mobile */
  /*
    .adwcore-sidebar-sticky#left-column {
        position: fixed;
        top: 0;
        left: -100%;
        width: 85%;
        max-width: 320px;
        height: 100vh;
        background: var(--adw-white);
        z-index: 9999;
        overflow-y: auto;
        transition: left 0.3s ease;
        box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
    }
    
    .adwcore-sidebar-sticky#left-column.open {
        left: 0;
    }
    
    .sidebar-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9998;
    }
    
    .sidebar-overlay.active {
        display: block;
    }
    */
}

/* ============================================
   Améliorations Visuelles
   ============================================ */

/* Badge "Nouveau" ou compteur de produits (optionnel) */
.adwcore-sidebar-sticky .category-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--adw-white);
  background: var(--adw-primary);
  border-radius: var(--adw-buttons-radius-small);
  margin-left: auto;
}

/* Séparateurs entre sections */
.adwcore-sidebar-sticky .block-categories + div,
.adwcore-sidebar-sticky #search_filters_wrapper + div {
  margin-top: 1.5rem;
}

/* État actif d'une catégorie */
.adwcore-sidebar-sticky .category-sub-menu > li.active > a,
.adwcore-sidebar-sticky .category-sub-menu > li[aria-current="page"] > a {
  color: var(--adw-primary);
  font-weight: 700;
  background: rgba(230, 37, 79, 0.1);
}

.adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"].active > a {
  border-left-color: var(--adw-primary);
}

/* ============================================
   Accessibilité
   ============================================ */
.adwcore-sidebar-sticky .category-sub-menu a:focus-visible,
.adwcore-sidebar-sticky .navbar-toggler:focus-visible,
.adwcore-sidebar-sticky .arrows:focus-visible {
  outline: 3px solid var(--adw-primary);
  outline-offset: 2px;
}

/* Respecter la préférence de mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  .adwcore-sidebar-sticky .category-sub-menu a,
  .adwcore-sidebar-sticky .navbar-toggler .material-icons,
  .adwcore-sidebar-sticky .arrows .material-icons,
  .adwcore-sidebar-sticky .collapse {
    transition: none;
  }
}

/* ============================================
   Mode Sombre (optionnel)
   ============================================ */
@media (prefers-color-scheme: dark) {
  .adwcore-sidebar-sticky .block-categories,
  .adwcore-sidebar-sticky #search_filters_wrapper,
  .adwcore-sidebar-sticky #search_filters_suppliers,
  .adwcore-sidebar-sticky #search_filters_brands {
    background: var(--adw-gray-900);
    border-color: #333;
  }

  .adwcore-sidebar-sticky .category-top-menu > li:first-child a,
  .adwcore-sidebar-sticky .facet-label,
  .adwcore-sidebar-sticky .facet .h6 {
    color: var(--adw-white);
  }

  .adwcore-sidebar-sticky .category-sub-menu > li[data-depth="0"] > a {
    background: var(--adw-black);
    color: #ccc;
  }

  .adwcore-sidebar-sticky .category-sub-menu > li[data-depth="1"] > a {
    color: #aaa;
  }

  .adwcore-sidebar-sticky .category-sub-menu > li[data-depth="2"] > a {
    color: #888;
  }
}

/* ============================================
   Print Styles
   ============================================ */
@media print {
  .adwcore-sidebar-sticky#left-column {
    display: none;
  }
}

/* ============================================
   Animation Fade In (optionnel)
   ============================================ */
@media (prefers-reduced-motion: no-preference) {
  .adwcore-sidebar-sticky .block-categories,
  .adwcore-sidebar-sticky #search_filters_wrapper,
  .adwcore-sidebar-sticky #search_filters_suppliers,
  .adwcore-sidebar-sticky #search_filters_brands {
    animation: fadeInLeft 0.4s ease-out backwards;
  }

  .adwcore-sidebar-sticky .block-categories {
    animation-delay: 0.1s;
  }

  .adwcore-sidebar-sticky #search_filters_wrapper {
    animation-delay: 0.2s;
  }

  .adwcore-sidebar-sticky #search_filters_brands {
    animation-delay: 0.3s;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ============================================
   PAGE PRODUIT - BLACKMARKET DESIGN
   Design moderne et responsive avec style BlackMarket
   Sélecteur : body#product (fiche produit uniquement)
   ============================================ */

/* ============================================
   CONTAINER PRINCIPAL
   ============================================ */

body#product #main {
  /* background: var(--adw-bg-light);
  padding: var(--adw-space-xl) 0; */
}

body#product .product-container {
  background: var(--adw-bg-white);
  /* border-radius: var(--adw-buttons-radius-small); */
  padding: var(--adw-space-xl);
  margin-bottom: var(--adw-space-xl);
  /* box-shadow: var(--adw-shadow-md); */
}

@media (min-width: 768px) {
  body#product .product-container {
    /* padding: calc(var(--adw-space-xl) * 1.5); */
    padding: 0px;
  }
}

/* ============================================
   LAYOUT 2 COLONNES - IMAGES + INFOS
   ============================================ */

body#product .product-container.row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--adw-space-xl);
  margin: 0;
}

@media (min-width: 768px) {
  body#product .product-container.row {
    grid-template-columns: 1fr 1fr;
    /* gap: calc(var(--adw-space-xl) * 2); */
    gap: 0;
  }
}

@media (min-width: 1024px) {
  body#product .product-container.row {
    /* grid-template-columns: 55% 45%; */
  }
}

/* Reset des colonnes Bootstrap */
body#product .product-container .col-md-6 {
  width: 100%;
  padding: 0;
  max-width: none;
}

/* ============================================
   SECTION IMAGES - GALERIE PRODUIT
   ============================================ */

body#product .page-content {
  position: relative;
}

/* Product Flags */
body#product .product-flags {
  position: absolute;
  top: var(--adw-space-md);
  left: var(--adw-space-md);
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: var(--adw-space-xs);
}

/* body#product .product-flag {
  padding: var(--adw-space-sm) var(--adw-space-md);
  font-size: var(--adw-font-xs);
  font-weight: var(--adw-font-bold);
  text-transform: uppercase;
  border-radius: var(--adw-buttons-radius-small);
  backdrop-filter: blur(8px);
  box-shadow: var(--adw-shadow-md);
} */

/* Image principale */
/**
 * Product Images Splide.js - Styles
 * BlackMarket Theme - ADW Development
 */

/* ==============================================
   VARIABLES CSS
   ============================================== */
:root {
  --splide-primary: #e6254f;
  --splide-secondary: #4a4745;
  --splide-accent: #e3d8b0;
  --splide-border: #e0e0e0;
  --splide-bg: #ffffff;
  --splide-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  --splide-radius: 8px;
  --splide-transition: all 0.3s ease;
}

/* ==============================================
   CONTENEUR PRINCIPAL
   ============================================== */
.product-images-splide {
  position: relative;
  width: 100%;
}

/* ==============================================
   SLIDER PRINCIPAL (Grande image)
   ============================================== */
.product-main-slider {
  margin-bottom: 15px;
  background: var(--splide-bg);
  border-radius: var(--splide-radius);
  overflow: hidden;
}

.product-main-slider .splide__track {
  border-radius: var(--splide-radius);
}

.product-main-slider .splide__slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-main-slider .product-image-figure {
  /* position: relative;
  margin: 0;
  padding: 0;
  background: var(--splide-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 300px; */
}

.product-main-slider .product-image-figure img {
  /* max-width: 100%;*/
  max-height: 800px; 
  /* width: auto;
  height: auto; */
  object-fit: contain;
  transition: var(--splide-transition);
}

/* Lazy loading states */
.product-main-slider .lazyload,
.product-thumbs-slider .lazyload {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.product-main-slider .lazyloaded,
.product-thumbs-slider .lazyloaded,
.product-main-slider img[data-splide-lazy-loaded],
.product-thumbs-slider img[data-splide-lazy-loaded] {
  opacity: 1;
}

/* Skeleton loading effect */
.product-main-slider .splide__slide:not(.is-active) .lazyload:not(.lazyloaded) {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

/* Splide spinner override */
.product-main-slider .splide__spinner {
  border-color: var(--splide-primary);
  border-left-color: transparent;
}

/* ==============================================
   BOUTON ZOOM
   ============================================== */
.zoom-layer {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 44px;
  height: 44px;
  background: var(--splide-bg);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: var(--splide-shadow);
  transition: var(--splide-transition);
  opacity: 0;
  transform: scale(0.8);
  z-index: 10;
}

.product-main-slider:hover .zoom-layer,
.product-main-slider .splide__slide.is-active:hover .zoom-layer {
  opacity: 1;
  transform: scale(1);
}

.zoom-layer:hover {
  background: var(--splide-primary);
  color: white;
  transform: scale(1.1);
}

.zoom-layer .material-icons {
  font-size: 22px;
}

.zoom-layer .zoom-label {
  display: none;
}

/* ==============================================
   COMPTEUR D'IMAGES (Mobile)
   ============================================== */
.splide-counter {
  text-align: center;
  margin-top: 10px;
  font-size: 14px;
  color: var(--splide-secondary);
  font-weight: 500;
}

.splide-counter .current {
  color: var(--splide-primary);
  font-weight: 600;
}

/* ==============================================
   SLIDER THUMBNAILS
   ============================================== */
.product-thumbs-slider {
  padding: 0 45px;
  position: relative;
}

.product-thumbs-slider .splide__track {
  padding: 5px 0;
}

.product-thumbs-slider .splide__slide {
  cursor: pointer;
 border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
  border: 2px solid transparent;
  transition: var(--splide-transition);
  background: var(--splide-bg);
  opacity: 0.7;
}

.product-thumbs-slider .splide__slide:hover {
  border-color: var(--splide-secondary);
  opacity: 1;
}

.product-thumbs-slider .splide__slide.is-active {
  border-color: var(--splide-primary);
  /* box-shadow: 0 0 0 1px var(--splide-primary); */
  opacity: 1;
}

.product-thumbs-slider .splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: var(--splide-transition);
}

.product-thumbs-slider .splide__slide:hover img {
  transform: scale(1.05);
}

#product-modal .modal-content .modal-body {
  margin-left: 0px;
}

#product-modal .modal-content .modal-body #modal-slider {
  width: 100%;
}

/* ==============================================
   FLÈCHES THUMBNAILS
   ============================================== */
.product-thumbs-slider .splide__arrows {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

.product-thumbs-slider .splide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: var(--splide-bg);
  border: 1px solid var(--splide-border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: var(--splide-transition);
  pointer-events: auto;
  opacity: 1;
}

.product-thumbs-slider .splide__arrow:hover {
  background: var(--splide-primary);
  border-color: var(--splide-primary);
}

.product-thumbs-slider .splide__arrow:hover svg {
  fill: white;
}

.product-thumbs-slider .splide__arrow svg {
  width: 18px;
  height: 18px;
  fill: var(--splide-secondary);
  transition: var(--splide-transition);
}

.product-thumbs-slider .splide__arrow--prev {
  left: 0;
}

.product-thumbs-slider .splide__arrow--next {
  right: 0;
}

.product-thumbs-slider .splide__arrow:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.product-thumbs-slider .splide__arrow:disabled:hover {
  background: var(--splide-bg);
  border-color: var(--splide-border);
}

.product-thumbs-slider .splide__arrow:disabled:hover svg {
  fill: var(--splide-secondary);
}

/* ==============================================
   PAGINATION (Mobile)
   ============================================== */
.product-main-slider .splide__pagination {
  bottom: 15px;
  padding: 0;
  gap: 8px;
}

.product-main-slider .splide__pagination__page {
  width: 8px;
  height: 8px;
  background: rgba(255, 255, 255, 0.6);
  border: none;
  margin: 0;
  transition: var(--splide-transition);
}

.product-main-slider .splide__pagination__page.is-active {
  background: var(--splide-primary);
  transform: scale(1.3);
}

/* ==============================================
   MODAL ZOOM
   ============================================== */
#product-modal .modal-dialog {
  max-width: 900px;
}

#product-modal .modal-content {
  background: var(--splide-bg);
  border: none;
  border-radius: var(--splide-radius);
}

#product-modal .modal-header {
  border: none;
  padding: 10px 15px;
}

#product-modal .modal-body {
  padding: 0 20px 20px;
}

#product-modal .close {
  font-size: 28px;
  opacity: 0.7;
}

#product-modal .close:hover {
  opacity: 1;
}

/* Modal Main Slider */
.product-modal-slider {
  margin-bottom: 15px;
}

.product-modal-slider .splide__slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-modal-slider .splide__slide img {
  max-width: 100%;
  max-height: 60vh;
  object-fit: contain;
}

.product-modal-slider .splide__arrow {
  width: 48px;
  height: 48px;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  opacity: 1;
}

.product-modal-slider .splide__arrow:hover {
  background: var(--splide-primary);
}

.product-modal-slider .splide__arrow:hover svg {
  fill: white;
}

.product-modal-slider .splide__arrow svg {
  width: 24px;
  height: 24px;
}

/* Modal Thumbnails */
.product-modal-thumbs {
  padding: 0 20px;
}

.product-modal-thumbs .splide__slide {
  cursor: pointer;
  border-radius: 4px;
  overflow: hidden;
  border: 2px solid transparent;
  transition: var(--splide-transition);
  opacity: 0.6;
}

.product-modal-thumbs .splide__slide.is-active {
  border-color: var(--splide-primary);
  opacity: 1;
}

.product-modal-thumbs .splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ==============================================
   RESPONSIVE
   ============================================== */

/* Tablette */
@media (max-width: 992px) {
  .product-main-slider .product-image-figure img {
    max-height: 400px;
  }

  .product-thumbs-slider {
    padding: 0 40px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .product-main-slider .product-image-figure {
    min-height: 250px;
  }

  .product-main-slider .product-image-figure img {
    max-height: 350px;
  }

  .zoom-layer {
    opacity: 1;
    transform: scale(1);
    width: 40px;
    height: 40px;
  }

  .product-thumbs-slider {
    padding: 0 10px;
  }

  .product-thumbs-slider .splide__arrow {
    display: none;
  }

  #product-modal .modal-dialog {
    margin: 10px;
    max-width: calc(100% - 20px);
  }

  .product-modal-slider .splide__slide img {
    max-height: 50vh;
  }
}

/* Très petit écran */
@media (max-width: 576px) {
  .product-main-slider .product-image-figure {
    min-height: 200px;
  }

  .product-main-slider .product-image-figure img {
    max-height: 280px;
  }

  .product-thumbs-slider .splide__slide {
    border-width: 1px;
  }

  .splide-counter {
    margin-top: 5px;
    font-size: 13px;
  }

  .product-thumbs-slider {
    padding: 0 5px;
  }
}

/* ==============================================
   ÉTATS & ANIMATIONS
   ============================================== */

/* Focus accessibility */
.product-thumbs-slider .splide__arrow:focus {
  outline: 2px solid var(--splide-primary);
  outline-offset: 2px;
}

.product-thumbs-slider .splide__slide:focus-visible {
  outline: 2px solid var(--splide-primary);
  outline-offset: 2px;
}

/* Animation entrée slide */
.product-main-slider .splide__slide.is-active img {
  animation: fadeInSlide 0.4s ease;
}

@keyframes fadeInSlide {
  from {
    opacity: 0.5;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Hover effect sur thumbs */
.product-thumbs-slider .splide__slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: var(--splide-transition);
  pointer-events: none;
}

.product-thumbs-slider .splide__slide:not(.is-active):hover::after {
  background: rgba(0, 0, 0, 0.05);
}

/* ==============================================
   SPLIDE CORE OVERRIDES
   ============================================== */

/* Remove default outline */
.splide:focus {
  outline: none;
}

/* Track overflow */
.product-main-slider .splide__track {
  overflow: hidden;
}

/* Slide visibility */
.splide__slide {
  visibility: visible !important;
}

/* Splide loading */
.splide.is-loading .splide__track {
  visibility: hidden;
}


/* Flèches slider produit - masquées en mobile */
@media (max-width: 767px) {
  .product-main-slider .splide__arrows {
    display: none !important;
  }
}

/* Style des flèches (facultatif) */
.product-main-slider .splide__arrow {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.08);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  opacity: 1;
  transition: background 0.2s, transform 0.2s;
}

.product-main-slider .splide__arrow:hover {
  background: var(--adw-primary);
}

.product-main-slider .splide__arrow:hover svg {
  fill: #fff;
}


.product-main-slider .splide__arrow svg {
  fill: #4A4745;
  width: 14px;
  height: 14px;
}
/******** FIN SPLIDE JS PRODUITS ********/

/* ============================================
   SECTION INFORMATIONS PRODUIT
   ============================================ */

/* Titre produit */
body#product .page-header h1,
body#product h1.h1 {
  font-size: var(--adw-font-2xl);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin: 0 0 var(--adw-space-lg) 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

@media (min-width: 768px) {
  body#product .page-header h1,
  body#product h1.h1 {
    font-size: var(--adw-font-2xl);
  }
}

/* ============================================
   PRIX PRODUIT - TTC petit + HT grand
   Respecte les rich snippets (schema.org)
   ============================================ */

body#product .product-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--adw-space-xs);
  margin-bottom: var(--adw-space-xl);
  /* padding: var(--adw-space-lg); */
  padding: 0px;
  /* background: linear-gradient(135deg, var(--adw-primary-soft) 0%, transparent 100%);
  border-radius: var(--adw-buttons-radius-small);
  border-left: 4px solid var(--adw-primary); */
}

/* Container pour organiser TTC au-dessus, HT en dessous */
body#product .product-prices .current-price {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--adw-space-xs);
  width: 100%;
}

/* Prix TTC - Petit, au-dessus */
body#product .product-prices .current-price-display {
  order: 2;
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-medium);
  color: var(--adw-text-medium);
  line-height: 1;
}

body#product .product-prices .current-price-display::before {
  content: "TTC : ";
  font-weight: var(--adw-font-normal);
}

/* Prix HT - Grand, en dessous (prix principal pour le rich snippet) */
body#product .product-prices [itemprop="price"],
body#product .product-prices .current-price-value {
  order: 2;
  font-size: var(--adw-font-3xl);
  font-weight: var(--adw-font-extrabold);
  color: var(--adw-primary);
  line-height: 1;
  letter-spacing: -0.02em;
}

/* Label HT après le prix */
body#product .product-prices .current-price-value::after {
  content: " HT";
  font-size: var(--adw-font-lg);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-primary);
  /* margin-left: var(--adw-space-xs); */
}

/* Prix barré (ancien prix) */
body#product .product-prices .regular-price {
  order: 3;
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-normal);
  color: var(--adw-text-light);
  text-decoration: line-through;
  margin-top: var(--adw-space-xs);
}

/* Réduction (badge) */
body#product .product-prices .discount,
body#product .product-prices .discount-percentage,
body#product .product-prices .discount-amount {
  order: 4;
  display: inline-flex;
  align-items: center;
  padding: var(--adw-space-xs) var(--adw-space-sm);
  background: var(--adw-error);
  color: var(--adw-text-white);
  font-size: var(--adw-font-xs);
  font-weight: var(--adw-font-bold);
  border-radius: var(--adw-buttons-radius-small);
  margin-top: var(--adw-space-sm);
}

/* Label taxes */
body#product .product-prices .tax-shipping-delivery-label {
  order: 5;
  font-size: var(--adw-font-xs);
  color: var(--adw-text-light);
  margin-top: var(--adw-space-sm);
  display: block;
  width: 100%;
}

/* ============================================
   VARIANTE : Si PrestaShop affiche différemment
   Adaptation selon la structure HTML
   ============================================ */

/* Si le prix TTC est dans un span séparé */
body#product .product-prices .product-price-ttc {
  order: 1;
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-medium);
  color: var(--adw-text-medium);
}

/* Si structure avec div.product-price */
body#product .product-prices .product-price {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--adw-space-xs);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 767px) {
  body#product .product-prices {
    padding: var(--adw-space-md);
  }

  body#product .product-prices .current-price-display {
    font-size: var(--adw-font-xs);
  }

  body#product .product-prices [itemprop="price"],
  body#product .product-prices .current-price-value {
    font-size: var(--adw-font-2xl);
  }

  body#product .product-prices .current-price-value::after {
    font-size: var(--adw-font-base);
  }
}

@media (max-width: 575px) {
  body#product .product-prices [itemprop="price"],
  body#product .product-prices .current-price-value {
    font-size: var(--adw-font-xl);
  }

  body#product .product-prices .current-price-value::after {
    font-size: var(--adw-font-sm);
  }
}
body#product .tax-shipping-delivery-label {
  font-size: var(--adw-font-sm);
  color: var(--adw-text-medium);
  margin-top: var(--adw-space-sm);
  display: block;
  width: 100%;
}

/* Description courte */
body#product .product-information .product-description {
  font-size: var(--adw-font-base);
  line-height: 1.6;
  color: var(--adw-text-dark);
  padding: 0px;
  /* margin-bottom: var(--adw-space-xl);
  padding-bottom: var(--adw-space-xl);
  border-bottom: 1px solid var(--adw-border-light); */
}

body#product .product-information .product-description p {
  margin: 0 0 var(--adw-space-md) 0;
}

/* ============================================
   VARIANTES PRODUIT
   ============================================ */

body#product .product-variants {
  margin-bottom: var(--adw-space-xl);
}

body#product .product-variants > .product-variants-item {
  margin-bottom: var(--adw-space-sm);
  margin-top: 0;
}

body#product .product-variants-item .control-label {
  display: block;
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
  /* margin-bottom: var(--adw-space-sm);
  text-transform: uppercase; */
  letter-spacing: 0.05em;
}

/* Select personnalisé */
body#product .product-variants select {
  width: 100%;
  padding: var(--adw-space-md) var(--adw-space-lg);
  font-size: var(--adw-font-base);
  font-family: var(--adw-font-family);
  color: var(--adw-text-dark);
  background: var(--adw-bg-white);
  border: 2px solid var(--adw-border-light);
  border-radius: var(--adw-buttons-radius-small);
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232e2a2a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--adw-space-md) center;
  background-size: 20px;
  padding-right: calc(var(--adw-space-lg) * 2);
}

body#product .product-variants select:hover {
  border-color: var(--adw-primary);
}

body#product .product-variants select:focus {
  outline: none;
  border-color: var(--adw-primary);
  box-shadow: 0 0 0 4px var(--adw-primary-soft);
}

/* Variantes couleur (swatches) */
body#product .product-variants .color,
body#product .product-variants ul[class*="color"] {
  display: flex;
  gap: var(--adw-space-sm);
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
}

body#product .product-variants .color input[type="radio"],
body#product .product-variants .input-color {
  display: none;
}

body#product .product-variants .color label,
body#product .product-variants .color-value {
  display: block;
  width: 48px;
  height: 48px;
  border: 3px solid var(--adw-border-light);
  border-radius: 50%;
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  position: relative;
  overflow: hidden;
}

body#product .product-variants .color label:hover,
body#product .product-variants .color-value:hover {
  transform: scale(1.1);
  border-color: var(--adw-primary);
}

body#product .product-variants .color input[type="radio"]:checked + label,
body#product .product-variants .color-value.selected {
  border-color: var(--adw-primary);
  box-shadow: 0 0 0 2px var(--adw-primary-soft);
  transform: scale(1.15);
}

body#product .product-variants .input-color:checked + span,
body#product .product-variants .input-color:hover + span,
body#product .product-variants .input-radio:checked + span,
.input-radio:hover + span {
  border: 1px solid var(--adw-primary);
  border-radius: var(--adw-buttons-radius-small);
  background-color: rgb(254, 241, 230);
}

body#product .product-variants .input-color + span,
body#product .product-variants .input-color + span,
body#product .product-variants .input-radio + span,
.input-radio:hover + span {
  border: 1px solid var(--adw-secondary);
  border-radius: var(--adw-buttons-radius-small);
  background-color: #f6f6f6;
  font-size: 1.175rem;
}

/* ============================================
   QUANTITÉ & AJOUT AU PANIER
   ============================================ */

body#product .product-add-to-cart {
  /* background: var(--adw-bg-light); */
  /* padding: var(--adw-space-xl); */
  border-radius: var(--adw-buttons-radius-small);
  margin-bottom: var(--adw-space-xl);
}
/* ============================================
   QUANTITÉ PRODUIT - Custom Spinner
   ============================================ */

body#product .product-quantity {
  display: flex;
  align-items: center;
  gap: var(--adw-space-lg);
  margin-bottom: var(--adw-space-lg);
}

body#product .product-quantity > label {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Wrapper du spinner */
body#product .qty-spinner-wrapper {
  display: inline-flex;
  align-items: stretch;
  border: 2px solid var(--adw-text-dark);
  border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
}

/* Boutons +/- */
body#product .qty-spinner-btn {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--adw-bg-white);
  color: var(--adw-text-dark);
  border: none;
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  font-size: 1.5rem;
  font-weight: var(--adw-font-bold);
  padding: 0;
  line-height: 1;
}

/* Bouton moins - séparateur droit */
body#product .qty-spinner-down {
  border-right: 1px solid var(--adw-border-light);
}

/* Bouton plus - séparateur gauche */
body#product .qty-spinner-up {
  border-left: 1px solid var(--adw-border-light);
}

/* Hover sur les boutons */
body#product .qty-spinner-btn:hover {
  background: var(--adw-primary);
  color: var(--adw-bg-white);
}

/* Active (clic) */
body#product .qty-spinner-btn:active {
  transform: scale(0.95);
}

/* Input quantité au centre */
body#product .qty-spinner-input {
  width: 70px !important;
  height: 48px;
  padding: var(--adw-space-sm);
  font-size: var(--adw-font-lg);
  font-weight: var(--adw-font-bold);
  text-align: center;
  border: none !important;
  border-radius: 0 !important;
  background: var(--adw-bg-white);
  color: var(--adw-text-dark);
  -moz-appearance: textfield;
}

/* Retirer les flèches natives */
body#product .qty-spinner-input::-webkit-outer-spin-button,
body#product .qty-spinner-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Focus sur l'input */
body#product .qty-spinner-input:focus {
  outline: none;
  background: var(--adw-bg-light);
}

/* Focus sur le wrapper */
body#product .qty-spinner-wrapper:focus-within {
  border-color: var(--adw-primary);
  box-shadow: 0 0 0 3px var(--adw-primary-soft);
}

body#product .input-group.bootstrap-touchspin .input-group-btn-vertical {
  display: none;
}

/* Stock availability */
body#product #product-availability,
body#product .product-availability {
  display: flex;
  align-items: center;
  gap: var(--adw-space-sm);
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-success);
  margin-bottom: var(--adw-space-md);
}

body#product #product-availability.out-of-stock,
body#product .product-availability.out-of-stock {
  color: var(--adw-error);
}

body#product #product-availability i,
body#product .product-availability i {
  font-size: 1.25rem;
}

/* Bouton Ajouter au panier */
body#product .product-information .add-to-cart,
body#product .product-information .btn.add-to-cart {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--adw-space-md);
  padding: calc(var(--adw-space-lg) * 1) var(--adw-space-xl);
  font-size: var(--adw-font-md);
  font-weight: var(--adw-font-bold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background: var(--adw-primary);
  color: var(--adw-text-white);
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  /* box-shadow: 0 4px 12px rgba(230, 37, 79, 0.3); */
  position: relative;
  overflow: hidden;
}

body#product .add-to-cart::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
  transition: left var(--adw-transition-slow);
}

body#product .add-to-cart:hover {
  background: var(--adw-primary-dark);
  /* transform: translateY(-2px); */
  /* box-shadow: 0 8px 24px rgba(230, 37, 79, 0.4); */
}

body#product .add-to-cart:hover::before {
  left: 100%;
}

body#product .add-to-cart:active {
  transform: translateY(0);
}

body#product .add-to-cart i {
  font-size: 1.5rem;
}

body#product .add-to-cart:disabled {
  background: var(--adw-text-light);
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* ============================================
   REASSURANCE (Garanties)
   ============================================ */

body#product .blockreassurance_product,
body#product .product-reassurance {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--adw-space-lg);
  padding: var(--adw-space-xl);
  background: var(--adw-bg-light);
  border-radius: var(--adw-buttons-radius-small);
  margin-bottom: var(--adw-space-xl);
}

body#product .blockreassurance_product .item-product,
body#product .reassurance-item {
  display: flex;
  align-items: center;
  gap: var(--adw-space-md);
}

body#product .blockreassurance_product .item-product svg,
body#product .blockreassurance_product .item-product img,
body#product .reassurance-item svg {
  width: 32px;
  height: 32px;
  color: var(--adw-primary);
  flex-shrink: 0;
}

body#product .blockreassurance_product .item-product span,
body#product .reassurance-item span {
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-medium);
  color: var(--adw-text-dark);
  line-height: 1.4;
}

/* ============================================
   ONGLETS PRODUIT
   ============================================ */

body#product .tabs {
  margin-top: calc(var(--adw-space-xl) * 2);
  padding: 0;
  border-radius: var(--adw-buttons-radius-small);
  border: 1px solid #e9e9e9;
}

/* Navigation onglets */
body#product .nav-tabs {
  display: flex;
  gap: var(--adw-space-sm);
  /* border-bottom: 2px solid var(--adw-border-light); */
  /* margin-bottom: var(--adw-space-xl); */
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
}


body#product .nav-tabs .nav-item {
  margin: 0;
}

body#product .nav-tabs .nav-link {
  display: block;
  padding: var(--adw-space-md) var(--adw-space-xl);
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-medium);
  text-decoration: none;
  /* border: 2px solid transparent;
  border-bottom: none;
  border-radius: var(--adw-buttons-radius-small) var(--adw-buttons-radius-small)
    0 0; */
  transition: all var(--adw-transition-normal);
  background: transparent;
  cursor: pointer;
  position: relative;
  margin-bottom: -2px;
}

body#product .nav-tabs .nav-link:hover {
  color: var(--adw-primary);
  background: var(--adw-primary-soft);
}

body#product .nav-tabs .nav-link.active {
  color: var(--adw-primary);
  background: var(--adw-bg-white);
  border-color: var(--adw-primary);
  border-bottom-color: var(--adw-primary);
  font-weight: var(--adw-font-bold);
}

body#product .nav-tabs .nav-link:hover {
  color: var(--adw-primary);
  background: var(--adw-bg-white);
  border-color: var(--adw-primary);
  border-bottom-color: var(--adw-primary);
}

/* Contenu onglets */
body#product .tab-content {
  /* background: var(--adw-bg-white); */
  padding: var(--adw-space-xl);
  /* border-radius: 0 var(--adw-buttons-radius-small)
    var(--adw-buttons-radius-small) var(--adw-buttons-radius-small);
  border: 2px solid var(--adw-border-light);
  border-top: none; */
  margin-top: -2px;
}

body#product .tab-pane {
  display: none;
      padding-top: 0;
}

body#product .tab-pane.active {
  display: block;
  animation: productFadeIn 0.4s ease;
}

@keyframes productFadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Description produit */
body#product .tab-content .product-description {
  font-size: var(--adw-font-base);
  /* line-height: 1.8; */
  color: var(--adw-text-dark);
  border: none;
  padding: 0;
  margin: 0;
}

body#product .tab-content .product-description h2,
body#product .tab-content .product-description h3 {
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin: var(--adw-space-xl) 0 var(--adw-space-md) 0;
}

body#product .tab-content .product-description ul,
body#product .tab-content .product-description ol {
  margin: var(--adw-space-md) 0;
  padding-left: var(--adw-space-xl);
}

body#product .tab-content .product-description li {
  margin-bottom: var(--adw-space-sm);
}

/* Product details */
body#product .product-features,
body#product .data-sheet {
  list-style: none;
  padding: 0;
  margin: 0;
}

body#product .product-features li,
body#product .data-sheet li {
  display: flex;
  padding: var(--adw-space-md) 0;
  border-bottom: 1px solid var(--adw-border-light);
}

body#product .product-features li:last-child,
body#product .data-sheet li:last-child {
  border-bottom: none;
}

body#product .product-features .label,
body#product .data-sheet .name {
  flex: 0 0 40%;
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
}

body#product .product-features .value,
body#product .data-sheet .value {
  /* flex: 1; */
  color: var(--adw-text-medium);
}

/* Pièces jointes */
body#product .product-attachments {
  padding: var(--adw-space-md) 0;
}

body#product .product-attachments .h5 {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  text-transform: uppercase;
  margin-bottom: var(--adw-space-md);
}

body#product .product-attachments .attachment {
  padding: var(--adw-space-md);
  background: var(--adw-bg-light);
  border-radius: var(--adw-buttons-radius-small);
  margin-bottom: var(--adw-space-md);
}

body#product .product-attachments .attachment h4 {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-semibold);
  margin: 0 0 var(--adw-space-sm) 0;
}

body#product .product-attachments .attachment h4 a {
  color: var(--adw-primary);
  text-decoration: none;
}

body#product .product-attachments .attachment h4 a:hover {
  text-decoration: underline;
}

body#product .product-attachments .attachment p {
  font-size: var(--adw-font-sm);
  color: var(--adw-text-medium);
  margin: 0 0 var(--adw-space-sm) 0;
}

body#product .product-attachments .attachment > a {
  display: inline-flex;
  align-items: center;
  gap: var(--adw-space-xs);
  color: var(--adw-primary);
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-medium);
  text-decoration: none;
}

body#product .product-attachments .attachment > a:hover {
  text-decoration: underline;
}

/* ============================================
   PRODUITS ACCESSOIRES
   ============================================ */

body#product .product-accessories {
  margin-top: calc(var(--adw-space-xl) * 2);
  padding: calc(var(--adw-space-xl) * 2) 0;
  border-top: 2px solid var(--adw-border-light);
}

body#product .product-accessories .h5 {
  font-size: var(--adw-font-xl);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--adw-space-xl);
  padding-bottom: var(--adw-space-md);
  border-bottom: 3px solid var(--adw-primary);
  position: relative;
}

body#product .product-accessories .h5::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 80px;
  height: 3px;
  background: var(--adw-accent);
}

/* body#product .product-accessories .products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: var(--adw-space-lg);
} */
body#product .product-accessories .products {
  display: block;
}


/* ============================================
   MODAL IMAGES
   ============================================ */

body#product .product-images-modal .modal-content {
  background: var(--adw-bg-white);
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
}

body#product .product-images-modal .modal-header {
  border-bottom: 1px solid var(--adw-border-light);
  padding: var(--adw-space-lg);
}

body#product .product-images-modal .modal-body {
  padding: var(--adw-space-xl);
}

body#product .product-images-modal .close {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--adw-secondary);
  color: var(--adw-text-white);
  border-radius: 50%;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  transition: all var(--adw-transition-normal);
}

body#product .product-images-modal .close:hover {
  background: var(--adw-primary);
}

/* ============================================
   PACK PRODUITS
   ============================================ */

body#product .product-pack {
  background: var(--adw-bg-light);
  padding: var(--adw-space-xl);
  border-radius: var(--adw-buttons-radius-small);
  margin-bottom: var(--adw-space-xl);
}

body#product .product-pack .h4 {
  font-size: var(--adw-font-lg);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin: 0 0 var(--adw-space-lg) 0;
  padding-bottom: var(--adw-space-md);
  border-bottom: 2px solid var(--adw-primary);
}

/* ============================================
   DISCOUNTS VOLUME
   ============================================ */

body#product .product-discounts {
  margin-bottom: var(--adw-space-xl);
}

body#product .product-discounts .h6 {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin-bottom: var(--adw-space-md);
}

body#product .product-discounts table {
  width: 100%;
  border-collapse: collapse;
}

body#product .product-discounts table th,
body#product .product-discounts table td {
  padding: var(--adw-space-md);
  text-align: left;
  border-bottom: 1px solid var(--adw-border-light);
}

body#product .product-discounts table th {
  background: var(--adw-bg-light);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
}

body#product .product-discounts table td {
  color: var(--adw-text-medium);
}

body#product .product-discounts table tr:last-child td {
  border-bottom: none;
}

/* ============================================
   CUSTOMIZATION
   ============================================ */

body#product .product-customization {
  background: var(--adw-bg-light);
  padding: var(--adw-space-xl);
  border-radius: var(--adw-buttons-radius-small);
  margin-bottom: var(--adw-space-xl);
}

body#product .product-customization .h4 {
  font-size: var(--adw-font-lg);
  font-weight: var(--adw-font-bold);
  color: var(--adw-text-dark);
  margin: 0 0 var(--adw-space-lg) 0;
}

body#product .product-customization .custom-label {
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
  margin-bottom: var(--adw-space-sm);
}

body#product .product-customization input,
body#product .product-customization textarea {
  width: 100%;
  padding: var(--adw-space-md);
  border: 2px solid var(--adw-border-light);
  border-radius: var(--adw-buttons-radius-small);
  font-family: var(--adw-font-family);
  font-size: var(--adw-font-base);
  transition: all var(--adw-transition-normal);
}

body#product .product-customization input:focus,
body#product .product-customization textarea:focus {
  outline: none;
  border-color: var(--adw-primary);
  box-shadow: 0 0 0 4px var(--adw-primary-soft);
}

/* ============================================
   ADDITIONAL INFO
   ============================================ */

body#product .product-additional-info {
  /* padding: var(--adw-space-lg) 0;
  border-top: 1px solid var(--adw-border-light);
  margin-top: var(--adw-space-lg); */
  padding: 0;
}

body#product .product-additional-info .social-sharing {
  display: flex;
  align-items: center;
  gap: var(--adw-space-md);
}

body#product .product-additional-info .social-sharing span {
  font-size: var(--adw-font-sm);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
}

body#product .product-additional-info .social-sharing a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: var(--adw-bg-light);
  color: var(--adw-text-medium);
  border-radius: 50%;
  transition: all var(--adw-transition-normal);
}

body#product .product-additional-info .social-sharing a:hover {
  background: var(--adw-primary);
  color: var(--adw-text-white);
  transform: translateY(-2px);
}

  body#product .tab-content .product-description p{
  margin-bottom: .5rem !important;
}

.page-content.page-cms ul, p {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-normal);
  color: var(--adw-text-dark)
}

/* ============================================
   RESPONSIVE - TABLETTE
   ============================================ */

@media (max-width: 991px) {
  body#product .product-container {
    padding: var(--adw-space-xl);
  }

  body#product .page-header h1,
  body#product h1.h1 {
    font-size: var(--adw-font-xl);
  }

  body#product .product-price,
  body#product .current-price-value {
    font-size: var(--adw-font-2xl);
  }

  body#product .nav-tabs .nav-link {
    padding: var(--adw-space-sm) var(--adw-space-lg);
    font-size: var(--adw-font-sm);
  }

  body#product .tab-content {
    padding: var(--adw-space-lg);
  }
}

/* ============================================
   RESPONSIVE - MOBILE
   ============================================ */

@media (max-width: 767px) {
  body#product #main {
    padding: var(--adw-space-md) 0;
  }

  body#product .product-container {
    padding: var(--adw-space-lg);
    margin-bottom: var(--adw-space-lg);
  }

  body#product .page-header h1,
  body#product h1.h1 {
    font-size: var(--adw-font-lg);
    margin-bottom: var(--adw-space-md);
  }

  body#product .product-prices {
    padding: var(--adw-space-md);
    margin-bottom: var(--adw-space-lg);
  }

  body#product .product-price,
  body#product .current-price-value {
    font-size: var(--adw-font-xl);
  }

  body#product .product-information .product-description {
    font-size: var(--adw-font-sm);
    margin-bottom: var(--adw-space-lg);
    padding-bottom: var(--adw-space-lg);
  }

  body#product .product-add-to-cart {
    padding: var(--adw-space-lg);
  }

  body#product .product-information .add-to-cart {
    padding: var(--adw-space-lg) var(--adw-space-xl);
    font-size: var(--adw-font-base);
  }

  body#product .nav-tabs {
    gap: 0;
    overflow-x: auto;
    scrollbar-width: none;
  }

  body#product .nav-tabs::-webkit-scrollbar {
    display: none;
  }

  body#product .nav-tabs .nav-link {
    padding: var(--adw-space-sm) var(--adw-space-md);
    font-size: var(--adw-font-sm);
    white-space: nowrap;
  }

  body#product .tab-content {
    padding: var(--adw-space-md);
  }

  body#product .product-accessories .products {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--adw-space-md);
  }

  body#product .scroll-box-arrows i {
    width: 36px;
    height: 36px;
  }

  body#product .blockreassurance_product,
  body#product .product-reassurance {
    grid-template-columns: 1fr 1fr;
    gap: var(--adw-space-md);
    padding: var(--adw-space-md);
  }
}

/* ============================================
   RESPONSIVE - PETIT MOBILE
   ============================================ */

@media (max-width: 575px) {
  body#product .product-container {
    padding: var(--adw-space-md);
  }

  body#product .product-quantity {
    flex-direction: column;
    align-items: flex-start;
  }

  body#product .blockreassurance_product,
  body#product .product-reassurance {
    grid-template-columns: 1fr;
    gap: var(--adw-space-md);
    padding: var(--adw-space-md);
  }

  body#product .product-features .label,
  body#product .data-sheet .name {
    flex: 0 0 100%;
    margin-bottom: var(--adw-space-xs);
  }

  body#product .product-features li,
  body#product .data-sheet li {
    flex-direction: column;
  }

  body#product .product-features .value,
  body#product .data-sheet .value {
    padding-left: var(--adw-space-md);
  }
}

/* ============================================
   ACCESSIBILITÉ
   ============================================ */

body#product .add-to-cart:focus-visible,
body#product .nav-tabs .nav-link:focus-visible,
body#product .product-variants select:focus-visible,
body#product .thumb-container:focus-visible {
  outline: 3px solid var(--adw-primary);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  body#product *,
  body#product *::before,
  body#product *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================
   PRINT STYLES
   ============================================ */

@media print {
  body#product .scroll-box-arrows,
  body#product .add-to-cart,
  body#product .product-accessories,
  body#product .social-sharing {
    display: none;
  }

  body#product .product-container {
    box-shadow: none;
    border: 1px solid #000;
  }

  body#product .product-container.row {
    display: block;
  }

  body#product .product-container .col-md-6 {
    width: 100%;
    margin-bottom: 20px;
  }
}

.adwcore_product_right-image {
  position: relative;
  display: flex;
  align-items: center;
}

.adwcore_product_left-detail {
  background: #f6f6f6;
  padding-left: 2rem !important;
}

@media (min-width: 768px) {
  .adwcore_product_right-image:before {
    background-color: #fff;
    content: "";
    display: block;
    height: 100%;
    left: -100%;
    position: absolute;
    top: 0;
    width: 100%;
  }
}

/* ============================================
   MODALE AJOUT AU PANIER - BlackMarket
   ============================================ */

/* Overlay de la modale */
#blockcart-modal.modal.fade {
  /* background: rgba(0, 0, 0, 0.7); */
  backdrop-filter: blur(4px);
  transition: opacity 0.3s ease;
}

#blockcart-modal.modal.fade.in,
#blockcart-modal.modal.fade.show {
  opacity: 1;
}

#blockcart-modal .modal-title i.material-icons {
  margin-right: 1.875rem;
  color: var(--adw-white);
}

/* Container de la modale */
#blockcart-modal .modal-dialog {
  max-width: 900px;
  margin: 50px auto;
  animation: modalSlideDown 0.4s ease-out;
  border-radius: var(--adw-buttons-radius-small);
}

@keyframes modalSlideDown {
  from {
    opacity: 0;
    transform: translateY(-50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#blockcart-modal .modal-content {
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}

/* ============================================
   HEADER DE LA MODALE
   ============================================ */

#blockcart-modal .modal-header {
  background: var(--adw-primary);
  color: var(--adw-bg-white);
  padding: var(--adw-space-lg) var(--adw-space-xl);
  border-bottom: none;
  position: relative;
}

#blockcart-modal .modal-title {
  font-size: var(--adw-font-lg);
  font-weight: var(--adw-font-bold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
  padding-right: 40px;
  display: flex;
  align-items: center;
  gap: var(--adw-space-sm);
  color: var(--adw-white);
}

#blockcart-modal .modal-title .material-icons {
  font-size: 1.5em;
}

/* Bouton de fermeture */
#blockcart-modal .modal-header .close {
  position: absolute;
  right: var(--adw-space-lg);
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  padding: 0;
  margin: 0;
  background: rgba(255, 255, 255, 0.2);
  border: none;
  border-radius: 50%;
  color: var(--adw-bg-white);
  font-size: 1.5rem;
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
}

#blockcart-modal .modal-header .close:hover {
  background: var(--adw-bg-white);
  color: var(--adw-primary) !important;
  transform: translateY(-50%) rotate(90deg);
}

#blockcart-modal .modal-header .close:hover i {
  color: var(--adw-primary) !important;
}

#blockcart-modal .modal-header .close .material-icons {
  font-size: 24px;
  color: var(--adw-white);
}

/* ============================================
   CORPS DE LA MODALE
   ============================================ */

#blockcart-modal .modal-body {
  /* padding: var(--adw-space-xl); */
  padding: 0;
  background: var(--adw-bg-light);
}

/* ============================================
   SECTION PRODUIT AJOUTÉ (colonne gauche)
   ============================================ */

#blockcart-modal .divide-right {
  padding: var(--adw-space-lg);
}

#blockcart-modal .divide-right {
  /* padding-right: var(--adw-space-xl); */
  border-right: 2px solid var(--adw-border-light);
}

#blockcart-modal .product-image {
  width: 100%;
  border-radius: var(--adw-radius-sm);
  border: 2px solid var(--adw-border-light);
  background: var(--adw-bg-white);
  padding: var(--adw-space-xs);
}

#blockcart-modal .product-name {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-bold);
  color: var(--adw-secondary);
  margin: 0 0 var(--adw-space-sm);
  text-transform: uppercase;
}

#blockcart-modal .product-price {
  font-size: var(--adw-font-xl);
  font-weight: var(--adw-font-extrabold);
  color: var(--adw-primary);
  margin: 0 0 var(--adw-space-md);
}

/* Attributs/Variantes du produit */
#blockcart-modal .modal-body span[class*="product-"],
#blockcart-modal .modal-body span.montage,
#blockcart-modal .modal-body span.diamètre,
#blockcart-modal .modal-body span.longueur,
#blockcart-modal .modal-body span.hauteur {
  display: block;
  font-size: var(--adw-font-sm);
  color: var(--adw-text-medium);
  margin-bottom: var(--adw-space-xs);
  line-height: 1.6;
}

#blockcart-modal .modal-body span[class*="product-"] strong,
#blockcart-modal .modal-body span.montage strong,
#blockcart-modal .modal-body span.diamètre strong,
#blockcart-modal .modal-body span.longueur strong,
#blockcart-modal .modal-body span.hauteur strong {
  color: var(--adw-text-dark);
  font-weight: var(--adw-font-semibold);
}

#blockcart-modal .product-quantity {
  display: block;
  margin-top: var(--adw-space-md);
  padding-top: var(--adw-space-md);
  border-top: 1px solid var(--adw-border-light);
  font-size: var(--adw-font-base);
  color: var(--adw-text-dark);
}

/* ============================================
   RÉSUMÉ PANIER (colonne droite)
   ============================================ */

#blockcart-modal .cart-content {
  /* background: var(--adw-bg-white);*/
  padding: var(--adw-space-lg);
  /*  border-radius: var(--adw-radius-sm);
  border: 2px solid var(--adw-border-light); */
}

#blockcart-modal .cart-products-count {
  font-size: var(--adw-font-base);
  font-weight: var(--adw-font-semibold);
  color: var(--adw-secondary);
  margin: 0 0 var(--adw-space-lg);
  padding-bottom: var(--adw-space-md);
  border-bottom: 2px solid var(--adw-border-light);
}

#blockcart-modal .cart-content > p {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--adw-font-base);
  color: var(--adw-text-dark);
  margin: 0 0 var(--adw-space-sm);
  padding: var(--adw-space-xs) 0;
}

#blockcart-modal .cart-content > p .label,
#blockcart-modal .cart-content > p > span:first-child {
  font-weight: var(--adw-font-medium);
  color: var(--adw-text-medium);
}

#blockcart-modal .cart-content > p .value,
#blockcart-modal .cart-content > p > span:last-child {
  font-weight: var(--adw-font-semibold);
  color: var(--adw-text-dark);
}

/* Ligne Total TTC */
#blockcart-modal .cart-content .product-total {
  margin-top: var(--adw-space-md);
  padding-top: var(--adw-space-md);
  border-top: 2px solid var(--adw-primary);
  font-size: var(--adw-font-lg);
}

#blockcart-modal .cart-content .product-total .label {
  color: var(--adw-secondary);
  font-weight: var(--adw-font-bold);
  text-transform: uppercase;
}

#blockcart-modal .cart-content .product-total .value {
  color: var(--adw-primary);
  font-weight: var(--adw-font-extrabold);
  font-size: var(--adw-font-xl);
}

/* ============================================
   BOUTONS D'ACTION
   ============================================ */

#blockcart-modal .cart-content-btn {
  display: flex !important;
  gap: var(--adw-space-md);
  margin-top: var(--adw-space-xl);
  padding-top: var(--adw-space-lg);
  border-top: 1px solid var(--adw-border-light);
}

#blockcart-modal .cart-content-btn .btn {
  flex: 1;
  padding: var(--adw-space-xs) var(--adw-space-sm);
  font-size: var(--adw-font-xs);
  font-weight: var(--adw-font-bold);
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  border-radius: var(--adw-buttons-radius-small);
  transition: all var(--adw-transition-normal);
  cursor: pointer;
  border: 2px solid;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--adw-space-xs);
}

/* Bouton Continuer les achats */
#blockcart-modal .cart-content-btn .btn-secondary {
  background: var(--adw-bg-white);
  color: var(--adw-text-dark);
  border-color: var(--adw-text-dark);
}

#blockcart-modal .cart-content-btn .btn-secondary:hover {
  background: var(--adw-text-dark);
  color: var(--adw-bg-white);
  border-color: var(--adw-text-dark);
}

/* Bouton Commander */
#blockcart-modal .cart-content-btn .btn-primary {
  background: var(--adw-primary);
  color: var(--adw-bg-white);
  border-color: var(--adw-primary);
}

#blockcart-modal .cart-content-btn .btn-primary:hover {
  background: var(--adw-secondary);
  border-color: var(--adw-secondary);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(230, 37, 79, 0.3);
}

#blockcart-modal .cart-content-btn .btn .material-icons {
  font-size: 20px;
}

#blockcart-modal .modal-body .row {
  display: flex;
}

#blockcart-modal .product-image{
  height: auto;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 991px) {

  #blockcart-modal .modal-body .row{
    flex-direction: column;
  }

  #blockcart-modal .product-image {
      max-width: 100%;
      margin: 0 auto 1rem;
      height: auto;
  }

  #blockcart-modal .modal-dialog {
    max-width: 720px;
    margin: 30px auto;
  }

  #blockcart-modal .divide-right {
    padding-right: var(--adw-space-lg);
  }
}

@media (max-width: 767px) {
  #blockcart-modal .modal-dialog {
    /* margin: 20px; */
    max-width: none;
  }

  .transform_devis {
    display: flex;
    justify-content: center;
  }

  #blockcart-modal .modal-body {
    padding: var(--adw-space-lg);
  }

  #blockcart-modal .divide-right {
    /* padding-right: 0; */
    border-right: none;
    margin-bottom: var(--adw-space-xl);
    padding-bottom: var(--adw-space-xl);
    border-bottom: 2px solid var(--adw-border-light);
  }

  #blockcart-modal .cart-content .cart-content-btn button{
    margin-right: 0;;
  }

  #blockcart-modal .cart-content {
    padding: var(--adw-space-md);
  }

  #blockcart-modal .cart-content-btn {
    flex-direction: column;
  }

  #blockcart-modal .modal-title {
    font-size: var(--adw-font-base);
  }
}

@media (max-width: 575px) {
  #blockcart-modal .modal-header {
    padding: var(--adw-space-md) var(--adw-space-lg);
  }

  #blockcart-modal .modal-header .close {
    width: 36px;
    height: 36px;
    right: var(--adw-space-md);
  }

  #blockcart-modal .modal-title {
    font-size: var(--adw-font-sm);
    padding-right: 30px;
  }

  #blockcart-modal .product-price {
    font-size: var(--adw-font-lg);
  }

  #blockcart-modal .cart-content .product-total .value {
    font-size: var(--adw-font-lg);
  }
}

/* ============================================
   PAGE PANIER
   ============================================ */

.cart-grid {
  display: flex;
  gap: var(--spacing-lg);
  margin: 0 auto;
  /* max-width: 1400px; */
  padding: 0 var(--spacing-md);
  border-radius: var(--adw-buttons-radius-small);
}

/* ============================================
   COLONNE DROITE - RÉSUMÉ (FOND GRIS + STICKY)
   ============================================ */
.cart-grid-right {
  flex: 0 0 480px;

  /* background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: var(--adw-buttons-radius-small);
  padding: 20px;
  margin-bottom: 30px; */
}

.cart-summary {
  background-color: var(--bg-gray);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  position: sticky;
  top: 100px; /* Ajuster selon la hauteur du header */
  padding: 0;
  border: none;
  width: 100%;
}

/* ============================================
   COLONNE GAUCHE
   ============================================ */
.cart-grid-body .card {
  border: 1px solid #e5e5e5;
  border-radius: var(--adw-buttons-radius-small);
  padding: 20px;
  margin-bottom: 30px;
}
.cart-grid-body .cart-item {
  border-bottom: 1px solid #e5e5e5;
  padding: 20px 0;
}

.cart-grid-body .card-block h1 {
  margin-bottom: 0;
  font-size: var(--adw-font-3xl);
  font-weight: var(--adw-font-extraextrabold);
}

/* ============================================
   LIGNE PRODUIT
   ============================================ */
.cart-item {
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--border-light);
}

.cart-item:last-child {
  border-bottom: none;
}

.product-line-grid {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

/* ============================================
   IMAGE PRODUIT
   ============================================ */
.product-line-grid-left {
  flex: 0 0 90px;
  padding: 0 !important;
  width: 90px !important;
  max-width: 90px !important;
}

.product-image {
  display: block;
  width: 90px;
  height: 90px;
  border-radius: 8px;
  overflow: hidden;
  background: var(--bg-light);
}

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

/* ============================================
   INFOS PRODUIT
   ============================================ */
.product-line-grid-body {
  flex: 1;
  min-width: 0;
  padding: 0 !important;
}

/* Nom du produit */
.product-line-info a.label {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-dark);
  text-decoration: none;
  display: block;
  margin-bottom: 0.5rem;
}

.product-line-info a.label:hover {
  color: #000;
}

/* PRIX - Couleur verte */
.product-line-info.product-price {
  margin: 0.5rem 0;
}

.product-line-info .current-price .price {
  color: var(--adw-primary);
  font-weight: var(--adw-font-extraextrabold);
  letter-spacing: -0.02em;
}

/* Attributs */
.product-line-info.finition,
.product-line-info.conditionnement,
.product-line-info.montage,
.product-line-info.rosace,
.product-line-info[class*="diamètre"],
.product-line-info[class*="longueur"],
.product-line-info[class*="hauteur"] {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0.25rem 0;
}

.product-line-info .value {
  color: var(--text-dark);
}

.product-line-grid-body br {
  display: none;
}

/* ============================================
   ZONE ACTIONS - DROITE
   ============================================ */
.product-line-grid-right {
  flex: 0 0 auto;
  padding: 0 !important;
  display: flex !important;
  align-items: center;
  gap: 1rem;
  justify-content: flex-end;
}

/* Reset des colonnes Bootstrap */
.product-line-grid-right > .row {
  display: flex !important;
  align-items: center;
  gap: 1rem;
  margin: 0;
  flex-wrap: nowrap;
}

.product-line-grid-right .col-xs-4.hidden-md-up {
  display: none !important;
}

.product-line-grid-right .col-md-10 {
  padding: 0;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
}

.product-line-grid-right .col-md-10 > .row {
  display: flex !important;
  align-items: center;
  gap: 1rem;
  margin: 0;
  flex-wrap: nowrap;
}

.product-line-grid-right .col-md-6 {
  padding: 0;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
}

/* ============================================
   QUANTITÉ
   ============================================ */
/* Wrapper du spinner */
body#cart .qty-spinner-wrapper {
  display: inline-flex;
  align-items: stretch;
  border: 2px solid var(--adw-text-dark);
  border-radius: var(--adw-buttons-radius-small);
  overflow: hidden;
}

/* Boutons +/- */
body#cart .qty-spinner-btn {
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--adw-bg-white);
  color: var(--adw-text-dark);
  border: none;
  cursor: pointer;
  transition: all var(--adw-transition-normal);
  font-size: 1.5rem;
  font-weight: var(--adw-font-bold);
  padding: 0;
  line-height: 1;
}

/* Bouton moins - séparateur droit */
body#cart .qty-spinner-down {
  border-right: 1px solid var(--adw-border-light);
}

/* Bouton plus - séparateur gauche */
body#cart .qty-spinner-up {
  border-left: 1px solid var(--adw-border-light);
}

/* Hover sur les boutons */
body#cart .qty-spinner-btn:hover {
  background: var(--adw-primary);
  color: var(--adw-bg-white);
}

/* Active (clic) */
body#cart .qty-spinner-btn:active {
  transform: scale(0.95);
}

/* Input quantité au centre */
body#cart .qty-spinner-input {
  width: 50px !important;
  height: 35px;
  padding: var(--adw-space-sm);
  font-size: var(--adw-font-md);
  font-weight: var(--adw-font-bold);
  text-align: center;
  border: none !important;
  border-radius: 0 !important;
  background: var(--adw-bg-white);
  color: var(--adw-text-dark);
  -moz-appearance: textfield;
}

/* Retirer les flèches natives */
body#cart .qty-spinner-input::-webkit-outer-spin-button,
body#cart .qty-spinner-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Focus sur l'input */
body#cart .qty-spinner-input:focus {
  outline: none;
  background: var(--adw-bg-light);
}

/* Focus sur le wrapper */
body#cart .qty-spinner-wrapper:focus-within {
  border-color: var(--adw-primary);
  box-shadow: 0 0 0 3px var(--adw-primary-soft);
}

body#cart .input-group.bootstrap-touchspin .input-group-btn-vertical {
  display: none;
}
/* ============================================
   PRIX TOTAL - LARGEUR FIXE POUR ALIGNEMENT
   ============================================ */
.product-line-actions .col-md-6.price {
  min-width: 90px;
  text-align: right;
}

.product-line-actions .product-price {
  display: block;
  text-align: right;
}

.product-line-actions .product-price strong {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--adw-primary);
  white-space: nowrap;
  letter-spacing: -0.02em;
}

/* ============================================
   BOUTON SUPPRIMER - CORRIGÉ ET VISIBLE
   ============================================ */
.product-line-grid-right .col-md-2 {
  padding: 0 !important;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.cart-line-product-actions {
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.remove-from-cart {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  color: var(--trash-color);
  text-decoration: none;
  transition: all 0.2s ease;
  background: transparent;
  cursor: pointer;
}

.remove-from-cart:hover {
  color: var(--trash-hover);
  background: rgba(220, 53, 69, 0.1);
  transform: scale(1.1);
}

.remove-from-cart i,
.remove-from-cart .material-icons {
  font-size: 22px !important;
  float: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: inherit;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1225px) {
}
@media (max-width: 1225px) {
  .cart-grid {
    flex-direction: column;
  }

  .cart-grid-body,
  .cart-grid-right {
    width: 100% !important;
  }

  .cart-grid-body .card {
    background-color: var(--adw-white);
  }

  .product-line-grid {
    flex-wrap: wrap;
  }

  .product-line-grid-left {
    flex: 0 0 70px;
    width: 70px !important;
  }

  .product-image {
    width: 70px;
    height: 70px;
  }

  .product-line-grid-body {
    flex: 1;
    min-width: calc(100% - 85px);
  }

  .product-line-grid-right {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 1rem;
    padding-left: 85px !important;
  }

  .product-line-grid-right > .row {
    justify-content: flex-start;
    width: 100%;
  }

  .product-line-actions .col-md-6.price {
    min-width: 80px;
  }
}

@media (max-width: 480px) {
  .cart-item {
    padding: 1rem 0;
  }

  .product-line-grid-left {
    flex: 0 0 60px;
    width: 60px !important;
  }

  .product-image {
    width: 60px;
    height: 60px;
   border-radius: var(--adw-buttons-radius-small);
  }

  .product-line-grid-body {
    min-width: calc(100% - 75px);
  }

.product-line-grid-right {
        padding-left: 0px !important;
    }

  .product-line-info a.label {
    font-size: 0.95rem;
  }

  .product-line-info .current-price .price,
  .product-line-actions .product-price strong {
    font-size: 1rem;
  }

  .qty-spinner-btn {
    width: 28px;
    height: 28px;
  }

  .qty-spinner-input {
    width: 35px;
    height: 28px;
  }
}

/* ============================================
   CLEARFIX - MASQUER
   ============================================ */
.product-line-grid .clearfix {
  display: none;
}

/* ============================================
   BLOC RÉSUMÉ PANIER
   ============================================ */
.cart-summary {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: var(--adw-buttons-radius-small);
  padding: 20px;
  margin-bottom: 30px;
}

/* ============================================
   TOTAUX DÉTAILLÉS
   ============================================ */
.cart-detailed-totals {
  padding: 0;
}

.cart-detailed-subtotals {
  padding: 1.5rem;
  border-bottom: 1px solid var(--border-light);
}

/* Lignes de résumé */
.cart-summary-line {
  /* display: flex;
    justify-content: space-between;
    align-items: center; */
  /* padding: 0.6rem 0; */
}

.cart-summary-line:first-child {
  padding-top: 0;
}

.cart-summary-line:last-child {
  padding-bottom: 0;
}

/* Labels */
.cart-summary-line .label {
  font-size: 0.95rem;
  color: var(--text-muted);
  font-weight: 500;
}

/* Valeurs / Prix */
.cart-summary-line .value {
  font-size: 1rem;
  font-weight: 600;
  color: var(--price-color);
  letter-spacing: -0.02em;
}

/* Livraison gratuite */
#cart-subtotal-shipping .value {
  color: var(--price-color);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.5px;
}

/* Masquer le small vide */
#cart-subtotal-shipping div small.value:empty {
  display: none;
}

/* ============================================
   BLOC TOTAUX (HT / TTC)
   ============================================ */
.cart-summary-totals {
  padding: 1.5rem;
  background-color: #ffffff;
}

/* Total HT */
.cart-summary-totals .cart-summary-line:not(.cart-total) .label {
  color: var(--text-muted);
  font-size: 0.9rem;
}

.cart-summary-totals .cart-summary-line:not(.cart-total) .value {
  color: var(--text-dark);
  font-size: 0.95rem;
  letter-spacing: -0.02em;
}

/* ============================================
   TOTAL TTC - Mise en avant
   ============================================ */
.cart-summary-line.cart-total {
  margin-top: 0.75rem;
  padding-top: 1rem;
  border-top: 2px solid var(--adw-primary);
}

.cart-total .label {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--text-dark) !important;
}

.cart-total .value {
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: var(--adw-primary) !important;
  letter-spacing: -0.02em;
}

/* ============================================
   BOUTON COMMANDER
   ============================================ */
.checkout.cart-detailed-actions {
  padding: 1.25rem 1.5rem 1.5rem;
  background-color: #ffffff;
}

.checkout .text-sm-center {
  text-align: center;
}

.checkout .btn-primary {
    display: block;
    width: 100%;
    padding: 1rem 2rem;
    background-color: var(--adw-primary);
    border: none;
    border-radius: var(--adw-buttons-radius-small);
    color: #ffffff;
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: color 0.3s ease;
}

.checkout .btn-primary::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #4A4745;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.checkout .btn-primary:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.checkout .btn-primary:hover {
    color: #fff;
}

.checkout .btn-primary:active {
    opacity: 0.9;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
  .cart-summary {
    border-radius: var(--adw-buttons-radius-small);
  }

  .cart-detailed-subtotals,
  .cart-summary-totals,
  .checkout.cart-detailed-actions {
    padding: 1.25rem;
  }

  .cart-total .label {
    font-size: 1rem !important;
  }

  .cart-total .value {
    font-size: 1.25rem !important;
  }

  .checkout .btn-primary {
    padding: 0.9rem 1.5rem;
    font-size: 1rem;
  }
}

@media (max-width: 480px) {
  .cart-detailed-subtotals,
  .cart-summary-totals,
  .checkout.cart-detailed-actions {
    padding: 1rem;
  }

  .cart-summary-line .label {
    font-size: 0.9rem;
  }

  .cart-summary-line .value {
    font-size: 0.95rem;
  }
}

/* ============================================
   CHECKOUT
   ============================================ */

.page-header h1 {
  margin-bottom: 0;
  font-size: var(--adw-font-3xl);
  font-weight: var(--adw-font-extraextrabold);
}

body#checkout .cart-grid-right .card#js-checkout-summary {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: var(--adw-buttons-radius-small);
  padding: 20px;
  margin-bottom: 30px;
}

body#checkout .cart-grid-right .card#js-checkout-summary a,
body#checkout .cart-grid-right .card#js-checkout-summary .product-price {
  color: var(--adw-primary) !important;
}

body#checkout .cart-grid-body {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: var(--adw-buttons-radius-small);
  padding: 20px;
  margin-bottom: 30px;
}

body#checkout .cart-grid-body a {
  color: var(--adw-primary) !important;
}

body#checkout section.checkout-step.-reachable.-current .step-number {
  background-color: var(--adw-primary) !important;
}

body#checkout .continue.btn.btn-primary {
  padding: 0.5rem 1.5rem;
  background-color: var(--adw-primary);
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  color: #ffffff;
  font-size: 1.1rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.5px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.form-control:focus {
  color: #232323;
  background-color: #fff;
  outline: 0 !important;
  box-shadow: 0 0 0 0.2rem var(--adw-primary);
  border-color: var(--adw-primary);
}

.form-control {
  border-radius: var(--adw-buttons-radius-small);
}

body#checkout section.checkout-step .address-item {
  flex: 0 0 33%;
}

body#checkout section.checkout-step .address-item.selected {
  background: #fff;
  border: var(--adw-primary) 3px solid;
  border-radius: var(--adw-buttons-radius-small);
}

body#checkout section.checkout-step .address-footer {
  background-color: #f8f9fa;
}

.custom-radio input[type="radio"]:checked + span {
  background-color: var(--adw-primary);
}

body#checkout #footer {
  background-color: var(--adw-secondary);
  color: var(--adw-text-white);
  padding-top: var(--adw-space-xl);
}

body#checkout #footer a:hover {
  color: var(--adw-primary);
}

.btn.btn-primary.js-mailalert-add {
  background-color: var(--adw-primary);
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  color: #ffffff;
  font-size: 1.1rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.5px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.js-mailalert.text-center article {
  border-radius: var(--adw-buttons-radius-small);
}


/***
Lazyload
***/

#product #content {
  max-width:max-content;
  padding-right: 2rem;
}
.adw-lazyload-wrapper {
  /* position: relative;
  overflow: hidden;
  background-color: var(--adw-bg-light);
  height: 100%;
  width: 100%; */
}


.adw-lazyload-wrapper {
  position: relative;
  background-color: #f5f5f5;
}

.lazy-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.adw-lazyload-wrapper.loaded .lazy-spinner,
.adw-lazyload-wrapper:has(.lazyloaded) .lazy-spinner {
  opacity: 0;
  pointer-events: none;
}

.page-my-account #content .links a:hover i {
  color: var(--adw-primary);
}

.btn.btn-primary.form-control-submit, 
.psgdprinfo17 a.psgdprgetdatabtn17 {
padding: 0.5rem 1.5rem;
  background-color: var(--adw-primary);
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  color: #ffffff;
  font-size: 1.1rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.5px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}


.btn.btn-primary.form-control-submit:hover, 
.psgdprinfo17 a:hover{
  background-color: var(--adw-primary-light);
}

.order-actions a,
#order-infos a,
#order-products a,
.page-footer a{
    color: var(--adw-primary);
}

.alert{
    border-radius: var(--adw-buttons-radius-small);
}

#payment-confirmation .btn.btn-primary:not(.disabled):not(.loading), 
.transform_devis a.btn.btn-primary, 
#submitQuotation {
  padding: 0.5rem 1.5rem;
  background-color: var(--adw-primary);
  border: none;
  border-radius: var(--adw-buttons-radius-small);
  color: #ffffff;
  font-size: 1.1rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.5px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.back-return{
    display: inline-block;
    margin-top: 1rem;
    color: var(--adw-primary);
    text-decoration: none;
    transition: all 0.2s ease;
}

.back-return:hover{
    color: var(--adw-primary-light);
}


/** ============================================
   PAGE DVISUALISATION DEVIS - CONFIRMATION
============================================ */


.opart-confirmation {
    max-width: 680px;
    margin: 2rem auto;
    text-align: center;
    padding: 0 1rem;
}

.opart-confirmation__icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #E6254F 0%, #c91e42 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    box-shadow: 0 8px 24px rgba(230, 37, 79, 0.25);
}

.opart-confirmation__icon svg {
    width: 36px;
    height: 36px;
    color: #fff;
}

.opart-confirmation__title {
    font-size: 1.75rem;
    font-weight: 700;
    color: #4A4745;
    margin-bottom: 0.5rem;
    letter-spacing: -0.02em;
}

.opart-confirmation__subtitle {
    font-size: 1rem;
    color: #7a7572;
    margin-bottom: 2rem;
}

.opart-confirmation__card {
    background: #fff;
    border: 1px solid #e8e4df;
    border-radius: 12px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 3px rgba(74, 71, 69, 0.06);
}

.opart-confirmation__actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.opart-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.875rem 1.5rem;
    border-radius: 8px;
    font-size: 0.938rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    width: 100%;
    text-align: center;
}

.opart-btn--primary {
    background: linear-gradient(135deg, #E6254F 0%, #c91e42 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(230, 37, 79, 0.3);
}

.opart-btn--primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(230, 37, 79, 0.4);
    color: #fff;
    text-decoration: none;
}

.opart-btn--primary svg {
    color: #fff;
}

.opart-btn--secondary {
    background: #fff;
    color: #4A4745;
    border: 1.5px solid #e8e4df;
}

.opart-btn--secondary:hover {
    border-color: #4A4745;
    background: #fafaf9;
    color: #4A4745;
    text-decoration: none;
}

.opart-confirmation__footer {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

.opart-link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    color: #7a7572;
    text-decoration: none;
    padding: 0.5rem 0.75rem;
   border-radius: var(--adw-buttons-radius-small);
    transition: all 0.2s ease;
}

.opart-link:hover {
    color: #E6254F;
    background: rgba(230, 37, 79, 0.05);
    text-decoration: none;
}

.opart-link svg {
    width: 16px;
    height: 16px;
}

@media (min-width: 480px) {
    .opart-confirmation__actions {
        flex-direction: row;
    }

    .opart-btn {
        flex: 1;
    }
}


/** ============================================
   PAGE LISTE DEVIS
============================================ */

/* ── Layout ── */
.opart-quotes {
    max-width: 960px;
    margin: 1rem auto 2rem;
    padding: 0 1rem;
}

.opart-quotes__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.opart-quotes__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #4A4745;
    letter-spacing: -0.02em;
    margin: 0;
}

.opart-quotes__count {
    font-size: 0.813rem;
    color: #7a7572;
    background: #f5f3f0;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-weight: 500;
}

/* ── Alert ── */
.opart-alert {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1rem;
    border-radius: var(--adw-buttons-radius-small);
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 1.25rem;
}

.opart-alert--success {
    background: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.opart-alert--success svg { color: #22c55e; }

/* ── Cards list ── */
.opart-quote-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.opart-quote-card {
    background: #fff;
    border: 1px solid #e8e4df;
    border-radius: 12px;
    padding: 1.25rem;
    transition: all 0.2s ease;
}

.opart-quote-card:hover {
    border-color: #d1cdc8;
    box-shadow: 0 2px 8px rgba(74, 71, 69, 0.08);
}

.opart-quote-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.opart-quote-card__info {
    flex: 1;
    min-width: 200px;
}

.opart-quote-card__name-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
}

.opart-quote-card__name {
    font-size: 1rem;
    font-weight: 600;
    color: #4A4745;
}

.opart-quote-card__id {
    font-size: 0.75rem;
    color: #9a9693;
    background: #f5f3f0;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-weight: 500;
}

.opart-quote-card__edit-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #9a9693;
    padding: 0.25rem;
    border-radius: 4px;
    transition: all 0.15s ease;
    display: inline-flex;
}

.opart-quote-card__edit-btn:hover {
    color: #E6254F;
    background: rgba(230, 37, 79, 0.06);
}

.opart-quote-card__meta {
    display: flex;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.opart-quote-card__meta-item {
    font-size: 0.813rem;
    color: #7a7572;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.opart-quote-card__meta-item svg {
    width: 14px;
    height: 14px;
    color: #b0adaa;
}

/* ── Rename inline ── */
.opart-quote-card__rename {
    display: none;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f0eeeb;
}

.opart-quote-card__rename.is-open {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.opart-quote-card__rename input {
    flex: 1;
    padding: 0.5rem 0.75rem;
    border: 1.5px solid #e8e4df;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #4A4745;
    outline: none;
    transition: border-color 0.15s ease;
}

.opart-quote-card__rename input:focus {
    border-color: #E6254F;
}

.opart-quote-card__rename button {
    padding: 0.5rem 1rem;
    background: #4A4745;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.813rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease;
}

.opart-quote-card__rename button:hover {
    background: #3a3735;
}

/* ── Actions ── */
.opart-quote-card__actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-shrink: 0;
}

.opart-action {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    border-radius: 8px;
    font-size: 0.813rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.15s ease;
    cursor: pointer;
    border: none;
    white-space: nowrap;
}

.opart-action svg {
    width: 16px;
    height: 16px;
}

.opart-action--checkout {
    background: #E6254F;
    color: #fff;
}

.opart-action--checkout:hover {
    background: #c91e42;
    color: #fff;
    text-decoration: none;
}

.opart-action--modify {
    background: #f5f3f0;
    color: #4A4745;
}

.opart-action--modify:hover {
    background: #eae7e3;
    color: #4A4745;
    text-decoration: none;
}

.opart-action--order {
    background: rgba(230, 37, 79, 0.08);
    color: #E6254F;
}

.opart-action--order:hover {
    background: rgba(230, 37, 79, 0.14);
    color: #c91e42;
    text-decoration: none;
}

.opart-action--download {
    background: #f5f3f0;
    color: #4A4745;
}

.opart-action--download:hover {
    background: #eae7e3;
    color: #4A4745;
    text-decoration: none;
}

.opart-action--delete {
    background: none;
    color: #b0adaa;
    padding: 0.5rem;
}

.opart-action--delete:hover {
    color: #E6254F;
    background: rgba(230, 37, 79, 0.06);
}

/* ── Status badge ── */
.opart-badge {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.625rem;
    border-radius: 20px;
    white-space: nowrap;
}

.opart-badge--expired {
    background: #fef2f2;
    color: #991b1b;
}

/* ── Empty state ── */
.opart-empty {
    text-align: center;
    padding: 3rem 1rem;
}

.opart-empty__icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #f5f3f0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
}

.opart-empty__icon svg {
    width: 28px;
    height: 28px;
    color: #b0adaa;
}

.opart-empty__text {
    font-size: 1rem;
    color: #7a7572;
}

/* ── Footer nav ── */
.opart-quotes__footer {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-top: 2rem;
    flex-wrap: wrap;
}

.opart-quotes__footer-link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    color: #7a7572;
    text-decoration: none;
    padding: 0.5rem 0.75rem;
   border-radius: var(--adw-buttons-radius-small);
    transition: all 0.15s ease;
}

.opart-quotes__footer-link:hover {
    color: #E6254F;
    background: rgba(230, 37, 79, 0.05);
    text-decoration: none;
}

.opart-quotes__footer-link svg {
    width: 16px;
    height: 16px;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .opart-quote-card__top {
        flex-direction: column;
    }

    .opart-quote-card__actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .opart-action {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .opart-action--delete {
        flex: 0;
    }
}


#module-opartdevis-listquotation #content-wrapper {
 width: 100%;
}

/** ============================================
   BLOC DEVIS PANIER - AVERTISSEMENTS & INFORMATIONS
============================================ */

.opart-notice {
    display: flex;
    gap: 0.875rem;
    padding: 1rem 1.25rem;
    border-radius: var(--adw-buttons-radius-small);
    margin-bottom: 1.25rem;
    font-size: 0.875rem;
    line-height: 1.5;
    align-items: flex-start;
}

.opart-notice--warning {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
}

.opart-notice--info {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
}

.opart-notice__icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 1px;
}

.opart-notice--warning .opart-notice__icon { color: #f59e0b; }
.opart-notice--info .opart-notice__icon { color: #3b82f6; }

.opart-notice__body {
    flex: 1;
}

.opart-notice__text {
    margin: 0 0 0.625rem;
}

.opart-notice__text strong {
    font-weight: 600;
}

.opart-notice__link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.875rem;
   border-radius: var(--adw-buttons-radius-small);
    font-size: 0.813rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.15s ease;
}

.opart-notice--warning .opart-notice__link {
    background: rgba(245, 158, 11, 0.15);
    color: #92400e;
}

.opart-notice--warning .opart-notice__link:hover {
    background: rgba(245, 158, 11, 0.25);
    text-decoration: none;
}

.opart-notice--info .opart-notice__link {
    background: rgba(59, 130, 246, 0.12);
    color: #1e40af;
}

.opart-notice--info .opart-notice__link:hover {
    background: rgba(59, 130, 246, 0.2);
    text-decoration: none;
}

.opart-notice__link svg {
    width: 14px;
    height: 14px;
}



/** ============================================
    PAGE À PROPOS - NOTRE HISTOIRE, NOS ENGAGEMENTS, ETC.
============================================ */

.opart-about {
    max-width: 1440px;
    margin: 0 auto;
    padding: 2rem 1rem 3rem;
}

/* ── Hero ── */
.opart-about__hero {
    text-align: center;
    margin-bottom: 3rem;
}

.opart-about__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #E6254F;
    background: rgba(230, 37, 79, 0.07);
    padding: 0.375rem 0.875rem;
    border-radius: 20px;
    margin-bottom: 1rem;
}

.opart-about__badge svg {
    width: 14px;
    height: 14px;
}

.opart-about__title {
    font-size: 2rem;
    font-weight: 800;
    color: #4A4745;
    letter-spacing: -0.03em;
    margin: 0 0 0.75rem;
    line-height: 1.2;
}

.opart-about__intro {
    font-size: 1.063rem;
    color: #7a7572;
    line-height: 1.7;
    max-width: 600px;
    margin: 0 auto;
}

/* ── Stats ── */
.opart-about__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 3rem;
}

.opart-stat {
    text-align: center;
    padding: 1.5rem 1rem;
    background: #fff;
    border: 1px solid #e8e4df;
    border-radius: 12px;
}

.opart-stat__number {
    font-size: 2rem;
    font-weight: 800;
    color: #E6254F;
    line-height: 1;
    margin-bottom: 0.375rem;
}

.opart-stat__label {
    font-size: 0.813rem;
    color: #7a7572;
    font-weight: 500;
}

/* ── Sections ── */
.opart-about__sections {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.opart-section {
    background: #fff;
    border: 1px solid #e8e4df;
     border-radius: var(--adw-buttons-radius-small);
    padding: 2rem;
    transition: box-shadow 0.2s ease;
}

.opart-section:hover {
    box-shadow: 0 4px 16px rgba(74, 71, 69, 0.07);
}

.opart-section__header {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-bottom: 1.25rem;
}

.opart-section__icon {
    width: 44px;
    height: 44px;
    border-radius: var(--adw-buttons-radius-small);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.opart-section__icon--red {
    background: rgba(230, 37, 79, 0.08);
    color: #E6254F;
}

.opart-section__icon--gold {
    background: rgba(227, 216, 176, 0.4);
    color: #b5a46a;
}

.opart-section__icon--dark {
    background: rgba(74, 71, 69, 0.08);
    color: #4A4745;
}

.opart-section__icon svg {
    width: 22px;
    height: 22px;
}

.opart-section__title {
    font-size: 1.188rem;
    font-weight: 700;
    color: #4A4745;
    margin: 0;
}

.opart-section__text {
    font-size: 0.938rem;
    color: #5c5956;
    line-height: 1.75;
    margin: 0;
}

.opart-section__text + .opart-section__text {
    margin-top: 0.75rem;
}

.opart-section__text strong {
    color: #4A4745;
    font-weight: 600;
}

/* ── Engagements ── */
.opart-commitments {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.opart-commitment {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1rem;
    background: #fafaf9;
    border-radius: var(--adw-buttons-radius-small);
    border: 1px solid #f0eeeb;
}

.opart-commitment__check {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #E6254F;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.opart-commitment__check svg {
    width: 12px;
    height: 12px;
    color: #fff;
}

.opart-commitment__label {
    font-size: 0.813rem;
    font-weight: 600;
    color: #4A4745;
}

/* ── Zone couverture ── */
.opart-coverage {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.875rem;
}

.opart-coverage__tag {
    font-size: 0.75rem;
    font-weight: 500;
    color: #7a7572;
    background: #f5f3f0;
    padding: 0.25rem 0.625rem;
    border-radius: var(--adw-buttons-radius-small);
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .opart-about__title {
        font-size: 1.5rem;
    }

    .opart-about__stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.625rem;
    }

    .opart-stat {
        padding: 1rem 0.5rem;
    }

    .opart-stat__number {
        font-size: 1.5rem;
    }

    .opart-commitments {
        grid-template-columns: 1fr;
    }

    .opart-section {
        padding: 1.5rem;
    }
}

/** ============================================
    PAGE LOGIN - AUTHENTIFICATION
============================================ */

.page-authentication #content, .page-registration #content{
  border-radius: var(--adw-buttons-radius-small);
  width: 100% ;
  max-width: 100%;
}

.opart-login {
  max-width: 52rem;
  margin: 2rem auto;
  padding: 0 1rem;
}

.opart-login__card {
  background: #fff;
  /* border: 1px solid #e8e4df; */
  /* border-radius: var(--adw-buttons-radius-small); */
  padding: 2.5rem 2rem;
  padding-bottom: 0px;
  /* box-shadow: 0 1px 3px rgba(74, 71, 69, 0.06); */
}

.opart-login__header {
  text-align: center;
  margin-bottom: 2rem;
}

.opart-login__icon {
  width: 56px;
  height: 56px;
  border-radius: var(--adw-buttons-radius-small);
  background: rgba(230, 37, 79, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
}

.opart-login__icon svg {
  width: 26px;
  height: 26px;
  color: #E6254F;
}

.opart-login__title {
  font-size: 1.375rem;
  font-weight: 700;
  color: #4A4745;
  margin: 0 0 0.375rem;
  letter-spacing: -0.02em;
}

.opart-login__subtitle {
  font-size: 0.875rem;
  color: #7a7572;
  margin: 0;
}

/* ── Form fields ── */
.opart-login__fields {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.opart-login__field {
  position: relative;
}

.opart-login__field label {
  display: block;
  font-size: 0.813rem;
  font-weight: 600;
  color: #4A4745;
  margin-bottom: 0.375rem;
}

.opart-login__field .form-control,
.opart-login__field input[type="email"],
.opart-login__field input[type="password"],
.opart-login__field input[type="text"] {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1.5px solid #e8e4df;
  border-radius: var(--adw-buttons-radius-small);
  font-size: 0.938rem;
  color: #4A4745;
  background: #fafaf9;
  transition: all 0.15s ease;
  outline: none;
  box-sizing: border-box;
}

.opart-login__field input:focus {
  border-color: #E6254F;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(230, 37, 79, 0.08);
}

.opart-login__field input::placeholder {
  color: #b0adaa;
}

/* ── Forgot password ── */
.opart-login__forgot {
  text-align: right;
  margin-top: -0.25rem;
}

.opart-login__forgot a {
  font-size: 0.813rem;
  color: #E6254F;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.15s ease;
}

.opart-login__forgot a:hover {
  color: #c91e42;
  text-decoration: underline;
}

/* ── Submit ── */
.opart-login__submit {
    width: 100%;
    padding: 0.875rem;
    background: #E6254F;
    color: #fff;
    border: none;
    border-radius: var(--adw-buttons-radius-small);
    font-size: 0.938rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: color 0.3s ease;
}

.opart-login__submit::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #4A4745;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.opart-login__submit:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.opart-login__submit:hover {
    color: #fff;
}

.opart-login__submit svg {
    width: 18px;
    height: 18px;
}

/* ── Divider ── */
.opart-login__divider {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 1.5rem 0;
}

.opart-login__divider::before,
.opart-login__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #e8e4df;
}

.opart-login__divider span {
  font-size: 0.75rem;
  color: #b0adaa;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* ── Links ── */
.opart-login__links {
  text-align: center;
}

.opart-login__links p {
  font-size: 0.875rem;
  color: #7a7572;
  margin: 0 0 0.5rem;
}

.opart-login__links a {
  color: #E6254F;
  font-weight: 600;
  text-decoration: none;
}

.opart-login__links a:hover {
  text-decoration: underline;
}

/* ── Errors ── */
.opart-login .alert-danger {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
  border-radius: var(--adw-buttons-radius-small);
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  margin-bottom: 1.25rem;
}

/* ── Override PS form-group ── */
.opart-login .form-group {
  margin-bottom: 0;
}

.opart-login .form-group .form-control-label {
  font-size: 0.813rem;
  font-weight: 600;
  color: #4A4745;
}

.opart-login .form-group .form-control-comment {
  display: none;
}


/** ============================================
    PAGE CONTACT - FORMULAIRE DE CONTACT, SUPPORT, FAQ, ETC.
============================================ */


 .opart-contact {
    /* max-width: 640px; */
    margin: 2rem auto;
    padding: 0 1rem;
}

.opart-contact__header {
    text-align: center;
    margin-bottom: 2rem;
}

.opart-contact__icon {
    width: 56px;
    height: 56px;
      border-radius: var(--adw-buttons-radius-small);
    background: rgba(230, 37, 79, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
}

.opart-contact__icon svg {
    width: 26px;
    height: 26px;
    color: #E6254F;
}

.opart-contact__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #4A4745;
    margin: 0 0 0.375rem;
    letter-spacing: -0.02em;
}

.opart-contact__subtitle {
    font-size: 0.875rem;
    color: #7a7572;
    margin: 0;
    line-height: 1.6;
}

/* ── Notifications ── */
.opart-contact__notif {
    display: flex;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--adw-buttons-radius-small);
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
    align-items: flex-start;
}

.opart-contact__notif--success {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.opart-contact__notif--success svg { color: #22c55e; }

.opart-contact__notif--error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.opart-contact__notif--error svg { color: #ef4444; }

.opart-contact__notif ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.opart-contact__notif li + li {
    margin-top: 0.25rem;
}

/* ── Card ── */
.opart-contact__card {
    background: #fff;
    border: 1px solid #e8e4df;
      border-radius: var(--adw-buttons-radius-small);
    padding: 2rem;
    box-shadow: 0 1px 3px rgba(74, 71, 69, 0.06);
}

/* ── Fields ── */
.opart-contact__fields {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.opart-contact__field {
    display: flex;
    flex-direction: column;
}

.opart-contact__field label,
.opart-contact__label {
    font-size: 0.813rem;
    font-weight: 600;
    color: #4A4745;
    margin-bottom: 0.375rem;
}

.opart-contact__field select,
.opart-contact__field input[type="email"],
.opart-contact__field input[type="text"],
.opart-contact__field input[type="file"],
.opart-contact__field textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1.5px solid #e8e4df;
    border-radius: var(--adw-buttons-radius-small);
    font-size: 0.938rem;
    color: #4A4745;
    background: #fafaf9;
    transition: all 0.15s ease;
    outline: none;
    font-family: inherit;
    box-sizing: border-box;
    -webkit-appearance: none;
}

.opart-contact__field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 24 24' stroke='%237a7572' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    padding-right: 2.5rem;
    cursor: pointer;
}

.opart-contact__field select:focus,
.opart-contact__field input:focus,
.opart-contact__field textarea:focus {
    border-color: #E6254F;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(230, 37, 79, 0.08);
}

.opart-contact__field input::placeholder,
.opart-contact__field textarea::placeholder {
    color: #b0adaa;
}

.opart-contact__field textarea {
    resize: vertical;
    min-height: 120px;
}

/* ── File upload ── */
.opart-contact__file-wrapper {
    position: relative;
}

.opart-contact__field input[type="file"] {
    padding: 0.625rem 1rem;
    font-size: 0.813rem;
    cursor: pointer;
}

.opart-contact__file-hint {
    font-size: 0.75rem;
    color: #b0adaa;
    margin-top: 0.25rem;
}

/* ── Row 2 cols ── */
.opart-contact__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* ── GDPR ── */
.opart-contact__gdpr {
    margin-top: 0.5rem;
    font-size: 0.813rem;
    color: #7a7572;
}

/* ── Footer ── */
.opart-contact__footer {
    margin-top: 1.75rem;
    display: flex;
    justify-content: flex-end;
}

.opart-contact__submit {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 0.875rem 2rem;
background: #E6254F;
color: #fff;
border: none;
border-radius: var(--adw-buttons-radius-small);
font-size: 0.938rem;
font-weight: 700;
cursor: pointer;
font-family: inherit;
position: relative;
overflow: hidden;
z-index: 1;
transition: color 0.3s ease;
}

.opart-contact__submit::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #4A4745;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.opart-contact__submit:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.opart-contact__submit:hover {
    color: #fff;
}

.opart-contact__submit svg {
    width: 18px;
    height: 18px;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .opart-contact__card {
        padding: 1.5rem;
    }

    .opart-contact__row {
        grid-template-columns: 1fr;
    }

    .opart-contact__footer {
        justify-content: stretch;
    }

    .opart-contact__submit {
        width: 100%;
    }
}


/** ============================================
    BULOC DEVIS PANIER - BOUTONS D'ACTION PRINCIPAUX (CRÉER UN DEVIS, DEMANDER UN DEVIS, ETC.)
============================================ */


  .opart-devis-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border: none;
    border-radius: var(--adw-buttons-radius-small);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    font-family: inherit;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: color 0.3s ease;
    width: 100%;
}

.opart-devis-btn svg {
    width: 18px;
    height: 18px;
    transition: transform 0.3s ease;
}

.opart-devis-btn:hover svg {
    transform: translateX(3px);
}

/* Créer un devis — primary */
.opart-devis-btn--create {
    background: #E6254F;
    color: #fff;
    margin-bottom: 1rem;
}

.opart-devis-btn--create::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #4A4745;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.opart-devis-btn--create:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.opart-devis-btn--create:hover {
    color: #fff;
    text-decoration: none;
}

/* Demander un devis — outline */
.opart-devis-btn--request {
    background: transparent;
    color: #4A4745;
    border: 1.5px solid #4A4745;
}

.opart-devis-btn--request::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #4A4745;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.opart-devis-btn--request:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.opart-devis-btn--request:hover {
    color: #fff;
    text-decoration: none;
}



/** ============================================
    PAGE DEVIS - AFFICHAGE D'UN DEVIS, AVEC TOUS LES DÉTAILS, LES INFORMATIONS SUR LE CLIENT, LES CONDITIONS, ETC.
============================================ */



.opart-quotation {
    /* max-width: 720px; */
    margin: 2rem auto;
    padding: 0 1rem;
}

/* ── Header ── */
.opart-quotation__header {
    text-align: center;
    margin-bottom: 2rem;
}

.opart-quotation__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #E6254F;
    background: rgba(230, 37, 79, 0.07);
    padding: 0.375rem 0.875rem;
    border-radius: 20px;
    margin-bottom: 1rem;
}

.opart-quotation__badge svg {
    width: 14px;
    height: 14px;
}

.opart-quotation__title {
    font-size: 1.75rem;
    font-weight: 800;
    color: #4A4745;
    letter-spacing: -0.03em;
    margin: 0 0 0.5rem;
}

.opart-quotation__subtitle {
    font-size: 0.938rem;
    color: #7a7572;
    line-height: 1.6;
    margin: 0;
}

/* ── Alerts ── */
.opart-quotation__alert {
    display: flex;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
   border-radius: var(--adw-buttons-radius-small);
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
    align-items: flex-start;
}

.opart-quotation__alert svg {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.opart-quotation__alert--success {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.opart-quotation__alert--success p {
margin-bottom: 0;
}

.opart-quotation__alert--success svg { color: #22c55e; }

.opart-quotation__alert--error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.opart-quotation__alert--error svg { color: #ef4444; }

.opart-quotation__alert ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.opart-quotation__alert li + li {
    margin-top: 0.25rem;
}

/* ── Sections ── */
.opart-quotation__section {
    background: #fff;
    border: 1px solid #e8e4df;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
}

.opart-quotation__section-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.opart-quotation__section-icon {
    width: 40px;
    height: 40px;
   border-radius: var(--adw-buttons-radius-small);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.opart-quotation__section-icon--red   { background: rgba(230, 37, 79, 0.08); color: #E6254F; }
.opart-quotation__section-icon--gold  { background: rgba(227, 216, 176, 0.4); color: #b5a46a; }
.opart-quotation__section-icon--dark  { background: rgba(74, 71, 69, 0.08); color: #4A4745; }

.opart-quotation__section-icon svg {
    width: 20px;
    height: 20px;
}

.opart-quotation__section-title {
    font-size: 1.063rem;
    font-weight: 700;
    color: #4A4745;
    margin: 0;
}

/* ── Grid ── */
.opart-quotation__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* ── Fields ── */
.opart-quotation__field {
    display: flex;
    flex-direction: column;
}

.opart-quotation__field--full {
    grid-column: 1 / -1;
}

.opart-quotation__field label {
    font-size: 0.813rem;
    font-weight: 600;
    color: #4A4745;
    margin-bottom: 0.375rem;
    text-align: left;
}

.opart-quotation__field label .required {
    color: #E6254F;
}

.opart-quotation__field input,
.opart-quotation__field textarea,
.opart-quotation__field select {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1.5px solid #e8e4df;
   border-radius: var(--adw-buttons-radius-small);
    font-size: 0.938rem;
    color: #4A4745;
    background: #fafaf9;
    transition: all 0.15s ease;
    outline: none;
    font-family: inherit;
    box-sizing: border-box;
    -webkit-appearance: none;
}

.opart-quotation__field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 24 24' stroke='%237a7572' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    padding-right: 2.5rem;
    cursor: pointer;
}

.opart-quotation__field input:focus,
.opart-quotation__field textarea:focus,
.opart-quotation__field select:focus {
    border-color: #E6254F;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(230, 37, 79, 0.08);
}

.opart-quotation__field input::placeholder,
.opart-quotation__field textarea::placeholder {
    color: #b0adaa;
}

.opart-quotation__field textarea {
    resize: vertical;
    min-height: 120px;
}

/* ── File upload ── */
.opart-quotation__field input[type="file"] {
    padding: 0.625rem 1rem;
    font-size: 0.813rem;
    cursor: pointer;
}

.opart-quotation__field-hint {
    font-size: 0.75rem;
    color: #b0adaa;
    margin-top: 0.25rem;
}

/* ── Captcha ── */
.opart-quotation__captcha {
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}

/* ── Footer ── */
.opart-quotation__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.5rem;
    gap: 1rem;
}

.opart-quotation__footer-links {
    display: flex;
    gap: 0.75rem;
}

.opart-quotation__back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    color: #7a7572;
    text-decoration: none;
    padding: 0.5rem 0.75rem;
    border-radius: var(--adw-buttons-radius-small);
    transition: all 0.15s ease;
}

.opart-quotation__back-link:hover {
    color: #E6254F;
    background: rgba(230, 37, 79, 0.05);
    text-decoration: none;
}

.opart-quotation__back-link svg {
    width: 16px;
    height: 16px;
}

.opart-quotation__required-note {
    font-size: 0.813rem;
    color: #b0adaa;
    margin: 0;
}

.opart-quotation__required-note .required { color: #E6254F; }

/* ── Submit ── */
.opart-quotation__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.875rem 1.75rem;
    background: #E6254F;
    color: #fff;
    border: none;
    border-radius: var(--adw-buttons-radius-small);
    font-size: 0.938rem;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: color 0.3s ease;
}

.opart-quotation__submit::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #4A4745;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.opart-quotation__submit:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.opart-quotation__submit:hover {
    color: #fff;
}

.opart-quotation__submit svg {
    width: 18px;
    height: 18px;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .opart-quotation__title {
        font-size: 1.375rem;
    }

    .opart-quotation__grid {
        grid-template-columns: 1fr;
    }

    .opart-quotation__footer {
        flex-direction: column;
    }

    .opart-quotation__submit {
        width: 100%;
    }

    .opart-quotation__footer-links {
        width: 100%;
        justify-content: center;
    }
}


/** ============================================
    Filtre de recherche - Composant de filtrage avancé avec options multiples, recherche intégrée, etc.
============================================ */


.opart-facet {
    margin-bottom: 0.75rem;
    position: relative;
}

/* ── Toggle ── */
.opart-facet__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: #fff;
    border: 1.5px solid #e8e4df;
    border-radius: var(--adw-buttons-radius-small);
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.opart-facet__toggle:hover {
    border-color: #d1cdc8;
}

.opart-facet.is-open .opart-facet__toggle {
    border-color: #E6254F;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.opart-facet__label {
    font-size: 0.813rem;
    font-weight: 600;
    color: #4A4745;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.opart-facet__placeholder {
    font-weight: 400;
    color: #b0adaa;
}

.opart-facet__active-value {
    font-weight: 500;
    color: #E6254F;
    font-size: 0.75rem;
    background: rgba(230, 37, 79, 0.07);
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.opart-facet__chevron {
    width: 18px;
    height: 18px;
    color: #b0adaa;
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    flex-shrink: 0;
}

.opart-facet.is-open .opart-facet__chevron {
    transform: rotate(180deg);
    color: #E6254F;
}

/* ── Dropdown ── */
.opart-facet__dropdown {
    display: none;
    background: #fff;
    border: 1.5px solid #E6254F;
    border-top: none;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    max-height: 280px;
    overflow: hidden;
    flex-direction: column;
}

.opart-facet.is-open .opart-facet__dropdown {
    display: flex;
}

/* ── Search ── */
.opart-facet__search {
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid #f0eeeb;
    flex-shrink: 0;
}

.opart-facet__search-input {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2rem;
    border: 1.5px solid #e8e4df;
    border-radius: 8px;
    font-size: 0.813rem;
    color: #4A4745;
    background: #fafaf9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24' stroke='%23b0adaa' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E") no-repeat 0.625rem center;
    outline: none;
    transition: all 0.15s ease;
    box-sizing: border-box;
    font-family: inherit;
}

.opart-facet__search-input:focus {
    border-color: #E6254F;
    background-color: #fff;
}

.opart-facet__search-input::placeholder {
    color: #b0adaa;
}

/* ── List ── */
.opart-facet__list {
    overflow-y: auto;
    overscroll-behavior: contain;
    flex: 1;
    padding: 0.375rem;
}

.opart-facet__list::-webkit-scrollbar { width: 4px; }
.opart-facet__list::-webkit-scrollbar-track { background: transparent; }
.opart-facet__list::-webkit-scrollbar-thumb { background: #e8e4df; border-radius: 4px; }
.opart-facet__list::-webkit-scrollbar-thumb:hover { background: #d1cdc8; }

/* ── Option ── */
.opart-facet__option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.625rem;
    border-radius: 6px;
    text-decoration: none;
    color: #4A4745;
    font-size: 0.813rem;
    transition: all 0.12s ease;
}

.opart-facet__option:hover {
    background: rgba(230, 37, 79, 0.05);
    color: #E6254F;
    text-decoration: none;
}

.opart-facet__option.is-active {
    background: rgba(230, 37, 79, 0.08);
    color: #E6254F;
    font-weight: 600;
}

.opart-facet__option-value {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.opart-facet__option-check {
    width: 16px;
    height: 16px;
    border: 1.5px solid #d1cdc8;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.opart-facet__option:hover .opart-facet__option-check { border-color: #E6254F; }
.opart-facet__option.is-active .opart-facet__option-check { background: #E6254F; border-color: #E6254F; }
.opart-facet__option-check svg { width: 10px; height: 10px; color: #fff; display: none; }
.opart-facet__option.is-active .opart-facet__option-check svg { display: block; }

.opart-facet__option-count {
    font-size: 0.688rem;
    color: #b0adaa;
    background: #f5f3f0;
    padding: 0.125rem 0.4rem;
    border-radius: 4px;
    font-weight: 500;
    flex-shrink: 0;
}

.opart-facet__option:hover .opart-facet__option-count {
    background: rgba(230, 37, 79, 0.08);
    color: #E6254F;
}

.opart-facet__option--hidden { display: none; }

.opart-facet__no-result {
    text-align: center;
    padding: 1rem;
    font-size: 0.813rem;
    color: #b0adaa;
    display: none;
    margin: 0;
}

#search_filters, #search_filters_brands, #search_filters_suppliers{
  padding: 0px;
}

#search_filters .facet .facet-title{
  width: 100%;
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .opart-facet__dropdown {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1050;
        border: none;
        border-radius: 16px 16px 0 0;
        max-height: 70vh;
        box-shadow: 0 -8px 30px rgba(74, 71, 69, 0.15);
    }

    .opart-facet__dropdown-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid #f0eeeb;
        flex-shrink: 0;
    }

    .opart-facet__dropdown-title { font-size: 1rem; font-weight: 700; color: #4A4745; }

    .opart-facet__dropdown-close {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: #f5f3f0;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        color: #4A4745;
    }

    .opart-facet__dropdown-close:hover { background: rgba(230, 37, 79, 0.08); color: #E6254F; }
    .opart-facet__dropdown-close svg { width: 18px; height: 18px; }

    .opart-facet__backdrop {
        display: none;
        position: fixed;
        top: 0; left: 0; right: 0; bottom: 0;
        background: rgba(74, 71, 69, 0.4);
        z-index: 1049;
    }

    .opart-facet.is-open .opart-facet__backdrop { display: block; }
    .opart-facet__list { padding: 0.5rem 0.75rem; }
    .opart-facet__option { padding: 0.75rem 0.625rem; }
}

@media (min-width: 769px) {
    .opart-facet__dropdown-header { display: none; }
    .opart-facet__backdrop { display: none !important; }

}
@media (max-width: 769px) {

  article, aside, details, figcaption, figure, footer, header, main, menu, nav, section:not(.adwcore__featured-products), summary {
    display: flex;
    flex-direction: column;
}
#category #js-product-list-header{
  order: 23;
}

#category #products {
    order: 1;
}

#adw-subcategories-sidebar{display: none;}
    #search_filters_brands{display: none;}
}
 



/** ============================================
   Code promo
============================================ */




/* ── Block Promo Code ── */
.block-promo {
  margin: 1rem 0;
  font-family: 'Roboto', sans-serif;
}

/* Lien "Vous avez un code promo ?" */
.promo-code-button.display-promo {
  margin: 0;
}

.promo-code-button .collapse-button {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--adw-primary, #E6254F);
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: .02em;
  transition: opacity .2s;
}

.promo-code-button .collapse-button::before {
  content: '\e8b9'; /* material icon: local_offer */
  font-family: 'Material Icons';
  font-size: 1rem;
  line-height: 1;
}

.promo-code-button .collapse-button:hover {
  opacity: .75;
  text-decoration: none;
}

/* Zone dépliable */
#promo-code.collapse,
#promo-code.collapsing {
  transition: height .25s ease;
}

.promo-code {
  margin-top: .75rem;
  padding: 1.1rem 1.25rem;
  background: #fafafa;
  border: 1.5px solid #ede8d8;          /* ton accent adouci */
  border-left: 3px solid var(--adw-primary, #E6254F);
  border-radius: var(--adw-buttons-radius-small, .25rem);
}

/* Formulaire : input + bouton côte à côte */
.promo-code form {
  display: flex;
  gap: .5rem;
  align-items: stretch;
}

.promo-code .promo-input {
  flex: 1;
  height: 42px;
  padding: 0 .9rem;
  font-size: .875rem;
  font-family: inherit;
  color: var(--adw-secondary, #4A4745);
  background: #fff;
  border: 1.5px solid #d5cdb8;
  border-radius: var(--adw-buttons-radius-small, .25rem);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}

.promo-code .promo-input::placeholder {
  color: #b0a898;
  font-style: italic;
}

.promo-code .promo-input:focus {
  border-color: var(--adw-primary, #E6254F);
  box-shadow: 0 0 0 3px rgba(230, 37, 79, .12);
}

/* Bouton Ajouter */
.promo-code .btn.btn-primary {
  height: 42px;
  padding: 0 1.25rem;
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #fff;
  background: var(--adw-primary, #E6254F);
  border: none;
  border-radius: var(--adw-buttons-radius-small, .25rem);
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s, transform .15s;
  margin-top: 0px;
}

.promo-code .btn.btn-primary:hover {
  background: #c41e43;
  transform: translateY(-1px);
}

.promo-code .btn.btn-primary:active {
  transform: translateY(0);
}

/* Alerte erreur */
.promo-code .alert.alert-danger {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin: .65rem 0 0;
  padding: .55rem .85rem;
  font-size: .8rem;
  color: #922;
  background: #fff0f2;
  border: 1px solid #f5c6cb;
  border-radius: var(--adw-buttons-radius-small, .25rem);
}

.promo-code .alert.alert-danger:empty,
.promo-code .js-error:not(.show) {
  display: none;
}

/* Lien "Fermer" */
.promo-code .cancel-promo {
  display: inline-block;
  margin-top: .65rem;
  font-size: .78rem;
  color: #9a9188;
  text-decoration: underline;
  cursor: pointer;
  transition: color .2s;
}

.promo-code .cancel-promo:hover {
  color: var(--adw-primary, #E6254F);
}

/* Responsive : pleine largeur sur mobile */
@media (max-width: 480px) {
  .promo-code form {
    flex-direction: column;
  }

  .promo-code .btn.btn-primary {
    width: 100%;
  }
}


/*** PAGE LIVRAISON - SUIVI DE LIVRAISON, DÉTAILS DU TRANSPORTEUR, ETC. ***/

  .adw-livraison {
    --primary: #E6254F;
    --secondary: #4A4745;
    --accent: #E3D8B0;
    --dark: #2e2a2a;
    --light-bg: #f8f7f4;
    --border: #e5e0d8;
    font-family: 'Roboto', sans-serif;
    color: var(--dark);
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 16px 48px;
  }
 
  /* Intro */
  .adw-livraison__intro {
    background: var(--accent);
    border-left: 4px solid var(--primary);
    padding: 18px 22px;
    border-radius: 4px;
    margin-bottom: 40px;
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--secondary);
  }
 
  /* Transporteurs */
  .adw-livraison__transporteurs {
    display: grid;
    gap: 24px;
    margin-bottom: 48px;
  }
 
  .adw-carrier {
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
  }
 
  .adw-carrier__header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 24px;
    background: var(--light-bg);
    border-bottom: 1px solid var(--border);
  }
 
  .adw-carrier__icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
 
  .adw-carrier__icon svg {
    width: 22px;
    height: 22px;
    fill: #fff;
  }
 
  .adw-carrier__title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--dark);
    letter-spacing: 0.01em;
  }
 
  .adw-carrier__subtitle {
    margin: 2px 0 0;
    font-size: 0.8rem;
    color: var(--secondary);
    font-weight: 400;
  }
 
  .adw-carrier__badge {
    margin-left: auto;
    background: var(--primary);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
    letter-spacing: 0.03em;
    text-transform: uppercase;
  }
 
  .adw-carrier__badge--express {
    background: var(--secondary);
  }
 
  .adw-carrier__badge--regional {
    background: #6a8c5a;
  }
 
  .adw-carrier__badge--volume {
    background: #b07d3a;
  }
 
  .adw-carrier__body {
    padding: 20px 24px;
  }
 
  .adw-carrier__body p {
    margin: 0 0 14px;
    font-size: 0.93rem;
    line-height: 1.75;
    color: var(--secondary);
  }
 
  .adw-carrier__body p:last-child {
    margin-bottom: 0;
  }
 
  .adw-carrier__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
  }
 
  .adw-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    background: var(--light-bg);
    border: 1px solid var(--border);
    color: var(--dark);
  }
 
  .adw-pill__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
  }
 
  /* Table frais de port */
  .adw-livraison__frais-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--dark);
    margin: 0 0 8px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--primary);
    display: inline-block;
  }
 
  .adw-livraison__frais-intro {
    font-size: 0.92rem;
    color: var(--secondary);
    line-height: 1.7;
    margin: 12px 0 24px;
  }
 
  .adw-frais-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    margin-bottom: 20px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border);
  }
 
  .adw-frais-table thead tr {
    background: var(--secondary);
    color: #fff;
  }
 
  .adw-frais-table thead th {
    padding: 13px 18px;
    text-align: left;
    font-weight: 600;
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
 
  .adw-frais-table tbody tr {
    border-bottom: 1px solid var(--border);
    transition: background 0.15s;
  }
 
  .adw-frais-table tbody tr:last-child {
    border-bottom: none;
  }
 
  .adw-frais-table tbody tr:hover {
    background: var(--light-bg);
  }
 
  .adw-frais-table td {
    padding: 12px 18px;
    color: var(--dark);
    vertical-align: middle;
  }
 
  .adw-frais-table td:last-child {
    font-weight: 700;
    color: var(--primary);
  }
 
  .adw-frais-table tr.highlight td {
    background: #fef3f6;
    font-weight: 600;
  }
 
  .adw-frais-table tr.offert td:last-child {
    color: #2a8a50;
  }
 
  /* Notice */
  .adw-livraison__notice {
    background: var(--light-bg);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 16px 20px;
    font-size: 0.85rem;
    color: var(--secondary);
    line-height: 1.7;
    margin-top: 24px;
  }
 
  .adw-livraison__notice strong {
    color: var(--dark);
  }
 
  @media (max-width: 600px) {

    .adw-livraison{
      max-width: 100%;
      padding:0;
    }
    .adw-carrier__header {
      flex-wrap: wrap;
    }
    .adw-carrier__badge {
      margin-left: 0;
    }
    .adw-frais-table thead th,
    .adw-frais-table td {
      padding: 10px 12px;
    }
  }