/* FreeSchool : validation douce des champs HTML obligatoires. */
@keyframes fsRequiredFieldShake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-3px); }
    40%, 80% { transform: translateX(3px); }
}

body.fs-saas-premium input.fs-field-invalid:not([type="checkbox"]):not([type="radio"]),
body.fs-saas-premium textarea.fs-field-invalid,
body.fs-saas-premium select.fs-field-invalid,
body.fs-saas-premium .select2-container .select2-selection.fs-field-invalid,
body.fs-saas-premium .dropify-wrapper.fs-field-invalid {
    border: 2px solid #ef4444 !important;
    border-radius: 12px;
    background-color: #fffafb !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, .10), 0 4px 12px rgba(239, 68, 68, .05) !important;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

body.fs-saas-premium .fs-mark-page .fs-mark-col-note input.fs-field-invalid,
body.fs-saas-premium .fs-mark-page .note-input.fs-field-invalid {
    border: 2px solid #ef4444 !important;
    background-color: #fffafb !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, .13) !important;
}

body.fs-saas-premium input[type="checkbox"].fs-field-invalid,
body.fs-saas-premium input[type="radio"].fs-field-invalid {
    outline: 2px solid #ef4444 !important;
    outline-offset: 3px;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, .10) !important;
}

/* Un petit check vert, uniquement après saisie d'une donnée valide. */
body.fs-saas-premium input.fs-field-valid:is([type="text"], [type="number"], [type="email"], [type="tel"], [type="url"]),
body.fs-saas-premium textarea.fs-field-valid {
    border-color: #a7e5bb !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23dcfce7'/%3E%3Cpath d='m7 12 3.2 3.2L17 8.5' stroke='%2316a34a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 17px 17px !important;
    padding-right: 33px !important;
    box-shadow: 0 0 0 2px rgba(22, 163, 74, .06) !important;
}

body.fs-saas-premium .select2-container .select2-selection.fs-field-valid {
    border-color: #a7e5bb !important;
}

body.fs-saas-premium .select2-container .select2-selection.fs-field-valid::before {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23dcfce7'/%3E%3Cpath d='m7 12 3.2 3.2L17 8.5' stroke='%2316a34a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    pointer-events: none;
}

/* Entrée des notes : le check tient dans les petits champs, y compris sur mobile. */
body.fs-saas-premium .fs-mark-page input[type="number"].fs-field-valid {
    border: 1px solid #a7e5bb !important;
    background-color: #f8fff9 !important;
    background-position: right 4px center !important;
    background-size: 14px 14px !important;
    padding-right: 19px !important;
}

@media (max-width: 767.98px) {
    body.fs-saas-premium .fs-mark-page .fs-mark-col-note input[type="number"].fs-field-valid {
        font-size: 13px !important;
        text-align: left !important;
        padding-left: 5px !important;
    }
}

/* Infobulle légère, lisible et indépendante du scroll des tableaux. */
body.fs-saas-premium .fs-mark-range-tooltip {
    position: fixed;
    z-index: 2147482000;
    display: flex;
    align-items: center;
    gap: 9px;
    box-sizing: border-box;
    width: min(270px, calc(100vw - 24px));
    padding: 11px 12px;
    border: 1px solid #fecdd3;
    border-radius: 14px;
    background: #fff;
    color: #334155;
    box-shadow: 0 12px 32px rgba(40, 57, 85, .12), 0 2px 8px rgba(225, 29, 72, .04);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-5px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}

body.fs-saas-premium .fs-mark-range-tooltip--visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

body.fs-saas-premium .fs-mark-range-tooltip::before {
    content: '';
    position: absolute;
    left: calc(50% - 5px);
    top: -5px;
    width: 9px;
    height: 9px;
    border-top: 1px solid #fecdd3;
    border-left: 1px solid #fecdd3;
    background: #fff;
    transform: rotate(45deg);
}

body.fs-saas-premium .fs-mark-range-tooltip--above::before {
    top: auto;
    bottom: -5px;
    border: 0;
    border-right: 1px solid #fecdd3;
    border-bottom: 1px solid #fecdd3;
}

body.fs-saas-premium .fs-mark-range-tooltip__symbol {
    flex: 0 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: #fff1f2;
    color: #e11d48;
    font-weight: 800;
    font-size: 16px;
}

body.fs-saas-premium .fs-mark-range-tooltip__body {
    display: grid;
    gap: 2px;
    font-size: 11px;
    line-height: 1.35;
}

body.fs-saas-premium .fs-mark-range-tooltip__body strong {
    color: #9f1239;
    font-size: 11.5px;
    font-weight: 750;
}

body.fs-saas-premium .fs-field-shake {
    animation: fsRequiredFieldShake .32s ease-in-out !important;
}

@media (prefers-reduced-motion: reduce) {
    body.fs-saas-premium .fs-field-shake { animation: none !important; }
    body.fs-saas-premium .fs-mark-range-tooltip { transition: none !important; }
}