/* =========================================================
   AMOUR COLLECTIVE — WooCommerce Notices
   Restyle du bandeau "ajouté au panier" et des alertes WC
   Palette : #000 / #fff / #c9c9c9 / #f5f5f5
   ========================================================= */

/* ── Reset du bandeau natif WooCommerce ─────────────────── */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
ul.woocommerce-message,
ul.woocommerce-info,
ul.woocommerce-error {
  background:    #000000 !important;
  color:         #ffffff !important;
  border:        none    !important;
  border-top:    none    !important;
  border-radius: 0       !important;
  box-shadow:    none    !important;
  padding:       0       !important;
  margin:        0       !important;
  list-style:    none    !important;
}

/* ── Conteneur interne ──────────────────────────────────── */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  display: none !important; /* supprimer l'icône native */
}

/* ── Wrapper du contenu ─────────────────────────────────── */
.woocommerce-notices-wrapper,
.woocommerce-message,
.woocommerce-info {
  width: 100%;
}

/* ── Bandeau principal ──────────────────────────────────── */
.woocommerce-message {
  display:         flex        !important;
  align-items:     center      !important;
  justify-content: space-between !important;
  gap:             24px        !important;
  padding:         16px 40px   !important;
  background:      #000000     !important;
  font-family:     'Inter', 'Helvetica Neue', Arial, sans-serif !important;
  font-size:       13px        !important;
  font-weight:     400         !important;
  letter-spacing:  0.04em      !important;
  text-transform:  uppercase   !important;
  color:           #ffffff     !important;
  border-bottom:   1px solid #333333 !important;
  position:        relative;
  z-index:         9999;
}

/* ── Texte du message ───────────────────────────────────── */
.woocommerce-message a:not(.button),
.woocommerce-message strong {
  color:          #c9c9c9     !important;
  font-weight:    400         !important;
  text-decoration: none       !important;
  font-style:     italic;
  font-family:    'Cormorant Garamond', Georgia, serif !important;
  font-size:      15px        !important;
  letter-spacing: 0.01em      !important;
  text-transform: none        !important;
}

/* ── Bouton "Voir le panier" ────────────────────────────── */
.woocommerce-message .button.wc-forward,
.woocommerce-message a.button {
  display:        inline-flex  !important;
  align-items:    center       !important;
  gap:            8px          !important;
  background:     transparent  !important;
  color:          #ffffff      !important;
  border:         1px solid #ffffff !important;
  border-radius:  0            !important;
  padding:        8px 20px     !important;
  font-family:    'Inter', 'Helvetica Neue', Arial, sans-serif !important;
  font-size:      11px         !important;
  font-weight:    500          !important;
  letter-spacing: 0.1em        !important;
  text-transform: uppercase    !important;
  text-decoration: none        !important;
  cursor:         pointer      !important;
  transition:     background 0.2s ease, color 0.2s ease !important;
  white-space:    nowrap       !important;
  flex-shrink:    0            !important;
}

.woocommerce-message .button.wc-forward:hover,
.woocommerce-message a.button:hover {
  background: #ffffff !important;
  color:      #000000 !important;
}

/* Ajouter une flèche après le texte du bouton */
.woocommerce-message .button.wc-forward::after {
  content: '→';
  font-size: 13px;
  font-weight: 300;
}

/* ── Variante info (bleu natif → style neutre) ──────────── */
.woocommerce-info {
  background:   #1a1a1a    !important;
  border-left:  2px solid #c9c9c9 !important;
  padding:      14px 40px !important;
  font-family:  'Inter', 'Helvetica Neue', Arial, sans-serif !important;
  font-size:    12px       !important;
  letter-spacing: 0.04em  !important;
  text-transform: uppercase !important;
}

/* ── Variante erreur ────────────────────────────────────── */
.woocommerce-error {
  background:   #000000    !important;
  border-left:  2px solid #c9c9c9 !important;
  padding:      14px 40px !important;
}

.woocommerce-error li {
  color:        #ffffff    !important;
  font-family:  'Inter', 'Helvetica Neue', Arial, sans-serif !important;
  font-size:    12px       !important;
  letter-spacing: 0.04em  !important;
}

/* ── Blocs WooCommerce (Gutenberg notices) ──────────────── */
.wc-block-components-notice-banner,
.wc-block-cart-notice {
  background:    #000000   !important;
  color:         #ffffff   !important;
  border:        none      !important;
  border-radius: 0         !important;
  padding:       16px 40px !important;
  font-family:   'Inter', 'Helvetica Neue', Arial, sans-serif !important;
  font-size:     12px      !important;
  letter-spacing: 0.05em  !important;
  text-transform: uppercase !important;
  box-shadow:    none      !important;
}

.wc-block-components-notice-banner__content {
  color: #ffffff !important;
}

/* Bouton dans les blocs Gutenberg */
.wc-block-components-notice-banner .wc-block-components-notice-banner__dismiss,
.wc-block-cart-notice__dismiss {
  color:  #c9c9c9  !important;
  border: none     !important;
  background: transparent !important;
  font-size: 18px  !important;
  cursor: pointer  !important;
  opacity: 0.6;
  transition: opacity 0.2s;
}

.wc-block-components-notice-banner .wc-block-components-notice-banner__dismiss:hover {
  opacity: 1;
}

/* ── Animation d'apparition ─────────────────────────────── */
.woocommerce-notices-wrapper {
  animation: fwa-notice-in 0.3s ease forwards;
}

@keyframes fwa-notice-in {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 768px) {
  .woocommerce-message {
    flex-direction:  column     !important;
    align-items:     flex-start !important;
    gap:             12px       !important;
    padding:         16px 20px  !important;
    font-size:       11px       !important;
  }

  .woocommerce-message .button.wc-forward,
  .woocommerce-message a.button {
    width: 100% !important;
    justify-content: center !important;
  }
}