/* ═══════════════════════════════════════════════════════════
   Panel dostępności — Gastro Miasto (styl: audytwcag.com)
   Ciemny szklany panel, przełączniki iOS-style, akcent #b54a00
   ═══════════════════════════════════════════════════════════ */

#gm-a11y {
	position: fixed;
	right: 24px;
	bottom: 10px;
	z-index: 99999;
	font-family: system-ui, sans-serif;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
}

#gm-a11y-toggle {
	width: 48px !important;
	height: 48px !important;
	padding: 0 !important;
	min-width: 0 !important;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	background-color: rgba(20, 20, 28, 0.95);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}
#gm-a11y-toggle:hover { background-color: rgba(35, 35, 48, 0.97); }

/* Ikony jako background data-URI — inline svg konfliktowało z CSS motywu */
#gm-a11y-toggle {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='4.5' r='2.5'/><path d='M12 7v4'/><path d='M8 21l2-7'/><path d='M16 21l-2-7'/><path d='M6 11h12'/></svg>");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 26px;
}

#gm-a11y-top {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='M12 19V5'/><path d='M5 12l7-7 7 7'/></svg>");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px;
}

/* Przewiń do góry — nad przyciskiem dostępności */
#gm-a11y-top {
	width: 48px !important;
	height: 48px !important;
	padding: 0 !important;
	min-width: 0 !important;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	/* background-color (nie shorthand!) — nie nadpisuje background-image z ikoną */
	background-color: rgba(20, 20, 28, 0.95);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
	transition: transform 0.2s;
}
#gm-a11y-top:hover { transform: translateY(-2px); }
#gm-a11y-top[hidden] { display: none; }

#gm-a11y-panel {
	position: absolute;
	right: 0;
	bottom: 58px;
	width: 280px;
	/* panel pokazuje całą zawartość — bez wewnętrznego scrolla */
	background: rgba(20, 20, 28, 0.95);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 20px;
	padding: 20px 20px 16px;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
	color: #fff;
}

.gm-a11y-head {
	font-size: 15px;
	font-weight: 800;
	margin-bottom: 14px;
}

.gm-a11y-label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.45);
	margin: 14px 0 8px;
}

/* Rozmiary tekstu — 4 małe kwadraty */
.gm-a11y-sizes {
	display: flex;
	gap: 6px;
}
.gm-a11y-sizes button {
	width: 36px;
	height: 36px;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background: rgba(255, 255, 255, 0.06);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	padding: 0;
}
.gm-a11y-sizes button:hover { background: rgba(255, 255, 255, 0.12); }
.gm-a11y-sizes button[aria-pressed="true"] {
	background: #b54a00;
	border-color: #b54a00;
}

/* Rozmiar podstawowy (reset) — wyróżniony przerywaną ramką */
.gm-a11y-sizes button.gm-a11y-size-default {
	border: 1.5px dashed rgba(255, 255, 255, 0.45);
}
.gm-a11y-sizes button.gm-a11y-size-default[aria-pressed="true"] {
	border: 1.5px solid #b54a00;
}

/* Wiersze przełączników */
.gm-a11y-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 6px 0;
}
.gm-a11y-row span { font-size: 13px; color: rgba(255, 255, 255, 0.8); }

.gm-a11y-row button[role="switch"] {
	position: relative;
	width: 40px;
	height: 22px;
	border-radius: 11px;
	background: rgba(255, 255, 255, 0.1);
	border: none;
	cursor: pointer;
	padding: 0;
	flex-shrink: 0;
	transition: background 0.25s;
}
.gm-a11y-row button[role="switch"] i {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 18px;
	height: 18px;
	border-radius: 9px;
	background: rgba(255, 255, 255, 0.55);
	transition: left 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.25s;
}
.gm-a11y-row button[role="switch"][aria-checked="true"] { background: #b54a00; }
.gm-a11y-row button[role="switch"][aria-checked="true"] i { left: 20px; background: #fff; }

#gm-a11y-reset {
	width: 100%;
	margin-top: 12px;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.15);
	background: transparent;
	color: rgba(255, 255, 255, 0.8);
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}
#gm-a11y-reset:hover { background: rgba(255, 255, 255, 0.08); }

/* ── Efekty ustawień ────────────────────────── */

/* Rozmiar tekstu (BeTheme używa px — skalujemy zoomem) */
html.a11y-font-1 #Wrapper { zoom: 1.1; }
html.a11y-font-2 #Wrapper { zoom: 1.2; }
html.a11y-font-3 #Wrapper { zoom: 1.35; }

/* Wysoki kontrast — inwersja z korektą barw; media odwracane z powrotem */
/* filter na #Wrapper (nie body!) — filter/zoom na body łamie position:fixed
   elementów potomnych (widget pozycjonowałby się względem body) */
html.a11y-contrast #Wrapper {
	filter: invert(1) hue-rotate(180deg);
	background: #000;
}
html.a11y-contrast #Wrapper img,
html.a11y-contrast #Wrapper video,
html.a11y-contrast #Wrapper iframe,
html.a11y-contrast #Wrapper svg,
html.a11y-contrast #Wrapper [style*="background-image"] {
	filter: invert(1) hue-rotate(180deg);
}

/* Podkreślenie linków */
html.a11y-underline a { text-decoration: underline !important; }

/* Duży kursor */
html.a11y-cursor,
html.a11y-cursor body,
html.a11y-cursor a,
html.a11y-cursor button {
	cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24"><path d="M5 2l14 12h-8l4 8-3 1.5L8.5 15 5 18z" fill="black" stroke="white" stroke-width="1.5"/></svg>') 4 2, auto !important;
}

/* Wyłączenie animacji */
html.a11y-noanim *,
html.a11y-noanim *::before,
html.a11y-noanim *::after {
	animation: none !important;
	transition: none !important;
	scroll-behavior: auto !important;
}

/* Zwiększona interlinia */
html.a11y-spacing body p,
html.a11y-spacing body li {
	line-height: 2 !important;
}

/* Podświetlenie fokusa */
html.a11y-focus *:focus {
	outline: 4px solid #ffd500 !important;
	outline-offset: 3px !important;
}

/* Odcienie szarości */
html.a11y-gray #Wrapper { filter: grayscale(1); }
html.a11y-gray.a11y-contrast #Wrapper { filter: invert(1) hue-rotate(180deg) grayscale(1); }

/* Czytelna czcionka */
html.a11y-readable body,
html.a11y-readable body * {
	font-family: Arial, Helvetica, system-ui, sans-serif !important;
	letter-spacing: 0.02em;
}

/* Tryb dla dysleksji */
html.a11y-dyslexia body,
html.a11y-dyslexia body * {
	font-family: Verdana, Arial, system-ui, sans-serif !important;
	letter-spacing: 0.08em !important;
	word-spacing: 0.16em !important;
}
html.a11y-dyslexia body p,
html.a11y-dyslexia body li {
	line-height: 2 !important;
	text-align: left !important;
}
