/* DÉBUT — CORSINFOOT MENU MOBILE 1.0.0
   Feuille autonome : aucune modification du CSS personnalisé existant.
   Désactiver l’extension retire l’ensemble de cet ajout. */
#cfm-root, #cfm-spacer { display: none !important; }
#cfm-root [hidden], #cfm-root[hidden], #cfm-spacer[hidden] { display: none !important; }

@media (max-width: 921px) {
    #cfm-root {
        --cfm-styles-ready: 1;
        --cfm-accent: var(--corsica-green, #2ecc71);
        --cfm-text: #1a1a1a;
        --cfm-bar-height: calc(74px + env(safe-area-inset-bottom, 0px));
        --cfm-top-offset: 16px;
        position: fixed !important;
        inset: auto 0 0 !important;
        height: var(--cfm-bar-height) !important;
        z-index: 100000 !important;
        isolation: isolate;
        font: 400 16px/1.45 'Roboto', Arial, sans-serif !important;
        color: var(--cfm-text) !important;
        text-align: left !important;
        text-transform: none !important;
        letter-spacing: normal !important;
    }
    html.cfm-ready #cfm-root { display: block !important; }
    html.cfm-ready #cfm-spacer {
        display: block !important;
        height: var(--cfm-space, calc(74px + env(safe-area-inset-bottom, 0px))) !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        clear: both;
    }
    /* The original trigger is hidden only after the new controls initialize. */
    html.cfm-ready #mobile-header .mobile-toggle-open-container,
    html.cfm-ready #mobile-header #mobile-toggle { display: none !important; }
    #cfm-root *, #cfm-root *::before, #cfm-root *::after { box-sizing: border-box !important; }
    #cfm-root a, #cfm-root button, #cfm-root summary {
        font-family: 'Roboto', Arial, sans-serif !important;
        text-transform: none !important;
        letter-spacing: normal !important;
        text-decoration: none !important;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }
    #cfm-root button { cursor: pointer; }
    #cfm-root svg {
        display: block !important;
        width: 25px !important;
        height: 25px !important;
        flex: 0 0 25px !important;
        overflow: visible;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    #cfm-root .cfm-bar {
        position: absolute !important;
        inset: auto 0 0 !important;
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        min-height: 74px !important;
        padding: 0 4px env(safe-area-inset-bottom, 0px) !important;
        margin: 0 !important;
        background: #fff !important;
        border-top: 1px solid #d9dde0 !important;
        box-shadow: 0 -3px 14px rgb(0 0 0 / 5%);
        z-index: 3;
    }
    #cfm-root .cfm-tab {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 73px !important;
        padding: 10px 2px 9px !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #222 !important;
        box-shadow: none !important;
        font-size: clamp(11px, 3vw, 13px) !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
    }
    #cfm-root .cfm-tab.is-active { color: #13753c !important; font-weight: 700 !important; }
    #cfm-root .cfm-tab.is-active svg { color: var(--cfm-accent); }
    #cfm-root .cfm-tab.is-active::before {
        content: '';
        position: absolute;
        top: 3px;
        width: 25px;
        height: 3px;
        border-radius: 2px;
        background: var(--cfm-accent);
    }
    #cfm-root.cfm-open { inset: 0 !important; height: auto !important; }
    #cfm-root .cfm-backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / 43%); z-index: 0; }
    #cfm-root .cfm-panel {
        position: absolute !important;
        inset: auto 0 var(--cfm-bar-height) !important;
        display: flex !important;
        flex-direction: column !important;
        max-height: calc(100vh - var(--cfm-bar-height) - var(--cfm-top-offset)) !important;
        max-height: calc(100dvh - var(--cfm-bar-height) - var(--cfm-top-offset)) !important;
        background: #fff !important;
        border-radius: 18px 18px 0 0 !important;
        box-shadow: 0 -12px 40px rgb(0 0 0 / 12%);
        overflow: hidden;
        z-index: 2;
        animation: cfm-rise 160ms ease-out;
    }
    #cfm-root .cfm-panel[hidden] { display: none !important; }
    #cfm-root .cfm-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 18px 10px; flex: 0 0 auto; }
    #cfm-root h2 { font: 700 24px/1.25 'Roboto', Arial, sans-serif !important; color: #1a1a1a !important; margin: 0 !important; padding: 0 !important; letter-spacing: 0 !important; text-transform: none !important; }
    #cfm-root .cfm-close { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: #f0f1f3 !important; color: #222 !important; box-shadow: none !important; }
    #cfm-root .cfm-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 0 18px 18px; }
    #cfm-root .cfm-row, #cfm-root summary { display: flex !important; align-items: center; gap: 13px; min-height: 50px; padding: 12px 0 !important; margin: 0 !important; font-size: 16px !important; font-weight: 700 !important; line-height: 1.4 !important; background: #fff !important; color: #1a1a1a !important; border: 0 !important; list-style: none !important; cursor: pointer; }
    #cfm-root .cfm-row-label { flex: 1; min-width: 0; }
    #cfm-root summary::-webkit-details-marker { display: none; }
    #cfm-root .cfm-chevron { margin-left: auto; width: 19px !important; height: 19px !important; flex-basis: 19px !important; }
    #cfm-root details[open] > summary .cfm-chevron { transform: rotate(180deg); }
    #cfm-root .cfm-group { border-bottom: 1px solid #e1e3e7; margin: 0 !important; padding: 0 0 11px !important; }
    #cfm-root .cfm-group:last-child { border-bottom: 0; padding-bottom: 0 !important; }
    #cfm-root details.cfm-group { padding-bottom: 0 !important; }
    #cfm-root details.cfm-group[open] { padding-bottom: 11px !important; }
    #cfm-root .cfm-group-title { margin: 0 !important; padding: 13px 0 10px !important; font: 700 16px/1.35 'Roboto', Arial, sans-serif !important; color: #1a1a1a !important; text-transform: none !important; letter-spacing: normal !important; }
    #cfm-root .cfm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 !important; margin: 0 !important; }
    #cfm-root .cfm-chip { display: flex !important; align-items: center; justify-content: center; min-height: 45px; padding: 10px 8px !important; border: 1px solid #c8cdd2 !important; border-radius: 7px !important; background: #f7f8f9 !important; color: #202124 !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.4 !important; text-align: center; overflow-wrap: anywhere; }
    #cfm-root .cfm-grid > :only-child, #cfm-root .cfm-grid > .cfm-group { grid-column: 1 / -1; }
    #cfm-root .cfm-chip[aria-current='page'] { border-color: #188447 !important; background: #eaf8ee !important; color: #125a31 !important; }
    #cfm-root .cfm-chip:hover { border-color: #188447 !important; background: #edf8f0 !important; }
    #cfm-root .cfm-parent-link { display: inline-block; margin: 0 0 10px; color: #126e37 !important; font-size: 14px; }
    #cfm-root :is(a, button, summary):focus-visible { outline: 3px solid #117239 !important; outline-offset: -3px !important; }
    #cfm-root .cfm-panel h2:focus { outline: none; }
}
@media (max-width: 921px) and (prefers-reduced-motion: reduce) { #cfm-root .cfm-panel { animation: none; } }
@keyframes cfm-rise { from { transform: translateY(12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
/* FIN — CORSINFOOT MENU MOBILE */

/* DÉBUT — AFFINEMENTS 1.2.1
   Ajouts isolés : navigation épurée, Instagram et accordéons.
   Le CSS d’origine du site n’est jamais modifié. */
#cfm-instagram { display: none !important; }
@media (max-width: 921px) {
    #cfm-root { --cfm-bar-height: calc(68px + env(safe-area-inset-bottom, 0px)); }
    #cfm-root .cfm-bar { min-height: 68px !important; border-top-color: #e5e7e9 !important; box-shadow: none !important; }
    #cfm-root .cfm-tab { min-height: 67px !important; padding: 8px 2px !important; font-weight: 500 !important; }
    #cfm-root .cfm-tab.is-active { font-weight: 600 !important; }
    #cfm-root .cfm-tab.is-active::before { content: none !important; display: none !important; }

    /* Installation help works independently of the old mobile-app extension. */
    #cfm-root .cfm-install-row { width: 100%; border-top: 1px solid #e1e3e7 !important; text-align: left !important; border-radius: 0 !important; box-shadow: none !important; }
    #cfm-root .cfm-install-back { display: inline-flex !important; align-items: center; gap: 5px; min-height: 44px; margin: 0 0 4px !important; padding: 5px 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: #13753c !important; font: 500 14px/1.4 'Roboto', Arial, sans-serif !important; }
    #cfm-root .cfm-install-back svg { width: 16px !important; height: 16px !important; flex-basis: 16px !important; transform: rotate(180deg); }
    #cfm-root .cfm-install-intro { margin: 0 0 14px !important; color: #41494e !important; font: 400 15px/1.55 'Roboto', Arial, sans-serif !important; }
    #cfm-root .cfm-install-guide { margin: 0 !important; padding: 0 !important; border-bottom: 1px solid #e1e3e7 !important; }
    #cfm-root .cfm-install-steps { margin: 0 !important; padding: 0 0 12px 24px !important; list-style: decimal outside !important; color: #30363a !important; font: 400 14px/1.6 'Roboto', Arial, sans-serif !important; }
    #cfm-root .cfm-install-steps li { display: list-item !important; margin: 0 0 10px !important; padding: 0 0 0 3px !important; font: inherit !important; color: inherit !important; }
    #cfm-root .cfm-install-steps li::marker { color: #13753c; font-weight: 700; }
    #cfm-root .cfm-install-tip { margin: 16px 0 0 !important; padding: 10px 12px !important; background: #eef8f1 !important; border-radius: 8px !important; color: #235439 !important; font: 400 13px/1.5 'Roboto', Arial, sans-serif !important; }
    #cfm-root .cfm-install-note { margin: 12px 0 0 !important; color: #596167 !important; font: 400 12px/1.5 'Roboto', Arial, sans-serif !important; }

    /* Mobile header: existing logo / centered site brand / Instagram. */
    html.cfm-ready #mobile-header .cfm-instagram-source { display: none !important; }
    html.cfm-ready #mobile-header .cfm-brand-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
        column-gap: clamp(5px, 2vw, 16px) !important;
        align-items: center !important;
    }
    html.cfm-ready #mobile-header .cfm-brand-row > * { min-width: 0 !important; }
    html.cfm-ready #mobile-header .cfm-brand-center {
        display: flex !important; align-items: center !important; justify-content: center !important;
        margin: 0 !important; padding: 0 !important;
    }
    html.cfm-ready #mobile-header .cfm-brand-row > .site-header-main-section-left { justify-content: flex-start !important; }
    html.cfm-ready #mobile-header .cfm-brand-row .site-header-main-section-left .custom-logo {
        width: auto !important; max-width: min(60px, 100%) !important; max-height: 60px !important; object-fit: contain;
    }
    html.cfm-ready #mobile-header .cfm-brand-right {
        display: flex !important; align-items: center !important; justify-content: flex-end !important;
        margin: 0 !important; padding: 0 !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram {
        display: inline-flex !important; align-items: center !important; justify-content: flex-end !important;
        gap: 5px !important; min-height: 44px !important; max-width: 100% !important;
        margin: 0 !important; padding: 0 !important; box-sizing: border-box !important;
        color: inherit !important; background: transparent !important; border: 0 !important;
        border-radius: 4px !important; text-decoration: none !important; text-transform: none !important;
        box-shadow: none !important; letter-spacing: 0 !important;
    }
    #mobile-header #cfm-instagram svg {
        display: block !important; width: 17px !important; height: 17px !important; flex: 0 0 17px !important;
        color: inherit !important; fill: none !important; stroke: currentColor !important;
        stroke-width: 1.8 !important; stroke-linecap: round; stroke-linejoin: round;
    }
    #mobile-header #cfm-instagram .cfm-instagram-copy {
        display: flex !important; flex-direction: column !important; align-items: flex-start !important;
        gap: 2px !important; line-height: 1.2 !important; white-space: nowrap !important;
    }
    #mobile-header #cfm-instagram .cfm-instagram-copy > span { font: 400 9px/1.2 'Roboto', Arial, sans-serif !important; color: inherit !important; }
    #mobile-header #cfm-instagram strong { font: 600 11px/1.2 'Roboto', Arial, sans-serif !important; color: inherit !important; }
    html.cfm-ready #mobile-header #cfm-instagram:hover { opacity: .8; }
    html.cfm-ready #mobile-header #cfm-instagram:focus-visible { outline: 2px solid currentColor !important; outline-offset: 3px !important; }
}
/* FIN — AFFINEMENTS 1.2.1 */

/* DÉBUT — CORRECTIONS VISUELLES 1.2.2
   Ajout supprimable : Instagram épuré et lisible, sans modifier le CSS initial.
   Logo à gauche, nom centré et lien à droite restent à leurs emplacements. */
@media (max-width: 921px) {
    html.cfm-ready #mobile-header #cfm-instagram {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        width: 84px !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 68px !important;
        padding: 4px !important;
        background: transparent !important;
        color: #fff !important;
        border: 0 !important;
        border-radius: 4px !important;
        opacity: 1 !important;
        box-shadow: none !important;
        text-align: center !important;
        flex-shrink: 1 !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram svg {
        width: 27px !important;
        height: 27px !important;
        flex: 0 0 27px !important;
        color: #2ecc71 !important;
        stroke-width: 1.9 !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram .cfm-instagram-copy {
        align-items: center !important;
        gap: 1px !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram .cfm-instagram-copy > span {
        font: 500 11px/1.15 'Roboto', Arial, sans-serif !important;
        color: #fff !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram strong {
        font: 700 12px/1.2 'Roboto', Arial, sans-serif !important;
        color: #fff !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram:hover {
        background: transparent !important;
        opacity: 1 !important;
    }
    html.cfm-ready #mobile-header #cfm-instagram:hover strong {
        text-decoration: underline !important;
        text-underline-offset: 3px;
    }
    html.cfm-ready #mobile-header #cfm-instagram:focus-visible {
        outline: 2px solid #fff !important;
        outline-offset: 3px !important;
    }
}
@media (max-width: 360px) {
    html.cfm-ready #mobile-header .cfm-brand-row { column-gap: 4px !important; }
    html.cfm-ready #mobile-header #cfm-instagram { padding-inline: 3px !important; }
    html.cfm-ready #mobile-header #cfm-instagram strong { font-size: 11px !important; }
}
/* FIN — CORRECTIONS VISUELLES 1.2.2 */
