/* ==================================================================================
   CSS POCHOIRS SHORTCODES - APPLE DESIGN SYSTEM
   ================================================================================== */

/* ==================== BASE & HÉRITAGE APPLE ==================== */

/* Héritage polices Apple San Francisco */
.pochoirs-container,
.pochoirs-container *,
.pochoirs-section-title,
.pochoirs-review-card,
.pochoirs-custom-review-form,
.pochoirs-popup-content,
.pochoirs-tutorial-card,
.pochoirs-inspiration-section,
.pochoirs-form-group input,
.pochoirs-form-group textarea,
.pochoirs-star-rating label {
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

/* Container principal */
.pochoirs-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 22px;
}

/* Effet survol global Apple */
.pochoirs-hover-effect {
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.pochoirs-hover-effect:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Titre de section Apple */
.pochoirs-section-title {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 60px;
    color: #1d1d1f;
    letter-spacing: -0.02em;
}

/* Classes utilitaires Apple */
.zoom-hover {
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.zoom-hover:hover {
    transform: translateY(-2px);
}

/* ==================== DONNÉES COMPORTEMENTALES ==================== */

.pochoirs-behavioral-section {
    background: none;
    padding: 80px 0;
    margin-top: 40px;
}

.pochoirs-behavioral-header {
    text-align: center;
    margin-bottom: 50px;
}

.pochoirs-behavioral-title {
    font-size: 32px;
    font-weight: 700;
    color: #1d1d1f;
    margin-bottom: 15px;
    letter-spacing: -0.02em;
}

.pochoirs-behavioral-subtitle {
    color: #6e6e73;
    font-size: 17px;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
    font-weight: 400;
}

/* Grid adaptatif Apple */
.pochoirs-behavioral-products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Responsive behavioral Apple */
@media (min-width: 1200px) {
    .pochoirs-behavioral-products {
        grid-template-columns: repeat(4, 1fr);
        max-width: 1200px;
        gap: 30px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .pochoirs-behavioral-products {
        grid-template-columns: repeat(3, 1fr);
        max-width: 950px;
        gap: 25px;
    }
    
    .pochoirs-behavioral-product,
    .pochoirs-recently-viewed-product {
        height: 420px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .pochoirs-behavioral-products {
        grid-template-columns: repeat(2, 1fr);
        max-width: 650px;
        gap: 20px;
    }
    
    .pochoirs-behavioral-product,
    .pochoirs-recently-viewed-product {
        height: 380px;
    }
}

/* Carte produit comportemental Apple */
.pochoirs-behavioral-product {
    background: white;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid transparent;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    display: block;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Hover effects seulement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .pochoirs-behavioral-product:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
        text-decoration: none;
        color: inherit;
        border-color: var(--global-palette1, #007aff);
    }

    .pochoirs-behavioral-product:hover .pochoirs-product-title {
        color: var(--global-palette1, #007aff);
    }

    .pochoirs-product-image:hover .secondary-image {
        opacity: 1;
    }
}

/* Feedback tactile mobile */
.pochoirs-behavioral-product:active {
    transform: scale(0.98);
}

/* Image produit Apple */
.pochoirs-product-image {
    position: relative;
    overflow: hidden;
}

.pochoirs-product-image img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.pochoirs-product-image .primary-image {
    position: relative;
    z-index: 1;
}

.pochoirs-product-image .secondary-image {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 2;
    transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Badge comportemental Apple */
.pochoirs-behavior-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--global-palette1, #007aff);
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(0, 122, 255, 0.3);
    z-index: 3;
    letter-spacing: 0.01em;
}

/* Informations produit Apple */
.pochoirs-product-info {
    padding: 25px;
}

.pochoirs-product-title {
    font-size: 19px;
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 10px;
    line-height: 1.3;
    letter-spacing: -0.01em;
}

.pochoirs-product-price {
    font-size: 17px;
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 15px;
    letter-spacing: -0.01em;
}

.pochoirs-product-stats {
    margin-bottom: 15px;
    padding: 15px;
    background: #f5f5f7;
    border-radius: 12px;
    text-align: center;
}

.pochoirs-stats-highlight {
    font-size: 17px;
    font-weight: 600;
    color: var(--global-palette1, #007aff);
    margin-bottom: 6px;
    letter-spacing: -0.01em;
}

.pochoirs-stats-text {
    font-size: 14px;
    color: #6e6e73;
    line-height: 1.4;
    font-weight: 400;
}

/* Étiquette "Plus populaire"*/
.pochoirs-most-popular .pochoirs-product-image::after {
    content: attr(data-popular-text); /* Utilise l'attribut data */
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: var(--global-palette1, #007aff);
    color: white;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 3px 8px rgba(0, 122, 255, 0.4);
    z-index: 10;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

/* Fallback si pas de data-attribute */
.pochoirs-most-popular .pochoirs-product-image:not([data-popular-text])::after {
    content: "🔥"; /* Juste l'emoji en fallback */
}

/* ==================== PRODUITS VUS RÉCEMMENT ==================== */

.pochoirs-recently-viewed-section {
    background: none;
    padding: 80px 0;
    margin-top: 40px;
}

.pochoirs-recently-viewed-header {
    text-align: center;
    margin-bottom: 50px;
}

.pochoirs-recently-viewed-title {
    font-size: 32px;
    font-weight: 700;
    color: #1d1d1f;
    margin-bottom: 15px;
    letter-spacing: -0.02em;
}

.pochoirs-recently-viewed-subtitle {
    color: #6e6e73;
    font-size: 17px;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
    font-weight: 400;
}

/* Grid adaptatif - Même système que behavioral */
.pochoirs-recently-viewed-products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Responsive recently viewed */
@media (min-width: 1200px) {
    .pochoirs-recently-viewed-products {
        grid-template-columns: repeat(4, 1fr);
        max-width: 1200px;
        gap: 30px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .pochoirs-recently-viewed-products {
        grid-template-columns: repeat(3, 1fr);
        max-width: 950px;
        gap: 25px;
    }
    
    .pochoirs-recently-viewed-product {
        height: 420px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .pochoirs-recently-viewed-products {
        grid-template-columns: repeat(2, 1fr);
        max-width: 650px;
        gap: 20px;
    }
    
    .pochoirs-recently-viewed-product {
        height: 380px;
    }
}

/* Carte produit récemment vu Apple */
.pochoirs-recently-viewed-product {
    background: white;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid transparent;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    display: block;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Hover effects seulement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .pochoirs-recently-viewed-product:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
        text-decoration: none;
        color: inherit;
        border-color: var(--global-palette1, #007aff);
    }

    .pochoirs-recently-viewed-product:hover .pochoirs-product-title {
        color: var(--global-palette1, #007aff);
    }
}

/* Feedback tactile mobile */
.pochoirs-recently-viewed-product:active {
    transform: scale(0.98);
}

/* Badge temporel Apple */
.pochoirs-time-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: #6e6e73;
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(110, 110, 115, 0.3);
    z-index: 3;
    letter-spacing: 0.01em;
}

/* Étiquette "Plus récent" Apple */
.recent-badge-text {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: #34c759;
    color: white;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 3px 8px rgba(52, 199, 89, 0.4);
    z-index: 10;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

/* Stats spécifiques au récemment vu */
.pochoirs-recently-viewed-product .pochoirs-stats-highlight {
    color: #6e6e73;
}

/* Chargement des produits récents */
.pochoirs-recently-viewed-loading {
    text-align: center;
    color: #6e6e73;
    font-size: 15px;
}

/* ==================== RESPONSIVE MOBILE APPLE ==================== */

@media (max-width: 768px) {
    /* Sections principales */
    .pochoirs-behavioral-section,
    .pochoirs-recently-viewed-section {
        padding: 60px 0;
        margin-top: 30px;
    }
    
    /* Headers */
    .pochoirs-behavioral-title,
    .pochoirs-recently-viewed-title {
        font-size: 28px;
        margin-bottom: 12px;
    }
    
    .pochoirs-behavioral-subtitle,
    .pochoirs-recently-viewed-subtitle {
        font-size: 15px;
    }
    
    /* Grids mobiles - scroll horizontal Apple */
    .pochoirs-behavioral-products,
    .pochoirs-recently-viewed-products {
        display: flex !important;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-behavior: smooth;
        gap: 20px;
        padding-bottom: 10px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        max-width: none;
    }
    
    .pochoirs-behavioral-products::-webkit-scrollbar,
    .pochoirs-recently-viewed-products::-webkit-scrollbar {
        display: none;
    }
    
    /* Cartes en défilement Apple style */
    .pochoirs-behavioral-product,
    .pochoirs-recently-viewed-product {
        flex: 0 0 280px;
        min-width: 280px;
        max-width: 280px;
        scroll-snap-align: start;
    }
    
    .pochoirs-product-info {
        padding: 20px;
    }
    
    .pochoirs-product-title {
        font-size: 17px;
        line-height: 1.3;
        margin-bottom: 8px;
    }
    
    .pochoirs-product-price {
        font-size: 15px;
        margin-bottom: 12px;
    }
    
    .pochoirs-product-stats {
        padding: 12px;
    }
    
    .pochoirs-stats-highlight {
        font-size: 15px;
    }
    
    .pochoirs-stats-text {
        font-size: 13px;
    }
}

/* ==================== TUTORIELS ==================== */

.pochoirs-tutorials-section {
    background: none;
    padding: 80px 0;
}

.pochoirs-tutorials-intro {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 50px;
}

.pochoirs-tutorials-intro h2 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #1d1d1f;
    letter-spacing: -0.02em;
}

.pochoirs-tutorials-intro p {
    font-size: 17px;
    color: #6e6e73;
    line-height: 1.6;
    font-weight: 400;
}

/* Étapes de base Apple */
.pochoirs-basic-steps {
    background: #f5f5f7;
    padding: 40px;
    border-radius: 18px;
    margin-bottom: 50px;
    position: relative;
    overflow: hidden;
}

.pochoirs-basic-steps::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--global-palette1, #007aff) 0%, #7c3aed 100%);
    border-radius: 18px 18px 0 0;
}

.pochoirs-basic-steps h3 {
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 30px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.pochoirs-steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.pochoirs-basic-step {
    text-align: center;
    padding: 20px;
}

.pochoirs-step-number-circle {
    width: 60px;
    height: 60px;
    background: var(--global-palette1, #007aff);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 24px;
    margin: 0 auto 15px;
}

.pochoirs-basic-step h4 {
    font-size: 19px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.pochoirs-basic-step p {
    color: #6e6e73;
    line-height: 1.6;
    font-size: 15px;
    font-weight: 400;
}

/* TUTORIELS - Grid adaptatif Apple */
.pochoirs-tutorials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 30px;
    margin-bottom: 50px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* TUTORIELS - Responsive Apple */
@media (min-width: 1200px) {
    .pochoirs-tutorials-grid {
        grid-template-columns: repeat(3, 1fr);
        max-width: 1200px;
        gap: 30px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .pochoirs-tutorials-grid {
        grid-template-columns: repeat(3, 1fr);
        max-width: 950px;
        gap: 25px;
    }
}

@media (min-width: 769px) and (max-width: 991px) {
    .pochoirs-tutorials-grid {
        grid-template-columns: repeat(2, 1fr);
        max-width: 650px;
        gap: 20px;
    }
}

.pochoirs-tutorial-card {
    background: white;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    border: 1px solid transparent;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Hover effects seulement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .pochoirs-tutorial-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
        border-color: var(--global-palette1, #007aff);
    }
    
    .pochoirs-tutorial-video:hover .pochoirs-play-overlay {
        opacity: 1;
    }
    
    .pochoirs-play-overlay:hover .pochoirs-play-button-large {
        transform: scale(1.1);
    }
    
    .pochoirs-tutorial-link:hover,
    .pochoirs-cta-tutorials:hover {
        color: white !important;
    }
    
    .pochoirs-cta-tutorials:hover,
    .pochoirs-cta-tutorial-dedicated:hover {
        background: var(--global-palette2, #0056d2);
        transform: translateY(-1px);
    }
}

/* Feedback tactile mobile */
.pochoirs-tutorial-card:active {
    transform: scale(0.98);
}

.pochoirs-cta-tutorials:active,
.pochoirs-cta-tutorial-dedicated:active {
    transform: scale(0.98);
}

.pochoirs-tutorial-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.pochoirs-tutorial-card-link:hover,
.pochoirs-tutorial-card-link:focus,
.pochoirs-tutorial-card-link:active {
    text-decoration: none;
    color: inherit;
}

.pochoirs-tutorial-video {
    position: relative;
    cursor: pointer;
}

.pochoirs-tutorial-thumbnail {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    object-fit: cover;
}

.pochoirs-play-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.pochoirs-play-button-large {
    width: 70px;
    height: 70px;
    background: rgba(0, 122, 255, 0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    transform: scale(1);
    transition: transform 0.3s ease;
}

.pochoirs-tutorial-duration {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.pochoirs-tutorial-info {
    padding: 25px;
}

.pochoirs-tutorial-info h3 {
    font-size: 19px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.pochoirs-tutorial-info p {
    color: #6e6e73;
    line-height: 1.6;
    margin-bottom: 15px;
    font-size: 15px;
    font-weight: 400;
}

.pochoirs-tutorial-stats {
    display: flex;
    gap: 20px;
    font-size: 14px;
    color: #86868b;
}

.pochoirs-tutorial-features {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 15px;
}

.pochoirs-feature {
    background: #f0f9ff;
    color: #0369a1;
    padding: 5px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 500;
}

.pochoirs-tutorial-link {
    display: inline-block;
    margin-top: 10px;
    color: var(--global-palette1, #007aff);
    font-weight: 500;
    text-decoration: none;
    transition: color 0.3s;
    font-size: 15px;
}

.pochoirs-tutorial-meta {
    display: flex;
    gap: 15px;
    margin-top: 10px;
    font-size: 14px;
    color: #86868b;
}

/* CTA Tutoriels Apple */
.pochoirs-tutorials-cta {
    text-align: center;
}

.pochoirs-cta-tutorials,
.pochoirs-cta-tutorial-dedicated {
    background: var(--global-palette1, #007aff);
    color: white;
    border: none;
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 17px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
    margin-bottom: 15px;
    text-decoration: none;
    display: inline-block;
    letter-spacing: -0.01em;
}

.pochoirs-tutorials-cta-note,
.pochoirs-tutorial-cta-note {
    color: #6e6e73;
    font-size: 14px;
    font-style: italic;
}

/* Tutoriel dédié */
.pochoirs-dedicated-tutorial {
    max-width: 800px;
    margin: 0 auto;
}

.pochoirs-tutorial-card.pochoirs-featured {
    border: 2px solid var(--global-palette1, #007aff);
    box-shadow: 0 10px 30px rgba(0, 122, 255, 0.2);
}

.pochoirs-tutorial-cta {
    text-align: center;
    margin-top: 40px;
}

/* ==================== RESPONSIVE MOBILE TUTORIELS ==================== */

@media (max-width: 768px) {
    /* Sections principales */
    .pochoirs-tutorials-section {
        padding: 60px 0;
    }
    
    /* Headers */
    .pochoirs-tutorials-intro h2 {
        font-size: 28px;
        margin-bottom: 12px;
    }
    
    .pochoirs-tutorials-intro p {
        font-size: 15px;
    }
    
    /* Grids mobiles - scroll horizontal Apple */
    .pochoirs-tutorials-grid {
        display: flex !important;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-behavior: smooth;
        gap: 20px;
        padding-bottom: 10px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        max-width: none;
    }
    
    .pochoirs-tutorials-grid::-webkit-scrollbar {
        display: none;
    }
    
    /* Cartes en défilement Apple style */
    .pochoirs-tutorial-card-link {
        flex: 0 0 280px;
        min-width: 280px;
        max-width: 280px;
        scroll-snap-align: start;
    }
    
    .pochoirs-tutorial-info {
        padding: 20px;
    }
    
    .pochoirs-tutorial-info h3 {
        font-size: 17px;
        margin-bottom: 8px;
    }
    
    .pochoirs-tutorial-info p {
        font-size: 14px;
        margin-bottom: 12px;
    }
    
    .pochoirs-tutorial-stats {
        font-size: 13px;
    }
    
    /* Étapes mobile */
    .pochoirs-steps-grid {
        grid-template-columns: 1fr;
    }
    
    .pochoirs-basic-steps {
        padding: 30px 20px;
    }
    
    .pochoirs-step-number-circle {
        width: 50px;
        height: 50px;
        font-size: 20px;
        margin-bottom: 12px;
    }
    
    .pochoirs-basic-step h4 {
        font-size: 17px;
    }
    
    .pochoirs-basic-step p {
        font-size: 14px;
    }
}

/* ==================== GUIDE DES TAILLES APPLE ==================== */

.pochoirs-size-guide-section {
    background: #f5f5f7;
    padding: 80px 0;
}

.pochoirs-size-guide-content {
    background: white;
    border-radius: 18px;
    padding: 40px;
    max-width: 1000px;
    margin: 0 auto;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.pochoirs-size-guide-visual {
    margin-bottom: 40px;
}

.pochoirs-room-simulation {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 30px;
}

.pochoirs-room-bg {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.pochoirs-size-overlays {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pochoirs-size-overlay {
    position: absolute;
    border: 2px solid var(--global-palette1, #007aff);
    background: rgba(0, 122, 255, 0.2);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    color: var(--global-palette1, #007aff);
    transition: all 0.3s ease;
    opacity: 0.7;
    font-size: 14px;
}

.pochoirs-size-overlay.active {
    opacity: 1;
    border-color: var(--global-palette1, #007aff);
    background: rgba(0, 122, 255, 0.3);
    transform: scale(1.05);
}

.pochoirs-size-40 { width: 80px; height: 80px; top: 30%; left: 20%; }
.pochoirs-size-60 { width: 120px; height: 120px; top: 20%; right: 30%; }
.pochoirs-size-80 { width: 160px; height: 160px; bottom: 25%; left: 15%; }
.pochoirs-size-100 { width: 200px; height: 200px; top: 15%; left: 45%; }

.pochoirs-size-guide-tips h3 {
    text-align: center;
    margin-bottom: 30px;
    font-size: 22px;
    color: #1d1d1f;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.pochoirs-size-tips-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.pochoirs-size-tip {
    background: #f5f5f7;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
}

.pochoirs-tip-size {
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 8px;
    font-size: 17px;
    letter-spacing: -0.01em;
}

.pochoirs-tip-text {
    color: #6e6e73;
    font-size: 14px;
    font-weight: 400;
}

.pochoirs-size-selector-buttons {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.pochoirs-size-select-btn {
    background: white;
    border: 1px solid #d2d2d7;
    color: #1d1d1f;
    padding: 12px 15px;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
    font-size: 14px;
}

.pochoirs-size-select-btn:hover,
.pochoirs-size-select-btn.active {
    background: var(--global-palette1, #007aff);
    color: white;
    border-color: var(--global-palette1, #007aff);
}

/* ==================== COLLECTIONS APPLE ==================== */

.pochoirs-inspiration-section {
    background: white;
    padding: 80px 0;
}

.pochoirs-inspiration-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.pochoirs-inspiration-text {
    font-size: 17px;
    line-height: 1.6;
    color: #6e6e73;
    margin-bottom: 40px;
    font-weight: 400;
}

.pochoirs-inspiration-highlight {
    background: #f5f5f7;
    padding: 40px;
    border-radius: 18px;
    margin: 40px 0;
    position: relative;
    overflow: hidden;
}

.pochoirs-inspiration-highlight::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--global-palette1, #007aff) 0%, #7c3aed 100%);
    border-radius: 18px 18px 0 0;
}

.pochoirs-inspiration-highlight h3 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.pochoirs-inspiration-highlight p {
    font-size: 15px;
    line-height: 1.6;
    color: #6e6e73;
    font-weight: 400;
}

.pochoirs-highlight-cta {
    text-align: center;
    margin-top: 25px;
}

.pochoirs-btn-highlight {
    background: white;
    color: var(--global-palette1, #007aff);
    border: 1px solid #d2d2d7;
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
    text-decoration: none;
    display: inline-block;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.pochoirs-btn-highlight:hover {
    background: #f5f5f7;
    transform: translateY(-1px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    color: var(--global-palette2, #0056d2);
    border-color: var(--global-palette1, #007aff);
}

.pochoirs-collections-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 40px;
}

.pochoirs-collection-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    text-align: center;
}

.pochoirs-category-image {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #d2d2d7;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.pochoirs-collection-item:hover .pochoirs-category-image {
    transform: scale(1.05);
    border-color: var(--global-palette1, #007aff);
    box-shadow: 0 8px 20px rgba(0, 122, 255, 0.2);
}

.pochoirs-collection-link {
    background: #f5f5f7;
    padding: 20px;
    border-radius: 12px;
    text-decoration: none;
    color: #1d1d1f;
    font-weight: 500;
    transition: all 0.3s;
    border: 1px solid transparent;
    margin: 0;
    text-align: center;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}

.pochoirs-collection-link:hover {
    background: var(--global-palette1, #007aff);
    color: white;
    transform: translateY(-2px);
    border-color: var(--global-palette1, #007aff);
}

.pochoirs-collections-subtitle {
    text-align: center;
    color: #6e6e73;
    font-size: 15px;
    margin-bottom: 30px;
    font-style: italic;
}

/* ==================== AVIS CLIENTS ==================== */

.pochoirs-social-proof {
    padding: 80px 0;
    background: #f5f5f7;
}

.pochoirs-rating-overview {
    background: white;
    padding: 40px;
    border-radius: 18px;
    margin-bottom: 50px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.pochoirs-rating-summary {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 40px;
    align-items: center;
}

.pochoirs-rating-main-score {
    text-align: center;
}

.pochoirs-big-score {
    font-size: 48px;
    font-weight: 700;
    color: #1d1d1f;
    letter-spacing: -0.02em;
}

.pochoirs-stars {
    color: #ff9500;
    font-size: 16px;
}

.pochoirs-rating-histogram {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pochoirs-rating-bar {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pochoirs-rating-bar-label {
    min-width: 60px;
    font-size: 14px;
    color: #6e6e73;
    font-weight: 400;
}

.pochoirs-rating-bar-bg {
    flex: 1;
    height: 6px;
    background: #e5e7eb;
    border-radius: 3px;
    overflow: hidden;
}

.pochoirs-rating-bar-fill {
    height: 100%;
    background: #ff9500;
    transition: width 0.8s ease;
}

.pochoirs-rating-count {
    min-width: 30px;
    font-size: 14px;
    color: #6e6e73;
    font-weight: 400;
}

.pochoirs-pros-cons {
    background: #f5f5f7;
    padding: 30px;
    border-radius: 12px;
}

.pochoirs-pros-cons h4 {
    font-weight: 600;
    margin-bottom: 15px;
    color: #1d1d1f;
    font-size: 17px;
    letter-spacing: -0.01em;
}

.pochoirs-pros-list,
.pochoirs-cons-list {
    margin-bottom: 20px;
}

.pochoirs-pros-list h5 {
    color: #34c759;
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 15px;
}

.pochoirs-cons-list h5 {
    color: #ff3b30;
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 15px;
}

.pochoirs-pros-list ul,
.pochoirs-cons-list ul {
    list-style: none;
    padding: 0;
}

.pochoirs-pros-list li,
.pochoirs-cons-list li {
    padding: 5px 0;
    font-size: 14px;
    color: #6e6e73;
}

.pochoirs-pros-list li::before {
    content: "✓ ";
    color: #34c759;
    font-weight: bold;
}

.pochoirs-cons-list li::before {
    content: "⚠ ";
    color: #ff3b30;
}

/* MASONRY LAYOUT */
.pochoirs-reviews-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

/* Masonry natif pour Firefox */
@supports (grid-template-rows: masonry) {
    .pochoirs-reviews-grid {
        grid-template-rows: masonry;
    }
}

.pochoirs-review-card {
    background: white;
    padding: 30px;
    border-radius: 18px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.pochoirs-review-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
}

.pochoirs-review-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.pochoirs-reviewer-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--global-palette1, #007aff);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
}

.pochoirs-reviewer-info h4 {
    font-weight: 600;
    color: #1d1d1f;
    font-size: 17px;
    letter-spacing: -0.01em;
}

.pochoirs-reviewer-info p {
    color: #6e6e73;
    font-size: 12px;
    font-weight: 400;
}

.pochoirs-review-stars {
    color: #ff9500;
    margin-bottom: 15px;
    font-size: 16px;
}

.pochoirs-review-text {
    color: #6e6e73;
    line-height: 1.6;
    font-style: italic;
    margin-bottom: 15px;
    font-size: 15px;
    font-weight: 400;
}

/* PHOTOS AGRANDIES */
.pochoirs-review-images {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.pochoirs-review-image {
    width: 100%;
    height: 120px;
    border-radius: 12px;
    object-fit: cover;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.pochoirs-review-image:hover {
    transform: scale(1.03) translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 122, 255, 0.25);
    border-radius: 16px;
}

/* Système de vote Apple */
.simple-vote-container {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 15px;
    padding: 8px 12px;
    background: #f5f5f7;
    border-radius: 20px;
    font-size: 14px;
    border: 1px solid transparent;
}

.vote-label {
    color: #6e6e73;
    font-weight: 500;
    margin-right: 5px;
}

.vote-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 12px;
    transition: all 0.2s ease;
    font-size: 14px;
    color: #1d1d1f;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.vote-btn:hover:not(.disabled) {
    background: #e3f2fd;
    color: var(--global-palette1, #007aff);
    transform: scale(1.05);
}

.vote-btn.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.vote-btn.voted {
    animation: pulse 0.3s ease;
}

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

.vote-count {
    font-weight: 600;
    color: #1d1d1f;
}

/* Pas d'avis Apple */
.pochoirs-no-reviews {
    text-align: center;
    padding: 80px 20px;
}

.pochoirs-no-reviews-content {
    background: white;
    padding: 60px 40px;
    border-radius: 18px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    max-width: 500px;
    margin: 0 auto;
}

.pochoirs-no-reviews h3 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.pochoirs-no-reviews p {
    color: #6e6e73;
    margin-bottom: 25px;
    font-size: 15px;
    font-weight: 400;
}

.pochoirs-btn-review {
    background: var(--global-palette1, #007aff);
    color: white;
    padding: 16px 24px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s;
    font-size: 15px;
    letter-spacing: -0.01em;
}

.pochoirs-btn-review:hover {
    background: var(--global-palette2, #0056d2);
    transform: translateY(-1px);
}

/* Bouton charger plus Apple */
.pochoirs-load-more-container {
    text-align: center;
    margin-top: 40px;
}

.pochoirs-btn-load-more {
    background: var(--global-palette1, #007aff);
    color: white;
    border: none;
    padding: 16px 24px;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
    font-size: 15px;
    letter-spacing: -0.01em;
}

.pochoirs-btn-load-more:hover {
    background: var(--global-palette2, #0056d2);
    transform: translateY(-1px);
}

.pochoirs-btn-load-more:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* RESPONSIVE MASONRY */
@media (max-width: 992px) {
    .pochoirs-reviews-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    
    .pochoirs-review-image {
        height: 100px;
    }
}

@media (max-width: 768px) {
    .pochoirs-reviews-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        display: grid !important;
    }
    
    .pochoirs-review-card {
        margin-bottom: 0;
        padding: 25px;
        break-inside: avoid;
    }
    
    .pochoirs-review-images {
        grid-template-columns: 1fr;
        gap: 10px;
        margin: 15px -25px 0 -25px;
        padding: 0 25px;
    }
    
    .pochoirs-review-image {
        height: 100px;
    }
    
    .pochoirs-rating-summary {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
    }
    
    .pochoirs-big-score {
        font-size: 40px;
    }
}

/* Badge "Client vérifié" */
.pochoirs-reviewer-info p {
    color: #6e6e73;
    font-size: 12px;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Badge "Client vérifié" - seulement pour le texte "Client vérifié" */
.pochoirs-reviewer-info p span:first-child {
    background: linear-gradient(135deg, #34c759 0%, #30d158 100%);
    color: white;
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.pochoirs-reviewer-info p span:first-child::before {
    content: "✓";
    font-size: 10px;
}

/* ==================== FORMULAIRE D'AVIS APPLE ==================== */

.pochoirs-review-form-section {
    margin-top: 60px;
    padding: 60px 40px;
    background: white;
    border-radius: 18px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.pochoirs-form-title {
    text-align: center;
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 40px;
    color: #1d1d1f;
    letter-spacing: -0.02em;
}

.pochoirs-review-form-container {
    max-width: 600px;
    margin: 0 auto;
}

.pochoirs-custom-review-form {
    background: transparent;
    padding: 0;
}

.pochoirs-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 25px;
}

.pochoirs-form-group {
    margin-bottom: 25px;
}

.pochoirs-form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #1d1d1f;
    font-size: 17px;
    letter-spacing: -0.01em;
}

.pochoirs-form-group input,
.pochoirs-form-group textarea {
    width: 100%;
    padding: 16px;
    border: 1px solid #d2d2d7;
    border-radius: 8px;
    font-family: inherit;
    font-size: 17px;
    transition: all 0.3s;
    box-sizing: border-box;
    background: white;
    color: #1d1d1f;
}

.pochoirs-form-group input:focus,
.pochoirs-form-group textarea:focus {
    border-color: var(--global-palette1, #007aff);
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.1);
}

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

/* Notation par étoiles Apple */
.pochoirs-star-rating {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 5px;
}

.pochoirs-star-rating input {
    display: none;
}

.pochoirs-star-rating label {
    font-size: 2rem;
    color: #d2d2d7;
    cursor: pointer;
    transition: color 0.3s;
    margin-bottom: 0 !important;
}

.pochoirs-star-rating label:hover,
.pochoirs-star-rating label:hover ~ label,
.pochoirs-star-rating input:checked ~ label {
    color: #ff9500;
}

/* Upload d'images Apple */
.pochoirs-image-upload {
    margin-top: 10px;
}

.pochoirs-upload-area {
    border: 2px dashed #d2d2d7;
    border-radius: 12px;
    padding: 40px 20px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s;
    background: #f5f5f7;
}

.pochoirs-upload-area:hover,
.pochoirs-upload-area.dragover {
    border-color: var(--global-palette1, #007aff);
    background: #f0f9ff;
}

.pochoirs-upload-icon {
    font-size: 3rem;
    display: block;
    margin-bottom: 15px;
}

.pochoirs-upload-content p {
    margin: 0 0 10px 0;
    color: #6e6e73;
    font-size: 15px;
}

.pochoirs-upload-link {
    color: var(--global-palette1, #007aff);
    font-weight: 500;
    text-decoration: underline;
}

.pochoirs-upload-note {
    font-size: 14px !important;
    color: #86868b !important;
}

/* Prévisualisation des images Apple */
.pochoirs-image-preview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 15px;
    margin-top: 20px;
    max-width: 400px;
}

.pochoirs-preview-item {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #d2d2d7;
}

.pochoirs-preview-image {
    width: 100%;
    height: 100px;
    object-fit: cover;
}

.pochoirs-preview-remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    opacity: 0.8;
}

.pochoirs-preview-remove:hover {
    background: rgba(255, 59, 48, 0.9);
    transform: scale(1.1);
    opacity: 1;
}

.pochoirs-preview-filename {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 5px;
    font-size: 12px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== AJOUTS POUR VERSION MOBILE - À AJOUTER APRÈS VOTRE CSS EXISTANT ===== */

/* Version mobile cachée par défaut */
.pochoirs-upload-mobile-wrapper {
    display: none;
}

.pochoirs-file-input-mobile {
    position: absolute;
    opacity: 0;
    width: 0.1px;
    height: 0.1px;
    overflow: hidden;
}

.pochoirs-upload-mobile-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    background: #f5f5f7;
    border: 2px solid #d2d2d7;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s;
    text-align: center;
    min-height: 120px;
    justify-content: center;
}

.pochoirs-upload-mobile-button:hover,
.pochoirs-upload-mobile-button:focus {
    border-color: var(--global-palette1, #007aff);
    background: #f0f9ff;
}

.pochoirs-upload-icon-mobile {
    font-size: 2.5rem;
    display: block;
    margin-bottom: 10px;
}

.pochoirs-upload-text-mobile {
    font-size: 16px;
    font-weight: 600;
    color: var(--global-palette1, #007aff);
    margin-bottom: 8px;
    display: block;
}

.pochoirs-upload-note-mobile {
    font-size: 12px;
    color: #86868b;
    display: block;
}

/* ===== RESPONSIVE : BASCULER ENTRE MOBILE ET DESKTOP ===== */

/* Desktop : Cacher mobile, afficher desktop */
@media (min-width: 769px) {
    .pochoirs-upload-mobile-wrapper {
        display: none !important;
    }
    
    .pochoirs-upload-area {
        display: block !important;
    }
}

/* Mobile : Cacher desktop, afficher mobile */
@media (max-width: 768px) {
    .pochoirs-upload-area {
        display: none !important;
    }
    
    .pochoirs-upload-mobile-wrapper {
        display: block !important;
    }
    
    .pochoirs-upload-mobile-button {
        padding: 25px 15px;
        min-height: 100px;
    }
    
    .pochoirs-upload-icon-mobile {
        font-size: 2rem;
        margin-bottom: 8px;
    }
    
    .pochoirs-upload-text-mobile {
        font-size: 15px;
        margin-bottom: 6px;
    }
    
    .pochoirs-upload-note-mobile {
        font-size: 11px;
    }
    
    /* Ajustements prévisualisation mobile */
    .pochoirs-image-preview {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        max-width: none;
    }
}

/* Très petits écrans */
@media (max-width: 480px) {
    .pochoirs-upload-mobile-button {
        padding: 20px 12px;
        min-height: 80px;
    }
    
    .pochoirs-upload-icon-mobile {
        font-size: 1.8rem;
        margin-bottom: 6px;
    }
    
    .pochoirs-upload-text-mobile {
        font-size: 14px;
        margin-bottom: 4px;
    }
    
    .pochoirs-upload-note-mobile {
        font-size: 10px;
    }
}

/* Boutons formulaire Apple */
.pochoirs-show-form-container {
    text-align: center;
    margin-top: 40px;
    margin-bottom: 40px;
}

.pochoirs-btn-show-form {
    background: var(--global-palette1, #007aff);
    color: white;
    border: none;
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 17px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
    margin-bottom: 15px;
    letter-spacing: -0.01em;
}

.pochoirs-btn-show-form:hover {
    background: var(--global-palette2, #0056d2);
    transform: translateY(-1px);
}

.pochoirs-form-submit {
    text-align: center;
    margin-top: 30px;
}

.pochoirs-btn-submit-review {
    background: var(--global-palette1, #007aff);
    color: white;
    border: none;
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 17px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
    margin-bottom: 15px;
    letter-spacing: -0.01em;
}

.pochoirs-btn-submit-review:hover {
    background: var(--global-palette2, #0056d2);
    transform: translateY(-1px);
}

.pochoirs-btn-submit-review:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.pochoirs-form-message {
    margin-top: 15px;
    padding: 15px;
    border-radius: 8px;
    text-align: center;
    font-weight: 500;
    font-size: 15px;
}

.pochoirs-form-message.success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.pochoirs-form-message.error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

/* Indicateur de progression d'upload */
.pochoirs-upload-progress {
    background: #e3f2fd;
    color: #1976d2;
    padding: 10px 15px;
    border-radius: 8px;
    margin-top: 15px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #bbdefb;
    animation: pochoirs-upload-pulse 1.5s ease-in-out infinite;
}

@keyframes pochoirs-upload-pulse {
    0%, 100% { opacity: 0.8; }
    50% { opacity: 1; }
}

.pochoirs-btn-submit-review:disabled {
    background: #94a3b8 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* ==================== POPUP AVIS APPLE PREMIUM ==================== */

.pochoirs-review-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2147483647 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(20px);
    animation: pochoirsFadeInApple 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.pochoirs-popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
}

.pochoirs-popup-content {
    position: relative;
    background: white;
    border-radius: 18px;
    max-width: 90vw;
    max-height: 90vh;
    overflow: hidden;
    box-shadow: 0 32px 64px rgba(0, 0, 0, 0.4);
    z-index: 999999;
    animation: pochoirsSlideInApple 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.pochoirs-popup-inner {
    display: grid;
    grid-template-columns: 1.2fr 450px;
    max-width: 1100px;
    min-height: 550px;
}

.pochoirs-popup-image {
    background: #f5f5f7;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    position: relative;
}

.pochoirs-popup-image img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
    object-fit: contain;
    z-index: 1;
    position: relative;
}

.pochoirs-popup-info {
    padding: 45px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: white;
    position: relative;
}

.pochoirs-popup-info::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(180deg, var(--global-palette1, #007aff), #7c3aed);
}

.pochoirs-popup-author {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}

.pochoirs-reviewer-avatar-popup {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: var(--global-palette1, #007aff);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 1.6rem;
    font-family: inherit;
    box-shadow: 0 8px 20px rgba(0, 122, 255, 0.3);
    position: relative;
}

.pochoirs-popup-author h4 {
    font-size: 24px;
    font-weight: 600;
    color: #1d1d1f;
    margin: 0;
    letter-spacing: -0.01em;
}

.pochoirs-popup-author p {
    color: #6e6e73;
    margin: 6px 0 0 0;
    font-size: 15px;
    font-weight: 400;
}

.pochoirs-popup-stars {
    color: #ff9500;
    font-size: 2.2rem;
    margin-bottom: 30px;
    letter-spacing: 2px;
}

.pochoirs-popup-comment {
    color: #6e6e73;
    line-height: 1.7;
    font-size: 17px;
    font-style: italic;
    margin: 0;
    background: #f5f5f7;
    padding: 30px;
    border-radius: 12px;
    position: relative;
    font-weight: 400;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.pochoirs-popup-comment::before {
    content: '"';
    position: absolute;
    top: 10px;
    left: 15px;
    font-size: 3rem;
    color: var(--global-palette1, #007aff);
    opacity: 0.3;
    font-family: serif;
    line-height: 1;
}

.pochoirs-popup-comment::after {
    content: '"';
    position: absolute;
    bottom: 5px;
    right: 15px;
    font-size: 3rem;
    color: var(--global-palette1, #007aff);
    opacity: 0.3;
    font-family: serif;
    line-height: 1;
}

.pochoirs-popup-close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    background: #f5f5f7;
    border: none;
    border-radius: 50% !important;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    color: #6e6e73;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 999999;
    box-sizing: border-box !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.pochoirs-popup-close:hover {
    background: #e8e8ed;
    color: #1d1d1f;
    transform: scale(1.1);
}

@keyframes pochoirsFadeInApple {
    from { 
        opacity: 0;
        backdrop-filter: blur(0px);
    }
    to { 
        opacity: 1;
        backdrop-filter: blur(20px);
    }
}

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

/* ==================== RESPONSIVE MOBILE APPLE ==================== */

@media (max-width: 768px) {
    /* Container */
    .pochoirs-container {
        padding: 0 16px;
    }
    
    /* Sections principales */
    .pochoirs-behavioral-section,
    .pochoirs-recently-viewed-section,
    .pochoirs-tutorials-section {
        padding: 60px 0;
        margin-top: 30px;
    }
    
    /* Headers */
    .pochoirs-behavioral-title,
    .pochoirs-recently-viewed-title,
    .pochoirs-tutorials-intro h2,
    .pochoirs-section-title {
        font-size: 28px;
        margin-bottom: 12px;
    }
    
    .pochoirs-behavioral-subtitle,
    .pochoirs-recently-viewed-subtitle,
    .pochoirs-tutorials-intro p {
        font-size: 15px;
    }
    
    /* Grids mobiles - scroll horizontal Apple */
    .pochoirs-behavioral-products,
    .pochoirs-recently-viewed-products,
    .pochoirs-tutorials-grid {
        display: flex !important;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-behavior: smooth;
        gap: 20px;
        padding-bottom: 10px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        max-width: none;
    }
    
    .pochoirs-behavioral-products::-webkit-scrollbar,
    .pochoirs-recently-viewed-products::-webkit-scrollbar,
    .pochoirs-tutorials-grid::-webkit-scrollbar {
        display: none;
    }
    
    /* Cartes en défilement Apple style */
    .pochoirs-behavioral-product,
    .pochoirs-recently-viewed-product,
    .pochoirs-tutorial-card-link {
        flex: 0 0 280px;
        min-width: 280px;
        max-width: 280px;
        scroll-snap-align: start;
    }
    
    .pochoirs-product-info {
        padding: 20px;
    }
    
    .pochoirs-product-title {
        font-size: 17px;
        line-height: 1.3;
        margin-bottom: 8px;
    }
    
    .pochoirs-product-price {
        font-size: 15px;
        margin-bottom: 12px;
    }
    
    .pochoirs-product-stats {
        padding: 12px;
    }
    
    .pochoirs-stats-highlight {
        font-size: 15px;
    }
    
    .pochoirs-stats-text {
        font-size: 13px;
    }
    
    /* Tutoriels mobile */
    .pochoirs-tutorial-info {
        padding: 20px;
    }
    
    .pochoirs-tutorial-info h3 {
        font-size: 17px;
        margin-bottom: 8px;
    }
    
    .pochoirs-tutorial-info p {
        font-size: 14px;
        margin-bottom: 12px;
    }
    
    .pochoirs-tutorial-stats {
        font-size: 13px;
    }
    
    /* Rating mobile */
    .pochoirs-rating-summary {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
    }
    
    .pochoirs-big-score {
        font-size: 40px;
    }
    
    /* Collections mobile */
    .pochoirs-collections-grid {
        grid-template-columns: 1fr;
    }
    
    .pochoirs-category-image {
        width: 60px;
        height: 60px;
    }
    
    /* Tailles mobile */
    .pochoirs-size-tips-grid {
        grid-template-columns: 1fr;
    }
    
    .pochoirs-size-selector-buttons {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .pochoirs-size-overlay {
        font-size: 12px;
        position: static;
        width: auto;
        height: auto;
        padding: 8px;
        margin: 5px;
    }
    
    /* Étapes mobile */
    .pochoirs-steps-grid {
        grid-template-columns: 1fr;
    }
    
    /* Formulaire mobile */
    .pochoirs-form-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .pochoirs-star-rating {
        justify-content: center;
    }
    
    .pochoirs-upload-area {
        padding: 30px 15px;
    }
    
    .pochoirs-upload-icon {
        font-size: 2rem;
    }
    
    .pochoirs-image-preview {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .pochoirs-form-title {
        font-size: 24px;
    }
    
    .pochoirs-review-form-section {
        padding: 40px 20px;
    }
    
    /* ==================== POPUP MOBILE CORRIGÉ ==================== */
    
    /* Container principal du popup */
    .pochoirs-popup-inner {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr; /* CHANGEMENT : auto au lieu de 350px fixe */
        max-height: 90vh;
        overflow-y: auto; /* Permet le scroll si nécessaire */
    }
    
    /* Zone image - s'adapte à la taille de l'image */
    .pochoirs-popup-image {
        background: transparent; /* CHANGEMENT : transparent au lieu de noir */
        padding: 0;
        border-radius: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 200px; /* Hauteur minimale */
        max-height: 60vh; /* Hauteur maximale pour éviter que ça prenne tout l'écran */
    }
    
    .pochoirs-popup-image img {
        max-width: 100%;
        max-height: 60vh; /* CHANGEMENT : limite la hauteur pour éviter les images trop grandes */
        border-radius: 0;
        box-shadow: none;
        object-fit: contain;
        width: auto;
        height: auto;
        display: block; /* Assure un affichage propre */
    }
    
    /* Section info */
    .pochoirs-popup-info {
        padding: 25px 20px 30px 20px;
        position: relative;
        flex-shrink: 0; /* Empêche la compression */
    }
    
    /* SUPPRIMER la barre bleue à gauche sur mobile */
    .pochoirs-popup-info::before {
        display: none;
    }
    
    /* Ajuster le commentaire et les guillemets */
    .pochoirs-popup-comment {
        font-size: 15px;
        padding: 20px;
        margin: 0;
        position: relative;
        line-height: 1.6;
        font-weight: 400;
        color: #4a5568;
        background: #f7fafc;
        border-left: 3px solid var(--global-palette1, #007aff);
    }
    
    /* Repositionner les guillemets */
    .pochoirs-popup-comment::before {
        content: '"';
        position: absolute;
        top: -5px;
        left: 5px;
        font-size: 2rem;
        color: var(--global-palette1, #007aff);
        opacity: 0.2;
        font-family: serif;
        line-height: 1;
        z-index: 1;
    }
    
    .pochoirs-popup-comment::after {
        content: '"';
        position: absolute;
        bottom: -15px;
        right: 5px;
        font-size: 2rem;
        color: var(--global-palette1, #007aff);
        opacity: 0.2;
        font-family: serif;
        line-height: 1;
        z-index: 1;
    }
    
    /* Réduire la taille des étoiles */
    .pochoirs-popup-stars {
        font-size: 1.5rem;
        margin-bottom: 20px;
        letter-spacing: 1px;
    }
    
    /* Ajuster l'avatar */
    .pochoirs-reviewer-avatar-popup {
        width: 50px;
        height: 50px;
        font-size: 1.2rem;
        box-shadow: 0 4px 12px rgba(0, 122, 255, 0.2);
    }
    
    /* Ajuster les infos auteur */
    .pochoirs-popup-author {
        gap: 15px;
        margin-bottom: 20px;
        padding-bottom: 15px;
    }
    
    .pochoirs-popup-author h4 {
        font-size: 18px;
        margin: 0;
    }
    
    .pochoirs-popup-author p {
        font-size: 14px;
        margin: 4px 0 0 0;
    }
    
    /* Ajuster le bouton de fermeture */
    .pochoirs-popup-close {
        top: 10px;
        right: 10px;
        width: 28px !important;
        height: 28px !important;
        font-size: 14px;
        background: rgba(0, 0, 0, 0.5);
        color: white;
        border: 1px solid rgba(255, 255, 255, 0.3);
        z-index: 1000; /* S'assure qu'il reste visible */
    }
    
    .pochoirs-popup-close:hover {
        background: rgba(0, 0, 0, 0.7);
        color: white;
        transform: scale(1.05);
    }
    
    /* Container du popup */
    .pochoirs-popup-content {
        max-width: 95vw;
        max-height: 95vh;
        margin: 0 auto;
        border-radius: 12px;
        overflow: hidden; /* Assure des bords propres */
    }
    
    /* Vote utile mobile */
    .pochoirs-popup-helpful .simple-vote-container {
        font-size: 12px;
        gap: 5px;
        padding: 5px 8px;
        margin-top: 15px;
    }
    
    .pochoirs-popup-helpful .vote-btn {
        font-size: 12px;
        padding: 1px 4px;
    }

    /* Vote mobile */
    .simple-vote-container {
        font-size: 13px;
        gap: 6px;
        padding: 6px 10px;
    }
}

/* Optimisation pour très petits écrans */
@media (max-width: 480px) {
    .pochoirs-popup-content {
        max-width: 98vw;
        max-height: 98vh;
        border-radius: 8px;
    }
    
    .pochoirs-popup-inner {
        grid-template-rows: auto 1fr; /* Garde la flexibilité aussi sur petits écrans */
    }
    
    .pochoirs-popup-image {
        max-height: 50vh; /* Réduit encore sur très petits écrans */
    }
    
    .pochoirs-popup-image img {
        max-height: 50vh;
    }
    
    .pochoirs-popup-info {
        padding: 20px 15px 25px 15px;
    }
    
    .pochoirs-popup-comment {
        font-size: 14px;
        padding: 15px;
    }
    
    .pochoirs-popup-stars {
        font-size: 1.3rem;
        margin-bottom: 15px;
    }
    
    .pochoirs-reviewer-avatar-popup {
        width: 45px;
        height: 45px;
        font-size: 1.1rem;
    }
    
    .pochoirs-popup-author h4 {
        font-size: 16px;
    }
    
    .pochoirs-popup-author p {
        font-size: 13px;
    }
}


/* ==================== RÉPONSES AUX AVIS APPLE ==================== */

.pochoirs-review-replies {
    margin-top: 20px;
}

.pochoirs-review-reply {
    border-top: 1px solid #f1f5f9;
    padding-top: 20px;
    margin-top: 15px;
    background: #f5f5f7;
    padding: 20px;
    border-radius: 12px;
    border-left: 2px solid var(--global-palette1, #007aff);
}

.pochoirs-reply-header {
    margin-bottom: 15px;
}

.pochoirs-reply-info h5 {
    font-size: 15px;
    font-weight: 600;
    color: var(--global-palette1, #007aff);
    margin: 0 0 5px 0;
    letter-spacing: -0.01em;
}

.pochoirs-reply-info p {
    font-size: 13px;
    color: #6e6e73;
    margin: 0;
    font-weight: 400;
}

.pochoirs-reply-text {
    color: #6e6e73;
    line-height: 1.6;
    font-style: italic;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
}

/* Responsive mobile réponses */
@media (max-width: 768px) {
    .pochoirs-review-reply {
        padding: 15px;
        margin-top: 12px;
    }
    
    .pochoirs-reply-info h5 {
        font-size: 14px;
    }
    
    .pochoirs-reply-text {
        font-size: 13px;
    }
}

/* ==================== SHORTCODE INFO PRODUIT APPLE ==================== */

.pochoirs-product-info-section {
    background: transparent;
}

.pochoirs-product-info-wrapper {
    background: white;
    border-radius: 18px;
    border: 1px solid #d2d2d7;
    overflow: hidden;
    width: 100%;
    box-shadow: none;
}

.pochoirs-info-item {
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
}

.pochoirs-info-item:last-child {
    border-bottom: none;
}

.pochoirs-info-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: linear-gradient(180deg, var(--global-palette1, #007aff) 0%, #7c3aed 100%);
    transition: width 0.3s ease;
}

.pochoirs-info-item:hover::before {
    width: 2px;
}

.pochoirs-info-header {
    display: flex;
    align-items: center;
    padding: 20px;
    cursor: pointer;
    background: white;
    transition: all 0.3s ease;
    position: relative;
}

.pochoirs-info-header:hover {
    background: #f5f5f7;
}

.pochoirs-info-icon {
    width: 20px;
    height: 20px;
    margin-right: 16px;
    color: #6e6e73;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pochoirs-info-icon svg {
    width: 20px;
    height: 20px;
    stroke: #6e6e73;
    fill: none;
    stroke-width: 1.5;
}

.pochoirs-info-title {
    flex: 1;
    font-size: 17px;
    font-weight: 500;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.pochoirs-info-toggle {
    color: #6e6e73;
    font-size: 18px;
    font-weight: 300;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.pochoirs-info-item:hover .pochoirs-info-toggle {
    color: var(--global-palette1, #007aff);
    transform: rotate(45deg);
}

/* ==================== POPUP INFO PRODUIT APPLE ==================== */

.pochoirs-info-popup {
    position: fixed;
    top: 0;
    right: -500px;
    width: 500px;
    height: 100vh;
    background: white;
    z-index: 2147483647 !important;
    transition: right 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: -10px 0 30px rgba(0,0,0,0.3);
    display: flex;
    flex-direction: column;
}

.pochoirs-info-popup.open {
    right: 0;
}

.pochoirs-popup-overlay-info {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(20px);
    z-index: 2147483646 !important;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.pochoirs-popup-overlay-info.open {
    opacity: 1;
    visibility: visible;
}

.pochoirs-popup-header-info {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: saturate(180%) blur(20px);
    padding: 24px 32px;
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.1);
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 1001 !important;
}

.pochoirs-popup-title-info {
    font-size: 22px;
    font-weight: 700;
    color: #1d1d1f;
    margin-bottom: 0;
    letter-spacing: -0.02em;
}

.pochoirs-popup-close-info {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    background: #f5f5f7;
    border: none;
    border-radius: 50% !important;
    color: #6e6e73;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 1002 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
}

.pochoirs-popup-close-info:hover {
    background: #e8e8ed;
    color: #1d1d1f;
    transform: scale(1.1);
}

.pochoirs-popup-content-info {
    padding: 32px;
    flex-grow: 1;
    overflow-y: auto;
    position: relative;
    z-index: 1000 !important;
}

.pochoirs-popup-section-info {
    margin-bottom: 40px;
}

.pochoirs-popup-section-info h3 {
    font-size: 19px;
    color: #1d1d1f;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.pochoirs-popup-section-info h3:empty {
    display: none;
    margin-bottom: 0;
}

.pochoirs-popup-section-info p {
    color: #6e6e73;
    line-height: 1.6;
    margin-bottom: 15px;
    font-size: 15px;
    font-weight: 400;
}

.pochoirs-popup-section-info ul {
    list-style: none;
    padding: 0;
}

.pochoirs-popup-section-info li {
    padding: 8px 0;
    color: #6e6e73;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 15px;
}

.pochoirs-steps-list-info {
    counter-reset: step-counter;
    list-style: none;
    padding: 0;
}

.pochoirs-steps-list-info li {
    counter-increment: step-counter;
    margin-bottom: 32px;
    padding: 24px;
    background: #f5f5f7;
    border-radius: 12px;
    position: relative;
}

.pochoirs-steps-list-info li::before {
    content: counter(step-counter);
    position: absolute;
    left: -16px;
    top: 20px;
    width: 32px;
    height: 32px;
    background: var(--global-palette1, #007aff);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 14px;
}

.pochoirs-step-title-info {
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 8px;
    font-size: 17px;
    letter-spacing: -0.01em;
}

.pochoirs-step-description-info {
    color: #6e6e73;
    line-height: 1.5;
    font-size: 15px;
    font-weight: 400;
}

/* Classe pour bloquer le scroll du body */
body.pochoirs-info-popup-open {
    overflow: hidden !important;
}

.pochoirs-info-popup:not(.open) {
    box-shadow: none !important;
}

/* ==================== RESPONSIVE MOBILE INFO PRODUIT APPLE ==================== */

@media (max-width: 768px) {
    .pochoirs-info-popup {
        top: auto;
        bottom: -100%;
        right: 0;
        left: 0;
        width: 100%;
        height: 80vh;
        border-radius: 20px 20px 0 0;
        transition: bottom 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        display: flex;
        flex-direction: column;
    }
    
    .pochoirs-info-popup.open {
        bottom: 0;
        right: 0;
    }
    
    .pochoirs-popup-header-info {
        border-radius: 20px 20px 0 0;
        text-align: center;
        position: relative;
        padding: 20px;
        flex-shrink: 0;
        position: sticky;
        top: 0;
        z-index: 1001 !important;
    }
    
    .pochoirs-popup-header-info::before {
        content: '';
        position: absolute;
        top: 10px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        background: rgba(0, 0, 0, 0.3);
        border-radius: 2px;
    }
    
    .pochoirs-popup-title-info {
        font-size: 20px;
        padding-right: 50px;
    }
    
    .pochoirs-popup-close-info {
        top: 15px;
        right: 15px;
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        min-height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
        font-size: 14px;
        z-index: 1002 !important;
    }
    
    .pochoirs-popup-content-info {
        flex-grow: 1;
        overflow-y: auto;
        padding: 20px;
    }
    
    .pochoirs-steps-list-info li {
        padding: 20px;
        margin-bottom: 20px;
    }
    
    .pochoirs-steps-list-info li::before {
        width: 28px;
        height: 28px;
        left: -14px;
        font-size: 12px;
    }
    
    .pochoirs-step-title-info {
        font-size: 15px;
    }
    
    .pochoirs-step-description-info {
        font-size: 14px;
    }
}

/* Animation des éléments info produit */
.pochoirs-popup-section-info {
    opacity: 0;
    transform: translateY(20px);
    animation: pochoirsSlideInUp 0.6s ease forwards;
}

.pochoirs-popup-section-info:nth-child(2) { animation-delay: 0.1s; }
.pochoirs-popup-section-info:nth-child(3) { animation-delay: 0.2s; }
.pochoirs-popup-section-info:nth-child(4) { animation-delay: 0.3s; }

@keyframes pochoirsSlideInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Animation au hover des boutons info */
.pochoirs-info-item {
    transition: all 0.3s ease;
}

.pochoirs-info-item:hover .pochoirs-info-toggle {
    transform: scale(1.1) rotate(90deg);
}

/* Override spécifique pour la section info produit */
.pochoirs-product-info-section .pochoirs-container {
    padding-left: 0;
    padding-right: 0;
}

/* ===================================================
   CSS SÉLECTEUR WOOCOMMERCE KADENCE STYLE APPLE
   Version avec prix intégré dans le message d'instruction
   bouton panier
   =================================================== */

/* Variables CSS pour cohérence */
:root {
    --pochoir-primary: var(--global-palette1, #007aff);
    --pochoir-primary-hover: var(--global-palette2, #0056d2);
    --pochoir-text: #1d1d1f;
    --pochoir-text-light: #6e6e73;
    --pochoir-border: #d2d2d7;
    --pochoir-bg-light: #f5f5f7;
    --pochoir-radius: 8px;
    --pochoir-transition: all 0.3s ease;
}

/* ============================================
   CONTENEUR KADENCE VARIATIONS
   ============================================ */
.kwt-add-to-cart-wrap .variations_form {
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.kwt-add-to-cart-wrap .variations_form .variations {
    border: none !important;
    background: none !important;
    margin-bottom: 30px !important;
}

.kwt-add-to-cart-wrap .variations_form .variations tr {
    border: none !important;
    background: none !important;
}

.kwt-add-to-cart-wrap .variations_form .variations td,
.kwt-add-to-cart-wrap .variations_form .variations th {
    border: none !important;
    padding: 0 !important;
    vertical-align: top !important;
}

/* ============================================
   LABEL TAILLE STYLE APPLE
   ============================================ */
.kwt-add-to-cart-wrap .variations_form .variations .label {
    width: 100% !important;
    padding-bottom: 15px !important;
}

.kwt-add-to-cart-wrap .variations_form .variations .label label {
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--pochoir-text) !important;
    letter-spacing: -0.01em !important;
    margin: 0 !important;
    text-transform: none !important;
}

/* ============================================
   TRANSFORMATION SELECT EN BOUTONS APPLE
   ============================================ */
.kwt-add-to-cart-wrap .variations_form .variations .value {
    width: 100% !important;
    position: relative !important;
}

/* Cacher le select natif mais garder la fonctionnalité */
.kwt-add-to-cart-wrap .variations_form .variations select {
    opacity: 0 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 40px !important;
    z-index: -1 !important;
    pointer-events: none !important;
}

/* Cacher le lien reset aussi */
.kwt-add-to-cart-wrap .variations_form .variations .reset_variations {
    display: none !important;
}

/* ============================================
   MESSAGE D'INSTRUCTION AVEC PRIX INTÉGRÉ - DESIGN INFO BOX
   ============================================ */
.pochoir-size-instruction-with-price {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce7ff 100%) !important;
    border: 1px solid #90c3f7 !important;
    border-radius: 8px !important;
    padding: 14px 18px !important;
    margin-bottom: 20px !important;
    text-align: center !important;
    animation: pochoirInstructionSlideIn 0.5s ease-out !important;
    box-shadow: 0 2px 12px rgba(0, 122, 255, 0.08) !important;
}

.pochoir-instruction-content {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.pochoir-instruction-text {
    font-size: 14px !important;
    color: #2563eb !important;
    font-weight: 500 !important;
}

.pochoir-price-divider {
    font-size: 14px !important;
    color: #60a5fa !important;
    font-weight: 400 !important;
}

.pochoir-starting-price {
    font-size: 15px !important;
    color: #1d4ed8 !important;
    font-weight: 700 !important;
    background: rgba(29, 78, 216, 0.1) !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
    border: 1px solid rgba(29, 78, 216, 0.2) !important;
}

@keyframes pochoirInstructionSlideIn {
    from { opacity: 0; transform: translateY(-15px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ============================================
   CONTENEUR DES BOUTONS APPLE
   ============================================ */
.apple-size-buttons {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
    gap: 8px !important;
    margin-top: 15px !important;
}

/* ============================================
   BOUTONS VARIATIONS STYLE APPLE
   ============================================ */
.apple-size-btn {
    background: white !important;
    border: 1px solid var(--pochoir-border) !important;
    padding: 16px 12px !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: var(--pochoir-transition) !important;
    font-size: 16px !important;
    color: var(--pochoir-text) !important;
    border-radius: var(--pochoir-radius) !important;
    font-weight: 500 !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 45px !important;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif !important;
}

.apple-size-btn:hover {
    border-color: var(--pochoir-primary) !important;
    background: var(--pochoir-bg-light) !important;
    transform: translateY(-1px) !important;
}

.apple-size-btn.selected {
    border-color: var(--pochoir-primary) !important;
    background: var(--pochoir-primary) !important;
    color: white !important;
    font-weight: 500 !important;
}

.apple-size-btn.selected::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(124, 58, 237, 0.3) 100%);
}

/* Animation de sélection */
.apple-size-btn.selected {
    animation: pochoirSelectAnimation 0.3s ease;
}

@keyframes pochoirSelectAnimation {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

/* Animation d'appel à l'action proactive */
.apple-size-btn.call-to-action {
    animation: pochoirCallToAction 2s ease-in-out 3 !important;
}

@keyframes pochoirCallToAction {
    0%, 100% { 
        transform: scale(1); 
        box-shadow: 0 0 0 0 rgba(0, 122, 255, 0.4); 
    }
    50% { 
        transform: scale(1.02); 
        box-shadow: 0 0 0 4px rgba(0, 122, 255, 0.15); 
    }
}

/* Animation d'apparition des boutons */
.apple-size-buttons.apple-animated .apple-size-btn {
    animation: pochoirButtonSlideIn 0.4s ease-out backwards !important;
}

.apple-size-buttons.apple-animated .apple-size-btn:nth-child(1) { animation-delay: 0.1s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(2) { animation-delay: 0.15s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(3) { animation-delay: 0.2s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(4) { animation-delay: 0.25s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(5) { animation-delay: 0.3s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(6) { animation-delay: 0.35s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(7) { animation-delay: 0.4s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(8) { animation-delay: 0.45s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(9) { animation-delay: 0.5s !important; }
.apple-size-buttons.apple-animated .apple-size-btn:nth-child(10) { animation-delay: 0.55s !important; }

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

/* ============================================
   BARRE DE BÉNÉFICES PERMANENTE
   ============================================ */
.pochoir-benefits-bar {
    display: flex;
    justify-content: center;
    gap: 15px;
    padding: 12px 16px;
    background: #f8fafc;
    border-radius: 8px;
    margin: 15px 0;
    font-size: 13px;
    color: var(--pochoir-text);
    width: 100%;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

.benefit-item {
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 1;
}

/* Responsive pour la barre de bénéfices */
@media (max-width: 768px) {
    .pochoir-benefits-bar {
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px 12px;
        font-size: 12px;
    }
    
    .benefit-item {
        white-space: normal;
        flex: 1 1 45%;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .pochoir-benefits-bar {
        gap: 6px;
        padding: 8px 10px;
    }
    
    .benefit-item {
        flex: 1 1 100%;
        font-size: 11px;
    }
}

/* Responsive pour bénéfices - versions desktop/mobile */
.benefit-mobile {
    display: none;
}

.benefit-desktop {
    display: block;
}

@media (max-width: 768px) {
    .benefit-desktop {
        display: none;
    }
    
    .benefit-mobile {
        display: block;
        text-align: center;
        font-size: 12px;
        white-space: nowrap;
    }
}


/* ============================================
   BOUTON AJOUTER AU PANIER - MODIFIÉ
   ============================================ */
.kwt-add-to-cart-wrap .single_add_to_cart_button {
    background: #FF6600 !important;
    color: white !important;
    border: none !important;
    padding: 8px 24px !important;
    border-radius: var(--pochoir-radius) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease 0.2s, transform 0.3s ease !important;
    /* CHANGEMENT : Remplacer width: 100% par flex: 1 */
    flex: 1 !important;
    margin-top: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif !important;
    min-height: 48px !important; /* Ajouter une hauteur cohérente */
}

/* Et ajouter ces 2 règles pour le container */
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-top: 1em !important;
}

/* Harmoniser la hauteur du wishlist */
.wlfmc-add-to-wishlist .wlfmc-add-button a {
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.kwt-add-to-cart-wrap .single_add_to_cart_button:hover:not(.disabled) {
    background: #e55a00 !important;
    transform: translateY(-1px) !important;
}

.kwt-add-to-cart-wrap .single_add_to_cart_button:active {
    transform: translateY(0) !important;
}

.kwt-add-to-cart-wrap .single_add_to_cart_button.disabled {
    background: #ccc !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* Bouton panier amélioré */
.single_add_to_cart_button.pochoir-choose-size {
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%) !important;
    color: white !important;
    cursor: default !important;
    font-weight: 500 !important;
    border: none !important;
    position: relative !important;
    overflow: hidden !important;
}

.single_add_to_cart_button.pochoir-choose-size::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent) !important;
    animation: pochoirButtonShimmer 2s ease-in-out infinite !important;
}

@keyframes pochoirButtonShimmer {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* ============================================
   RESPONSIVE MOBILE
   ============================================ */
@media (max-width: 768px) {
    .apple-size-buttons {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    
    .apple-size-btn {
        padding: 14px 10px !important;
        font-size: 15px !important;
        min-height: 40px !important;
    }
    
    .pochoir-instruction-content {
        flex-direction: column !important;
        gap: 4px !important;
    }
    
    .pochoir-instruction-text,
    .pochoir-starting-price {
        font-size: 14px !important;
    }
    
    .pochoir-price-divider {
        display: none !important;
    }
    
    .kwt-add-to-cart-wrap .variations_form .variations .label label {
        font-size: 16px !important;
    }
}

@media (max-width: 480px) {
    .apple-size-buttons {
        grid-template-columns: 1fr 1fr 1fr !important
    }
    
    .apple-size-btn {
        padding: 12px 8px !important;
        font-size: 14px !important;
        min-height: 40px !important;
    }
    
    .pochoir-size-instruction-with-price {
        padding: 12px 14px !important;
    }
}

/* ============================================
   PRIX WOOCOMMERCE
   ============================================ */
.woocommerce div.product p.price, 
.woocommerce div.product span.price {
    font-size: 1.8em !important;
}

/* Espacement sous le prix */
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
    margin-top: 1em !important;
}

/* ============================================
   HARMONISATION BOUTON WISHLIST - HAUTEUR SEULEMENT
   ============================================ */
.wlfmc-add-to-wishlist {
    margin-top: 0 !important;
}

.wlfmc-add-to-wishlist .wlfmc-add-button a {
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}



/* ===== SMART SIZE GUIDE SHORTCODE ===== */
/* ===== SMART SIZE GUIDE SHORTCODE ===== */
/* ===== SMART SIZE GUIDE SHORTCODE ===== */

/* Container principal */
.pochoirs-smart-size-guide .smart-size-guide-visual {
    background: #f5f5f7;
    padding: 40px;
    border-radius: 18px;
    margin-bottom: 32px;
    position: relative;
}

.pochoirs-smart-size-guide .smart-size-guide-title {
    font-size: 22px;
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 28px;
    letter-spacing: -0.02em;
}

/* Grid des exemples */
.pochoirs-smart-size-guide .smart-size-examples {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Cartes individuelles */
.pochoirs-smart-size-guide .smart-size-example {
    background: white;
    padding: 24px;
    border-radius: 12px;
    text-align: center;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.pochoirs-smart-size-guide .smart-size-example:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Badges par type */
.pochoirs-smart-size-guide .smart-size-example.premium::before {
    content: "💎";
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 12px;
    opacity: 0.7;
}

.pochoirs-smart-size-guide .smart-size-example.popular::before {
    content: "⭐";
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 12px;
    opacity: 0.7;
}

.pochoirs-smart-size-guide .smart-size-example.info::before {
    content: "ℹ️";
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 12px;
    opacity: 0.7;
}

/* Contenus des cartes */
.pochoirs-smart-size-guide .smart-size-example-size {
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 6px;
    font-size: 17px;
    letter-spacing: -0.01em;
}

.pochoirs-smart-size-guide .smart-size-example-use {
    color: #6e6e73;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 4px;
}

.pochoirs-smart-size-guide .smart-size-value, 
.pochoirs-smart-size-guide .smart-size-upgrade {
    color: #8e8e93;
    font-size: 12px;
    font-weight: 400;
    font-style: italic;
}

/* Styles spécifiques par type */
.pochoirs-smart-size-guide .premium .smart-size-value {
    color: #ff6b35;
    font-weight: 500;
}

.pochoirs-smart-size-guide .popular .smart-size-value {
    color: #34c759;
    font-weight: 500;
}

.pochoirs-smart-size-guide .starter .smart-size-value {
    color: #ff9500;
}

.pochoirs-smart-size-guide .info .smart-size-upgrade {
    color: var(--global-palette1, #007aff);
    font-weight: 500;
}

/* Arrière-plans colorés subtils */
.pochoirs-smart-size-guide .smart-size-example.premium {
    border: 1px solid rgba(255, 107, 53, 0.2);
    background: linear-gradient(135deg, #fff 0%, #fff8f6 100%);
}

.pochoirs-smart-size-guide .smart-size-example.popular {
    border: 1px solid rgba(52, 199, 89, 0.2);
    background: linear-gradient(135deg, #fff 0%, #f6fff8 100%);
}

.pochoirs-smart-size-guide .smart-size-example.info {
    border: 1px solid rgba(0, 122, 255, 0.2);
    background: linear-gradient(135deg, #fff 0%, #f0f8ff 100%);
}

/* Couleurs de texte par type */
.pochoirs-smart-size-guide .premium .smart-size-example-size {
    color: #ff6b35;
}

.pochoirs-smart-size-guide .popular .smart-size-example-size {
    color: #34c759;
}

.pochoirs-smart-size-guide .info .smart-size-example-size {
    color: var(--global-palette1, #007aff);
}

.pochoirs-smart-size-guide .starter .smart-size-example-use {
    color: #8e8e93;
}

/* États des tailles (disponibles/non disponibles) */
.pochoirs-smart-size-guide .smart-size-example.not-available {
    opacity: 0.6;
}

.pochoirs-smart-size-guide .smart-size-example.not-available .smart-size-example-size {
    color: #8e8e93;
}

.pochoirs-smart-size-guide .smart-size-example.available {
    border-width: 2px;
}

/* Section conseil/upgrade */
.pochoirs-smart-size-guide .smart-upgrade-suggestion {
    background: white;
    border: 1px solid #e5e5e7;
    border-radius: 12px;
    padding: 20px;
    margin-top: 20px;
    text-align: center;
}

.pochoirs-smart-size-guide .smart-upgrade-text {
    font-size: 14px;
    color: #1d1d1f;
    margin-bottom: 8px;
}

.pochoirs-smart-size-guide .smart-upgrade-stats {
    font-size: 12px;
    color: #6e6e73;
}

.pochoirs-smart-size-guide .smart-stat {
    font-weight: 500;
}

/* Responsive mobile */
@media (max-width: 768px) {
    .pochoirs-smart-size-guide .smart-size-examples {
        grid-template-columns: 1fr;
    }
    
    .pochoirs-smart-size-guide .smart-size-guide-visual, 
    .pochoirs-smart-size-guide .smart-upgrade-suggestion {
        padding: 24px;
    }

    .pochoirs-smart-size-guide .smart-upgrade-stats {
        font-size: 11px;
        line-height: 1.5;
    }
}

/* Animations d'entrée */
.pochoirs-smart-size-guide .smart-size-example, 
.pochoirs-smart-size-guide .smart-upgrade-suggestion {
    animation: smartSizeGuideAnimationFadeInUp 0.6s ease-out;
    animation-fill-mode: both;
}

.pochoirs-smart-size-guide .smart-size-example:nth-child(1) { animation-delay: 0.1s; }
.pochoirs-smart-size-guide .smart-size-example:nth-child(2) { animation-delay: 0.2s; }
.pochoirs-smart-size-guide .smart-size-example:nth-child(3) { animation-delay: 0.3s; }
.pochoirs-smart-size-guide .smart-size-example:nth-child(4) { animation-delay: 0.4s; }
.pochoirs-smart-size-guide .smart-upgrade-suggestion { animation-delay: 0.5s; }

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

/* Effet de survol amélioré */
.pochoirs-smart-size-guide .smart-size-example:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}

.pochoirs-smart-size-guide .smart-size-example.premium:hover {
    box-shadow: 0 8px 30px rgba(255, 107, 53, 0.15);
}

.pochoirs-smart-size-guide .smart-size-example.popular:hover {
    box-shadow: 0 8px 30px rgba(52, 199, 89, 0.15);
}

.pochoirs-smart-size-guide .smart-size-example.info:hover {
    box-shadow: 0 8px 30px rgba(0, 122, 255, 0.15);
}


/* =================================================
   SHORTCODE MATERIAL FLEXIBILITY - CSS COMPLET
   ================================================= */

.pochoirs-flexibility-showcase {
    margin: 0 auto 0px auto;
    max-width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

.flex-image {
    position: relative;
    width: 100%;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.flex-image:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.flex-image img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    display: block;
    border-radius: 18px;
}

/* Badge supérieur */
.flexibility-badge {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.flex-label {
    display: inline-block;
    background: var(--global-palette1, #007aff);
    color: white;
    padding: 12px 24px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    box-shadow: 0 4px 12px rgba(0, 122, 255, 0.3);
    transition: all 0.3s ease;
    white-space: nowrap;
}

.flex-label:hover {
    background: var(--global-palette2, #0056d2);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 122, 255, 0.4);
}

/* Tags inférieurs avec glassmorphism */
.flex-tags {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    z-index: 2;
    max-width: calc(100% - 24px);
}

.flex-tag {
    background-color: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 8px 16px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    white-space: nowrap;
    flex-shrink: 0;
}

.flex-tag:hover {
    background-color: rgba(255, 255, 255, 0.25);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border-color: rgba(255, 255, 255, 0.3);
}

.tag-check {
    color: #22c55e;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
}

.flex-tag span:last-child {
    color: white;
    font-size: 12px;
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    line-height: 1.2;
}

/* Responsive */
@media (max-width: 768px) {
    .flex-image img {
        height: 250px;
    }
    
    .flexibility-badge {
        top: 15px;
    }
    
    .flex-label {
        padding: 10px 20px;
        font-size: 13px;
    }
    
    .flex-tags {
        bottom: 15px;
        gap: 8px;
        max-width: calc(100% - 16px);
    }
    
    .flex-tag {
        padding: 6px 12px;
    }
    
    .flex-tag span:last-child {
        font-size: 11px;
    }
    
    .tag-check {
        font-size: 11px;
    }
}

@media (max-width: 480px) {
    .flex-image img {
        height: 220px;
    }
    
    .flex-tags {
        gap: 6px;
        bottom: 15px;
    }
    
    .flex-tag {
        padding: 5px 10px;
    }
    
    .flex-tag span:last-child {
        font-size: 10px;
    }
}


/* FAQ Shortcode - Spécificité propre */

.pochoirs-faq-container * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.pochoirs-faq-container {
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    color: #1d1d1f;
    -webkit-font-smoothing: antialiased;
    padding: 60px 20px;
}

.pochoirs-faq-container > * {
    max-width: 900px;
    margin: 0 auto;
}

/* Header */
.pochoirs-faq-container .pochoirs-faq-header {
    text-align: center;
    margin-bottom: 60px;
}

.pochoirs-faq-container .pochoirs-faq-header h2 {
    font-size: 36px;
    font-weight: 800;
    color: #1d1d1f;
    margin-bottom: 16px;
    letter-spacing: -0.025em;
}

.pochoirs-faq-container .pochoirs-faq-header p {
    font-size: 18px;
    color: #64748b;
    font-weight: 500;
    max-width: 600px;
    margin: 0 auto;
}

/* Search */
.pochoirs-faq-container .pochoirs-search {
    position: relative;
    margin-bottom: 40px;
}

.pochoirs-faq-container .pochoirs-search input {
    width: 100%;
    padding: 16px 24px 16px 52px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    font-size: 16px;
    background: white;
    transition: border-color 0.2s ease;
    font-family: inherit;
    color: #1d1d1f;
}

.pochoirs-faq-container .pochoirs-search input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: none;
}

.pochoirs-faq-container .pochoirs-search::before {
    content: '🔍';
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #94a3b8;
}

/* Controls */
.pochoirs-faq-container .pochoirs-controls {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 40px;
}

.pochoirs-faq-container .pochoirs-controls button {
    background: white;
    border: 2px solid #e2e8f0;
    color: #475569;
    padding: 10px 20px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

/* Spécificité élevée pour surcharger le thème */
.pochoirs-faq-container .pochoirs-controls button:hover,
.pochoirs-faq-container .pochoirs-controls button:focus,
.pochoirs-faq-container .pochoirs-controls button:active {
    background: #3b82f6;
    color: white;
    border-color: #3b82f6;
    box-shadow: none;
    outline: none;
}

/* FAQ Items */
.pochoirs-faq-container .pochoirs-faq {
    background: white;
    border-radius: 16px;
    margin-bottom: 12px;
    border: 1px solid #f1f5f9;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    position: relative;
}

.pochoirs-faq-container .pochoirs-faq::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: #3b82f6;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.pochoirs-faq-container .pochoirs-faq:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.pochoirs-faq-container .pochoirs-faq:hover::before {
    transform: scaleX(1);
}

.pochoirs-faq-container .pochoirs-faq.active::before {
    transform: scaleX(1);
    background: #8b5cf6;
}

/* Question button - Spécificité élevée */
.pochoirs-faq-container .pochoirs-faq button {
    width: 100%;
    padding: 24px 28px;
    background: transparent;
    border: none;
    text-align: left;
    font-size: 17px;
    font-weight: 600;
    color: #1e293b;
    cursor: pointer;
    transition: color 0.2s ease;
    letter-spacing: -0.01em;
    position: relative;
    font-family: inherit;
}

/* Surcharge les styles du thème */
.pochoirs-faq-container .pochoirs-faq button:hover,
.pochoirs-faq-container .pochoirs-faq button:focus,
.pochoirs-faq-container .pochoirs-faq button:active {
    color: #3b82f6;
    background: transparent;
    border: none;
    box-shadow: none;
    outline: none;
    transform: none;
}

.pochoirs-faq-container .pochoirs-faq.active button {
    color: #3b82f6;
    padding-bottom: 16px;
    background: transparent;
    border: none;
    box-shadow: none;
}

.pochoirs-faq-container .pochoirs-faq.active button:hover,
.pochoirs-faq-container .pochoirs-faq.active button:focus,
.pochoirs-faq-container .pochoirs-faq.active button:active {
    color: #3b82f6;
    background: transparent;
    border: none;
    box-shadow: none;
    outline: none;
}

/* Icon */
.pochoirs-faq-container .pochoirs-faq button::after {
    content: '+';
    position: absolute;
    right: 28px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 300;
    color: #64748b;
    transition: all 0.2s ease;
    font-family: monospace;
    line-height: 1;
}

.pochoirs-faq-container .pochoirs-faq:hover button::after {
    background: #e0e7ff;
    color: #3b82f6;
}

.pochoirs-faq-container .pochoirs-faq.active button::after {
    content: '×';
    background: #3b82f6;
    color: white;
    transform: translateY(-50%) rotate(45deg);
}

/* Answer */
.pochoirs-faq-container .pochoirs-faq div {
    max-height: 0;
    overflow: hidden;
    padding: 0 28px;
    color: #475569;
    font-size: 15.5px;
    line-height: 1.7;
    transition: max-height 0.3s ease, padding 0.3s ease, opacity 0.3s ease;
    opacity: 0;
}

.pochoirs-faq-container .pochoirs-faq.active div {
    max-height: 300px;
    padding: 0 28px 28px;
    opacity: 1;
}

.pochoirs-faq-container .pochoirs-faq strong {
    color: #1e293b;
    font-weight: 600;
}

.pochoirs-faq-container .pochoirs-highlight {
    background: #fef3c7;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
    color: #92400e;
}

.pochoirs-faq-container .pochoirs-point {
    display: block;
    margin: 12px 0;
    padding-left: 24px;
    position: relative;
}

.pochoirs-faq-container .pochoirs-point::before {
    content: '👉';
    position: absolute;
    left: 0;
}

/* No results */
.pochoirs-faq-container .pochoirs-no-results {
    text-align: center;
    padding: 60px 20px;
    color: #64748b;
    font-size: 16px;
    display: none;
}

.pochoirs-faq-container .pochoirs-no-results.show {
    display: block;
}

/* Mobile */
@media (max-width: 768px) {
    .pochoirs-faq-container { padding: 40px 16px; }
    .pochoirs-faq-container .pochoirs-faq-header h2 { font-size: 28px; }
    .pochoirs-faq-container .pochoirs-faq-header p { font-size: 16px; }
    
    .pochoirs-faq-container .pochoirs-faq button { 
        font-size: 16px; 
        padding: 20px;
        padding-right: 60px;
    }
    
    .pochoirs-faq-container .pochoirs-faq button::after {
        right: 20px;
        width: 28px;
        height: 28px;
        font-size: 16px;
    }
    
    .pochoirs-faq-container .pochoirs-faq div { 
        font-size: 14px; 
        padding: 0 20px;
    }
    
    .pochoirs-faq-container .pochoirs-faq.active div { 
        padding: 0 20px 24px; 
    }

    .pochoirs-faq-container .pochoirs-controls {
        flex-direction: column;
        align-items: center;
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .pochoirs-faq-container * {
        animation-duration: 0.01ms;
        transition-duration: 0.01ms;
    }
}

/* Supprimer le contour bleu de focus */
.pochoirs-faq-container .pochoirs-faq,
.pochoirs-faq-container .pochoirs-faq button,
.pochoirs-faq-container .pochoirs-faq button:focus,
.pochoirs-faq-container .pochoirs-faq button:active,
.pochoirs-faq-container .pochoirs-faq:focus-within {
    outline: none;
    border: 1px solid #f1f5f9; /* Force la bordure originale */
}

.pochoirs-faq-container .pochoirs-faq.active {
    outline: none;
    border: 1px solid #f1f5f9; /* Même bordure à l'état ouvert */
}


/* ==================== PRODUCT BENEFITS SHORTCODE - MOBILE SCROLL ==================== */

.pochoirs-benefits-section {
    background: none;
    padding: 80px 0;
}

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
}

.benefit-card {
    background: white;
    padding: 40px 30px;
    border-radius: 18px;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.benefit-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--global-palette1, #007aff);
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* Hover effects seulement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .benefit-card:hover::before {
        opacity: 1;
    }

    .benefit-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        border-color: var(--global-palette1, #007aff);
    }

    .benefit-card:hover .benefit-icon {
        background: var(--global-palette1, #007aff);
        color: white;
        border-color: var(--global-palette1, #007aff);
        transform: scale(1.05);
    }
}

/* Feedback tactile mobile */
.benefit-card:active {
    transform: scale(0.98);
}

.benefit-icon {
    width: 70px;
    height: 70px;
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: var(--global-palette1, #007aff);
    transition: all 0.3s ease;
}

.benefit-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.benefit-subtitle {
    font-size: 16px;
    font-weight: 700;
    color: var(--global-palette1, #007aff);
    margin-bottom: 15px;
    line-height: 1.3;
}

.benefit-description {
    color: #6e6e73;
    line-height: 1.6;
    font-size: 15px;
}

/* ==================== RESPONSIVE MOBILE - SCROLL HORIZONTAL ==================== */
@media (max-width: 768px) {
    .pochoirs-benefits-section {
        padding: 60px 0;
    }
    
    /* Transform grid to horizontal scroll - same pattern as recently-viewed */
    .benefits-grid {
        display: flex !important;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-behavior: smooth;
        gap: 20px;
        padding-bottom: 10px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        max-width: none;
    }
    
    .benefits-grid::-webkit-scrollbar {
        display: none;
    }
    
    /* Cards in horizontal scroll - show 1 full + partial next */
    .benefit-card {
        flex: 0 0 280px; /* Fixed width for consistent sizing */
        min-width: 280px;
        max-width: 280px;
        scroll-snap-align: start;
        padding: 30px 20px; /* Reduced padding for mobile */
    }
    
    .benefit-icon {
        width: 60px;
        height: 60px;
        margin-bottom: 20px;
    }
    
    .benefit-title {
        font-size: 18px;
        margin-bottom: 12px;
    }
    
    .benefit-subtitle {
        font-size: 14px;
        margin-bottom: 12px;
    }
    
    .benefit-description {
        font-size: 14px;
        line-height: 1.5;
    }
}

/* Very small screens */
@media (max-width: 480px) {
    .benefit-card {
        flex: 0 0 260px;
        min-width: 260px;
        max-width: 260px;
        padding: 25px 15px;
    }
    
    .benefit-icon {
        width: 50px;
        height: 50px;
        margin-bottom: 15px;
    }
    
    .benefit-title {
        font-size: 16px;
    }
    
    .benefit-subtitle {
        font-size: 13px;
    }
    
    .benefit-description {
        font-size: 13px;
    }
}

/* ==================== ENGAGEMENTS SHORTCODE ==================== */

.pochoirs-engagements-section {
    background: none;
    padding: 80px 0;
}

.engagements-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
}

.engagement-card {
    background: white;
    padding: 40px 30px;
    border-radius: 18px;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.engagement-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--global-palette1, #007aff);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.engagement-card:hover::before {
    opacity: 1;
}

.engagement-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    border-color: var(--global-palette1, #007aff)20;
}

.engagement-icon {
    width: 70px;
    height: 70px;
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: var(--global-palette1, #007aff);
    transition: all 0.3s ease;
}

.engagement-card:hover .engagement-icon {
    background: var(--global-palette1, #007aff);
    border-color: var(--global-palette1, #007aff);
    color: white;
    transform: scale(1.05);
}

.engagement-title {
    font-size: 19px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

.engagement-description {
    color: #6e6e73;
    line-height: 1.6;
    font-size: 15px;
}

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

@media (max-width: 768px) {
    .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .engagements-grid {
        grid-template-columns: 1fr;
    }
}


/* ==================== SHORTCODE MADE IN FRANCE ==================== */
.made-france-banner {
background: var(--global-palette8, #F7F7F7);
color: black;
padding: 30px 40px;
border-radius: 18px;
text-align: center;
transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
/* Pas d'ombre par défaut */
}
.made-france-banner:hover {
transform: translateY(-2px);
}
.made-france-banner h3 {
font-size: 20px;
font-weight: 700;
margin-bottom: 10px;
letter-spacing: -0.01em;
color: black;
}
.made-france-banner p {
font-size: 14px;
font-weight: 400;
opacity: 0.9;
margin: 0;
color: black;
}
/* ==================== SHORTCODE PROFESSIONAL QUALITY ==================== */
.quality-pro-banner {
background: var(--global-palette4, #1d1d1f);
color: #1d1d1f;
padding: 30px 40px;
border-radius: 18px;
text-align: center;
transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
/* Pas d'ombre par défaut */
}
.quality-pro-banner:hover {
transform: translateY(-2px);
}
.quality-pro-banner h3 {
font-size: 20px;
font-weight: 700;
margin-bottom: 15px;
letter-spacing: -0.01em;
color: white;
}
.quality-pro-banner p {
font-size: 14px;
font-weight: 400;
line-height: 1.5;
margin-bottom: 8px;
color: white;
}
.quality-pro-banner p:last-child {
margin-bottom: 0;
}
/* ==================== SHORTCODE GUARANTEES (3 BLOCS) ==================== */
.guarantees-blocks {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.guarantee-item {
    background: var(--global-palette8, #f5f5f7);
    padding: 20px;
    border-radius: 12px;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid #e5e7eb;
}

.guarantee-item:hover {
    background: #f0f0f2;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.guarantee-icon {
    width: 50px;
    height: 50px;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1d1d1f;
}

.guarantee-icon svg {
    width: 24px;
    height: 24px;
    stroke: #1d1d1f;
}

.guarantee-text h4 {
    font-size: 15px;
    font-weight: 600;
    color: #1d1d1f;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}

.guarantee-text p {
    font-size: 12px;
    color: #86868b;
    line-height: 1.4;
    margin: 0;
}

/* ==================== RESPONSIVE MOBILE ==================== */
@media (max-width: 768px) {
    /* Made in France mobile */
    .made-france-banner {
        padding: 25px 20px;
    }
    .made-france-banner h3 {
        font-size: 18px;
    }
    .made-france-banner p {
        font-size: 13px;
    }
    
    /* Professional Quality mobile */
    .quality-pro-banner {
        padding: 25px 20px;
    }
    .quality-pro-banner h3 {
        font-size: 18px;
    }
    .quality-pro-banner p {
        font-size: 13px;
    }
    
    /* Guarantees mobile - GARDE 3 COLONNES */
    .guarantees-blocks {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
    .guarantee-item {
        padding: 5px 5px;
    }
    .guarantee-icon {
        width: 40px;
        height: 40px;
        margin-bottom: 1px;
    }
    .guarantee-icon svg {
        width: 18px;
        height: 18px;
    }
    .guarantee-text h4 {
        font-size: 13px;
        margin-bottom: 6px;
    }
    .guarantee-text p {
        font-size: 10px;
    }
}


/* ==================== PRODUCT RATING BLOCK ==================== */

.product-rating-block {
    background: var(--global-palette8, #f5f5f7);
    padding: 20px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: space-between !important;
}

.rating-stars-section {
    display: flex;
    align-items: center;
    gap: 15px;
}

.rating-stars-link {
    text-decoration: none;
    color: inherit;
    display: inline-block;
    transition: transform 0.2s ease;
}

.rating-stars-link:hover {
    transform: scale(1.1);
}

.rating-stars-link:hover .rating-stars {
    color: #ff7700;
}

.rating-stars {
    color: #ff9500;
    font-size: 16px;
}

.rating-stars .star {
    margin-right: 1px;
}

.rating-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rating-score {
    font-weight: 600;
    color: #1d1d1f;
    font-size: 16px;
}

.rating-detail {
    color: #6e6e73;
    font-size: 12px;
}

.trust-indicator {
    color: #34c759;
    font-weight: 500;
    font-size: 14px;
    white-space: nowrap;
}

/* Mobile */
@media (max-width: 768px) {
    .product-rating-block {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
    
    .rating-stars-section {
        gap: 10px;
    }
}

@media (max-width: 768px) {
    .product-rating-block {
        padding: 10px !important;
    }
    
    .product-rating-mobile-compact .rating-stars-section,
    .product-rating-mobile-compact .trust-indicator {
        display: none !important;
    }
}

/* Shortcode étoiles simple */
.pochoirs-simple-stars {
    display: inline-block;
    font-size: 16px;
}

.simple-stars-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s ease;
}

.simple-stars-link:hover {
    transform: scale(1.05);
    text-decoration: none;
    color: inherit;
}

.simple-stars-link .rating-stars {
    color: #ff9500;
    font-size: inherit;
}

.simple-stars-link:hover .rating-stars {
    color: #ff7700;
}

.simple-review-count {
    font-weight: 500;
    color: #6e6e73;
    font-size: 0.9em;
}

/* ==================== PRODUCT RATING MOBILE COMPACT - CORRIGÉ ==================== */

/* Version Desktop - Identique à l'original */
.product-rating-mobile-compact .rating-desktop-layout {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    justify-content: space-between !important;
}

.product-rating-mobile-compact .rating-mobile-compact-layout {
    display: none;
}

/* Mobile responsive - Compact sur une ligne */
@media (max-width: 768px) {
    .product-rating-mobile-compact .rating-desktop-layout {
        display: none !important;
    }
    
    .product-rating-mobile-compact .rating-mobile-compact-layout {
        display: block !important;
    }
    
    .mobile-compact-line {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 15px !important;
        gap: 10px !important;
        flex-wrap: nowrap !important;
    }
    
    .mobile-score {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #1d1d1f !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }
    
    /* Mobile : étoiles et nombre d'avis côte à côte */
    .mobile-stars-with-count {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex-shrink: 1 !important;
    }
    
    /* Nombre d'avis mobile */
    .mobile-review-count {
        font-size: 14px !important;
        color: #6e6e73 !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }
    
    /* FIX: Supprime les liens bleus sur les étoiles mobiles */
    .mobile-stars-compact {
        text-decoration: none !important;
        color: inherit !important;
        border: none !important;
        outline: none !important;
        flex-shrink: 0 !important;
    }
    
    .mobile-stars-compact:hover,
    .mobile-stars-compact:focus,
    .mobile-stars-compact:active,
    .mobile-stars-compact:visited {
        text-decoration: none !important;
        color: inherit !important;
        border: none !important;
        outline: none !important;
    }
    
    .mobile-stars-compact .rating-stars {
        font-size: 16px !important;
        color: #ff9500 !important;
    }
    
    .mobile-stars-compact:hover .rating-stars {
        color: #ff7700 !important;
        transform: scale(1.05) !important;
    }
    
    .mobile-trust-compact {
        color: #34c759 !important;
        font-weight: 600 !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        text-align: right !important;
    }
}

/* Très petits écrans */
@media (max-width: 400px) {
    .mobile-compact-line {
        gap: 8px !important;
        padding: 0px !important;
    }
    
    .mobile-score {
        font-size: 16px !important;
    }
    
    .mobile-stars-compact .rating-stars {
        font-size: 15px !important;
    }
    
    .mobile-review-count {
        font-size: 12px !important;
    }
    
    .mobile-trust-compact {
        font-size: 12px !important;
    }
}

/* Masquer les éléments desktop sur mobile */
@media (max-width: 768px) {
    .product-rating-mobile-compact .rating-stars-section,
    .product-rating-mobile-compact .trust-indicator {
        display: none !important;
    }
}

/* ==================== STORY HERO SECTION ==================== */

.story-hero-section {
    background: white;
    padding: 80px 0;
}

.story-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

.story-hero-content h2 {
    font-size: 40px;
    font-weight: 700;
    color: #1d1d1f;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 30px;
}

.story-hero-text {
    font-size: 17px;
    line-height: 1.6;
    color: #6e6e73;
}

.story-hero-text p {
    margin-bottom: 0;
}

.story-hero-visual {
    position: relative;
}

.story-hero-images-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    border-radius: 18px;
    overflow: hidden;
}

.hero-image {
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.hero-image:hover {
    transform: scale(1.05);
    z-index: 2;
}

.hero-image img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: all 0.4s ease;
}

.hero-image:hover img {
    filter: brightness(1.1);
}

/* Effet de survol global sur la grille */
.story-hero-images-grid:hover .hero-image:not(:hover) {
    opacity: 0.7;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .story-hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
        padding: 0 20px;
    }
    
    .story-hero-content {
        order: 2;
        text-align: center;
    }
    
    .story-hero-visual {
        order: 1;
    }
    
    .story-hero-content h2 {
        font-size: 28px;
        margin-bottom: 20px;
    }
    
    .story-hero-text {
        font-size: 15px;
    }
    
    .story-hero-images-grid {
        gap: 10px;
    }
    
    .hero-image img {
        height: 150px;
    }
}



/* ================================
   POCHOIR SLOGAN - CSS ADDITIONNELS
   À ajouter dans assets/css/shortcodes.css
   ================================ */

/* Container principal du slogan */
.pochoir-slogan-container {
    margin: 1rem 0;
    padding: 0;
}

/* Style du slogan - hérite des styles du thème */
.pochoir-slogan {
    margin: 0;
    padding: 0;
    font-style: italic;
    opacity: 0.85;
    line-height: 1.5;
    /* Pas de font-size, font-family définis : hérite du thème */
}

/* Responsive mobile */
@media (max-width: 768px) {
    .pochoir-slogan-container {
        margin: 0.8rem 0;
    }
    
    .pochoir-slogan {
        line-height: 1.4;
    }
}

/* ================================
   MÉTABOX ADMIN - STYLES AMÉLIORATION
   ================================ */

/* Métabox produit - amélioration visuelle */
#pochoirs_slogan_metabox .form-field,
#pochoirs_slogan_metabox p {
    margin-bottom: 15px;
}

#pochoirs_slogan_metabox label {
    display: inline-block;
    margin-bottom: 5px;
    font-weight: 600;
}

#pochoirs_slogan_metabox input[type="text"] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    transition: border-color 0.2s ease;
}

#pochoirs_slogan_metabox input[type="text"]:focus {
    border-color: #0073aa;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.1);
}

/* Métabox catégorie - cohérence visuelle */
.term-php .form-field input[type="text"][name*="pochoirs_category_slogan"],
.edit-tags-php .form-field input[type="text"][name*="pochoirs_category_slogan"] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-top: 4px;
    transition: border-color 0.2s ease;
}

.term-php .form-field input[type="text"][name*="pochoirs_category_slogan"]:focus,
.edit-tags-php .form-field input[type="text"][name*="pochoirs_category_slogan"]:focus {
    border-color: #0073aa;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.1);
}

/* Labels catégories multilingues */
.term-php .form-field label[for*="pochoirs_category_slogan"],
.edit-tags-php .form-field label[for*="pochoirs_category_slogan"] {
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
    display: inline-block;
}


/* ==================== ENGAGEMENTS V2 - DESIGN MODERNE ==================== */

.pochoirs-engagements-v2-section {
    background: none;
    padding: 80px 0;
}

/* Bannière principale */
.engagement-banner-v2 {
    background: white;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
    position: relative;
    overflow: hidden;
}

/* Barre du haut - cachée par défaut, bleue au hover */
.engagement-banner-v2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--global-palette1, #007aff);
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 20px 20px 0 0;
}

.engagement-banner-v2:hover::before {
    opacity: 1;
}

/* Grille des engagements */
.engagements-grid-v2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

/* Cartes individuelles */
.engagement-item-v2 {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 25px;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.engagement-item-v2:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    border-color: transparent;
}

/* Icônes - grises par défaut */
.engagement-icon-v2 {
    width: 60px;
    height: 60px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e2e8f0;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

/* Icônes deviennent bleues au hover */
.engagement-item-v2:hover .engagement-icon-v2 {
    background: var(--global-palette1, #007aff);
    transform: scale(1.1) rotate(5deg);
}

/* SVG dans les icônes */
.engagement-icon-v2 svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: #6b7280;
    stroke-width: 2;
    transition: stroke 0.3s ease;
}

.engagement-item-v2:hover .engagement-icon-v2 svg {
    stroke: white;
}

/* Drapeau français spécial */
.flag-france-v2 {
    display: flex;
    width: 28px;
    height: 20px;
    border: 1px solid #6b7280;
    border-radius: 2px;
    overflow: hidden;
}

.flag-france-v2 .blue { background: #0055CC; flex: 1; }
.flag-france-v2 .white { background: white; flex: 1; }
.flag-france-v2 .red { background: #EF4444; flex: 1; }

.engagement-item-v2:hover .flag-france-v2 {
    border-color: white;
}

/* Contenu des cartes */
.engagement-content-v2 {
    flex: 1;
}

.engagement-title-v2 {
    font-size: 20px;
    font-weight: 700;
    color: #1d1d1f;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}

.engagement-description-v2 {
    font-size: 15px;
    color: #6e6e73;
    line-height: 1.5;
}

/* Responsive mobile */
@media (max-width: 768px) {
    .pochoirs-engagements-v2-section {
        padding: 60px 0;
    }

    .engagement-banner-v2 {
        padding: 30px 20px;
    }

    .engagements-grid-v2 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .engagement-item-v2 {
        padding: 20px;
        gap: 15px;
    }

    .engagement-icon-v2 {
        width: 50px;
        height: 50px;
    }

    .engagement-icon-v2 svg {
        width: 24px;
        height: 24px;
    }

    .flag-france-v2 {
        width: 24px;
        height: 16px;
    }

    .engagement-title-v2 {
        font-size: 18px;
    }

    .engagement-description-v2 {
        font-size: 14px;
    }
}


/* ===================================
   SHORTCODE DELIVERY DATES - VERSION OPTIMISÉE
=================================== */

.pochoirs-delivery-dates {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.2);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    width: 100%;
    text-align: center;
}

/* Effet de brillance au survol (desktop seulement) */
.pochoirs-delivery-dates::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 0.6s ease;
}

/* Icône camion avant le texte */
.pochoirs-delivery-dates::after {
    content: '🚚';
    margin-right: 8px;
    order: -1;
    font-size: 16px;
}

/* Effets hover uniquement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .pochoirs-delivery-dates:hover::before {
        left: 100%;
    }
    
    .pochoirs-delivery-dates:hover {
        box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3);
        background: linear-gradient(135deg, #059669 0%, #047857 100%);
    }
}

/* Format minimal sans icône */
.pochoirs-delivery-dates.format-minimal {
    padding: 8px 12px;
    font-size: 13px;
    background: #6b7280;
    box-shadow: none;
}

.pochoirs-delivery-dates.format-minimal::after {
    display: none;
}

@media (hover: hover) and (pointer: fine) {
    .pochoirs-delivery-dates.format-minimal:hover {
        background: #4b5563;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
}

/* Responsive */
@media (max-width: 768px) {
    .pochoirs-delivery-dates {
        padding: 10px 14px;
        font-size: 13px;
    }
    
    .pochoirs-delivery-dates::after {
        font-size: 14px;
    }
}

.pochoirs-delivery-container {
    margin-bottom: 15px;
}



.pochoirs-delivery-container {
    margin-bottom: 15px;
    text-align: center; /* Centre tout le contenu */
}

.pochoirs-delivery-dates {
    text-align: center; /* Centre le texte de la box de livraison */
}

.pochoirs-delivery-dates.clickable {
    cursor: pointer;
}

.pochoirs-shipping-info {
    margin-top: 8px;
    font-size: 0.8em;
    color: var(--global-palette5, #333);
    text-align: center; /* Centre le texte des frais de port */
}

.pochoirs-shipping-info a {
    color: var(--global-palette5, #333);
    text-decoration: underline;
    cursor: pointer;
}

.pochoirs-shipping-info a:hover {
    color: var(--global-palette5, #333);
    opacity: 0.8; /* Effet hover avec opacité au lieu de changer la couleur */
}

/* Responsive shipping info - versions desktop/mobile */
.shipping-mobile {
    display: none;
}

.shipping-desktop {
    display: inline;
}

@media (max-width: 768px) {
    .shipping-desktop {
        display: none;
    }
    
    .shipping-mobile {
        display: inline;
        font-size: 12px;
    }
}

/* Mise à jour du style du symbole ⓘ */
.pochoirs-shipping-info a {
    color: var(--global-palette5, #333);
    text-decoration: none; /* Changé : supprime le soulignement */
    cursor: pointer;
    font-size: 16px;
    margin-left: 4px;
    opacity: 0.7;
    transition: opacity 0.2s ease;
}

.pochoirs-shipping-info a:hover {
    color: var(--global-palette5, #333);
    opacity: 1; /* Changé : opacité à 1 au hover */
    text-decoration: none;
}

@media (max-width: 768px) {
    .pochoirs-shipping-info a {
        font-size: 14px;
    }
}

/* ==================== QUICK SERVICES SHORTCODE ==================== */

/* Style compact unique */
.pochoirs-quick-services {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    background: var(--global-palette8, #f5f5f7);
    padding: 15px 18px;
    border-radius: 12px;
    margin: 20px 0;
    border: 1px solid #e5e7eb;
    transition: all 0.3s ease;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

/* Hover effects seulement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .pochoirs-quick-services:hover {
        background: #f0f0f2;
        transform: translateY(-1px);
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    }
}

.quick-service-item {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}

.quick-service-icon {
    font-size: 14px;
    flex-shrink: 0;
}

.quick-service-text {
    font-size: 13px;
    font-weight: 500;
    color: #1d1d1f;
    letter-spacing: -0.01em;
}

/* Responsive mobile - garde la ligne horizontale mais adapte */
@media (max-width: 768px) {
    .pochoirs-quick-services {
        gap: 15px;
        padding: 16px 12px;
    }
    
    .quick-service-item {
        gap: 6px;
        flex-direction: column;
        justify-content: center;
    }
    
    .quick-service-text {
        font-size: 12px;
        line-height: 1.2;
        text-align: center;
    }
    
    .quick-service-icon {
        font-size: 14px;
    }
}

/* Très petits écrans - 3 colonnes très compactes */
@media (max-width: 480px) {
    .pochoirs-quick-services {
        gap: 8px;
        padding: 14px 8px;
    }
    
    .quick-service-item {
        gap: 4px;
        min-width: 0; /* Permet la compression */
    }
    
    .quick-service-text {
        font-size: 10px;
        line-height: 1.1;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .quick-service-icon {
        font-size: 12px;
    }
}

/* Écrans très étroits - simplification extrême */
@media (max-width: 320px) {
    .pochoirs-quick-services {
        gap: 4px;
        padding: 12px 6px;
    }
    
    .quick-service-text {
        font-size: 9px;
        font-weight: 600; /* Compense la petite taille */
    }
    
    .quick-service-icon {
        font-size: 11px;
    }
}


/* ==================== GESTION DES COULEURS DES PUCES ==================== */

/* Surcharge toutes les puces avec votre couleur préférée */
.pochoirs-popup-section-info ul li svg,
.pochoirs-popup-section-info li svg,
.pochoirs-popup-section-info h3 svg {
    stroke: var(--global-palette1, #007aff) !important;
    fill: none !important;
}

/* Classes utilitaires pour différentes couleurs si besoin */
.bullet-primary svg { stroke: var(--global-palette1, #007aff) !important; }
.bullet-secondary svg { stroke: #6b7280 !important; }
.bullet-success svg { stroke: #34c759 !important; }
.bullet-warning svg { stroke: #ff9500 !important; }

/* Animation subtle au hover */
.pochoirs-popup-section-info li:hover svg {
    transform: scale(1.1);
    transition: transform 0.2s ease;
}


/* ============================================
   BOX PROMO - VERSION FINALE NETTOYÉE
   ============================================ */

/* Variables CSS */
:root {
    --promo-banner-padding: 8px 0;
    --promo-price-badge-padding: 8px 12px;
    --promo-countdown-gap: 8px;
    --promo-main-row-gap: 16px;
}

/* Container principal en mode promo - SUPPRESSION FORCÉE DE LA BOX BLEUE */
.pochoir-size-instruction-with-price.promo-mode {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin-bottom: 20px !important;
    box-shadow: none !important;
    outline: none !important;
    animation: pochoirPromoSlideIn 0.6s ease-out !important;
    line-height: 1.4 !important;
    /* Suppression explicite de tous les styles de box bleue */
    background-image: none !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

/* Suppression du contenu de l'ancienne box d'instruction */
.pochoir-size-instruction-with-price.promo-mode .pochoir-instruction-content {
    display: none !important;
}

/* Reset line-height pour tous les éléments de la box promo */
.promo-box.promo,
.promo-box.promo * {
    line-height: 1.4;
}

/* Bandeau promo rouge */
.promo-banner {
    background: #FF6A3D;
    color: white;
    padding: var(--promo-banner-padding);
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    border-radius: 16px 16px 0 0;
    margin-bottom: 0;
    box-shadow: 0 2px 8px rgba(230, 69, 34, 0.22);
    position: relative;
    overflow: hidden;
}

/* Effet de brillance sur le bandeau promo */
.promo-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 1.5s ease;
}

/* Hover uniquement sur desktop */
@media (hover: hover) and (pointer: fine) {
    .promo-banner:hover::before {
        left: 100%;
    }
}

/* Box principale promo */
.promo-box.promo {
    background: linear-gradient(135deg, #FFEDE6 0%, #FFD9CC 100%);
    border: 1px solid #FFC2B3;
    border-radius: 0 0 16px 16px;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: 0 4px 20px rgba(255, 210, 196, 0.25);
    transition: box-shadow 0.3s ease;
}

@media (hover: hover) and (pointer: fine) {
    .promo-box.promo:hover {
        box-shadow: 0 8px 30px rgba(255, 210, 196, 0.35);
    }
}

/* Ligne principale - CENTRÉE */
.promo-box.promo .main-row {
    display: flex;
    align-items: center;
    gap: var(--promo-main-row-gap);
    justify-content: center;
    min-height: 44px;
}

/* Badge prix - SANS MARGE */
.promo-box.promo .price-badge {
    background: #FF6A3D;
    color: white;
    padding: var(--promo-price-badge-padding);
    margin: 0;
    border-radius: 30px;
    font-weight: 600;
    font-size: 16px;
    white-space: nowrap;
    flex-shrink: 0;
    box-shadow: 0 3px 12px rgba(230, 69, 34, 0.25);
    transition: box-shadow 0.3s ease;
    position: relative;
    overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
    .promo-box.promo .price-badge:hover {
        box-shadow: 0 6px 20px rgba(230, 69, 34, 0.35);
    }
}

/* États de prix dynamiques */
.promo-box.promo .price-initial-state {
    opacity: 1;
    transition: opacity 0.3s ease;
}

.promo-box.promo .price-selected-state {
    opacity: 1;
    transition: opacity 0.3s ease;
}

/* Prix barré dans l'état sélectionné */
.promo-box.promo .price-crossed {
    text-decoration: line-through;
    opacity: 0.8;
    font-size: 15px;
    margin-right: 6px;
    color: rgba(255, 255, 255, 0.8);
}

/* Prix promo mis en valeur */
.promo-box.promo .price-promo {
    font-weight: 700;
    color: white;
    font-size: 15px;
}

/* Texte principal - CENTRÉ */
.promo-box.promo .main-text {
    color: #E64522;
    font-weight: 500;
    font-size: 15px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
}

/* Section countdown */
.countdown-section {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--promo-countdown-gap);
    margin: 6px 0 0 0;
    flex-wrap: wrap;
}

.countdown-text {
    color: #B53D24;
    font-weight: 500;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.countdown-timers {
    display: flex;
    gap: 4px;
}

.countdown-timer {
    background: #FF6A3D;
    color: white;
    padding: 4px 8px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 12px;
    min-width: 32px;
    text-align: center;
    box-shadow: 0 2px 8px rgba(230, 69, 34, 0.22);
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

/* Versions desktop vs mobile */
.desktop-version,
.desktop-only {
    display: inline;
}

.mobile-version {
    display: none;
}

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

@media (max-width: 768px) {
    :root {
        --promo-banner-padding: 5px 0;
        --promo-price-badge-padding: 8px 14px;
        --promo-countdown-gap: 6px;
        --promo-main-row-gap: 8px;
    }

    /* Bandeau promo mobile */
    .promo-banner {
        font-size: 12px;
    }

    /* Box promo mobile */
    .promo-box.promo {
        padding: 12px 16px;
        gap: 8px;
    }

    /* Main row devient colonne sur mobile */
    .promo-box.promo .main-row {
        flex-direction: column;
        align-items: center;
        gap: 8px;
        text-align: center;
        min-height: auto;
    }

    /* Badge prix mobile */
    .promo-box.promo .price-badge {
        font-size: 14px;
        order: 1;
        margin: 0;
    }

    /* Prix barré mobile */
    .promo-box.promo .price-crossed {
        font-size: 13px;
        margin-right: 4px;
    }

    /* Prix promo mobile */
    .promo-box.promo .price-promo {
        font-size: 14px;
    }

    /* Masquer le texte instruction sur mobile */
    .promo-box.promo .main-text.desktop-only {
        display: none;
    }

    /* Countdown mobile */
    .countdown-section {
        order: 2;
        margin-top: 2px;
    }

    .countdown-text {
        font-size: 13px;
        gap: 3px;
    }

    .countdown-timer {
        padding: 3px 6px;
        font-size: 12px;
        min-width: 26px;
        border-radius: 4px;
    }

    /* Versions mobile vs desktop */
    .desktop-version {
        display: none;
    }

    .mobile-version {
        display: inline;
    }
}

/* Très petits écrans */
@media (max-width: 480px) {
    .promo-box.promo {
        padding: 10px 14px;
        gap: 6px;
    }

    .promo-box.promo .price-badge {
        font-size: 13px;
        padding: 7px 12px;
    }

    .promo-box.promo .price-crossed {
        font-size: 13px;
        margin-right: 3px;
    }

    .promo-box.promo .price-promo {
        font-size: 13px;
    }

    .countdown-text {
        font-size: 12px;
    }

    .countdown-timer {
        padding: 2px 4px;
        font-size: 11px;
        min-width: 22px;
    }

    .promo-banner {
        font-size: 11px;
        padding: 4px 0;
    }
}

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

@keyframes pochoirPromoSlideIn {
    0% {
        opacity: 0;
        transform: translateY(-10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes priceStateChange {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* Animation lors du changement d'état */
.promo-box.promo .price-selected-state[style*="block"],
.promo-box.promo .price-initial-state[style*="block"] {
    animation: priceStateChange 0.3s ease-out;
}

/* ================================================= */
/* STICKY NAVIGATION BAR - POCHOIRS v1.3.0         */
/* ================================================= */

.pochoirs-sticky-nav-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    z-index: 1000;
    opacity: 0;
    transform: translateY(100%);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    pointer-events: none;
}

.pochoirs-sticky-nav-bar.visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.pochoirs-nav-bar-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Layout Desktop */
.pochoirs-nav-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.pochoirs-nav-button {
    background: var(--global-palette1);
    color: white;
    border: none;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 6px;
}

.pochoirs-nav-button:hover {
    background: var(--global-palette2);
    transform: translateY(-1px);
}

.pochoirs-nav-button.active {
    background: var(--global-palette2);
}

.pochoirs-product-title {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0;
    max-width: 300px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pochoirs-nav-center {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    justify-content: center;
}

.pochoirs-price-info {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #666;
    font-size: 16px;
}

.pochoirs-price-value {
    font-weight: 700;
    color: var(--global-palette1);
    font-size: 18px;
}

.pochoirs-nav-right {
    display: flex;
    align-items: center;
}

.pochoirs-cta-button {
    background: var(--global-palette1);
    color: white;
    border: none;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.pochoirs-cta-button:hover {
    background: var(--global-palette2);
    transform: translateY(-1px);
}

.pochoirs-cta-button.selected {
    background: #ff6600 !important;
}

.pochoirs-cta-button.selected:hover {
    background: #e55a00 !important;
}

/* Dropdown Menu */
.pochoirs-nav-dropdown {
    position: absolute;
    bottom: 100%;
    left: 20px;
    margin-bottom: 10px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: none;
    min-width: 200px;
}

.pochoirs-nav-dropdown.open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.pochoirs-dropdown-item {
    display: block;
    padding: 12px 18px;
    text-decoration: none;
    color: #333;
    font-weight: 500;
    border-bottom: 1px solid #f0f0f0;
    transition: all 0.2s ease;
}

.pochoirs-dropdown-item:last-child {
    border-bottom: none;
}

.pochoirs-dropdown-item:hover {
    background: #f8fafc;
    color: var(--global-palette1);
    padding-left: 22px;
}

/* Responsive Mobile */
@media (max-width: 768px) {
    .pochoirs-nav-bar-content {
        height: 60px;
        padding: 0 15px;
    }
    
    .pochoirs-nav-center {
        display: none;
    }
    
    .pochoirs-nav-left {
        gap: 10px;
    }
    
    .pochoirs-nav-button {
        padding: 8px 12px;
        font-size: 11px;
    }
    
    .pochoirs-cta-button {
        padding: 8px 16px;
        font-size: 14px;
    }
    
    .pochoirs-product-title {
        display: none;
    }
    
    .pochoirs-nav-dropdown {
        left: 15px;
        min-width: 180px;
        margin-bottom: 5px;
    }
}

@media (max-width: 480px) {
    .pochoirs-nav-bar-content {
        padding: 0 12px;
    }
    
    .pochoirs-nav-button {
        padding: 6px 10px;
        font-size: 10px;
    }
    
    .pochoirs-cta-button {
        padding: 6px 12px;
        font-size: 13px;
    }
}

/* Animation d'apparition */
@keyframes pochoirsSlideInBottom {
    0% {
        opacity: 0;
        transform: translateY(100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.pochoirs-sticky-nav-bar.animate-in {
    animation: pochoirsSlideInBottom 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Notifications */
.pochoirs-notification {
    position: fixed;
    top: 20px;
    right: 20px;
    color: white;
    padding: 15px 20px;
    border-radius: 8px;
    z-index: 999999;
    font-weight: 500;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    opacity: 1;
    transition: opacity 0.3s ease;
}

.pochoirs-notification-success {
    background: #4CAF50;
}

.pochoirs-notification-error {
    background: #f44336;
}

.pochoirs-notification.fade-out {
    opacity: 0;
}