/* Annonce de l'assistant : palette, polices et boutons du thème actif. */
.flyer-news {
    position: fixed;
    inset: 0;
    width: min(640px, calc(100% - 2rem));
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: clamp(1.25rem, 4vw, 2.25rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 2px solid var(--red);
    border-top-width: 5px;
    border-radius: var(--radius-card);
    background: var(--card);
    color: var(--white);
    font-family: var(--font-ui);
    box-shadow: 0 20px 70px rgba(0, 0, 0, .55);
    z-index: 10002;
}
.flyer-news:not([open]), .flyer-news-backdrop[hidden] { display: none; }
.flyer-news[open] { animation: flyer-news-in .18s ease-out; }
.flyer-news::backdrop, .flyer-news-backdrop {
    background: rgba(0, 0, 0, .78);
}
.flyer-news-backdrop { position: fixed; inset: 0; z-index: 10001; }
.flyer-news-open, .flyer-news-open body { overflow: hidden; }

.flyer-news__close {
    position: absolute;
    top: .5rem;
    right: .5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: var(--radius);
    background: transparent;
    color: var(--gray);
    font-size: 1.25rem;
    cursor: pointer;
}
.flyer-news__close:hover { color: var(--white); background: var(--mid); }
.flyer-news__badge {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0 2.25rem 1rem 0;
    color: var(--red);
    font-size: .85rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.flyer-news__title {
    margin: 0 0 1rem;
    font-family: var(--font-punk);
    font-size: clamp(2.25rem, 6vw, 3.4rem);
    font-weight: 400;
    line-height: 1.05;
    color: var(--white);
    text-wrap: balance;
}
.flyer-news__title span { color: var(--red); }
.flyer-news__title:focus { outline: none; }
.flyer-news__description {
    margin: 0 0 .5rem;
    font-size: 1.15rem;
    line-height: 1.5;
}
.flyer-news__description strong { font-weight: 700; }
.flyer-news__details {
    margin: 0 0 1rem;
    color: var(--gray);
    font-size: 1rem;
    line-height: 1.45;
}
.flyer-news__check {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    margin: 0 0 .5rem;
    padding: .8rem 1rem;
    border-left: 3px solid var(--red);
    background: var(--mid);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.45;
}
.flyer-news__check i { flex: 0 0 auto; margin-top: .2rem; color: var(--red); }
.flyer-news__access { margin: 0; color: var(--gray); font-size: .95rem; line-height: 1.45; }
.flyer-news__soon { margin: .75rem 0 1rem; font-size: 1rem; line-height: 1.45; }
.flyer-news__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem 1rem; }
.flyer-news__actions .btn-punk { min-height: 44px; white-space: normal; text-align: center; }
.flyer-news__continue {
    min-height: 44px;
    padding: .4rem 0;
    border: 0;
    background: transparent;
    color: var(--white);
    font-family: inherit;
    font-size: 1rem;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.flyer-news__continue:hover { color: var(--red); }
.flyer-news__preference {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 44px;
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid var(--border);
    color: var(--gray);
    font-size: 1rem;
    line-height: 1.4;
    cursor: pointer;
}
.flyer-news__preference input { flex: 0 0 auto; width: 20px; height: 20px; margin: 0; accent-color: var(--red); }
.flyer-news button:focus-visible, .flyer-news a:focus-visible, .flyer-news input:focus-visible {
    outline: 2px solid var(--red);
    outline-offset: 4px;
}
html[data-theme="light"] .flyer-news {
    border-color: var(--ink);
    border-top: 5px solid var(--red);
    box-shadow: 6px 6px 0 rgba(28, 26, 22, .18), 0 18px 50px rgba(0, 0, 0, .25);
}
html[data-theme="light"] .flyer-news__title { font-family: var(--font-punk); }
html[data-theme="light"] .flyer-news__check { border-bottom: 1px solid var(--border); }
@media (max-width: 480px) {
    .flyer-news__actions { flex-direction: column; align-items: stretch; gap: .2rem; }
    .flyer-news__continue { align-self: center; }
}
@media (prefers-reduced-motion: reduce) { .flyer-news[open] { animation: none; } }
@keyframes flyer-news-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
