/*
 * Confort de lecture – reading comfort widget.
 * Fonts (OpenDyslexic, Atkinson Hyperlegible, Lexend) are licensed under the SIL Open Font License 1.1.
 * Font files are only downloaded by the browser when a visitor selects the font.
 */

/* ---------- Fonts (loaded on demand) ---------- */
@font-face{font-family:"Lisible OpenDyslexic";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/opendyslexic-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Lisible OpenDyslexic";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/opendyslexic-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Lisible Atkinson";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Lisible Atkinson";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Lisible Lexend";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/lexend-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Lisible Lexend";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/lexend-latin-700-normal.woff2") format("woff2")}

/* ---------- Settings applied to the page ---------- */
html[data-lisible-font="opendyslexic"]{--lisible-ff:"Lisible OpenDyslexic",sans-serif}
html[data-lisible-font="atkinson"]{--lisible-ff:"Lisible Atkinson",sans-serif}
html[data-lisible-font="lexend"]{--lisible-ff:"Lisible Lexend",sans-serif}

/* Text size: scales the page like a browser zoom (works with fixed pixel sizes). */
@supports (zoom:1){
html[data-lisible-size="1"] body{zoom:1.1;--lisible-zoom:1.1}
html[data-lisible-size="2"] body{zoom:1.25;--lisible-zoom:1.25}
html[data-lisible-size="3"] body{zoom:1.5;--lisible-zoom:1.5}
html[data-lisible-size="4"] body{zoom:1.75;--lisible-zoom:1.75}
html[data-lisible-size="5"] body{zoom:2;--lisible-zoom:2}
html[data-lisible-size] #lisible-root{zoom:calc(1 / var(--lisible-zoom,1))}
}
@supports not (zoom:1){
html[data-lisible-size="1"]{font-size:110%}
html[data-lisible-size="2"]{font-size:125%}
html[data-lisible-size="3"]{font-size:150%}
html[data-lisible-size="4"]{font-size:175%}
html[data-lisible-size="5"]{font-size:200%}
}

html[data-lisible-lh="1"]{--lisible-lh:1.6}
html[data-lisible-lh="2"]{--lisible-lh:1.9}
html[data-lisible-lh="3"]{--lisible-lh:2.2}

html[data-lisible-ls="1"]{--lisible-ls:.04em;--lisible-ws:.1em}
html[data-lisible-ls="2"]{--lisible-ls:.08em;--lisible-ws:.2em}
html[data-lisible-ls="3"]{--lisible-ls:.12em;--lisible-ws:.3em}

html[data-lisible-font] body :not(#lisible-root):not(#lisible-root *):not(i):not(.dashicons):not([class*="icon"]):not([class*="fa-"]):not(code):not(pre){font-family:var(--lisible-ff)!important}
html[data-lisible-lh] body :not(#lisible-root):not(#lisible-root *){line-height:var(--lisible-lh)!important}
html[data-lisible-ls] body :not(#lisible-root):not(#lisible-root *){letter-spacing:var(--lisible-ls)!important;word-spacing:var(--lisible-ws)!important}

/* ---------- Themes ----------
 * The script flags only the elements that need repainting (opaque light backgrounds, dark text),
 * so photos, overlays and buttons with images keep their look. */
html[data-lisible-theme="dark"]{background-color:#14161a;color-scheme:dark}
html[data-lisible-theme="dark"] [data-lisible-b]{background-color:#14161a!important}
html[data-lisible-theme="dark"] [data-lisible-c]{border-color:#cfd3da!important}
html[data-lisible-theme="dark"] [data-lisible-pa]::after{background-color:#ececec!important}
html[data-lisible-theme="dark"] [data-lisible-pb]::before{background-color:#ececec!important}
html[data-lisible-theme="dark"] [data-lisible-f],html[data-lisible-theme="dark"] [data-lisible-f] *{fill:#ececec!important}
html[data-lisible-theme="dark"] [data-lisible-t]{color:#ececec!important;text-shadow:none!important}
html[data-lisible-theme="dark"] a[data-lisible-t]{color:#8ab4f8!important}
html[data-lisible-theme="cream"]{background-color:#fbf4e0}
html[data-lisible-theme="cream"] [data-lisible-b]{background-color:#fbf4e0!important}
html[data-lisible-theme="cream"] [data-lisible-t]{color:#2b2b2b!important}

/* ---------- Colour-blindness filters ---------- */
html[data-lisible-filter="protanopia"]{filter:url("#lisible-f-protanopia")}
html[data-lisible-filter="deuteranopia"]{filter:url("#lisible-f-deuteranopia")}
html[data-lisible-filter="tritanopia"]{filter:url("#lisible-f-tritanopia")}

/* ---------- Widget ---------- */
.lisible-root,.lisible-root *{box-sizing:border-box}
.lisible-root{font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:normal;word-spacing:normal;color-scheme:light}
.lisible-root .lisible-toggle{position:fixed!important;right:16px!important;bottom:16px!important;z-index:100000!important;display:flex!important;align-items:center;justify-content:center;width:56px!important;height:56px!important;min-width:0!important;padding:0!important;margin:0!important;border:3px solid #fff!important;border-radius:50%!important;background:#1a4fa3!important;color:#fff!important;line-height:1!important;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.4)!important}
.lisible-root .lisible-toggle:hover{background:#133d80!important}
.lisible-root .lisible-toggle svg{display:block;width:30px;height:30px;stroke:#fff}
.lisible-root button:focus-visible,.lisible-root input:focus-visible{outline:3px solid #ffb000!important;outline-offset:2px}

.lisible-root .lisible-panel{position:fixed!important;right:16px;bottom:84px;z-index:100000;width:min(340px,calc(100vw - 32px));max-height:calc(100vh - 104px);overflow:auto;padding:16px;background:#fff!important;color:#1b1b1b!important;border:1px solid #888;border-radius:12px;box-shadow:0 6px 24px rgba(0,0,0,.3)}
.lisible-panel[hidden]{display:none!important}
.lisible-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.lisible-root .lisible-head h2{margin:0!important;padding:0!important;font:700 18px/1.2 system-ui,sans-serif!important;font-style:normal!important;text-transform:none!important;letter-spacing:normal!important;color:#1b1b1b!important;background:transparent!important}
.lisible-root .lisible-close{width:44px!important;height:44px!important;min-width:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#1b1b1b!important;font:400 30px/1 system-ui,sans-serif!important;box-shadow:none!important;cursor:pointer}
.lisible-root .lisible-close:hover{background:#eee!important}
.lisible-panel fieldset{margin:0 0 12px;padding:0;border:0;min-width:0}
.lisible-root .lisible-panel legend{padding:0;margin:0 0 4px;font:700 14px/1.3 system-ui,sans-serif;font-style:normal;text-transform:uppercase;letter-spacing:.04em;color:#444}
.lisible-root .lisible-opt{display:flex;align-items:center;gap:8px;min-height:36px;margin:0;font:400 16px/1.3 system-ui,sans-serif;font-style:normal;text-transform:none;cursor:pointer;color:#1b1b1b}
.lisible-root .lisible-opt input{width:18px;height:18px;margin:0;flex:none;accent-color:#1a4fa3}
.lisible-root .lisible-opt input[type="checkbox"]{-webkit-appearance:none!important;appearance:none!important;width:20px!important;height:20px!important;border:2px solid #1a4fa3!important;border-radius:50%!important;background:#fff!important;box-shadow:none!important}
.lisible-root .lisible-opt input[type="checkbox"]:checked{background:#1a4fa3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5l3 3 5-6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat!important}
.lisible-root .lisible-opt input[type="checkbox"]::before,.lisible-root .lisible-opt input[type="checkbox"]::after{content:none!important}
.lisible-prev-opendyslexic{font-family:"Lisible OpenDyslexic",sans-serif!important}
.lisible-prev-atkinson{font-family:"Lisible Atkinson",sans-serif!important}
.lisible-prev-lexend{font-family:"Lisible Lexend",sans-serif!important}
.lisible-root .lisible-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;color:#1b1b1b}
.lisible-root .lisible-row label{margin:0;font:400 16px/1.3 system-ui,sans-serif;font-style:normal;text-transform:none;color:#1b1b1b}
.lisible-root .lisible-row input{width:150px;flex:none;accent-color:#1a4fa3}
.lisible-root .lisible-reset{display:block!important;width:100%!important;min-height:44px;margin:4px 0 0!important;padding:0 12px!important;border:2px solid #1a4fa3!important;border-radius:8px!important;background:#fff!important;color:#1a4fa3!important;font:700 15px/1 system-ui,sans-serif!important;text-transform:none!important;box-shadow:none!important;cursor:pointer}
.lisible-root .lisible-reset:hover{background:#eaf0fb!important}

/* Reading ruler: the band stays clear, the rest of the page is dimmed. */
.lisible-ruler{position:fixed;left:0;right:0;top:0;height:3.4em;z-index:99990;pointer-events:none;box-shadow:0 0 0 200vmax rgba(0,0,0,.6);will-change:transform}
html[data-lisible-theme="dark"] .lisible-ruler{box-shadow:0 0 0 200vmax rgba(0,0,0,.7)}
@media (max-width:480px){.lisible-panel{right:8px;bottom:76px;width:calc(100vw - 16px)}}
@media print{.lisible-root,.lisible-ruler{display:none!important}}