/*
 * Radio Sports — enveloppe globale du site.
 * Source unique du header partagé. Le footer reste rendu par footer.php et
 * conserve ses styles globaux dans radiosports-public.css.
 */

body {
    --rs-shell-header-bg: #040814;
    --rs-shell-pink: #f90c9b;
    --rs-shell-live: #72f269;
    --rs-container-max: 1240px;
    --rs-container-wide: 1560px;
    --rs-header-max: 1760px;
    --rs-content-max: 820px;
    --rs-gutter-desktop: 28px;
    --rs-gutter-tablet: 22px;
    --rs-gutter-mobile: 18px;
    --rs-current-gutter: var(--rs-gutter-desktop);
    --rs-shell-max: var(--rs-container-max);
    --rs-shell-gutter: calc(var(--rs-current-gutter) + var(--rs-current-gutter));
}

/*
 * Grille globale réutilisable.
 * - .rs-container / .rs-container-wide : hubs, grilles et modules structurels.
 * - .rs-content : lecture éditoriale longue.
 * - .rs-fullwidth : composant explicitement conçu pour occuper toute la largeur.
 */
.rs-container {
    box-sizing: border-box;
    width: min(var(--rs-container-max), calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter)));
    max-width: var(--rs-container-max);
    margin-inline: auto;
}

.rs-container-wide {
    box-sizing: border-box;
    width: min(var(--rs-container-wide), calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter)));
    max-width: var(--rs-container-wide);
    margin-inline: auto;
}

.rs-content {
    box-sizing: border-box;
    width: min(100%, var(--rs-content-max));
    max-width: var(--rs-content-max);
    margin-inline: auto;
}

.rs-fullwidth {
    width: 100%;
    max-width: none;
}

body.home,
body.blog,
body:not(.home):not(.blog) {
    padding-top: 70px !important;
    overflow-x: hidden !important;
}

body.home .header_spacing,
body.blog .header_spacing,
body:not(.home):not(.blog) .header_spacing,
body.home #bandeauhaut,
body.blog #bandeauhaut,
body:not(.home):not(.blog) #bandeauhaut {
    position: fixed !important;
    inset: 0 0 auto !important;
    z-index: 10000 !important;
    display: block !important;
    width: 100% !important;
    height: 70px !important;
    min-height: 70px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: var(--rs-shell-header-bg) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .08) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

body.home #bandeauhaut > .container,
body.blog #bandeauhaut > .container,
body:not(.home):not(.blog) #bandeauhaut > .container {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 148px minmax(0, 1fr) auto auto !important;
    grid-template-rows: 70px !important;
    gap: clamp(10px, 1.1vw, 20px) !important;
    align-items: center !important;
    width: min(var(--rs-header-max), calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter))) !important;
    max-width: var(--rs-header-max) !important;
    height: 70px !important;
    min-height: 70px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Alignement des enveloppes structurelles existantes sur la même grille. */
body:not(.home):not(.blog) #single_cont,
body:not(.home):not(.blog) .single_full_cont,
body:not(.home):not(.blog) .home_posts > .container,
body .rs-editorial__shell,
body .rs-series-shell,
body .rs-emissions-library,
body.search .category > .container,
body .rs-global-cta,
body #footer {
    box-sizing: border-box !important;
    width: min(var(--rs-container-max), calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter))) !important;
    max-width: var(--rs-container-max) !important;
    margin-inline: auto !important;
}

body:not(.home):not(.blog) .rs-global-cta,
body:not(.home):not(.blog) #footer {
    width: min(var(--rs-container-max), calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter))) !important;
    max-width: var(--rs-container-max) !important;
}

/* Largeur de lecture : les médias et tableaux conservent leur largeur utile. */
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > p,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > h2,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > h3,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > h4,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > ul,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > ol,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > blockquote {
    width: min(100%, var(--rs-content-max)) !important;
    max-width: var(--rs-content-max) !important;
    margin-inline: auto !important;
}

body .rs-series-reading {
    width: min(var(--rs-content-max), calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter))) !important;
    max-width: var(--rs-content-max) !important;
    margin-inline: auto !important;
}

body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > table,
body.rs-editorial-page--legacy-single #single_cont .rs-entry-content:not(.rs-entry-content--special) > .wp-block-table {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
}

body .full_logo_cont {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-items: center !important;
    width: 148px !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body .custom-logo-link,
body .rs-brand-logo {
    display: block !important;
    width: 138px !important;
    height: 62px !important;
    overflow: hidden !important;
    pointer-events: auto !important;
}

body .rs-brand-logo {
    position: relative !important;
}

body .rs-official-logo {
    position: absolute !important;
    top: -37px !important;
    left: 0 !important;
    display: block !important;
    width: 138px !important;
    max-width: none !important;
    height: 138px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .42)) !important;
}

html body.home #playtel,
html body.blog #playtel,
html body:not(.home):not(.blog) #playtel {
    position: static !important;
    display: inline-grid !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 10px !important;
    place-items: center !important;
    justify-self: center !important;
    border: 2px solid rgba(255, 255, 255, .22) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #c7ff92, var(--rs-shell-live) 58%, #34dc72) !important;
    box-shadow: 0 0 0 7px rgba(114, 242, 105, .07), 0 0 26px rgba(114, 242, 105, .32) !important;
    transform: none !important;
}

html body.home #playtel:hover,
html body.blog #playtel:hover,
html body:not(.home):not(.blog) #playtel:hover {
    box-shadow: 0 0 0 8px rgba(114, 242, 105, .1), 0 0 30px rgba(114, 242, 105, .44) !important;
    transform: translateY(-1px) scale(1.03) !important;
}

html body.home #playtel > img,
html body.blog #playtel > img,
html body:not(.home):not(.blog) #playtel > img {
    display: block !important;
    width: 26px !important;
    max-width: 26px !important;
    height: 26px !important;
    max-height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    filter: none !important;
    transform: translateX(1px) !important;
}

body .rs-header-primary {
    display: grid !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    grid-template-columns: minmax(0, 1fr) 138px minmax(0, 1fr) !important;
    min-width: 0 !important;
    align-items: center !important;
    gap: clamp(10px, 1.35vw, 24px) !important;
    pointer-events: none !important;
}

body .rs-header-primary__group {
    display: flex !important;
    min-width: 0 !important;
    align-items: stretch !important;
    gap: clamp(13px, 1.55vw, 28px) !important;
}

body .rs-header-primary a,
body .rs-header-player-stage {
    pointer-events: auto !important;
}

body .rs-header-primary__group--left { justify-content: flex-end !important; }
body .rs-header-primary__group--right { justify-content: flex-start !important; }

body .rs-header-player-stage {
    display: flex !important;
    width: 138px !important;
    height: 70px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

body .rs-header-wave {
    display: flex !important;
    width: 27px !important;
    height: 30px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
}

body .rs-header-wave i {
    display: block !important;
    width: 3px !important;
    height: 22px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #b8ff7d, #34e57a) !important;
    box-shadow: 0 0 8px rgba(114, 242, 105, .38) !important;
    animation: rs-shell-header-wave 1.15s ease-in-out infinite alternate !important;
    transform: scaleY(.34);
    transform-origin: center;
}

body .rs-header-wave i:nth-child(2) { animation-delay: -.78s !important; }
body .rs-header-wave i:nth-child(3) { animation-delay: -.32s !important; }
body .rs-header-wave i:nth-child(4) { animation-delay: -.91s !important; }
body .rs-header-wave i:nth-child(5) { animation-delay: -.48s !important; }
body .rs-header-wave--right { transform: scaleX(-1); }

@keyframes rs-shell-header-wave {
    0% { transform: scaleY(.28); opacity: .64; }
    55% { transform: scaleY(1); opacity: 1; }
    100% { transform: scaleY(.46); opacity: .8; }
}

body .rs-header-primary a {
    position: relative !important;
    display: inline-flex !important;
    min-height: 70px !important;
    align-items: center !important;
    color: rgba(255, 255, 255, .9) !important;
    font: 700 clamp(.72rem, .78vw, .88rem)/1 Montserrat, Arial, sans-serif !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

body .rs-header-primary a:hover,
body .rs-header-primary a.is-active {
    color: #fff !important;
    font-style: normal !important;
}

body .rs-header-primary a::after {
    position: absolute !important;
    right: 0 !important;
    bottom: 10px !important;
    left: 0 !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: transparent !important;
    content: "" !important;
}

body .rs-header-primary a:hover::after,
body .rs-header-primary a.is-active::after {
    background: var(--rs-shell-pink) !important;
}

body .rs-header-primary a:focus-visible,
body .custom-logo-link:focus-visible,
body .rs-header-tool:focus-visible,
body .top_menu .t_menu:focus-visible,
html body.home #playtel:focus-visible,
html body.blog #playtel:focus-visible,
html body:not(.home):not(.blog) #playtel:focus-visible {
    outline: 3px solid #fff !important;
    outline-offset: 3px !important;
}

body .rs-header-tools {
    position: relative !important;
    display: flex !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-items: center !important;
    gap: 6px !important;
}

body .rs-header-tool,
body .top_menu .t_menu {
    display: inline-flex !important;
    min-width: 42px !important;
    height: 42px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 9px !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .035) !important;
    color: #fff !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

body .rs-header-tool:hover,
body .top_menu .t_menu:hover {
    border-color: rgba(114, 242, 105, .72) !important;
    background: rgba(114, 242, 105, .08) !important;
}

body .rs-header-tool img,
body .top_menu .t_menu img {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    filter: invert(1) !important;
}

body .rs-header-search {
    position: absolute !important;
    top: 56px !important;
    right: 0 !important;
    z-index: 10020 !important;
    width: min(360px, calc(100vw - 36px)) !important;
    padding: 10px !important;
    background: #0d1020 !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .42) !important;
}

body .rs-header-search[hidden] { display: none !important; }
body .rs-header-search > div { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 8px !important; }
body .rs-header-search input { min-width: 0 !important; height: 42px !important; padding: 0 12px !important; border: 1px solid rgba(255, 255, 255, .2) !important; border-radius: 8px !important; background: #fff !important; color: #111 !important; }
body .rs-header-search button { min-height: 42px !important; padding: 0 13px !important; border: 0 !important; border-radius: 8px !important; background: var(--rs-shell-live) !important; color: #07100a !important; font-weight: 800 !important; }

html body.home .top_menu,
html body.blog .top_menu,
html body:not(.home):not(.blog) .top_menu {
    display: flex !important;
    grid-column: 4 !important;
    grid-row: 1 !important;
    width: auto !important;
    height: 42px !important;
    align-items: center !important;
    margin: 0 !important;
}

html body .top_menu .t_menu {
    display: inline-flex !important;
    gap: 7px !important;
    width: auto !important;
    height: 42px !important;
    min-width: 76px !important;
    padding: 0 12px !important;
    align-items: center !important;
    justify-content: center !important;
    font: 800 .75rem/1 Montserrat, Arial, sans-serif !important;
}

html body .top_menu .t_menu span { color: #fff !important; }

body #breadcrumb,
body #breadcrumbhaut,
body #header,
body .full_logo_cont #description {
    display: none !important;
}

body.admin-bar .header_spacing { top: 32px !important; }

@media (max-width: 1180px) {
    body.home #bandeauhaut > .container,
    body.blog #bandeauhaut > .container,
    body:not(.home):not(.blog) #bandeauhaut > .container { grid-template-columns: 128px minmax(0, 1fr) auto auto !important; }
    body .full_logo_cont { width: 128px !important; }
    body .custom-logo-link,
    body .rs-brand-logo { width: 128px !important; }
    body .rs-official-logo { top: -32px !important; width: 128px !important; height: 128px !important; }
    body .rs-header-primary { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr) !important; gap: 0 !important; }
    body .rs-header-primary__group { gap: 6px !important; }
    body .rs-header-player-stage { width: 120px !important; gap: 5px !important; }
    body .rs-header-wave { width: 24px !important; }
    body .rs-header-primary a { font-size: .71rem !important; }
}

@media (max-width: 1100px) and (min-width: 901px) {
    body .rs-header-primary__group--left a:last-child,
    body .rs-header-primary__group--right a { display: none !important; }
    body .rs-header-tools { gap: 4px !important; }
    body .top_menu .t_menu { min-width: 42px !important; padding: 0 9px !important; }
    body .top_menu .t_menu span { display: none !important; }
}

@media (max-width: 900px) {
    body { --rs-current-gutter: var(--rs-gutter-tablet); }
    body.home,
    body.blog,
    body:not(.home):not(.blog) { padding-top: 68px !important; }

    body.home .header_spacing,
    body.blog .header_spacing,
    body:not(.home):not(.blog) .header_spacing,
    body.home #bandeauhaut,
    body.blog #bandeauhaut,
    body:not(.home):not(.blog) #bandeauhaut {
        height: 68px !important;
        min-height: 68px !important;
    }

    html body.home #bandeauhaut > .container,
    html body.blog #bandeauhaut > .container,
    html body:not(.home):not(.blog) #bandeauhaut > .container {
        grid-template-columns: 104px minmax(0, 1fr) 46px 46px !important;
        grid-template-rows: 68px !important;
        gap: 8px !important;
        width: calc(100% - var(--rs-current-gutter) - var(--rs-current-gutter)) !important;
        height: 68px !important;
        min-height: 68px !important;
    }

    body .full_logo_cont { width: 104px !important; }
    body .custom-logo-link,
    body .rs-brand-logo { width: 104px !important; height: 46px !important; }
    body .rs-official-logo { top: -29px !important; width: 104px !important; height: 104px !important; }
    body .rs-header-primary { display: contents !important; }
    body .rs-header-primary__group { display: none !important; }
    body .rs-header-tools { display: none !important; }
    body .rs-header-player-stage {
        display: flex !important;
        grid-column: 3 !important;
        grid-row: 1 !important;
        width: 46px !important;
        height: 46px !important;
        gap: 0 !important;
        align-items: center !important;
        justify-content: center !important;
    }
    body .rs-header-wave { display: none !important; }
    html body.home #playtel,
    html body.blog #playtel,
    html body:not(.home):not(.blog) #playtel {
        grid-column: auto !important;
        grid-row: auto !important;
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
        padding: 9px !important;
    }
    html body.home .top_menu,
    html body.blog .top_menu,
    html body:not(.home):not(.blog) .top_menu {
        display: flex !important;
        grid-column: 4 !important;
        grid-row: 1 !important;
        width: 46px !important;
        height: 46px !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }
    html body.home .top_menu .t_menu,
    html body.blog .top_menu .t_menu,
    html body:not(.home):not(.blog) .top_menu .t_menu {
        display: inline-grid !important;
        width: 46px !important;
        height: 46px !important;
        margin: 0 !important;
        padding: 10px !important;
        place-items: center !important;
        background: transparent !important;
        border: 1px solid rgba(255, 255, 255, .2) !important;
        border-radius: 999px !important;
        box-shadow: none !important;
    }
    body .top_menu .t_menu span { display: none !important; }
    html body.home .top_menu .t_menu img,
    html body.blog .top_menu .t_menu img,
    html body:not(.home):not(.blog) .top_menu .t_menu img {
        width: 24px !important;
        height: 24px !important;
        filter: invert(1) !important;
    }
}

@media (max-width: 620px) {
    body { --rs-current-gutter: var(--rs-gutter-mobile); }
}

@media screen and (max-width: 782px) {
    body.admin-bar .header_spacing { top: 46px !important; }
}

@media (prefers-reduced-motion: reduce) {
    body .rs-header-wave i {
        animation: none !important;
        transform: scaleY(.62);
    }
}
