/* KMØ 1.6.8 — one mobile navigation for every public KMØ page.
 * Desktop and footer branding deliberately remain under their original rules.
 * Explicit priority protects the home page from WordPress Additional CSS.
 */
@media (max-width: 700px) {
    :is(#kmo, #kmo-pronostics-page, #kmo-teams-page, #kmo-method-page, #kmo-team-app)
    :is(.km-header, .kpp-header, .kteams-header, .kmethod-header, .kt-header) {
        display: block !important;
        box-sizing: border-box !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 8px 16px !important;
        background: #050d0c !important;
        border: 0 !important;
        border-bottom: 1px solid #293130 !important;
    }

    :is(#kmo-pronostics-page, #kmo-teams-page, #kmo-method-page, #kmo-team-app)
    :is(.kpp-header-inner, .kteams-header-inner, .kmethod-header-inner, .kt-header-inner) {
        display: block !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Header only: no selector reaches footer logos. Home has a WP paragraph wrapper. */
    #kmo .km-header .km-brand,
    #kmo .km-header > p,
    #kmo .km-header > br,
    #kmo-pronostics-page .kpp-header .kpp-brand,
    #kmo-teams-page .kteams-header .kteams-brand,
    #kmo-method-page .kmethod-header .kmethod-brand,
    #kmo-team-app .kt-header .kt-brand {
        display: none !important;
    }

    :is(#kmo, #kmo-pronostics-page, #kmo-teams-page, #kmo-method-page, #kmo-team-app)
    :is(.km-header, .kpp-header, .kteams-header, .kmethod-header, .kt-header) nav {
        display: grid !important;
        box-sizing: border-box !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, 44px) !important;
        grid-auto-flow: row !important;
        gap: 0 4px !important;
        width: 100% !important;
        height: 88px !important;
        min-height: 88px !important;
        max-height: 88px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: visible !important;
        font: 700 13px/1.2 var(--kmo-font-ui, Arial) !important;
        letter-spacing: normal !important;
        text-transform: none !important;
    }

    :is(#kmo, #kmo-pronostics-page, #kmo-teams-page, #kmo-method-page, #kmo-team-app)
    :is(.km-header, .kpp-header, .kteams-header, .kmethod-header, .kt-header) nav > :is(a, span) {
        position: relative !important;
        display: flex !important;
        box-sizing: border-box !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 44px !important;
        min-width: 0 !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: none !important;
        color: #eceee9 !important;
        font: inherit !important;
        letter-spacing: normal !important;
        text-transform: none !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }

    :is(#kmo, #kmo-pronostics-page, #kmo-teams-page, #kmo-method-page, #kmo-team-app)
    :is(.km-header, .kpp-header, .kteams-header, .kmethod-header, .kt-header) nav > [aria-current="page"] {
        color: #e6c77e !important;
    }

    :is(#kmo, #kmo-pronostics-page, #kmo-teams-page, #kmo-method-page, #kmo-team-app)
    :is(.km-header, .kpp-header, .kteams-header, .kmethod-header, .kt-header) nav > [aria-current="page"]::after {
        content: "";
        position: absolute !important;
        left: 25% !important;
        right: 25% !important;
        bottom: 3px !important;
        height: 2px !important;
        background: #e6c77e !important;
        border-radius: 2px !important;
    }
}
