/* ==========================================================================
   APOLO CORE · Animowane tło strony logowania
   Bez JavaScript. Animowane są tylko transform i background-position.
   Wymaga znaczników HTML z pliku apolo_tlo_logowania.html.
   ========================================================================== */
.login-bg {
  --sun-time: 14s;            /* czas przejścia słońca z jednej strony na drugą */
  --sun-color: 243, 198, 68;  /* złoty APOLO */
  position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;   /* pod całą treścią strony */
  background:
    radial-gradient(ellipse 140% 100% at 50% 0%, rgba(var(--sun-color), .06) 0%, rgba(var(--sun-color), .02) 45%, rgba(var(--sun-color), 0) 75%),
    linear-gradient(180deg, #16171a 0%, #121518 55%, #0e1114 100%);
}
/* Słońce: ruch poziomy + pionowy = łuk jak po niebie */
.login-bg .sun-x { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  animation: apolo-sun-x var(--sun-time) ease-in-out infinite alternate; will-change: transform; }
.login-bg .sun-y { position: absolute; left: 0; top: 0; width: 0; height: 0;
  animation: apolo-sun-y calc(var(--sun-time) / 2) ease-in-out infinite alternate; will-change: transform; }
.login-bg .sun {
  position: absolute; width: 170vmax; height: 170vmax; left: -85vmax; top: -85vmax; border-radius: 50%;
  background: radial-gradient(circle closest-side,
    rgba(var(--sun-color), .42) 0%,
    rgba(var(--sun-color), .34) 5%,
    rgba(var(--sun-color), .27) 11%,
    rgba(var(--sun-color), .21) 18%,
    rgba(var(--sun-color), .16) 26%,
    rgba(var(--sun-color), .12) 35%,
    rgba(var(--sun-color), .085) 45%,
    rgba(var(--sun-color), .055) 56%,
    rgba(var(--sun-color), .03) 68%,
    rgba(var(--sun-color), .013) 81%,
    rgba(var(--sun-color), .004) 92%,
    rgba(var(--sun-color), 0) 100%);
  animation: apolo-breathe 9s ease-in-out infinite alternate;
}
@keyframes apolo-sun-x   { from { transform: translateX(8vw) }  to { transform: translateX(92vw) } }
@keyframes apolo-sun-y   { from { transform: translateY(62vh) } to { transform: translateY(10vh) } }
@keyframes apolo-breathe { from { transform: scale(.94); opacity: .85 } to { transform: scale(1.06); opacity: 1 } }

/* Delikatne fale od logo */
.login-bg .rings {
  position: absolute; left: 50%; top: 27%; width: 1500px; height: 1500px; margin: -750px 0 0 -750px; border-radius: 50%;
  background: repeating-radial-gradient(circle,
    rgba(var(--sun-color), 0) 0px, rgba(var(--sun-color), .022) 30px, rgba(var(--sun-color), 0) 60px,
    rgba(var(--sun-color), 0) 110px);
  -webkit-mask-image: radial-gradient(circle, #000 10%, rgba(0, 0, 0, .5) 35%, transparent 62%);
          mask-image: radial-gradient(circle, #000 10%, rgba(0, 0, 0, .5) 35%, transparent 62%);
  animation: apolo-rings 14s ease-in-out infinite; will-change: transform, opacity;
}
@keyframes apolo-rings { 0% { transform: scale(.85); opacity: 0 } 30% { opacity: 1 } 100% { transform: scale(1.15); opacity: 0 } }

/* Ziarno — usuwa „schodki” w ciemnych gradientach */
.login-bg .grain {
  position: absolute; inset: 0; opacity: .06; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Złoty odblask tylko po literach logo.
   ZMIEŃ adres w dwóch liniach mask na ścieżkę logo w CORE (ten sam plik co w <img>). */
.logo-sheen { position: relative; display: inline-block; line-height: 0; }
.logo-sheen img { display: block; }
.logo-sheen::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(110deg,
    rgba(255, 214, 110, 0) 0%, rgba(255, 214, 110, 0) 38%,
    rgba(255, 214, 110, .25) 44%, rgba(255, 226, 150, .85) 50%, rgba(255, 214, 110, .25) 56%,
    rgba(255, 214, 110, 0) 62%, rgba(255, 214, 110, 0) 100%);
  background-size: 300% 100%; background-repeat: no-repeat;
  -webkit-mask: url("/static/apolo_core_logo_transparent.svg") center / 100% 100% no-repeat;
          mask: url("/static/apolo_core_logo_transparent.svg") center / 100% 100% no-repeat;
  animation: apolo-sheen 8s ease-in-out infinite;
}
@keyframes apolo-sheen { 0%, 60% { background-position: 100% 0 } 100% { background-position: 0% 0 } }

/* Gdy w systemie wyłączono animacje — statyczne tło ze słońcem nad logo */
@media (prefers-reduced-motion: reduce) {
  .login-bg .sun-x, .login-bg .sun-y, .login-bg .sun, .login-bg .rings, .logo-sheen::after { animation: none; }
  .login-bg .sun-x { transform: translateX(50vw); }
  .login-bg .sun-y { transform: translateY(18vh); }
}

.auth-page::before{content:none!important}.auth-logo.logo-sheen::after{inset:0;transform:none}
