/* Version: 20-09-2026-16-46 */
/*
 * Glass header / footer — même modèle (synchronisé) :
 * - Shell (#header / footer) : teinte via ::before, PAS de backdrop-filter
 * - .header-glass / .footer-glass : blur (frère du contenu, pas ancêtre des fixed)
 * - #header-nav (mobile) : verre du panneau
 * - .sub-menu-content : verre du sous-menu desktop
 * Ne jamais définir position ici : fixed = line/tower.css, sticky = customizer.css.
 */

/* ── Shell : teinte seule ── */

#portfolio_page header,
#portfolio_page footer,
#portfolio_page #header,
#theme-visualiser #portfolio_page header,
#theme-visualiser #portfolio_page footer,
#theme-visualiser #portfolio_page #header,
body.portfolio-editor #webpage-simulation #portfolio_page header,
body.portfolio-editor #webpage-simulation #portfolio_page footer,
body.portfolio-editor #webpage-simulation #portfolio_page #header {
    background-color: transparent;
    background-image: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

#portfolio_page header::before,
#portfolio_page footer::before,
#portfolio_page #header::before,
#theme-visualiser #portfolio_page header::before,
#theme-visualiser #portfolio_page footer::before,
#theme-visualiser #portfolio_page #header::before,
body.portfolio-editor #webpage-simulation #portfolio_page header::before,
body.portfolio-editor #webpage-simulation #portfolio_page footer::before,
body.portfolio-editor #webpage-simulation #portfolio_page #header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-color: var(--portfolios-nav-bg-color, rgba(255, 255, 255, 0.15));
    pointer-events: none;
}

/* Footer shell : positionnée pour ::before / .footer-glass */
#portfolio_page footer,
#theme-visualiser #portfolio_page footer,
body.portfolio-editor #webpage-simulation #portfolio_page footer {
    position: relative;
}

/* ── Glass blur (header + footer, même calque) ── */

#portfolio_page header .header-glass,
#portfolio_page #header .header-glass,
#portfolio_page footer .footer-glass,
#theme-visualiser #portfolio_page header .header-glass,
#theme-visualiser #portfolio_page #header .header-glass,
#theme-visualiser #portfolio_page footer .footer-glass,
body.portfolio-editor #webpage-simulation #portfolio_page header .header-glass,
body.portfolio-editor #webpage-simulation #portfolio_page #header .header-glass,
body.portfolio-editor #webpage-simulation #portfolio_page footer .footer-glass {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-color: transparent;
    -webkit-backdrop-filter: var(--portfolios-nav-bg-blur, blur(6px));
    backdrop-filter: var(--portfolios-nav-bg-blur, blur(6px));
}

@media (max-width: 1100px) {
    /*
     * Mobile = même stack que desktop (teinte ::before + blur .header-glass).
     * Pas de blur sur le shell #header (évite CB pour #header-nav fixed).
     * Ce fichier charge après mobile.css : renforcer le modèle partagé ici.
     */
    #portfolio_page header,
    #portfolio_page #header,
    #theme-visualiser #portfolio_page header,
    #theme-visualiser #portfolio_page #header,
    body.portfolio-editor #webpage-simulation #portfolio_page header,
    body.portfolio-editor #webpage-simulation #portfolio_page #header {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    #portfolio_page header::before,
    #portfolio_page #header::before,
    #theme-visualiser #portfolio_page header::before,
    #theme-visualiser #portfolio_page #header::before,
    body.portfolio-editor #webpage-simulation #portfolio_page header::before,
    body.portfolio-editor #webpage-simulation #portfolio_page #header::before {
        content: "" !important;
        display: block !important;
        background-color: var(--portfolios-nav-bg-color, rgba(255, 255, 255, 0.15));
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    #portfolio_page header .header-glass,
    #portfolio_page #header .header-glass,
    #theme-visualiser #portfolio_page header .header-glass,
    #theme-visualiser #portfolio_page #header .header-glass,
    body.portfolio-editor #webpage-simulation #portfolio_page header .header-glass,
    body.portfolio-editor #webpage-simulation #portfolio_page #header .header-glass {
        display: block !important;
        -webkit-backdrop-filter: var(--portfolios-nav-bg-blur, blur(6px)) !important;
        backdrop-filter: var(--portfolios-nav-bg-blur, blur(6px)) !important;
    }
}

/*
 * Contenu au-dessus du verre shell.
 * Pas de z-index sur .header-inner (piège le panel fixed en mobile).
 */
#portfolio_page header .header-inner,
#portfolio_page #header .header-inner,
#theme-visualiser #portfolio_page header .header-inner,
#theme-visualiser #portfolio_page #header .header-inner,
body.portfolio-editor #webpage-simulation #portfolio_page header .header-inner,
body.portfolio-editor #webpage-simulation #portfolio_page #header .header-inner {
    position: relative;
    z-index: auto;
}

#portfolio_page footer #footer-main,
#portfolio_page #footer #footer-main,
#theme-visualiser #portfolio_page footer #footer-main,
#theme-visualiser #portfolio_page #footer #footer-main,
body.portfolio-editor #webpage-simulation #portfolio_page footer #footer-main,
body.portfolio-editor #webpage-simulation #portfolio_page #footer #footer-main {
    position: relative;
    z-index: 1;
}

/* Sous-menu desktop : verre sur le contenu (pas sur le pont hover) */
#portfolio_page header .sub-menu .sub-menu-content,
#theme-visualiser #portfolio_page header .sub-menu .sub-menu-content {
    position: relative;
    z-index: 1;
    background-color: var(--portfolios-nav-bg-color, rgba(255, 255, 255, 0.15));
    -webkit-backdrop-filter: var(--portfolios-nav-bg-blur, blur(6px));
    backdrop-filter: var(--portfolios-nav-bg-blur, blur(6px));
}

#portfolio_page header .sub-menu .sub-menu-content::before,
#theme-visualiser #portfolio_page header .sub-menu .sub-menu-content::before {
    content: none;
    display: none;
}
