/* Accessibilité – Homps. Complément du style existant, sans remplacer Tailwind. */
html { scroll-padding-top: 6rem; }
.a11y-skip-link {
    position: fixed; top: .65rem; left: .75rem; z-index: 999999;
    transform: translateY(-200%); padding: .7rem 1rem;
    background: #fff; color: #003f50; border: 3px solid #003f50;
    border-radius: .55rem; font-weight: 800; text-decoration: underline;
}
.a11y-skip-link:focus { transform: translateY(0); }
.a11y-main-anchor { display: block; height: 0; scroll-margin-top: 6rem; }

/* Un contour visible pour les utilisateurs du clavier, sur toutes les pages. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #ec9600 !important;
    outline-offset: 3px !important;
}
:where(a, button, input, select, textarea):focus:not(:focus-visible) { outline-offset: 0; }
/* Le dropdown fonctionne à la souris, au clavier et sur écran tactile. */
[data-a11y-dropdown="mairie"][data-open="true"] #mairie-submenu { display: block !important; }
[data-a11y-dropdown="mairie"][data-open="false"] #mairie-submenu { display: none !important; }

/* Retours à la ligne des noms, menus et grandes polices agrandies. */
body { overflow-wrap: break-word; }
input, textarea, select { max-width: 100%; }

/* Mode contrasté : tout texte et tous les contrôles restent lisibles. */
body.high-contrast,
body.high-contrast :is(header, footer, main, section, article, nav, aside, div, button, a, input, textarea, select, option, span, p, ul, li, h1, h2, h3, h4, h5, h6, label) {
    background-color: #000 !important;
    background-image: none !important;
    color: #fff000 !important;
    border-color: #fff000 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}
body.high-contrast :is(input, textarea, select, button, a):focus-visible {
    outline: 4px solid #fff !important; outline-offset: 3px !important;
}
body.high-contrast :is(.text-transparent, [class*="bg-clip-text"]) {
    color: #fff000 !important;
    -webkit-text-fill-color: #fff000 !important;
}
body.high-contrast img { filter: none !important; }
body.high-contrast [class*="opacity-0"] { opacity: 1 !important; }
body.high-contrast [class*="text-white/"] { color: #fff000 !important; }

/* Diminuer les animations et effets, dont les pulsations. */
@media (prefers-reduced-motion: reduce) {
    html, html.scroll-smooth { scroll-behavior: auto !important; }
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-delay: 0ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
    }
    [class*="animate-emerge"], [class*="opacity-0"][class*="animate-"] {
        opacity: 1 !important;
    }
    [class*="hover:scale-"], [class*="hover:-translate-"] { transform: none !important; }
}

/* Mise en forme de la page de déclaration (avec CSS si Tailwind indisponible). */
.a11y-document { width: min(100% - 2rem, 58rem); margin: 0 auto; padding: 7rem 0 4rem; line-height: 1.65; }
.a11y-document h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 850; margin: 0 0 1.35rem; }
.a11y-document h2 { font-size: clamp(1.45rem, 3vw, 1.9rem); font-weight: 800; margin: 2.25rem 0 .75rem; }
.a11y-document h3 { font-size: 1.2rem; font-weight: 750; margin: 1.5rem 0 .6rem; }
.a11y-document p { margin-bottom: 1rem; }
.a11y-document ul { list-style: disc; padding-left: 1.6rem; margin: 0 0 1.1rem; }
.a11y-document li { margin: .4rem 0; }
.a11y-document a { color: #005f73; text-decoration: underline; text-underline-offset: .15em; }
.dark .a11y-document a { color: #72e6e2; }
.a11y-document .a11y-status { padding: 1.2rem; border: 2px solid #a24b00; border-radius: .8rem; background: #fff7e7; color: #382100; }
.dark .a11y-document .a11y-status { background: #332715; color: #fff; }


/* Vérifications de contraste : le jaune doré et le turquoise clairs ne peuvent
   servir de texte courant sur fond blanc (rapport insuffisant). Couleurs ajustées
   seulement sur les surfaces claires ; la palette du site reste reconnaissable. */
body:not(.high-contrast):not(.dark) :is(.bg-white, .bg-slate-50, .bg-midi-cream) .text-midi-gold,
body:not(.high-contrast):not(.dark) :is(.bg-white, .bg-slate-50, .bg-midi-cream) [class~="text-midi-gold"] {
    color: #8a5400 !important; /* > 6:1 sur blanc */
}
body:not(.high-contrast):not(.dark) :is(.bg-white, .bg-slate-50, .bg-midi-cream) .text-midi-teal {
    color: #006b6e !important; /* > 6:1 sur blanc */
}
/* Texte blanc sur fonds saturés : les boutons dorés/teal restent lisibles. */
body:not(.high-contrast) [class~="bg-midi-gold"][class~="text-white"] {
    color: #171717 !important;
}
body:not(.high-contrast) [class~="bg-midi-teal"][class~="text-white"] {
    background-color: #006b6e !important;
}
body:not(.high-contrast) :is(a,button):hover[class*="hover:bg-midi-gold"][class*="hover:text-white"] {
    color: #171717 !important;
}
/* Pas de mouvement imposé aux usagers qui demandent une animation réduite. */
@media (prefers-reduced-motion: reduce) {
    :is(.animate-pulse, .animate-bounce, .animate-spin) {
        animation: none !important;
    }
}