/* ================================================
   Alfa-System brand override for LibreSpeed
   ================================================ */

:root {
  /* Alfa-System palette */
  --theme-green: #059669;
  --theme-pink:  #1e40af;

  /* Background */
  --background-backup-color:  #0f172a;
  --background-overlay-color: transparent;

  /* Text */
  --tagline-text-color:               #93c5fd;
  --secondary-text-color:             rgba(255,255,255,0.45);
  --ping-and-jitter-primary-text-color:   #f1f5f9;
  --ping-and-jitter-secondary-text-color: rgba(255,255,255,0.4);
  --primary-text-disabled-color:      rgba(255,255,255,0.3);

  /* Button */
  --button-gradient-1-color-1: #1e40af;
  --button-gradient-1-color-2: #059669;
  --button-gradient-1-color-3: #1e3a8a;
  --button-shadow-color:       rgba(30, 64, 175, 0.45);
  --button-text-color:         #ffffff;
  --button-disabled-background-color: rgba(255,255,255,0.12);

  /* Gauge */
  --gauge-background-color: rgba(30, 58, 138, 0.25);
  --gauge-progress-color:   rgba(30, 58, 138, 0.25);
  --gauge-pointer-green:    #34d399;
  --gauge-pointer-pink:     #93c5fd;

  /* Server selector */
  --server-selector-background-color:       rgba(15, 30, 80, 0.7);
  --server-selector-border-color:           rgba(147, 197, 253, 0.25);
  --server-selector-hover-border-color:     #059669;
  --server-selector-hover-background-color: rgba(30, 64, 175, 0.3);

  /* Dialog */
  --popup-background-color: #1e293b;
  --popup-shadow-color:      rgba(0,0,0,0.6);
}

/* ── Background ───────────────────────────── */
html {
  background: #0f172a;
  background-image: none;
}

body {
  background: linear-gradient(160deg, #080f24 0%, #0d2155 55%, #080f24 100%);
}

/* ── Navbar / header ──────────────────────── */
header {
  background: #ffffff;
  padding: 1rem 3.2rem;
  margin: 0;
  box-shadow: 0 2px 16px rgba(0,0,0,0.3);
  display: flex;
  align-items: center;
}

header img {
  height: 4.8rem;
  width: auto;
}

/* ── Main headings ────────────────────────── */
main > h1 {
  font-size: 4rem;
  font-weight: 700;
  letter-spacing: -0.15rem;
  margin-top: 1rem;
}

main > p.tagline:first-of-type {
  font-size: 1.8rem;
  margin-bottom: 0;
}

/* ── Info note ────────────────────────────── */
main > p.tagline + p.tagline {
  background: rgba(30, 58, 138, 0.2) !important;
  border: 1px solid rgba(147, 197, 253, 0.2) !important;
  border-radius: 10px !important;
  padding: 1.2rem 2.4rem !important;
  font-size: 1.45rem !important;
  color: rgba(255,255,255,0.7) !important;
  max-width: 62rem;
  margin: 0 auto 4rem !important;
  line-height: 1.7 !important;
  letter-spacing: 0 !important;
  font-weight: 400 !important;
}

/* ── Server selector label ────────────────── */
.server-selector .chosen > p {
  font-size: 1.1rem;
  letter-spacing: 0.08rem;
  text-transform: uppercase;
  opacity: 0.5;
}

/* ── Button ───────────────────────────────── */
button {
  border-radius: 5rem !important;
  letter-spacing: 0.05rem;
}

button.disabled {
  background: rgba(255,255,255,0.1) !important;
  color: rgba(255,255,255,0.35) !important;
}

/* ── Footer ───────────────────────────────── */
footer {
  padding-bottom: 3rem;
}

footer > p.source a {
  color: #6ee7b7 !important;
  font-weight: 600;
}

footer > p.source a:hover {
  color: #34d399 !important;
}

/* ── Dialog ───────────────────────────────── */
dialog {
  background: #1e293b;
  border: 1px solid rgba(147, 197, 253, 0.15);
  border-radius: 16px;
  color: #f1f5f9;
}

dialog h1 {
  color: #f1f5f9;
  border-bottom: 1px solid rgba(147, 197, 253, 0.15);
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
}

dialog h2 {
  color: #6ee7b7;
}
/* ── Fix hidden privacy-warning (opacity:0 still takes space) ── */
#privacy-warning.hidden {
  display: none !important;
}

/* ── Info note – czytelność ───────────────── */
main > p.tagline + p.tagline {
  font-size: 1.6rem !important;
  color: rgba(255,255,255,0.88) !important;
  margin-bottom: 2rem !important;
}

/* ── Zmniejsz odstępy tagline → button ────── */
main > p.tagline:first-of-type {
  margin-bottom: 1.5rem !important;
}

/* ── Info note – standalone element ─────── */
#as-info {
  display: inline-block;
  background: rgba(30, 64, 175, 0.25);
  border: 1px solid rgba(147, 197, 253, 0.35);
  border-left: 4px solid #059669;
  border-radius: 8px;
  padding: 1.6rem 2.4rem;
  font-size: 1.7rem;
  font-weight: 500;
  color: #e2e8f0;
  line-height: 1.7;
  margin: 0.5rem auto 3rem;
  max-width: 68rem;
  text-align: center;
}

#as-info-icon {
  color: #059669;
  font-weight: 700;
  margin-right: 0.4rem;
}

/* Remove old tagline+tagline rules that no longer apply */
main > p.tagline + p.tagline { display: none; }

/* ── Fix layout jump on test start ──────── */
/* Revert display:none — keeps space reserved to prevent jump */
#privacy-warning.hidden {
  display: block !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Usuń duży margin-top z privacy-warning */
#privacy-warning {
  margin-top: 0 !important;
  min-height: 5.3rem;
}

/* ── Footer link – pozycja i kolor ──────── */
footer {
  padding: 1.5rem 5rem !important;
}

footer > p.source a {
  color: rgba(255,255,255,0.45) !important;
  font-weight: 400 !important;
}

footer > p.source a:hover {
  color: rgba(255,255,255,0.75) !important;
}

/* ── Button disabled – czytelny ─────────── */
button.disabled {
  background: rgba(255,255,255,0.15) !important;
  color: rgba(255,255,255,0.6) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}