/* shared.css — wspólne poprawki responsywności dla wszystkich stron strzelca.pl
   Cel: poprawne wyświetlanie na mobile/desktop bez przebudowy całych layoutów.
*/

/* Bazowe sanity */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

/* Media nigdy nie powinny powodować poziomego scrolla */
img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
  height: auto;
}

/* Długie ciągi (URL-e, długie nazwy, JSON) */
pre,
code,
kbd,
samp {
  overflow-wrap: anywhere;
  word-break: break-word;
}

pre {
  white-space: pre-wrap;
  max-width: 100%;
}

/* Safe-area na iPhone (notch) + stałe elementy w prawym górnym rogu */
#login-button,
#user-panel {
  top: calc(1rem + env(safe-area-inset-top));
  right: calc(1rem + env(safe-area-inset-right));
}

/* Menu użytkownika nie powinno wychodzić poza ekran */
#user-menu {
  max-width: min(92vw, 360px);
}

/* Hero: na małych ekranach 65vh bywa zbyt duże (zwłaszcza Safari z paskami) */
@media (max-width: 640px) {
  .hero-bg {
    height: auto !important;
    min-height: 42vh;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}

/* Akordeony/sekcje z nagłówkiem + ikoną: pozwól zawijać */
@media (max-width: 640px) {
  .accordion-header {
    flex-wrap: wrap;
    gap: 0.75rem;
  }
}

/* Scroll-area w modalach: padding nie powinien "zjadać" miejsca na mobile */
.details-scroll-area {
  padding-right: clamp(0px, 2vw, 20px);
}