/**
 * Styles CSS spécifiques par bloc et par élément
 * Générés automatiquement par le système de personnalisation
 * @package adnprog
 */

/* =========================================================
 * STYLES GLOBAUX DES BLOCS
 * ========================================================= */

/* Classes de base pour tous les blocs */
.bloc-hero,
.bloc-rich-text,
.bloc-2col-img-left-text-right,
.bloc-2col-text-left-img-right,
.bloc-cta-simple,
.bloc-etapes,
.bloc-faq,
.bloc-infos-2-colonnes,
.bloc-infos-3-colonnes,
.bloc-infos-4-colonnes,
.bloc-articles-grid,
.bloc-galerie,
.bloc-slider,
.bloc-video,
.bloc-tableau,
.bloc-graphique,
.bloc-logos,
.bloc-temoignages,
.bloc-text-media,
.bloc-shortcode,
.bloc-carte-map,
.bloc-post-grid-advanced {
    position: relative;
    overflow: hidden;
}

/* =========================================================
 * FORMES DÉCORATIVES
 * ========================================================= */

/* Formes du haut */
.bloc-hero.shape-top-angle::before,
.bloc-rich-text.shape-top-angle::before,
.bloc-2col-img-left-text-right.shape-top-angle::before,
.bloc-2col-text-left-img-right.shape-top-angle::before,
.bloc-cta-simple.shape-top-angle::before,
.bloc-etapes.shape-top-angle::before,
.bloc-faq.shape-top-angle::before,
.bloc-infos-2-colonnes.shape-top-angle::before,
.bloc-infos-3-colonnes.shape-top-angle::before,
.bloc-infos-4-colonnes.shape-top-angle::before,
.bloc-articles-grid.shape-top-angle::before,
.bloc-galerie.shape-top-angle::before,
.bloc-slider.shape-top-angle::before,
.bloc-video.shape-top-angle::before,
.bloc-tableau.shape-top-angle::before,
.bloc-graphique.shape-top-angle::before,
.bloc-logos.shape-top-angle::before,
.bloc-temoignages.shape-top-angle::before,
.bloc-text-media.shape-top-angle::before,
.bloc-shortcode.shape-top-angle::before,
.bloc-carte-map.shape-top-angle::before,
.bloc-post-grid-advanced.shape-top-angle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 100% 0, 100% 70%, 0 100%);
    z-index: 1;
}

.bloc-hero.shape-top-wave::before,
.bloc-rich-text.shape-top-wave::before,
.bloc-2col-img-left-text-right.shape-top-wave::before,
.bloc-2col-text-left-img-right.shape-top-wave::before,
.bloc-cta-simple.shape-top-wave::before,
.bloc-etapes.shape-top-wave::before,
.bloc-faq.shape-top-wave::before,
.bloc-infos-2-colonnes.shape-top-wave::before,
.bloc-infos-3-colonnes.shape-top-wave::before,
.bloc-infos-4-colonnes.shape-top-wave::before,
.bloc-articles-grid.shape-top-wave::before,
.bloc-galerie.shape-top-wave::before,
.bloc-slider.shape-top-wave::before,
.bloc-video.shape-top-wave::before,
.bloc-tableau.shape-top-wave::before,
.bloc-graphique.shape-top-wave::before,
.bloc-logos.shape-top-wave::before,
.bloc-temoignages.shape-top-wave::before,
.bloc-text-media.shape-top-wave::before,
.bloc-shortcode.shape-top-wave::before,
.bloc-carte-map.shape-top-wave::before,
.bloc-post-grid-advanced.shape-top-wave::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%, 0 20%);
    z-index: 1;
}

.bloc-hero.shape-top-curve::before,
.bloc-rich-text.shape-top-curve::before,
.bloc-2col-img-left-text-right.shape-top-curve::before,
.bloc-2col-text-left-img-right.shape-top-curve::before,
.bloc-cta-simple.shape-top-curve::before,
.bloc-etapes.shape-top-curve::before,
.bloc-faq.shape-top-curve::before,
.bloc-infos-2-colonnes.shape-top-curve::before,
.bloc-infos-3-colonnes.shape-top-curve::before,
.bloc-infos-4-colonnes.shape-top-curve::before,
.bloc-articles-grid.shape-top-curve::before,
.bloc-galerie.shape-top-curve::before,
.bloc-slider.shape-top-curve::before,
.bloc-video.shape-top-curve::before,
.bloc-tableau.shape-top-curve::before,
.bloc-graphique.shape-top-curve::before,
.bloc-logos.shape-top-curve::before,
.bloc-temoignages.shape-top-curve::before,
.bloc-text-media.shape-top-curve::before,
.bloc-shortcode.shape-top-curve::before,
.bloc-carte-map.shape-top-curve::before,
.bloc-post-grid-advanced.shape-top-curve::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    border-radius: 0 0 50% 50%;
    z-index: 1;
}

.bloc-hero.shape-top-zigzag::before,
.bloc-rich-text.shape-top-zigzag::before,
.bloc-2col-img-left-text-right.shape-top-zigzag::before,
.bloc-2col-text-left-img-right.shape-top-zigzag::before,
.bloc-cta-simple.shape-top-zigzag::before,
.bloc-etapes.shape-top-zigzag::before,
.bloc-faq.shape-top-zigzag::before,
.bloc-infos-2-colonnes.shape-top-zigzag::before,
.bloc-infos-3-colonnes.shape-top-zigzag::before,
.bloc-infos-4-colonnes.shape-top-zigzag::before,
.bloc-articles-grid.shape-top-zigzag::before,
.bloc-galerie.shape-top-zigzag::before,
.bloc-slider.shape-top-zigzag::before,
.bloc-video.shape-top-zigzag::before,
.bloc-tableau.shape-top-zigzag::before,
.bloc-graphique.shape-top-zigzag::before,
.bloc-logos.shape-top-zigzag::before,
.bloc-temoignages.shape-top-zigzag::before,
.bloc-text-media.shape-top-zigzag::before,
.bloc-shortcode.shape-top-zigzag::before,
.bloc-carte-map.shape-top-zigzag::before,
.bloc-post-grid-advanced.shape-top-zigzag::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 25% 0, 50% 100%, 75% 0, 100% 0, 100% 100%, 0 100%);
    z-index: 1;
}

/* Formes du bas */
.bloc-hero.shape-bottom-angle::after,
.bloc-rich-text.shape-bottom-angle::after,
.bloc-2col-img-left-text-right.shape-bottom-angle::after,
.bloc-2col-text-left-img-right.shape-bottom-angle::after,
.bloc-cta-simple.shape-bottom-angle::after,
.bloc-etapes.shape-bottom-angle::after,
.bloc-faq.shape-bottom-angle::after,
.bloc-infos-2-colonnes.shape-bottom-angle::after,
.bloc-infos-3-colonnes.shape-bottom-angle::after,
.bloc-infos-4-colonnes.shape-bottom-angle::after,
.bloc-articles-grid.shape-bottom-angle::after,
.bloc-galerie.shape-bottom-angle::after,
.bloc-slider.shape-bottom-angle::after,
.bloc-video.shape-bottom-angle::after,
.bloc-tableau.shape-bottom-angle::after,
.bloc-graphique.shape-bottom-angle::after,
.bloc-logos.shape-bottom-angle::after,
.bloc-temoignages.shape-bottom-angle::after,
.bloc-text-media.shape-bottom-angle::after,
.bloc-shortcode.shape-bottom-angle::after,
.bloc-carte-map.shape-bottom-angle::after,
.bloc-post-grid-advanced.shape-bottom-angle::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 30%, 100% 0, 100% 100%, 0 100%);
    z-index: 1;
}

.bloc-hero.shape-bottom-wave::after,
.bloc-rich-text.shape-bottom-wave::after,
.bloc-2col-img-left-text-right.shape-bottom-wave::after,
.bloc-2col-text-left-img-right.shape-bottom-wave::after,
.bloc-cta-simple.shape-bottom-wave::after,
.bloc-etapes.shape-bottom-wave::after,
.bloc-faq.shape-bottom-wave::after,
.bloc-infos-2-colonnes.shape-bottom-wave::after,
.bloc-infos-3-colonnes.shape-bottom-wave::after,
.bloc-infos-4-colonnes.shape-bottom-wave::after,
.bloc-articles-grid.shape-bottom-wave::after,
.bloc-galerie.shape-bottom-wave::after,
.bloc-slider.shape-bottom-wave::after,
.bloc-video.shape-bottom-wave::after,
.bloc-tableau.shape-bottom-wave::after,
.bloc-graphique.shape-bottom-wave::after,
.bloc-logos.shape-bottom-wave::after,
.bloc-temoignages.shape-bottom-wave::after,
.bloc-text-media.shape-bottom-wave::after,
.bloc-shortcode.shape-bottom-wave::after,
.bloc-carte-map.shape-bottom-wave::after,
.bloc-post-grid-advanced.shape-bottom-wave::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 100% 20%, 100% 100%, 0 80%);
    z-index: 1;
}

.bloc-hero.shape-bottom-curve::after,
.bloc-rich-text.shape-bottom-curve::after,
.bloc-2col-img-left-text-right.shape-bottom-curve::after,
.bloc-2col-text-left-img-right.shape-bottom-curve::after,
.bloc-cta-simple.shape-bottom-curve::after,
.bloc-etapes.shape-bottom-curve::after,
.bloc-faq.shape-bottom-curve::after,
.bloc-infos-2-colonnes.shape-bottom-curve::after,
.bloc-infos-3-colonnes.shape-bottom-curve::after,
.bloc-infos-4-colonnes.shape-bottom-curve::after,
.bloc-articles-grid.shape-bottom-curve::after,
.bloc-galerie.shape-bottom-curve::after,
.bloc-slider.shape-bottom-curve::after,
.bloc-video.shape-bottom-curve::after,
.bloc-tableau.shape-bottom-curve::after,
.bloc-graphique.shape-bottom-curve::after,
.bloc-logos.shape-bottom-curve::after,
.bloc-temoignages.shape-bottom-curve::after,
.bloc-text-media.shape-bottom-curve::after,
.bloc-shortcode.shape-bottom-curve::after,
.bloc-carte-map.shape-bottom-curve::after,
.bloc-post-grid-advanced.shape-bottom-curve::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    border-radius: 50% 50% 0 0;
    z-index: 1;
}

.bloc-hero.shape-bottom-zigzag::after,
.bloc-rich-text.shape-bottom-zigzag::after,
.bloc-2col-img-left-text-right.shape-bottom-zigzag::after,
.bloc-2col-text-left-img-right.shape-bottom-zigzag::after,
.bloc-cta-simple.shape-bottom-zigzag::after,
.bloc-etapes.shape-bottom-zigzag::after,
.bloc-faq.shape-bottom-zigzag::after,
.bloc-infos-2-colonnes.shape-bottom-zigzag::after,
.bloc-infos-3-colonnes.shape-bottom-zigzag::after,
.bloc-infos-4-colonnes.shape-bottom-zigzag::after,
.bloc-articles-grid.shape-bottom-zigzag::after,
.bloc-galerie.shape-bottom-zigzag::after,
.bloc-slider.shape-bottom-zigzag::after,
.bloc-video.shape-bottom-zigzag::after,
.bloc-tableau.shape-bottom-zigzag::after,
.bloc-graphique.shape-bottom-zigzag::after,
.bloc-logos.shape-bottom-zigzag::after,
.bloc-temoignages.shape-bottom-zigzag::after,
.bloc-text-media.shape-bottom-zigzag::after,
.bloc-shortcode.shape-bottom-zigzag::after,
.bloc-carte-map.shape-bottom-zigzag::after,
.bloc-post-grid-advanced.shape-bottom-zigzag::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 25% 100%, 50% 0, 75% 100%, 100% 0, 100% 100%, 0 100%);
    z-index: 1;
}

/* =========================================================
 * CLASSES DE TYPOGRAPHIE
 * ========================================================= */

/* Tailles de police */
.font-size-small { font-size: 0.875rem !important; }
.font-size-normal { font-size: 1rem !important; }
.font-size-large { font-size: 1.25rem !important; }
.font-size-xlarge { font-size: 1.5rem !important; }

/* Poids de police */
.font-weight-light { font-weight: 300 !important; }
.font-weight-normal { font-weight: 400 !important; }
.font-weight-semibold { font-weight: 600 !important; }
.font-weight-bold { font-weight: 700 !important; }

/* Alignement du texte */
.text-align-left { text-align: left !important; }
.text-align-center { text-align: center !important; }
.text-align-right { text-align: right !important; }
.text-align-justify { text-align: justify !important; }

/* Hauteur de ligne */
.line-height-tight { line-height: 1.25 !important; }
.line-height-normal { line-height: 1.5 !important; }
.line-height-relaxed { line-height: 1.75 !important; }
.line-height-loose { line-height: 2 !important; }

/* =========================================================
 * CLASSES DE BORDURES
 * ========================================================= */

/* Rayons de bordure */
.border-radius-none { border-radius: 0 !important; }
.border-radius-small { border-radius: 0.25rem !important; }
.border-radius-medium { border-radius: 0.5rem !important; }
.border-radius-large { border-radius: 1rem !important; }
.border-radius-full { border-radius: 50% !important; }

/* =========================================================
 * CLASSES D'OMBRES
 * ========================================================= */

.shadow-none { box-shadow: none !important; }
.shadow-small { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important; }
.shadow-medium { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23) !important; }
.shadow-large { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23) !important; }
.shadow-glow { box-shadow: 0 0 20px rgba(0, 123, 255, 0.3) !important; }

/* =========================================================
 * CLASSES DE FILTRES
 * ========================================================= */

.filter-none { filter: none !important; }
.filter-grayscale { filter: grayscale(100%) !important; }
.filter-sepia { filter: sepia(100%) !important; }
.filter-blur { filter: blur(2px) !important; }
.filter-brightness { filter: brightness(1.2) !important; }
.filter-contrast { filter: contrast(1.2) !important; }

/* =========================================================
 * CLASSES D'OVERLAY
 * ========================================================= */

.overlay-none { position: relative; }
.overlay-none::before { display: none; }

.overlay-dark { position: relative; }
.overlay-dark::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.overlay-light { position: relative; }
.overlay-light::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.3);
    z-index: 1;
}

.overlay-gradient { position: relative; }
.overlay-gradient::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.7));
    z-index: 1;
}

.overlay-custom { position: relative; }
.overlay-custom::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--overlay-color, rgba(0, 0, 0, 0.5));
    z-index: 1;
}

/* =========================================================
 * STYLES SPÉCIFIQUES PAR BLOC
 * ========================================================= */

/* Bloc Hero */
.bloc-hero .hero-title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.bloc-hero .hero-text {
    font-size: 1.125rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

/* Bloc 2 colonnes */
.bloc-2col-img-left-text-right .text-content,
.bloc-2col-text-left-img-right .text-content {
    font-size: 1rem;
    line-height: 1.6;
}

/* Bloc CTA Simple */
.bloc-cta-simple .cta-box {
    background: #212529;
    border-radius: 1rem;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.bloc-cta-simple .cta-text {
    color: #ffffff;
    font-size: 1.125rem;
    line-height: 1.6;
}

/* Bloc Étapes */
.bloc-etapes .step-card {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 1rem;
    padding: 2rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    height: 100%;
}

.bloc-etapes .step-number {
    background: #212529;
    color: #ffffff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    position: absolute;
    top: -20px;
    left: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.bloc-etapes .step-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

.bloc-etapes .step-text {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

/* Bloc FAQ */
.bloc-faq .accordion {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.bloc-faq .accordion-button {
    background: #ffffff;
    color: #212529;
    font-weight: 600;
    padding: 1.5rem;
    border: none;
    border-bottom: 1px solid #e9ecef;
}

.bloc-faq .accordion-button:not(.collapsed) {
    background: #f8f9fa;
    color: #212529;
}

.bloc-faq .accordion-body {
    background: #ffffff;
    color: #495057;
    font-size: 1rem;
    line-height: 1.6;
    padding: 1.5rem;
}

/* Bloc Infos */
.bloc-infos-2-colonnes .info-card,
.bloc-infos-3-colonnes .info-card,
.bloc-infos-4-colonnes .info-card {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 1rem;
    padding: 2rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    height: 100%;
}

.bloc-infos-2-colonnes .info-title,
.bloc-infos-3-colonnes .info-title,
.bloc-infos-4-colonnes .info-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.bloc-infos-2-colonnes .info-text,
.bloc-infos-3-colonnes .info-text,
.bloc-infos-4-colonnes .info-text {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

/* Bloc Articles Grid */
.bloc-articles-grid .article-card {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 1rem;
    padding: 1.5rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    height: 100%;
}

.bloc-articles-grid .article-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.bloc-articles-grid .article-excerpt {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.bloc-articles-grid .article-meta {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
}

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

@media (max-width: 768px) {
    .bloc-hero .hero-title {
        font-size: 2rem;
    }
    
    .bloc-hero .hero-text {
        font-size: 1rem;
    }
    
    .bloc-cta-simple .cta-box {
        padding: 1.5rem;
    }
    
    .bloc-etapes .step-card,
    .bloc-infos-2-colonnes .info-card,
    .bloc-infos-3-colonnes .info-card,
    .bloc-infos-4-colonnes .info-card,
    .bloc-articles-grid .article-card {
        padding: 1.5rem;
    }
}

@media (max-width: 576px) {
    .bloc-hero .hero-title {
        font-size: 1.75rem;
    }
    
    .bloc-cta-simple .cta-box {
        padding: 1rem;
    }
    
    .bloc-etapes .step-card,
    .bloc-infos-2-colonnes .info-card,
    .bloc-infos-3-colonnes .info-card,
    .bloc-infos-4-colonnes .info-card,
    .bloc-articles-grid .article-card {
        padding: 1rem;
    }
}