/* HEADER MOBILE — sobre, sans bleu */
.nav-menu, .nav-divider, .brand-sub { display:none!important; }

.site-header { position:sticky; top:0; z-index:100; height:54px; background:rgba(17,17,19,.97); backdrop-filter:blur(16px); border-bottom:1px solid rgba(255,255,255,.06); box-shadow:0 4px 20px rgba(0,0,0,.4); }
.navbar { display:flex; align-items:center; height:54px; gap:.65rem; }

.navbar-brand { display:flex; align-items:center; gap:.55rem; flex-shrink:0; text-decoration:none; }
.brand-logo { width:32px; height:32px; border-radius:7px; background:var(--accent); display:flex; align-items:center; justify-content:center; font-family:'Raleway',sans-serif; font-weight:900; font-size:.85rem; color:#fff; flex-shrink:0; }
.brand-text { display:flex; flex-direction:column; }
.brand-name { font-family:'Raleway',sans-serif; font-size:.83rem; font-weight:800; color:#fff; line-height:1.15; }

.nav-actions { display:flex; align-items:center; gap:.35rem; margin-left:auto; flex-shrink:0; }
.btn-theme { width:32px; height:32px; border-radius:7px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09); color:rgba(255,255,255,.55); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .18s; flex-shrink:0; }
.btn-theme:hover { background:rgba(255,255,255,.12); color:#fff; }

.btn-burger { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:36px; height:36px; border-radius:8px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09); color:rgba(255,255,255,.7); cursor:pointer; padding:0; transition:background .18s; flex-shrink:0; }
.btn-burger:hover { background:rgba(255,255,255,.12); }
.btn-burger span { display:block; width:17px; height:2px; background:currentColor; border-radius:2px; transition:all .25s; }
.btn-burger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.btn-burger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.btn-burger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Overlay */
.mobile-menu-overlay { display:block; position:fixed; inset:0; background:rgba(0,0,0,.65); z-index:199; opacity:0; pointer-events:none; transition:opacity .3s; }
.mobile-menu-overlay.open { opacity:1; pointer-events:auto; }

/* Panneau */
.mobile-menu { display:flex; position:fixed; top:0; right:0; bottom:0; width:min(295px,86vw); background:#111113; z-index:200; flex-direction:column; overflow:hidden; box-shadow:-6px 0 32px rgba(0,0,0,.6); transform:translateX(100%); transition:transform .3s cubic-bezier(.4,0,.2,1); }
.mobile-menu.open { transform:translateX(0); }
.mobile-menu-inner { flex:1; overflow-y:auto; padding:calc(54px + .5rem) 0 1rem; -webkit-overflow-scrolling:touch; }

.mobile-menu-section-label { font-size:.6rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:rgba(255,255,255,.25); padding:.7rem 1.2rem .35rem; }

.mobile-menu-item { display:flex; align-items:center; gap:.8rem; padding:.75rem 1.2rem; color:rgba(255,255,255,.72); text-decoration:none; font-size:.9rem; font-weight:500; transition:background .15s; position:relative; }
.mobile-menu-item:hover, .mobile-menu-item:active { background:rgba(255,255,255,.05); opacity:1; }
.mobile-menu-item.active-page { color:#fff; background:rgba(255,255,255,.06); }
.mobile-menu-item.active-page::before { content:''; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--accent); border-radius:0 2px 2px 0; }

.mobile-menu-icon { width:34px; height:34px; border-radius:8px; background:rgba(255,255,255,.07); display:flex; align-items:center; justify-content:center; font-size:.9rem; flex-shrink:0; }
.mobile-menu-item:hover .mobile-menu-icon { background:rgba(255,255,255,.11); }
.mobile-menu-chevron { margin-left:auto; font-size:.68rem; color:rgba(255,255,255,.18); flex-shrink:0; }

.mobile-menu-footer { padding:.7rem 1.2rem 1.1rem; border-top:1px solid rgba(255,255,255,.06); display:flex; flex-direction:column; gap:.45rem; }
.mobile-menu-btn { display:flex; align-items:center; justify-content:center; gap:.45rem; padding:.65rem 1rem; border-radius:10px; font-size:.88rem; font-weight:600; text-decoration:none; transition:all .18s; }
.mobile-menu-btn-primary { background:var(--accent); color:#fff; }
.mobile-menu-btn-primary:hover { background:var(--accent-dark); color:#fff; opacity:1; }
.mobile-menu-btn-ghost   { background:rgba(255,255,255,.06); color:rgba(255,255,255,.65); border:1px solid rgba(255,255,255,.09); }
.mobile-menu-btn-ghost:hover   { background:rgba(255,255,255,.1); color:#fff; opacity:1; }
.mobile-menu-btn-danger  { background:rgba(192,57,43,.15); color:rgba(255,140,130,.9); border:1px solid rgba(192,57,43,.25); }
.mobile-menu-btn-danger:hover  { background:rgba(192,57,43,.28); color:#fff; opacity:1; }

/* ============================================================
   MENU RÉGIONS — Mobile (sous-liste dépliable)
   ============================================================ */

/* Item régions dans le panneau mobile */
.mobile-regions-toggle {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: .8rem 1.25rem;
    color: rgba(255,255,255,.8);
    font-size: .92rem;
    font-weight: 500;
    cursor: pointer;
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    transition: background .15s;
    position: relative;
}
.mobile-regions-toggle:hover { background: rgba(255,255,255,.05); }
.mobile-regions-toggle.open  { background: rgba(192,57,43,.08); color: #ff8a7a; }

.mobile-regions-toggle .mobile-menu-icon { background: rgba(192,57,43,.15); color: #ff8a7a; }
.mobile-regions-toggle.open .mobile-menu-icon { background: rgba(192,57,43,.25); }

.mobile-regions-toggle .mobile-menu-chevron {
    transition: transform .25s ease;
}
.mobile-regions-toggle.open .mobile-menu-chevron {
    transform: rotate(90deg);
}

/* Sous-liste régions */
.mobile-regions-list {
    display: none;
    flex-direction: column;
    background: rgba(255,255,255,.03);
    border-top: 1px solid rgba(255,255,255,.06);
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.mobile-regions-list.open { display: flex; animation: fadeIn .2s ease; }

/* Chaque région */
.mobile-region-item {
    border-bottom: 1px solid rgba(255,255,255,.04);
}
.mobile-region-item:last-child { border-bottom: none; }

.mobile-region-name {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem 1.4rem;
    font-size: .8rem;
    font-weight: 700;
    color: rgba(255,255,255,.55);
    text-transform: uppercase;
    letter-spacing: .06em;
}
.mobile-region-name::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--accent);
    opacity: .6;
    flex-shrink: 0;
}

.mobile-region-links {
    display: flex;
    gap: .4rem;
    padding: .4rem 1.4rem .7rem;
}
.mobile-region-links a {
    display: flex;
    align-items: center;
    gap: .3rem;
    padding: .38rem .75rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 100px;
    font-size: .72rem;
    font-weight: 600;
    color: rgba(255,255,255,.65);
    text-decoration: none;
    transition: all .15s;
}
.mobile-region-links a:hover {
    background: rgba(192,57,43,.15);
    border-color: rgba(192,57,43,.3);
    color: #ff8a7a;
    opacity: 1;
}
.mobile-region-links a i { font-size: .8rem; }
