/**
 * QR Animal — CORE / Styles globaux (toutes les pages front)
 * ──────────────────────────────────────────────────────────
 * @since 10.30.18 — Issu du split de qr-base.css (188 Ko) :
 *   - qr-core.css    : fondation chargée partout (variables, reset/typo,
 *                      boutons, formulaires, footer, responsive global,
 *                      menus desktop/mobile WoodMart)
 *   - qr-modules.css : modules conditionnels (handle 'qr-base')
 * Le handle 'qr-core' est dépendance de 'qr-base' : toute page qui
 * enqueue 'qr-base' charge automatiquement core + modules.
 * NE PAS ajouter ici de styles spécifiques à une page : ils vont
 * dans qr-modules.css.
 */

/* @since 10.30.16 — Le @import Google Fonts (Playfair Display) a été retiré.
   La font est désormais enregistrée via wp_register_style('qr-fonts') dans
   class-qr-animal-plugin.php::register_assets(), en dépendance de qr-base.
   Raison : @import en tête d'un CSS de 200 Ko = téléchargement en cascade
   (le navigateur doit finir qr-base.css avant de découvrir la font). */

/**
 * QR Animal - Base / Foundation Styles
 * ──────────────────────────────────────
 * Fichier CSS UNIFIÉ — chargé sur TOUTES les pages frontend.
 * Contient : variables, reset, typographie, boutons, formulaires,
 * animations, single-product, homepage, client-space, wizard,
 * notification-settings, activation, animal-page, lost-alert,
 * tracking, lost-animals-public.
 * (Tous les CSS template fusionnés ici — v4.2.1)
 *
 * Theme : Premium Sombre / Or
 * Body  : #0f0f0f  · Cartes : #161616  · Surfaces : #1a1a1a
 * Or    : #fbbf24 / #fcd34d / #f59e0b
 *
 * @since 4.2.0
 */

/* ══════════════════════════════════════
   VARIABLES CSS GLOBALES
   ══════════════════════════════════════ */
:root {
    /* ── Fonds ── */
    --qr-bg-body: #0f0f0f;
    --qr-bg-card: #161616;
    --qr-bg-surface: #1a1a1a;
    --qr-bg-elevated: #222222;
    --qr-bg-input: #111111;

    /* ── Or ── */
    --qr-gold: #fbbf24;
    --qr-gold-light: #fcd34d;
    --qr-gold-dark: #f59e0b;
    --qr-gold-muted: rgba(251, 191, 36, 0.12);
    --qr-gold-border: rgba(251, 191, 36, 0.2);
    --qr-gold-glow: rgba(251, 191, 36, 0.25);

    /* ── Texte ── */
    --qr-text-primary: #ffffff;
    --qr-text-secondary: rgba(255, 255, 255, 0.75);
    --qr-text-muted: rgba(255, 255, 255, 0.55);
    --qr-text-dim: rgba(255, 255, 255, 0.3);

    /* ── Bordures ── */
    --qr-border: rgba(255, 255, 255, 0.08);
    --qr-border-light: rgba(255, 255, 255, 0.12);

    /* ── Couleurs utilitaires ── */
    --qr-green: #10b981;
    --qr-green-glow: rgba(16, 185, 129, 0.25);
    --qr-red: #ef4444;
    --qr-red-glow: rgba(239, 68, 68, 0.25);
    --qr-blue: #3b82f6;
    --qr-orange: #f97316;

    /* ── Ombres ── */
    --qr-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
    --qr-shadow-gold: 0 4px 25px rgba(251, 191, 36, 0.15);

    /* ── Rayons / Espacements ── */
    --qr-radius: 12px;
    --qr-radius-sm: 8px;
    --qr-radius-lg: 16px;
    --qr-radius-pill: 50px;

    /* ── Typographie ── */
    --qr-font-heading: 'Playfair Display', Georgia, serif;
    --qr-font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ══════════════════════════════════════
   RESET & TYPOGRAPHIE
   ══════════════════════════════════════ */
body {
    background-color: var(--qr-bg-body) !important;
    color: var(--qr-text-primary) !important;
}

/* ── Header Woodmart : icônes & textes outils ── */
.wd-tools-text,
.wd-tools-icon,
.wd-header-text-link,
.wd-tools-element > a {
    color: #b7b7b7 !important;
}

/* ── Woodmart Mini-Panier : texte lisible sur fond clair ── */
.wd-cart-widget,
.wd-dropdown-cart,
.widget_shopping_cart,
.cart_list,
.mini_cart_item,
.mini_cart_item .item-variation-value,
.mini_cart_item .sp-svg-cart-name,
.mini_cart_item .product-info,
.mini_cart_item dl.variation,
.mini_cart_item dl.variation dd,
.mini_cart_item dl.variation dt,
.mini_cart_item .quantity,
.woocommerce-mini-cart-item {
    color: #fbbf24 !important;
}

/* ── Cart sidebar : restaurer fond clair Woodmart ── */
.cart-widget-side,
.wd-cart-side,
.cart-widget-side .widget_shopping_cart_content,
.cart-widget-side .cart-widget-wrap,
.cart-widget-side .shopping-cart-widget-body,
.cart-widget-side .woocommerce-mini-cart,
.wd-side-cart,
.wd-side-cart .widget_shopping_cart_content {
    background-color: #0f0f0f !important;
    color: #333333 !important;
}

.cart-widget-side *,
.wd-cart-side *,
.wd-side-cart * {
    background-color: transparent !important;
}

/* Bouton fermer du panier */
.cart-widget-side .close-side-widget,
.cart-widget-side .wd-cross-button,
.wd-side-cart .close-side-widget,
.wd-side-cart .wd-cross-button,
.cart-widget-side .close-side-widget a,
.cart-widget-side .wd-action-btn,
.wd-side-cart .wd-action-btn,
.cart-widget-side [class*="close"],
.wd-side-cart [class*="close"] {
    color: #fff !important;
    background-color: transparent !important;
    opacity: 1 !important;
}

/* Boutons voir panier / commander — restaurer fond Woodmart */
.cart-widget-side .woocommerce-mini-cart__buttons .button,
.wd-side-cart .woocommerce-mini-cart__buttons .button {
    background-color: revert !important;
}
.cart-widget-side .woocommerce-mini-cart__buttons .checkout,
.wd-side-cart .woocommerce-mini-cart__buttons .checkout {
    background-color: #f5cb4c !important;
    color: #000 !important;
}
.cart-widget-side .woocommerce-mini-cart__buttons .button:not(.checkout),
.wd-side-cart .woocommerce-mini-cart__buttons .button:not(.checkout) {
    background-color: #f0f0f0 !important;
    color: #333333 !important;
}

/* Images produits dans le panier */
.cart-widget-side img,
.wd-side-cart img {
    background-color: #ffffff !important;
}

/* Titre "Mon panier" */
.cart-widget-side .widget-title,
.wd-side-cart .widget-title {
    color: #333333 !important;
}

/* Sous-total */
.cart-widget-side .woocommerce-mini-cart__total,
.wd-side-cart .woocommerce-mini-cart__total {
    color: #333333 !important;
    border-top: 1px solid #e5e5e5 !important;
}

/* Boutons voir panier / commander */
.cart-widget-side .woocommerce-mini-cart__buttons a,
.wd-side-cart .woocommerce-mini-cart__buttons a {
    color: #000 !important;
}

/* Prix dans le panier */
.cart-widget-side .amount,
.wd-side-cart .amount {
    color: #fff !important;
}

/* Lien supprimer */
.cart-widget-side .remove,
.wd-side-cart .remove {
    color: #999999 !important;
}

/* ── Mini-Cart dropdown : boutons Voir le panier & Commander ── */
/* Scopé hors .cart-widget-side pour ne pas écraser le panier latéral */
.woocommerce-mini-cart__buttons.buttons a.button,
.woocommerce-mini-cart__buttons.buttons a.btn-cart,
.woocommerce-mini-cart__buttons.buttons a.checkout {
    background-color: rgb(251, 191, 36) !important;
    color: #0f0f0f !important;
    border: none !important;
    font-family: var(--qr-font-body) !important;
    font-weight: 600 !important;
    border-radius: var(--qr-radius-sm) !important;
    transition: background-color 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease !important;
    box-shadow: 0 2px 8px rgba(251, 191, 36, 0.3) !important;
}

.woocommerce-mini-cart__buttons.buttons a.button:hover,
.woocommerce-mini-cart__buttons.buttons a.btn-cart:hover,
.woocommerce-mini-cart__buttons.buttons a.checkout:hover {
    background-color: rgb(245, 158, 11) !important;
    color: #0f0f0f !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 18px rgba(245, 158, 11, 0.45) !important;
    text-decoration: none !important;
}

/* ── Configurateur produit : fond sombre ── */
.sp-configurator-options {
    background-color: #0f0f0f !important;
}

/* ── Popup "Votre configuration" : texte lisible sur fond clair ── */
.sp-price-summary-popup,
.sp-price-summary-popup *,
.sp-price-summary-content,
.sp-price-summary-content *,
.sp-svg-injected-row,
.sp-svg-injected-row dd,
.sp-svg-cart-name {
    color: #333333 !important;
}

/* ── Panneau configurateur (latéral/popup) ── */
.sp-configurator-panel-content,
.sp-configurator-panel-content *,
.sp-price-table,
.sp-price-table *,
.sp-price-table-items,
.sp-price-table-items dt,
.sp-price-table-items dd,
.sp-price-table-totals,
.sp-price-table-totals *,
.sp-table-label,
.sp-table-price {
    color: #333333 !important;
}

/* Panneau "Votre configuration" — espacement avec le header */
.sp-configurator-panel,
.sp-price-summary-popup {
    top: 80px !important;
    z-index: 9990 !important;
}

/* ── WooCommerce Mon Compte : sidebar navigation ── */
.woocommerce-MyAccount-navigation-link a {
    color: #b7b7b7 !important;
    text-decoration: none !important;
    display: block !important;
    padding: 10px 16px !important;
    border-radius: var(--qr-radius-sm) !important;
    transition: all 0.3s !important;
    border-left: 2px solid transparent !important;
}

.woocommerce-MyAccount-navigation-link a:hover {
    color: var(--qr-gold) !important;
    background: var(--qr-gold-muted) !important;
    border-left-color: var(--qr-gold) !important;
}

/* Lien actif / sélectionné — uniquement via .is-active */
.woocommerce-MyAccount-navigation-link.is-active > a {
    color: var(--qr-gold) !important;
    background: var(--qr-gold-muted) !important;
    border-left-color: var(--qr-gold) !important;
    font-weight: 600 !important;
}

.woocommerce-MyAccount-navigation-link--customer-logout a {
    color: var(--qr-text-dim) !important;
}

.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    color: var(--qr-red) !important;
    border-left-color: var(--qr-red) !important;
    background: rgba(239, 68, 68, 0.08) !important;
}

.woocommerce-MyAccount-title,
.wd-my-account-sidebar h3 {
    color: var(--qr-text-primary) !important;
    font-family: var(--qr-font-heading) !important;
}

/* ── Sidebar Mon Compte (global — aussi sur /wishlist/) ── */
.wd-my-account-sidebar {
    background: var(--qr-bg-surface) !important;
    border-radius: var(--qr-radius) !important;
    padding: 24px !important;
    border: 1px solid var(--qr-border) !important;
}

/* ── Icônes My Account : hover en or ── */
.wd-builder-off .wd-nav-my-acc > li:hover > a .wd-nav-icon { color: var(--qr-gold) !important; }
.wd-nav-my-acc > li:hover > a .wd-nav-icon { color: var(--qr-gold) !important; }

/* ── Page Title (Mon Compte, Wishlist, Panier, etc.) ── */
.page-title,
.wd-page-title {
    background: var(--qr-bg-body) !important;
    position: relative;
    padding: 50px 0 40px !important;
    text-align: center;
    border-radius: 0 !important;
    border: none !important;
}

/* Fond subtil dégradé — doit remplir tout le bloc */
.wd-page-title-bg,
.wd-page-title-bg.wd-fill {
    background: linear-gradient(
        180deg,
        rgba(251, 191, 36, 0.04) 0%,
        transparent 100%
    ) !important;
    border-radius: 0 !important;
    border: none !important;
}

/* Ligne or en bas du titre */
.page-title::after,
.wd-page-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(251, 191, 36, 0.35), transparent);
}

/* Titre H1 */
.page-title h1,
.wd-page-title .entry-title {
    color: var(--qr-text-primary) !important;
    font-family: var(--qr-font-heading) !important;
    font-size: clamp(1.8rem, 4vw, 2.6rem) !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
    letter-spacing: -0.02em !important;
}

/* @since 9.6.72 — Force la lisibilité du titre H1 sur la page My Account
   quel que soit le wrapper utilisé par WoodMart (page-title, page-header,
   wrapper Elementor custom, ou H1 brut). Indispensable car le thème rend
   parfois ce H1 en couleur foncée non détectable, illisible sur fond noir. */
body.woocommerce-account .page-title h1,
body.woocommerce-account .page-header h1,
body.woocommerce-account .entry-title,
body.woocommerce-account header h1,
body.woocommerce-account .main-page-wrapper h1.entry-title,
.woocommerce-account .woocommerce > h2,
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
    color: var(--qr-text-primary, #fff) !important;
}

/* Breadcrumbs */
.page-title .breadcrumbs,
.wd-page-title .breadcrumbs,
.woocommerce-breadcrumb {
    color: var(--qr-text-dim) !important;
    font-size: 0.85rem !important;
}

.page-title .breadcrumbs a,
.wd-page-title .breadcrumbs a,
.woocommerce-breadcrumb a {
    color: var(--qr-text-muted) !important;
    text-decoration: none !important;
    transition: color 0.3s !important;
}

.page-title .breadcrumbs a:hover,
.wd-page-title .breadcrumbs a:hover,
.woocommerce-breadcrumb a:hover {
    color: var(--qr-gold) !important;
}

/* Séparateur breadcrumb */
.page-title .breadcrumbs .delimiter,
.wd-page-title .breadcrumbs .delimiter {
    color: var(--qr-text-dim) !important;
    margin: 0 6px !important;
}

/* Page courante dans le breadcrumb */
.page-title .breadcrumbs .current,
.wd-page-title .breadcrumbs .current {
    color: var(--qr-text-muted) !important;
}

/* ── Éléments #b7b7b7 (texte secondaire clair) ── */
.wd-breadcrumbs > :is(span, a):last-child,
.wd-label,
.wd-action-btn > a,
.item-variation-name,
.sp-svg-cart-price {
    color: #b7b7b7 !important;
}

/* ── Éléments #fbbf24 (or accent) ── */
.wd-products-shop-view a.current-variation,
.sp-configurator-field-value,
.cart-totals-inner .shipping-calculator-button {
    color: #fbbf24 !important;
}

/* ── Éléments #fff (texte blanc) ── */
.wd-product-nav-btn,
td.product-name a:not(:where(.button)),
.wd-entities-title,
.woocommerce-mini-cart__total strong {
    color: #fff !important;
}

/* ── Hover #fbbf24 (or) ── */
.wd-action-btn > a:hover,
.wd-product-nav-btn:hover {
    color: #fbbf24 !important;
}

/* ── Hover var(--qr-gold-dark) ── */
td.product-name a:not(:where(.button)):hover,
.cart-totals-inner .shipping-calculator-button:hover {
    color: var(--qr-gold-dark) !important;
}

/* Bouton ajout panier boutique */
a.button.add_to_cart_button {
    border-radius: 5px !important;
}

/* Bordure Elementor spécifique */
.elementor-918 .elementor-element.elementor-element-67c123f1 {
    border-color: #fbbf24 !important;
}
.elementor-931 .elementor-element.elementor-element-40f43a33 > .elementor-widget-container {
	border-color: #fbbf24 !important;
}

/* ── Checkout Steps (Mon Panier → Checkout → Order Complete) ── */
.wd-checkout-steps {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.wd-checkout-steps li {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.wd-checkout-steps li span,
.wd-checkout-steps li a {
    text-decoration: none !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    transition: color 0.3s !important;
}

.wd-checkout-steps .step-active span,
.wd-checkout-steps .step-active a {
    color: var(--qr-gold) !important;
    font-weight: 700 !important;
}

.wd-checkout-steps .step-inactive span,
.wd-checkout-steps .step-inactive a {
    color: var(--qr-text-muted) !important;
}

.wd-checkout-steps .step-inactive a:hover {
    color: var(--qr-gold-light) !important;
}

/* Séparateurs flèches entre les étapes */
.wd-checkout-steps li::after {
    color: var(--qr-text-dim) !important;
}

/* ── Header Dropdown "Mon Compte" ── */
/* Étendre la zone hover du lien Mon Compte pour couvrir le vide */
.wd-header-my-account.wd-event-hover {
    position: relative !important;
}
.wd-header-my-account.wd-event-hover > a::after {
    content: '' !important;
    position: absolute !important;
    bottom: -20px !important;
    left: 0 !important;
    right: 0 !important;
    height: 20px !important;
}

.wd-dropdown-my-account {
    min-width: 260px !important;
    max-width: 280px !important;
    background: #161616 !important;
    border: 1px solid rgba(251, 191, 36, 0.15) !important;
    border-top: 2px solid #fbbf24 !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5) !important;
    padding: 8px 0 !important;
    animation: spDropFade 0.25s ease !important;
    overflow: visible !important;
    margin-top: 0 !important;
    top: 100% !important;
}

/* Pont invisible entre le lien Mon Compte et le dropdown */
.wd-dropdown-my-account::before {
    content: '' !important;
    position: absolute !important;
    top: -30px !important;
    left: 0 !important;
    right: 0 !important;
    height: 30px !important;
    background: transparent !important;
}

@keyframes spDropFade {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.wd-dropdown-my-account .wd-sub-menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link {
    margin: 0 !important;
    padding: 0 !important;
}

.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link a {
    color: #9ca3af !important;
    padding: 10px 22px !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    border-left: 3px solid transparent !important;
    border-radius: 0 !important;
    display: block !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link a:hover {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.06) !important;
    border-left-color: #fbbf24 !important;
}

.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link.is-active a {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.08) !important;
    border-left-color: #fbbf24 !important;
    font-weight: 600 !important;
}

/* ── Séparateurs entre les groupes ── */

/* Communication (messagerie = 1er item du groupe) */
.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--messagerie {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    padding-top: 4px !important;
}

/* Partenaire (affiliation = 1er item du groupe) */
.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--affiliation,
.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--revendeur {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    padding-top: 4px !important;
}

/* Compte (edit-account = 1er item du groupe) */
.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--edit-account {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    padding-top: 4px !important;
}

/* Déconnexion — séparé + style discret */
.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    padding-top: 4px !important;
}

.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--customer-logout a {
    color: #6b7280 !important;
    font-size: 12px !important;
}

.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    color: #ef4444 !important;
    border-left-color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

/* Masquer Wishlist du dropdown (doublon avec l'icône header) */
.wd-dropdown-my-account .woocommerce-MyAccount-navigation-link--wishlist {
    display: none !important;
}

.wd-checkout-prod-title > .cart-product-label-link {
	color: #fff !important;
}

/**
 * Texte jaune-ambré pour les noms de motifs sur fond sombre.
 *
 * Couvre 3 contextes WooCommerce :
 *   1. .cart_item                       → page panier (/panier/)
 *   2. .wd-checkout-prod                → page checkout WoodMart (/commander/)
 *   3. .mini_cart_item                  → mini-panier flottant (drawer/popup)
 *
 * @since 9.6.x (initial)
 * @since 9.7.19 Ajout du sélecteur générique .cart_item — la règle précédente
 *               ne ciblait que la page checkout, donc sur la page panier
 *               le texte tombait sur le défaut #333 (ligne ~229) et devenait
 *               illisible sur le fond noir WoodMart en dark mode.
 */
.cart_item .sp-svg-cart-name,
.cart_item .wd-checkout-prod .item-variation-value .sp-svg-cart-name,
.mini_cart_item .sp-svg-cart-name,
.woocommerce-cart-form .sp-svg-cart-name {
	color: #fbbf24 !important;
}

/* ── Mon Compte : navigation ul reset ── */
.woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ── Mon Compte : contenu principal ── */
.wd-my-account-wrapper {
    background: transparent !important;
}

.woocommerce-MyAccount-content {
    color: var(--qr-text-secondary) !important;
}

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
    color: var(--qr-text-primary) !important;
}

/* ── Mon Compte : dashboard & layout ── */
.wordpress-my-account {
    max-width: 1200px;
    margin: 0 auto;
}

.account-navigation {
    background: var(--qr-bg-surface);
    padding: 20px;
    border-radius: var(--qr-radius-sm);
    margin-bottom: 30px;
    border: 1px solid var(--qr-border);
}

.account-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 20px;
}

.account-nav-list a {
    text-decoration: none;
    padding: 10px 20px;
    background: var(--qr-bg-card);
    color: var(--qr-text-secondary);
    border-radius: 6px;
    display: block;
    transition: all 0.2s;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.account-nav-list a:hover {
    background: var(--qr-gold);
    color: #0a0a0a;
    border-color: var(--qr-gold);
}

.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

.dashboard-actions {
    margin: 30px 0;
    text-align: center;
}

.no-qr-codes {
    background: rgba(251, 191, 36, 0.06);
    padding: 20px;
    border-radius: var(--qr-radius-sm);
    margin-top: 20px;
    border: 1px solid rgba(251, 191, 36, 0.12);
    color: var(--qr-text-secondary);
}

/* ── Mon Compte : contenu QR Animal intégré ── */
.qr-animal-my-account-content {
    padding: 20px;
    border-radius: var(--qr-radius-sm);
    border: 1px solid var(--qr-border);
}

.qr-animal-my-account-content .animal-client-space {
    max-width: none;
    padding: 0;
}

.qr-animal-my-account-content .client-space-header {
    margin-bottom: 20px;
}

.qr-animal-my-account-content .animal-page-editor {
    max-width: none;
    box-shadow: none;
    border-radius: 0;
}

.qr-animal-my-account-content .editor-header {
    border-radius: var(--qr-radius-sm) var(--qr-radius-sm) 0 0;
}

/* ── Wishlist / pages vides ── */
.wd-empty-wishlist,
.wd-empty-page {
    color: var(--qr-text-muted) !important;
}

.wd-empty-page-text {
    color: var(--qr-text-dim) !important;
}

/* ── Bouton "Retour à la boutique" ── */
.woocommerce-MyAccount-content .return-to-shop .button {
    background: linear-gradient(135deg, var(--qr-gold), var(--qr-gold-dark)) !important;
    color: #000 !important;
    border: none !important;
    border-radius: var(--qr-radius-pill) !important;
    padding: 12px 28px !important;
    font-weight: 700 !important;
    transition: all 0.3s !important;
}

.woocommerce-MyAccount-content .return-to-shop .button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 25px rgba(251, 191, 36, 0.35) !important;
}

.qr-container {
    font-family: var(--qr-font-body);
    line-height: 1.6;
    color: var(--qr-text-primary);
}

:root:root :is(.woocommerce-form-coupon-toggle, .woocommerce-form-login-toggle) > div {
    color: #fff !important;
}
:root:root :is(.woocommerce-form-coupon-toggle, .woocommerce-form-login-toggle) > div :is(.showlogin, .showcoupon) {
	color: #fff !important;
}

/* ══════════════════════════════════════
   BOUTONS
   ══════════════════════════════════════ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 20px;
    border: none;
    border-radius: var(--qr-radius-sm);
    cursor: pointer;
    text-decoration: none;
    font-size: 14px;
    text-align: center;
    transition: all 0.3s ease;
    font-weight: 500;
    font-family: var(--qr-font-body);
    line-height: 1.4;
}

.btn-primary {
    background: linear-gradient(135deg, var(--qr-gold), var(--qr-gold-dark));
    color: #0a0a0a;
    font-weight: 600;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(251, 191, 36, 0.35);
    color: #0a0a0a;
}

.btn-secondary {
    background: var(--qr-bg-card);
    color: var(--qr-text-secondary);
    border: 1px solid var(--qr-border-light);
}
.btn-secondary:hover {
    background: var(--qr-bg-elevated);
    color: var(--qr-text-primary);
    border-color: var(--qr-gold-border);
}

.btn-danger {
    background: var(--qr-red);
    color: white;
    padding: 12px 30px;
    border-radius: var(--qr-radius-sm);
    font-weight: 600;
}
.btn-danger:hover {
    background: #dc2626;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px var(--qr-red-glow);
}

.btn-warning {
    background: var(--qr-gold-dark);
    color: #0a0a0a;
    padding: 12px 30px;
    border-radius: var(--qr-radius-sm);
    font-weight: 600;
}
.btn-warning:hover {
    background: #d4880a;
}

.btn-tracking {
    background: var(--qr-bg-card);
    color: var(--qr-text-secondary);
    border: 1px solid var(--qr-border-light);
}
.btn-tracking:hover {
    border-color: var(--qr-gold-border);
    color: var(--qr-gold);
}

.btn:disabled,
.btn.loading {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
    transform: none !important;
    box-shadow: none !important;
}

/* ══════════════════════════════════════
   FORMULAIRES
   ══════════════════════════════════════ */
.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: var(--qr-text-secondary);
    font-size: 14px;
}

.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="password"],
.form-group input[type="date"],
.form-group input[type="number"],
.form-group input[type="tel"],
.form-group input[type="url"],
.form-group textarea,
.form-group select {
    width: 100%;
    padding: 12px;
    border: 1px solid var(--qr-border-light);
    border-radius: var(--qr-radius-sm);
    font-size: 14px;
    transition: all 0.3s;
    background: var(--qr-bg-input);
    color: var(--qr-text-primary);
    font-family: var(--qr-font-body);
    box-sizing: border-box;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    color: var(--qr-text-dim);
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    outline: none;
    border-color: var(--qr-gold);
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.2);
}

.form-group textarea {
    resize: vertical;
    min-height: 80px;
}

.form-actions {
    margin-top: 25px;
    display: flex;
    gap: 15px;
    justify-content: center;
}

/* ── Alertes ── */
.alert {
    padding: 12px 16px;
    margin: 15px 0;
    border-radius: var(--qr-radius-sm);
    display: none;
    text-align: center;
    font-weight: 500;
}

.alert.success {
    background: rgba(16, 185, 129, 0.1);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.alert.error {
    background: rgba(239, 68, 68, 0.1);
    color: #f87171;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

/* ── Erreurs de champ ── */
input.error,
textarea.error,
select.error {
    border-color: var(--qr-red) !important;
    background-color: rgba(239, 68, 68, 0.05) !important;
}

.field-error {
    color: #f87171;
    font-size: 13px;
    margin-top: 5px;
    display: none;
}
.field-error.show {
    display: block;
}

/* ══════════════════════════════════════
   PHOTO ANIMAL (cercle doré)
   ══════════════════════════════════════ */
.animal-photo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 3px solid var(--qr-gold);
    margin: 0 auto 20px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(251, 191, 36, 0.2);
    transition: transform 0.3s;
}
.animal-photo:hover {
    transform: scale(1.05);
}
.animal-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.animal-photo.no-photo {
    background: var(--qr-gold-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3em;
}

.animal-photo-small {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid var(--qr-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--qr-gold-muted);
    flex-shrink: 0;
}
.animal-photo-small img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.animal-icon {
    font-size: 1.8em;
}

/* ══════════════════════════════════════
   STATISTIQUES (cartes)
   ══════════════════════════════════════ */
.stat-card {
    background: var(--qr-bg-card);
    padding: 15px;
    border-radius: var(--qr-radius);
    border: 1px solid var(--qr-border);
    text-align: center;
    border-left: 3px solid var(--qr-gold);
    transition: transform 0.2s, border-color 0.3s;
}
.stat-card:hover {
    transform: translateY(-3px);
    border-color: var(--qr-gold);
}
.stat-card .stat-number {
    font-size: 2.5em;
    font-weight: bold;
    color: var(--qr-gold);
    display: block;
    line-height: 1;
}
.stat-card .stat-label {
    color: var(--qr-text-muted);
    font-size: 0.9em;
    margin-top: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ── Stats inline (dans les cartes animal) ── */
.stat {
    text-align: center;
    flex: 1;
    min-width: 80px;
}
.stat .stat-number {
    display: block;
    font-size: 1.5em;
    font-weight: bold;
    color: var(--qr-gold);
    line-height: 1;
}
.stat-label {
    font-size: 0.85em;
    color: var(--qr-text-muted);
    margin-top: 2px;
}
.stat-text {
    font-size: 0.85em;
    color: var(--qr-text-muted);
    display: block;
}
.stat-date {
    font-weight: 600;
    color: var(--qr-text-secondary);
    font-size: 0.9em;
}

/* ══════════════════════════════════════
   TRAIT DORÉ (header top-line)
   ══════════════════════════════════════ */
.qr-gold-line::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(to right, transparent, var(--qr-gold), transparent);
}

/* ══════════════════════════════════════
   PARTAGE (boutons sociaux)
   ══════════════════════════════════════ */
.sharing-buttons {
    display: flex;
    gap: 8px;
}
.share-btn {
    background: var(--qr-bg-card);
    border: 1px solid var(--qr-border);
    border-radius: var(--qr-radius-sm);
    padding: 8px 12px;
    text-decoration: none;
    font-size: 16px;
    transition: all 0.2s;
    cursor: pointer;
}
.share-btn:hover {
    background: var(--qr-gold-muted);
    border-color: var(--qr-gold-border);
    transform: scale(1.1);
}

.share-buttons-large {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
    margin: 20px 0;
}
.share-btn-large {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px 25px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s;
    border: 2px solid transparent;
}
.share-btn-large svg {
    width: 24px;
    height: 24px;
}
.share-btn-large.whatsapp {
    background: #25D366;
    color: white;
}
.share-btn-large.whatsapp:hover {
    background: #128C7E;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
}
.share-btn-large.facebook {
    background: #1877F2;
    color: white;
}
.share-btn-large.facebook:hover {
    background: #145DBF;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(24, 119, 242, 0.4);
}
.share-btn-large.email {
    background: #EA4335;
    color: white;
}
.share-btn-large.email:hover {
    background: #C5221F;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(234, 67, 53, 0.4);
}

/* ══════════════════════════════════════
   MODAL (mode perdu, etc.)
   ══════════════════════════════════════ */
.lost-modal {
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(8px);
}

.lost-modal-content {
    background-color: var(--qr-bg-elevated);
    margin: 5% auto;
    padding: 30px;
    border-radius: var(--qr-radius-lg);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5);
    width: 90%;
    max-width: 600px;
    position: relative;
    animation: qr-slideDown 0.3s ease-out;
    border: 1px solid var(--qr-border);
}

.lost-modal-close {
    position: absolute;
    right: 20px;
    top: 20px;
    color: var(--qr-text-muted);
    font-size: 32px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.2s;
}
.lost-modal-close:hover,
.lost-modal-close:focus {
    color: var(--qr-gold);
}

.lost-modal h2 {
    margin: 0 0 20px 0;
    color: var(--qr-red);
    font-size: 1.8em;
    font-family: var(--qr-font-heading);
}
.lost-modal h3 {
    margin: 20px 0 15px 0;
    color: var(--qr-text-secondary);
}

.lost-info-display {
    background: rgba(249, 115, 22, 0.08);
    border-left: 3px solid var(--qr-gold-dark);
    padding: 20px;
    border-radius: var(--qr-radius-sm);
    margin-bottom: 20px;
}
.lost-info-display p {
    margin: 10px 0;
    line-height: 1.6;
    color: var(--qr-text-secondary);
}
.lost-info-display strong {
    color: var(--qr-gold);
}

/* ── Boutons mode perdu ── */
.btn-lost-inactive {
    background: var(--qr-gold-dark);
    color: #0a0a0a;
    border: 2px solid var(--qr-gold-dark);
    font-weight: 600;
}
.btn-lost-inactive:hover {
    background: #d4880a;
    border-color: #d4880a;
    color: #0a0a0a;
}

.btn-lost-active {
    background: var(--qr-red);
    color: white;
    border: 2px solid var(--qr-red);
    animation: qr-pulse-red 2s infinite;
}
.btn-lost-active:hover {
    background: #dc2626;
    border-color: #dc2626;
    color: white;
}

/* Badge PERDU */
.card-lost {
    border: 2px solid var(--qr-red);
    box-shadow: 0 0 20px var(--qr-red-glow);
}

.lost-badge-overlay {
    position: absolute;
    top: 15px;
    right: 15px;
    background: var(--qr-red);
    color: white;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: bold;
    font-size: 0.9em;
    z-index: 10;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4);
    animation: qr-badge-pulse 2s infinite;
}

/* ══════════════════════════════════════
   ANIMATIONS
   ══════════════════════════════════════ */
@keyframes qr-fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

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

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

@keyframes qr-slideDown {
    from { opacity: 0; transform: translateY(-50px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes qr-slideInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes qr-pulse-red {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
    50% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); }
}

@keyframes qr-badge-pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4); }
    50% { transform: scale(1.05); box-shadow: 0 6px 20px rgba(239, 68, 68, 0.6); }
}

@keyframes qr-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ══════════════════════════════════════
   ACCESSIBILITÉ / FOCUS
   ══════════════════════════════════════ */
.btn:focus-visible,
.share-btn:focus-visible {
    outline: 2px solid var(--qr-gold);
    outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.3);
}

/* ══════════════════════════════════════
   FOOTER (global — chargé sur toutes les pages)
   ══════════════════════════════════════ */
.sp-footer {
    padding: 50px 20px 30px;
    background: var(--qr-bg-card);
    border-top: 1px solid var(--qr-border);
    position: relative;
}

.sp-footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(to right, transparent, var(--qr-gold-border), transparent);
}

.sp-footer-inner {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
}

.sp-footer-links {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sp-footer-links a {
    font-size: 0.82rem;
    color: var(--qr-text-muted);
    text-decoration: none;
    transition: color 0.3s;
}

.sp-footer-links a:hover {
    color: var(--qr-gold);
}

.sp-footer-social {
    display: flex;
    gap: 12px;
}

.sp-footer-social a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid var(--qr-border);
    color: var(--qr-text-muted);
    text-decoration: none;
    font-size: 1rem;
    transition: all 0.3s;
}

.sp-footer-social a:hover {
    border-color: var(--qr-gold);
    color: var(--qr-gold);
    background: var(--qr-gold-muted);
}

.sp-footer-copy {
    width: 100%;
    text-align: center;
    font-size: 0.78rem;
    color: var(--qr-text-dim);
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--qr-border);
}

.sp-footer-payments {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 16px;
}

.sp-footer-payments img {
    height: 28px;
    opacity: 0.5;
    transition: opacity 0.3s;
}

.sp-footer-payments img:hover {
    opacity: 0.8;
}

/* ══════════════════════════════════════
   RESPONSIVE GLOBAL
   ══════════════════════════════════════ */
/* ══════════════════════════════════════
   RESPONSIVE — TABLETTE (max 768px)
   ══════════════════════════════════════ */
@media (max-width: 768px) {

    /* ── Page Title ── */
    .page-title,
    .wd-page-title {
        padding: 30px 15px 25px !important;
    }

    .page-title::after,
    .wd-page-title::after {
        width: 200px;
    }

    .page-title h1,
    .wd-page-title .entry-title {
        font-size: 1.6rem !important;
    }

    /* ── Mon Compte : sidebar en colonne ── */
    .wd-my-account-wrapper {
        display: flex !important;
        flex-direction: column !important;
    }

    .wd-my-account-sidebar {
        padding: 16px !important;
        margin-bottom: 20px !important;
    }

    .wd-my-account-sidebar .woocommerce-MyAccount-navigation ul {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    .wd-my-account-sidebar .woocommerce-MyAccount-navigation-link {
        flex: 0 0 auto !important;
    }

    .wd-my-account-sidebar .woocommerce-MyAccount-navigation-link a {
        padding: 8px 14px !important;
        font-size: 0.82rem !important;
        border-left: none !important;
        border-bottom: 2px solid transparent !important;
        border-radius: var(--qr-radius-pill) !important;
        background: var(--qr-bg-card) !important;
        border: 1px solid var(--qr-border) !important;
    }

    .wd-my-account-sidebar .woocommerce-MyAccount-navigation-link.is-active > a {
        background: var(--qr-gold-muted) !important;
        border-color: var(--qr-gold) !important;
    }

    .woocommerce-MyAccount-title,
    .wd-my-account-sidebar h3 {
        font-size: 1.2rem !important;
        margin-bottom: 12px !important;
    }

    /* ── Mon Compte : contenu ── */
    .woocommerce-MyAccount-content {
        padding: 0 !important;
    }

    .qr-animal-my-account-content {
        padding: 15px;
        margin: 0 -15px;
        border-radius: 0;
    }

    /* ── Formulaires ── */
    .form-actions {
        flex-direction: column;
    }

    .form-actions button,
    .form-actions .btn {
        width: 100%;
    }

    /* ── Modals ── */
    .lost-modal-content {
        margin: 10% auto;
        padding: 20px;
        width: 95%;
    }

    /* ── Footer ── */
    .sp-footer-inner {
        flex-direction: column;
        text-align: center;
    }

    .sp-footer-links {
        justify-content: center;
    }

    /* ── Header dropdown Mon Compte ── */
    .wd-dropdown-my-account {
        min-width: 220px !important;
    }

    .wd-dropdown-my-account .woocommerce-MyAccount-navigation-link a {
        padding: 10px 18px !important;
        font-size: 0.85rem !important;
    }

    /* ── Boutons globaux ── */
    .btn,
    .btn-primary {
        width: 100%;
        justify-content: center;
    }

    /* ── WooCommerce notices ── */
    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error {
        font-size: 0.85rem !important;
        padding: 12px 16px !important;
    }
}

/* ══════════════════════════════════════
   RESPONSIVE — MOBILE (max 480px)
   ══════════════════════════════════════ */
@media (max-width: 480px) {

    /* ── Page Title encore plus compact ── */
    .page-title,
    .wd-page-title {
        padding: 24px 12px 20px !important;
    }

    .page-title h1,
    .wd-page-title .entry-title {
        font-size: 1.3rem !important;
    }

    .page-title .breadcrumbs,
    .wd-page-title .breadcrumbs,
    .woocommerce-breadcrumb {
        font-size: 0.75rem !important;
    }

    /* ── Mon Compte nav : scroll horizontal ── */
    .wd-my-account-sidebar .woocommerce-MyAccount-navigation ul {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 6px !important;
    }

    .wd-my-account-sidebar .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
        display: none;
    }

    .wd-my-account-sidebar .woocommerce-MyAccount-navigation-link a {
        white-space: nowrap !important;
        font-size: 0.78rem !important;
        padding: 7px 12px !important;
    }

    /* ── Sidebar plus compacte ── */
    .wd-my-account-sidebar {
        padding: 12px !important;
        border-radius: var(--qr-radius-sm) !important;
    }

    /* ── Wishlist / pages vides ── */
    .wd-empty-wishlist,
    .wd-empty-page {
        font-size: 1.2rem !important;
    }

    .wd-empty-page-text {
        font-size: 0.85rem !important;
    }
}



/* ══════════════════════════════════════════════
   MENU DESKTOP — SERENY PET
   ══════════════════════════════════════════════ */

/* Liens principaux */
.wd-nav-main.wd-nav-header .item-level-0 {
    position: relative !important;
}
.wd-nav-main.wd-nav-header .item-level-0 > .woodmart-nav-link {
    padding-bottom: 15px !important;
}
.wd-nav-main.wd-nav-header .item-level-0 > .woodmart-nav-link .nav-link-text {
    color: #d1d5db !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.5px !important;
    transition: color 0.3s ease !important;
}
.wd-nav-main.wd-nav-header .item-level-0:hover > .woodmart-nav-link .nav-link-text,
.wd-nav-main.wd-nav-header .item-level-0.current-menu-item > .woodmart-nav-link .nav-link-text,
.wd-nav-main.wd-nav-header .item-level-0.current-menu-parent > .woodmart-nav-link .nav-link-text,
.wd-nav-main.wd-nav-header .item-level-0.current-menu-ancestor > .woodmart-nav-link .nav-link-text {
    color: #fbbf24 !important;
}
.wd-nav-main.wd-style-underline .item-level-0 > .woodmart-nav-link::after {
    background-color: #fbbf24 !important;
}
.wd-nav-main.wd-nav-header .item-level-0.menu-item-has-children > .woodmart-nav-link::before {
    color: #6b7280 !important;
    transition: color 0.3s !important;
}
.wd-nav-main.wd-nav-header .item-level-0.menu-item-has-children:hover > .woodmart-nav-link::before {
    color: #fbbf24 !important;
}

/* Dropdown */
.wd-nav-main .item-level-0 > .wd-dropdown-menu {
    background: #161616 !important;
    border: 1px solid rgba(251, 191, 36, 0.15) !important;
    border-top: 2px solid #fbbf24 !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5) !important;
    padding: 0 !important;
    overflow: visible !important;
    margin-top: 0 !important;
    top: 100% !important;
}

/* Pont invisible entre le lien et le dropdown */
.wd-nav-main .item-level-0 > .wd-dropdown-menu::before {
    content: '' !important;
    position: absolute !important;
    top: -20px !important;
    left: 0 !important;
    right: 0 !important;
    height: 20px !important;
    background: transparent !important;
}

.wd-nav-main .item-level-0 > .wd-dropdown-menu > .container {
    padding: 8px 0 !important;
}

.wd-nav-main .wd-sub-menu .item-level-1 > .woodmart-nav-link {
    padding: 11px 22px !important;
    color: #9ca3af !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    border-left: 3px solid transparent !important;
    transition: all 0.2s ease !important;
    display: block !important;
}

.wd-nav-main .wd-sub-menu .item-level-1:hover > .woodmart-nav-link {
    background: rgba(251, 191, 36, 0.06) !important;
    border-left-color: #fbbf24 !important;
    color: #fbbf24 !important;
}

.wd-nav-main .wd-sub-menu .item-level-1.current-menu-item > .woodmart-nav-link {
    background: rgba(251, 191, 36, 0.08) !important;
    border-left-color: #fbbf24 !important;
    color: #fbbf24 !important;
    font-weight: 600 !important;
}

.wd-nav-main .wd-sub-menu .item-level-1 > .woodmart-nav-link::after {
    display: none !important;
}

/* Animation dropdown */
.wd-nav-main .item-level-0 > .wd-dropdown-menu.wd-dropdown {
    animation: spDropFade 0.25s ease !important;
}
@keyframes spDropFade {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Badge panier */
.wd-cart-number {
    background: #fbbf24 !important;
    color: #0f0f0f !important;
    font-weight: 700 !important;
}

/* Sticky header */
.whb-sticked .whb-row-inner {
    background: rgba(15, 15, 15, 0.97) !important;
    border-bottom: 1px solid rgba(251, 191, 36, 0.1) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

/* ══════════════════════════════════════════════
   MENU MOBILE — SERENY PET
   ══════════════════════════════════════════════ */

/* Panneau latéral */
.wd-side-hidden.wd-side-hidden-nav {
    background: #0f0f0f !important;
    border-right: 1px solid rgba(251, 191, 36, 0.1) !important;
}

/* Header — bouton fermer */
.wd-side-hidden-nav .wd-heading {
    background: #0f0f0f !important;
    border-bottom: 1px solid rgba(251, 191, 36, 0.12) !important;
    padding: 16px 20px !important;
}
.wd-side-hidden-nav .close-side-widget a {
    color: #9ca3af !important;
    font-size: 13px !important;
    transition: color 0.2s !important;
}
.wd-side-hidden-nav .close-side-widget a:hover {
    color: #fbbf24 !important;
}

/* Reset liste */
.wd-side-hidden-nav .wd-nav-mobile {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.wd-side-hidden-nav .wd-nav-mobile .wd-sub-menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ── Items principaux (level-0) ── */
.wd-side-hidden-nav .wd-nav-mobile > .item-level-0 {
    border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
}

.wd-side-hidden-nav .wd-nav-mobile > .item-level-0 > .woodmart-nav-link {
    display: block !important;
    padding: 14px 20px !important;
    color: #d1d5db !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
}

/* Hover + Actif level-0 */
.wd-side-hidden-nav .wd-nav-mobile > .item-level-0 > .woodmart-nav-link:hover,
.wd-side-hidden-nav .wd-nav-mobile > .item-level-0.current-menu-item > .woodmart-nav-link,
.wd-side-hidden-nav .wd-nav-mobile > .item-level-0.current-menu-ancestor > .woodmart-nav-link,
.wd-side-hidden-nav .wd-nav-mobile > .item-level-0.current-menu-parent > .woodmart-nav-link {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.06) !important;
}

/* ── Flèche toggle sous-menu ── */
.wd-side-hidden-nav .wd-nav-mobile .wd-nav-opener {
    color: #6b7280 !important;
    transition: color 0.2s !important;
    border-left: 1px solid rgba(255, 255, 255, 0.04) !important;
}
.wd-side-hidden-nav .wd-nav-mobile .wd-nav-opener:hover,
.wd-side-hidden-nav .wd-nav-mobile .item-level-0.wd-opened > .wd-nav-opener {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.06) !important;
}

/* ── Sous-menus (level-1) ── */
.wd-side-hidden-nav .wd-nav-mobile .wd-sub-menu {
    background: rgba(251, 191, 36, 0.03) !important;
    border-left: 2px solid rgba(251, 191, 36, 0.2) !important;
    margin-left: 16px !important;
    border-radius: 0 0 0 8px !important;
}

.wd-side-hidden-nav .wd-nav-mobile .item-level-1 > .woodmart-nav-link {
    display: block !important;
    padding: 11px 20px !important;
    color: #9ca3af !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    border-left: 3px solid transparent !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
}

.wd-side-hidden-nav .wd-nav-mobile .item-level-1 > .woodmart-nav-link:hover,
.wd-side-hidden-nav .wd-nav-mobile .item-level-1.current-menu-item > .woodmart-nav-link {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.06) !important;
    border-left-color: #fbbf24 !important;
}

/* ══════════════════════════════════════════════
   MON COMPTE — SECTION MOBILE
   ══════════════════════════════════════════════ */

/* Séparateur avant Mon Compte */
.wd-side-hidden-nav .wd-nav-mobile > .menu-item-account {
    margin-top: 8px !important;
    border-top: 1px solid rgba(251, 191, 36, 0.12) !important;
    padding-top: 8px !important;
    border-bottom: none !important;
}

.wd-side-hidden-nav .wd-nav-mobile > .menu-item-account > a {
    display: block !important;
    padding: 14px 20px !important;
    color: #fbbf24 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
}

/* Sous-menu Mon Compte mobile */
.wd-side-hidden-nav .menu-item-account .wd-sub-menu {
    background: rgba(251, 191, 36, 0.03) !important;
    border-left: 2px solid rgba(251, 191, 36, 0.15) !important;
    margin-left: 16px !important;
    padding: 4px 0 !important;
}

.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link a {
    display: block !important;
    padding: 10px 20px !important;
    color: #9ca3af !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    border-left: 3px solid transparent !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
}

.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link a:hover,
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link.is-active a {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.06) !important;
    border-left-color: #fbbf24 !important;
}

/* Séparateurs sidebar WooCommerce standard (page Mon Compte) */
.woocommerce-MyAccount-navigation-link--affiliation,
.woocommerce-MyAccount-navigation-link--revendeur {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Séparateurs entre groupes Mon Compte */
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--messagerie {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
    padding-top: 4px !important;
}
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--affiliation,
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--revendeur,
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--affiliation-transactions,
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--revendeur-transactions {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
    padding-top: 4px !important;
}
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--edit-account {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
    padding-top: 4px !important;
}

/* Déconnexion */
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
    padding-top: 4px !important;
}
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--customer-logout a {
    color: #6b7280 !important;
    font-size: 12px !important;
}
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    color: #ef4444 !important;
    border-left-color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

/* Masquer Wishlist mobile (doublon icône header) */
.wd-side-hidden-nav .menu-item-account .woocommerce-MyAccount-navigation-link--wishlist {
    display: none !important;
}

/* Burger icon header */
.wd-header-burger .wd-burger,
.wd-burger-icon .wd-burger {
    color: #d1d5db !important;
    transition: color 0.2s !important;
}
.wd-header-burger:hover .wd-burger,
.wd-burger-icon:hover .wd-burger {
    color: #fbbf24 !important;
}


/* Masquer le ":" généré par WooCommerce quand la key est vide (lien Modifier ma médaille) */
li.variation- > .item-variation-name,
.woocommerce-mini-cart .variation li.variation- > dt,
.cart_item .variation li.variation- > dt {
    display: none !important;
}


/* ── Lien "Modifier ma médaille" : passe au-dessus du wd-fill WoodMart ── */
.sp-cart-edit-link {
    position: relative !important;
    z-index: 10 !important;
    display: inline-block !important;
}

/* Masque le ":" WooCommerce quand la key est vide */
li.variation- > .item-variation-name,
.woocommerce-mini-cart .variation li.variation- > .item-variation-name,
.cart_item .variation li.variation- > .item-variation-name {
    display: none !important;
}



/* ─── Notifications Push : préférences par type (espace client) ─── */
/* @since 9.6.11 */
.qr-push-types-list {
    margin-top: 16px;
    padding: 16px;
    background: #161616 !important;
    border: 1px solid rgba(251, 191, 36, 0.15) !important;
    border-radius: 8px !important;
}
.qr-push-types-list h4 {
    color: #fff !important;
    margin: 0 0 6px !important;
}
.qr-push-types-list .qr-help-text {
    color: rgba(255,255,255,0.65) !important;
    font-size: 12px !important;
    margin: 0 0 14px !important;
}
.qr-push-type-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
    color: #fff !important;
    margin-bottom: 4px !important;
}
.qr-push-type-row:hover { background: rgba(251, 191, 36, 0.06) !important; }
.qr-push-type-row.is-critical {
    background: rgba(251, 191, 36, 0.08) !important;
    cursor: not-allowed !important;
}
.qr-push-type-row input[type="checkbox"] {
    margin-top: 3px !important;
    flex-shrink: 0 !important;
}
.qr-push-type-text {
    flex: 1 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}
.qr-push-locked {
    display: inline-block !important;
    margin-left: 8px !important;
    font-size: 11px !important;
    padding: 2px 8px !important;
    background: rgba(251, 191, 36, 0.18) !important;
    color: #fbbf24 !important;
    border-radius: 10px !important;
}

/* ─── Contact Form sur signalements publics (perdu/trouvé) ─── */
/* @since 9.6.13 */
.sp-contact-form-wrapper { margin-top: 16px !important; }
.sp-contact-form {
    background: #1a1a1a !important;
    border: 1px solid rgba(251, 191, 36, 0.2) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-top: 12px !important;
    color: #fff !important;
}
.sp-contact-intro {
    margin: 0 0 16px !important;
    color: rgba(255, 255, 255, 0.75) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}
.sp-contact-field { margin-bottom: 14px !important; }
.sp-contact-field label {
    display: block !important;
    color: #fbbf24 !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    margin-bottom: 6px !important;
}
.sp-contact-field label .required { color: #ef4444 !important; }
.sp-contact-field input,
.sp-contact-field textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 12px !important;
    background: #0f0f0f !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-size: 14px !important;
    font-family: inherit !important;
    transition: border-color 0.15s !important;
}
.sp-contact-field input:focus,
.sp-contact-field textarea:focus {
    outline: none !important;
    border-color: #fbbf24 !important;
}
.sp-contact-field textarea { resize: vertical !important; min-height: 100px !important; }
.sp-contact-charcount {
    text-align: right !important;
    font-size: 11px !important;
    color: rgba(255, 255, 255, 0.4) !important;
    margin-top: 4px !important;
}
.sp-contact-actions {
    display: flex !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
    margin-top: 16px !important;
}
.sp-contact-result {
    padding: 12px 14px !important;
    border-radius: 6px !important;
    margin-top: 14px !important;
    font-size: 14px !important;
}
.sp-contact-success {
    background: rgba(34, 197, 94, 0.15) !important;
    border: 1px solid rgba(34, 197, 94, 0.4) !important;
    color: #86efac !important;
}
.sp-contact-error {
    background: rgba(239, 68, 68, 0.15) !important;
    border: 1px solid rgba(239, 68, 68, 0.4) !important;
    color: #fca5a5 !important;
}
.sp-contact-gdpr {
    margin: 14px 0 0 !important;
    font-size: 11px !important;
    color: rgba(255, 255, 255, 0.5) !important;
    text-align: center !important;
}
.sp-found-btn-primary {
    background: linear-gradient(180deg, #fbbf24, #f59e0b) !important;
    color: #0f0f0f !important;
    font-weight: 600 !important;
}
.sp-found-btn-primary:hover { filter: brightness(1.1) !important; }

/* ─── Contact Form v9.6.14 — mode claim + justificatifs ─── */
.sp-contact-triggers {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 12px !important;
}
.sp-contact-title {
    color: #fbbf24 !important;
    margin: 0 0 12px !important;
    font-size: 18px !important;
    font-weight: 600 !important;
}
.sp-contact-claim-warning {
    background: rgba(251, 191, 36, 0.12) !important;
    border: 1px solid rgba(251, 191, 36, 0.4) !important;
    border-radius: 8px !important;
    padding: 14px !important;
    margin: 0 0 16px !important;
}
.sp-contact-claim-warning strong {
    color: #fbbf24 !important;
    display: block !important;
    margin-bottom: 6px !important;
}
.sp-contact-claim-warning p {
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}
.sp-contact-help {
    margin: 6px 0 0 !important;
    font-size: 12px !important;
    color: rgba(255, 255, 255, 0.55) !important;
    line-height: 1.45 !important;
}
.sp-contact-field select {
    width: 100% !important;
    padding: 10px 12px !important;
    background: #0f0f0f !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-size: 14px !important;
    cursor: pointer !important;
}
.sp-contact-field input[type="file"] {
    width: 100% !important;
    padding: 10px 12px !important;
    background: #0f0f0f !important;
    border: 1px dashed rgba(251, 191, 36, 0.4) !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-size: 13px !important;
    cursor: pointer !important;
}
.sp-contact-field input[type="file"]::-webkit-file-upload-button {
    background: #fbbf24 !important;
    color: #0f0f0f !important;
    border: none !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    margin-right: 10px !important;
    cursor: pointer !important;
}
.sp-contact-proof-preview { margin-top: 10px !important; }
.sp-contact-preview-list {
    background: rgba(251, 191, 36, 0.06) !important;
    border: 1px solid rgba(251, 191, 36, 0.2) !important;
    border-radius: 6px !important;
    padding: 10px !important;
}
.sp-contact-preview-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 6px 0 !important;
    color: #fff !important;
    font-size: 13px !important;
}
.sp-contact-preview-icon { flex-shrink: 0 !important; font-size: 18px !important; }
.sp-contact-preview-name {
    flex: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.sp-contact-preview-size {
    flex-shrink: 0 !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 11px !important;
}
.sp-contact-preview-error {
    background: rgba(239, 68, 68, 0.15) !important;
    border: 1px solid rgba(239, 68, 68, 0.4) !important;
    color: #fca5a5 !important;
    padding: 10px 12px !important;
    border-radius: 6px !important;
    margin-top: 8px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}
.sp-contact-rgpd {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 6px !important;
    padding: 12px !important;
}
.sp-contact-checkbox-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    cursor: pointer !important;
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}
.sp-contact-checkbox-label input[type="checkbox"] {
    margin-top: 2px !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
}

/* ─── Infobulles notifications push (v9.6.22) ─── */
.qr-push-type-text .qr-push-info {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 18px !important;
    height: 18px !important;
    margin-left: 6px !important;
    font-size: 13px !important;
    cursor: pointer !important;
    opacity: 0.6 !important;
    transition: opacity 0.2s !important;
    position: relative !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    vertical-align: middle !important;
}
.qr-push-type-text .qr-push-info:hover,
.qr-push-type-text .qr-push-info:focus,
.qr-push-type-text .qr-push-info.is-active {
    opacity: 1 !important;
    outline: none !important;
}

/* Bulle qui apparaît au hover / focus / tap */
.qr-push-type-text .qr-push-info::after {
    content: attr(data-description) !important;
    position: absolute !important;
    bottom: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    min-width: 240px !important;
    max-width: 340px !important;
    padding: 10px 14px !important;
    background: #1e1e1e !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    text-align: left !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.18s, visibility 0.18s !important;
    z-index: 9999 !important;
    white-space: normal !important;
    word-wrap: break-word !important;
}
/* Flèche sous la bulle */
.qr-push-type-text .qr-push-info::before {
    content: "" !important;
    position: absolute !important;
    bottom: calc(100% + 2px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    border: 6px solid transparent !important;
    border-top-color: #1e1e1e !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.18s, visibility 0.18s !important;
    z-index: 9999 !important;
}
.qr-push-type-text .qr-push-info:hover::after,
.qr-push-type-text .qr-push-info:hover::before,
.qr-push-type-text .qr-push-info:focus::after,
.qr-push-type-text .qr-push-info:focus::before,
.qr-push-type-text .qr-push-info.is-active::after,
.qr-push-type-text .qr-push-info.is-active::before {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Responsive : sur mobile, la bulle se recale à droite pour ne pas sortir */
@media (max-width: 640px) {
    .qr-push-type-text .qr-push-info::after {
        left: auto !important;
        right: -10px !important;
        transform: none !important;
        min-width: 220px !important;
        max-width: calc(100vw - 40px) !important;
    }
    .qr-push-type-text .qr-push-info::before {
        left: auto !important;
        right: 0 !important;
        transform: none !important;
    }
}