/* ==========================================================================
   pwa-splash.css — ekran ładowania PWA (standalone)
   ========================================================================== */

html[data-pwa-splash-active="true"] {
  background: #f5f5f5;
}

html[data-pwa-splash-active="true"][data-theme="dark"] {
  background: #141414;
}

html[data-pwa-splash-active="true"] body {
  background: inherit;
}

.pwa-splash {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: clamp(24px, 6vw, 32px);
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right))
    max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  box-sizing: border-box;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.28s ease, visibility 0.28s ease;
}

html[data-pwa="true"] .pwa-splash,
html[data-pwa-splash-active="true"] #pwaSplash {
  display: flex !important;
}

html[data-pwa-splash-skip="true"] .pwa-splash,
html[data-pwa-splash-skip="true"] #pwaSplash {
  display: none !important;
}

html[data-pwa="true"]:not([data-theme="dark"]) .pwa-splash,
html[data-pwa-splash-active="true"]:not([data-theme="dark"]) #pwaSplash {
  background: #f5f5f5;
}

html[data-pwa="true"][data-theme="dark"] .pwa-splash,
html[data-pwa-splash-active="true"][data-theme="dark"] #pwaSplash {
  background: #141414;
}

html[data-pwa="true"].pwa-splash-hide .pwa-splash,
html[data-pwa-splash-active="true"].pwa-splash-hide #pwaSplash {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.pwa-splash__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(24px, 6vw, 32px);
  width: min(280px, 72vw);
}

.pwa-splash__logo {
  display: block;
  width: min(168px, 52vw);
  height: auto;
  object-fit: contain;
}

html[data-theme="dark"] .pwa-splash__logo--light {
  display: none;
}

html:not([data-theme="dark"]) .pwa-splash__logo--dark {
  display: none;
}

.pwa-splash__bar {
  width: 100%;
  height: 4px;
  border-radius: 999px;
  overflow: hidden;
}

html:not([data-theme="dark"]) .pwa-splash__bar {
  background: rgba(51, 51, 51, 0.16);
}

html[data-theme="dark"] .pwa-splash__bar {
  background: rgba(255, 255, 255, 0.18);
}

.pwa-splash__bar-fill {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  transition: width 0.24s ease;
}

html:not([data-theme="dark"]) .pwa-splash__bar-fill {
  background: #333333;
}

html[data-theme="dark"] .pwa-splash__bar-fill {
  background: #f5f5f5;
}

.pwa-splash__bar-fill.is-loading {
  animation: pwa-splash-progress 1.2s ease-in-out infinite;
}

@keyframes pwa-splash-progress {
  0% {
    width: 10%;
    margin-left: 0%;
  }

  50% {
    width: 68%;
    margin-left: 16%;
  }

  100% {
    width: 10%;
    margin-left: 90%;
  }
}

.pwa-splash__bar-fill.is-complete {
  width: 100% !important;
  margin-left: 0 !important;
  animation: none;
}