/* ==========================================================================
   CardPreview - Styles pour le wrapper de prévisualisation WYSIWYG
   ========================================================================== */

/*
 * Ce composant isole les cards de leur contexte parent (listes, sélection, etc.)
 * pour garantir un rendu fidèle à ce que verra l'utilisateur final.
 */

/* Wrapper principal */
.card-preview-wrapper {
    display: inline-block;
    position: relative;
}

/* Label au-dessus de la preview */
.card-preview-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280; /* gray-500 */
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
    text-align: center;
}

/* Conteneur isolé - Reset des styles de liste */
.card-preview-container {
    /* Isolation du contexte */
    isolation: isolate;

    /* Reset des propriétés héritées potentiellement problématiques */
    position: relative;
    opacity: 1 !important;

    /* Contraindre la card à la hauteur définie */
    overflow: hidden;
    border-radius: 12px;

    /* Neutraliser les styles de sélection/suppression */
    pointer-events: none;
}

/* Réactiver les pointer-events sur les éléments interactifs nécessaires (images swiper, etc.) */
.card-preview-container img,
.card-preview-container video {
    pointer-events: auto;
}

/* S'assurer qu'aucun pseudo-element de liste n'affecte la preview */
.card-preview-container::before,
.card-preview-container::after {
    content: none !important;
    display: none !important;
}

/* S'assurer que les enfants ne reçoivent pas les styles de liste */
.card-preview-container [data-preview-card] {
    /* Déjà géré par isPreview, mais renforcement */
    pointer-events: none;
}

/* Exclure explicitement les styles de suppression/sélection */
.card-preview-container .marked-for-deletion,
.card-preview-container .selected-for-action,
.card-preview-container .deleting,
.card-preview-container .last-visited-candidate {
    opacity: 1 !important;
    position: relative !important;
}

.card-preview-container .marked-for-deletion::after,
.card-preview-container .selected-for-action::after,
.card-preview-container .last-visited-candidate::after {
    content: none !important;
    display: none !important;
}

/* ==========================================================================
   Variantes optionnelles
   ========================================================================== */

/* Avec bordure */
.card-preview-container--bordered {
    border: 1px solid #e5e7eb; /* gray-200 */
    border-radius: 0.75rem;
    overflow: hidden;
}

/* Avec fond */
.card-preview-container--with-bg {
    background-color: #f9fafb; /* gray-50 */
    padding: 1rem;
    border-radius: 0.75rem;
}

/* ==========================================================================
   État vide
   ========================================================================== */

.card-preview-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    background-color: #f9fafb;
    border: 2px dashed #e5e7eb;
    border-radius: 0.75rem;
    padding: 2rem;
}

/* ==========================================================================
   Protection contre les styles de DeletableCardList
   ========================================================================== */

/*
 * Ces sélecteurs assurent que même si une card-preview est accidentellement
 * placée dans un contexte de liste, elle ne sera pas affectée.
 */

[data-card-preview] .deletable-card-wrapper,
[data-card-preview] .candidate-card-wrapper,
[data-card-preview] .program-card-wrapper,
[data-card-preview] .application-card-wrapper,
[data-card-preview] .company-image-card-wrapper,
[data-card-preview] .user-image-card-wrapper,
[data-card-preview] [data-deletable-card-list-target="card"] {
    /* Reset complet des états de liste */
    opacity: 1 !important;
    position: relative !important;
    transition: none !important;
}

[data-card-preview] .deletable-card-wrapper::after,
[data-card-preview] .candidate-card-wrapper::after,
[data-card-preview] .program-card-wrapper::after,
[data-card-preview] .application-card-wrapper::after,
[data-card-preview] [data-deletable-card-list-target="card"]::after {
    content: none !important;
    display: none !important;
}

/* ==========================================================================
   Fix pour le rognage d'image dans CardPreview
   ========================================================================== */

/* Force l'image à remplir le slide via positionnement absolu */
[data-card-preview] .swiper-slide {
    display: block !important;
}

[data-card-preview] .swiper-image {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}