/* =========================================================
   ACCESSIBILITY – INFO KIOSK
   ========================================================= */

/* -------------------------------
   SKALA GLOBALNA
-------------------------------- */
:root {
  --ui-scale: 1;

  --font-base: calc(16px * var(--ui-scale));
  --font-large: calc(20px * var(--ui-scale));
  --font-xl: calc(26px * var(--ui-scale));
}

/* baza */
html {
  font-size: var(--font-base);
}

/* -------------------------------
   TYPOGRAFIA
-------------------------------- */
body {
  font-size: 1rem;
}

h1 {
  font-size: var(--font-xl);
}

h2 {
  font-size: calc(22px * var(--ui-scale));
}

p,
span,
button,
input {
  font-size: var(--font-large);
}

/* -------------------------------
   KAFLE / LISTY
-------------------------------- */
.topic-tile,
.target-card,
.floor-thumb {
  padding: calc(20px * var(--ui-scale));
  font-size: calc(18px * var(--ui-scale));
}

.target-title {
  font-size: calc(18px * var(--ui-scale));
  font-weight: 700;
}

.target-meta {
  font-size: calc(15px * var(--ui-scale));
}

/* -------------------------------
   MAPA – NIE SKALUJEMY SVG
-------------------------------- */
#svgHost svg {
  font-size: initial !important;
}

/* -------------------------------
   WYSOKI KONTRAST (WCAG)
-------------------------------- */
body.high-contrast {
  background: #000;
  color: #fff;
}

/* kafle */
body.high-contrast .topic-tile,
body.high-contrast .target-card,
body.high-contrast .floor-thumb {
  background: #111;
  color: #fff;
  border: 2px solid #fff;
}

/* hover */
body.high-contrast .topic-tile:hover,
body.high-contrast .target-card:hover {
  background: #222;
}

/* nagłówki */
body.high-contrast h1,
body.high-contrast h2 {
  color: #fff;
}

/* przyciski */
body.high-contrast button {
  background: #000;
  color: #fff;
  border: 2px solid #fff;
}

/* inputy */
body.high-contrast input {
  background: #000;
  color: #fff;
  border: 2px solid #fff;
}

/* placeholder */
body.high-contrast ::placeholder {
  color: #ccc;
}

/* -------------------------------
   FOCUS – WCAG 2.2
-------------------------------- */
button:focus-visible,
input:focus-visible {
  outline: 4px solid #ffcc00;
  outline-offset: 4px;
}

/* -------------------------------
   IKONY SVG – NIE ZMIENIAMY
-------------------------------- */
body.high-contrast svg {
  fill: currentColor;
}

/* ============================= */
/* KONTRAST – EXTRA TILE FIX    */
/* ============================= */

body.high-contrast .extra-tile {
    background: #000 !important;
    color: #fff !important;
    border: 2px solid #fff !important;
    box-shadow: none !important;
}

body.high-contrast .extra-tile:hover {
    background: #111 !important;
}

body.high-contrast .extra-icon {
    filter: brightness(0) invert(1);
}