/* ============================================================================
   AURORA - polish vrstva (themes/bootstrap/polish.css)
   Načítava sa za style.css (Tailwind build), takže prepisuje bez zásahu do kompilovaného súboru.

   Čo táto vrstva opravuje:
   1. Čitateľnosť. Aurora vynucuje sivý text (.lead, .text-white-50 -> --text-soft), ale hero je podľa
      --hero-* tokenov fialový gradient - podtitul bol sivý na fialovej a nedal sa prečítať. Cookie lišta
      mala <small> v #484c59 na #1a1a2e (kontrast 1,99:1).
   2. Jednotná značková farba. Aurora má pevné --teal, admin nastavuje --primary-color (#6c5ce7), takže
      tlačidlá boli tyrkysové a hero fialový. Brand sa berie z --hero-mid (= admin primary).
   3. Pohyb a hĺbka: jeden vstupný efekt v hero, jemný pohyb pozadia, hover odozvy na kartách.
      Všetko len transform/opacity (GPU), žiadne blur filtre ani JS => rýchle. Rešpektuje reduced-motion.

   Prvky:  1 tokeny · 2 základ · 3 hero · 4 štatistiky · 5 vyhľadávanie a úvodný box · 6 karty serverov
           7 tlačidlá a formuláre · 8 pätička a cookie lišta · 9 pohyb a dostupnosť
   ============================================================================ */


/* ================================ 1  TOKENY ================================ */
:root {
  /* značka = farba, ktorú nastavil admin (theme-variables ju dáva do --hero-mid) */
  --brand: var(--hero-mid, #6c5ce7);
  --brand-deep: var(--primary-dark, #3b2fb0);
  --brand-ink: #2a2178;              /* text na svetlom podklade, kontrast 10:1 */
  --brand-soft: #efedfd;
  --brand-ring: rgba(108, 92, 231, .30);
  --accent: #00cec9;                 /* sekundárna (theme_secondary_color) - len akcenty, nie text */

  /* Aurora používa --teal*: napoj ich na značku, nech sú tlačidlá, odkazy aj hero jedna rodina */
  --teal: var(--brand);
  --teal-deep: var(--brand-deep);
  --teal-light: var(--brand-soft);
  --primary-color: var(--brand);
  --primary-hover: var(--brand-deep);
  --link-color: var(--brand-ink);

  --page-bg: #f6f5fb;
  --paper: #f6f5fb;
  --ink: #17142e;
  --ink-soft: #4b4864;               /* 8,6:1 na bielej */

  --ok-ink: #14693f;
  --info-ink: #0b6a7e;
  --warn-ink: #8a5a08;

  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --shadow-1: 0 1px 2px rgba(23, 20, 46, .06), 0 1px 3px rgba(23, 20, 46, .06);
  --shadow-2: 0 8px 24px -10px rgba(23, 20, 46, .22), 0 0 0 1px rgba(23, 20, 46, .04);
  --shadow-3: 0 18px 40px -14px rgba(60, 40, 180, .38), 0 0 0 1px rgba(23, 20, 46, .05);
  --ease: cubic-bezier(.2, .7, .2, 1);
}


/* ================================= 2  ZÁKLAD ================================ */
body {
  background: var(--page-bg);
  color: var(--ink);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-family: inherit; color: var(--ink); letter-spacing: -.02em; }
.text-muted, .small, small { color: var(--ink-soft) !important; }
a { color: var(--brand-ink); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: var(--brand); }
::selection { background: var(--brand-ring); color: var(--ink); }
:focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; border-radius: 4px; }

.navbar { background: rgba(255, 255, 255, .92) !important; border-bottom: 1px solid #e7e5f2; }
.navbar-brand { color: var(--ink) !important; font-weight: 800; letter-spacing: -.03em; }
.navbar-dark .navbar-nav .nav-link { color: var(--ink-soft) !important; transition: color .15s var(--ease), border-color .15s var(--ease); }
.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus { color: var(--ink) !important; border-bottom-color: var(--brand); }


/* ================================== 3  HERO ================================= */
/* "body " dáva vyššiu špecificitu než .page-hero v psl-system/pages-unified/style.css */
body .page-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #fff;
  text-align: left;
  padding: clamp(2.25rem, 1.2rem + 4vw, 4.25rem) 0 clamp(2rem, 1rem + 3vw, 3.5rem);
  margin-bottom: 2rem;
  border-bottom: 0;
  background:
    radial-gradient(70rem 28rem at 105% -30%, rgba(0, 206, 201, .30), transparent 62%),
    linear-gradient(135deg, var(--brand-deep) 0%, var(--brand) 58%, color-mix(in srgb, var(--brand) 78%, #fff) 100%);
}
/* pomaly sa pohybujúce svetlo - jediný "wow" prvok stránky; len transform => GPU, bez blur filtra */
body .page-hero::before,
body .page-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 46vmax;
  height: 46vmax;
  border-radius: 50%;
  pointer-events: none;
  will-change: transform;
}
body .page-hero::before {
  left: -14vmax; top: -22vmax;
  background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .20), transparent 62%);
  animation: aurora-a 22s ease-in-out infinite alternate;
}
body .page-hero::after {
  right: -12vmax; bottom: -30vmax;
  background: radial-gradient(circle at 50% 50%, rgba(0, 206, 201, .34), transparent 64%);
  animation: aurora-b 26s ease-in-out infinite alternate;
}
@keyframes aurora-a { to { transform: translate3d(14vmax, 8vmax, 0) scale(1.15); } }
@keyframes aurora-b { to { transform: translate3d(-16vmax, -6vmax, 0) scale(1.1); } }

body .page-hero .text-center,
body .page-hero header { text-align: left !important; }

body .page-hero h1 {
  color: #fff;
  font-size: clamp(2rem, 1.2rem + 3.6vw, 3.35rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.035em;
  max-width: 20ch;
  text-wrap: balance;
  text-shadow: 0 2px 18px rgba(20, 10, 70, .35);
}
body .page-hero h1 .fas { display: inline-block; opacity: .9; font-size: .7em; vertical-align: .08em; }
/* hlavný dôvod nečitateľnosti: sivý .lead na fialovom podklade. Biely text s tieňom, kontrast > 9:1 */
body .page-hero .lead,
body .page-hero p {
  color: rgba(255, 255, 255, .94) !important;
  font-size: clamp(1.05rem, .95rem + .5vw, 1.3rem);
  font-weight: 450;
  line-height: 1.5;
  max-width: 44ch;
  margin-left: 0 !important;
  text-shadow: 0 1px 12px rgba(20, 10, 70, .35);
}
body .page-hero .text-white-50 { color: rgba(255, 255, 255, .94) !important; }

/* rýchle akcie priamo v hero (kvíz, server dňa, náhodný server) */
.hero-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }
.hero-actions .btn {
  height: 2.75rem; padding: 0 1.15rem; border-radius: 999px; font-weight: 650; font-size: .95rem;
  border: 1.5px solid rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .12); color: #fff;
  transition: transform .18s var(--ease), background-color .18s var(--ease), color .18s var(--ease), box-shadow .18s var(--ease);
}
.hero-actions .btn:hover { background: #fff; color: var(--brand-ink); border-color: #fff; transform: translateY(-2px); box-shadow: 0 10px 22px -10px rgba(10, 5, 60, .6); }
.hero-actions .btn:active { transform: translateY(0); }
.hero-actions .btn-primary-cta { background: #fff; color: var(--brand-ink); border-color: #fff; }
.hero-actions .btn-primary-cta:hover { background: #f1efff; }

/* jediná vstupná animácia stránky: obsah hero sa po načítaní jemne vynorí (raz, 0,5 s) */
@media (prefers-reduced-motion: no-preference) {
  body .page-hero header > * { animation: rise .55s var(--ease) both; }
  body .page-hero header > :nth-child(2) { animation-delay: .08s; }
  body .page-hero header > :nth-child(3) { animation-delay: .16s; }
  @keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
}


/* ============================ 4  ŠTATISTIKY ================================= */
.stat-card, .stat-card.text-center {
  position: relative;
  text-align: left;
  border: 1px solid #e7e5f2;
  border-radius: var(--r-md);
  background: #fff;
  box-shadow: var(--shadow-1);
  overflow: hidden;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.stat-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--brand); }
.stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-3); border-color: transparent; }
.stat-card .card-body { padding: 1.1rem 1.25rem 1.1rem 1.5rem; }
.stat-card .stat-value, .stat-card h4 {
  font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.5rem);
  font-weight: 800; line-height: 1.05; letter-spacing: -.03em; font-variant-numeric: tabular-nums; margin-bottom: .15rem !important;
}
.stat-card .text-muted { font-size: .85rem; font-weight: 550; letter-spacing: 0; text-transform: none; }
/* farby čísel s dostatočným kontrastom (Lighthouse: #0dcaf0 na bielej = 1,95:1) */
.stat-card .text-primary { color: var(--brand-ink) !important; }
.stat-card .text-success { color: var(--ok-ink) !important; }
.stat-card .text-info    { color: var(--info-ink) !important; }
.stat-card .text-warning { color: var(--warn-ink) !important; }
.stat-card:nth-child(1)::before { background: var(--brand); }
#stats-container .col-6:nth-child(2) .stat-card::before { background: #1f9d5c; }
#stats-container .col-6:nth-child(3) .stat-card::before { background: #0aa3bf; }
#stats-container .col-6:nth-child(4) .stat-card::before { background: #e0a100; }
/* živý bod pri "Online" */
#stats-container .col-6:nth-child(2) .stat-value::before {
  content: ""; display: inline-block; width: .42em; height: .42em; margin-right: .35em; vertical-align: .14em;
  border-radius: 50%; background: #1f9d5c; box-shadow: 0 0 0 0 rgba(31, 157, 92, .55);
  animation: live-dot 2.2s ease-out infinite;
}
@keyframes live-dot { 70% { box-shadow: 0 0 0 .5em rgba(31, 157, 92, 0); } 100% { box-shadow: 0 0 0 0 rgba(31, 157, 92, 0); } }


/* ================= 5  VYHĽADÁVANIE A ÚVODNÝ BOX ============================= */
.card { border: 1px solid #e7e5f2; border-radius: var(--r-md); box-shadow: var(--shadow-1); }
.card-header { font-size: .85rem; text-transform: none; letter-spacing: 0; color: var(--ink); font-weight: 700; }
.form-label { font-size: .85rem; font-weight: 650; color: var(--ink); }
.form-control, .form-select {
  min-height: 2.8rem; border: 1.5px solid #d9d6ec; border-radius: var(--r-sm); background: #fff; color: var(--ink);
  transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
}
.form-control::placeholder { color: #6f6b8a; }
.form-control:hover, .form-select:hover { border-color: #b9b4de; }
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 4px var(--brand-ring); }

/* úvodný text z admina (homepage_intro) - bol sivý box s tenkou modrou linkou */
.alert.alert-light {
  background: #fff; color: var(--ink); border: 1px solid #e7e5f2; border-left: 4px solid var(--brand); border-radius: var(--r-md);
  box-shadow: var(--shadow-1); font-size: 1.05rem; line-height: 1.6;
}
.alert.alert-light > div { color: var(--ink) !important; }


/* ============================ 6  KARTY SERVEROV ============================ */
.unified-server-card {
  border: 1px solid #e7e5f2; border-left-width: 4px; border-radius: var(--r-md); background: #fff; box-shadow: var(--shadow-1);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.unified-server-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-3); background: #fff; }
.unified-server-card.featured { border-color: var(--brand); background: linear-gradient(180deg, #faf9ff, #fff 60%); }
.unified-server-card .server-title { color: var(--ink); font-weight: 700; letter-spacing: -.01em; }
.server-status { font-weight: 650; }
.server-status.online .status-dot { box-shadow: 0 0 0 0 rgba(31, 157, 92, .55); animation: live-dot 2.2s ease-out infinite; }
.featured-badge { background: #fff4d6; color: #7a4f00; border: 1px solid #f1d68a; border-radius: 999px; }
.player-count { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
.connection-info { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #f5f4fb; color: var(--ink); }
.unified-server-card .player-bar .progress { height: .45rem; border-radius: 999px; background: #ebe9f7; }
.unified-server-card .player-bar .progress-bar { background: linear-gradient(90deg, var(--brand), var(--accent)); border-radius: 999px; }


/* ====================== 7  TLAČIDLÁ A FORMULÁRE ============================= */
.btn { border-radius: var(--r-sm); font-weight: 600; transition: transform .15s var(--ease), box-shadow .15s var(--ease), background-color .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease); }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 6px 14px -8px var(--brand); }
.btn-primary:hover { background: var(--brand-deep); border-color: var(--brand-deep); box-shadow: 0 10px 20px -10px var(--brand); }
.btn-outline-primary { color: var(--brand-ink); border-color: var(--brand); background: transparent; }
.btn-outline-primary:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.btn-success { background: #1a8a52; border-color: #1a8a52; }
.badge.bg-primary { background: var(--brand) !important; }
.page-item.active .page-link { background: var(--brand); border-color: var(--brand); }
.page-link { color: var(--brand-ink); }


/* ====================== 8  PÄTIČKA A COOKIE LIŠTA ========================== */
.site-footer { background: #fff; border-top: 1px solid #e7e5f2; margin-top: 3rem; }
.site-footer .footer-title { color: var(--ink); font-weight: 750; font-size: .95rem; }
.site-footer .footer-link { color: var(--ink-soft); text-decoration: none; transition: color .15s var(--ease); }
.site-footer .footer-link:hover { color: var(--brand-ink); text-decoration: underline; }

/* Aurora vynucuje small{color:var(--text-soft)!important}, na tmavej lište bol text 1,99:1 */
.psl-cookie-bar small, .psl-cookie-bar .small, .psl-cookie-bar .text-muted { color: rgba(255, 255, 255, .78) !important; }
.psl-cookie-bar b { color: #fff; }
.psl-cookie-bar { background: rgba(23, 20, 46, .97); border-top: 0 !important; border-image: none !important; box-shadow: 0 -14px 34px -10px rgba(10, 5, 50, .5); }
.psl-cookie-bar::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, var(--brand), var(--accent)); }
.psl-cookie-link { color: #c9c2ff; }
.psl-cookie-link:hover { color: #fff; }


/* ===================== 9  POHYB A DOSTUPNOSŤ ================================== */
@media (max-width: 767.98px) {
  body .page-hero { padding-top: 1.9rem; }
  body .page-hero h1 { max-width: none; }
  .hero-actions .btn { flex: 1 1 calc(50% - .6rem); justify-content: center; padding: 0 .8rem; }
  .stat-card .card-body { padding: .9rem 1rem .9rem 1.2rem; }
}
@media (prefers-reduced-motion: reduce) {
  body .page-hero::before, body .page-hero::after { animation: none; }
  .server-status.online .status-dot, #stats-container .col-6:nth-child(2) .stat-value::before { animation: none; }
  .stat-card:hover, .unified-server-card:hover, .btn:hover, .hero-actions .btn:hover { transform: none; }
}
@media (prefers-contrast: more) {
  .card, .stat-card, .unified-server-card { border-color: #6f6b8a; }
}

/* Bootstrap .text-center je !important - bez toho by štatistické karty ostali zarovnané na stred */
.stat-card.text-center { text-align: left !important; }