/* ===========================================================================
   Thème « Festif » — module Festivités (Festifun)
   - Back-office (body.is-festivites)  : festif clair, ludique.
   - Vitrine publique (body.festif-public) : landing page audacieuse, fond encre
     + accents néon, cartes claires pour la lisibilité.
   Scopé aux pages festivités. Spécificité élevée plutôt que !important.
   =========================================================================== */

/* ---------------------------------------------------------------------------
   1) BACK-OFFICE — thème festif clair
   --------------------------------------------------------------------------- */
body.is-festivites {
    --fest-pink: #ff4d8d;
    --fest-orange: #ff8a3d;
    --fest-yellow: #ffd23f;
    --fest-ink: #2a1640;
    --fest-grad: linear-gradient(120deg, var(--fest-pink), var(--fest-orange) 55%, var(--fest-yellow));
    background:
        radial-gradient(900px 500px at 8% -10%, rgba(255,77,141,0.16), transparent 60%),
        radial-gradient(800px 480px at 100% 0%, rgba(56,189,248,0.16), transparent 55%);
}
body.is-festivites .site-header {
    background: var(--fest-grad);
    border: 0;
    box-shadow: 0 6px 24px rgba(255,90,140,0.28);
}
body.is-festivites .site-header .brand-title,
body.is-festivites .site-header .brand small { color: #fff; }
/* Les nav-link utilisent ::before pour le texte (système d'animation) :
   on passe le blanc dans les custom properties plutôt que sur color,
   pour éviter la double couche de texte visible. */
body.is-festivites .site-header .main-nav .nav-link {
    color: transparent;
    --nav-link-base-color: #fff;
    --nav-link-hover-color: rgba(255,255,255,0.82);
}
/* Les items des panels dropdown ont un fond clair : restaurer les couleurs sombres par défaut. */
body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link {
    --nav-link-base-color: color-mix(in srgb, var(--accent-strong) 86%, var(--text) 14%);
    --nav-link-hover-color: var(--accent);
}
body.is-festivites .site-header .brand-mark {
    background: rgba(255,255,255,0.22);
    border-radius: 14px; width: 42px; height: 42px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.4rem; animation: fest-pop 3.5s ease-in-out infinite;
}
body.is-festivites .site-header .nav-link.is-active { background: rgba(255,255,255,0.22); border-radius: 999px; }
/* Glider du nav-indicator : style vitré assorti aux pills du thème festif */
body.is-festivites .site-header .main-nav .calendar-member-filter-indicator {
    background: rgba(255,255,255,0.22);
    border-color: rgba(255,255,255,0.45);
}
/* Texte de l'item actif lisible sur le pill blanc : utilise la couleur ink (texte blanc déjà OK sur gradient) */
body.is-festivites .site-header .main-nav .nav-link.is-active::before,
body.is-festivites .site-header .main-nav .nav-link.is-button-indicator-pending::before {
    color: #fff;
}
/* Item actif DANS un panneau déroulant (fond clair) : pastille festive pleine.
   Sans ça, le fond blanc translucide (.is-active ci-dessus, pensé pour la barre
   sur dégradé) + texte blanc rend l'item invisible (blanc sur blanc). */
body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link.is-active {
    background: var(--fest-grad, #ff4d8d);
    border-color: transparent;
    border-radius: 10px;
}
/* Hamburger sur le dégradé : barres blanches, encadré vitré assorti aux pills. */
body.is-festivites .nav-toggle {
    color: #fff;
    border-color: rgba(255,255,255,0.45);
    background: rgba(255,255,255,0.15);
}
body.is-festivites .nav-toggle:hover { background: rgba(255,255,255,0.28); border-color: rgba(255,255,255,0.7); }
body.is-festivites .page-title {
    background: var(--fest-grad);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
body.is-festivites .content-card { border-radius: 20px; box-shadow: 0 12px 30px rgba(42,22,64,0.08); }
body.is-festivites .button.primary {
    background: var(--fest-grad); border: 0; border-radius: 999px; color: #fff; font-weight: 700;
    box-shadow: 0 8px 18px rgba(255,90,140,0.30); transition: transform .15s ease, box-shadow .15s ease;
}
body.is-festivites .button.primary:hover { transform: translateY(-2px) scale(1.02); }
body.is-festivites .button.secondary { border-radius: 999px; border: 2px solid var(--fest-orange); font-weight: 600; }

/* ---------------------------------------------------------------------------
   1b) MENU MOBILE (back-office festif)
   Le nav s'ouvre sous l'en-tête, par-dessus le dégradé rose→orange. Objectifs :
   - lisibilité : pastilles vitrées assez contrastées + libellés blancs ombrés ;
   - item courant clairement repérable (pastille blanche pleine, texte rose) ;
   - sous-menus en accordéon (un seul ouvert) présentés en UNE colonne avec un
     rail d'imbrication, pour que la hiérarchie reste claire même à plusieurs.
   Sélecteurs préfixés body.is-festivites .site-header .main-nav pour l'emporter
   sur les règles mobiles globales (styles.css) et le <style> inline de base.html.
   --------------------------------------------------------------------------- */
@media (max-width: 768px) {
    /* Conteneur : séparateur clair sous la marque + marge basse sûre (iPhone) */
    body.is-festivites .site-header .main-nav {
        gap: 0.5rem;
        padding: 0.7rem 0 0.6rem;
        border-top: 1px solid rgba(255, 255, 255, 0.28);
    }
    @supports (-webkit-touch-callout: none) {
        body.is-festivites .site-header .main-nav.is-open {
            padding-bottom: max(0.6rem, env(safe-area-inset-bottom));
        }
    }

    /* Pastilles de 1er niveau : verre translucide clair, lisible sur le dégradé */
    body.is-festivites .site-header .main-nav .nav-link,
    body.is-festivites .site-header .main-nav .nav-submenu-toggle {
        background: rgba(255, 255, 255, 0.16);
        border: 1px solid rgba(255, 255, 255, 0.32);
        border-radius: 14px;
        min-height: 50px;
        padding: 0.72rem 0.95rem;
        font-size: 1rem;
        font-weight: 600;
        -webkit-backdrop-filter: blur(6px);
        backdrop-filter: blur(6px);
        transition: background 160ms ease, border-color 160ms ease, transform 120ms ease;
    }
    /* De la place à droite du toggle pour le chevron (positionné en absolu) */
    body.is-festivites .site-header .main-nav .nav-submenu-toggle {
        padding-right: 2.4rem;
    }
    /* Le libellé est dessiné par ::before — ombre douce pour le détacher du fond */
    body.is-festivites .site-header .main-nav .nav-link::before {
        text-shadow: 0 1px 2px rgba(80, 18, 55, 0.30);
    }
    body.is-festivites .site-header .main-nav .nav-link:hover,
    body.is-festivites .site-header .main-nav .nav-submenu-toggle:hover {
        background: rgba(255, 255, 255, 0.24);
        border-color: rgba(255, 255, 255, 0.44);
    }
    body.is-festivites .site-header .main-nav .nav-link:active,
    body.is-festivites .site-header .main-nav .nav-submenu-toggle:active {
        transform: scale(0.985);
    }
    /* Focus clavier : anneau blanc net (au lieu du liseré bleu/or hérité) */
    body.is-festivites .site-header .main-nav .nav-link:focus-visible,
    body.is-festivites .site-header .main-nav .nav-submenu-toggle:focus-visible {
        outline: 2px solid rgba(255, 255, 255, 0.92);
        outline-offset: 2px;
        border-color: rgba(255, 255, 255, 0.6);
    }

    /* Parent d'un sous-menu ouvert : mis en évidence (repère quand plusieurs) */
    body.is-festivites .site-header .main-nav .nav-submenu[open] .nav-submenu-toggle {
        background: rgba(255, 255, 255, 0.28);
        border-color: rgba(255, 255, 255, 0.5);
    }

    /* Item actif (page courante) : pastille blanche pleine, libellé rose vif.
       Le second sélecteur garde le blanc même quand la section active est ouverte
       (sinon la règle [open] ci-dessus l'emporterait → texte rose peu lisible). */
    body.is-festivites .site-header .main-nav .nav-link.is-active,
    body.is-festivites .site-header .main-nav .nav-submenu-toggle.is-active,
    body.is-festivites .site-header .main-nav .nav-submenu[open] .nav-submenu-toggle.is-active {
        background: #fff;
        border-color: #fff;
        box-shadow: 0 6px 16px rgba(120, 20, 60, 0.20);
    }
    body.is-festivites .site-header .main-nav .nav-link.is-active::before,
    body.is-festivites .site-header .main-nav .nav-submenu-toggle.is-active::before {
        color: var(--fest-pink, #ff4d8d);
        text-shadow: none;
    }

    /* Chevron : blanc et un peu plus lisible ; rose quand la section est active */
    body.is-festivites .site-header .main-nav .nav-submenu-caret {
        color: #fff;
        font-size: 0.9em;
    }
    body.is-festivites .site-header .main-nav .nav-submenu-toggle.is-active .nav-submenu-caret {
        color: var(--fest-pink, #ff4d8d);
    }

    /* Panneau de sous-menu : UNE colonne, encart vitré avec rail de gauche pour
       matérialiser l'imbrication (annule la grille 2 colonnes globale) */
    body.is-festivites .site-header .main-nav .nav-submenu-panel {
        grid-template-columns: 1fr;
        gap: 0.28rem;
        margin: 0.35rem 0 0.1rem 0.55rem;
        padding: 0.4rem 0.4rem 0.4rem 0.55rem;
        border-left: 2px solid rgba(255, 255, 255, 0.42);
        border-radius: 0 12px 12px 0;
        background: rgba(255, 255, 255, 0.12);
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
    }
    /* Items du sous-menu : texte blanc sur verre, cohérent avec les parents */
    body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link {
        --nav-link-base-color: #fff;
        --nav-link-hover-color: #fff;
        background: transparent;
        border-color: transparent;
        border-radius: 10px;
        min-height: 46px;
        padding: 0.6rem 0.8rem;
        font-size: 0.95rem;
        font-weight: 500;
    }
    body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link::before {
        text-shadow: 0 1px 2px rgba(80, 18, 55, 0.28);
    }
    body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link:hover,
    body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link:active {
        background: rgba(255, 255, 255, 0.2);
    }
    /* Item de sous-menu actif : pastille blanche pleine + libellé rose */
    body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link.is-active {
        background: #fff;
        border-color: #fff;
    }
    body.is-festivites .site-header .main-nav .nav-submenu-panel .nav-link.is-active::before {
        color: var(--fest-pink, #ff4d8d);
        text-shadow: none;
    }

    /* Apparition douce du panneau (progressif : sans effet si non pris en charge) */
    body.is-festivites .site-header .main-nav .nav-submenu[open] .nav-submenu-panel {
        animation: fest-submenu-in 180ms ease-out;
    }
}
@keyframes fest-submenu-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    body.is-festivites .site-header .main-nav .nav-submenu[open] .nav-submenu-panel {
        animation: none;
    }
}

/* ---------------------------------------------------------------------------
   2) VITRINE PUBLIQUE — landing page audacieuse (fond encre + néon)
   --------------------------------------------------------------------------- */
body.festif-public {
    --neon-pink: #ff2e88;
    --neon-cyan: #22d3ee;
    --neon-yellow: #ffe14d;
    --neon-purple: #a855f7;
    --ink: #0c0820;
    --ink-2: #160f30;
    --grad-hot: linear-gradient(110deg, var(--neon-pink), var(--neon-purple) 50%, var(--neon-cyan));
    --grad-warm: linear-gradient(110deg, var(--neon-pink), var(--neon-yellow));
    color: #ece9fb;
    background:
        radial-gradient(1000px 600px at 12% -8%, rgba(255,46,136,0.22), transparent 60%),
        radial-gradient(900px 600px at 100% 0%, rgba(34,211,238,0.18), transparent 55%),
        radial-gradient(800px 700px at 50% 120%, rgba(168,85,247,0.20), transparent 60%),
        var(--ink);
}
body.festif-public .background-orb { display: none; }

/* En-tête : barre vitrée sombre, collante */
body.festif-public .site-header {
    position: sticky; top: 0; z-index: 50;
    background: rgba(12,8,32,0.72);
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
body.festif-public .site-header .brand-title { color: #fff; font-weight: 800; }
body.festif-public .site-header .brand small { color: var(--neon-cyan); }
body.festif-public .site-header .brand-mark {
    background: var(--grad-hot); color: #fff;
    border-radius: 14px; width: 42px; height: 42px;
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem;
    box-shadow: 0 0 22px rgba(255,46,136,0.55); animation: fest-pop 3.5s ease-in-out infinite;
}
body.festif-public .header-cta {
    margin-left: auto;
    padding: 0.55rem 1.1rem; border-radius: 999px; font-weight: 700; text-decoration: none;
    color: #0c0820; background: var(--neon-yellow);
    box-shadow: 0 0 20px rgba(255,225,77,0.45); transition: transform .15s ease;
}
body.festif-public .header-cta:hover { transform: translateY(-2px) scale(1.03); }

/* Boutons */
body.festif-public .button.primary {
    background: var(--grad-hot); border: 0; border-radius: 999px; color: #fff; font-weight: 800;
    box-shadow: 0 0 26px rgba(255,46,136,0.45); transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
body.festif-public .button.primary:hover { transform: translateY(-2px) scale(1.03); filter: saturate(1.1); }
body.festif-public .button.secondary {
    border-radius: 999px; border: 2px solid rgba(255,255,255,0.35); color: #fff;
    background: rgba(255,255,255,0.06); font-weight: 700;
}
body.festif-public .button.secondary:hover { border-color: var(--neon-cyan); color: #fff; transform: translateY(-2px); }

/* Cartes claires (catalogue, formulaires) lisibles sur fond sombre */
body.festif-public .content-card {
    background: #fbfaff; color: #1a1330; border: 0; border-radius: 22px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
    transition: transform .18s ease, box-shadow .18s ease;
}
body.festif-public .content-card:hover { transform: translateY(-4px); }
body.festif-public .content-card h2,
body.festif-public .content-card h3,
body.festif-public .content-card p,
body.festif-public .content-card label,
body.festif-public .content-card .muted { color: #1a1330; }
body.festif-public .form-label { color: #2a1f45; }

/* --- HERO --- */
body.festif-public .fest-hero {
    position: relative; text-align: center;
    padding: clamp(3rem, 9vw, 7rem) 1.2rem clamp(2rem, 5vw, 4rem);
    overflow: hidden;
}
body.festif-public .fest-hero .eyebrow {
    display: inline-block; letter-spacing: .25em; text-transform: uppercase;
    font-size: .8rem; font-weight: 700; color: var(--neon-cyan); margin-bottom: 1rem;
}
body.festif-public .fest-hero h1 {
    font-size: clamp(2.6rem, 9vw, 6rem); line-height: 0.98; margin: 0 auto 1.2rem;
    max-width: 16ch; font-weight: 800; letter-spacing: -0.02em; color: #fff;
}
body.festif-public .fest-hero h1 .pop {
    background: var(--grad-warm); -webkit-background-clip: text; background-clip: text; color: transparent;
}
body.festif-public .fest-hero p.lead {
    max-width: 60ch; margin: 0 auto 2rem; font-size: clamp(1rem, 2.4vw, 1.25rem); color: #c9c3e6;
}
body.festif-public .fest-hero .hero-actions { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; }
body.festif-public .hero-emoji {
    position: absolute; font-size: clamp(1.8rem, 4vw, 3rem); opacity: .9;
    animation: fest-float 6s ease-in-out infinite;
    filter: drop-shadow(0 6px 16px rgba(0,0,0,.4));
}
body.festif-public .hero-emoji.e1 { left: 6%; top: 22%; animation-delay: 0s; }
body.festif-public .hero-emoji.e2 { right: 8%; top: 16%; animation-delay: .8s; }
body.festif-public .hero-emoji.e3 { left: 14%; bottom: 12%; animation-delay: 1.6s; }
body.festif-public .hero-emoji.e4 { right: 12%; bottom: 16%; animation-delay: 2.4s; }

/* --- MARQUEE --- */
body.festif-public .fest-marquee {
    overflow: hidden; white-space: nowrap; border-top: 1px solid rgba(255,255,255,.1);
    border-bottom: 1px solid rgba(255,255,255,.1); padding: .9rem 0; margin: 1.5rem 0 3rem;
    background: rgba(255,255,255,0.03);
}
body.festif-public .fest-marquee__track { display: inline-block; animation: fest-marquee 22s linear infinite; }
body.festif-public .fest-marquee span {
    font-size: 1.25rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
    margin: 0 1.2rem; color: #fff;
}
body.festif-public .fest-marquee span .dot { color: var(--neon-pink); }

/* --- BENTO --- */
/* Empêche le scroll horizontal au niveau de la page (clip au bord du viewport),
   tout en laissant les images bento déborder/sortir dans les marges. */
body.festif-public main { overflow-x: clip; }
body.festif-public .fest-bento {
    display: grid; gap: 1.4rem; grid-template-columns: repeat(2, 1fr);
    max-width: 760px; margin: 0 auto;
}
/* Nombre impair de cartes : la dernière (seule sur sa rangée) est centrée,
   à la largeur d'une colonne. */
body.festif-public .fest-bento .bento-card:last-child:nth-child(odd) {
    grid-column: 1 / -1; justify-self: center; width: calc(50% - 0.7rem);
}
/* Le lien-carte n'est qu'un cadre de positionnement : le panneau coloré (texte)
   est au-dessus, l'image décorative est un calque positionné DERRIÈRE lui. */
body.festif-public .bento-card { position: relative; display: block; text-decoration: none; }
body.festif-public .bento-card__panel {
    position: relative; z-index: 1;
    border-radius: 24px; padding: 1.6rem; aspect-ratio: 1 / 1; color: #0c0820;
    display: flex; flex-direction: column; justify-content: center; gap: .4rem;
    transition: transform .18s ease, box-shadow .18s ease;
}
body.festif-public .bento-card:hover .bento-card__panel { transform: translateY(-5px) rotate(-0.5deg); box-shadow: 0 24px 50px rgba(0,0,0,.4); }
/* Image derrière le panneau (z-index 0) : `contain` pour ne JAMAIS rogner l'image.
   Elle dépasse en grande partie sur le côté extérieur (≈ ¾ visible) ; seul un quart
   passe derrière la carte. La drop-shadow épouse la forme (utile pour un logo PNG). */
body.festif-public .bento-card__img {
    position: absolute; top: 0; height: 100%; width: auto; max-width: none;
    object-fit: contain;
    z-index: 0; filter: drop-shadow(0 12px 22px rgba(0,0,0,.45));
    transform: translate(0, 0) rotate(0) scale(1); transform-origin: center bottom;
    /* Courbe avec léger dépassement → petit rebond en fin de course (entrée/sortie). */
    transition: transform .5s cubic-bezier(.34, 1.56, .64, 1), filter .4s ease;
    will-change: transform;
}
/* Colonne de gauche (cartes impaires d'une grille 2 colonnes) : dépasse à gauche. */
body.festif-public .bento-card:nth-child(odd) .bento-card__img { left: -30%; right: auto; }
/* Colonne de droite (cartes paires) : dépasse à droite. */
body.festif-public .bento-card:nth-child(even) .bento-card__img { right: -30%; left: auto; }

/* Survol : l'image sort de derrière la carte, passe au premier plan et s'avance
   (translation vers l'extérieur + léger redressement + agrandissement). */
body.festif-public .bento-card:hover .bento-card__img { filter: drop-shadow(0 24px 42px rgba(0,0,0,.55)); }
/* Survol : l'image sort un peu plus par le côté (en restant DERRIÈRE la carte),
   avec un léger rebond en fin de course (cf. la courbe `transition` ci-dessus). */
body.festif-public .bento-card:nth-child(odd):hover .bento-card__img { transform: translate(-32%, -8%) rotate(-6deg) scale(1.06); }
body.festif-public .bento-card:nth-child(even):hover .bento-card__img { transform: translate(32%, -8%) rotate(6deg) scale(1.06); }
@media (prefers-reduced-motion: reduce) {
    body.festif-public .bento-card__img { transition: none; }
}
body.festif-public .bento-card h3 { margin: 0; font-size: 1.9rem; font-weight: 900; line-height: 1.1; letter-spacing: -.01em; color: inherit; }
body.festif-public .bento-card p { margin: .15rem 0 0; font-size: 1.12rem; line-height: 1.35; opacity: .92; color: inherit; }
body.festif-public .bento-card.c-pink .bento-card__panel { background: var(--neon-pink); color: #fff; }
body.festif-public .bento-card.c-cyan .bento-card__panel { background: var(--neon-cyan); }
body.festif-public .bento-card.c-yellow .bento-card__panel { background: var(--neon-yellow); }
body.festif-public .bento-card.c-purple .bento-card__panel { background: var(--neon-purple); color: #fff; }

/* --- SECTIONS génériques sombres --- */
body.festif-public .fest-section { max-width: 1100px; margin: 0 auto; padding: 3.5rem 1.2rem; }
/* En-tête collant (~74px) : décale l'ancrage des liens internes (#catalogue, #etapes)
   pour que le titre visé s'arrête SOUS le menu au lieu de passer dessous. */
body.festif-public [id] { scroll-margin-top: 5.5rem; }
body.festif-public .fest-section > h2 {
    font-size: clamp(1.8rem, 5vw, 3rem); font-weight: 800; color: #fff; text-align: center; margin: 0 0 .5rem;
}
body.festif-public .fest-section > p.section-sub { text-align: center; color: #c2bce0; max-width: 60ch; margin: 0 auto 2.2rem; }

/* --- ÉTAPES --- */
body.festif-public .fest-steps { display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); }
body.festif-public .step {
    background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
    border-radius: 20px; padding: 1.6rem; text-align: center;
}
body.festif-public .step .num {
    display: inline-flex; width: 46px; height: 46px; align-items: center; justify-content: center;
    border-radius: 50%; font-weight: 800; font-size: 1.2rem; color: #0c0820;
    background: var(--grad-warm); margin-bottom: .8rem;
}
body.festif-public .step h3 { color: #fff; margin: 0 0 .4rem; }
body.festif-public .step p { color: #c2bce0; margin: 0; font-size: .92rem; }

/* --- VITRINE CATALOGUE (cartes claires) --- */
body.festif-public .fest-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.1rem;
}
body.festif-public .cat-block { margin-bottom: 2.6rem; }
body.festif-public .cat-block > h3 {
    color: #fff; font-size: 1.5rem; font-weight: 800; display: inline-block; margin: 0 0 1rem;
    position: relative; padding-bottom: .25rem;
}
body.festif-public .cat-block > h3::after {
    content: ""; position: absolute; left: 0; bottom: -2px; width: 100%; height: 4px;
    border-radius: 999px; background: var(--grad-hot);
}
body.festif-public .prod-card { padding: 0; overflow: hidden; }
body.festif-public .prod-card .media { aspect-ratio: 4/3; overflow: hidden; background: #efeaff; }
body.festif-public .prod-card .media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
body.festif-public .prod-card:hover .media img { transform: scale(1.06); }
body.festif-public .prod-card .body { padding: 1rem 1.1rem 1.2rem; }
body.festif-public .prod-card .ptype { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--neon-purple); font-weight: 700; }
body.festif-public .prod-card h4 { margin: .2rem 0 .4rem; color: #1a1330; }
body.festif-public .prod-card .price { font-weight: 800; color: #1a1330; }
body.festif-public .prod-card .price small { color: #6b6390; font-weight: 600; }

/* --- FAQ --- */
body.festif-public .fest-faq { max-width: 760px; margin: 0 auto; }
body.festif-public .fest-faq details {
    background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
    border-radius: 16px; padding: 1rem 1.2rem; margin-bottom: .7rem;
}
body.festif-public .fest-faq summary {
    cursor: pointer; font-weight: 700; color: #fff; list-style: none; display: flex; justify-content: space-between; gap: 1rem;
}
body.festif-public .fest-faq summary::after { content: "+"; color: var(--neon-cyan); font-size: 1.4rem; line-height: 1; }
body.festif-public .fest-faq details[open] summary::after { content: "–"; }
body.festif-public .fest-faq p { color: #c2bce0; margin: .8rem 0 0; }

/* --- GROUPE D'OPTIONS REPLIABLE (formulaire de réservation, >4 choix) --- */
.fest-option-collapse { border: 1px solid rgba(0,0,0,.14); border-radius: 12px; overflow: hidden; }
.fest-option-collapse > .fest-option-summary {
    cursor: pointer; list-style: none; display: flex; align-items: center; gap: .4rem;
    margin: 0; padding: .6rem .85rem;
    background: rgba(0,0,0,.045);
    border-bottom: 1px solid transparent;
    font-weight: 600;
    transition: background .15s ease;
}
.fest-option-collapse > .fest-option-summary:hover { background: rgba(0,0,0,.075); }
.fest-option-collapse > .fest-option-summary::-webkit-details-marker { display: none; }
.fest-option-collapse > .fest-option-summary::after {
    content: "+"; margin-left: auto; font-size: 1.3rem; line-height: 1; opacity: .7;
}
.fest-option-collapse[open] > .fest-option-summary {
    background: rgba(0,0,0,.06);
    border-bottom-color: rgba(0,0,0,.12);
}
.fest-option-collapse[open] > .fest-option-summary::after { content: "–"; }
/* Corps déplié : marge intérieure pour décaler les options sous le résumé. */
.fest-option-collapse__body { padding: .85rem 1.25rem 1rem; }

/* --- BANDEAU CTA --- */
body.festif-public .fest-cta-band {
    max-width: 1100px; margin: 1rem auto 3rem; border-radius: 28px; padding: clamp(2rem,6vw,3.5rem);
    text-align: center; background: var(--grad-hot); color: #fff;
    box-shadow: 0 24px 60px rgba(255,46,136,0.35);
}
body.festif-public .fest-cta-band h2 { font-size: clamp(1.8rem, 5vw, 3rem); font-weight: 800; margin: 0 0 1rem; color: #fff; }

/* --- Pages secondaires (détail, réserver, confirmation) sur fond sombre --- */
body.festif-public .page-title { color: #fff; }
body.festif-public > main > .section .page-subtitle,
body.festif-public .breadcrumb-link { color: #c2bce0; }
body.festif-public .breadcrumb-link:hover { color: #fff; }
/* Texte des cartes claires : on rétablit des couleurs sombres lisibles. */
body.festif-public .content-card .page-title { background: var(--grad-warm); -webkit-background-clip: text; background-clip: text; color: transparent; }
body.festif-public .content-card .muted { color: #6b6390; }

/* --- Pied de page --- */
body.festif-public .site-footer { border-top: 1px solid rgba(255,255,255,0.1); color: #9a93c0; background: transparent; }
body.festif-public .footer-admin-link { color: #6f689a; font-size: 0.78rem; text-decoration: none; opacity: 0.7; }
body.festif-public .footer-admin-link:hover { opacity: 1; text-decoration: underline; }

/* --- Responsive --- */
@media (max-width: 860px) {
    body.festif-public .fest-bento { grid-template-columns: repeat(2, 1fr); }
    body.festif-public .fest-steps { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    body.festif-public .fest-bento { grid-template-columns: 1fr; }
    /* En une colonne, l'orpheline reprend la largeur pleine comme les autres. */
    body.festif-public .fest-bento .bento-card:last-child:nth-child(odd) { grid-column: auto; width: auto; }
}

/* ---------------------------------------------------------------------------
   3) Drop-zone & grille d'images (back-office)
   --------------------------------------------------------------------------- */
/* Gestion des cartes bento (liste triable, personnalisation back-office). */
.is-festivites .bento-item { align-items: center; padding: .5rem .6rem; }
.is-festivites .bento-item__main { flex: 1 1 auto; align-items: center; gap: .65rem; min-width: 0; }
.is-festivites .bento-item__fields { display: flex; flex-direction: column; gap: .3rem; flex: 1 1 auto; min-width: 0; margin: 0; }
.is-festivites .bento-item__fields .form-control { width: 100%; padding: .42rem .65rem; font-size: .9rem; }
.is-festivites .bento-item__fields .autosave-status { font-size: .72rem; margin: 0; line-height: 1; }
.is-festivites .bento-item__fields .autosave-status:empty { display: none; }
.is-festivites .bento-item__actions { display: flex; align-items: center; align-self: center; margin-top: 0; }
.is-festivites .bento-item__actions form { margin: 0; display: flex; align-items: center; }
.is-festivites .bento-item__actions .btn-icon { width: 34px; height: 34px; min-width: 34px; min-height: 34px; box-shadow: none; }
.is-festivites .bento-item__actions .btn-icon:hover { box-shadow: none; }

/* Variante compacte : listes à un seul champ (ex. mots du bandeau défilant). */
.is-festivites .fest-list--compact { gap: .35rem; }
.is-festivites .fest-list--compact .bento-item { padding: .12rem .3rem; border-radius: 10px; align-items: center; }
.is-festivites .fest-list--compact .bento-item__main { gap: .45rem; align-items: center; }
.is-festivites .fest-list--compact .bento-item__fields .form-control { padding: .28rem .55rem; font-size: .85rem; }
.is-festivites .fest-list--compact .bento-item__actions .btn-icon { width: 28px; height: 28px; min-width: 28px; min-height: 28px; border-radius: 8px; }
.is-festivites .fest-list--compact .bento-item__actions .btn-icon i { font-size: .9rem; }
.is-festivites .fest-list--compact .drag-handle { font-size: .8rem; }

/* Vignette = zone d'upload (clic + glisser-déposer) ; × en coin pour retirer. */
.is-festivites .bento-item__thumb {
    position: relative; flex: 0 0 auto;
    width: 58px; height: 58px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: color-mix(in srgb, var(--accent-soft, #eef) 45%, transparent);
    border: 1.5px dashed var(--line); color: var(--muted);
    cursor: pointer; transition: border-color .15s ease, background .15s ease, transform .12s ease;
}
.is-festivites .bento-item__thumb:hover { border-color: var(--accent); }
.is-festivites .bento-item__thumb:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.is-festivites .bento-item__thumb.has-image { border-style: solid; }
.is-festivites .bento-item__thumb.is-drop-target { border-color: var(--accent); background: color-mix(in srgb, var(--accent-soft, #eef) 75%, transparent); transform: scale(1.03); }
.is-festivites .bento-item__thumb.is-uploading { opacity: .6; }
.is-festivites .bento-item__thumb-ph { font-size: 1.4rem; }
.is-festivites .bento-item__thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; display: block; }
.is-festivites .bento-item__thumb-x {
    position: absolute; top: -8px; right: -8px;
    width: 22px; height: 22px; padding: 0; border: 2px solid var(--bg-elevated, #fff); border-radius: 50%;
    background: var(--danger, #c0392b); color: #fff; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; line-height: 1;
    box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
.is-festivites .bento-item__thumb-x:hover { filter: brightness(1.08); }
.is-festivites .bento-item__thumb-x[hidden] { display: none; }
.is-festivites .bento-item__thumb-zoom {
    position: absolute; bottom: -8px; right: -8px;
    width: 22px; height: 22px; padding: 0; border: 2px solid var(--bg-elevated, #fff); border-radius: 50%;
    background: var(--accent, #2a1640); color: #fff; cursor: zoom-in;
    display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; line-height: 1;
    box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
.is-festivites .bento-item__thumb-zoom:hover { filter: brightness(1.08); }
.is-festivites .bento-item__thumb-zoom[hidden] { display: none; }
@media (max-width: 640px) {
    /* Carte bento compacte : poignée + vignette + corbeille sur une rangée
       (corbeille poussée à droite), titre/description pleine largeur dessous.
       `display:contents` fait remonter les enfants de __main dans la grille
       de la carte pour les aligner avec les actions. */
    .is-festivites .bento-item {
        display: grid;
        grid-template-columns: auto auto 1fr;
        grid-template-areas:
            "handle thumb actions"
            "fields fields fields";
        column-gap: .6rem;
        row-gap: .55rem;
        align-items: center;
    }
    .is-festivites .bento-item__main { display: contents; }
    .is-festivites .bento-item .drag-handle { grid-area: handle; }
    .is-festivites .bento-item__thumb { grid-area: thumb; }
    .is-festivites .bento-item__fields { grid-area: fields; }
    .is-festivites .bento-item__actions { grid-area: actions; justify-self: end; }
}

.fest-dropzone {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem;
    padding: 1.6rem; text-align: center; color: #2a1640;
    border: 2.5px dashed rgba(255,138,61,0.55); border-radius: 16px; background: rgba(255,210,63,0.08);
    cursor: pointer; transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.fest-dropzone:hover, .fest-dropzone:focus-visible { border-color: #ff4d8d; background: rgba(255,77,141,0.08); outline: none; }
.fest-dropzone.is-drop-target { border-color: #ff4d8d; background: rgba(255,77,141,0.14); transform: scale(1.01); }
.fest-dropzone__hint { margin: 0; font-size: .9rem; opacity: .8; }
.fest-img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .75rem; }
.fest-img-tile {
    position: relative; margin: 0; border-radius: 14px; overflow: hidden; aspect-ratio: 4/3;
    box-shadow: 0 6px 16px rgba(42,22,64,0.12); cursor: grab; background: #f4f4f8;
}
.fest-img-tile img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fest-img-tile.is-primary { outline: 3px solid #ff4d8d; outline-offset: -3px; }
.fest-img-tile__actions { position: absolute; top: 6px; right: 6px; display: flex; gap: 4px; }
.fest-img-tile__star, .fest-img-tile__delete, .fest-img-tile__zoom, .fest-img-tile__reuse {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border: 0; border-radius: 50%; cursor: pointer; font-size: .85rem; line-height: 1;
    background: rgba(255,255,255,0.92); box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.fest-img-tile__star { color: #ff8a3d; }
.fest-img-tile__delete { color: #d3344f; }
.fest-img-tile__zoom { color: #2a1640; }
.fest-img-tile__reuse { color: #7c3aed; }
.fest-img-tile.is-primary .fest-img-tile__star { color: #ff4d8d; }

/* ---------------------------------------------------------------------------
   3bis) Calendrier (dates réservables côté admin + sélecteur client)
   --------------------------------------------------------------------------- */
.fest-cal {
    --cal-accent: var(--fest-pink, #ff4d8d);
    max-width: 360px;
    user-select: none;
    -webkit-user-select: none;
}
body.festif-public .fest-cal { --cal-accent: var(--neon-pink, #ff2e88); }

.fest-cal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .5rem;
}
.fest-cal__title { font-weight: 700; text-transform: capitalize; }
.fest-cal__nav {
    border: 1px solid rgba(0,0,0,.15);
    background: #fff;
    border-radius: 8px;
    width: 2rem;
    height: 2rem;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    color: inherit;
}
.fest-cal__nav:hover { border-color: var(--cal-accent); color: var(--cal-accent); }

.fest-cal__grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.fest-cal__dow {
    text-align: center;
    font-size: .72rem;
    font-weight: 700;
    opacity: .55;
    padding: .25rem 0;
}
.fest-cal__day {
    aspect-ratio: 1 / 1;
    border: 1px solid transparent;
    background: rgba(0,0,0,.04);
    border-radius: 10px;
    font: inherit;
    font-size: .85rem;
    color: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fest-cal__day--blank { background: transparent; cursor: default; }
.fest-cal__day--past,
.fest-cal__day--disabled {
    opacity: .3;
    cursor: not-allowed;
    background: transparent;
}
.fest-cal__day--open {
    background: rgba(255, 77, 141, .16);
    border-color: rgba(255, 77, 141, .55);
    color: var(--fest-ink, #2a1640);
    font-weight: 600;
}
body.festif-public .fest-cal__day--open {
    background: rgba(255, 46, 136, .18);
    border-color: rgba(255, 46, 136, .55);
}
.fest-cal__day--today { box-shadow: inset 0 0 0 1px var(--cal-accent); }
.fest-cal__day--preview { background: var(--cal-accent); color: #fff; opacity: .65; }
.fest-cal__day--selected {
    background: var(--cal-accent);
    color: #fff;
    border-color: var(--cal-accent);
    font-weight: 700;
}
.fest-cal__day--open:not(.fest-cal__day--selected):hover { border-color: var(--cal-accent); }
/* Jour partiellement réservé : diagonale (mi-libre / mi-occupé). */
.fest-cal__day--partial:not(.fest-cal__day--selected) {
    background-image: linear-gradient(135deg,
        transparent 0 calc(50% - 1px),
        rgba(0,0,0,.35) calc(50% - 1px) calc(50% + 1px),
        transparent calc(50% + 1px) 100%);
}
/* Jour complet : barré, non sélectionnable. */
.fest-cal__day--full {
    background-image: linear-gradient(135deg,
        transparent 0 calc(50% - 1px),
        rgba(0,0,0,.3) calc(50% - 1px) calc(50% + 1px),
        transparent calc(50% + 1px) 100%),
        linear-gradient(45deg,
        transparent 0 calc(50% - 1px),
        rgba(0,0,0,.3) calc(50% - 1px) calc(50% + 1px),
        transparent calc(50% + 1px) 100%);
}

/* Grille de créneaux d'une heure (réservation à l'heure). */
.fest-slots {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(86px, 1fr));
    gap: .5rem;
}
.fest-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: .5rem .25rem;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 10px;
    background: #fff;
    color: inherit;
    cursor: pointer;
    font: inherit;
    line-height: 1.1;
}
.fest-slot__h { font-weight: 700; font-size: .95rem; }
.fest-slot__e { font-size: .72rem; opacity: .6; }
.fest-slot:hover { border-color: var(--cal-accent, #ff4d8d); }
.fest-slot--selected {
    background: var(--cal-accent, #ff4d8d);
    border-color: var(--cal-accent, #ff4d8d);
    color: #fff;
}
.fest-slot--selected .fest-slot__e { opacity: .85; }
.fest-slot--taken {
    cursor: not-allowed;
    opacity: .55;
    background-image: linear-gradient(135deg,
        transparent 0 calc(50% - 1px),
        rgba(0,0,0,.4) calc(50% - 1px) calc(50% + 1px),
        transparent calc(50% + 1px) 100%);
}

/* Popup de sélection des heures (réservation à l'heure). */
.fest-popup__overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(12, 8, 32, .55);
}
.fest-popup__overlay[hidden] { display: none; }
.fest-popup {
    background: #fff;
    color: #1a1330;
    border-radius: 16px;
    padding: 1rem 1.1rem 1.1rem;
    width: min(440px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 24px 60px rgba(0,0,0,.4);
}
.fest-popup__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .25rem;
}
.fest-popup__head strong { font-size: 1.05rem; text-transform: capitalize; }
.fest-popup__close {
    border: none;
    background: rgba(0,0,0,.06);
    border-radius: 50%;
    width: 1.9rem;
    height: 1.9rem;
    cursor: pointer;
    line-height: 1;
    color: inherit;
}
.fest-popup__close:hover { background: rgba(0,0,0,.12); }
.fest-popup__foot { margin-top: 1rem; text-align: right; }

/* Disposition admin : calendrier + panneau d'heures. */
.fest-avail-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: flex-start;
}
.fest-hours-panel {
    flex: 1 1 220px;
    min-width: 220px;
    max-width: 320px;
}
.fest-hours-panel > strong { display: block; margin-bottom: .35rem; }
/* Ouverture / Fermeture côte à côte si la place le permet. */
.fest-timewheels { display: flex; flex-wrap: wrap; gap: .75rem; }
.fest-timewheel { margin-bottom: .25rem; }
.fest-timewheel__label { font-size: .8rem; opacity: .8; margin-bottom: .3rem; }
.fest-timewheel__label strong { font-size: 1rem; opacity: 1; }

/* Roues défilantes (style iOS) : viewport = 3 × 34 px ; bande centrale. */
.fest-wheels {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: .25rem;
    padding: 0 .35rem;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 12px;
    background: #fff;
    width: max-content;
}
.fest-wheels::before {       /* bande de sélection centrale */
    content: '';
    position: absolute;
    left: 5px;
    right: 5px;
    top: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(255, 77, 141, .1);
    box-shadow: inset 0 0 0 1px rgba(255, 77, 141, .55);
    pointer-events: none;
}
.fest-wheels__sep { align-self: center; font-weight: 700; opacity: .5; }
.fest-wheel {
    height: 102px;            /* 3 rangées de 34 px */
    width: 52px;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 33%, #000 67%, transparent);
    mask-image: linear-gradient(180deg, transparent, #000 33%, #000 67%, transparent);
}
.fest-wheel::-webkit-scrollbar { display: none; }
.fest-wheel__pad { height: 34px; flex: 0 0 auto; }   /* (102 − 34) / 2 = 34 */
.fest-wheel__item {
    height: 34px;
    line-height: 34px;
    text-align: center;
    scroll-snap-align: center;
    font-size: 1rem;
    color: inherit;
    opacity: .35;
    cursor: pointer;
    transition: opacity .15s ease, transform .15s ease;
}
.fest-wheel__item.is-center { opacity: 1; font-weight: 700; transform: scale(1.1); }

.fest-merge-toggle { margin-top: .85rem; }
.fest-merge-toggle .ui-toggle__text { font-size: .85rem; }
.fest-selection-actions { display: flex; gap: .5rem; margin-top: .85rem; flex-wrap: wrap; }
.fest-selection-actions .button[disabled] { opacity: .45; cursor: not-allowed; }

.fest-avail-list { display: flex; flex-wrap: wrap; gap: .5rem; }
/* Conteneur des plages enregistrées : pleine largeur, sous le calendrier + roues. */
.fest-avail-saved { margin-top: 1.25rem; }
.fest-avail-saved:not(:empty) { padding-top: 1rem; border-top: 1px solid rgba(0,0,0,.1); }
.fest-avail-top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .75rem; }
.fest-avail-group { margin-bottom: .85rem; }
.fest-avail-group__head { display: flex; align-items: baseline; gap: .5rem; margin-bottom: .35rem; }
.fest-avail-group__head strong { font-size: .95rem; }
.fest-link-btn {
    border: 0; background: none; padding: 0; cursor: pointer;
    color: var(--fest-pink, #ff4d8d); font: inherit; font-size: .8rem;
    text-decoration: underline; margin-left: auto;
}
.fest-link-btn:hover { opacity: .75; }
.fest-avail-chip {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: rgba(255, 77, 141, .12);
    border: 1px solid rgba(255, 77, 141, .3);
    border-radius: 999px;
    padding: .3rem .4rem .3rem .75rem;
    font-size: .85rem;
}
.fest-avail-chip__del {
    border: none;
    background: rgba(0,0,0,.08);
    border-radius: 50%;
    width: 1.4rem;
    height: 1.4rem;
    cursor: pointer;
    line-height: 1;
    color: inherit;
}
.fest-avail-chip__del:hover { background: var(--fest-pink, #ff4d8d); color: #fff; }

/* Aperçu des options d'un groupe (édition d'article) */
.fest-opt-preview {
    flex-basis: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin: -.15rem 0 .15rem;
}
.fest-opt-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: rgba(0, 0, 0, .04);
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 999px;
    padding: .2rem .6rem;
    font-size: .8rem;
    line-height: 1.4;
}
.fest-opt-chip__price { color: var(--fest-pink, #ff4d8d); font-weight: 600; }
.fest-opt-chip__price--muted { color: var(--muted, #6b7280); font-weight: 500; }
.fest-opt-chip i { font-size: .8rem; opacity: .7; }
.fest-opt-chip--default { background: rgba(255, 77, 141, .1); border-color: rgba(255, 77, 141, .3); }
.fest-opt-edit {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .8rem;
    color: var(--fest-pink, #ff4d8d);
    text-decoration: none;
    white-space: nowrap;
}
.fest-opt-edit:hover { text-decoration: underline; }

/* Bibliothèque d'options : accordéon repliable par groupe */
.fest-opt-toolbar {
    display: flex;
    gap: .75rem;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}
.fest-opt-toolbar__search { flex: 1 1 240px; }
.fest-acc {
    border: 1px solid var(--line, rgba(0, 0, 0, .12));
    border-radius: 12px;
    margin-bottom: .75rem;
    background: var(--surface, #fff);
    overflow: hidden;
}
.fest-acc--inactive { opacity: .6; }
.fest-acc__summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .85rem 1rem;
    user-select: none;
}
.fest-acc__summary::-webkit-details-marker { display: none; }
.fest-acc__summary:hover { background: rgba(0, 0, 0, .02); }
.fest-acc__chevron { transition: transform .2s ease; flex: 0 0 auto; opacity: .6; }
.fest-acc[open] > .fest-acc__summary .fest-acc__chevron { transform: rotate(90deg); }
.fest-acc__title { font-weight: 600; }
.fest-acc__meta {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
    align-items: center;
    margin-left: auto;
}
.fest-acc__badge {
    font-size: .75rem;
    padding: .15rem .55rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, .05);
    white-space: nowrap;
}
.fest-acc__badge--warn { background: rgba(245, 158, 11, .15); color: #b45309; }
.fest-acc__badge--price { background: rgba(255, 77, 141, .12); color: var(--fest-pink, #ff4d8d); font-weight: 600; }
.fest-acc__body { padding: .25rem 1rem 1rem; border-top: 1px solid var(--line, rgba(0, 0, 0, .08)); }

/* Actions rapides par ligne dans la liste des réservations */
.fest-row-actions {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    align-items: center;
}
.fest-row-actions form { margin: 0; display: inline; }

/* ---------------------------------------------------------------------------
   4) Calendrier admin — vue mensuelle des réservations
   --------------------------------------------------------------------------- */
.fest-admin-cal-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1rem;
}
.fest-admin-cal-nav__title {
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: capitalize;
    min-width: 13rem;
    text-align: center;
}
.fest-admin-cal-nav__btn {
    min-width: 2.4rem;
    min-height: 2.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    line-height: 1;
    padding: 0;
}

.fest-admin-cal__header {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    background: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.08);
}
.fest-admin-cal__dow {
    padding: .6rem .25rem;
    text-align: center;
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    opacity: .55;
}
.fest-admin-cal__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-auto-rows: minmax(110px, auto);
    border-top: 1px solid rgba(0,0,0,.07);
    border-left: 1px solid rgba(0,0,0,.07);
}
.fest-admin-cal__cell {
    border-right: 1px solid rgba(0,0,0,.07);
    border-bottom: 1px solid rgba(0,0,0,.07);
    padding: .35rem .4rem .45rem;
    display: flex;
    flex-direction: column;
    gap: .18rem;
    min-height: 110px;
}
.fest-admin-cal__cell--vide {
    background: rgba(0,0,0,.025);
}
/* Jours des mois voisins affichés dans la même grille : numéro + contenu pâles */
.fest-admin-cal__cell--outside {
    background: rgba(0,0,0,.025);
}
.fest-admin-cal__cell--outside .fest-admin-cal__num { opacity: .3; }
.fest-admin-cal__cell--outside .fest-admin-festival,
.fest-admin-cal__cell--outside .fest-admin-event { opacity: .4; }
/* Dates passées : grisées, en retrait visuel */
.fest-admin-cal__cell--past {
    background: rgba(0,0,0,.04);
}
.fest-admin-cal__cell--past .fest-admin-cal__num { opacity: .45; }
.fest-admin-cal__cell--past .fest-admin-event,
.fest-admin-cal__cell--past .fest-admin-festival { opacity: .55; }
/* Titre de mois au-dessus de chaque grille */
.fest-admin-cal__month-title {
    font-size: 1rem;
    font-weight: 700;
    padding: .7rem 1rem .55rem;
    color: var(--fest-text, #2a1a2e);
    border-bottom: 1px solid rgba(0,0,0,.07);
}
.fest-admin-cal__num {
    font-size: .78rem;
    font-weight: 600;
    color: var(--muted, #888);
    width: 1.65rem;
    height: 1.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    margin-bottom: .05rem;
}
.fest-admin-cal__cell--today .fest-admin-cal__num {
    background: var(--fest-pink, #ff4d8d);
    color: #fff;
}
.fest-admin-events {
    display: flex;
    flex-direction: column;
    gap: .14rem;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}
.fest-admin-event {
    display: flex;
    align-items: center;
    gap: .28rem;
    border-radius: 4px;
    padding: .16rem .38rem .16rem .28rem;
    border-left: 3px solid transparent;
    text-decoration: none;
    color: inherit;
    font-size: .72rem;
    line-height: 1.3;
    overflow: hidden;
    white-space: nowrap;
    transition: filter .12s ease;
}
.fest-admin-event:hover { filter: brightness(.9); text-decoration: none; }
.fest-admin-event__dot {
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}
.fest-admin-event__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 500;
}
.fest-admin-event--more {
    font-size: .67rem;
    color: var(--muted, #888);
    padding: .1rem .28rem;
    background: none;
    border-left-color: transparent;
    cursor: default;
    font-style: italic;
}
.fest-admin-event--more:hover { filter: none; }

/* Festivals (bandeaux pleins, en tête de cellule) */
.fest-admin-festivals {
    display: flex;
    flex-direction: column;
    gap: .14rem;
    min-width: 0;
}
.fest-admin-festival {
    display: flex;
    flex-direction: column;
    gap: .05rem;
    border-radius: 5px;
    padding: .14rem .4rem;
    background: var(--fest-accent, #e11d48);
    color: #fff;
    text-decoration: none;
    font-size: .72rem;
    line-height: 1.25;
    overflow: hidden;
    transition: filter .12s ease;
}
.fest-admin-festival:hover { filter: brightness(.92); text-decoration: none; color: #fff; }
/* Festival multi-jours : prolonge la barre vers les jours suivants/précédents */
.fest-admin-festival--span { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.fest-admin-festival--cont { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.fest-admin-festival__name {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fest-admin-festival__name i { flex-shrink: 0; font-size: .9em; opacity: .9; }
.fest-admin-festival__time {
    font-size: .66rem;
    font-weight: 600;
    opacity: .9;
    white-space: nowrap;
}

/* Légende */
.fest-legend {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .9rem;
    margin-bottom: 1rem;
    padding: .65rem 1rem;
    background: var(--surface, #fff);
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.09);
}
.fest-legend__item {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .82rem;
}
.fest-legend__dot {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    flex-shrink: 0;
}

@media (max-width: 700px) {
    .fest-admin-cal__grid { grid-auto-rows: minmax(64px, auto); }
    .fest-admin-cal__cell { padding: .2rem .22rem .25rem; min-height: 64px; gap: .1rem; }
    .fest-admin-cal__num { font-size: .68rem; width: 1.4rem; height: 1.4rem; }
    .fest-admin-cal__dow { font-size: .6rem; padding: .45rem .1rem; }
    .fest-admin-event { font-size: .62rem; padding: .1rem .2rem .1rem .18rem; border-left-width: 2px; }
    .fest-admin-event__dot { width: 5px; height: 5px; }
    .fest-admin-event--more { font-size: .6rem; }
    .fest-admin-festival { font-size: .6rem; padding: .1rem .22rem; border-radius: 4px; }
    .fest-admin-festival__time { font-size: .56rem; }
    .fest-admin-cal-nav__title { font-size: .95rem; min-width: 10rem; }
}

/* Liste compacte (cartes-cadeaux, codes promo) */
.fest-compact-list {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}
.fest-compact-item {
    border: 1px solid rgba(0,0,0,.09);
    border-radius: 10px;
    background: var(--surface, #fff);
    overflow: hidden;
}
.fest-compact-item__summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .6rem .85rem;
    user-select: none;
}
.fest-compact-item__summary::-webkit-details-marker { display: none; }
.fest-compact-item__summary:hover { background: rgba(0,0,0,.025); }
.fest-compact-item[open] > .fest-compact-item__summary {
    border-bottom: 1px solid rgba(0,0,0,.08);
    background: rgba(0,0,0,.02);
}
.fest-compact-item__chevron {
    flex-shrink: 0;
    width: .85rem;
    height: .85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: .4;
    position: relative;
}
.fest-compact-item__chevron::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 6px solid currentColor;
    transition: transform .18s ease;
}
.fest-compact-item[open] > .fest-compact-item__summary .fest-compact-item__chevron::before {
    transform: rotate(90deg);
}
.fest-compact-item__code {
    font-family: monospace;
    font-size: .82rem;
    font-weight: 600;
    background: rgba(0,0,0,.06);
    border-radius: 5px;
    padding: .12rem .42rem;
    flex-shrink: 0;
    letter-spacing: .02em;
}
.fest-compact-item__label {
    flex: 1 1 auto;
    font-size: .88rem;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.fest-compact-item__meta {
    font-size: .78rem;
    opacity: .6;
    flex-shrink: 0;
    white-space: nowrap;
}
.fest-compact-item__meta--strong {
    font-weight: 700;
    opacity: .85;
    color: var(--fest-pink, #ff4d8d);
}
.fest-compact-item__badge {
    font-size: .7rem;
    font-weight: 600;
    padding: .18rem .48rem;
    border-radius: 999px;
    flex-shrink: 0;
    white-space: nowrap;
}
.fest-compact-item__badge--on {
    background: rgba(3,127,76,0.13);
    color: #037f4c;
}
.fest-compact-item__badge--off {
    background: rgba(0,0,0,.07);
    color: var(--muted, #888);
}
.fest-compact-item__actions {
    display: flex;
    align-items: center;
    gap: .2rem;
    flex-shrink: 0;
    margin-left: .25rem;
}
.fest-compact-item__actions form { margin: 0; }
.fest-compact-item__body {
    padding: .85rem 1rem 1rem;
}

@media (max-width: 640px) {
    .fest-compact-item__meta { display: none; }
    .fest-compact-item__summary { gap: .4rem; padding: .55rem .65rem; }
    .fest-compact-item__code { font-size: .75rem; }
    .fest-compact-item__label { font-size: .83rem; }
}

/* Panneau d'abonnement WebCal */
.fest-webcal-panel { overflow: hidden; }
.fest-webcal-panel__summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .9rem 1.1rem;
    font-weight: 600;
    user-select: none;
}
.fest-webcal-panel__summary::-webkit-details-marker { display: none; }
.fest-webcal-panel__summary i { font-size: 1.15rem; color: var(--fest-pink, #ff4d8d); }
.fest-webcal-panel__hint {
    margin-left: auto;
    font-size: .78rem;
    font-weight: 400;
    opacity: .6;
}
.fest-webcal-panel[open] .fest-webcal-panel__summary {
    border-bottom: 1px solid rgba(0,0,0,.08);
}
.fest-webcal-panel__body {
    padding: 1.1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: .85rem;
}
.fest-webcal-panel__desc { margin: 0; font-size: .92rem; line-height: 1.5; }
.fest-webcal-panel__actions {
    display: flex;
    align-items: center;
    gap: .85rem;
    flex-wrap: wrap;
}
.fest-webcal-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}
.fest-webcal-panel__or {
    font-size: .85rem;
    opacity: .65;
}
.fest-webcal-url-row {
    display: flex;
    gap: .5rem;
    align-items: center;
}
.fest-webcal-url-input {
    flex: 1 1 auto;
    font-family: monospace;
    font-size: .8rem;
    background: rgba(0,0,0,.03);
    cursor: text;
}
.fest-webcal-copy-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}
.fest-webcal-panel__instructions {
    border: 1px solid rgba(0,0,0,.09);
    border-radius: 10px;
    overflow: hidden;
}
.fest-webcal-panel__instructions details {
    border-bottom: 1px solid rgba(0,0,0,.07);
}
.fest-webcal-panel__instructions details:last-child { border-bottom: 0; }
.fest-webcal-panel__instructions summary {
    cursor: pointer;
    padding: .6rem .85rem;
    font-size: .85rem;
    font-weight: 600;
    list-style: none;
    background: rgba(0,0,0,.02);
}
.fest-webcal-panel__instructions summary::-webkit-details-marker { display: none; }
.fest-webcal-panel__instructions summary:hover { background: rgba(0,0,0,.04); }
.fest-webcal-panel__instructions ol {
    margin: .5rem 0 .75rem;
    padding-left: 1.8rem;
    font-size: .85rem;
    line-height: 1.6;
}
.fest-webcal-panel__instructions code {
    background: rgba(0,0,0,.07);
    border-radius: 4px;
    padding: .1rem .35rem;
    font-size: .8rem;
}
.fest-webcal-panel__warning {
    margin: 0;
    font-size: .8rem;
    opacity: .65;
    display: flex;
    align-items: flex-start;
    gap: .4rem;
}
.fest-webcal-panel__warning i { flex-shrink: 0; margin-top: .1rem; }

@media (max-width: 560px) {
    .fest-webcal-url-row { flex-direction: column; align-items: stretch; }
    .fest-webcal-panel__actions { flex-direction: column; align-items: flex-start; }
    .fest-webcal-panel__hint { display: none; }
}

/* ---------------------------------------------------------------------------
   5) Animations
   --------------------------------------------------------------------------- */
@keyframes fest-pop { 0%,100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-3px) rotate(4deg); } }
@keyframes fest-float { 0%,100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-16px) rotate(6deg); } }
@keyframes fest-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

@media (prefers-reduced-motion: reduce) {
    body.is-festivites .site-header .brand-mark,
    body.festif-public .site-header .brand-mark,
    body.festif-public .hero-emoji,
    body.festif-public .fest-marquee__track { animation: none; }
    body.festif-public .content-card, body.festif-public .bento-card, body.festif-public .button.primary { transition: none; }
}

/* ─────────────────────────────────────────────
   Messages flash lisibles sur le thème festif
   (le fond est sombre et la couleur de texte par défaut est claire :
   on force un fond clair + texte foncé à fort contraste).
   ───────────────────────────────────────────── */
body.festif-public .flash,
body.is-festivites .flash {
    font-weight: 600;
    border: 1px solid rgba(0, 0, 0, 0.12);
}
body.festif-public .flash-success,
body.is-festivites .flash-success {
    background: #d8f7e4;
    color: #0d4a2b;
    border-color: rgba(13, 74, 43, 0.25);
}
body.festif-public .flash-warning,
body.is-festivites .flash-warning {
    background: #fff2c2;
    color: #6b4e00;
    border-color: rgba(107, 78, 0, 0.3);
}
body.festif-public .flash-error,
body.is-festivites .flash-error {
    background: #ffd9dd;
    color: #8a0f1e;
    border-color: rgba(138, 15, 30, 0.3);
}

/* ===========================================================================
   5) Optimisation mobile & iOS (vitrine + back-office)
   Le socle global (styles.css) gère déjà .table-wrap, les cibles 44px et les
   safe-area. On complète ici ce qui est propre aux Festivités.
   =========================================================================== */

/* Grille de formulaire 2 colonnes, repliée sur 1 colonne en téléphone.
   Remplace les `display:grid;grid-template-columns:1fr 1fr` posés en ligne
   (qui, eux, ne pouvaient pas se replier). */
.fest-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 560px) {
    .fest-form-grid { grid-template-columns: 1fr; }
}

/* iOS Safari zoome au focus si la police d'un champ est < 16px. Les pages
   festivités utilisent .form-control (0.95rem) : on force 16px sous 640px. */
@media (max-width: 640px) {
    body.is-festivites :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control),
    body.festif-public :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control) {
        font-size: 16px;
    }
}

/* Encoche iOS : on étend les marges de sécurité à la barre collante et au pied
   de la vitrine sombre (mode paysage avec notch, bord arrondi). */
@supports (padding: max(0px)) {
    body.festif-public .site-header .topbar {
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
    }
    body.festif-public .site-footer {
        padding-bottom: max(0px, env(safe-area-inset-bottom));
    }
}

/* Vitrine — en-tête en flex explicite : marque à gauche, puis le groupe de
   liens (catalogue, puis profil) poussé à droite. On évite ainsi l'auto-
   placement de la grille `.topbar` globale qui renvoyait la marque à droite. */
body.festif-public .site-header .topbar {
    display: flex;
    align-items: center;
    gap: .75rem;
}
body.festif-public .site-header .brand { margin-right: auto; }
body.festif-public .topbar-nav {
    display: flex;
    align-items: center;
    gap: .75rem;
}
/* Le CTA n'a plus besoin de se pousser lui-même : le groupe est déjà à droite. */
body.festif-public .topbar-nav .header-cta { margin-left: 0; }
/* Lien « Mon compte » réduit à l'icône : la rendre plus grande et bien centrée. */
body.festif-public .header-link { display: inline-flex; align-items: center; line-height: 1; }
body.festif-public .header-link i { font-size: 1.75rem; }

@media (max-width: 640px) {
    /* Vitrine — en-tête : laisser les liens passer sous la marque si l'espace
       manque, plutôt que de déborder ou de rogner le CTA. */
    body.festif-public .site-header .topbar { flex-wrap: wrap; row-gap: .45rem; }
    body.festif-public .topbar-nav { gap: .5rem; flex-wrap: wrap; }
    body.festif-public .header-link { font-size: .85rem; }
    body.festif-public .header-cta { padding: .5rem .9rem; font-size: .85rem; }

    /* Cartes « offres » (bento) : les images décoratives débordent sur les côtés
       et ne sont visibles qu'en sliver une fois rognées sur téléphone. On les
       masque et on laisse le panneau se compacter (au lieu d'un grand carré). */
    body.festif-public .bento-card__img { display: none; }
    body.festif-public .bento-card__panel {
        aspect-ratio: auto; min-height: 7rem; overflow: hidden;
    }
    /* Sans image, chaque carte devient un aplat plat et monotone : on redonne du
       caractère avec un emoji festif décoratif en filigrane (cycle de 4, calé sur
       le cycle de couleurs, comme dans le hero). */
    body.festif-public .bento-card__panel::after {
        position: absolute; right: .5rem; bottom: .2rem;
        font-size: 3.4rem; line-height: 1; opacity: .26; pointer-events: none;
    }
    body.festif-public .bento-card:nth-child(4n+1) .bento-card__panel::after { content: "🎈"; }
    body.festif-public .bento-card:nth-child(4n+2) .bento-card__panel::after { content: "🎉"; }
    body.festif-public .bento-card:nth-child(4n+3) .bento-card__panel::after { content: "🎪"; }
    body.festif-public .bento-card:nth-child(4n)   .bento-card__panel::after { content: "🎂"; }

    /* Hero : les emojis flottants du bas chevauchaient le titre/les boutons sur
       écran étroit ; on les retire et on écarte ceux du haut. */
    body.festif-public .hero-emoji.e3,
    body.festif-public .hero-emoji.e4 { display: none; }
    body.festif-public .hero-emoji.e1 { left: 3%; top: 6%; }
    body.festif-public .hero-emoji.e2 { right: 3%; top: 4%; }
    body.festif-public .hero-actions { flex-direction: column; }
    body.festif-public .hero-actions .button { width: 100%; }

    /* Étapes : les numéros restent lisibles, padding réduit. */
    body.festif-public .step { padding: 1.2rem; }

    /* Tables denses du back-office : compacter pour limiter le défilement
       horizontal (elles restent dans .table-wrap si ça déborde). */
    body.is-festivites .data-table { font-size: .85rem; }
    body.is-festivites .data-table :is(th, td) { padding: .5rem .55rem; }

    /* Actions par ligne : boutons confortables qui passent à la ligne. */
    body.is-festivites .fest-row-actions .button,
    body.is-festivites .data-table td .button { min-height: 38px; }
}

/* Cibles tactiles agrandies sur écrans sans souris (calendrier, chips, popup). */
@media (pointer: coarse) {
    .fest-cal__nav { width: 2.5rem; height: 2.5rem; }
    .fest-avail-chip__del,
    .fest-popup__close { min-width: 2rem; min-height: 2rem; }
    .fest-img-tile__star,
    .fest-img-tile__delete { width: 32px; height: 32px; }
}

/* Disposition admin disponibilités : calendrier + panneau d'heures empilés et
   pleine largeur sur téléphone (au lieu de se serrer côte à côte). */
@media (max-width: 640px) {
    .fest-avail-layout { gap: 1rem; }
    .fest-avail-layout > div:first-child,
    .fest-hours-panel { flex: 1 1 100%; max-width: 100%; }
    .fest-cal { max-width: 100%; }
    /* Roues d'heures iOS : centrées plutôt que collées à gauche. */
    .fest-timewheels { justify-content: center; }
}

/* Popup de créneaux : occupe presque tout l'écran sur téléphone. */
@media (max-width: 560px) {
    .fest-popup { width: 100%; border-radius: 16px 16px 0 0; }
    .fest-popup__overlay { align-items: flex-end; padding: 0; }
}

/* ---------------------------------------------------------------------------
   Rapports Festifun (rendement `festival_rapport.html` + réconciliation
   d'inventaire `festival_reconciliation.html`). Lisibilité mobile/iOS :
   tuiles KPI fluides, tables défilantes, actions empilées, cibles 44px, print.
   Portée `.fest-report` (posée sur le <section> racine des deux pages).
   --------------------------------------------------------------------------- */
.fest-report-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}
/* Les tables du rapport défilent horizontalement dans .table-wrap (patron admin
   global : `inline-size: max-content` sur la table). On garde les EN-TÊTES sur
   une seule ligne pour éviter le repli illisible (« VENTE / S ») et déclencher
   un vrai scroll horizontal ; les cellules de noms, elles, se replient toujours.
   La classe `.data-table` sur la table nous fait passer devant la règle globale
   `.is-admin .content-card .table-wrap th` (même nb de classes + festivites.css
   chargé après → priorité), sans recourir à !important. */
.fest-report .content-card .table-wrap table.data-table th { white-space: nowrap; }

/* En-tête de ligne (comparatif journalier : « Ventes », « Transactions »…) :
   non tronqué, l'icône Phosphor alignée sur le libellé. */
.fest-daily-table th[scope="row"] { white-space: nowrap; }
.fest-daily-table th[scope="row"] i { margin-right: .3rem; color: var(--fest-pink, #ff4d8d); }

/* Par mode de paiement : icône + libellé, et barre de part (%) alignée à droite. */
.fest-payment-table .fest-pay-mode { display: inline-flex; align-items: center; gap: .45rem; }
.fest-payment-table .fest-pay-icon { font-size: 1.15rem; color: var(--fest-pink, #ff4d8d); flex: 0 0 auto; }
.fest-payment-table .fest-pay-share { display: flex; align-items: center; gap: .5rem; min-width: 130px; }
.fest-payment-table .fest-pay-bar {
    position: relative;
    flex: 1 1 auto;
    height: .5rem;
    min-width: 48px;
    border-radius: 999px;
    background: var(--line, rgba(0,0,0,.08));
    overflow: hidden;
}
.fest-payment-table .fest-pay-bar > span {
    position: absolute;
    inset: 0 auto 0 0;
    height: 100%;
    border-radius: 999px;
    background: var(--fest-grad, var(--fest-pink, #ff4d8d));
}
.fest-payment-table .fest-pay-pct {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    color: var(--muted, #6b7280);
    min-width: 3.4rem;
    text-align: right;
}

/* Cibles tactiles iOS HIG (44px) sur les boutons d'action des rapports. */
@media (pointer: coarse) {
    .fest-report .page-header-actions .button,
    .fest-report .fest-report-actions .button,
    .fest-report .fest-report-actions button {
        min-height: 44px;
    }
}

@media (max-width: 640px) {
    /* KPIs : au moins deux tuiles par ligne sur téléphone (évite des tuiles
       étirées), une seule si l'écran est très étroit. */
    .fest-report-kpis { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem; }
    .fest-report-kpis .content-card { padding: .9rem .75rem; }

    /* Barres d'actions empilées pleine largeur (rafraîchir/export/réconcilier ;
       appliquer/annuler). La 1re action « Rafraîchir » est un <form> → l'étirer
       aussi pour qu'elle occupe toute la ligne comme les autres. */
    .fest-report-actions { width: 100%; }
    .fest-report-actions > * { flex: 1 1 100%; }
    .fest-report-actions form { display: flex; }
    .fest-report-actions form .button,
    .fest-report-actions .button { width: 100%; }
}

/* Impression : masquer les actions, aplatir les cartes pour une sortie papier
   nette (le bloc @media print plus bas masque déjà .site-header /
   .page-header-actions ; on complète ici pour le rapport). */
@media print {
    .fest-report-actions { display: none; }
    .fest-report .content-card { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
}

/* ===========================================================================
   OPÉRATIONS TERRAIN (food truck) — festivals, factures, notes, tâches,
   inventaire et scanner de factures. Préfixe .fest-* (back-office).
   =========================================================================== */

.fest-section-title { display:flex; align-items:center; gap:.5rem; margin:0 0 .9rem; font-size:1.15rem; }
.fest-section-title .ph { color:var(--fest-orange, #ff8a3d); }

/* Panneau de création repliable */
.fest-create__summary { display:flex; align-items:center; gap:.5rem; cursor:pointer; font-weight:600; list-style:none; }
.fest-create__summary::-webkit-details-marker { display:none; }
.fest-create__summary .ph { color:var(--fest-pink, #ff4d8d); font-size:1.25rem; }
.fest-create[open] .fest-create__summary { margin-bottom:.25rem; }
.fest-create--sub { border-top:1px dashed var(--line, rgba(0,0,0,.12)); padding-top:.75rem; }

/* Grilles de formulaire */
.fest-form-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:.85rem 1rem; }
.fest-form-grid--single { grid-template-columns:1fr; }
.fest-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
@media (max-width: 480px) {
    /* Colonnes trop étroites pour les libellés longs (« Quantité (unités
       finales) », « Seuil bas (minimum) »…) sur un très petit écran. */
    .fest-grid-2 { grid-template-columns:1fr; }
}

/* Filtres en « pilules » */
.fest-chips { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:1rem 0 1.25rem; }
.fest-chip { display:inline-flex; align-items:center; padding:.4rem .9rem; border-radius:999px;
    border:1px solid var(--line, rgba(0,0,0,.15)); background:var(--surface, #fff); color:var(--text, #2a1640);
    text-decoration:none; font-size:.9rem; font-weight:600; transition:transform .12s, background .12s; }
.fest-chip:hover { transform:translateY(-1px); }
.fest-chip.is-active { background:var(--fest-grad, #ff4d8d); color:#fff; border-color:transparent; }
.fest-chip-select .form-control { border-radius:999px; min-width:12rem; }

/* Badges de statut */
.fest-status { font-weight:700; }
.fest-status--planifie { background:rgba(99,102,241,.14); color:#4f46e5; }
.fest-status--confirme { background:rgba(16,185,129,.16); color:#0f9d6b; }
.fest-status--en_cours { background:rgba(255,138,61,.18); color:#d2691e; }
.fest-status--termine { background:rgba(0,0,0,.08); color:var(--muted, #6b7280); }
.fest-status--non_retenu { background:rgba(100,116,139,.16); color:#475569; }
.fest-status--annule  { background:rgba(220,38,38,.14); color:#dc2626; }
.fest-pay--due  { background:rgba(220,38,38,.14); color:#dc2626; font-weight:700; }
.fest-pay--paid { background:rgba(16,185,129,.16); color:#0f9d6b; font-weight:700; }

/* Cartes festival */
.fest-card-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:1rem; }

/* Section « En cours » : festivals en cours mis en avant au-dessus de la liste */
.fest-encours { margin-bottom:1.5rem; }
.fest-encours__title {
    display:flex; align-items:center; gap:.5rem;
    margin:0 0 .75rem; font-size:.92rem; font-weight:800;
    text-transform:uppercase; letter-spacing:.05em;
    color:#0f9d6b;
}
.fest-encours__pulse {
    width:.7rem; height:.7rem; border-radius:50%; flex-shrink:0;
    background:#16a34a;
    box-shadow:0 0 0 0 rgba(22,163,74,.5);
    animation:fest-encours-pulse 1.8s ease-out infinite;
}
@keyframes fest-encours-pulse {
    0% { box-shadow:0 0 0 0 rgba(22,163,74,.5); }
    70% { box-shadow:0 0 0 .55rem rgba(22,163,74,0); }
    100% { box-shadow:0 0 0 0 rgba(22,163,74,0); }
}
/* Léger accent vert sur les cartes en cours */
.fest-encours .fest-festival-card { box-shadow:0 0 0 1.5px rgba(22,163,74,.35); }
@media (prefers-reduced-motion: reduce) {
    .fest-encours__pulse { animation:none; }
}
.fest-festival-card { display:flex; flex-direction:column; gap:.35rem; transition:transform .14s, box-shadow .14s; }
.fest-festival-card:hover { transform:translateY(-3px); box-shadow:0 16px 36px rgba(42,22,64,.14); }
.fest-festival-card__head { display:flex; justify-content:space-between; align-items:flex-start; gap:.5rem; }
.fest-festival-card__title { font-size:1.1rem; font-weight:700; text-decoration:none; color:var(--text, #2a1640); }
.fest-festival-card__title:hover { color:var(--fest-pink, #ff4d8d); }
.fest-festival-card__meta { display:flex; align-items:center; gap:.4rem; margin:.1rem 0; color:var(--muted, #6b7280); font-size:.9rem; }
.fest-festival-card__actions { display:flex; gap:.5rem; align-items:center; margin-top:auto; padding-top:.6rem; }

/* Bilan */
.fest-balance { display:flex; gap:1.25rem; flex-wrap:wrap; padding-top:.5rem; }
.fest-balance > div { display:flex; flex-direction:column; }
.fest-balance__label { font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted, #6b7280); }
.fest-balance__val { font-weight:700; }
/* Bandeau bilan (fiche festival) : 3 segments icône + libellé + valeur */
.fest-balance-banner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    padding: 0;
    margin-bottom: 1.5rem;
    overflow: hidden;
    border-top: 4px solid var(--fest-accent, var(--brand, #e11d48));
}
.fest-balance__item {
    position: relative;
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: 1.15rem 1.4rem;
    min-width: 0;
}
/* Séparateur fin entre les segments */
.fest-balance__item + .fest-balance__item::before {
    content: "";
    position: absolute;
    left: 0; top: 20%; bottom: 20%;
    width: 1px;
    background: var(--line, rgba(0,0,0,.09));
}
.fest-balance__icon {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 2.6rem; height: 2.6rem;
    border-radius: 13px;
    font-size: 1.3rem;
    background: color-mix(in srgb, var(--fest-accent, #e11d48) 13%, transparent);
    color: var(--fest-accent, #e11d48);
}
.fest-balance__item--dep .fest-balance__icon {
    background: color-mix(in srgb, #dc2626 12%, transparent); color: #dc2626;
}
.fest-balance__item--rec .fest-balance__icon {
    background: color-mix(in srgb, #0f9d6b 13%, transparent); color: #0f9d6b;
}
.fest-balance__item--net .fest-balance__icon {
    background: color-mix(in srgb, var(--fest-accent, #e11d48) 14%, transparent);
    color: var(--fest-accent, #e11d48);
}
.fest-balance__body { display: flex; flex-direction: column; gap: .08rem; min-width: 0; }
.fest-balance-banner .fest-balance__label { font-weight: 600; letter-spacing: .06em; }
.fest-balance__value {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -.01em;
    white-space: nowrap;
}
.fest-balance__value--empty { color: var(--muted, #9ca3af); font-weight: 600; }
.fest-balance__hint { font-size: .68rem; color: var(--muted, #6b7280); line-height: 1.3; margin-top: .12rem; }
.fest-net--pos { color:#0f9d6b; }
.fest-net--neg { color:#dc2626; }

@media (max-width: 620px) {
    .fest-balance-banner { grid-template-columns: 1fr; }
    .fest-balance__item + .fest-balance__item::before {
        left: 1.4rem; right: 1.4rem; top: 0; bottom: auto;
        width: auto; height: 1px;
    }
}

/* Accès au rapport de rendement : carte-lien mise en évidence */
.fest-report-link {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: .85rem 1.1rem;
    margin-bottom: 1.25rem;
    text-decoration: none;
    color: inherit;
    border-left: 4px solid var(--fest-accent, var(--brand, #e11d48));
    transition: transform .14s ease, box-shadow .14s ease;
}
.fest-report-link:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(42,22,64,.13);
    text-decoration: none;
    color: inherit;
}
.fest-report-link__icon {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 2.6rem; height: 2.6rem;
    border-radius: 13px;
    font-size: 1.35rem;
    background: color-mix(in srgb, var(--fest-accent, #e11d48) 14%, transparent);
    color: var(--fest-accent, #e11d48);
}
.fest-report-link__text { display: flex; flex-direction: column; gap: .04rem; min-width: 0; flex: 1; }
.fest-report-link__title { font-weight: 700; font-size: 1.02rem; letter-spacing: -.01em; }
.fest-report-link__sub { font-size: .8rem; color: var(--muted, #6b7280); }
.fest-report-link__arrow {
    flex-shrink: 0;
    font-size: 1.15rem;
    color: var(--muted, #9ca3af);
    transition: transform .14s ease, color .14s ease;
}
.fest-report-link:hover .fest-report-link__arrow {
    transform: translateX(3px);
    color: var(--fest-accent, #e11d48);
}

/* Météo (festivites_weather) — badge prévision pour les festivals à venir */
.fest-weather { display:inline-flex; align-items:center; gap:.55rem; flex-wrap:wrap;
    padding:.3rem .6rem; border-radius:999px; font-size:.9rem; line-height:1;
    background:linear-gradient(135deg, rgba(56,189,248,.14), rgba(99,102,241,.12));
    border:1px solid rgba(56,189,248,.28); color:var(--text, #2a1640); width:max-content; max-width:100%; }
.fest-weather--compact { gap:.4rem; padding:.22rem .5rem; font-size:.82rem; margin:.15rem 0 .1rem; }
/* Badge cliquable vers un site météo : se comporte comme un bouton-lien discret. */
a.fest-weather--link { text-decoration:none; cursor:pointer; transition:border-color .15s, box-shadow .15s, background .15s; }
a.fest-weather--link:hover { border-color:rgba(56,189,248,.6); box-shadow:0 2px 8px rgba(56,189,248,.22); }
a.fest-weather--link:focus-visible { outline:2px solid #0284c7; outline-offset:2px; }
.fest-weather__ext { font-size:.78rem; color:#0369a1; opacity:.7; margin-left:.05rem; }
a.fest-weather--link:hover .fest-weather__ext { opacity:1; }
.fest-weather__icon { font-size:1.15rem; color:#0284c7; }
.fest-weather--compact .fest-weather__icon { font-size:1rem; }
.fest-weather__label { font-weight:600; }
.fest-weather__rain { display:inline-flex; align-items:center; gap:.2rem; color:#0369a1; font-weight:600; }
.fest-weather__rain .ph { font-size:.9rem; }
.fest-weather__temp { font-weight:700; color:var(--muted, #6b7280); }
.fest-weather-banner { display:flex; align-items:center; gap:.85rem; flex-wrap:wrap; margin-bottom:1rem; padding:.75rem 1rem; position:relative; }
/* Le popover horaire flotte via z-index:1500, MAIS les .content-card créent un
   contexte d'empilement (backdrop-filter) qui le piégeait sous la carte suivante
   (la ligne rouge le coupait). On élève la bannière entière pendant l'ouverture
   (survol / focus clavier / .is-open au tap) pour que le popover passe réellement
   au-dessus de tout le contenu qui suit. */
.fest-weather-banner:hover,
.fest-weather-banner:focus-within,
.fest-weather-banner:has(.fest-weather-hover.is-open) { z-index:1200; }
.fest-weather-banner__head { display:inline-flex; align-items:center; gap:.4rem; font-weight:700; color:var(--text, #2a1640); }
.fest-weather-banner__head .ph { font-size:1.2rem; color:#0284c7; }
/* Météo indisponible : avertissement discret, à la même place que le badge.
   Ton neutre/gris (pas d'alarme) + bulle (i) expliquant la cause. */
.fest-weather--unavailable { background:rgba(148,163,184,.12); border-color:rgba(148,163,184,.32);
    color:var(--muted, #6b7280); }
.fest-weather--unavailable .fest-weather__icon { color:#94a3b8; }
.fest-weather--unavailable .fest-weather__label { font-weight:600; color:var(--muted, #6b7280); }
.fest-weather--unavailable .help-tooltip__trigger { color:#94a3b8; }

/* Capsule météo « jour même » : dépliage horaire au survol (desktop) ou au tap
   sur l'horloge (mobile). Le panneau flotte AU-DESSUS du contenu (position
   absolute + z-index élevé) : il ne pousse jamais la mise en page, il la recouvre. */
.fest-weather-hover { position:relative; display:inline-block; }
.fest-weather-hover__badge { display:inline-flex; align-items:center; gap:.3rem; }
/* Icône-horloge : cible de tap distincte du badge (qui, lui, est un lien).
   Ouvre la prévision horaire au clic/tap/clavier ; sur desktop le survol suffit. */
.fest-weather-hover__toggle { display:inline-flex; align-items:center; justify-content:center;
    width:1.7rem; height:1.7rem; padding:0; border:1px solid rgba(56,189,248,.28);
    border-radius:999px; background:rgba(56,189,248,.10); color:#0369a1; cursor:pointer;
    font-size:.95rem; line-height:1; flex:0 0 auto;
    transition:background .2s ease, color .2s ease, transform .25s ease; }
/* L'horloge ne sert qu'aux appareils SANS survol (mobile/tactile) : sur desktop,
   le survol de la capsule ouvre déjà le popover → on masque l'horloge. */
@media (hover: hover) and (pointer: fine) {
    .fest-weather-hover__toggle { display:none; }
}
.fest-weather-hover__toggle:hover { background:rgba(56,189,248,.20); }
.fest-weather-hover__toggle:focus-visible { outline:2px solid #0284c7; outline-offset:2px; }
.fest-weather-hover:hover .fest-weather-hover__toggle,
.fest-weather-hover.is-open .fest-weather-hover__toggle {
    background:rgba(56,189,248,.24); color:#0284c7; transform:scale(1.06); }
/* Popover flottant : masqué (opacité 0 + léger décalage), révélé fluidement.
   Ouvert par le survol (desktop) OU la classe .is-open posée par le JS (tap/clavier). */
.fest-weather-hourly-wrap { position:absolute; top:calc(100% + .45rem); left:0; z-index:1500;
    min-width:100%; max-width:min(92vw, 640px);
    background:var(--surface, #fff); border:1px solid rgba(56,189,248,.28); border-radius:14px;
    box-shadow:0 16px 40px rgba(2,132,199,.22), 0 2px 8px rgba(0,0,0,.08);
    opacity:0; transform:translateY(-6px) scale(.98); transform-origin:top left; pointer-events:none;
    transition:opacity .2s ease, transform .26s cubic-bezier(.4,0,.2,1); }
/* Pont invisible : couvre l'espace badge↔popover pour que le survol ne « lâche »
   pas dans le vide entre les deux (desktop). */
.fest-weather-hourly-wrap::before { content:""; position:absolute; left:0; right:0; top:-.5rem; height:.5rem; }
.fest-weather-hover:hover .fest-weather-hourly-wrap,
.fest-weather-hover.is-open .fest-weather-hourly-wrap { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.fest-weather-hourly { overflow:hidden; border-radius:14px; }
.fest-weather-hourly__strip { display:flex; gap:.35rem; overflow-x:auto; padding:.6rem; scroll-behavior:smooth; }
.fest-weather-hourly__strip::-webkit-scrollbar { height:6px; }
.fest-weather-hourly__strip::-webkit-scrollbar-thumb { background:rgba(56,189,248,.35); border-radius:999px; }
.fest-hour { flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:.15rem;
    min-width:3.4rem; padding:.4rem .35rem; border-radius:10px;
    background:rgba(56,189,248,.07); border:1px solid rgba(56,189,248,.16); }
.fest-hour.is-now { background:linear-gradient(135deg, rgba(56,189,248,.22), rgba(99,102,241,.16));
    border-color:rgba(56,189,248,.55); box-shadow:0 0 0 1px rgba(56,189,248,.25) inset; }
.fest-hour__h { font-size:.7rem; color:var(--muted, #6b7280); white-space:nowrap; }
.fest-hour.is-now .fest-hour__h { color:#0369a1; font-weight:700; }
.fest-hour__icon { font-size:1.15rem; color:#0284c7; }
.fest-hour__rain { display:inline-flex; align-items:center; gap:.1rem; font-size:.7rem; color:#0369a1; font-weight:600; }
.fest-hour__rain .ph { font-size:.72rem; }
.fest-hour__temp { font-size:.82rem; font-weight:700; color:var(--text, #2a1640); }
@media (prefers-reduced-motion: reduce) {
    .fest-weather-hourly-wrap { transition:opacity .12s linear; transform:none; }
    .fest-weather-hover:hover .fest-weather-hourly-wrap,
    .fest-weather-hover.is-open .fest-weather-hourly-wrap { transform:none; }
    .fest-weather-hover__toggle { transition:background .12s linear, color .12s linear; }
    .fest-weather-hover:hover .fest-weather-hover__toggle,
    .fest-weather-hover.is-open .fest-weather-hover__toggle { transform:none; }
}

/* Mises en page deux colonnes */
.fest-two-col { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
@media (max-width:860px) { .fest-two-col { grid-template-columns:1fr; } }

/* Ajout en ligne (tâches / notes / mouvements) */
.fest-inline-add { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin-top:.75rem; }
.fest-inline-add .form-control { flex:1 1 8rem; }
.fest-inline-add--note { flex-direction:column; align-items:stretch; }
/* En colonne, le flex-basis 8rem s'applique à la hauteur : on le neutralise pour
   que le titre garde sa hauteur naturelle et que la note suive ses rows. */
.fest-inline-add--note .form-control { flex:0 0 auto; }

/* Tâches */
.fest-task-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.fest-task { display:flex; flex-direction:column; gap:.3rem; padding:.5rem 0; border-bottom:1px solid var(--line, rgba(0,0,0,.07)); }
.fest-task__main { display:flex; align-items:center; gap:.45rem; }
.fest-task__check { margin:0; display:flex; }
.fest-task__box { background:none; border:none; cursor:pointer; font-size:1.35rem; line-height:1; color:var(--muted, #9ca3af); padding:0; display:flex; align-items:center; }
.fest-task__box--on { color:#0f9d6b; }
/* Titre cliquable (ouvre l'éditeur) ; bouton remis à plat, aligné à gauche. */
.fest-task__label { flex:1; min-width:0; text-align:left; background:none; border:none; padding:.15rem 0; margin:0; font:inherit; color:inherit; cursor:pointer; word-break:break-word; white-space:normal; }
button.fest-task__label:hover { color:var(--fest-ink, #2a1640); }
.fest-task--done .fest-task__label { text-decoration:line-through; color:var(--muted, #9ca3af); }
.fest-task__meta { display:inline-flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.fest-task__due { font-size:.8rem; color:var(--muted, #6b7280); display:inline-flex; gap:.2rem; align-items:center; white-space:nowrap; }
.fest-task__pri { font-size:.7rem; font-weight:600; padding:.05rem .45rem; border-radius:1rem; white-space:nowrap; }
.fest-task__pri--1 { background:#fde2e1; color:#b42318; }
.fest-task__pri--5 { background:#fef0c7; color:#b54708; }
.fest-task__pri--9 { background:#e7eef7; color:#3b5b8c; }
.fest-task__ic { color:var(--muted, #6b7280); font-size:.95rem; display:inline-flex; text-decoration:none; }
.fest-task__ic:hover { color:var(--fest-ink, #2a1640); }
.fest-task__editpanel { padding:.35rem 0 .25rem 1.85rem; }
.fest-task__editform { display:flex; flex-direction:column; gap:.55rem; }

/* Enrichissement web (Tavily) — bouton fiche festival + modale de choix des champs. */
.fest-enrich { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.fest-enrich__status { font-size:.82rem; color:var(--muted, #6b7280); }
.fest-enrich-modal { position:fixed; inset:0; z-index:60; display:flex; align-items:center; justify-content:center; background:rgba(20,8,32,.45); padding:1rem; }
.fest-enrich-modal__panel { background:#fff; border-radius:1rem; max-width:520px; width:100%; padding:1.2rem 1.3rem; box-shadow:0 12px 40px rgba(0,0,0,.25); max-height:88vh; overflow-y:auto; }
.fest-enrich-rows { display:flex; flex-direction:column; gap:.5rem; margin:.6rem 0; }
.fest-enrich-row { display:grid; grid-template-columns:6.5rem 1fr auto; gap:.15rem .6rem; padding:.5rem .6rem; border:1px solid var(--line, rgba(0,0,0,.08)); border-radius:.6rem; align-items:center; }
.fest-enrich-row__lbl { grid-row:1 / span 2; font-weight:700; align-self:center; }
.fest-enrich-row__cur { grid-column:2; font-size:.82rem; color:var(--muted, #6b7280); }
.fest-enrich-row__new { grid-column:2; font-size:.9rem; color:var(--fest-ink, #2a1640); font-weight:600; }
.fest-enrich-row__apply { grid-column:3; grid-row:1 / span 2; align-self:center; white-space:nowrap; }
.fest-enrich-row__apply.is-done { color:#0f9d6b; border-color:#0f9d6b; background:transparent; }
.fest-enrich-actions { display:flex; gap:.5rem; justify-content:flex-end; flex-wrap:wrap; margin-top:1rem; }
/* Modale d'enrichissement à deux temps : choix puis confirmation cochable. */
.fest-enrich-choices { display:flex; flex-direction:column; gap:.5rem; margin:.4rem 0; }
.fest-enrich-choice { display:flex; align-items:flex-start; gap:.6rem; padding:.6rem .7rem; border:1px solid var(--line, rgba(0,0,0,.08)); border-radius:.6rem; cursor:pointer; }
.fest-enrich-choice:hover { background:rgba(0,0,0,.03); }
.fest-enrich-choice input { margin-top:.2rem; }
.fest-enrich-choice__txt { display:flex; flex-direction:column; gap:.1rem; }
.fest-enrich-choice__txt .muted { font-size:.82rem; }
.fest-enrich-section { margin:.8rem 0 .2rem; }
.fest-enrich-section h4 { margin:0 0 .4rem; font-size:.82rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted, #6b7280); }
.fest-enrich-item { display:flex; align-items:flex-start; gap:.6rem; padding:.5rem .6rem; border:1px solid var(--line, rgba(0,0,0,.08)); border-radius:.6rem; margin-bottom:.4rem; cursor:pointer; }
.fest-enrich-item:hover { background:rgba(0,0,0,.03); }
.fest-enrich-item input { margin-top:.25rem; }
.fest-enrich-item__body { display:flex; flex-direction:column; gap:.12rem; min-width:0; }
.fest-enrich-item__lbl { font-weight:700; }
.fest-enrich-item__cur { font-size:.8rem; color:var(--muted, #6b7280); }
.fest-enrich-item__new { font-size:.9rem; color:var(--fest-ink, #2a1640); font-weight:600; }
.fest-enrich-item__corps { font-size:.85rem; color:var(--fest-ink, #2a1640); white-space:normal; }
.fest-enrich-sub { margin:.25rem 0 0; padding-left:1.1rem; font-size:.83rem; color:var(--fest-ink, #2a1640); }
.fest-enrich-sub li { margin:.05rem 0; }
.fest-enrich-tag { display:inline-block; font-size:.7rem; font-weight:700; padding:.05rem .4rem; border-radius:.5rem; background:rgba(0,0,0,.06); color:var(--muted, #6b7280); vertical-align:middle; }
.fest-enrich-tag.is-ok { background:rgba(15,157,107,.12); color:#0f9d6b; }
.fest-icon-btn { background:none; border:none; cursor:pointer; color:var(--muted, #9ca3af); font-size:1.1rem; padding:.2rem; border-radius:8px; display:flex; }
.fest-icon-btn:hover { color:var(--danger, #dc2626); background:rgba(0,0,0,.05); }

/* Notes */
.fest-note-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:.75rem; }
.fest-note { background:var(--fest-yellow, #fff7d6); border-radius:14px; padding:.75rem .85rem; box-shadow:0 4px 12px rgba(42,22,64,.07); }
.fest-note--pinned { outline:2px solid var(--fest-orange, #ff8a3d); }
.fest-note__head { display:flex; justify-content:space-between; align-items:center; gap:.3rem; }
.fest-note__head .fest-note__edit { flex:1; min-width:0; }
.fest-note__tools { display:flex; gap:.1rem; flex:0 0 auto; }
.fest-note__tools .fest-icon-btn:hover { color:var(--fest-ink, #2a1640); }
/* Épingle active : la police Phosphor « fill » n'est pas chargée en back-office, on
   signale donc l'épinglage par la couleur orange + une pastille (au lieu de l'icône pleine). */
.fest-note__tools .fest-icon-btn.is-pinned { color:var(--fest-orange, #ff8a3d); background:rgba(255,138,61,.16); }
.fest-note__tools .fest-icon-btn.is-pinned:hover { color:var(--fest-orange, #ff8a3d); background:rgba(255,138,61,.28); }
/* Champs d'édition en place : se fondent dans la carte (pas de bordure ni fond). */
.fest-note__title-input { width:100%; border:none; outline:none; background:transparent; padding:0; margin:0; font-family:inherit; font-size:.98rem; font-weight:700; line-height:1.3; color:var(--fest-ink, #2a1640); resize:none; overflow:hidden; overflow-wrap:anywhere; word-break:break-word; field-sizing:content; min-height:1.3em; }
.fest-note__title-input::placeholder { color:var(--muted, #6b7280); font-weight:500; }
.fest-note__title-input:read-only { cursor:default; }
/* La hauteur du champ épouse le texte (field-sizing: content) : pas de zone vide ni
   de scroll interne ; repli sur rows="1" si le navigateur ne gère pas field-sizing. */
.fest-note__body-input { width:100%; border:none; outline:none; resize:vertical; background:transparent; margin:.35rem 0; padding:0; font:inherit; font-size:.92rem; color:var(--fest-ink, #2a1640); overflow-wrap:anywhere; word-break:break-word; field-sizing:content; min-height:1.3em; }
.fest-note__body-input::placeholder { color:var(--muted, #6b7280); }
.fest-note__body-input:read-only { cursor:default; resize:none; }
/* Sources d'une note : favicons cliquables plutôt que de longues URL. */
.fest-note__sources { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin:.45rem 0 .15rem; }
.fest-note__sources-lbl { font-size:.72rem; font-weight:600; color:var(--muted, #6b7280); margin-right:.1rem; }
.fest-note__src { width:1.7rem; height:1.7rem; border-radius:.5rem; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; background:rgba(42,22,64,.06); border:1px solid rgba(42,22,64,.12); color:var(--muted, #6b7280); text-decoration:none; font-size:1rem; }
.fest-note__src:hover { background:rgba(255,138,61,.16); border-color:var(--fest-orange, #ff8a3d); }
.fest-note__src-ico { width:1rem; height:1rem; border-radius:.2rem; display:block; }
.fest-note__date { font-size:.72rem; margin:0; }

/* ── Modèles de listes de tâches (page de gestion) ───────────────────────── */
.fest-tpl-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 640px), 1fr)); gap:1rem; }
.fest-tpl { display:flex; flex-direction:column; gap:.6rem; }
.fest-tpl--auto { border-left:4px solid var(--fest-orange, #ff8a3d); }
.fest-tpl__head { display:flex; align-items:center; gap:.4rem; }
.fest-tpl__name-form { flex:1; min-width:0; display:flex; align-items:center; gap:.4rem; }
.fest-tpl__name-form .ph { color:var(--fest-orange, #ff8a3d); flex:0 0 auto; }
.fest-tpl__name { font-weight:700; }
.fest-tpl__auto { margin:0; }
.fest-tpl__items { display:flex; flex-direction:column; }
.fest-tpl-item { display:flex; align-items:center; gap:.25rem; padding:.1rem 0; border-bottom:1px solid rgba(42,22,64,.06); }
.fest-tpl-item:last-child { border-bottom:0; }
.fest-tpl-item__edit { flex:1; min-width:0; display:flex; align-items:center; gap:.4rem; }
/* Le libellé se lit comme du texte ; encadré seulement au survol / à l'édition */
.fest-tpl-item__label { flex:1 1 auto; min-width:0; font-weight:500; border-color:transparent; background:transparent; box-shadow:none; padding:.35rem .4rem; }
.fest-tpl-item__label:hover { background:rgba(42,22,64,.04); }
.fest-tpl-item__label:focus { background:#fff; border-color:var(--fest-orange, #ff8a3d); box-shadow:0 0 0 3px rgba(255,138,61,.15); }
/* Échéance + priorité : masquées par défaut, révélées au survol/focus ou si renseignées */
.fest-tpl-item__offset { display:none; align-items:center; gap:.2rem; font-size:.78rem; color:var(--muted, #6b7280); flex:0 0 auto; }
.fest-tpl-item__offset input { width:2.8rem; text-align:center; padding-left:.25rem; padding-right:.25rem; }
.fest-tpl-item__prio { display:none; flex:0 0 auto; width:auto; min-width:5.5rem; font-size:.82rem; }
.fest-tpl-item:hover .fest-tpl-item__offset,
.fest-tpl-item:focus-within .fest-tpl-item__offset,
.fest-tpl-item--meta .fest-tpl-item__offset { display:inline-flex; }
.fest-tpl-item:hover .fest-tpl-item__prio,
.fest-tpl-item:focus-within .fest-tpl-item__prio,
.fest-tpl-item--meta .fest-tpl-item__prio { display:inline-block; }
/* Corbeille discrète : apparaît au survol / focus de la ligne */
.fest-tpl-item > form:last-child { flex:0 0 auto; }
.fest-tpl-item .fest-icon-btn { opacity:0; transition:opacity .15s ease; }
.fest-tpl-item:hover .fest-icon-btn,
.fest-tpl-item:focus-within .fest-icon-btn { opacity:1; }
.fest-tpl__additem { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; margin-top:.35rem; padding-top:.55rem; border-top:1px dashed rgba(42,22,64,.14); }
.fest-tpl__additem .form-control[name="label"] { flex:1 1 100%; }
.fest-tpl__additem .fest-tpl-item__offset,
.fest-tpl__additem .fest-tpl-item__prio { display:inline-flex; }
.fest-tpl__additem .fest-tpl-item__prio { flex:1 1 auto; min-width:5rem; }
.fest-tpl__additem .button.primary { flex:0 0 auto; margin-left:auto; }
.fest-apply-template { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; margin-top:.6rem; }
.fest-apply-template__lbl { display:inline-flex; align-items:center; gap:.3rem; font-weight:600; font-size:.88rem; color:var(--fest-ink, #2a1640); }
.fest-apply-template select { width:auto; min-width:9rem; }

/* ── Onglet Logistique (équipe · hébergement · transport · installation) ──── */
.fest-logi-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:1rem; align-items:start; }
.fest-logi__transport { grid-column:1 / -1; }
.fest-logi__h { display:flex; align-items:center; gap:.45rem; font-size:1.02rem; margin:0 0 .75rem; }
.fest-logi__h .ph { color:var(--fest-orange, #ff8a3d); }
/* Équipe */
.fest-staff-list { display:flex; flex-direction:column; gap:.4rem; }
.fest-staff { display:flex; align-items:center; gap:.4rem; }
.fest-staff__edit { flex:1; min-width:0; display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.fest-staff__nom { flex:1 1 7rem; min-width:6rem; font-weight:600; }
.fest-staff__tel { flex:1 1 7rem; min-width:6rem; }
.fest-staff__shift { flex:1 1 8rem; min-width:6rem; }
.fest-staff__tools { display:flex; gap:.1rem; flex:0 0 auto; }
.fest-staff-add { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; margin-top:.6rem; padding-top:.6rem; border-top:1px dashed rgba(42,22,64,.14); }
.fest-staff-add .form-control { flex:1 1 7rem; min-width:6rem; }
/* Contacts d'un festival : même patron que l'équipe, avec rôle + courriel. */
.fest-contact__role { flex:1 1 7rem; min-width:6rem; }
.fest-contact__mail { flex:1 1 9rem; min-width:7rem; }
/* Planification pourboire d'un membre : jours travaillés (puces cochables) + toggle. */
.fest-staff__sched { flex:1 1 100%; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.fest-staff__days { display:flex; gap:.25rem; flex-wrap:wrap; }
.fest-daychip { display:inline-flex; align-items:center; cursor:pointer; padding:.15rem .5rem; border-radius:999px; border:1px solid rgba(42,22,64,.2); font-size:.8rem; line-height:1.2; color:#5b4b6e; background:#fff; user-select:none; }
.fest-daychip input { position:absolute; opacity:0; width:0; height:0; }
.fest-daychip.is-on,
.fest-daychip:has(input:checked) { background:var(--fest-accent,#e11d48); border-color:var(--fest-accent,#e11d48); color:#fff; }
.fest-daychip:has(input:focus-visible) { outline:2px solid var(--fest-accent,#e11d48); outline-offset:1px; }
.fest-staff__tips { margin-left:auto; }
/* Adresse précise d'itinéraire (override du lieu pour le routage). */
.fest-transport-addr { margin-bottom:.85rem; }
.fest-transport-addr__row { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.fest-transport-addr__row .form-control { flex:1 1 16rem; }
.fest-transport-addr__hint { font-size:.78rem; margin:.3rem 0 0; }
/* Transport : un bloc par trajet (base→festival, coucher→festival). */
.fest-transport-legs { display:flex; flex-direction:column; gap:.5rem; margin-bottom:.75rem; }
.fest-transport-leg { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.fest-transport-leg__from { display:inline-flex; align-items:center; gap:.4rem; font-weight:600; font-size:.9rem; color:var(--fest-ink, #2a1640); min-width:9.5rem; }
.fest-transport-dot { width:.7rem; height:.7rem; border-radius:50%; flex:0 0 auto; }
.fest-transport__badge { display:inline-flex; align-items:center; gap:.35rem; font-weight:700; font-size:1.05rem;
    padding:.25rem .65rem; border-radius:999px; color:#b91c1c;
    background:linear-gradient(135deg, rgba(244,63,94,.14), rgba(244,63,94,.08)); border:1px solid rgba(244,63,94,.28); }
.fest-transport__badge--alt { color:#1d4ed8; background:linear-gradient(135deg, rgba(37,99,235,.14), rgba(37,99,235,.08)); border-color:rgba(37,99,235,.28); }
.fest-transport__dist { display:inline-flex; align-items:center; gap:.3rem; font-weight:600; color:var(--muted, #6b7280); }
.fest-map { height:320px; width:100%; border-radius:12px; overflow:hidden; border:1px solid rgba(42,22,64,.14); background:#eef2f7; }
.fest-map--3d { height:380px; }
.fest-map .maplibregl-map { height:100%; width:100%; font:inherit; }
.fest-map .maplibregl-ctrl-attrib { font-size:.68rem; }

/* GPS : « Démarrer la navigation » → ouvre l'appli native du téléphone. */
.fest-nav { display:flex; flex-direction:column; gap:.5rem; margin-bottom:.85rem; }
.fest-nav__go { align-self:flex-start; font-weight:700; }
.fest-nav__go .ph { font-size:1.1em; }
.fest-nav__apps { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.fest-nav__hint { font-size:.82rem; }
.fest-nav__app { display:inline-flex; align-items:center; gap:.3rem; padding:.28rem .6rem; border-radius:999px;
    font-size:.85rem; font-weight:600; text-decoration:none; color:var(--fest-ink, #2a1640);
    background:rgba(42,22,64,.05); border:1px solid rgba(42,22,64,.14); }
.fest-nav__app:hover { background:rgba(42,22,64,.09); }

/* Statistiques */
.fest-stat-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:1rem; }
.fest-stat__value { font-size:1.8rem; font-weight:800; margin:.2rem 0 0; }

/* Dépenses */
.fest-expense-list { display:flex; flex-direction:column; }
.fest-expense { border-bottom:1px solid var(--line, rgba(0,0,0,.08)); }
.fest-expense__summary { display:flex; align-items:center; gap:.75rem; padding:.7rem .25rem; cursor:pointer; list-style:none; }
.fest-expense__summary::-webkit-details-marker { display:none; }
.fest-expense__thumb { width:42px; height:42px; border-radius:10px; overflow:hidden; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    background:rgba(0,0,0,.05); color:var(--muted, #9ca3af); font-size:1.3rem; }
.fest-expense__thumb img { width:100%; height:100%; object-fit:cover; }
.fest-expense__main { flex:1; min-width:0; display:flex; flex-direction:column; }
.fest-expense__vendor { font-weight:600; }
.fest-expense__sub { font-size:.82rem; }
.fest-expense__amount { font-weight:700; white-space:nowrap; }
.fest-expense__body { padding:.5rem .25rem 1rem; }
.fest-expense__foot { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-top:.5rem; }
.fest-expense__link { font-size:.85rem; }
.fest-scan-preview { font-size:.85rem; color:#0f9d6b; }
.fest-link-btn { background:none; border:none; padding:0; color:var(--fest-pink, #ff4d8d); cursor:pointer; font:inherit; text-decoration:underline; }

/* Lignes itémisées d'une facture (articles lus au scan, rapprochés à l'inventaire). */
.fest-expense__lines { margin-top:.6rem; padding-top:.5rem; border-top:1px dashed rgba(0,0,0,.12); }
.fest-expense__lines-title { margin:0 0 .35rem; font-size:.78rem; display:flex; align-items:center; gap:.35rem; }
.fest-expense__lines-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.25rem; }
.fest-expense__lines-list li { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:.85rem; }
.fest-expense__line-name { font-weight:600; }

/* Inventaire (assez large pour les sous-grilles à 2 colonnes du formulaire
   d'édition — « Quantité (unités finales) »/« Unité finale », etc. — sans
   que leurs libellés ne s'enroulent sur plusieurs lignes). */
.fest-inv-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:1rem; }
.fest-inv { display:flex; flex-direction:column; gap:.25rem; }
.fest-inv--low { outline:2px solid rgba(220,38,38,.35); }
.fest-inv__head { display:flex; justify-content:space-between; align-items:flex-start; gap:.5rem; }
.fest-inv__name { margin:0; font-size:1.05rem; }
.fest-inv__qty { display:flex; align-items:baseline; gap:.35rem; }
.fest-inv__qty-val { font-size:1.9rem; font-weight:800; }
.fest-inv__qty-unit { color:var(--muted, #6b7280); }
.fest-inv__controls { display:flex; align-items:center; gap:.4rem; margin-top:.5rem; flex-wrap:wrap; }
.fest-inv__step-form { display:flex; gap:.3rem; align-items:center; }
.fest-step-btn { width:40px; height:40px; border-radius:12px; border:1px solid var(--line, rgba(0,0,0,.15)); background:var(--surface, #fff);
    cursor:pointer; font-size:1.2rem; display:flex; align-items:center; justify-content:center; }
.fest-step-btn:hover { background:var(--fest-grad, #ff4d8d); color:#fff; border-color:transparent; }
.fest-inv__edit { margin-top:.6rem; }
.fest-inv__edit summary { list-style:none; }

/* Alerte stock bas */
.fest-alert { display:flex; align-items:center; gap:.6rem; padding:.8rem 1rem; border-radius:14px; margin-bottom:1.25rem;
    background:rgba(255,138,61,.14); color:#b45309; font-weight:600; }
.fest-alert .ph { font-size:1.3rem; }

/* Valeur totale du stock (carte résumé inventaire) */
.fest-inv-summary { display:flex; align-items:center; gap:.6rem; padding:.7rem 1rem; margin-bottom:1.25rem; font-size:1rem; }
.fest-inv-summary .ph { font-size:1.35rem; color:var(--fest-pink, #ff4d8d); }
.fest-inv-summary strong { font-weight:800; }
/* Achat / réapprovisionnement chiffré */
.fest-inv__restock summary { color:var(--fest-pink, #ff4d8d); font-weight:600; }

/* Cartes de recette : plus larges que l'inventaire (nom + qté + suppr. sur une ligne). */
.fest-recipe-grid { grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); }

/* Composants d'une recette (cartes étroites : la ligne s'adapte sans écraser le nom) */
.fest-recipe__components { list-style:none; padding:0; margin:.5rem 0; }
.fest-recipe-comp { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem .5rem;
    padding:.45rem 0; border-bottom:1px solid var(--line, rgba(0,0,0,.06)); }
.fest-recipe-comp:last-child { border-bottom:none; }
/* Le nom prend la place restante mais ne descend pas sous sa base : au lieu de
   s'enrouler lettre par lettre, il repousse les contrôles sur la ligne suivante. */
.fest-recipe-comp__name { flex:0 1 auto; min-width:0; font-weight:500; overflow-wrap:anywhere; }
/* Contrôles (qté + suppression) groupés et collés à droite : s'ils ne tiennent
   pas sur la ligne du nom, ils basculent ensemble en dessous (jamais le × seul). */
.fest-recipe-comp__controls { display:flex; align-items:center; gap:.4rem; margin-left:auto; flex:0 0 auto; }
.fest-recipe-comp__qty { display:flex; align-items:center; gap:.3rem; }
.fest-recipe-comp__qty input { width:4.5rem; text-align:right; }
.fest-recipe-comp__unit { color:var(--muted, #6b7280); white-space:nowrap; }
/* Bouton de suppression compact (icône seule) : plus de « grosse pastille ». */
.fest-icon-btn { flex:0 0 auto; width:34px; height:34px; padding:0; border-radius:10px;
    display:inline-flex; align-items:center; justify-content:center; font-size:1rem; line-height:1; }
/* Ajout d'un composant : passe en colonne dans une carte étroite. */
.fest-recipe-comp-add { display:flex; gap:.4rem; align-items:flex-end; margin-top:.5rem; flex-wrap:wrap; }
.fest-recipe-comp-add .fest-recipe-comp-add__item { flex:1 1 8rem; min-width:0; margin:0; }
.fest-recipe-comp-add .fest-recipe-comp-add__qty { margin:0; }
.fest-recipe-comp-add .fest-recipe-comp-add__qty input { width:4.5rem; text-align:right; }
.fest-recipe-comp-add .fest-recipe-comp-add__unit { margin:0; flex:0 1 10rem; min-width:8rem; }

/* Création manuelle d'une réservation (back-office) */
.fest-fieldset { border:1px solid var(--line, rgba(0,0,0,.1)); border-radius:12px; padding:1rem 1.1rem; margin:0; }
.fest-fieldset legend { padding:0 .4rem; font-weight:700; font-size:.95rem; }
.fest-fieldset .req { color:#dc2626; }
.fest-resa-line { border:1px solid var(--line, rgba(0,0,0,.08)); border-radius:10px; padding:.7rem; margin-bottom:.7rem; }
.fest-resa-line__head { display:grid; grid-template-columns:2fr 0.7fr auto; gap:.6rem; align-items:end; }
.fest-resa-line .form-group { margin:0; }
.fest-resa-line__del { align-self:end; height:fit-content; }
@media (max-width: 640px) {
    .fest-resa-line__head { grid-template-columns:1fr auto; }
    .fest-resa-line__item { grid-column:1 / -1; }
}
/* Config de ligne (options, champs, créneaux) chargée en AJAX */
.fest-line-cfg:not(:empty) { margin-top:.7rem; padding-top:.6rem; border-top:1px dashed var(--line, rgba(0,0,0,.12)); display:flex; flex-direction:column; gap:.7rem; }
.fest-line-cfg__group { border:1px solid var(--line, rgba(0,0,0,.1)); border-radius:8px; padding:.5rem .7rem; margin:0; }
.fest-line-cfg__group legend { font-weight:600; font-size:.88rem; padding:0 .3rem; }
.fest-line-cfg__group .req, .fest-fieldset .req { color:#dc2626; }
.fest-opt-collapse > summary { font-weight:600; font-size:.88rem; cursor:pointer; list-style:revert; }
.fest-opt-collapse[open] > summary { margin-bottom:.3rem; }
.fest-opt-collapse__body { display:flex; flex-direction:column; }
.fest-opt-row { display:flex; align-items:center; gap:.45rem; padding:.2rem 0; }
.fest-opt-row.is-out { opacity:.55; }
.fest-opt-qty { width:4.5rem; }
.fest-line-cfg__creneaux { display:flex; flex-wrap:wrap; gap:.4rem; }
.fest-cre-chip { display:inline-flex; align-items:center; gap:.35rem; border:1px solid var(--line, rgba(0,0,0,.18)); border-radius:999px; padding:.25rem .6rem; cursor:pointer; font-size:.88rem; }
.fest-cre-chip.is-out { opacity:.5; cursor:not-allowed; }
.fest-cre-chip input { margin:0; }
.fest-cre-open { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin-top:.5rem; font-size:.88rem; }
.fest-cre-time { width:auto; padding:.2rem .4rem; }
.fest-cre-open__msg { flex-basis:100%; }

/* Fournisseurs */
.fest-supplier--inactive { opacity:.6; }
.fest-supplier__contact { list-style:none; margin:.35rem 0; padding:0; display:flex; flex-direction:column; gap:.15rem; font-size:.88rem; }
.fest-supplier__contact li { display:flex; align-items:center; gap:.4rem; }
.fest-supplier__contact a { color:inherit; }

/* Préparation de commande (réappro par fournisseur) */
.fest-reorder-flag { color:#b45309; font-weight:700; }
.fest-order { margin-bottom:1.25rem; }
.fest-order__head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.5rem; margin-bottom:.6rem; }
.fest-order__supplier { margin:0; font-size:1.2rem; display:flex; align-items:center; gap:.4rem; }
.fest-order__meta { display:flex; flex-wrap:wrap; gap:.6rem; align-items:baseline; font-size:.88rem; }
.fest-order__subtotal { font-weight:600; }
.fest-order__table { display:flex; flex-direction:column; }
.fest-order__row { display:grid; grid-template-columns:minmax(8rem,2fr) repeat(5, minmax(4rem,1fr)); gap:.5rem; align-items:center; padding:.35rem 0; border-bottom:1px solid var(--line, rgba(0,0,0,.06)); }
.fest-order__row--head { font-weight:700; font-size:.82rem; color:var(--muted, #6b7280); border-bottom-width:2px; }
.fest-order__row .num { text-align:right; }
.fest-order__name { font-weight:600; }
.fest-order__qty, .fest-order__cost { width:100%; max-width:6rem; margin-left:auto; text-align:right; padding:.25rem .4rem; }
.fest-order__qty-stack { display:flex; flex-direction:column; gap:.25rem; align-items:flex-end; }
.fest-order__unit { width:100%; max-width:8rem; font-size:.78rem; padding:.15rem .3rem; }
.fest-order__foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-top:.8rem; }
.fest-order__foot-fields { display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; }
.fest-order__actions { margin-top:.5rem; }
@media (max-width: 640px) {
    .fest-order__row { grid-template-columns:1fr 1fr; }
    .fest-order__row--head { display:none; }
    .fest-order__name { grid-column:1 / -1; }
}
/* Impression : feuille de commande seule. Masquer .site-header (englobe la nav)
   suffit ; aucune de ces cibles n'a de règle `display` concurrente → pas besoin
   de !important. */
@media print {
    .site-header, .fest-noprint, .page-header-actions { display:none; }
    .fest-order__qty, .fest-order__cost { border:none; box-shadow:none; }
    .content-card { box-shadow:none; border:1px solid #ccc; }
}

/* Mouvements */
.fest-movement-list { list-style:none; margin:0; padding:0; }
.fest-movement { display:flex; align-items:center; gap:.6rem; padding:.4rem 0; border-bottom:1px solid var(--line, rgba(0,0,0,.06)); font-size:.9rem; }
.fest-movement__dir { display:inline-flex; align-items:center; gap:.2rem; font-weight:700; min-width:3.5rem; }
.fest-movement__dir--in { color:#0f9d6b; }
.fest-movement__dir--out { color:#dc2626; }
.fest-movement__item { flex:1; }
.fest-movement__reason { font-size:.82rem; }
.fest-movement__cost { font-size:.82rem; font-weight:600; }
.fest-movement__date { font-size:.8rem; }

/* Tableau de bord : tuiles */
.fest-dash-tile { display:flex; flex-direction:column; gap:.15rem; text-decoration:none; color:var(--text, #2a1640); position:relative; transition:transform .14s, box-shadow .14s; }
a.fest-dash-tile:hover { transform:translateY(-3px); box-shadow:0 16px 36px rgba(42,22,64,.14); }
.fest-dash-tile__icon { font-size:1.5rem; color:var(--fest-pink, #ff4d8d); }
.fest-dash-tile__value { font-size:2rem; font-weight:800; }
.fest-dash-tile--warn .fest-dash-tile__value { color:#dc2626; }
.fest-dash-tile--warn .fest-dash-tile__icon { color:#dc2626; }
.fest-upcoming { list-style:none; margin:0; padding:0; }
.fest-upcoming__item { display:flex; align-items:center; gap:.6rem; padding:.45rem 0; border-bottom:1px solid var(--line, rgba(0,0,0,.06)); }
.fest-upcoming__dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.fest-upcoming__item a { font-weight:600; text-decoration:none; color:var(--text, #2a1640); }
.fest-upcoming__item a:hover { color:var(--fest-pink, #ff4d8d); }

/* Scanner plein écran : styles déplacés dans document_scanner.css
   (composant partagé plateforme, chargé par base.html festivités). */

/* ─────────────────────────────────────────────
   Synchronisation des listes vers iOS Rappels (CalDAV)
   ───────────────────────────────────────────── */
.fest-section-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.fest-section-head .fest-section-title { margin: 0; }

.fest-list-toolbar { display: flex; align-items: center; gap: .5rem; justify-content: flex-end; margin: 0 0 .5rem; }
.fest-list-rename { display: inline-flex; align-items: center; gap: .35rem; margin-right: auto; color: var(--muted, #6b7280); }
.fest-list-rename .form-control { max-width: 16rem; font-weight: 600; }
.fest-list-rename .autosave-status { font-size: .75rem; }

/* Bouton « iPhone » discret posé sur chaque liste. */
.fest-caldav-btn { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .6rem;
    border-radius: 999px; border: 1px solid var(--fest-pink, #ff4d8d); background: none;
    color: var(--fest-pink, #ff4d8d); font: inherit; font-size: .82rem; line-height: 1.2;
    cursor: pointer; min-height: 32px; }
.fest-caldav-btn:hover { background: var(--accent-soft, rgba(255,77,141,.1)); }
.fest-caldav-btn__label { font-weight: 600; }

/* Fenêtre de configuration — disposition verticale, propre sur un modal étroit. */
.fest-caldav-modal { width: min(94vw, 440px); }
.fest-caldav-form { padding: 1.1rem 1.35rem 1.35rem; display: grid; gap: .85rem; }

/* Encadré « cette liste apparaîtra dans Rappels » (affiché quand on ouvre depuis une liste). */
.fest-caldav-callout { display: flex; align-items: flex-start; gap: .5rem; margin: 0;
    padding: .6rem .75rem; border-radius: 10px; font-size: .86rem; line-height: 1.45;
    background: var(--accent-soft, rgba(255,77,141,.1));
    border: 1px solid color-mix(in srgb, var(--fest-pink, #ff4d8d) 35%, transparent); }
.fest-caldav-callout i { color: var(--fest-pink, #ff4d8d); font-size: 1.05rem; flex: none; margin-top: .05rem; }

.fest-caldav-intro { margin: 0; font-size: .88rem; color: var(--muted, #6b7280); line-height: 1.5; }

.fest-caldav-primary { display: grid; gap: .4rem; }
.fest-caldav-cta { display: flex; align-items: center; justify-content: center; gap: .5rem;
    width: 100%; white-space: nowrap; }
.fest-caldav-cta i { font-size: 1.15rem; }
.fest-caldav-hint { margin: 0; font-size: .8rem; color: var(--muted, #6b7280); line-height: 1.45; }

/* Séparateur « ou » entre profil et QR. */
.fest-caldav-or { display: flex; align-items: center; gap: .6rem; color: var(--muted, #9ca3af);
    font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
.fest-caldav-or::before, .fest-caldav-or::after { content: ""; flex: 1; height: 1px;
    background: var(--line, rgba(0,0,0,.1)); }

.fest-caldav-qr-block { display: grid; justify-items: center; gap: .45rem; text-align: center; }
.fest-caldav-qr { border-radius: 10px; border: 1px solid var(--line, rgba(0,0,0,.1));
    background: #fff; padding: 6px; }

.fest-caldav-manual { border-top: 1px solid var(--line, rgba(0,0,0,.1)); padding-top: .65rem; }
.fest-caldav-manual > summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.fest-caldav-fields { display: grid; grid-template-columns: auto 1fr; gap: .3rem .75rem; margin: .55rem 0 0; }
.fest-caldav-fields dt { font-weight: 600; font-size: .85rem; }
.fest-caldav-fields dd { margin: 0; word-break: break-all; }
.fest-caldav-fields code { font-size: .82rem; padding: .1rem .3rem; border-radius: 4px;
    background: color-mix(in srgb, var(--line) 26%, transparent); }

/* ── Widget d'import Square (recettes, inventaire) ───────────────────────── */
.fest-sqimport__row { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.fest-sqimport__row .form-control { flex: 0 1 16rem; min-width: 0; }
.fest-sqimport__cats {
    display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin-top: 0.75rem;
    padding: 0.6rem 0.75rem; border: 1px solid var(--border, #e5e7eb); border-radius: 0.5rem;
}
.fest-sqcat { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.9rem; }