/* =========================================================
   IMMA - Participation parentale  ::  styles publics
   Palette chaude Montessori (vert sauge / terracotta / creme)
   ========================================================= */

.imma-catalogue,
.imma-mon-espace,
.imma-submit-page,
.imma-contact-page,
.imma-event-detail,
.imma-accueil,
.imma-calendrier,
.imma-coordination,
.imma-educ-page,
.imma-gate {
    --imma-cream: #FAF6EF;
    --imma-green: #4C7A5D;
    --imma-green-dark: #3C6149;
    --imma-terra: #C9714E;
    --imma-terra-dark: #B05E3D;
    --imma-ink: #3B3733;
    --imma-muted: #8A8178;
    --imma-line: #E8E0D4;
    --imma-card: #FFFFFF;
    --imma-radius: 16px;
    --imma-shadow: 0 2px 14px rgba(59, 55, 51, .07);
    --imma-shadow-hover: 0 8px 28px rgba(59, 55, 51, .13);

    color: var(--imma-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.55;
    max-width: 1120px;
    margin: 0 auto;
}

.imma-catalogue *,
.imma-mon-espace *,
.imma-submit-page *,
.imma-contact-page *,
.imma-event-detail *,
.imma-accueil *,
.imma-calendrier *,
.imma-coordination *,
.imma-educ-page *,
.imma-gate * { box-sizing: border-box; }

/* Les nouveaux ecrans pilotent leurs blocs avec l'attribut hidden :
   on le rend prioritaire, certains themes forcant un display sur les div. */
.imma-calendrier [hidden],
.imma-contact-page [hidden],
.imma-coordination [hidden],
.imma-educ-page [hidden],
.imma-gate [hidden] { display: none !important; }

/* ---------- En-tete ---------- */
.imma-cat-header { text-align: center; margin: 8px 0 26px; }
.imma-cat-title {
    font-size: clamp(27px, 3.5vw, 38px);
    font-weight: 800;
    color: var(--imma-green-dark);
    margin: 0 0 10px;
    letter-spacing: -.01em;
}
.imma-cat-intro {
    font-size: 17px;
    color: var(--imma-muted);
    max-width: 640px;
    margin: 0 auto;
}

/* ---------- Barre d'outils : onglets + recherche ---------- */
.imma-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.imma-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.imma-tab {
    border: 1.5px solid var(--imma-line);
    background: var(--imma-card);
    color: var(--imma-ink);
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s ease;
}
.imma-tab:hover { border-color: var(--imma-green); color: var(--imma-green-dark); }
.imma-tab.is-active {
    background: var(--imma-green);
    border-color: var(--imma-green);
    color: #fff;
}
.imma-search { flex: 1; min-width: 220px; max-width: 340px; }
.imma-search input {
    width: 100%;
    padding: 10px 16px;
    border: 1.5px solid var(--imma-line);
    border-radius: 999px;
    font-size: 15px;
    background: var(--imma-card);
    color: var(--imma-ink);
}
.imma-search input:focus { outline: none; border-color: var(--imma-green); }

/* ---------- Chips categories ---------- */
.imma-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 26px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--imma-line);
}
.imma-chip {
    --chip: var(--imma-muted);
    border: 1.5px solid var(--imma-line);
    background: var(--imma-card);
    color: var(--imma-ink);
    padding: 6px 13px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all .15s ease;
}
.imma-chip:hover { border-color: var(--chip); }
.imma-chip.is-active {
    background: var(--chip);
    border-color: var(--chip);
    color: #fff;
}

/* ---------- Grille de cartes ---------- */
.imma-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
.imma-card {
    --cat: var(--imma-green);
    position: relative;
    background: var(--imma-card);
    border: 1px solid var(--imma-line);
    border-top: 4px solid var(--cat);
    border-radius: var(--imma-radius);
    padding: 20px;
    box-shadow: var(--imma-shadow);
    display: flex;
    flex-direction: column;
    transition: transform .18s ease, box-shadow .18s ease;
}
.imma-card:hover { transform: translateY(-3px); box-shadow: var(--imma-shadow-hover); }
.imma-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.imma-card-icon {
    font-size: 28px;
    width: 48px; height: 48px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--imma-cream); /* fallback navigateurs anciens */
    background: color-mix(in srgb, var(--cat) 13%, white);
    border-radius: 12px;
}
.imma-nature-badge {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 4px 10px;
    border-radius: 999px;
}
.imma-nb-regulier    { background: #E7F0EA; color: #3C6149; }
.imma-nb-ponctuel    { background: #FBEDE5; color: #B05E3D; }
.imma-nb-proposition { background: #EEE9F6; color: #6A589B; }

.imma-card-title { font-size: 20px; font-weight: 700; margin: 0 0 10px; color: var(--imma-ink); }
.imma-card-cycles { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.imma-cycle-chip {
    font-size: 13px;
    font-weight: 600;
    background: var(--imma-cream);
    color: var(--imma-muted);
    padding: 3px 9px;
    border-radius: 6px;
}
.imma-card-line { font-size: 14px; color: var(--imma-muted); margin-bottom: 5px; }
.imma-card-desc { font-size: 15px; color: var(--imma-ink); opacity: .85; margin: 10px 0 0; }
.imma-card-foot {
    margin-top: auto;
    padding-top: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.imma-tag-briefing {
    font-size: 12px; font-weight: 600;
    color: var(--imma-green-dark);
    background: #E7F0EA;
    padding: 3px 9px; border-radius: 6px;
}

/* ---------- Boutons ---------- */
.imma-cta {
    background: var(--imma-terra);
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s ease, transform .1s ease;
    white-space: nowrap;
}
.imma-cta:hover { background: var(--imma-terra-dark); }
.imma-cta:active { transform: scale(.98); }

.imma-empty, .imma-no-result {
    grid-column: 1 / -1;
    text-align: center;
    color: var(--imma-muted);
    padding: 40px 20px;
    font-size: 17px;
}

/* ---------- Modale ---------- */
.imma-modal { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 16px; }
.imma-modal[hidden] { display: none; }
.imma-modal-backdrop { position: absolute; inset: 0; background: rgba(35, 32, 29, .55); backdrop-filter: blur(2px); }
.imma-modal-box {
    position: relative;
    background: var(--imma-card);
    border-radius: 20px;
    width: 100%;
    max-width: 540px;
    max-height: 92vh;
    overflow-y: auto;
    padding: 28px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
    animation: imma-pop .2s ease;
}
@keyframes imma-pop { from { transform: translateY(12px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.imma-modal-close {
    position: absolute; top: 14px; right: 16px;
    background: none; border: none; font-size: 28px; line-height: 1;
    color: var(--imma-muted); cursor: pointer;
}
.imma-modal-close:hover { color: var(--imma-ink); }
.imma-modal-mission { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; padding-right: 30px; }
.imma-modal-icon { font-size: 28px; }
.imma-modal-mission h3 { margin: 0; font-size: 22px; font-weight: 800; color: var(--imma-green-dark); }
.imma-modal-recap {
    font-size: 15px;
    color: var(--imma-muted);
    background: var(--imma-cream);
    border-radius: 10px;
    padding: 12px 14px;
    margin: 14px 0 18px;
}
.imma-modal-recap:empty { display: none; }
.imma-modal-recap .imma-recap-briefing { display:block; margin-top:8px; color: var(--imma-green-dark); font-weight:600; }

/* ---------- Champs de formulaire ---------- */
.imma-field { margin-bottom: 14px; }
.imma-field-row { display: flex; gap: 14px; }
.imma-field-row .imma-field { flex: 1; }
.imma-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 5px; color: var(--imma-ink); }
.imma-field input, .imma-field select, .imma-field textarea {
    width: 100%;
    padding: 10px 13px;
    border: 1.5px solid var(--imma-line);
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    color: var(--imma-ink);
    background: #fff;
}
.imma-field input:focus, .imma-field select:focus, .imma-field textarea:focus {
    outline: none; border-color: var(--imma-green);
}
.imma-submit { width: 100%; margin-top: 6px; padding: 13px; font-size: 16px; }
.imma-form-error {
    color: #B0322B; background: #FBEAE8; border-radius: 8px;
    padding: 10px 13px; font-size: 15px; margin: 0 0 12px;
}

/* ---------- Succes ---------- */
.imma-modal-success { text-align: center; padding: 20px 6px; }
.imma-success-icon {
    width: 64px; height: 64px; margin: 0 auto 16px;
    background: var(--imma-green); color: #fff;
    border-radius: 50%; font-size: 32px;
    display: flex; align-items: center; justify-content: center;
    animation: imma-pop .3s ease;
}
.imma-success-msg { font-size: 17px; line-height: 1.6; margin: 0 0 20px; }

/* ---------- Mon espace ---------- */
.imma-email-form {
    background: var(--imma-card);
    border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius);
    padding: 22px;
    box-shadow: var(--imma-shadow);
    margin-bottom: 26px;
}
.imma-email-form label { display: block; font-weight: 600; margin-bottom: 8px; }
.imma-email-row { display: flex; gap: 10px; flex-wrap: wrap; }
.imma-email-row input { flex: 1; min-width: 220px; padding: 11px 14px; border: 1.5px solid var(--imma-line); border-radius: 10px; font-size: 15px; }
.imma-email-row input:focus { outline: none; border-color: var(--imma-green); }
.imma-section-title { font-size: 19px; color: var(--imma-green-dark); margin: 0 0 14px; }
.imma-espace-list { display: flex; flex-direction: column; gap: 12px; }
.imma-espace-item {
    --cat: var(--imma-green);
    background: var(--imma-card);
    border: 1px solid var(--imma-line);
    border-left: 4px solid var(--cat);
    border-radius: 12px;
    padding: 14px 18px;
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    box-shadow: var(--imma-shadow);
}
.imma-espace-main { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; flex: 1; }
.imma-espace-main:hover strong { color: var(--imma-green-dark); text-decoration: underline; }
.imma-espace-meta { font-size: 14px; color: var(--imma-muted); margin-top: 2px; }
.imma-cancel-link { color: var(--imma-terra-dark); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.imma-cancel-link:hover { text-decoration: underline; }

.imma-notice { border-radius: 10px; padding: 13px 16px; margin-bottom: 20px; font-size: 15px; }
.imma-notice-ok { background: #E7F0EA; color: var(--imma-green-dark); }

/* ---------- Sous-filtres : type + manque du monde ---------- */
.imma-subfilters {
    display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between;
    margin-bottom: 22px;
}
.imma-natures { display: flex; flex-wrap: wrap; gap: 6px; }
.imma-nat-btn {
    border: none; background: transparent; color: var(--imma-muted);
    padding: 6px 12px; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer;
}
.imma-nat-btn:hover { color: var(--imma-ink); background: var(--imma-cream); }
.imma-nat-btn.is-active { background: var(--imma-ink); color: #fff; }
.imma-needs-toggle {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 15px; font-weight: 600; color: var(--imma-terra-dark); cursor: pointer;
    background: #FBEDE5; padding: 7px 13px; border-radius: 999px;
}
.imma-needs-toggle input { accent-color: var(--imma-terra); }

/* ---------- Capacite / jauge ---------- */
.imma-capacity { margin: 12px 0 4px; }
.imma-gauge-bar {
    height: 7px; background: var(--imma-line); border-radius: 999px; overflow: hidden; margin-bottom: 5px;
}
.imma-gauge-bar span { display: block; height: 100%; background: var(--imma-green); border-radius: 999px; }
.imma-cap-label { font-size: 13px; font-weight: 600; color: var(--imma-muted); }
.imma-cap-done { font-style: italic; }
.imma-foot-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.imma-tag-needs {
    font-size: 12px; font-weight: 700; color: #fff; background: var(--imma-terra);
    padding: 3px 9px; border-radius: 6px;
}

/* ---------- Creneaux dans la modale ---------- */
.imma-modal-slots { margin: 4px 0 18px; }
.imma-slots-intro { font-size: 15px; font-weight: 600; margin: 0 0 8px; }
.imma-slots { margin: 4px 0 18px; }
.imma-slots-month { font-weight: 700; color: var(--imma-green-dark); font-size: 15px; margin: 16px 0 8px; }
.imma-slots-month:first-of-type { margin-top: 0; }
.imma-slots-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; margin-bottom: 6px; }
.imma-slot {
    display: flex; align-items: center; gap: 10px;
    border: 1.5px solid var(--imma-line); border-radius: 10px; padding: 9px 12px; cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}
.imma-slot:hover { border-color: var(--imma-green); }
.imma-slot input { accent-color: var(--imma-green); }
.imma-slot-label { flex: 1; font-weight: 600; font-size: 15px; }
.imma-slot-state { font-size: 12px; color: var(--imma-green-dark); font-weight: 600; white-space: nowrap; }
.imma-slot.is-selected { background: #E7F0EA; border-color: var(--imma-green); }
.imma-slot.is-full { opacity: .55; cursor: not-allowed; background: var(--imma-cream); }
.imma-slot.is-full .imma-slot-state { color: var(--imma-muted); }

/* ---------- Page de soumission ---------- */
.imma-submit-page, .imma-contact-page { max-width: 720px; }
.imma-request-form {
    background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: var(--imma-radius);
    padding: 26px; box-shadow: var(--imma-shadow);
}
.imma-checks { display: flex; flex-wrap: wrap; gap: 14px; }
.imma-check { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; }
.imma-check input { accent-color: var(--imma-green); }
.imma-sep { border: none; border-top: 1px solid var(--imma-line); margin: 22px 0; }
.imma-hint { font-size: 13px; color: var(--imma-muted); margin: 8px 0 0; font-style: italic; }
.imma-submit-success {
    background: #E7F0EA; border-radius: var(--imma-radius); padding: 28px; text-align: center; margin-bottom: 20px;
}
.imma-submit-page .imma-field, .imma-contact-page .imma-field { margin-bottom: 14px; }
.imma-submit-page .imma-submit, .imma-contact-page .imma-submit { width: 100%; margin-top: 8px; padding: 13px; }

/* ---------- Badges NOUVEAU / delai + compteur agrandi ---------- */
.imma-head-badges { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.imma-badge-new {
    font-size: 11px; font-weight: 800; letter-spacing: .05em;
    background: var(--imma-terra); color: #fff; padding: 3px 8px; border-radius: 6px;
}
.imma-card-delay {
    display: inline-block; font-size: 13px; font-weight: 700; color: var(--imma-terra-dark);
    background: #FBEDE5; padding: 3px 10px; border-radius: 999px; margin-bottom: 10px;
}
.imma-card-title a { color: inherit; text-decoration: none; }
.imma-card-title a:hover { color: var(--imma-green-dark); text-decoration: underline; }
.imma-cap-label { font-size: 15px; }
.imma-cap-num { font-size: 18px; font-weight: 800; color: var(--imma-green-dark); }
.imma-detail-link {
    display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 600;
    color: var(--imma-green-dark); text-decoration: none;
}
.imma-detail-link:hover { text-decoration: underline; }

/* ---------- Fiche detaillee ---------- */
.imma-event-detail { max-width: 780px; margin: 0 auto; color: var(--imma-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
.imma-back { display: inline-block; margin-bottom: 18px; color: var(--imma-muted); text-decoration: none; font-weight: 600; font-size: 15px; }
.imma-back:hover { color: var(--imma-green-dark); }
.imma-detail-head { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 18px; }
.imma-detail-icon {
    font-size: 32px; width: 64px; height: 64px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--imma-cream);
    background: color-mix(in srgb, var(--cat) 14%, white);
    border-radius: 16px;
}
.imma-detail-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.imma-badge-delay {
    font-size: 12px; font-weight: 700; color: var(--imma-terra-dark);
    background: #FBEDE5; padding: 3px 9px; border-radius: 999px;
}
.imma-detail-title { font-size: 28px; font-weight: 800; color: var(--imma-green-dark); margin: 0 0 10px; line-height: 1.2; }
.imma-detail-meta { display: flex; flex-direction: column; gap: 6px; font-size: 15px; margin-bottom: 18px; }
.imma-detail-meta div { color: var(--imma-muted); }
.imma-detail-meta strong { color: var(--imma-ink); }
.imma-detail-capacity {
    display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
    background: var(--imma-cream); border-radius: 14px; padding: 18px 22px; margin-bottom: 20px;
}
.imma-big-count { font-size: 34px; font-weight: 800; color: var(--imma-green-dark); line-height: 1; }
.imma-big-sep { opacity: .4; margin: 0 2px; }
.imma-big-label { font-size: 16px; color: var(--imma-muted); font-weight: 600; }
.imma-detail-capacity .imma-tag-briefing { margin-left: auto; }
.imma-detail-desc { font-size: 16px; line-height: 1.65; margin-bottom: 4px; }
.imma-detail-section { border-top: 1px solid var(--imma-line); padding-top: 22px; margin-top: 22px; }
.imma-detail-section h3 { font-size: 19px; color: var(--imma-green-dark); margin: 0 0 14px; }
.imma-detail-section .imma-signup-form { background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: 14px; padding: 20px; }
.imma-detail-section .imma-submit { width: 100%; margin-top: 6px; padding: 12px; }
.imma-detail-success { background: #E7F0EA; border-radius: 14px; padding: 24px; text-align: center; margin-bottom: 16px; }
.imma-muted { color: var(--imma-muted); }
.imma-inscrits { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.imma-inscrits li {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: 10px; padding: 10px 14px;
}
.imma-inscrit-name { font-weight: 600; }
.imma-inscrit-slot { font-size: 13px; color: var(--imma-muted); }
.imma-comments-list { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.imma-comment { background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: 12px; padding: 14px 16px; }
.imma-comment-head { font-size: 14px; margin-bottom: 4px; }
.imma-comment-head span { color: var(--imma-muted); margin-left: 6px; }
.imma-comment-body { font-size: 15px; line-height: 1.55; }
.imma-comment-form { background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: 14px; padding: 20px; }
.imma-comment-form .imma-submit { width: auto; padding: 10px 20px; }

/* ---------- Calendrier des creneaux (demandes recurrentes) ---------- */
.imma-calendar { margin: 4px 0 18px; }
.imma-cal-legend { display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; color: var(--imma-muted); margin-bottom: 14px; }
.imma-cal-legend i { display: inline-block; width: 13px; height: 13px; border-radius: 4px; vertical-align: -2px; margin-right: 5px; }
.imma-leg.free { background: #E7F0EA; border: 1.5px solid var(--imma-green); }
.imma-leg.sel  { background: var(--imma-green); }
.imma-leg.full { background: var(--imma-line); }
.imma-cal-month { margin-bottom: 22px; max-width: 470px; }
.imma-cal-title { font-weight: 700; color: var(--imma-green-dark); margin-bottom: 10px; font-size: 18px; }
.imma-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.imma-cal-wd { text-align: center; font-size: 13px; font-weight: 700; color: var(--imma-muted); padding-bottom: 4px; }
.imma-cal-cell {
    min-height: 60px; border-radius: 9px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    position: relative; line-height: 1.2;
}
.imma-cal-cell.blank { visibility: hidden; min-height: 0; }
.imma-cal-cell.empty { color: #cabfb0; }
.imma-cal-cell.empty .imma-cal-num { font-weight: 500; }
.imma-cal-num { font-weight: 700; font-size: 16px; }
.imma-cal-time { font-size: 12px; color: var(--imma-muted); margin-top: 2px; }
.imma-cal-state { font-size: 12px; font-weight: 700; margin-top: 2px; }
.imma-cal-cell input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.imma-cal-cell.has-slot.is-free {
    background: #E7F0EA; border: 1.5px solid var(--imma-green); color: var(--imma-green-dark); cursor: pointer;
}
.imma-cal-cell.has-slot.is-free:hover { background: #d6e6db; }
.imma-cal-cell.has-slot.is-free .imma-cal-state { color: var(--imma-green); }
.imma-cal-cell.has-slot.is-selected { background: var(--imma-green); border-color: var(--imma-green); color: #fff; }
.imma-cal-cell.has-slot.is-selected .imma-cal-num { color: #fff; }
.imma-cal-cell.has-slot.is-selected .imma-cal-time,
.imma-cal-cell.has-slot.is-selected .imma-cal-state { color: #fff; }
.imma-cal-cell.has-slot.is-full { background: var(--imma-line); color: var(--imma-muted); cursor: not-allowed; }
.imma-cal-cell.has-slot.is-full .imma-cal-state { color: var(--imma-muted); }

/* ---------- Mon espace : suivi des heures ---------- */
.imma-hours-block {
    background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: var(--imma-radius);
    padding: 22px; box-shadow: var(--imma-shadow); margin-bottom: 24px;
}
.imma-hours-cards { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 14px; }
.imma-hours-card { flex: 1; min-width: 120px; background: var(--imma-cream); border-radius: 12px; padding: 14px 16px; text-align: center; }
.imma-hours-card.imma-hours-accent { background: #FBEDE5; }
.imma-hours-num { display: block; font-size: 28px; font-weight: 800; color: var(--imma-green-dark); line-height: 1.1; }
.imma-hours-accent .imma-hours-num { color: var(--imma-terra-dark); }
.imma-hours-lbl { display: block; font-size: 13px; color: var(--imma-muted); margin-top: 4px; }
.imma-hours-bar { height: 10px; background: var(--imma-line); border-radius: 999px; overflow: hidden; margin-bottom: 8px; }
.imma-hours-bar span { display: block; height: 100%; background: var(--imma-green); border-radius: 999px; }
.imma-hours-foot { font-size: 13px; color: var(--imma-muted); margin: 0; }
.imma-hours-table { width: 100%; border-collapse: collapse; margin-top: 18px; font-size: 14px; }
.imma-hours-table th, .imma-hours-table td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--imma-line); }
.imma-hours-table thead th { font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: var(--imma-muted); font-weight: 700; }
.imma-hours-table .imma-hours-cell { text-align: right; font-weight: 700; white-space: nowrap; }
.imma-hours-table tfoot td { font-weight: 800; color: var(--imma-green-dark); border-top: 2px solid var(--imma-green); border-bottom: none; font-size: 15px; }
.imma-hours-help { font-size: 13px; color: var(--imma-muted); margin: 16px 0 6px; }
.imma-done-cell { white-space: nowrap; }
.imma-done-input { width: 62px; padding: 5px 7px; border: 1.5px solid var(--imma-line); border-radius: 6px; font-size: 14px; text-align: right; }
.imma-done-input:focus { outline: none; border-color: var(--imma-green); }
.imma-done-save {
    border: none; background: var(--imma-green); color: #fff; border-radius: 6px;
    width: 28px; height: 28px; cursor: pointer; font-weight: 700; margin-left: 5px; vertical-align: middle;
}
.imma-done-save:hover { background: var(--imma-green-dark); }
.imma-done-save.is-saved { background: var(--imma-green-dark); }

/* Bouton « mon espace » (catalogue / annuaire) */
.imma-espace-cta-wrap { text-align: center; margin-top: 14px; }
.imma-espace-cta {
    display: inline-block; text-decoration: none; font-weight: 700; font-size: 15px;
    color: var(--imma-green-dark); background: var(--imma-card); border: 1.5px solid var(--imma-green);
    padding: 9px 18px; border-radius: 999px; transition: background .15s ease;
}
.imma-espace-cta:hover { background: #E7F0EA; }

/* ---------- Mon espace : prochains evenements ---------- */
.imma-upcoming { margin-top: 28px; }
.imma-upcoming-list { display: flex; flex-direction: column; gap: 10px; }
.imma-upcoming-item {
    --cat: var(--imma-green);
    display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--imma-ink);
    background: var(--imma-card); border: 1px solid var(--imma-line); border-left: 4px solid var(--cat);
    border-radius: 12px; padding: 12px 16px; transition: box-shadow .15s ease, transform .15s ease;
}
.imma-upcoming-item:hover { box-shadow: var(--imma-shadow-hover); transform: translateX(2px); }
.imma-upcoming-main { flex: 1; display: flex; flex-direction: column; }
.imma-upcoming-main strong { font-size: 15px; }
.imma-upcoming-meta { font-size: 13px; color: var(--imma-muted); }
.imma-upcoming-cta { font-size: 14px; font-weight: 700; color: var(--imma-green-dark); white-space: nowrap; }

/* ---------- Navigation entre pages thematiques ---------- */
.imma-pagenav { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 22px; }
.imma-pagenav-link {
    text-decoration: none; font-size: 14px; font-weight: 700;
    color: var(--imma-green-dark); background: var(--imma-card);
    border: 1.5px solid var(--imma-line); padding: 7px 15px; border-radius: 999px;
    transition: all .15s ease;
}
.imma-pagenav-link:hover { border-color: var(--imma-green); background: #E7F0EA; }
.imma-pagenav-link.is-current { background: var(--imma-green); border-color: var(--imma-green); color: #fff; }

/* ---------- Page d'accueil ---------- */
.imma-accueil { max-width: 1000px; margin: 0 auto; }
.imma-accueil-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.imma-accueil-card {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
    text-decoration: none; color: var(--imma-ink);
    background: var(--imma-card); border: 1px solid var(--imma-line); border-radius: var(--imma-radius);
    padding: 22px; box-shadow: var(--imma-shadow); transition: transform .18s ease, box-shadow .18s ease;
}
.imma-accueil-card:hover { transform: translateY(-3px); box-shadow: var(--imma-shadow-hover); }
.imma-accueil-icon { font-size: 34px; line-height: 1; }
.imma-accueil-label { font-size: 18px; font-weight: 800; color: var(--imma-green-dark); }
.imma-accueil-desc { font-size: 14px; color: var(--imma-muted); }

/* ---------- Responsive ---------- */
@media (max-width: 560px) {
    .imma-cal-state { display: none; }
    .imma-cal-time { font-size: 10px; }
    .imma-cal-grid { gap: 3px; }
    .imma-cal-num { font-size: 15px; }
    .imma-field-row { flex-direction: column; gap: 0; }
    .imma-toolbar { flex-direction: column; align-items: stretch; }
    .imma-search { max-width: none; }
    .imma-modal-box { padding: 22px 18px; }
}

/* =========================================================
   Garde-fou lisibilite : force les tailles du catalogue meme
   si le theme essaie de les reduire (priorite maximale).
   ========================================================= */
.imma-catalogue .imma-cat-intro { font-size: 17px !important; line-height: 1.55 !important; }
.imma-catalogue .imma-tab,
.imma-catalogue .imma-chip,
.imma-catalogue .imma-nat-btn,
.imma-catalogue .imma-needs-toggle { font-size: 14px !important; }
.imma-catalogue .imma-search input { font-size: 15px !important; }
.imma-catalogue .imma-card-title,
.imma-catalogue .imma-card-title a { font-size: 20px !important; line-height: 1.3 !important; }
.imma-catalogue .imma-card-line { font-size: 15px !important; }
.imma-catalogue .imma-card-desc { font-size: 15px !important; line-height: 1.5 !important; }
.imma-catalogue .imma-cycle-chip { font-size: 13px !important; }
.imma-catalogue .imma-card-delay { font-size: 13px !important; }
.imma-catalogue .imma-cap-label { font-size: 15px !important; }
.imma-catalogue .imma-cap-num { font-size: 18px !important; }
.imma-catalogue .imma-nature-badge,
.imma-catalogue .imma-badge-new,
.imma-catalogue .imma-tag-needs,
.imma-catalogue .imma-tag-briefing { font-size: 12px !important; }
.imma-catalogue .imma-cta { font-size: 15px !important; }
.imma-catalogue .imma-detail-link { font-size: 14px !important; }

/* =========================================================
   v1.14 :: CALENDRIER, ESPACE COORDINATION, EQUIPE EDUCATIVE
   ========================================================= */

/* ---------- Ecran de saisie de la cle ---------- */
.imma-gate { max-width: 460px; margin: 40px auto; }
.imma-gate-card {
    background: var(--imma-card);
    border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius);
    box-shadow: var(--imma-shadow);
    padding: 34px 30px;
    text-align: center;
}
.imma-gate-icon { font-size: 38px; line-height: 1; margin-bottom: 10px; }
.imma-gate-title { font-size: 23px; font-weight: 800; color: var(--imma-green-dark); margin: 0 0 8px; }
.imma-gate-intro { font-size: 15px; color: var(--imma-muted); margin: 0 0 20px; }
.imma-gate-error {
    background: #FBEAE5; color: #9C3A1B; border: 1px solid #E9C3B6;
    border-radius: 10px; padding: 10px 12px; font-size: 14px; margin: 0 0 16px;
}
.imma-gate-form label {
    display: block; text-align: left; font-size: 14px;
    font-weight: 600; margin-bottom: 5px;
}
.imma-gate-form input {
    width: 100%; padding: 11px 13px; font-size: 16px;
    border: 1px solid var(--imma-line); border-radius: 10px;
    background: #fff; color: var(--imma-ink); margin-bottom: 14px;
}
.imma-gate-form input:focus { outline: none; border-color: var(--imma-green); }
.imma-gate-form .imma-cta { width: 100%; }
.imma-gate-hint { font-size: 13px; color: var(--imma-muted); margin: 18px 0 0; line-height: 1.5; }
.imma-gate-logout { text-align: center; margin-top: 30px; font-size: 13px; }
.imma-gate-logout a { color: var(--imma-muted); }

/* ---------- Calendrier ---------- */
.imma-mois-bar {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; margin: 18px 0 6px; flex-wrap: wrap;
}
.imma-mois-titre {
    font-size: 22px !important; font-weight: 800; color: var(--imma-green-dark);
    margin: 0; text-align: center; flex: 1;
}
.imma-mois-nav {
    font-size: 14px; font-weight: 600; color: var(--imma-green-dark);
    text-decoration: none; padding: 8px 12px; border-radius: 9px;
    border: 1px solid var(--imma-line); background: var(--imma-card); white-space: nowrap;
}
.imma-mois-nav:hover { background: var(--imma-cream); }
.imma-mois-retour { text-align: center; font-size: 13px; margin: 0 0 16px; }
.imma-mois-retour a { color: var(--imma-muted); }

.imma-mois-grille-wrap { overflow-x: auto; margin-bottom: 28px; }
.imma-mois-grille {
    /* display explicite : une regle de theme (ou du plugin) ne doit pas
       pouvoir transformer ce tableau en grille ou en bloc. */
    display: table; width: 100%; border-collapse: collapse;
    table-layout: fixed; min-width: 680px;
}
.imma-mois-grille thead { display: table-header-group; }
.imma-mois-grille tbody { display: table-row-group; }
.imma-mois-grille tr    { display: table-row; }
.imma-mois-grille th,
.imma-mois-grille td    { display: table-cell; }
.imma-mois-grille th {
    font-size: 12px !important; text-transform: uppercase; letter-spacing: .06em;
    color: var(--imma-muted); font-weight: 700; padding: 8px 4px; text-align: center;
    border-bottom: 1px solid var(--imma-line);
}
.imma-mois-case {
    vertical-align: top; border: 1px solid var(--imma-line);
    height: 104px; padding: 5px; background: var(--imma-card);
}
.imma-mois-case.is-empty { background: transparent; border-color: transparent; }
.imma-mois-case.is-today { background: var(--imma-cream); box-shadow: inset 0 0 0 2px var(--imma-green); }
.imma-mois-jour { display: block; font-size: 13px !important; font-weight: 700; color: var(--imma-muted); margin-bottom: 4px; }
.imma-mois-case.is-today .imma-mois-jour { color: var(--imma-green-dark); }

.imma-mois-puce {
    display: block; text-decoration: none; font-size: 12px !important; line-height: 1.3;
    padding: 4px 6px; margin-bottom: 3px; border-radius: 7px;
    background: var(--imma-cream);
    border-left: 3px solid var(--imma-chip, #4C7A5D);
    color: var(--imma-ink);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.imma-mois-puce:hover { background: #EFE7DA; }
.imma-mois-puce.is-full { opacity: .62; }
.imma-mois-puce.is-past { opacity: .45; }
.imma-mois-puce.is-draft { border-left-style: dashed; font-style: italic; }
.imma-mois-puce-heure { font-weight: 700; margin-right: 3px; }
.imma-mois-puce-nb { font-weight: 700; margin-left: 4px; }

/* Liste detaillee du mois */
.imma-mois-liste-titre {
    font-size: 18px !important; font-weight: 800; color: var(--imma-green-dark);
    margin: 0 0 14px;
}
.imma-mois-bloc { margin-bottom: 18px; }
.imma-mois-bloc-titre {
    font-size: 15px !important; font-weight: 700; color: var(--imma-ink);
    margin: 0 0 7px; padding-bottom: 5px; border-bottom: 1px solid var(--imma-line);
}
.imma-mois-items { list-style: none; margin: 0; padding: 0; }
.imma-mois-item {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 9px 4px; border-bottom: 1px solid var(--imma-line);
}
.imma-mois-item:last-child { border-bottom: none; }
.imma-mois-item.is-past { opacity: .55; }
.imma-mois-item-point {
    width: 10px; height: 10px; border-radius: 50%; flex: none; margin-top: 6px;
}
.imma-mois-item-corps { flex: 1; min-width: 0; }
.imma-mois-item-corps a { font-size: 15px; font-weight: 600; color: var(--imma-green-dark); text-decoration: none; }
.imma-mois-item-corps a:hover { text-decoration: underline; }
.imma-mois-item-meta { display: block; font-size: 13px; color: var(--imma-muted); margin-top: 2px; }
.imma-mois-item-etat { flex: none; }
.imma-mois-badge {
    display: inline-block; font-size: 12px !important; font-weight: 700;
    padding: 3px 9px; border-radius: 999px; white-space: nowrap;
    background: var(--imma-cream); color: var(--imma-muted); border: 1px solid var(--imma-line);
}
.imma-mois-badge.is-missing { background: #FDF0E7; color: #A9542F; border-color: #EFD3C2; }
.imma-mois-badge.is-full { background: #E9F1EB; color: var(--imma-green-dark); border-color: #CFE0D5; }
.imma-mois-badge.is-draft { background: #F1EEF8; color: #5B4B94; border-color: #DCD4EE; }
.imma-mois-legende { font-size: 14px; color: var(--imma-muted); text-align: center; margin-top: 22px; }

/* ---------- Espace coordination ---------- */
.imma-coord-head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 16px; flex-wrap: wrap; margin-bottom: 18px;
}
.imma-coord-title { font-size: 28px !important; font-weight: 800; color: var(--imma-green-dark); margin: 0; }
.imma-coord-sub { font-size: 14px; color: var(--imma-muted); margin: 4px 0 0; }
.imma-coord-logout { font-size: 13px; color: var(--imma-muted); text-decoration: underline; }

.imma-coord-tabs {
    display: flex; gap: 4px; flex-wrap: wrap;
    border-bottom: 2px solid var(--imma-line); margin-bottom: 20px;
}
.imma-coord-tab {
    font-size: 15px; font-weight: 600; text-decoration: none;
    color: var(--imma-muted); padding: 10px 15px;
    border-radius: 10px 10px 0 0; margin-bottom: -2px;
    border-bottom: 2px solid transparent;
}
.imma-coord-tab:hover { color: var(--imma-ink); background: var(--imma-cream); }
.imma-coord-tab.is-active { color: var(--imma-green-dark); border-bottom-color: var(--imma-green); background: var(--imma-cream); }

.imma-coord-notice {
    border-radius: 10px; padding: 11px 14px; font-size: 15px; margin: 0 0 18px; font-weight: 600;
}
.imma-coord-notice.is-ok { background: #E9F1EB; color: var(--imma-green-dark); border: 1px solid #CFE0D5; }
.imma-coord-notice.is-error { background: #FBEAE5; color: #9C3A1B; border: 1px solid #E9C3B6; }

.imma-coord-intro, .imma-coord-help { font-size: 14px; color: var(--imma-muted); margin: 0 0 16px; line-height: 1.55; }
.imma-coord-h3 { font-size: 19px !important; font-weight: 800; color: var(--imma-green-dark); margin: 26px 0 10px; }
.imma-coord-period { font-size: 13px; color: var(--imma-muted); margin: 0 0 8px; }
.imma-coord-export { margin-left: 8px; font-weight: 600; color: var(--imma-green-dark); }

.imma-coord-kpis {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 12px; margin-bottom: 16px;
}
.imma-kpi {
    background: var(--imma-card); border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius); padding: 16px 14px; text-align: center;
    box-shadow: var(--imma-shadow);
}
.imma-kpi.is-warn { background: #FDF6F1; border-color: #EFD3C2; }
.imma-kpi-num { display: block; font-size: 27px; font-weight: 800; color: var(--imma-green-dark); line-height: 1.1; }
.imma-kpi.is-warn .imma-kpi-num { color: var(--imma-terra-dark); }
.imma-kpi-label { display: block; font-size: 13px; color: var(--imma-muted); margin-top: 5px; }

.imma-coord-upcoming { list-style: none; margin: 0; padding: 0; }
.imma-coord-upcoming li {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 9px 4px; border-bottom: 1px solid var(--imma-line); font-size: 15px;
}
.imma-coord-up-date { font-size: 13px; font-weight: 700; color: var(--imma-muted); min-width: 104px; }
.imma-coord-up-title { color: var(--imma-green-dark); text-decoration: none; font-weight: 600; flex: 1; }
.imma-coord-up-title:hover { text-decoration: underline; }

/* Tableaux */
.imma-coord-table-wrap { overflow-x: auto; }
.imma-coord-table { width: 100%; border-collapse: collapse; min-width: 640px; }
.imma-coord-table th {
    text-align: left; font-size: 12px !important; text-transform: uppercase;
    letter-spacing: .05em; color: var(--imma-muted); font-weight: 700;
    padding: 9px 10px; border-bottom: 2px solid var(--imma-line);
}
.imma-coord-table td {
    padding: 11px 10px; border-bottom: 1px solid var(--imma-line);
    font-size: 14px; vertical-align: top;
}
.imma-coord-table tr:hover td { background: var(--imma-cream); }
.imma-coord-link { color: var(--imma-green-dark); font-weight: 600; text-decoration: none; }
.imma-coord-link:hover { text-decoration: underline; }
.imma-coord-muted { display: block; font-size: 12px; color: var(--imma-muted); margin-top: 2px; }
.imma-coord-status { font-weight: 700; font-size: 13px; }
.imma-coord-status.is-publie { color: var(--imma-green-dark); }
.imma-coord-status.is-brouillon { color: #5B4B94; }
.imma-coord-status.is-archive { color: var(--imma-muted); }
.imma-coord-actions a {
    display: inline-block; font-size: 12px; font-weight: 600;
    color: var(--imma-green-dark); text-decoration: none;
    border: 1px solid var(--imma-line); border-radius: 7px;
    padding: 3px 8px; margin: 0 3px 3px 0; background: var(--imma-card);
}
.imma-coord-actions a:hover { background: var(--imma-cream); }

/* Gestion des categories / cycles / types / rythmes */
.imma-coord-section {
    background: var(--imma-card); border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius); padding: 20px 20px 22px; margin-bottom: 22px;
}
.imma-tax-row {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding: 8px 0; border-bottom: 1px solid var(--imma-line);
}
.imma-tax-row.is-new { border-bottom: none; border-top: 2px dashed var(--imma-line); margin-top: 8px; padding-top: 14px; }
.imma-tax-row input[type="text"], .imma-tax-row select {
    padding: 8px 10px; font-size: 14px; border: 1px solid var(--imma-line);
    border-radius: 8px; background: #fff; color: var(--imma-ink);
}
.imma-tax-row input:focus, .imma-tax-row select:focus { outline: none; border-color: var(--imma-green); }
.imma-tax-icon { width: 54px; text-align: center; font-size: 17px !important; }
.imma-tax-label { flex: 1; min-width: 150px; }
.imma-tax-slug { width: 130px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px !important; color: var(--imma-muted); }
.imma-tax-slug[readonly] { background: var(--imma-cream); }
.imma-tax-color { width: 42px; height: 36px; padding: 2px; border: 1px solid var(--imma-line); border-radius: 8px; background: #fff; }
.imma-tax-used { font-size: 12px; color: var(--imma-muted); min-width: 96px; }
.imma-tax-save, .imma-tax-add, .imma-tax-del {
    font-size: 13px; font-weight: 700; padding: 8px 13px;
    border-radius: 8px; border: 1px solid transparent; cursor: pointer;
}
.imma-tax-save { background: var(--imma-cream); color: var(--imma-green-dark); border-color: var(--imma-line); }
.imma-tax-save:hover { background: #EFE7DA; }
.imma-tax-add { background: var(--imma-green); color: #fff; }
.imma-tax-add:hover { background: var(--imma-green-dark); }
.imma-tax-del { background: transparent; color: #9C3A1B; border-color: #E9C3B6; }
.imma-tax-del:hover { background: #FBEAE5; }
.imma-tax-reassign { max-width: 190px; }
.imma-tax-reset { margin: 14px 0 0; font-size: 13px; }
.imma-tax-reset a { color: var(--imma-muted); }

.imma-tax-nature {
    border: 1px solid var(--imma-line); border-radius: 12px;
    padding: 15px; margin-bottom: 12px; background: var(--imma-cream);
}
.imma-tax-nature .imma-field input, .imma-tax-nature .imma-field textarea { background: #fff; }

/* ---------- Page de l'equipe educative ---------- */
.imma-educ-block {
    border: 1px solid var(--imma-line); border-radius: var(--imma-radius);
    padding: 18px 20px 20px; margin: 0 0 18px; background: var(--imma-card);
}
.imma-educ-block legend {
    font-size: 16px; font-weight: 800; color: var(--imma-green-dark);
    padding: 0 8px; margin-left: -8px;
}
.imma-radios { display: flex; flex-direction: column; gap: 9px; margin-bottom: 16px; }
.imma-radio {
    display: flex; align-items: flex-start; gap: 10px; cursor: pointer;
    border: 1px solid var(--imma-line); border-radius: 11px;
    padding: 11px 13px; background: var(--imma-cream);
}
.imma-radio:hover { border-color: var(--imma-green); }
.imma-radio input { margin-top: 3px; flex: none; }
.imma-radio span { display: block; font-size: 15px; }
.imma-radio small { display: block; font-size: 13px; color: var(--imma-muted); margin-top: 2px; font-weight: 400; }
.imma-educ-again { display: inline-block; margin-top: 12px; }

@media (max-width: 760px) {
    .imma-mois-grille-wrap { display: none; }
    .imma-coord-tabs { gap: 2px; }
    .imma-coord-tab { font-size: 14px; padding: 9px 11px; }
    .imma-tax-row { align-items: stretch; }
    .imma-tax-label, .imma-tax-slug, .imma-tax-reassign { width: 100%; max-width: none; flex: 1 1 100%; }
    .imma-coord-up-date { min-width: 0; }
}

/* =========================================================
   v1.15 :: ONGLETS A ICONES, BOUTON D'AJOUT, CARNET FAMILLES
   ========================================================= */

/* Onglets : l'icone au-dessus du libelle, pour garder des onglets compacts */
.imma-coord-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.imma-coord-tab-icone {
    font-size: 16px;
    line-height: 1;
    filter: grayscale(35%);
    transition: filter .15s ease;
}
.imma-coord-tab.is-active .imma-coord-tab-icone,
.imma-coord-tab:hover .imma-coord-tab-icone { filter: none; }

/* Bouton « Ajouter une participation parentale » */
.imma-coord-ajout { margin: 0 0 20px; }
.imma-coord-ajout .imma-cta { display: inline-block; }

/* Barre d'outils du carnet */
.imma-coord-outils {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    margin: 0 0 18px;
}
.imma-coord-outils .imma-tax-save { text-decoration: none; display: inline-block; }
.imma-coord-outils .imma-coord-muted { display: inline; margin: 0; }

/* Recherche dans le carnet */
.imma-coord-recherche {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin: 0 0 20px;
}
.imma-coord-recherche input[type="search"] {
    flex: 1; min-width: 200px;
    padding: 9px 13px; font-size: 15px;
    border: 1px solid var(--imma-line); border-radius: 9px;
    background: #fff; color: var(--imma-ink);
}
.imma-coord-recherche select {
    padding: 9px 11px; font-size: 14px;
    border: 1px solid var(--imma-line); border-radius: 9px; background: #fff;
}
.imma-coord-recherche input:focus,
.imma-coord-recherche select:focus { outline: none; border-color: var(--imma-green); }
.imma-coord-recherche .imma-tax-save { cursor: pointer; }

/* Une famille qu'on ne contacte plus reste lisible, mais s'efface */
.imma-coord-table tr.is-inactif td { opacity: .55; }
.imma-coord-table tr.is-inactif:hover td { opacity: 1; }

/* Le formulaire d'ajout d'une famille vit dans une section : champs sur fond clair */
.imma-coord-section .imma-field input,
.imma-coord-section .imma-field select,
.imma-coord-section .imma-field textarea {
    width: 100%;
    padding: 9px 12px; font-size: 15px;
    border: 1px solid var(--imma-line); border-radius: 9px;
    background: #fff; color: var(--imma-ink);
}
.imma-coord-section .imma-field input:focus,
.imma-coord-section .imma-field select:focus,
.imma-coord-section .imma-field textarea:focus { outline: none; border-color: var(--imma-green); }
.imma-coord-section code {
    background: var(--imma-cream); border: 1px solid var(--imma-line);
    border-radius: 5px; padding: 1px 5px; font-size: 13px;
}

@media (max-width: 760px) {
    /* Les libelles restent : l'icone est decorative (aria-hidden), la masquer
       priverait les onglets de tout nom accessible. On fait defiler a la place. */
    .imma-coord-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }
    .imma-coord-tab { white-space: nowrap; padding: 10px 12px; font-size: 14px; }
    .imma-coord-recherche input[type="search"] { flex: 1 1 100%; }
}

/* =========================================================
   v1.16 :: LE RYTHME A TENIR (remplace l'equivalent en euros)
   ========================================================= */
.imma-hours-rythme {
    font-size: 16px;
    line-height: 1.6;
    color: var(--imma-ink);
    background: var(--imma-cream);
    border-left: 4px solid var(--imma-terra);
    border-radius: 0 10px 10px 0;
    padding: 12px 16px;
    margin: 14px 0 10px;
}
.imma-hours-rythme strong { color: var(--imma-terra-dark); }
.imma-hours-atteint {
    font-size: 16px; font-weight: 700;
    color: var(--imma-green-dark);
    background: #E9F1EB; border: 1px solid #CFE0D5;
    border-radius: 10px; padding: 12px 16px; margin: 14px 0 10px;
}

/* =========================================================
   v1.17 :: JOINDRE LA COORDINATION (bas de page / menu)
   ========================================================= */

/* Le piege a robots : invisible a l'oeil, mais pas en display:none,
   que certains scripts reperent. */
.imma-hp {
    position: absolute;
    left: -9999px;
    width: 1px; height: 1px;
    overflow: hidden;
}

.imma-contact-success {
    background: #E9F1EB;
    border: 1px solid #CFE0D5;
    border-radius: var(--imma-radius);
    padding: 26px 22px;
    text-align: center;
}
.imma-contact-success .imma-success-msg {
    font-size: 16px;
    color: var(--imma-green-dark);
    margin: 10px 0 0;
}

.imma-contact-btn-wrap { display: inline-block; }
.imma-contact-btn {
    display: inline-block;
    padding: 9px 16px;
    border-radius: 999px;
    background: #4C7A5D;
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    line-height: 1.3;
}
.imma-contact-btn:hover { background: #3C6149; }

/* =========================================================
   v1.17 :: ESPACE COORDINATION (apercus, priorite, formulaires)
   ========================================================= */

/* Se mettre a la place d'un parent ou d'un demandeur, en un clic */
.imma-coord-apercu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 18px;
    font-size: 14px;
}
.imma-coord-apercu-label { color: var(--imma-muted); font-weight: 600; }
.imma-coord-apercu-lien {
    display: inline-block;
    padding: 6px 13px;
    border: 1px solid var(--imma-line);
    border-radius: 999px;
    background: #fff;
    color: var(--imma-green-dark);
    text-decoration: none;
    font-weight: 600;
}
.imma-coord-apercu-lien:hover { background: var(--imma-cream); border-color: var(--imma-green); }

/* Priorite : discrete, sauf quand elle monte */
.imma-coord-prio {
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-top: 2px;
}

/* L'action principale d'une ligne se distingue des autres */
.imma-coord-actions a.is-primary {
    background: var(--imma-green);
    color: #fff;
    border-color: var(--imma-green);
}
.imma-coord-actions a.is-primary:hover { background: var(--imma-green-dark); }
.imma-coord-actions a.imma-tax-del {
    color: #9C3A1B;
    border: none;
    background: none;
    cursor: pointer;
}
.imma-coord-actions a.imma-tax-del:hover { background: #FBEAE5; }

/* Formulaire de modification dans l'espace */
.imma-coord-h4 {
    font-size: 15px !important;
    font-weight: 800;
    color: var(--imma-green-dark);
    margin: 22px 0 8px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.imma-coord-form {
    background: var(--imma-cream);
    border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius);
    padding: 20px 22px;
    margin-bottom: 26px;
}
.imma-coord-form .imma-field input,
.imma-coord-form .imma-field select,
.imma-coord-form .imma-field textarea { background: #fff; }
.imma-coord-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin: 22px 0 0;
}
.imma-coord-form-actions .imma-coord-muted { display: inline; margin: 0; }

@media (max-width: 640px) {
    .imma-coord-form { padding: 16px 14px; }
    .imma-coord-apercu { font-size: 13px; }
}

/* =========================================================
   v1.18 :: JOURNAL, CRENEAUX, FRATRIE, VOLET, KANBAN
   ========================================================= */

/* ---------- Journal des modifications ---------- */
.imma-journal { list-style: none; margin: 0 0 18px; padding: 0; }
.imma-journal-item {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
    padding: 9px 0;
    border-bottom: 1px solid var(--imma-line);
    font-size: 14px;
}
.imma-journal-item:last-child { border-bottom: none; }
.imma-journal-icone { flex: 0 0 auto; font-size: 15px; }
.imma-journal-quoi { font-weight: 700; color: var(--imma-green-dark); text-decoration: none; }
a.imma-journal-quoi:hover { text-decoration: underline; }
.imma-journal-detail { color: var(--imma-ink); flex: 1 1 200px; }
.imma-journal-quand { font-size: 12px; color: var(--imma-muted); white-space: nowrap; }

/* ---------- Creneaux proposes au choix ---------- */
.imma-slots-editor { margin-bottom: 10px; }
.imma-slot-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--imma-line);
}
.imma-slot-row input[type="datetime-local"] { flex: 0 0 200px; }
.imma-slot-row input[type="text"] { flex: 1 1 160px; }
.imma-slot-row input[type="number"] { flex: 0 0 80px; }
.imma-slot-row input {
    padding: 8px 10px;
    border: 1px solid var(--imma-line);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}
.imma-slot-row input:focus { outline: none; border-color: var(--imma-green); }
.imma-slot-booked { font-size: 12px; color: var(--imma-muted); }
.imma-slot-del, .imma-enfant-del {
    flex: 0 0 auto;
    background: none;
    border: none;
    color: var(--imma-muted);
    font-size: 15px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
}
.imma-slot-del:hover, .imma-enfant-del:hover { background: #FBEAE5; color: #9C3A1B; }

/* ---------- La fratrie d une famille ---------- */
.imma-field-titre {
    display: block;
    font-size: 14px;
    font-weight: 600;
    margin: 18px 0 5px;
    color: var(--imma-ink);
}
.imma-enfants-editor { margin-bottom: 8px; }
.imma-enfant-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
}
.imma-enfant-row input[type="text"] { flex: 1 1 180px; }
.imma-enfant-row select { flex: 0 0 200px; }
.imma-enfant-row input, .imma-enfant-row select {
    padding: 8px 10px;
    border: 1px solid var(--imma-line);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}
.imma-enfant-row input:focus, .imma-enfant-row select:focus { outline: none; border-color: var(--imma-green); }

/* ---------- Le volet de droite (apercu / correction) ---------- */
.imma-avec-volet { display: block; }
.imma-avec-volet.a-volet { display: grid; grid-template-columns: 1fr 340px; gap: 20px; align-items: start; }
.imma-ligne-cliquable.is-ouverte td { background: var(--imma-cream); box-shadow: inset 3px 0 0 var(--imma-green); }
.imma-volet {
    background: var(--imma-cream);
    border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius);
    padding: 18px;
    position: sticky;
    top: 20px;
}
.imma-volet-tete { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.imma-volet-titre { font-size: 18px !important; font-weight: 800; color: var(--imma-green-dark); margin: 0; }
.imma-volet-fermer { font-size: 16px; color: var(--imma-muted); text-decoration: none; line-height: 1; padding: 2px 6px; }
.imma-volet-fermer:hover { color: var(--imma-ink); }
.imma-volet-sous { margin: 4px 0 0; font-size: 14px; }
.imma-volet-meta { margin: 6px 0 14px; font-size: 12px; color: var(--imma-muted); }
.imma-volet .imma-field input, .imma-volet .imma-field select, .imma-volet .imma-field textarea { background: #fff; }
.imma-volet-actions {
    display: flex; flex-wrap: wrap; gap: 14px;
    margin: 16px 0 0; padding-top: 14px;
    border-top: 1px solid var(--imma-line);
    font-size: 13px;
}
.imma-volet-actions a { color: var(--imma-muted); }
.imma-volet-actions a.imma-tax-del { color: #9C3A1B; }

/* ---------- Le tableau des participations sans date ---------- */
.imma-kanban {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
    margin-bottom: 24px;
}
.imma-kanban-col {
    background: var(--imma-cream);
    border: 1px solid var(--imma-line);
    border-radius: var(--imma-radius);
    padding: 14px;
}
.imma-kanban-tete { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.imma-kanban-titre { font-size: 14px; font-weight: 800; color: var(--imma-green-dark); }
.imma-kanban-nb {
    font-size: 12px; font-weight: 700; color: var(--imma-muted);
    background: #fff; border-radius: 999px; padding: 2px 9px;
}
.imma-kanban-aide { font-size: 12px; color: var(--imma-muted); margin: 5px 0 12px; line-height: 1.45; }
.imma-kanban-vide { color: var(--imma-line); text-align: center; margin: 10px 0; }
.imma-kanban-carte {
    display: block;
    background: #fff;
    border: 1px solid var(--imma-line);
    border-left: 4px solid var(--imma-muted);
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 8px;
    text-decoration: none;
    color: var(--imma-ink);
}
.imma-kanban-carte:hover { box-shadow: var(--imma-shadow); transform: translateY(-1px); }
.imma-kanban-carte-titre { display: block; font-size: 14px; font-weight: 600; line-height: 1.35; }
.imma-kanban-carte-bas { display: block; font-size: 12px; color: var(--imma-muted); margin-top: 4px; }
.imma-kanban-prio { font-weight: 800; }

/* ---------- Confirmation de realisation ---------- */
.imma-coord-confirme, .imma-detail-confirme {
    background: #E9F1EB;
    border: 1px solid #CFE0D5;
    border-radius: 10px;
    padding: 12px 16px;
    font-size: 14px;
    color: var(--imma-green-dark);
    margin: 10px 0 18px;
}
.imma-coord-confirme a { color: var(--imma-muted); margin-left: 8px; font-size: 13px; }

/* ---------- Suivi cote equipe educative ---------- */
.imma-suivi-carte {
    background: #fff;
    border: 1px solid var(--imma-line);
    border-left: 4px solid var(--imma-green);
    border-radius: var(--imma-radius);
    padding: 16px 18px;
    margin-bottom: 14px;
}
.imma-suivi-tete { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; }
.imma-suivi-titre { font-size: 17px; font-weight: 700; color: var(--imma-green-dark); text-decoration: none; }
.imma-suivi-titre:hover { text-decoration: underline; }
.imma-suivi-compte { font-size: 12px; font-weight: 700; border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.imma-suivi-compte.is-missing { background: #FBF0E9; color: #9C3A1B; }
.imma-suivi-compte.is-full { background: #E9F1EB; color: var(--imma-green-dark); }
.imma-suivi-meta { font-size: 13px; color: var(--imma-muted); margin: 6px 0 10px; }
.imma-suivi-parents { list-style: none; margin: 0; padding: 0; }
.imma-suivi-parents li {
    font-size: 14px;
    padding: 6px 0;
    border-top: 1px solid var(--imma-line);
}
.imma-suivi-parents .imma-coord-muted { display: inline; margin: 0 6px 0 0; }

.imma-groupe-success {
    background: #E9F1EB; border: 1px solid #CFE0D5;
    border-radius: var(--imma-radius); padding: 26px 22px; text-align: center;
}
.imma-groupe-success .imma-success-msg { font-size: 16px; color: var(--imma-green-dark); margin: 10px 0 0; }

/* =========================================================
   v1.18 :: SUR UN TELEPHONE

   Les demandeurs et demandeuses remplissent souvent leur demande
   depuis la classe, sur un telephone. Tout ce qui est en colonnes
   ou en tableau doit redevenir lisible en une seule colonne.
   ========================================================= */
@media (max-width: 860px) {
    .imma-avec-volet.a-volet { grid-template-columns: 1fr; }
    .imma-volet { position: static; }
}

@media (max-width: 640px) {
    /* Les tableaux ne defilent plus : chaque ligne devient une fiche */
    .imma-coord-table-wrap { overflow-x: visible; }
    .imma-coord-table { min-width: 0; }
    .imma-coord-table thead { display: none; }
    .imma-coord-table, .imma-coord-table tbody, .imma-coord-table tr, .imma-coord-table td { display: block; width: 100%; }
    .imma-coord-table tr {
        background: #fff;
        border: 1px solid var(--imma-line);
        border-radius: 12px;
        padding: 12px 14px;
        margin-bottom: 12px;
    }
    .imma-coord-table td { border: none; padding: 4px 0; }
    .imma-coord-table td:first-child { font-size: 16px; }
    .imma-coord-table tr:hover td { background: transparent; }
    .imma-coord-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
    .imma-coord-actions a { margin: 0; }

    /* Les onglets defilent horizontalement plutot que de s empiler */
    .imma-coord-tabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }

    /* Une ligne de creneau, un enfant : une colonne, des champs pleine largeur */
    .imma-slot-row, .imma-enfant-row { flex-direction: column; align-items: stretch; }
    .imma-slot-row input, .imma-enfant-row input, .imma-enfant-row select { flex: 1 1 auto; width: 100%; }
    .imma-slot-del, .imma-enfant-del { align-self: flex-end; }

    /* La cible d un doigt, pas d une souris */
    .imma-coord-tab { padding: 12px 14px; }
    .imma-educ-page .imma-cta, .imma-contact-page .imma-cta { padding: 14px; font-size: 16px; }
    .imma-educ-page input, .imma-educ-page select, .imma-educ-page textarea,
    .imma-contact-page input, .imma-contact-page select, .imma-contact-page textarea {
        font-size: 16px; /* en dessous de 16px, iOS zoome tout seul au focus */
    }

    .imma-kanban { grid-template-columns: 1fr; }
    .imma-coord-recherche { flex-wrap: wrap; }
    .imma-coord-recherche input, .imma-coord-recherche select { flex: 1 1 100%; }
    .imma-suivi-tete { flex-direction: column; gap: 4px; }
    .imma-journal-item { gap: 6px; }
    .imma-journal-quand { white-space: normal; }
}

/* =========================================================
   v1.18.1 :: LE VOLET D APERCU D UNE PARTICIPATION

   Le volet de l onglet Participations porte plus de matiere que celui
   des inscriptions : identite, creneaux, inscrits, realisation, journal.
   Il defile sur lui-meme plutot que d etirer la page.
   ========================================================= */
.imma-volet {
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

.imma-volet-liste {
    margin: 0 0 6px;
    font-size: 14px;
}
.imma-volet-liste dt {
    font-size: 12px;
    font-weight: 700;
    color: var(--imma-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
    margin-top: 10px;
}
.imma-volet-liste dd {
    margin: 2px 0 0;
    line-height: 1.5;
}
.imma-volet-liste dd .imma-coord-muted { display: block; margin-top: 1px; }
.imma-volet-liste a { word-break: break-word; }

.imma-volet-creneaux,
.imma-volet-inscrits {
    list-style: none;
    margin: 0 0 6px;
    padding: 0;
    font-size: 14px;
}
.imma-volet-creneaux li,
.imma-volet-inscrits li {
    padding: 7px 0;
    border-bottom: 1px solid var(--imma-line);
    line-height: 1.45;
}
.imma-volet-creneaux li:last-child,
.imma-volet-inscrits li:last-child { border-bottom: none; }
.imma-volet-inscrits a { font-weight: 600; color: var(--imma-green-dark); }

.imma-volet .imma-coord-h4 { margin-top: 18px; }
.imma-volet .imma-coord-confirme { margin: 6px 0 0; padding: 10px 12px; font-size: 13px; }
.imma-volet .imma-journal-item { padding: 6px 0; font-size: 13px; }

/* Sur une ligne de tableau cliquable, le curseur le dit */
.imma-ligne-cliquable .imma-coord-link { cursor: pointer; }

@media (max-width: 860px) {
    .imma-volet { max-height: none; overflow-y: visible; }
}

/* =========================================================
   v1.19 :: LE VOLET ARRIVE SANS RECHARGER LA PAGE

   Le volet vit maintenant dans une zone toujours presente, que le
   JavaScript remplit. C est la zone qui colle en haut de l ecran, pas
   le volet : en grille, l element qui defile doit etre celui qui porte
   la hauteur de la colonne.
   ========================================================= */
.imma-volet-zone { min-width: 0; }

.imma-avec-volet.a-volet .imma-volet-zone {
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

/* Le volet lui-meme ne gere plus le defilement : sa zone s en charge. */
.imma-volet {
    max-height: none;
    overflow-y: visible;
    position: static;
}

/* Le temps que le volet arrive : une plaque calme, pas un clignotement. */
.imma-volet.is-chargement {
    color: var(--imma-muted);
    font-size: 14px;
    text-align: center;
    padding: 28px 18px;
}

@media (max-width: 860px) {
    .imma-avec-volet.a-volet .imma-volet-zone {
        position: static;
        max-height: none;
        overflow-y: visible;
    }
}

/* =========================================================
   v1.19.1 :: LE BOUTON APERCU

   Cliquer le titre pour ouvrir un apercu n etait pas devinable : le
   titre, on s attend a ce qu il mene a la fiche. L apercu a donc son
   propre bouton, en tete des actions.
   ========================================================= */
.imma-coord-actions a.is-apercu {
    background: #fff;
    border: 1px solid var(--imma-green);
    color: var(--imma-green-dark);
    font-weight: 600;
}
.imma-coord-actions a.is-apercu:hover {
    background: var(--imma-cream);
}

/* La ligne dont l apercu est ouvert garde son bouton en evidence */
.imma-ligne-cliquable.is-ouverte .imma-coord-actions a.is-apercu {
    background: var(--imma-green);
    border-color: var(--imma-green);
    color: #fff;
}

/* =========================================================
   v1.20 :: LES ADULTES D UN FOYER, ET L IMPORT GOOGLE
   ========================================================= */
.imma-adultes-editor { margin-bottom: 8px; }
.imma-adulte-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
}
.imma-adulte-row input[type="text"]:first-child { flex: 1 1 150px; }
.imma-adulte-row input[type="email"] { flex: 1 1 200px; }
.imma-adulte-row input[type="text"]:last-of-type { flex: 0 0 150px; }
.imma-adulte-row input {
    padding: 8px 10px;
    border: 1px solid var(--imma-line);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}
.imma-adulte-row input:focus { outline: none; border-color: var(--imma-green); }
.imma-adulte-del {
    flex: 0 0 auto;
    background: none; border: none;
    color: var(--imma-muted);
    font-size: 15px; cursor: pointer;
    padding: 4px 8px; border-radius: 6px;
}
.imma-adulte-del:hover { background: #FBEAE5; color: #9C3A1B; }

/* Ce que l import a prefere signaler plutot que deviner */
.imma-import-alertes {
    background: #FBF3E2;
    border: 1px solid #E8D9B0;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.55;
}
.imma-import-alertes ul { margin: 8px 0 0; padding-left: 20px; }
.imma-import-alertes li { margin: 3px 0; }

.imma-coord-form input[type="file"],
.imma-coord-section input[type="file"] {
    padding: 9px;
    border: 1px dashed var(--imma-line);
    border-radius: 8px;
    background: #fff;
    width: 100%;
    font-size: 14px;
}

@media (max-width: 640px) {
    .imma-adulte-row { flex-direction: column; align-items: stretch; }
    .imma-adulte-row input { flex: 1 1 auto; width: 100%; }
    .imma-adulte-del { align-self: flex-end; }
}

/* =========================================================
   v1.22 :: VALIDER CHAQUE DATE, ET SE METTRE A LA PLACE
   ========================================================= */

/* ---------- Une ligne par date, avec son bouton ---------- */
.imma-dates-liste { list-style: none; margin: 0 0 8px; padding: 0; font-size: 14px; }
.imma-date-ligne {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid var(--imma-line);
}
.imma-date-ligne:last-child { border-bottom: none; }
.imma-date-ligne.est-validee { opacity: .72; }
.imma-date-ligne.est-attente { background: #FBF3E2; border-radius: 8px; padding: 8px 10px; }

.imma-date-quand { flex: 1 1 120px; font-weight: 600; }
.imma-date-monde { font-size: 12px; color: var(--imma-muted); white-space: nowrap; }
.imma-date-etat  { font-size: 12px; white-space: nowrap; }

.imma-date-valider {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--imma-green);
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    white-space: nowrap;
}
.imma-date-valider:hover { background: var(--imma-green-dark); }
.imma-date-defaire { font-size: 12px; color: var(--imma-muted); }
.imma-date-defaire:hover { color: #9C3A1B; }

.imma-coord-attente {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 9px;
    border-radius: 999px;
    background: #FBF0E9;
    color: #9C3A1B;
    font-size: 11px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
}

/* ---------- Le bandeau « vous agissez a la place de » ---------- */
.imma-bandeau-coord {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    background: #FBF3E2;
    border: 1px solid #E8D9B0;
    border-radius: 12px;
    padding: 12px 16px;
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.5;
}
.imma-bandeau-icone { font-size: 17px; }
.imma-bandeau-retour {
    margin-left: auto;
    font-weight: 600;
    color: var(--imma-green-dark);
    white-space: nowrap;
}

@media (max-width: 640px) {
    .imma-date-ligne { align-items: flex-start; }
    .imma-date-quand { flex: 1 1 100%; }
    .imma-bandeau-retour { margin-left: 0; }
}

/* =========================================================
   v1.23 :: LE PRINCIPE, ET LES MODELES DE CLASSE
   ========================================================= */
.imma-principe {
    background: var(--imma-cream);
    border-left: 4px solid var(--imma-green);
    border-radius: 0 12px 12px 0;
    padding: 18px 22px;
    margin: 0 auto 28px;
    max-width: 760px;
    font-size: 15px;
    line-height: 1.65;
    text-align: left;
}
.imma-principe p { margin: 0 0 10px; }
.imma-principe p:last-child { margin-bottom: 0; }
.imma-principe-chiffre {
    margin-top: 12px !important;
    padding-top: 12px;
    border-top: 1px solid var(--imma-line);
    font-size: 15px;
}
.imma-principe-chiffre strong { color: var(--imma-terra-dark); }

.imma-modele-liste { list-style: none; margin: 0 0 14px; padding: 0; font-size: 14px; }
.imma-modele-liste li {
    padding: 7px 0 7px 14px;
    border-left: 2px solid var(--imma-line);
    line-height: 1.5;
}
.imma-modele-liste .imma-coord-muted { display: inline; }

.imma-reports-table input[type="number"],
.imma-reports-table input[type="text"] {
    width: 100%;
    padding: 7px 9px;
    border: 1px solid var(--imma-line);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}

@media (max-width: 640px) {
    .imma-principe { padding: 14px 16px; }
}

/* ---------- Le planning, dans la forme du tableur ---------- */
.imma-planning { width: 100%; border-collapse: collapse; font-size: 14px; margin-top: 6px; }
.imma-planning th {
    text-align: left;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--imma-muted);
    padding: 4px 8px 4px 0;
    border-bottom: 1px solid var(--imma-line);
}
.imma-planning td { padding: 7px 8px 7px 0; border-bottom: 1px solid var(--imma-line); vertical-align: top; }
.imma-planning tr:last-child td { border-bottom: none; }
.imma-planning tr.est-passee td { background: #FBF3E2; }
.imma-planning tr.est-validee td { opacity: .6; }
.imma-planning-date { font-weight: 600; white-space: nowrap; width: 130px; }
.imma-planning-libre { color: var(--imma-line); }
.imma-planning-qui { display: block; }
.imma-planning-qui .imma-coord-muted { display: inline; }
.imma-planning-etat { width: 30px; text-align: right; }

@media (max-width: 640px) {
    .imma-planning-date { width: auto; }
}

/* ---------- Qui a deja pris la date, cote parent ---------- */
.imma-slot-pris {
    display: block;
    font-size: 12px;
    color: var(--imma-muted);
    margin-top: 2px;
    font-weight: 400;
}
.imma-slot.is-full .imma-slot-pris { color: var(--imma-ink); }

/* ---------- Ce que la classe regle elle-meme ---------- */
.imma-reglage-participation {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px;
    background: var(--imma-cream);
    border-radius: 10px;
    padding: 10px 14px;
    margin: 0 0 12px;
    font-size: 13px;
}
.imma-reglage-participation label {
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-weight: 600;
    color: var(--imma-muted);
}
.imma-reglage-participation input {
    width: 90px;
    padding: 6px 9px;
    border: 1px solid var(--imma-line);
    border-radius: 8px;
    background: #fff;
    font-size: 14px;
}
.imma-reglage-retour { font-size: 12px; }
.imma-reglage-retour.est-ok { color: var(--imma-green-dark); }
.imma-reglage-retour.est-ko { color: #9C3A1B; }

@media (max-width: 640px) {
    .imma-reglage-participation input { width: 100%; }
    .imma-reglage-participation label { flex: 1 1 100%; }
}

/* ---------- Les adultes d un foyer, dans la liste ---------- */
.imma-adulte-ligne {
    display: block;
    font-size: 12px;
    color: var(--imma-muted);
    margin-top: 2px;
    line-height: 1.45;
}
.imma-adulte-ligne strong { color: var(--imma-ink); font-weight: 600; }

/* ---------- Le report, adulte par adulte, dans la fiche famille ---------- */
.imma-balance-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--imma-line);
}
.imma-balance-row:last-of-type { border-bottom: none; }
.imma-balance-qui { flex: 1 1 200px; font-size: 14px; line-height: 1.35; }
.imma-balance-qui .imma-coord-muted { display: block; margin-top: 1px; }
.imma-balance-row input[type="number"] { flex: 0 0 90px; }
.imma-balance-row input[type="text"] { flex: 1 1 200px; }
.imma-balance-row input {
    padding: 8px 10px;
    border: 1px solid var(--imma-line);
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}
.imma-balance-row input:focus { outline: none; border-color: var(--imma-green); }

@media (max-width: 640px) {
    .imma-balance-row { flex-direction: column; align-items: stretch; }
    .imma-balance-row input { flex: 1 1 auto; width: 100%; }
}

/* =========================================================
   v1.27 :: LA VIE QUOTIDIENNE DE L ECOLE
   ========================================================= */
.imma-quotidien,
.imma-quotidien * { box-sizing: border-box; }
.imma-quotidien {
    --imma-cream: #FAF6EF; --imma-green: #4C7A5D; --imma-green-dark: #3C6149;
    --imma-terra: #C9714E; --imma-terra-dark: #B05E3D; --imma-ink: #3B3733;
    --imma-muted: #8A8178; --imma-line: #E8E0D4; --imma-card: #FFFFFF;
    --imma-radius: 16px; --imma-shadow: 0 2px 14px rgba(59, 55, 51, .07);
    color: var(--imma-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.55;
    max-width: 1120px;
    margin: 0 auto;
}
.imma-quotidien [hidden] { display: none !important; }

.imma-quotidien-grille {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 18px;
}
.imma-quotidien-bloc {
    background: var(--imma-card);
    border: 1px solid var(--imma-line);
    border-top: 4px solid var(--imma-green);
    border-radius: var(--imma-radius);
    padding: 18px 20px;
    box-shadow: var(--imma-shadow);
}
.imma-quotidien-titre {
    font-size: 18px !important;
    font-weight: 800;
    color: var(--imma-green-dark);
    margin: 0 0 4px;
}
.imma-quotidien-meta { font-size: 13px; color: var(--imma-muted); margin: 0 0 12px; }

.imma-quotidien-consigne { margin: 0 0 14px; font-size: 14px; }
.imma-quotidien-consigne summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--imma-green-dark);
    padding: 6px 0;
}
.imma-quotidien-consigne p { margin: 6px 0; line-height: 1.6; }

.imma-quotidien .imma-planning tr.est-prise td { background: var(--imma-cream); }
.imma-prendre {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--imma-terra);
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    white-space: nowrap;
}
.imma-prendre:hover { background: var(--imma-terra-dark); }

@media (max-width: 640px) {
    .imma-quotidien-grille { grid-template-columns: 1fr; }
    .imma-quotidien-bloc { padding: 14px 16px; }
}

.imma-badge-quotidien {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    background: #EDEAE6;
    color: var(--imma-ink);
    font-size: 11px;
    font-weight: 600;
}

.imma-done-auto {
    display: block;
    font-size: 11px;
    color: var(--imma-green-dark);
    margin-top: 2px;
    cursor: help;
}

.imma-badge-sansdate {
    display: inline-block;
    background: #fdecea;
    color: #a4341f;
    border-radius: 3px;
    padding: 0 5px;
    font-size: 11px;
    font-weight: 600;
    cursor: help;
}
.imma-notice-warn {
    background: #fff8e5;
    border-left: 3px solid #e0a800;
    padding: 10px 14px;
    margin: 10px 0 14px;
    border-radius: 3px;
}
.imma-notice-warn p { margin: 0 0 6px; }
.imma-check { display: block; font-size: 13px; }

/* ===================================================================
   LE PLANNING D'UNE PARTICIPATION SUR TOUTE LA PERIODE
   Douze petits mois cote a cote plutot qu'un gros mois a la fois :
   on embrasse l'annee du regard, comme sur l'onglet du tableur.
   =================================================================== */
.imma-planning-annuel { margin: 28px 0; }
.imma-planning-intro { font-size: 14px; color: #555; margin: 0 0 10px; }

.imma-planning-legende {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    padding: 0;
    margin: 0 0 16px;
    font-size: 13px;
    color: #555;
}
.imma-planning-legende li { display: flex; align-items: center; gap: 5px; }
.imma-pastille {
    width: 12px; height: 12px;
    border-radius: 3px;
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, .12);
}
.imma-pastille.est-libre  { background: #e8f4ea; border-color: #8cc49a; }
.imma-pastille.est-prise  { background: #e6eefb; border-color: #90b0e0; }
.imma-pastille.est-passee { background: #f0f0f0; border-color: #ccc; }

.imma-annee-grille {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 18px;
}
.imma-annee-mois {
    border: 1px solid #e4e4e4;
    border-radius: 6px;
    padding: 10px;
    background: #fff;
}
.imma-annee-mois-titre {
    margin: 0 0 8px;
    font-size: 14px;
    text-align: center;
    text-transform: capitalize;
}
.imma-annee-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.imma-annee-table th {
    font-size: 10px;
    font-weight: 600;
    color: #999;
    padding: 0 0 4px;
    text-align: center;
}
.imma-annee-table th abbr { text-decoration: none; border: 0; }

.imma-annee-case {
    text-align: center;
    vertical-align: top;
    padding: 1px;
    height: 34px;
}
.imma-annee-case .imma-annee-jour {
    display: block;
    font-size: 11px;
    color: #bbb;
    line-height: 1.6;
}
.imma-annee-case.est-aujourdhui .imma-annee-jour { font-weight: 700; color: #333; }

/* Une case qui porte une date : c'est elle qui parle */
.imma-annee-case.a-date .imma-annee-date {
    display: block;
    width: 100%;
    border: 1px solid transparent;
    border-radius: 4px;
    padding: 2px 1px;
    font: inherit;
    line-height: 1.15;
    text-align: center;
}
.imma-annee-case.a-date .imma-annee-jour { font-size: 12px; font-weight: 600; color: #333; }
.imma-annee-qui {
    display: block;
    font-size: 9px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.imma-annee-case.est-libre  .imma-annee-date { background: #e8f4ea; border-color: #8cc49a; cursor: pointer; }
.imma-annee-case.est-libre  .imma-annee-qui  { color: #2f7a45; font-weight: 600; }
.imma-annee-case.est-libre  .imma-annee-date:hover { background: #d3ead9; }
.imma-annee-case.est-libre  .imma-annee-date.est-choisie {
    background: #2f7a45;
    border-color: #2f7a45;
}
.imma-annee-case.est-libre  .imma-annee-date.est-choisie .imma-annee-jour,
.imma-annee-case.est-libre  .imma-annee-date.est-choisie .imma-annee-qui { color: #fff; }

.imma-annee-case.est-prise  .imma-annee-date { background: #e6eefb; border-color: #90b0e0; }
.imma-annee-case.est-prise  .imma-annee-qui  { color: #2c5490; }

.imma-annee-case.est-passee .imma-annee-date { background: #f4f4f4; border-color: #e0e0e0; }
.imma-annee-case.est-passee .imma-annee-jour { color: #999; font-weight: 400; }
.imma-annee-case.est-passee .imma-annee-qui  { color: #aaa; }

.imma-quotidien-titre a { text-decoration: none; color: inherit; }
.imma-quotidien-titre a:hover { text-decoration: underline; }
.imma-quotidien-lien { margin: 0 0 10px; font-size: 13px; }

@media (max-width: 480px) {
    .imma-annee-grille { grid-template-columns: 1fr; }
}

/* ===================================================================
   LE CALENDRIER UNIQUE DE LA VIE QUOTIDIENNE
   Trois sortes de participations sur la meme grille : la couleur dit
   laquelle, l'etiquette dit si c'est libre ou qui l'a prise.
   =================================================================== */
.imma-quotidien-mode {
    background: #f3f7f4;
    border-left: 3px solid var(--imma-green, #4a8c5f);
    padding: 10px 14px;
    border-radius: 3px;
    font-size: 14px;
    margin: 0 0 16px;
}

/* Les dates choisies, puis les coordonnees, une seule fois */
.imma-quot-form {
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 18px;
    margin-top: 22px;
    background: #fff;
}
.imma-quot-choisies { list-style: none; padding: 0; margin: 0 0 16px; }
.imma-quot-choisies li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}
.imma-quot-retirer {
    margin-left: auto;
    border: 0;
    background: none;
    color: #a4341f;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    padding: 2px 5px;
}
.imma-quot-erreur { color: #a4341f; font-size: 14px; margin: 10px 0 0; }

/* La barre de validation : fixee a la fenetre, pas a son conteneur.
   Une barre « sticky » cesse d'etre epinglee des qu'on depasse le bloc qui
   la contient — sur un planning d'annee, elle repartait vers le haut au
   moment precis ou l'on voulait valider, et le pied de page la recouvrait.
   Fixee, elle reste atteignable tant qu'une date est cochee. */
.imma-quot-barre {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9990;
    background: #fff;
    border-top: 1px solid #ddd;
    box-shadow: 0 -3px 14px rgba(0, 0, 0, .12);
    padding: 11px 16px;
    padding-bottom: calc(11px + env(safe-area-inset-bottom, 0px));
}
.imma-quot-barre-inner {
    max-width: 1140px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.imma-quot-compte { font-weight: 600; font-size: 14px; }

/* Tant que la barre est la, elle masquerait la fin de la page : on lui
   reserve sa place plutot que de recouvrir le dernier champ du formulaire. */
body.imma-barre-ouverte { padding-bottom: 92px; }

@media (max-width: 640px) {
    .imma-quot-barre-inner { flex-direction: column; align-items: stretch; }
    body.imma-barre-ouverte { padding-bottom: 132px; }
}

/* ===================================================================
   LE CALENDRIER : UN MOIS PAR BLOC, SUR TOUTE LA LARGEUR
   Les jours en colonnes, les semaines en lignes, le mois suivant en
   dessous. Ce qui rendait la premiere version illisible n'etait pas la
   grille mais d'en poser trois cote a cote : la case tombait a 60 px.
   Un seul mois par rangee, et elle en fait 200.
   =================================================================== */
.imma-cal { margin: 18px 0 8px; }

.imma-cal-mois {
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 10px;
    padding: 18px 18px 14px;
    margin-bottom: 22px;
}
.imma-cal-mois-titre {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--imma-green, #4a8c5f);
}

.imma-cal-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 4px;
    table-layout: fixed;
}
.imma-cal-table th {
    font-size: 12px;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align: left;
    padding: 0 0 6px 6px;
}
.imma-cal-table th.est-we { color: #bbb; }

.imma-cal-case {
    vertical-align: top;
    height: 112px;
    padding: 5px;
    background: #fcfcfc;
    border: 1px solid #f0f0f0;
    border-radius: 7px;
}
.imma-cal-case.est-hors { background: transparent; border-color: transparent; }
.imma-cal-case.est-garnie { background: #fff; border-color: #e8e8e8; }
.imma-cal-case.est-we { background: #fafafa; }
.imma-cal-case.est-aujourdhui {
    border-color: var(--imma-green, #4a8c5f);
    box-shadow: inset 0 0 0 1px var(--imma-green, #4a8c5f);
}
.imma-cal-jour {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #aaa;
    padding: 2px 0 4px 4px;
}
.imma-cal-case.est-aujourdhui .imma-cal-jour { color: var(--imma-green-dark, #2f7a45); }
.imma-cal-case.est-we .imma-cal-jour { color: #ccc; }

/* Une participation, un jour : la brique qu'on coche */
.imma-cal-part {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    min-height: 46px;
    padding: 7px 8px;
    margin-bottom: 4px;
    border: 1px solid #ddd;
    border-left: 4px solid var(--imma-chip, #999);
    border-radius: 6px;
    background: #fff;
    text-align: left;
}
.imma-cal-part input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; }
.imma-cal-coche {
    flex: 0 0 auto;
    width: 19px;
    height: 19px;
    margin-top: 1px;
    border: 2px solid var(--imma-chip, #4a8c5f);
    border-radius: 4px;
    background: #fff;
    position: relative;
}
.imma-cal-corps { flex: 1 1 auto; min-width: 0; }
.imma-cal-nom {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.25;
    color: #222;
}
.imma-cal-etat {
    display: block;
    font-size: 11.5px;
    line-height: 1.25;
    color: #6a6a6a;
    margin-top: 2px;
}

label.imma-cal-part { cursor: pointer; transition: background .12s, border-color .12s; }
label.imma-cal-part:hover { background: #f3f9f5; border-color: var(--imma-chip, #4a8c5f); }
label.imma-cal-part:focus-within {
    outline: 3px solid var(--imma-green, #4a8c5f);
    outline-offset: 2px;
}

/* Choisie : toute la brique change, on ne peut pas la rater */
label.imma-cal-part.est-choisie {
    background: var(--imma-chip, #4a8c5f);
    border-color: var(--imma-chip, #4a8c5f);
}
label.imma-cal-part.est-choisie .imma-cal-nom,
label.imma-cal-part.est-choisie .imma-cal-etat { color: #fff; }
label.imma-cal-part.est-choisie .imma-cal-coche { background: #fff; border-color: #fff; }
label.imma-cal-part.est-choisie .imma-cal-coche::after {
    content: '';
    position: absolute;
    left: 5px; top: 1px;
    width: 5px; height: 10px;
    border: solid var(--imma-chip, #2f7a45);
    border-width: 0 2.5px 2.5px 0;
    transform: rotate(45deg);
}

.imma-cal-part.est-prise  { background: #f6f9fd; }
.imma-cal-part.est-prise  .imma-cal-etat { color: #2c5490; font-weight: 600; }
.imma-cal-part.est-passee { background: #fafafa; border-color: #eee; opacity: .75; }
.imma-cal-part.est-passee .imma-cal-nom { color: #999; font-weight: 500; }

/* Vue equipe : qui appeler */
.imma-cal-contacts { display: block; margin-top: 3px; }
.imma-cal-contact {
    display: block;
    font-size: 11px;
    line-height: 1.35;
    color: #555;
    overflow-wrap: anywhere;
}
.imma-cal-contact a { color: #2c5490; }

/* Sous 900 px la grille se replie en liste : un jour par ligne, et
   seulement les jours qui portent quelque chose. */
@media (max-width: 900px) {
    .imma-cal-table,
    .imma-cal-table thead,
    .imma-cal-table tbody,
    .imma-cal-table tr,
    .imma-cal-table th,
    .imma-cal-table td { display: block; width: auto; }
    .imma-cal-table thead { display: none; }
    .imma-cal-mois { padding: 14px 12px; }
    .imma-cal-case { height: auto; margin-bottom: 6px; }
    .imma-cal-case.est-hors,
    .imma-cal-case:not(.est-garnie) { display: none; }
    .imma-cal-jour { font-size: 15px; color: #333; padding-bottom: 6px; }
    .imma-cal-part { min-height: 52px; padding: 9px 11px; }
    .imma-cal-nom  { font-size: 14px; }
    .imma-cal-etat { font-size: 12.5px; }
}

/* ===================================================================
   L'ACCUEIL : DEUX FAMILLES DE CARTES
   Les sortes de participations d'un cote, les outils de l'autre.
   Six portes a plat laissaient croire a six choses de meme nature.
   =================================================================== */
.imma-accueil-bloc { margin: 26px 0 0; }
.imma-accueil-bloc-titre {
    font-size: 19px;
    font-weight: 700;
    margin: 0 0 4px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--imma-green, #4a8c5f);
}
.imma-accueil-bloc-intro {
    font-size: 14px;
    color: #666;
    margin: 8px 0 14px;
}
.imma-accueil-card.est-type {
    border-width: 2px;
    border-color: #dfe8e1;
}
.imma-accueil-card.est-type:hover { border-color: var(--imma-green, #4a8c5f); }
.imma-accueil-outils .imma-accueil-card { background: #fbfbfa; }

/* ===================================================================
   LES SORTES DE PARTICIPATIONS, EN HAUT DE LA PAGE
   Ce qui existe et ou il reste de la place — rien de plus. Les
   consignes sont longues et ne se lisent qu'une fois la date choisie :
   elles vivent sur la fiche, ou mene le bouton.
   =================================================================== */
.imma-quotidien-types {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
    margin: 18px 0;
}
.imma-type-carte {
    display: flex;
    flex-direction: column;
    gap: 7px;
    border: 1px solid #e4e4e4;
    border-left: 5px solid var(--imma-chip, #999);
    border-radius: 8px;
    padding: 13px 15px;
    background: #fff;
}
.imma-type-nom { font-weight: 600; font-size: 15px; color: #222; }
.imma-type-meta { font-size: 13px; color: #666; }
.imma-type-dispo { font-weight: 600; }
.imma-type-dispo.est-ouvert  { color: var(--imma-green-dark, #2f7a45); }
.imma-type-dispo.est-complet { color: #2c5490; }
.imma-type-dispo.est-vide    { color: #a4341f; }

.imma-type-bouton {
    align-self: flex-start;
    margin-top: 2px;
    border: 1px solid var(--imma-chip, #4a8c5f);
    border-radius: 6px;
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--imma-chip, #2f7a45);
    text-decoration: none;
    background: #fff;
}
.imma-type-bouton:hover {
    background: var(--imma-chip, #4a8c5f);
    color: #fff;
}

/* ===================================================================
   LE RETOUR A L'ACCUEIL PARENT
   Pose en haut de chaque page interieure. Discret : c'est une sortie
   de secours, pas l'action principale de la page.
   =================================================================== */
.imma-retour-wrap { margin: 0 0 14px; }
.imma-retour {
    display: inline-block;
    border: 1px solid #d8ddd9;
    border-radius: 6px;
    padding: 7px 14px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--imma-green-dark, #2f7a45);
    text-decoration: none;
    background: #fff;
}
.imma-retour:hover {
    background: var(--imma-green, #4a8c5f);
    border-color: var(--imma-green, #4a8c5f);
    color: #fff;
}

/* Vue parent choisie alors qu'on detient une cle : discret, mais present,
   sinon on oublie qu'on regarde une version amputee. */
.imma-bandeau-parent {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    background: #f2f5f8;
    border-left: 4px solid #6C8EBF;
    border-radius: 5px;
    padding: 10px 14px;
    margin: 0 0 16px;
    font-size: 14px;
}
.imma-bandeau-parent .imma-bandeau-retour { margin-left: auto; }

/* L'essai avant le lancement : une ligne, trois champs, pas une ceremonie. */
.imma-essai-form {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 0 18px;
}
.imma-essai-form input[type="email"] { min-width: 230px; }

/* ===================================================================
   SE FAIRE RECONNAITRE A L'ENTREE
   =================================================================== */
.imma-ident-form { max-width: 520px; margin: 18px 0; }
.imma-ident-form label { display: block; font-weight: 600; margin-bottom: 6px; }

/* Ce que l'ecole a note : replie par defaut, mais bien visible */
.imma-fiche-foyer {
    border: 1px solid #e0e6e2;
    border-left: 4px solid var(--imma-green, #4a8c5f);
    border-radius: 8px;
    background: #fff;
    padding: 12px 16px;
    margin: 0 0 20px;
}
.imma-fiche-foyer > summary { cursor: pointer; list-style: none; }
.imma-fiche-foyer > summary::-webkit-details-marker { display: none; }
.imma-fiche-titre { font-weight: 600; font-size: 15px; }
.imma-fiche-aide { display: block; font-size: 13px; color: #777; margin-top: 2px; }

.imma-fiche-corps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 18px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #f0f0f0;
}
.imma-fiche-bloc h4 { margin: 0 0 8px; font-size: 14px; }
.imma-fiche-liste { list-style: none; padding: 0; margin: 0 0 8px; }
.imma-fiche-liste li { padding: 4px 0; font-size: 14px; border-bottom: 1px solid #f5f5f5; }
.imma-fiche-liste .imma-coord-muted { display: block; font-size: 12.5px; }
.imma-fiche-pied {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
    margin: 14px 0 0;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}

/* ===================================================================
   DE L'AIR SOUS LE DERNIER BOUTON
   Le theme pose une decoupe decorative au-dessus de son pied de page.
   Elle remonte sur le contenu, et le dernier element d'une page — qui
   est presque toujours un bouton d'enregistrement — se retrouvait
   tranche en deux, inaccessible au clic sur sa moitie basse.
   Ce n'est pas au theme de s'adapter : c'est a notre bloc de ne pas
   finir au ras de sa propre limite.
   =================================================================== */
.imma-accueil,
.imma-catalogue,
.imma-calendrier,
.imma-quotidien,
.imma-event-detail,
.imma-mon-espace,
.imma-submit-page,
.imma-contact-page,
.imma-educ-page,
.imma-coordination {
    padding-bottom: 72px;
}

/* Un bouton final ne doit jamais toucher le bord du bloc */
.imma-coord-section:last-child,
.imma-coord-actions:last-child {
    margin-bottom: 8px;
}

/* ===================================================================
   LA FEUILLE DE LA SEMAINE, POUR L'EQUIPE
   Elle se lit a l'ecran mais elle est faite pour le papier : c'est une
   feuille punaisee en classe qui repond au vendredi matin, pas un
   ecran qu'il faut aller chercher.
   =================================================================== */
.imma-semaine-equipe {
    border: 2px solid var(--imma-green, #4a8c5f);
    border-radius: 10px;
    padding: 18px 20px;
    margin: 0 0 24px;
    background: #fff;
}
.imma-semaine-tete {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.imma-semaine-titre { margin: 0; font-size: 20px; }
.imma-semaine-ecole { margin: 2px 0 0; font-size: 13px; color: #777; }
.imma-semaine-outils { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.imma-semaine-table { width: 100%; border-collapse: collapse; }
.imma-semaine-table th {
    text-align: left;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #777;
    border-bottom: 2px solid #e0e0e0;
    padding: 6px 8px;
}
.imma-semaine-table td {
    padding: 9px 8px;
    border-bottom: 1px solid #eee;
    vertical-align: top;
    font-size: 14px;
}
.imma-semaine-jour { font-weight: 700; white-space: nowrap; }
.imma-semaine-part {
    display: inline-block;
    border-left: 4px solid var(--imma-chip, #999);
    padding-left: 8px;
    font-weight: 600;
}
.imma-semaine-heure { display: block; font-size: 12px; color: #666; padding-left: 12px; }
.imma-semaine-inscrit { padding: 1px 0; }
.imma-semaine-enfant { color: #666; font-size: 13px; }
.imma-semaine-personne { color: #a4341f; }
.imma-semaine-manque { display: block; font-size: 12px; color: #a4341f; font-weight: 600; }
.imma-semaine-contact { font-size: 12.5px; color: #444; }
.imma-semaine-tel { display: block; font-weight: 600; }
.imma-semaine-mail { display: block; color: #2c5490; overflow-wrap: anywhere; }
.imma-semaine-fait { text-align: center; width: 62px; }
.imma-semaine-case {
    display: inline-block;
    width: 20px; height: 20px;
    border: 2px solid #bbb;
    border-radius: 4px;
}
.imma-semaine-table tr.est-validee { background: #f4f9f5; }
.imma-semaine-pied { font-size: 12px; color: #777; margin: 12px 0 0; }

/* ===================================================================
   A L'IMPRESSION : la feuille, et rien d'autre
   Le calendrier de l'annee, la navigation et les bandeaux n'ont aucune
   raison de consommer du papier.
   =================================================================== */
@media print {
    .imma-quotidien .imma-pagenav,
    .imma-quotidien .imma-cat-header,
    .imma-quotidien .imma-retour-wrap,
    .imma-quotidien .imma-bandeau-coord,
    .imma-quotidien .imma-bandeau-parent,
    .imma-quotidien .imma-tabs,
    .imma-quotidien .imma-quotidien-types,
    .imma-quotidien .imma-quotidien-mode,
    .imma-quotidien .imma-cal,
    .imma-quot-barre,
    .imma-semaine-outils { display: none !important; }

    .imma-quotidien { padding: 0 !important; }
    .imma-semaine-equipe {
        border: 0;
        padding: 0;
        margin: 0;
        page-break-inside: avoid;
    }
    .imma-semaine-titre { font-size: 17pt; }
    .imma-semaine-table { font-size: 10pt; }
    .imma-semaine-table th { border-bottom: 1.5pt solid #000; color: #000; }
    .imma-semaine-table td { border-bottom: .5pt solid #999; }
    .imma-semaine-table tr { page-break-inside: avoid; }
    .imma-semaine-mail { color: #000; }
    .imma-semaine-case { border-color: #000; }

    @page { margin: 14mm; }
}

/* Dans la liste de l'equipe : qui doit des heures, qui n'en doit pas */
.imma-badge-parent {
    display: inline-block;
    background: #eef3fb;
    color: #2c5490;
    border-radius: 3px;
    padding: 1px 6px;
    font-size: 12px;
    font-weight: 600;
}
.imma-coord-alerte {
    display: block;
    font-size: 11.5px;
    color: #a4341f;
    font-weight: 600;
}

/* Le lien d'acces personnel, a copier et envoyer */
.imma-acces-cell { min-width: 230px; }
.imma-lien-acces {
    width: 100%;
    font-size: 11.5px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    padding: 4px 6px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fafafa;
    color: #444;
}
.imma-lien-acces:focus { background: #fff; border-color: var(--imma-green, #4a8c5f); }


/* ===================================================================
   LES DEUX BOUTONS POSES SUR LE SITE DE L'ECOLE
   Ils vivent hors de l'outil — dans un pied de page, un menu, une page
   de presentation. Ils doivent donc se tenir seuls, sans heriter de la
   mise en page des ecrans de l'outil, et se poser cote a cote sans se
   coller.
   =================================================================== */
.imma-btn-wrap {
    display: inline-block;
    margin: 4px 8px 4px 0;
    vertical-align: middle;
}

.imma-btn-site {
    display: inline-block;
    background: var(--imma-green, #4a8c5f);
    color: #fff;
    border: 2px solid var(--imma-green, #4a8c5f);
    border-radius: 8px;
    padding: 11px 20px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.imma-btn-site:hover,
.imma-btn-site:focus {
    background: #fff;
    color: var(--imma-green-dark, #2f7a45);
    text-decoration: none;
}

/* Contacter : le geste secondaire, en second plan */
.imma-btn-site.est-contact {
    background: #fff;
    color: var(--imma-green-dark, #2f7a45);
}
.imma-btn-site.est-contact:hover,
.imma-btn-site.est-contact:focus {
    background: var(--imma-green, #4a8c5f);
    color: #fff;
}

/* Sur un pied de page sombre, le contour suffit a les detacher */
.imma-btn-site:focus-visible {
    outline: 3px solid var(--imma-green-dark, #2f7a45);
    outline-offset: 2px;
}

@media (max-width: 480px) {
    .imma-btn-wrap { display: block; margin-right: 0; }
    .imma-btn-site { display: block; text-align: center; }
}


/* ===================================================================
   L'ANNONCE DU MOMENT
   Elle passe avant tout le reste et doit se voir sans crier : ce n'est
   ni une erreur ni une alerte, c'est une precision qui evite un
   malentendu.
   =================================================================== */
.imma-annonce {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: #fff8e5;
    border: 1px solid #f0dfae;
    border-left: 4px solid #e0a800;
    border-radius: 8px;
    padding: 14px 18px;
    margin: 0 0 22px;
}
.imma-annonce-icone { flex: 0 0 auto; font-size: 18px; line-height: 1.4; }
.imma-annonce-corps { flex: 1 1 auto; font-size: 14.5px; line-height: 1.6; color: #4a3c15; }
.imma-annonce-corps p { margin: 0 0 8px; }
.imma-annonce-corps p:last-child { margin-bottom: 0; }


/* ===================================================================
   LES PAGES D'AIDE
   Du texte a lire, pas une interface : de l'air entre les blocs, des
   lignes qui ne s'etirent pas, et des reperes visuels pour retrouver
   une reponse sans tout relire.
   =================================================================== */
.imma-aide { max-width: 760px; }

.imma-aide-bloc {
    margin: 0 0 30px;
    padding: 0 0 4px;
}
.imma-aide-bloc h3 {
    font-size: 19px;
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--imma-green, #4a8c5f);
}
.imma-aide-bloc p,
.imma-aide-bloc li,
.imma-aide-bloc dd { font-size: 15px; line-height: 1.65; }
.imma-aide-bloc ul,
.imma-aide-bloc ol { padding-left: 22px; }
.imma-aide-bloc li { margin-bottom: 7px; }

/* Les etapes numerotees : on suit du doigt */
.imma-aide-etapes { counter-reset: etape; list-style: none; padding-left: 0; }
.imma-aide-etapes li {
    position: relative;
    padding-left: 38px;
    margin-bottom: 12px;
}
.imma-aide-etapes li::before {
    counter-increment: etape;
    content: counter(etape);
    position: absolute;
    left: 0;
    top: 1px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--imma-green, #4a8c5f);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    line-height: 26px;
}

/* Les definitions : un terme, ce qu'il recouvre */
.imma-aide-liste dt {
    font-weight: 700;
    font-size: 15.5px;
    margin: 16px 0 4px;
}
.imma-aide-liste dd { margin: 0 0 4px; padding-left: 0; color: #444; }

/* Le point qu'on a tendance a manquer */
.imma-aide-note {
    background: #fff8e5;
    border-left: 4px solid #e0a800;
    border-radius: 4px;
    padding: 10px 14px;
    font-size: 14px;
    color: #4a3c15;
}

.imma-aide-pied {
    margin-top: 34px;
    padding-top: 16px;
    border-top: 1px solid #e8e8e8;
    font-size: 14px;
}

/* ===================================================================
   L'AIDE POSEE SUR L'ACCUEIL
   Repliee : presente pour qui la cherche, silencieuse pour qui a deja
   compris. Une aide rangee ailleurs n'est pas lue.
   =================================================================== */
.imma-accueil-aide {
    margin: 34px 0 0;
    border: 1px solid #e0e6e2;
    border-left: 4px solid var(--imma-green, #4a8c5f);
    border-radius: 8px;
    background: #fff;
    padding: 14px 18px;
}
.imma-accueil-aide > summary { cursor: pointer; list-style: none; }
.imma-accueil-aide > summary::-webkit-details-marker { display: none; }
.imma-accueil-aide-titre {
    font-weight: 700;
    font-size: 16px;
    color: var(--imma-green-dark, #2f7a45);
}
.imma-accueil-aide-titre::before { content: "\2139\FE0F  "; }
.imma-accueil-aide-sous {
    display: block;
    font-size: 13.5px;
    color: #6a6a6a;
    margin-top: 3px;
    line-height: 1.5;
}
.imma-accueil-aide[open] > summary { margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid #f0f0f0; }
.imma-accueil-aide .imma-aide { max-width: none; }
.imma-accueil-aide .imma-aide-bloc:last-child { margin-bottom: 4px; }