/* ============================================================ MM Accessibility Widget — CSS v2.0.0 Tutti i selettori usano il prefisso _mmac_ per evitare qualsiasi conflitto con il sito ospite. Nessuna dipendenza da Font Awesome o librerie esterne. ============================================================ */ /* ── NESSUN WRAPPER ───────────────────────────────────────── btn e panel sono figli diretti di con z-index massimo inline — nessuno stacking context intermedio. */ /* ── PULSANTE FLOAT ──────────────────────────────────────────*/ #_mmac_btn { all: unset; box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: center !important; pointer-events: auto !important; cursor: pointer !important; box-shadow: 0 4px 18px rgba(0,0,0,0.28) !important; transition: transform .2s ease, box-shadow .2s ease !important; /* font-size controlla la dimensione dell'icona SVG */ font-size: 2.2rem !important; line-height: 1 !important; } #_mmac_btn:hover { transform: scale(1.08) !important; box-shadow: 0 6px 26px rgba(0,0,0,0.36) !important; } #_mmac_btn:focus-visible { outline: 3px solid #005fcc !important; outline-offset: 3px !important; } /* Icona SVG dentro il pulsante */ #_mmac_btn > span { width: 1em !important; height: 1em !important; pointer-events: none !important; } #_mmac_btn > span svg { width: 100% !important; height: 100% !important; fill: currentColor !important; } /* ── PANEL ───────────────────────────────────────────────────*/ #_mmac_panel { all: unset; box-sizing: border-box !important; pointer-events: none !important; display: flex !important; flex-direction: column !important; width: 360px !important; max-height: 80vh !important; border-radius: 14px !important; overflow: hidden !important; box-shadow: 0 12px 40px rgba(0,0,0,0.24) !important; opacity: 0 !important; pointer-events: none !important; transform: scale(.94) translateY(10px) !important; transition: opacity .22s ease, transform .22s ease !important; font-family: system-ui,-apple-system,sans-serif !important; font-size: 13px !important; line-height: 1.4 !important; color: #222 !important; letter-spacing: normal !important; word-spacing: normal !important; text-align: left !important; background: #ffffff !important; } #_mmac_panel._mmac_open { opacity: 1 !important; pointer-events: auto !important; transform: scale(1) translateY(0) !important; } /* ── HEADER ──────────────────────────────────────────────────*/ #_mmac_header { all: unset; box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 14px 16px !important; font-family: system-ui,-apple-system,sans-serif !important; font-weight: 700 !important; font-size: 1rem !important; flex-shrink: 0 !important; letter-spacing: normal !important; word-spacing: normal !important; } #_mmac_title { display: flex !important; align-items: center !important; gap: 8px !important; font-family: system-ui,-apple-system,sans-serif !important; } #_mmac_title > span svg, #_mmac_btn > span svg { width: 1em !important; height: 1em !important; fill: currentColor !important; display: block !important; } #_mmac_hdr_actions { display: flex !important; gap: 6px !important; } #_mmac_hdr_actions > button { all: unset !important; box-sizing: border-box !important; background: rgba(255,255,255,.2) !important; border-radius: 50% !important; width: 32px !important; height: 32px !important; cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important; color: inherit !important; transition: background .15s !important; flex-shrink: 0 !important; } #_mmac_hdr_actions > button:hover { background: rgba(255,255,255,.36) !important; } #_mmac_hdr_actions > button:focus-visible { outline: 2px solid rgba(255,255,255,.8) !important; outline-offset: 2px !important; } #_mmac_hdr_actions > button > span { width: 14px !important; height: 14px !important; pointer-events: none !important; } #_mmac_hdr_actions > button > span svg { width: 100% !important; height: 100% !important; fill: currentColor !important; display: block !important; } /* ── BARRA LINGUA ────────────────────────────────────────────*/ #_mmac_lang_bar { all: unset !important; box-sizing: border-box !important; display: flex !important; align-items: center !important; gap: 8px !important; flex-shrink: 0 !important; padding: 6px 14px !important; border-top: 1px solid rgba(0,0,0,.10) !important; } ._mmac_globe_icon { width: 14px !important; height: 14px !important; flex-shrink: 0 !important; opacity: .7 !important; } ._mmac_globe_icon svg { width: 100% !important; height: 100% !important; fill: currentColor !important; display: block !important; } #_mmac_lang_select { all: unset !important; box-sizing: border-box !important; flex: 1 !important; border-radius: 6px !important; padding: 4px 26px 4px 8px !important; font-family: system-ui,-apple-system,sans-serif !important; font-size: .8rem !important; font-weight: 600 !important; background-color: rgba(255,255,255,.28) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 8px center !important; color: inherit !important; cursor: pointer !important; appearance: none !important; -webkit-appearance: none !important; display: block !important; line-height: 1.4 !important; letter-spacing: normal !important; } #_mmac_lang_select:focus-visible { outline: 2px solid rgba(255,255,255,.8) !important; outline-offset: 2px !important; } #_mmac_lang_select option { background: #fff !important; color: #222 !important; font-weight: normal !important; } /* ── BODY ────────────────────────────────────────────────────*/ #_mmac_body { all: unset !important; box-sizing: border-box !important; display: block !important; background: #fff !important; overflow-y: auto !important; flex: 1 !important; padding: 12px 14px 18px !important; scrollbar-width: thin; scrollbar-color: #ccc transparent; } #_mmac_body::-webkit-scrollbar { width: 5px; } #_mmac_body::-webkit-scrollbar-thumb { background: #ccc; border-radius: 4px; } /* ── TITOLI SEZIONE ──────────────────────────────────────────*/ ._mmac_stitle { all: unset !important; display: block !important; font-family: system-ui,-apple-system,sans-serif !important; font-size: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: .1em !important; color: #888 !important; margin: 14px 0 8px !important; padding: 0 !important; line-height: 1 !important; word-spacing: normal !important; } /* ── GRIGLIA PULSANTI ────────────────────────────────────────*/ ._mmac_grid { display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 8px !important; } ._mmac_fbtn { all: unset !important; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 5px !important; padding: 11px 6px 9px !important; background: #f5f5f5 !important; border: 1.5px solid #e2e2e2 !important; border-radius: 10px !important; cursor: pointer !important; font-family: system-ui,-apple-system,sans-serif !important; font-size: .68rem !important; color: #333 !important; text-align: center !important; line-height: 1.2 !important; transition: background .14s,border-color .14s,transform .1s !important; min-height: 70px !important; letter-spacing: normal !important; word-spacing: normal !important; width: 100% !important; } /* Icona SVG dentro i pulsanti */ ._mmac_bicon { width: 1.35rem !important; height: 1.35rem !important; flex-shrink: 0 !important; color: #555 !important; pointer-events: none !important; } ._mmac_bicon svg { width: 100% !important; height: 100% !important; fill: currentColor !important; display: block !important; } ._mmac_blabel { display: block !important; font-family: system-ui,-apple-system,sans-serif !important; font-size: .68rem !important; line-height: 1.2 !important; pointer-events: none !important; } ._mmac_fbtn:hover { background: #ebebeb !important; border-color: #ccc !important; transform: translateY(-1px) !important; } ._mmac_fbtn:focus-visible { outline: 2px solid #005fcc !important; outline-offset: 2px !important; } ._mmac_fbtn._mmac_active { background: #1a1a2e !important; border-color: #1a1a2e !important; color: #fff !important; } ._mmac_fbtn._mmac_active ._mmac_bicon { color: #fff !important; } /* ── READING GUIDE ───────────────────────────────────────────*/ #_mmac_guide { position: fixed !important; left: 0 !important; right: 0 !important; /* top viene impostato esclusivamente via JS (mousemove) */ height: 32px !important; background: rgba(0,0,0,.07) !important; border-top: 2px solid rgba(0,0,0,.18) !important; border-bottom: 2px solid rgba(0,0,0,.18) !important; pointer-events: none !important; z-index: 2147483640 !important; } /* ── EFFETTI ACCESSIBILITÀ ───────────────────────────────────*/ html._mmac_hl_links a:not(#_mmac_panel a) { background: #ff0 !important; color: #000 !important; text-decoration: underline !important; padding: 0 2px !important; border-radius: 2px !important; } html._mmac_hi_contrast *:not(#_mmac_btn):not(#_mmac_btn *):not(#_mmac_panel):not(#_mmac_panel *) { background-color: #000 !important; color: #ff0 !important; border-color: #ff0 !important; } html._mmac_bg_light *:not(#_mmac_btn):not(#_mmac_btn *):not(#_mmac_panel):not(#_mmac_panel *) { background-color: #fff !important; color: #111 !important; } html._mmac_bg_dark *:not(#_mmac_btn):not(#_mmac_btn *):not(#_mmac_panel):not(#_mmac_panel *) { background-color: #1a1a1a !important; color: #eee !important; } html._mmac_hide_img img:not(#_mmac_panel img), html._mmac_hide_img picture:not(#_mmac_panel picture), html._mmac_hide_img video:not(#_mmac_panel video), html._mmac_hide_img svg:not(#_mmac_panel svg), html._mmac_hide_img figure:not(#_mmac_panel figure) { visibility: hidden !important; } html._mmac_big_cursor, html._mmac_big_cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cpath d='M8 4l28 16-10 2-6 14z' fill='%23fff' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") 8 4, auto !important; } /* focus_hl gestito via