/* ───────────────────────────────────────────────────────────
   prod.css — warstwa produkcyjna event-cloud
   Zdejmuje „oprawę designera" (atrapa iPhone/okno, panel Tweaks):
   ekrany renderują się na pełny ekran realnego urządzenia, a layout
   przełącza się responsywnie (mobile < 900px, desktop ≥ 900px).
   ─────────────────────────────────────────────────────────── */

/* ── prawdziwe zdjęcia w kafelkach (zamiast gradientów) ────── */
.ec-ph__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  z-index: 0;
  opacity: 0;
  transition: opacity .25s ease;
}
.ec-ph__img.is-loaded { opacity: 1; }

/* ── ekran ładowania / splash ─────────────────────────────── */
.ec-splash {
  position: fixed; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(120% 90% at 50% -10%, #F3EDE2 0%, #EAE2D4 55%, #E2D8C7 100%);
}
.ec-splash__mark {
  width: 54px; height: 54px; border-radius: 16px;
  background: var(--accent); color: var(--accent-ink);
  display: flex; align-items: center; justify-content: center;
  animation: ec-pulse 1.2s ease-in-out infinite;
}
@keyframes ec-pulse { 0%,100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.08); opacity: 1; } }

/* ── MOBILE: pełnoekranowa powłoka (bez atrapy iPhone) ─────── */
.ec-stage--full { height: 100dvh; min-height: 100dvh; padding: 0; }
.ec-shell {
  position: relative;
  width: 100%;
  max-width: 460px;
  height: 100dvh;
  background: var(--bg);
  overflow: hidden;
}
@media (min-width: 520px) {
  .ec-shell {
    height: min(100dvh, 920px);
    border-radius: 30px;
    box-shadow: 0 30px 90px rgba(42, 37, 30, .20), 0 0 0 1px rgba(42,37,30,.05);
  }
}
.ec-app--full { height: 100%; }
/* na realnym telefonie zmniejsz „notch padding" topbara do bezpiecznego obszaru */
@media (max-width: 519px) {
  .ec-topbar { padding-top: max(20px, env(safe-area-inset-top)); }
}

/* ── DESKTOP: pełnoekranowa strona (bez atrapy okna) ───────── */
.dk-stage {
  min-height: 100dvh;
  background: radial-gradient(120% 120% at 50% 0%, #E7DECF 0%, #D9CDBA 60%, #CFC1AB 100%);
}
.dk-page--full { height: 100dvh; border-radius: 0; }

/* ── hero z config.php (zastępuje <image-slot> z designera) ── */
.ec-login__hero { height: 342px; }   /* dawniej wysokość dawał image-slot */
.ec-hero-img, .dk-hero-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.ec-hero-fallback, .dk-hero-fallback {
  position: absolute; inset: 0;
  background: linear-gradient(150deg, #C9BBA6 0%, #A98F70 55%, #6E5B45 100%);
}

/* ── upload: realne pliki w kolejce + progres ──────────────── */
.ec-queue__item .ec-ph__img { opacity: 1; }
.ec-up-prog {
  position: absolute; left: 0; bottom: 0; height: 3px;
  background: var(--accent); border-radius: 0 2px 2px 0;
  transition: width .2s ease; z-index: 3;
}
.ec-up-item--done { outline: 2px solid var(--accent); outline-offset: -2px; }
.ec-up-item--err  { outline: 2px solid #C0533F; outline-offset: -2px; }

/* drobny licznik postępu zbiorczego uploadu */
.ec-up-bar {
  display: flex; align-items: center; gap: 10px;
  font-size: 12.5px; color: var(--ink-2); margin: 8px 2px 0;
}
.ec-up-bar__track { flex: 1; height: 6px; background: var(--bg-2); border-radius: 999px; overflow: hidden; }
.ec-up-bar__fill  { height: 100%; background: var(--accent); transition: width .2s ease; }

/* spinner w kafelku katalogu/galerii podczas ładowania */
.ec-loading {
  display: flex; align-items: center; justify-content: center;
  padding: 40px; color: var(--ink-3); font-size: 13px;
}

/* błąd formularza logowania */
.ec-form-err {
  color: #C0533F; font-size: 13px; margin: 4px 2px 0;
  background: #F6E7E3; border-radius: 10px; padding: 9px 12px;
}

/* odtwarzacz wideo w lightboxie */
.ec-lb__video, .dk-lb__video {
  width: 100%; height: 100%; max-height: 100%;
  background: #000; display: block; object-fit: contain;
}
