/**
 * Styles avancés pour les blocs flexibles avec formes et effets
 * @package adnprog
 */

/* =========================================================
 * Classes de base pour les blocs
 * ========================================================= */
.adnprog-block {
    position: relative;
    overflow: hidden;
}

/* =========================================================
 * Formes personnalisées (angles, vagues, etc.)
 * ========================================================= */

/* Formes du haut */
.adnprog-block.shape-top-angle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
    z-index: 1;
}

.adnprog-block.shape-top-wave::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: path('M0,50 Q25,0 50,50 T100,50 L100,100 L0,100 Z');
    z-index: 1;
}

.adnprog-block.shape-top-curve::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: ellipse(100% 100% at 50% 0%);
    z-index: 1;
}

.adnprog-block.shape-top-zigzag::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 100%, 10% 0, 20% 100%, 30% 0, 40% 100%, 50% 0, 60% 100%, 70% 0, 80% 100%, 90% 0, 100% 100%);
    z-index: 1;
}

/* Formes du bas */
.adnprog-block.shape-bottom-angle::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 100% 0, 100% 100%);
    z-index: 1;
}

.adnprog-block.shape-bottom-wave::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: path('M0,0 Q25,50 50,0 T100,0 L100,100 L0,100 Z');
    z-index: 1;
}

.adnprog-block.shape-bottom-curve::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: ellipse(100% 100% at 50% 100%);
    z-index: 1;
}

.adnprog-block.shape-bottom-zigzag::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: inherit;
    clip-path: polygon(0 0, 10% 100%, 20% 0, 30% 100%, 40% 0, 50% 100%, 60% 0, 70% 100%, 80% 0, 90% 100%, 100% 0);
    z-index: 1;
}

/* =========================================================
 * Bordures et rayons
 * ========================================================= */
.adnprog-block.border-radius-none {
    border-radius: 0;
}

.adnprog-block.border-radius-small {
    border-radius: 0.25rem;
}

.adnprog-block.border-radius-medium {
    border-radius: 0.5rem;
}

.adnprog-block.border-radius-large {
    border-radius: 1rem;
}

.adnprog-block.border-radius-full {
    border-radius: 50%;
}

/* Bordures */
.adnprog-block.border-width-0 {
    border-width: 0;
}

.adnprog-block.border-width-1 {
    border-width: 1px;
}

.adnprog-block.border-width-2 {
    border-width: 2px;
}

.adnprog-block.border-width-3 {
    border-width: 3px;
}

.adnprog-block.border-width-4 {
    border-width: 4px;
}

/* =========================================================
 * Ombres et effets
 * ========================================================= */
.adnprog-block.shadow-none {
    box-shadow: none;
}

.adnprog-block.shadow-small {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.adnprog-block.shadow-medium {
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.adnprog-block.shadow-large {
    box-shadow: 0 8px 16px rgba(0,0,0,0.2);
}

.adnprog-block.shadow-glow {
    box-shadow: 0 0 20px rgba(0,123,255,0.3);
}

/* =========================================================
 * Hauteurs personnalisées
 * ========================================================= */
.adnprog-block.min-height-auto {
    min-height: auto;
}

.adnprog-block.min-height-small {
    min-height: 200px;
}

.adnprog-block.min-height-medium {
    min-height: 400px;
}

.adnprog-block.min-height-large {
    min-height: 600px;
}

.adnprog-block.min-height-full {
    min-height: 100vh;
}

/* =========================================================
 * Effets sur les images
 * ========================================================= */
.adnprog-block .image-filter-none {
    filter: none;
}

.adnprog-block .image-filter-grayscale {
    filter: grayscale(100%);
}

.adnprog-block .image-filter-sepia {
    filter: sepia(100%);
}

.adnprog-block .image-filter-blur {
    filter: blur(2px);
}

.adnprog-block .image-filter-brightness {
    filter: brightness(1.2);
}

.adnprog-block .image-filter-contrast {
    filter: contrast(1.2);
}

/* Overlays sur les images */
.adnprog-block .image-overlay-none {
    position: relative;
}

.adnprog-block .image-overlay-none::after {
    display: none;
}

.adnprog-block .image-overlay-dark::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 1;
}

.adnprog-block .image-overlay-light::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.3);
    z-index: 1;
}

.adnprog-block .image-overlay-gradient::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(0,0,0,0.3), rgba(255,255,255,0.1));
    z-index: 1;
}

/* =========================================================
 * Typographie avancée
 * ========================================================= */
.adnprog-block.font-weight-light {
    font-weight: 300;
}

.adnprog-block.font-weight-normal {
    font-weight: 400;
}

.adnprog-block.font-weight-semibold {
    font-weight: 600;
}

.adnprog-block.font-weight-bold {
    font-weight: 700;
}

/* =========================================================
 * Espacement avancé
 * ========================================================= */
.adnprog-block.padding-top-0 { padding-top: 0 !important; }
.adnprog-block.padding-top-1 { padding-top: 0.25rem !important; }
.adnprog-block.padding-top-2 { padding-top: 0.5rem !important; }
.adnprog-block.padding-top-3 { padding-top: 1rem !important; }
.adnprog-block.padding-top-4 { padding-top: 1.5rem !important; }
.adnprog-block.padding-top-5 { padding-top: 3rem !important; }

.adnprog-block.padding-bottom-0 { padding-bottom: 0 !important; }
.adnprog-block.padding-bottom-1 { padding-bottom: 0.25rem !important; }
.adnprog-block.padding-bottom-2 { padding-bottom: 0.5rem !important; }
.adnprog-block.padding-bottom-3 { padding-bottom: 1rem !important; }
.adnprog-block.padding-bottom-4 { padding-bottom: 1.5rem !important; }
.adnprog-block.padding-bottom-5 { padding-bottom: 3rem !important; }

.adnprog-block.margin-top-0 { margin-top: 0 !important; }
.adnprog-block.margin-top-1 { margin-top: 0.25rem !important; }
.adnprog-block.margin-top-2 { margin-top: 0.5rem !important; }
.adnprog-block.margin-top-3 { margin-top: 1rem !important; }
.adnprog-block.margin-top-4 { margin-top: 1.5rem !important; }
.adnprog-block.margin-top-5 { margin-top: 3rem !important; }

.adnprog-block.margin-bottom-0 { margin-bottom: 0 !important; }
.adnprog-block.margin-bottom-1 { margin-bottom: 0.25rem !important; }
.adnprog-block.margin-bottom-2 { margin-bottom: 0.5rem !important; }
.adnprog-block.margin-bottom-3 { margin-bottom: 1rem !important; }
.adnprog-block.margin-bottom-4 { margin-bottom: 1.5rem !important; }
.adnprog-block.margin-bottom-5 { margin-bottom: 3rem !important; }

/* =========================================================
 * Animations et transitions
 * ========================================================= */
.adnprog-block {
    transition: all 0.3s ease;
}

.adnprog-block:hover {
    transform: translateY(-2px);
}

.adnprog-block.shadow-none:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* =========================================================
 * Responsive
 * ========================================================= */
@media (max-width: 768px) {
    .adnprog-block.shape-top-angle::before,
    .adnprog-block.shape-top-wave::before,
    .adnprog-block.shape-top-curve::before,
    .adnprog-block.shape-top-zigzag::before,
    .adnprog-block.shape-bottom-angle::after,
    .adnprog-block.shape-bottom-wave::after,
    .adnprog-block.shape-bottom-curve::after,
    .adnprog-block.shape-bottom-zigzag::after {
        height: 30px;
    }
    
    .adnprog-block.min-height-full {
        min-height: 50vh;
    }
    
    .adnprog-block.padding-top-5 {
        padding-top: 2rem !important;
    }
    
    .adnprog-block.padding-bottom-5 {
        padding-bottom: 2rem !important;
    }
}

/* =========================================================
 * Utilitaires
 * ========================================================= */
.adnprog-block .content-wrapper {
    position: relative;
    z-index: 2;
}

.adnprog-block .shape-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}
