/**
 * Header AIRDancia — CSS site-wide
 * Emplacement cible : blocksy-child/assets/css/aird-header.css
 *
 * Adapté du composant React Header.css. Chargé site-wide via functions.php
 * (pour fonctionner en dehors des pages event).
 */

/* Fonts site-wide : Caveat (claim italique), Cinzel (wordmark), et les
   sans-serif utilisées par le header + drawer + popup invite + WC re-skin.
   Manrope est chargée par le thème, on ne la duplique pas ici. */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@700&family=Cinzel:wght@500;600&family=Plus+Jakarta+Sans:wght@600;700;800&family=Montserrat:wght@500;600;700&family=Inter:wght@400;500;600&display=swap');

:root {
    --aird-or:        #E5A93D;
    --aird-or-clair:  #F5C76E;
}

/* =========================================================
   SITE HEADER
   ========================================================= */
.aird-siteheader {
    position: relative;
    isolation: isolate;
    /* Base : noir teinté très subtil (dark-1 du design system + soupçon prune
       désaturée) — plus chaud et profond que l'ancien violet bleuté */
    background: linear-gradient(180deg, #0c0810 0%, #110c15 65%, #15101a 100%);
    border-bottom: 1px solid rgba(229, 169, 61, .18);
    padding: 18px 56px 22px;
    color: #fff;
    font-family: 'Manrope', sans-serif;
    overflow: hidden;
    /* Breakout : le header s'étend à toute la largeur de la fenêtre,
       même s'il est rendu dans un container Elementor / Blocksy limité. */
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* Si le header est rendu via [aird_header] dans un widget Elementor,
   neutralise margin / padding de TOUS les wrappers Elementor parents
   (widget, widget-container, column, section) pour qu'il colle au contenu
   en dessous sans espace blanc parasite. */
.elementor-widget-shortcode:has(.aird-siteheader),
.elementor-widget-html:has(.aird-siteheader),
.elementor-element:has(> .elementor-widget-container > .elementor-widget-shortcode .aird-siteheader),
.elementor-element:has(.aird-siteheader),
.elementor-section:has(.aird-siteheader),
.elementor-column:has(.aird-siteheader),
.elementor-container:has(.aird-siteheader),
.elementor-widget-wrap:has(.aird-siteheader) {
    margin: 0 !important;
    padding: 0 !important;
}
.elementor-widget-shortcode:has(.aird-siteheader) .elementor-widget-container,
.elementor-widget-html:has(.aird-siteheader) .elementor-widget-container {
    padding: 0 !important;
    margin: 0 !important;
}
/* Le header lui-même : pas de margin parasite */
.aird-siteheader {
    margin-bottom: 0 !important;
}

/* Image logo : remplit le mark sans déformation + effet de profondeur
   (drop-shadow noire pour le relief + halo doré pour l'intégration au
   design or du header). drop-shadow suit la silhouette du PNG détouré,
   pas le rectangle, donc l'effet est propre. */
.aird-brand__mark img,
.aird-brand__mark .custom-logo,
.aird-brand__mark .custom-logo-link img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    filter:
        drop-shadow(0 6px 14px rgba(0, 0, 0, 0.55))
        drop-shadow(0 0 18px rgba(229, 169, 61, 0.30));
    transition: filter .35s ease, transform .35s ease;
}
.aird-brand:hover .aird-brand__mark img,
.aird-brand:hover .aird-brand__mark .custom-logo,
.aird-brand:hover .aird-brand__mark .custom-logo-link img {
    filter:
        drop-shadow(0 8px 20px rgba(0, 0, 0, 0.65))
        drop-shadow(0 0 28px rgba(245, 199, 110, 0.55));
    transform: scale(1.04) translateY(-1px);
}
.aird-siteheader__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.aird-siteheader__aurora {
    position: absolute;
    inset: -40% -10%;
    /* Palette harmonisée or + prune désaturée + bronze profond
       (plus de magenta vif, plus de violet électrique) */
    background:
        /* Or chaud à gauche — cœur de la marque */
        radial-gradient(55% 75% at 20% 45%, rgba(245, 199, 110, .20) 0%, transparent 60%),
        /* Or doré désaturé à droite (au lieu du magenta) */
        radial-gradient(45% 65% at 82% 40%, rgba(229, 169, 61, .14) 0%, transparent 70%),
        /* Wash chaud en bas : prune profonde désaturée (au lieu du violet vif) */
        radial-gradient(65% 85% at 50% 115%, rgba(58, 36, 50, .50) 0%, transparent 70%);
    filter: blur(45px);
    opacity: .85;
}
.aird-siteheader__grain {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px);
    background-size: 3px 3px;
    mix-blend-mode: overlay;
    opacity: .35;
}

.aird-siteheader__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 28px;
    max-width: 1280px;
    margin: 0 auto;
}

/* ----------- Logo + Wordmark ----------- */
.aird-brand {
    display: inline-flex;
    flex-direction: column;     /* logo en haut, wordmark en bas */
    align-items: center;        /* centré horizontalement sous le logo */
    justify-content: space-between;
    gap: 6px;
    text-decoration: none;
    align-self: stretch;        /* prend toute la hauteur du header */
}
.aird-brand__mark {
    width: 96px;
    height: 96px;
    aspect-ratio: 1 / 1;       /* logo carré */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* Le logo PNG fourni a déjà son propre cercle décoratif → pas besoin
       d'ajouter background/border/shadow par-dessus. */
}

/* Wordmark "AIRDancia" sous le logo
   Style Trajan luxe (Cinzel = clone Trajan free sur Google Fonts).
   Dégradé doré métal poli + bevel discret. */
.aird-brand__name {
    display: inline-block;
    font-family: 'Cinzel', 'Trajan Pro', 'Times New Roman', serif;
    font-weight: 600;
    font-size: 22px;
    line-height: 1;
    letter-spacing: 0.18em;       /* respiration romaine large */
    text-transform: uppercase;
    text-decoration: none;
    /* Dégradé doré façon métal poli */
    background: linear-gradient(180deg,
        #FFE3A8 0%,
        #F5C76E 30%,
        #E5A93D 55%,
        #B8821F 85%,
        #8C5E10 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* Profondeur : ombre noire dessous + halo doré subtil */
    filter:
        drop-shadow(0 1px 0 rgba(0, 0, 0, .5))
        drop-shadow(0 2px 6px rgba(0, 0, 0, .45))
        drop-shadow(0 0 12px rgba(229, 169, 61, .22));
    transition: filter .35s ease, transform .35s ease;
    /* Compense le letter-spacing à droite pour rester centré */
    padding-left: 0.18em;
}
.aird-brand:hover .aird-brand__name {
    transform: translateY(-1px);
    filter:
        drop-shadow(0 1px 0 rgba(0, 0, 0, .55))
        drop-shadow(0 2px 6px rgba(0, 0, 0, .5))
        drop-shadow(0 0 18px rgba(245, 199, 110, .45));
}

@media (max-width: 991px) {
    .aird-brand__name { font-size: 18px; letter-spacing: 0.16em; }
}
@media (max-width: 768px) {
    .aird-brand__mark { width: 60px; height: 60px; }
    .aird-brand__name { font-size: 15px; letter-spacing: 0.14em; }
}

/* ----------- Centre : claim + nav ----------- */
.aird-siteheader__center {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.aird-siteheader__claim {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
}
.aird-siteheader__claim-top {
    font-family: 'Manrope', sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #fff;
}
.aird-siteheader__claim-bottom {
    font-family: 'Caveat', cursive;
    font-size: 22px;
    font-weight: 700;
    background: linear-gradient(135deg, #F5C76E 0%, #E5A93D 50%, #D49942 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 2px 12px rgba(229, 169, 61, .25));
}
.aird-siteheader__claim-bottom em {
    font-style: normal;
}

/* ----------- Nav (pill bar) ----------- */
.aird-sitenav {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    background: linear-gradient(180deg, #0a0712 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .25);
    border-radius: 999px;
    box-shadow:
        0 12px 32px -12px rgba(0, 0, 0, .7),
        inset 0 0 0 1px rgba(255, 255, 255, .04);
    --mx: 50%;
    overflow: visible;
    isolation: isolate;
}

/* Quand on rend via wp_nav_menu, WordPress génère un <ul><li> qu'on
   neutralise pour que les <a> apparaissent en flex inline directement.
   Aussi : suppression des bullets natives qui apparaissent par-dessus. */
.aird-sitenav ul,
.aird-sitenav .menu {
    display: contents;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.aird-sitenav li,
.aird-sitenav .menu-item {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}
.aird-sitenav li::before,
.aird-sitenav li::marker,
.aird-sitenav .menu-item::before,
.aird-sitenav .menu-item::marker {
    content: none !important;
    display: none !important;
    background: none !important;
}

/* Ligne fine or sous la nav (peak central, fade aux extrémités) */
.aird-sitenav__glowline {
    position: absolute;
    left: 6%;
    right: 6%;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(229, 169, 61, 0) 6%,
        rgba(229, 169, 61, .55) 28%,
        rgba(245, 199, 110, .95) 50%,
        rgba(229, 169, 61, .55) 72%,
        rgba(229, 169, 61, 0) 94%,
        transparent 100%
    );
    filter: drop-shadow(0 0 4px rgba(229, 169, 61, .55));
    pointer-events: none;
    z-index: 2;
}

/* Halo radial qui suit la souris (var --mx, easing JS) */
.aird-sitenav__spotlight {
    position: absolute;
    left: var(--mx);
    bottom: -28px;
    transform: translateX(-50%);
    width: 320px;
    height: 64px;
    background: radial-gradient(50% 60% at 50% 0%,
        rgba(255, 235, 170, .85) 0%,
        rgba(245, 199, 110, .55) 18%,
        rgba(229, 169, 61, .28) 40%,
        rgba(229, 169, 61, 0) 75%
    );
    filter: blur(6px);
    opacity: .55;
    pointer-events: none;
    transition: opacity .25s ease;
    z-index: 1;
    mix-blend-mode: screen;
}
.aird-sitenav.is-tracking .aird-sitenav__spotlight {
    opacity: 1;
    transition: opacity .15s ease;
}

/* Sparkle (étoile blanche) au curseur */
.aird-sitenav__sparkle {
    position: absolute;
    left: var(--mx);
    bottom: -2px;
    transform: translate(-50%, 50%);
    width: 20px;
    height: 20px;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
    filter:
        drop-shadow(0 0 6px rgba(255, 235, 170, .95))
        drop-shadow(0 0 14px rgba(229, 169, 61, .6));
    z-index: 3;
}
.aird-sitenav.is-tracking .aird-sitenav__sparkle {
    opacity: 1;
    animation: airdSparklePulse 1.6s ease-in-out infinite;
}
@keyframes airdSparklePulse {
    0%, 100% { transform: translate(-50%, 50%) scale(1) rotate(0deg); }
    50%      { transform: translate(-50%, 50%) scale(1.15) rotate(45deg); }
}

/* Items */
.aird-sitenav__item,
.aird-sitenav .menu-item > a {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 999px;
    font-family: 'Manrope', sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .78);
    text-decoration: none;
    transition: all .2s ease;
    position: relative;
}
/* (séparateurs ::before retirés — le user les voulait sans points entre items) */
.aird-sitenav__item:hover,
.aird-sitenav .menu-item > a:hover {
    color: var(--aird-or-clair);
}
.aird-sitenav__item.is-active,
.aird-sitenav .current-menu-item > a,
.aird-sitenav .current-menu-ancestor > a {
    background: linear-gradient(135deg, rgba(229, 169, 61, .22) 0%, rgba(229, 169, 61, .08) 100%);
    color: #fff;
    box-shadow:
        inset 0 0 0 1px rgba(229, 169, 61, .5),
        0 0 18px rgba(229, 169, 61, .15);
}

/* ----------- Bloc utilisateur (droite) — 2 lignes ----------- */
.aird-siteheader__user {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;  /* top en haut, bot poussé en bas */
    gap: 8px;
    min-width: 180px;
    align-self: stretch;             /* prend toute la hauteur du header */
}
.aird-siteheader__user-top {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
}
/* Rangée 1 : Bonjour, NicolasSBK (sur la même ligne, baseline alignée) */
.aird-siteheader__user-row {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}
.aird-siteheader__hello {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .5);
}
.aird-siteheader__name {
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--aird-or-clair);
}

/* Rangée 2 : Crédits — 2 cadres séparés (icône carrée 36×36 + compteur étiré)
   Largeur totale = rangée Dashboard + Logout en dessous (~166px) → bord
   droit aligné avec le Logout. Icône fixe 36px, compteur prend tout le reste. */
.aird-siteheader__credits {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 166px;        /* = Dashboard (~124) + gap (6) + Logout (~36) */
    text-decoration: none;
    font-family: 'Manrope', sans-serif;
}
.aird-siteheader__credits-icon,
.aird-siteheader__credits-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    background: linear-gradient(180deg, #1a1424 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .30);
    color: var(--aird-or-clair);
    border-radius: 10px;
    transition: all .2s ease;
    line-height: 1;
}
.aird-siteheader__credits-icon {
    width: 36px;         /* parfaitement carré, identique aux btn-icon */
    flex-shrink: 0;      /* ne se compresse jamais */
}
.aird-siteheader__credits-num {
    flex: 1;             /* prend tout le reste de la largeur */
    min-width: 0;
    padding: 0 8px;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.02em;
}
.aird-siteheader__credits:hover .aird-siteheader__credits-icon,
.aird-siteheader__credits:hover .aird-siteheader__credits-num {
    border-color: rgba(229, 169, 61, .7);
    box-shadow: 0 0 14px rgba(229, 169, 61, .22);
    color: #fff;
}
.aird-siteheader__credits:hover {
    transform: translateY(-1px);
}
.aird-siteheader__actions {
    display: inline-flex;
    gap: 6px;
}
.aird-siteheader__actions--top {
    margin-top: 4px;
}
.aird-siteheader__actions--bot {
    /* Aligné en bas, en face du wordmark "AIRDancia" à gauche */
    margin-top: auto;
}
.aird-btn-dash,
.aird-btn-logout {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: linear-gradient(180deg, #1a1424 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .3);
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.06em;
    padding: 8px 14px;
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s ease;
    text-decoration: none;
}
.aird-btn-dash:hover,
.aird-btn-logout:hover {
    border-color: rgba(229, 169, 61, .7);
    box-shadow: 0 0 18px rgba(229, 169, 61, .18);
    transform: translateY(-1px);
}
/* Force la couleur dorée au hover (override Blocksy qui force le bleu sur
   les <a>:hover globalement). Pattern documenté notes_projet.md §26 A. */
html body a.aird-btn-dash:hover,
html body a.aird-btn-logout:hover {
    color: var(--aird-or-clair) !important;
}
.aird-btn-logout {
    padding: 8px 10px;
    color: #fff;
}

/* ============================================================
   Bouton "S'inscrire" — CTA premium gold (visiteurs déconnectés)
   Pendant droit du bouton "Connexion" (ghost dark).
   ============================================================ */
.aird-siteheader__auth-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.aird-btn-register {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: linear-gradient(135deg, #F5C76E 0%, #E5A93D 50%, #D49942 100%);
    border: 1px solid rgba(229, 169, 61, .55);
    color: #1a1a2e;
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.06em;
    padding: 8px 14px;
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s ease;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(229, 169, 61, .28);
}
.aird-btn-register:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(229, 169, 61, .42);
}
/* Force color au hover (override Blocksy qui force le bleu sur les <a>:hover
   globalement). Pattern documenté notes_projet.md §26 A. */
html body a.aird-btn-register,
html body a.aird-btn-register:hover,
html body a.aird-btn-register:focus,
html body a.aird-btn-register:active {
    color: #1a1a2e !important;
    -webkit-text-fill-color: #1a1a2e !important;
}

/* ============================================================
   Boutons icônes (Messages / Notifications)
   ============================================================ */
.aird-btn-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: linear-gradient(180deg, #1a1424 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .3);
    color: var(--aird-or-clair);
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s ease;
    text-decoration: none;
}
.aird-btn-icon:hover {
    border-color: rgba(229, 169, 61, .7);
    box-shadow: 0 0 18px rgba(229, 169, 61, .18);
    transform: translateY(-1px);
    color: #fff;
}
.aird-btn-icon__badge {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff5b5b 0%, #d9354c 100%);
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(217, 53, 76, .4), inset 0 1px 0 rgba(255, 255, 255, .3);
    border: 1.5px solid #100a1b;
    line-height: 1;
}
/* Variante or : pour les badges "neutres / positifs" (participations, etc.) */
.aird-btn-icon__badge--gold {
    background: linear-gradient(135deg, #f5d98a 0%, #e5a93d 100%);
    color: #110a1b;
    box-shadow: 0 2px 8px rgba(229, 169, 61, .45), inset 0 1px 0 rgba(255, 255, 255, .35);
}
@media (max-width: 991px) {
    .aird-btn-icon { width: 34px; height: 34px; }
}

/* ============================================================
   BURGER (mobile only)
   Position absolue pour ne pas perturber la grille desktop.
   Hidden ≥ 992px, visible < 992px.
   ============================================================ */
.aird-burger {
    display: none;          /* hidden desktop */
    position: absolute;
    top: 18px;
    right: 16px;
    z-index: 5;
    width: 46px;
    height: 46px;
    padding: 0;
    background: linear-gradient(180deg, #1a1424 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .30);
    border-radius: 12px;
    cursor: pointer;
    color: var(--aird-or-clair);
    transition: all .25s ease;
    align-items: center;
    justify-content: center;
}
.aird-burger:hover,
.aird-burger:focus-visible {
    border-color: rgba(229, 169, 61, .75);
    box-shadow: 0 0 18px rgba(229, 169, 61, .25);
    transform: translateY(-1px);
    outline: none;
}
.aird-burger__lines {
    position: relative;
    display: inline-block;
    width: 22px;
    height: 16px;
}
.aird-burger__lines span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform .3s ease, opacity .25s ease, top .3s ease;
}
.aird-burger__lines span:nth-child(1) { top: 0; }
.aird-burger__lines span:nth-child(2) { top: 7px; }
.aird-burger__lines span:nth-child(3) { top: 14px; }

/* État ouvert : transformation en X */
.aird-burger.is-open .aird-burger__lines span:nth-child(1) {
    top: 7px;
    transform: rotate(45deg);
}
.aird-burger.is-open .aird-burger__lines span:nth-child(2) {
    opacity: 0;
}
.aird-burger.is-open .aird-burger__lines span:nth-child(3) {
    top: 7px;
    transform: rotate(-45deg);
}

/* ============================================================
   DRAWER (off-canvas mobile)
   ============================================================ */
.aird-drawer {
    position: fixed;
    inset: 0;
    z-index: 99999;
    pointer-events: none;
    visibility: hidden;
    /* Caché en desktop (le burger n'apparaît pas non plus) */
}
.aird-drawer.is-open {
    pointer-events: auto;
    visibility: visible;
}

/* Backdrop : fond sombre flou */
.aird-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 5, 14, .55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity .35s ease;
}
.aird-drawer.is-open .aird-drawer__backdrop {
    opacity: 1;
}

/* Panel : slide depuis la droite */
.aird-drawer__panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(360px, 88vw);
    background: linear-gradient(180deg,
        rgba(20, 14, 28, .96) 0%,
        rgba(15, 10, 22, .98) 100%
    );
    backdrop-filter: blur(28px);
    -webkit-backdrop-filter: blur(28px);
    border-left: 1px solid rgba(229, 169, 61, .25);
    box-shadow: -24px 0 60px -12px rgba(0, 0, 0, .55);
    color: #fff;
    font-family: 'Manrope', sans-serif;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    transform: translateX(100%);
    transition: transform .42s cubic-bezier(.16, 1, .3, 1);
}
.aird-drawer.is-open .aird-drawer__panel {
    transform: translateX(0);
}
/* Hairline doré tout en haut du panel */
.aird-drawer__panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 199, 110, .85) 50%,
        transparent 100%
    );
    pointer-events: none;
}

/* HEAD : brand + close */
.aird-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 18px 14px;
    border-bottom: 1px solid rgba(229, 169, 61, .15);
}
.aird-drawer__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.aird-drawer__brand-mark {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.aird-drawer__brand-mark img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter:
        drop-shadow(0 4px 8px rgba(0, 0, 0, .5))
        drop-shadow(0 0 12px rgba(229, 169, 61, .25));
}
.aird-drawer__brand-name {
    font-family: 'Cinzel', 'Trajan Pro', serif;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    background: linear-gradient(180deg, #F5D98A 0%, #E5A93D 55%, #C28A1F 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    padding-left: 0.16em;
}
.aird-drawer__close {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid rgba(229, 169, 61, .25);
    color: var(--aird-or-clair);
    border-radius: 10px;
    cursor: pointer;
    transition: all .25s ease;
}
.aird-drawer__close:hover,
.aird-drawer__close:focus-visible {
    border-color: rgba(229, 169, 61, .7);
    color: #fff;
    box-shadow: 0 0 14px rgba(229, 169, 61, .25);
    outline: none;
}

/* USER block */
.aird-drawer__user {
    padding: 18px 18px 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-bottom: 1px solid rgba(229, 169, 61, .15);
}
.aird-drawer__user-hello {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .5);
}
.aird-drawer__user-name {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: var(--aird-or-clair);
}

/* NAV (vertical) */
.aird-drawer__nav {
    padding: 14px 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 auto;            /* pousse le footer en bas */
}
.aird-drawer__nav ul,
.aird-drawer__nav .menu {
    display: flex;
    flex-direction: column;
    gap: 2px;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.aird-drawer__nav li,
.aird-drawer__nav .menu-item {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}
.aird-drawer__nav li::before,
.aird-drawer__nav li::marker,
.aird-drawer__nav .menu-item::before,
.aird-drawer__nav .menu-item::marker {
    content: none !important;
    display: none !important;
    background: none !important;
}
.aird-drawer__nav-item,
.aird-drawer__nav .menu-item > a {
    display: flex;
    align-items: center;
    padding: 14px 16px;
    border-radius: 10px;
    font-family: 'Manrope', sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
    transition: all .2s ease;
    position: relative;
}
.aird-drawer__nav-item::before,
.aird-drawer__nav .menu-item > a::before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--aird-or-clair);
    margin-right: 0;
    opacity: 0;
    transform: translateX(-4px);
    transition: all .25s ease;
}
.aird-drawer__nav-item:hover,
.aird-drawer__nav .menu-item > a:hover {
    background: rgba(229, 169, 61, .08);
    color: var(--aird-or-clair);
}
.aird-drawer__nav-item:hover::before,
.aird-drawer__nav .menu-item > a:hover::before {
    opacity: 1;
    margin-right: 10px;
    transform: translateX(0);
}
.aird-drawer__nav-item.is-active,
.aird-drawer__nav .current-menu-item > a,
.aird-drawer__nav .current-menu-ancestor > a {
    background: linear-gradient(135deg, rgba(229, 169, 61, .22) 0%, rgba(229, 169, 61, .08) 100%);
    color: #fff;
    box-shadow:
        inset 0 0 0 1px rgba(229, 169, 61, .35),
        0 0 14px rgba(229, 169, 61, .12);
}
.aird-drawer__nav-item.is-active::before,
.aird-drawer__nav .current-menu-item > a::before {
    opacity: 1;
    margin-right: 10px;
    transform: translateX(0);
}

/* FOOTER : actions (Messages, Notifs, Dashboard, Logout) */
.aird-drawer__footer {
    padding: 14px 14px 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-top: 1px solid rgba(229, 169, 61, .15);
}

/* Action ligne (Messages / Notifications) */
.aird-drawer__action {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: linear-gradient(180deg, #1a1424 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .25);
    border-radius: 10px;
    color: #fff;
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 600;
    transition: all .2s ease;
}
.aird-drawer__action:hover {
    border-color: rgba(229, 169, 61, .65);
    box-shadow: 0 0 14px rgba(229, 169, 61, .18);
    transform: translateY(-1px);
}
.aird-drawer__action-icon {
    display: inline-flex;
    color: var(--aird-or-clair);
}
.aird-drawer__action-label {
    flex: 1;
}
.aird-drawer__action-badge {
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff5b5b 0%, #d9354c 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(217, 53, 76, .4), inset 0 1px 0 rgba(255, 255, 255, .3);
    line-height: 1;
}

/* CTA primary (Dashboard) + ghost (Logout) */
.aird-drawer__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 6px;
    padding: 14px 18px;
    background: linear-gradient(135deg, #f4c05e 0%, #e5a93d 50%, #b8821f 100%);
    border: 1px solid rgba(229, 169, 61, .8);
    color: #110a1b;
    text-decoration: none;
    font-family: 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 12px;
    box-shadow: 0 8px 22px -8px rgba(229, 169, 61, .55);
    transition: all .25s ease;
}
.aird-drawer__cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px -8px rgba(245, 199, 110, .65);
}
.aird-drawer__cta--ghost {
    background: transparent;
    color: var(--aird-or-clair);
    border: 1px solid rgba(229, 169, 61, .35);
    box-shadow: none;
    font-weight: 700;
}
.aird-drawer__cta--ghost:hover {
    background: rgba(229, 169, 61, .08);
    border-color: rgba(229, 169, 61, .65);
    box-shadow: 0 0 14px rgba(229, 169, 61, .15);
}

/* Lock body scroll quand drawer ouvert */
body.aird-drawer-open {
    overflow: hidden;
}

/* ============================================================
   BOTTOM BAR mobile (fixed bottom, app-like)
   Visible uniquement < 992px. Pattern Instagram/Spotify : 4 items
   répartis en flex equi, icône + label, badge sur Messages/Notifs,
   item actif en doré avec barre supérieure animée.
   ============================================================ */
.aird-bottombar {
    display: none;          /* hidden desktop */
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    /* Fond glassmorphism sombre + hairline doré en haut */
    background: linear-gradient(180deg,
        rgba(20, 14, 28, .92) 0%,
        rgba(15, 10, 22, .98) 100%
    );
    backdrop-filter: blur(22px) saturate(140%);
    -webkit-backdrop-filter: blur(22px) saturate(140%);
    border-top: 1px solid rgba(229, 169, 61, .25);
    box-shadow:
        0 -8px 24px -8px rgba(0, 0, 0, .55),
        0 -1px 0 rgba(245, 199, 110, .08);
    padding: 6px 4px;
    /* Safe area iOS (iPhone X+ avec home indicator) */
    padding-bottom: max(6px, env(safe-area-inset-bottom));
    font-family: 'Manrope', sans-serif;
}

/* Affiché < 992px */
@media (max-width: 991px) {
    .aird-bottombar { display: flex; }
    /* Réserve l'espace en bas pour ne pas que la bottombar cache du contenu */
    body:has(.aird-bottombar) {
        padding-bottom: calc(64px + env(safe-area-inset-bottom));
    }
}

/* Item */
.aird-bb__item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 8px 4px 6px;
    border-radius: 12px;
    color: rgba(255, 255, 255, .55);
    text-decoration: none;
    position: relative;
    transition: color .2s ease, transform .15s ease;
    -webkit-tap-highlight-color: transparent;
}
.aird-bb__item:active {
    transform: scale(0.92);
}
.aird-bb__item:hover {
    color: var(--aird-or-clair);
}

/* Icône container : permet de positionner le badge */
.aird-bb__icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    transition: transform .25s cubic-bezier(.16, 1, .3, 1);
}
.aird-bb__item:active .aird-bb__icon {
    transform: translateY(-1px);
}

/* Label sous l'icône */
.aird-bb__label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* Badge rouge (Messages / Notifs) */
.aird-bb__badge {
    position: absolute;
    top: -4px;
    right: -8px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff5b5b 0%, #d9354c 100%);
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0 2px 8px rgba(217, 53, 76, .45),
        inset 0 1px 0 rgba(255, 255, 255, .3);
    border: 1.5px solid rgba(15, 10, 22, .98);
    line-height: 1;
}
/* Variante or pour participations (badge "neutre / positif") */
.aird-bb__badge--gold {
    background: linear-gradient(135deg, #f5d98a 0%, #e5a93d 100%);
    color: #110a1b;
    box-shadow:
        0 2px 8px rgba(229, 169, 61, .5),
        inset 0 1px 0 rgba(255, 255, 255, .35);
}

/* État actif : doré + petite barre dorée au-dessus + glow */
.aird-bb__item.is-active {
    color: var(--aird-or-clair);
}
.aird-bb__item.is-active::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 3px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg, #f5d98a 0%, #e5a93d 100%);
    box-shadow: 0 0 10px rgba(245, 199, 110, .65);
}
.aird-bb__item.is-active .aird-bb__icon {
    /* Légère mise en avant + halo doré */
    filter: drop-shadow(0 0 8px rgba(245, 199, 110, .45));
    transform: translateY(-1px);
}
.aird-bb__item.is-active .aird-bb__label {
    /* Texte un poil plus présent en actif */
    text-shadow: 0 0 8px rgba(245, 199, 110, .35);
}

/* Très petits écrans : on raccourcit les labels en réduisant leur taille */
@media (max-width: 360px) {
    .aird-bb__label { font-size: 9.5px; }
    .aird-bb__icon { width: 26px; height: 26px; }
    .aird-bb__icon svg { width: 20px; height: 20px; }
}

/* Item Inviter de la bottombar : mis en avant (cercle doré) car c'est
   le call-to-action central, comme le + des apps natives. */
.aird-bb__item--invite {
    background: transparent;
    border: 0;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    font: inherit;
}
.aird-bb__item--invite .aird-bb__icon {
    width: 44px;
    height: 44px;
    margin-top: -10px;       /* le cercle déborde légèrement vers le haut */
    border-radius: 50%;
    background: linear-gradient(135deg, #f5d98a 0%, #e5a93d 50%, #b8821f 100%);
    color: #110a1b;
    box-shadow:
        0 8px 18px -4px rgba(229, 169, 61, .55),
        inset 0 1px 0 rgba(255, 255, 255, .35);
    border: 2px solid rgba(15, 10, 22, .98);
}
.aird-bb__item--invite .aird-bb__icon svg {
    width: 22px;
    height: 22px;
    stroke-width: 2;
}
.aird-bb__item--invite .aird-bb__label {
    color: var(--aird-or-clair);
    margin-top: 2px;
}
.aird-bb__item--invite:hover .aird-bb__icon {
    box-shadow:
        0 10px 22px -4px rgba(245, 199, 110, .7),
        inset 0 1px 0 rgba(255, 255, 255, .45);
}
.aird-bb__item--invite:active .aird-bb__icon {
    transform: scale(0.94);
}

/* ============================================================
   POPUP INVITATION
   QR code centré + lien copiable + boutons Email/WhatsApp
   Cohérent visuellement avec le drawer (glassmorphism + or)
   ============================================================ */
.aird-invite {
    position: fixed;
    inset: 0;
    z-index: 100000;
    pointer-events: none;
    visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.aird-invite.is-open {
    pointer-events: auto;
    visibility: visible;
}
.aird-invite__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 5, 14, .65);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    transition: opacity .35s ease;
}
.aird-invite.is-open .aird-invite__backdrop {
    opacity: 1;
}

/* Panel : carte glass dorée centrée */
.aird-invite__panel {
    position: relative;
    width: min(420px, 100%);
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    background: linear-gradient(180deg,
        rgba(22, 16, 32, .98) 0%,
        rgba(15, 10, 22, .99) 100%
    );
    border: 1px solid rgba(229, 169, 61, .35);
    border-radius: 18px;
    padding: 30px 26px 26px;
    color: #fff;
    font-family: 'Manrope', sans-serif;
    box-shadow:
        0 24px 60px -12px rgba(0, 0, 0, .65),
        0 0 0 1px rgba(255, 255, 255, .03) inset,
        0 0 40px rgba(229, 169, 61, .12);
    transform: translateY(20px) scale(.96);
    opacity: 0;
    transition: transform .35s cubic-bezier(.16, 1, .3, 1), opacity .25s ease;
}
.aird-invite.is-open .aird-invite__panel {
    transform: translateY(0) scale(1);
    opacity: 1;
}
/* Hairline doré tout en haut */
.aird-invite__panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 18%;
    right: 18%;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(245, 199, 110, .9) 50%, transparent 100%);
    pointer-events: none;
}

.aird-invite__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid rgba(229, 169, 61, .25);
    color: var(--aird-or-clair);
    border-radius: 10px;
    cursor: pointer;
    transition: all .25s ease;
    z-index: 2;
}
.aird-invite__close:hover,
.aird-invite__close:focus-visible {
    border-color: rgba(229, 169, 61, .7);
    color: #fff;
    box-shadow: 0 0 14px rgba(229, 169, 61, .25);
    outline: none;
}

/* Head */
.aird-invite__head {
    text-align: center;
    margin-bottom: 22px;
    padding: 0 30px;          /* laisse de la place au close */
}
.aird-invite__title {
    margin: 0 0 8px;
    /* Font aligné sur les titres de cards dashboard (Plus Jakarta Sans 700
       uppercase letter-spaced) — couleur dorée gradient inchangée */
    font-family: 'Plus Jakarta Sans', 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    background: linear-gradient(180deg, #F5D98A 0%, #E5A93D 55%, #C28A1F 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    padding-left: 0.14em;
}
.aird-invite__sub {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: rgba(255, 255, 255, .7);
}
.aird-invite__sub strong {
    color: var(--aird-or-clair);
    font-weight: 700;
}

/* QR code centré */
.aird-invite__qr {
    margin: 0 0 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.aird-invite__qr-frame {
    padding: 12px;
    background: #fff;
    border-radius: 14px;
    border: 2px solid rgba(229, 169, 61, .55);
    box-shadow:
        0 12px 28px -8px rgba(0, 0, 0, .5),
        0 0 24px rgba(229, 169, 61, .18);
    line-height: 0;        /* pas de gap fantôme sous l'img */
}
.aird-invite__qr-frame img {
    display: block;
    width: 220px;
    height: 220px;
    max-width: 100%;
    aspect-ratio: 1 / 1;
}
.aird-invite__qr-cap {
    margin: 0;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .55);
}

/* Lien copiable */
.aird-invite__link {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
}
.aird-invite__link-input {
    flex: 1;
    min-width: 0;
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(229, 169, 61, .25);
    color: #fff;
    border-radius: 10px;
    padding: 11px 12px;
    font-family: 'Inter', 'Manrope', sans-serif;
    font-size: 12.5px;
    letter-spacing: 0;
    text-overflow: ellipsis;
}
.aird-invite__link-input:focus {
    outline: none;
    border-color: rgba(229, 169, 61, .6);
    background: rgba(255, 255, 255, .06);
}
.aird-invite__link-copy {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 14px;
    background: linear-gradient(180deg, #1a1424 0%, #100a1b 100%);
    border: 1px solid rgba(229, 169, 61, .35);
    color: var(--aird-or-clair);
    border-radius: 10px;
    cursor: pointer;
    font-family: 'Manrope', sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    transition: all .2s ease;
    flex-shrink: 0;
}
.aird-invite__link-copy:hover {
    border-color: rgba(229, 169, 61, .75);
    box-shadow: 0 0 14px rgba(229, 169, 61, .2);
    color: #fff;
}
.aird-invite__link-copy.is-copied {
    background: linear-gradient(180deg, rgba(57, 255, 138, .15) 0%, rgba(57, 255, 138, .08) 100%);
    border-color: rgba(57, 255, 138, .55);
    color: #39ff8a;
}

/* Boutons share : Email + WhatsApp */
.aird-invite__share {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.aird-invite__share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 14px;
    border-radius: 12px;
    text-decoration: none;
    font-family: 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    transition: all .25s ease;
}
.aird-invite__share-btn--mail {
    background: linear-gradient(135deg, #f5d98a 0%, #e5a93d 50%, #b8821f 100%);
    color: #110a1b;
    border: 1px solid rgba(229, 169, 61, .8);
    box-shadow: 0 8px 18px -6px rgba(229, 169, 61, .5);
}
.aird-invite__share-btn--mail:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px -6px rgba(245, 199, 110, .65);
}
.aird-invite__share-btn--wa {
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    color: #fff;
    border: 1px solid rgba(37, 211, 102, .55);
    box-shadow: 0 8px 18px -6px rgba(18, 140, 126, .55);
}
.aird-invite__share-btn--wa:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px -6px rgba(37, 211, 102, .65);
}

/* Lock body scroll quand popup invite ouvert */
body.aird-invite-open {
    overflow: hidden;
}

/* Mobile : ajuste les paddings + force le QR un peu plus petit */
@media (max-width: 420px) {
    .aird-invite__panel {
        padding: 26px 18px 20px;
        border-radius: 16px;
    }
    .aird-invite__qr-frame img {
        width: 200px;
        height: 200px;
    }
    .aird-invite__title { font-size: 13px; letter-spacing: 0.12em; }
    .aird-invite__sub { font-size: 12.5px; }
    .aird-invite__share-btn { font-size: 12.5px; padding: 11px 12px; }
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 991px) {
    .aird-siteheader {
        padding: 14px 16px 18px;
        /* Sticky sur mobile : burger toujours accessible */
        position: sticky;
        top: 0;
        z-index: 1000;
    }
    .aird-siteheader__inner {
        grid-template-columns: auto 1fr;   /* logo + centre, plus de col user */
        gap: 14px;
    }
    .aird-siteheader__claim-top  { font-size: 10.5px; letter-spacing: 0.14em; }
    .aird-siteheader__claim-bottom { font-size: 18px; }

    /* Cache nav pill, bloc user → tout migre dans le drawer */
    .aird-sitenav,
    .aird-siteheader__user {
        display: none;
    }

    /* Burger visible */
    .aird-burger {
        display: inline-flex;
    }
}

@media (max-width: 768px) {
    .aird-siteheader__inner {
        grid-template-columns: auto 1fr;
        gap: 10px;
    }
    /* Réserve la place du burger en haut à droite */
    .aird-siteheader__center {
        padding-right: 56px;
    }
    .aird-siteheader__claim-bottom {
        font-size: 16px;
    }
}

@media (max-width: 420px) {
    .aird-siteheader { padding: 12px 12px 16px; }
    .aird-burger { top: 14px; right: 12px; width: 42px; height: 42px; }
    .aird-siteheader__center { padding-right: 50px; }
    .aird-brand__mark { width: 56px; height: 56px; }
    .aird-siteheader__claim-top { font-size: 10px; }
    .aird-siteheader__claim-bottom { font-size: 15px; }
}