/* Be Safe PWA na stronach serwisu — pływająca nawigacja i podpowiedź instalacji. */

.bs-pwa-nav {
  position: fixed;
  left: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: 99990;
  display: flex;
  gap: 2px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}

.bs-pwa-nav__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #333333;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.bs-pwa-nav__btn:active {
  background: rgba(0, 0, 0, 0.08);
}

.bs-pwa-nav__btn svg,
.bs-pwa-hint__share svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Treść nie może chować się pod przyciskami na samym dole strony. */
.bs-pwa-standalone body {
  padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
}

.bs-pwa-hint {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: 99991;
  display: flex;
  gap: 12px;
  max-width: 480px;
  margin: 0 auto;
  padding: 14px 16px;
  border-radius: 14px;
  background: #fff;
  color: #333333;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.22);
  /* Poppins to font strony; bez niego systemowy. */
  font: 14px/1.4 Poppins, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  text-align: left;
}

/* Motyw stylizuje p/li/strong/button po swojemu — tu wszystko dziedziczy z kafla. */
.bs-pwa-hint p,
.bs-pwa-hint li,
.bs-pwa-hint strong,
.bs-pwa-hint button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: normal;
  text-transform: none;
}

.bs-pwa-hint__icon {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border-radius: 10px;
}

.bs-pwa-hint__body {
  flex: 1;
  min-width: 0;
}

.bs-pwa-hint .bs-pwa-hint__title {
  display: block;
  font-size: 15px;
  font-weight: 600;
}

.bs-pwa-hint__lead,
.bs-pwa-hint__small {
  margin: 2px 0 0;
  color: #54595f;
}

.bs-pwa-hint .bs-pwa-hint__small {
  font-size: 12.5px;
  margin-top: 6px;
}

.bs-pwa-hint__steps ol {
  margin: 8px 0 0;
  padding-left: 20px;
}

.bs-pwa-hint__steps li {
  margin: 2px 0;
}

.bs-pwa-hint__share {
  display: inline-flex;
  vertical-align: -5px;
  margin-left: 4px;
  color: #007aff;
}

.bs-pwa-hint__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 10px;
}

.bs-pwa-hint__btn,
.bs-pwa-hint__later {
  margin: 0;
  border: 0;
  font: inherit;
  cursor: pointer;
}

.bs-pwa-hint__btn {
  padding: 8px 16px;
  border-radius: 8px;
  background: #ff6b01;
  color: #fff;
  font-weight: 600;
}

.bs-pwa-hint__btn[hidden] {
  display: none;
}

.bs-pwa-hint__later {
  padding: 8px 0;
  background: none;
  color: #54595f;
  text-decoration: underline;
}