/* ─── Detail Modal Overlay ────────────────────────────────
   À ajouter à la fin de Feed.css
   ──────────────────────────────────────────────────────── */

/* Le feed devient flouté quand le modal est ouvert */
.feed--blurred {
    filter: blur(6px) brightness(0.55);
    pointer-events: none;
    user-select: none;
    transition: filter 0.3s ease;
}

/* Fond semi-transparent cliquable pour fermer */
.feed-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow-y: auto;
    padding: 24px 16px 40px;
    /* Fond sombre très léger — le blur du feed fait déjà l'essentiel */
    background: rgba(0, 0, 0, 0.25);
    animation: feedModalFadeIn 0.25s ease both;
}

@keyframes feedModalFadeIn {
    from { opacity: 0 }
    to   { opacity: 1 }
}

/* Conteneur scrollable du détail */
.feed-modal-content {
    position: relative;
    width: 100%;
    max-width: 780px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.7);
    animation: feedModalSlideUp 0.3s cubic-bezier(0.22, 1, 0.36, 1) both;
}

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

/* À l'intérieur du modal, dt-page ne doit pas être fixed */
.feed-modal-content .dt-page {
    position: relative;
    min-height: unset;
    border-radius: 20px;
}