/* ═══════════════════════════════════════════════════════════════
   Freedom — PWA Install Banner (Android/Desktop + iOS)
   Usa os tokens de design-tokens.css — nenhuma cor hardcoded aqui.
   ═══════════════════════════════════════════════════════════════ */

.pwa-install-banner {
  position: fixed;
  left: 50%;
  bottom: -120px;
  transform: translate(-50%, 0);
  width: min(92vw, 420px);
  z-index: 9999;

  display: flex;
  align-items: flex-start;
  gap: var(--sp-2, 8px);

  background: var(--surface, #1A1A1A);
  border: 1px solid var(--bd2, rgba(255,255,255,.13));
  border-radius: var(--r-lg, 20px);
  box-shadow: var(--or-shadow, 0 6px 20px rgba(0,201,184,.28));
  padding: var(--sp-3, 12px) var(--sp-3, 12px);

  opacity: 0;
  transition: bottom .3s ease, opacity .3s ease;
}

.pwa-install-banner--visible {
  bottom: 20px;
  opacity: 1;
}

.pwa-install-banner__icon img {
  border-radius: var(--r-sm, 10px);
  display: block;
}

.pwa-install-banner__body {
  flex: 1;
  min-width: 0;
}

.pwa-install-banner__text {
  margin: 0;
  color: var(--tx, #FFF);
  font-size: 13.5px;
  line-height: 1.4;
}

.pwa-install-banner__text strong {
  color: var(--or, #00C9B8);
}

.pwa-install-banner__ios-icon {
  display: inline-block;
}

.pwa-install-banner__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--sp-1, 4px);
}

.pwa-install-banner__btn {
  background: var(--or, #00C9B8);
  color: #000;
  border: none;
  border-radius: var(--r-pill, 9999px);
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

.pwa-install-banner__btn:hover {
  background: var(--or-dk, #00A99A);
}

.pwa-install-banner__close {
  background: transparent;
  border: none;
  color: var(--tx3, #AAAAAA);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
}

.pwa-install-banner__close:hover {
  color: var(--tx, #FFF);
}

@media (max-width: 380px) {
  .pwa-install-banner {
    width: 94vw;
    padding: var(--sp-2, 8px);
  }
  .pwa-install-banner__text {
    font-size: 12.5px;
  }
}