/* calendrier-mensuel-grid: future rules must be scoped under .sac-cmg-root */


/* =========================================================
   v4.18.1 - calendrier_mensuel_grid uniquement
   Web / Vue grille :
   - Samedi (colonne 7 des jours) : gris clair
   - Dimanche : gris plus soutenu
   - Les cellules hors mois / sans numéro gardent la même coloration.
   - Les en-têtes Lundi...Dimanche ne sont pas modifiés.
========================================================= */

/* Corps du tableau uniquement : ne jamais toucher au THEAD. */
.sac-cmg-root:not(.sac-monthly-force-mobile):not(.sac-monthly-manual-list-view)
.sac-monthly-grid-table tbody td.sac-monthly-saturday {
    background: #f3f3f3 !important;
}

.sac-cmg-root:not(.sac-monthly-force-mobile):not(.sac-monthly-manual-list-view)
.sac-monthly-grid-table tbody td.sac-monthly-sunday {
    background: #e5e5e5 !important;
}

/*
 * Override explicite pour les cellules hors du mois afin qu'elles restent
 * grisées même si elles sont vides et malgré les règles .sac-monthly-other-month
 * du stylesheet historique.
 */
.sac-cmg-root:not(.sac-monthly-force-mobile):not(.sac-monthly-manual-list-view)
.sac-monthly-grid-table tbody td.sac-monthly-other-month.sac-monthly-saturday {
    background: #f3f3f3 !important;
}

.sac-cmg-root:not(.sac-monthly-force-mobile):not(.sac-monthly-manual-list-view)
.sac-monthly-grid-table tbody td.sac-monthly-other-month.sac-monthly-sunday {
    background: #e5e5e5 !important;
}


/* =========================================================
   v4.31.31 - calendrier_mensuel_grid WEB UI alignment
   - current-month return above month/year controls
   - Grid/List switch inside Options
   - H2 integrated into one rounded calendar frame
   - French-blue title relief
   - collapsible + pinnable/sticky Options
========================================================= */

.sac-cmg-root{
    --sac-cmg-blue:#002395;
    --sac-cmg-radius:8px;
}

/* Navigation column order: return-current -> selectors -> view switch. */
.sac-cmg-root .sac-monthly-options-nav{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:stretch!important;
    gap:9px!important;
}
.sac-cmg-root .sac-cmg-return-top{
    order:1!important;
    margin:0!important;
    width:100%!important;
    text-align:center!important;
}
.sac-cmg-root .sac-monthly-nav-controls{
    order:2!important;
}
.sac-cmg-root .sac-cmg-view-toggle-inside{
    order:3!important;
    display:flex!important;
    justify-content:center!important;
    width:100%!important;
    margin:0!important;
}
.sac-cmg-root .sac-cmg-view-toggle-inside .sac-monthly-view-toggle{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
}

/* Real responsive/mobile mode still forces List View. */
@media (max-width:760px){
    .sac-cmg-root .sac-cmg-view-toggle-inside{display:none!important}
}
.sac-cmg-root.sac-monthly-force-mobile .sac-cmg-view-toggle-inside{
    display:none!important;
}

/* One visual frame shared by Grid and List views. */
.sac-cmg-root .sac-cmg-calendar-frame{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    border-radius:var(--sac-cmg-radius) var(--sac-cmg-radius) 0 0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    background:#fff!important;
}

/* H2 is the first row of the calendar frame. */
.sac-cmg-root .sac-cmg-calendar-title{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:9px 12px!important;
    min-height:42px!important;
    border:0!important;
    border-radius:var(--sac-cmg-radius) var(--sac-cmg-radius) 0 0!important;
    text-align:center!important;
    color:#fff!important;
    font-weight:700!important;
    line-height:1.2!important;
    background:
        linear-gradient(
            to bottom,
            #3f64c8 0%,
            #2450b5 18%,
            #002395 50%,
            #001f84 72%,
            #244ca8 100%
        )!important;
    text-shadow:0 1px 1px rgba(0,0,0,.28)!important;
    box-shadow:
        inset 0 1px 1px rgba(255,255,255,.45),
        inset 0 -2px 3px rgba(0,0,0,.30),
        0 2px 5px rgba(0,0,0,.22)!important;
}
.sac-cmg-root .sac-cmg-calendar-title::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:2px!important;
    height:42%!important;
    border-radius:var(--sac-cmg-radius) var(--sac-cmg-radius) 50% 50% / var(--sac-cmg-radius) var(--sac-cmg-radius) 30% 30%!important;
    background:linear-gradient(to bottom,rgba(255,255,255,.20),rgba(255,255,255,0))!important;
    pointer-events:none!important;
}

/* Attach both view bodies directly under the title. */
.sac-cmg-root .sac-cmg-calendar-frame > .sac-monthly-grid-wrap,
.sac-cmg-root .sac-cmg-calendar-frame > .sac-monthly-mobile-list{
    margin-top:0!important;
}
.sac-cmg-root .sac-cmg-calendar-frame > .sac-monthly-grid-wrap .sac-monthly-grid-table{
    margin-top:0!important;
    border-top:0!important;
}
.sac-cmg-root .sac-cmg-calendar-frame > .sac-monthly-mobile-list{
    border-top:0!important;
    border-radius:0!important;
}

/* ---------------- Options collapse / pin / sticky ---------------- */

.sac-cmg-root .sac-cmg-options{
    position:relative!important;
    top:auto!important;
    z-index:auto!important;
    background:#fff!important;
    box-sizing:border-box!important;
}

.sac-cmg-root .sac-cmg-options-placeholder{
    display:block!important;
    width:100%!important;
    height:0;
    margin:0!important;
    padding:0!important;
    border:0!important;
    pointer-events:none!important;
}

.sac-cmg-root .sac-cmg-options-legend{
    display:inline-flex!important;
    align-items:center!important;
    gap:7px!important;
    max-width:100%!important;
    box-sizing:border-box!important;
}

.sac-cmg-root .sac-cmg-options-legend-text{
    display:inline-block!important;
}

.sac-cmg-root .sac-cmg-options-controls{
    display:inline-flex!important;
    align-items:center!important;
    gap:5px!important;
    margin-left:2px!important;
}

.sac-cmg-root .sac-cmg-options-toggle,
.sac-cmg-root .sac-cmg-options-pin-toggle{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    min-height:22px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #b7b7b7!important;
    border-radius:3px!important;
    background:#fff!important;
    color:#333!important;
    font:600 15px/1 Arial,sans-serif!important;
    cursor:pointer!important;
    box-sizing:border-box!important;
    position:relative!important;
    z-index:4!important;
}

.sac-cmg-root .sac-cmg-options-pin-symbol{
    display:none!important;
    width:100%!important;
    height:100%!important;
    align-items:center!important;
    justify-content:center!important;
    line-height:1!important;
}
.sac-cmg-root .sac-cmg-options-pin-toggle.is-pinned .sac-cmg-options-pin-symbol-unpin{
    display:inline-flex!important;
}
.sac-cmg-root .sac-cmg-options-pin-toggle.is-unpinned .sac-cmg-options-pin-symbol-pin{
    display:inline-flex!important;
}

/* Manual collapse: retain only the legend/control strip. */
.sac-cmg-root .sac-cmg-options.is-collapsed > :not(.sac-cmg-options-legend){
    display:none!important;
}
.sac-cmg-root .sac-cmg-options.is-collapsed{
    min-height:34px!important;
    padding:0!important;
    border-left:0!important;
    border-right:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
    background:#fff!important;
}
.sac-cmg-root .sac-cmg-options.is-collapsed > .sac-cmg-options-legend{
    margin-left:8px!important;
    padding:4px!important;
    background:#fff!important;
}

/* Fixed state starts exactly under the detected site navigation. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky{
    position:fixed!important;
    top:var(--sac-cmg-options-fixed-top,0px)!important;
    margin:0!important;
    padding-top:0!important;
    border-top:0!important;
    background:#fff!important;
    box-shadow:0 2px 8px rgba(0,0,0,.14)!important;
    box-sizing:border-box!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
}

/* Opaque seam curtain below the real menu; z-index stays below floating UI. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:100%!important;
    height:24px!important;
    background:#fff!important;
    pointer-events:none!important;
    z-index:0!important;
}

.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky > .sac-cmg-options-legend,
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky > .sac-cmg-options-grid{
    position:relative!important;
    z-index:2!important;
    background:#fff!important;
}

/* Sticky + collapsed identifies itself as a compact blue strip. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky.is-cmg-options-compact-pinned{
    background:#eaf6ff!important;
    overflow:hidden!important;
    border-left:0!important;
    border-right:0!important;
    border-bottom:0!important;
}
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky.is-cmg-options-compact-pinned
> :not(.sac-cmg-options-legend){
    display:none!important;
}
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky.is-cmg-options-compact-pinned
> .sac-cmg-options-legend{
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:5px 10px!important;
    background:#eaf6ff!important;
    box-sizing:border-box!important;
}

@media (max-width:768px){
    .sac-cmg-root .sac-cmg-options-toggle,
    .sac-cmg-root .sac-cmg-options-pin-toggle{
        width:21px!important;
        height:21px!important;
        min-width:21px!important;
        min-height:21px!important;
    }
}


/* =========================================================
   v4.31.31 - CMG availability, typography, sticky stability
========================================================= */

/* Unavailable options stay visible so the 3-column Options geometry never jumps. */
.sac-cmg-root .sac-cmg-availability-item.is-cmg-unavailable,
.sac-cmg-root .sac-monthly-zone-filter-item.sac-monthly-zone-filter-disabled{
    opacity:.42!important;
    filter:grayscale(.35)!important;
    cursor:default!important;
}
.sac-cmg-root .sac-cmg-availability-item.is-cmg-unavailable input,
.sac-cmg-root .sac-monthly-zone-filter-item.sac-monthly-zone-filter-disabled input{
    cursor:not-allowed!important;
}
.sac-cmg-root .sac-monthly-options-school-empty{
    min-height:0!important;
}
.sac-cmg-root .sac-monthly-options-school-empty .sac-monthly-school-filter-content{
    display:flex!important;
}

/* Match the more readable _new shortcode typography. */
.sac-cmg-root .sac-monthly-grid-table .sac-monthly-day-number{
    font-size:14px!important;
}
.sac-cmg-root .sac-monthly-grid-table .sac-monthly-event-text{
    font-size:13px!important;
    line-height:1.22!important;
}
.sac-cmg-root.sac-monthly-manual-list-view .sac-monthly-mobile-weekday,
.sac-cmg-root.sac-monthly-force-mobile .sac-monthly-mobile-weekday{
    font-size:13px!important;
}
.sac-cmg-root.sac-monthly-manual-list-view .sac-monthly-mobile-date,
.sac-cmg-root.sac-monthly-force-mobile .sac-monthly-mobile-date{
    font-size:14px!important;
}
.sac-cmg-root.sac-monthly-manual-list-view .sac-monthly-mobile-details .sac-monthly-event-text,
.sac-cmg-root.sac-monthly-force-mobile .sac-monthly-mobile-details .sac-monthly-event-text{
    font-size:13px!important;
    line-height:1.18!important;
}

/* Use the same hard-sealed geometry as the mature _new sticky panels. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky{
    top:var(--sac-cmg-options-fixed-top,0px)!important;
    margin:0!important;
    padding-top:0!important;
    border-top:0!important;
    background:#fff!important;
    overflow:visible!important;
    border-radius:0!important;
}
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:100%!important;
    top:auto!important;
    height:28px!important;
    background:#fff!important;
    pointer-events:none!important;
    z-index:0!important;
}
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky > .sac-cmg-options-legend{
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:5px 10px!important;
    border:0!important;
    background:#fff!important;
    box-sizing:border-box!important;
    position:relative!important;
    z-index:2!important;
}
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-compact-pinned) > .sac-cmg-options-grid{
    display:grid!important;
    position:relative!important;
    margin-top:0!important;
    background:#fff!important;
    z-index:2!important;
}
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky.is-cmg-options-compact-pinned > .sac-cmg-options-legend{
    background:#eaf6ff!important;
}


/* =========================================================
   v4.31.31 - CMG native sticky stability fix
   Keep the Options panel in document flow permanently. This removes the
   fixed/placeholder height swap that caused slow upward scrolling to flicker
   and snap back near the end of the shortcode.
========================================================= */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky{
    position:sticky!important;
    position:-webkit-sticky!important;
    top:var(--sac-cmg-options-fixed-top,0px)!important;
    left:auto!important;
    width:auto!important;
    max-height:none!important;
    overflow:visible!important;
    margin-bottom:14px!important;
    border-top:1px solid #d7d7d7!important;
    border-radius:4px!important;
    background:#fff!important;
    /* Paint 2px upward so fractional menu geometry cannot leave a slit. */
    box-shadow:
        0 -2px 0 #fff,
        0 2px 8px rgba(0,0,0,.14)!important;
}

/* The old fixed seam curtain is no longer needed with native sticky. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky::before,
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky::after{
    content:none!important;
    display:none!important;
}

/* Do not reserve any synthetic placeholder height. */
.sac-cmg-root .sac-cmg-options-placeholder{
    display:none!important;
    height:0!important;
}

/* Red × clearly means "disable pinning" while the panel is pinned. */
.sac-cmg-root .sac-cmg-options-pin-toggle.is-pinned
.sac-cmg-options-pin-symbol-unpin{
    color:#d40000!important;
    font-weight:700!important;
}


/* =========================================================
   v4.31.31 - CMG stable fixed/end anchoring
   One authoritative geometry: normal -> fixed -> absolute-end.
   The permanent anchor wrapper stays in normal flow in every state, so
   pinning/unpinning cannot change document height or trigger scroll anchoring.
========================================================= */

.sac-cmg-root{
    position:relative!important;
}

.sac-cmg-root .sac-cmg-options-anchor{
    position:static!important;
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
}

/* Native sticky from v4.31.31 is explicitly retired. */
.sac-cmg-root .sac-cmg-options,
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky{
    position:relative!important;
    top:auto!important;
    bottom:auto!important;
    left:auto!important;
    right:auto!important;
    width:auto!important;
    max-height:none!important;
    overflow:visible!important;
}

/* Active fixed mode; inline !important geometry supplied by JS wins. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end){
    margin:0!important;
    border-top:0!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:
        0 -2px 0 #fff,
        0 2px 8px rgba(0,0,0,.14)!important;
}

/* End-of-shortcode mode sits at the root bottom and aligns exactly with fixed. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-end{
    margin:0!important;
    border-top:0!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:0 2px 8px rgba(0,0,0,.14)!important;
    overflow:visible!important;
}

/* Hard-seal the menu seam in fixed mode without changing layout geometry. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:100%!important;
    height:3px!important;
    background:#fff!important;
    pointer-events:none!important;
    z-index:0!important;
}

.sac-cmg-root .sac-cmg-options.is-cmg-options-end::before,
.sac-cmg-root .sac-cmg-options.is-cmg-options-end::after{
    content:none!important;
    display:none!important;
}

/* Keep the unpin × red. */
.sac-cmg-root .sac-cmg-options-pin-toggle.is-pinned
.sac-cmg-options-pin-symbol-unpin{
    color:#d40000!important;
    font-weight:700!important;
}


/* =========================================================
   v4.31.31 - CMG sticky full-bleed white background
   The Options controls keep the site-content width, while an independent
   background layer extends to both viewport edges. It also overlaps the
   menu seam by 4px so the two upper outer corners cannot expose a gap.
========================================================= */

/* The fixed Options content remains aligned to the website content column. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end){
    overflow:visible!important;
    background:#fff!important;
    border-radius:0!important;
    isolation:isolate!important;
}

/* Replace the narrow seam strip with one full-viewport backing surface. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:calc(-1 * var(--sac-cmg-sticky-bleed-left, 0px))!important;
    right:calc(-1 * var(--sac-cmg-sticky-bleed-right, 0px))!important;
    top:-4px!important;
    bottom:0!important;
    width:auto!important;
    height:auto!important;
    background:#fff!important;
    pointer-events:none!important;
    z-index:-1!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}

/* The full-bleed layer itself seals the menu edge; no second painter needed. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)::after{
    content:none!important;
    display:none!important;
}

/* Keep all actual Options UI above the full-bleed backing surface. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)
> .sac-cmg-options-legend,
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)
> .sac-cmg-options-grid{
    position:relative!important;
    z-index:2!important;
}


/* =========================================================
   v4.31.31 - CMG authoritative full-viewport sticky backdrop
   The white surface is now a real body-level fixed element, not a pseudo
   element of the fieldset. It cannot be clipped or constrained by the
   content container / fieldset stacking context.
========================================================= */

body > .sac-cmg-sticky-backdrop{
    display:none!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    width:100vw!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;
    pointer-events:none!important;
}

body > .sac-cmg-sticky-backdrop.is-active{
    display:block!important;
}

/* Disable all previous pseudo-element attempts; body backdrop is authoritative. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)::before,
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end)::after{
    content:none!important;
    display:none!important;
}

/* Options itself remains aligned to the content column above the backdrop. */
.sac-cmg-root .sac-cmg-options.is-cmg-options-sticky:not(.is-cmg-options-end){
    background:#fff!important;
    overflow-y:auto!important;
    overflow-x:visible!important;
    border-radius:0!important;
}


/* =========================================================
   v4.31.31 - CMG sticky backdrop constrained to website frame
   Body-level backdrop remains independent from the Options fieldset, but JS
   now sizes/positions it to the actual website container instead of 100vw.
========================================================= */

body > .sac-cmg-sticky-backdrop,
body > .sac-cmg-sticky-backdrop.is-active{
    right:auto!important;
    width:auto!important; /* exact left + width are supplied inline by JS */
    max-width:none!important;
}
