/* Prihlasovacia stránka – samostatná (zvyšok štýlov je dostupný až po prihlásení). */
@font-face { font-family: "Geist"; font-weight: 400; font-display: swap; src: url("/vendor/fonts/Geist-Regular.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-weight: 500; font-display: swap; src: url("/vendor/fonts/Geist-Medium.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-weight: 600; font-display: swap; src: url("/vendor/fonts/Geist-SemiBold.woff2") format("woff2"); }

:root {
  color-scheme: light;
  --bg: #fafafa; --text: #141518; --muted: #6f7279; --accent: #1463f3; --bad: #d93a2b;
  --field: rgba(255, 255, 255, 0.85); --field-border: rgba(20, 21, 24, 0.14);
  --glass-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.5) 55%, rgba(255, 255, 255, 0.64));
  --glass-border: rgba(20, 21, 24, 0.09);
  --grid-tile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Cpath d='M0 .5H26M.5 0V26' fill='none' stroke='%23141518' stroke-opacity='.04'/%3E%3Ccircle cx='.5' cy='.5' r='1' fill='%23141518' fill-opacity='.1'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #1f1f21; --text: #f2f3f5; --muted: #9a9da5; --accent: #4c8dff; --bad: #ff6b5e;
    --field: rgba(255, 255, 255, 0.06); --field-border: rgba(255, 255, 255, 0.16);
    --glass-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.045) 55%, rgba(255, 255, 255, 0.07));
    --glass-border: rgba(255, 255, 255, 0.16);
    --grid-tile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Cpath d='M0 .5H26M.5 0V26' fill='none' stroke='%23ffffff' stroke-opacity='.035'/%3E%3Ccircle cx='.5' cy='.5' r='1' fill='%23ffffff' fill-opacity='.11'/%3E%3C/svg%3E");
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #1f1f21; --text: #f2f3f5; --muted: #9a9da5; --accent: #4c8dff; --bad: #ff6b5e;
  --field: rgba(255, 255, 255, 0.06); --field-border: rgba(255, 255, 255, 0.16);
  --glass-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.045) 55%, rgba(255, 255, 255, 0.07));
  --glass-border: rgba(255, 255, 255, 0.16);
  --grid-tile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Cpath d='M0 .5H26M.5 0V26' fill='none' stroke='%23ffffff' stroke-opacity='.035'/%3E%3Ccircle cx='.5' cy='.5' r='1' fill='%23ffffff' fill-opacity='.11'/%3E%3C/svg%3E");
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font: 14px/1.45 "Geist", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--text); background-color: var(--bg); background-image: var(--grid-tile);
}
.wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; position: relative; }
.card {
  width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 16px; padding: 28px;
  background: var(--glass-bg); border: 1px solid var(--glass-border); border-radius: 20px;
  backdrop-filter: blur(32px) saturate(160%); -webkit-backdrop-filter: blur(32px) saturate(160%);
  box-shadow: 0 20px 50px -24px rgba(0, 0, 0, 0.35);
}
.brand { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 16px; }
.brand svg { width: 30px; height: 30px; }
h1 { margin: 4px 0 0; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.field { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; color: var(--muted); }
.field[hidden] { display: none; }
.field small { font-size: 12px; }
input {
  font: inherit; font-size: 15px; color: var(--text); background: var(--field); border: 1px solid var(--field-border);
  border-radius: 10px; padding: 10px 12px; width: 100%;
}
input:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#code { letter-spacing: 0.12em; font-variant-numeric: tabular-nums; }
.error { margin: 0; color: var(--bad); font-size: 13px; }
.error[hidden] { display: none; }
button[type="submit"] {
  font: inherit; font-weight: 600; font-size: 14.5px; color: #fff; background: var(--accent); border: 0;
  border-radius: 10px; padding: 11px 14px; cursor: pointer;
}
button[type="submit"]:disabled { opacity: 0.6; cursor: progress; }
.lang {
  position: absolute; top: 16px; right: 16px; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted);
  background: transparent; border: 1px solid var(--glass-border); border-radius: 10px; padding: 6px 10px; cursor: pointer;
}