/* styles/default/base.css — písmo Inter, reset, html/body, typografie elementů, odkazy, fokus, výběr
   Created :: 2026-10-21
   Updated :: 2026-10-28
   2026-10-28 :: M9 – M9-14 (viz 04 kap. 3) */

@font-face {
  font-family: "Inter";
  src: url("../fonts/InterVariable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/InterVariable-Italic.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html {
  font-size: 62.5%;            /* 1rem = 10px, respektuje zvětšení v prohlížeči */
  height: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-height: 100%;
  font: var(--fw-regular) var(--fs-base) / var(--lh-base) var(--font-sans);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  transition: background-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out);   /* přepnutí tématu */
}

img, svg, video, canvas { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; text-align: inherit; }
input, textarea, select { background: none; border: 0; }
table { border-collapse: collapse; border-spacing: 0; }
ul[class], ol[class] { list-style: none; padding: 0; }
hr { border: 0; border-top: 1px solid var(--color-border); }
fieldset { border: 0; padding: 0; min-width: 0; }
legend { padding: 0; }
dialog { padding: 0; border: 0; background: transparent; color: inherit; max-width: none; max-height: none; }
[popover] { margin: 0; padding: 0; border: 0; background: transparent; color: inherit; inset: auto; }
[hidden] { display: none !important; }

/* ---------- Typografie ---------- */
h1 { font-size: var(--fs-xl); font-weight: var(--fw-semibold); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); }
h2 { font-size: var(--fs-lg); font-weight: var(--fw-semibold); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); }
h3 { font-size: var(--fs-md); font-weight: var(--fw-semibold); line-height: var(--lh-tight); }
h4 { font-size: var(--fs-base); font-weight: var(--fw-semibold); line-height: var(--lh-tight); }
small { font-size: var(--fs-sm); }
strong, b { font-weight: var(--fw-semibold); }
code, kbd, samp, pre { font-family: var(--font-mono); font-size: .92em; }
mark { background: var(--mark-bg); color: inherit; padding: 0 .15em; border-radius: var(--r-xs); }

a { color: var(--color-link); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: .15em; }

::selection { background: var(--color-primary-soft); color: inherit; }
::placeholder { color: var(--color-text-subtle); opacity: 1; }

/* ---------- Fokus: jednotný ring pro všechny interaktivní prvky ---------- */
:focus:not(:focus-visible) { outline: none; }
:focus-visible {
  outline: var(--stroke-2) solid transparent;
  outline-offset: var(--stroke-2);
  box-shadow: var(--focus-ring);
  border-radius: var(--r-sm);
}

/* ---------- Pohyb ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}