/* ==========================================================
   WISHFLOW THEMES FIX - FORMAT ROND
   Ce fichier corrige le conflit entre style.css et themes.css
   À inclure APRÈS themes.css dans dashboard.php
   ========================================================== */

/* 
   PROBLÈME: Les classes .shape-portrait, .shape-landscape, .shape-square 
   dans style.css imposent des aspect-ratio qui empêchent le format rond
   de fonctionner avec les thèmes.

   SOLUTION: Règles plus spécifiques qui forcent aspect-ratio: 1/1 
   et border-radius: 50% quand la forme ronde est sélectionnée.
*/

/* Force le format rond pour TOUS les thèmes quand .shape-round est appliqué */
.wf-card-preview.shape-round,
.card-frame.shape-round,
[class*="theme-"].shape-round {
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
}

/* Désactive les masques SVG et animations incompatibles avec le rond */
.theme-floral.shape-round {
    -webkit-mask: none !important;
    mask: none !important;
}

.theme-nature.shape-round {
    animation: none !important;
}

/* Assure que les pseudo-éléments héritent du border-radius rond */
.theme-gold.shape-round::before,
.theme-premium-artdeco.shape-round::after,
.theme-premium-velvet.shape-round::after {
    border-radius: inherit !important;
}

/* Force les thèmes avec border-radius fixes à adopter 50% en mode rond */
.theme-free-paper.shape-round,
.theme-free-pastel.shape-round,
.theme-free-sky.shape-round,
.theme-modern.shape-round,
.theme-gold.shape-round,
.theme-premium-marble.shape-round,
.theme-premium-galaxy.shape-round,
.theme-premium-frame.shape-round {
    border-radius: 50% !important;
}

/* Padding ajusté pour le contenu en mode rond (comme défini initialement) */
.wf-card-preview.shape-round {
    padding: 3rem;
}

@media (max-width: 768px) {
    .wf-card-preview.shape-round {
        padding: 2rem;
    }
}