/* Ventures Away — PWA install banner + iOS help modal */

.va-pwa-banner {

  position: fixed;

  left: 10px;

  right: 10px;

  bottom: calc(12px + env(safe-area-inset-bottom, 0px));

  z-index: 1040;

  display: none;

  align-items: center;

  gap: 14px;

  padding: 14px 16px;

  border-radius: 16px;

  background: #fff;

  border: 1px solid rgba(237, 54, 21, 0.18);

  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.04);

  font-family: "Plus Jakarta Sans", "Quicksand", sans-serif;

  color: #1a1a1a;

}



.va-pwa-banner.is-visible {

  display: flex;

  animation: va-pwa-banner-in 0.35s ease-out;

}



@keyframes va-pwa-banner-in {

  from {

    opacity: 0;

    transform: translateY(12px);

  }

  to {

    opacity: 1;

    transform: translateY(0);

  }

}



@media (max-width: 575.98px) {

  .va-pwa-banner {

    bottom: calc(68px + env(safe-area-inset-bottom, 0px));

  }

  /* Keep Reserve CTA clear on mobile property pages */

  body.va-pdp-page .va-pwa-banner,

  body:has(.va-pdp) .va-pwa-banner {

    display: none !important;

  }

}



.va-pwa-banner__icon-wrap {

  flex: 0 0 56px;

  width: 56px;

  height: 56px;

  border-radius: 14px;

  overflow: hidden;

  box-shadow: 0 4px 14px rgba(237, 54, 21, 0.22);

  border: 1px solid rgba(0, 0, 0, 0.06);

  background: #fff;

}



.va-pwa-banner__icon {

  display: block;

  width: 56px;

  height: 56px;

  object-fit: cover;

}



.va-pwa-banner__copy {

  flex: 1 1 auto;

  min-width: 0;

}



.va-pwa-banner__title {

  margin: 0;

  font-size: 15px;

  font-weight: 800;

  line-height: 1.25;

  letter-spacing: -0.01em;

}



.va-pwa-banner__body {

  margin: 3px 0 0;

  font-size: 12.5px;

  line-height: 1.35;

  color: #5c5c5c;

}



.va-pwa-banner__actions {

  display: flex;

  flex-direction: column;

  align-items: stretch;

  gap: 4px;

  flex: 0 0 auto;

}



.va-pwa-banner__install {

  border: 0;

  border-radius: 10px;

  padding: 11px 16px;

  font-size: 14px;

  font-weight: 800;

  color: #fff;

  background: #ed3615;

  cursor: pointer;

  white-space: nowrap;

  box-shadow: 0 4px 12px rgba(237, 54, 21, 0.35);

}



.va-pwa-banner__install:hover,

.va-pwa-banner__install:focus {

  background: #d12e10;

  outline: none;

}



.va-pwa-banner__dismiss {

  border: 0;

  background: transparent;

  color: #6b6b6b;

  font-size: 12px;

  font-weight: 600;

  padding: 6px 6px;

  cursor: pointer;

  white-space: nowrap;

  text-align: center;

}



.va-pwa-banner__dismiss:hover,

.va-pwa-banner__dismiss:focus {

  color: #1a1a1a;

  outline: none;

}



/* Post-install confirmation */

.va-pwa-toast {

  position: fixed;

  left: 50%;

  bottom: calc(24px + env(safe-area-inset-bottom, 0px));

  transform: translateX(-50%) translateY(12px);

  z-index: 1100;

  max-width: calc(100vw - 32px);

  padding: 12px 18px;

  border-radius: 999px;

  background: #1a1a1a;

  color: #fff;

  font-family: "Plus Jakarta Sans", "Quicksand", sans-serif;

  font-size: 13px;

  font-weight: 600;

  line-height: 1.35;

  text-align: center;

  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);

  opacity: 0;

  pointer-events: none;

  transition: opacity 0.25s ease, transform 0.25s ease;

}



.va-pwa-toast.is-visible {

  opacity: 1;

  transform: translateX(-50%) translateY(0);

}



.va-pwa-ios-modal .modal-content {

  border-radius: 16px;

  border: 0;

  font-family: "Plus Jakarta Sans", "Quicksand", sans-serif;

}



.va-pwa-ios-modal .modal-header {

  border-bottom: 0;

  padding-bottom: 0;

}



.va-pwa-ios-modal .modal-title {

  font-size: 18px;

  font-weight: 800;

  color: #1a1a1a;

}



.va-pwa-ios-modal .modal-body {

  padding-top: 8px;

}



.va-pwa-ios-modal__icon-row {

  display: flex;

  align-items: center;

  gap: 12px;

  margin: 0 0 14px;

  padding: 12px;

  border-radius: 14px;

  background: #f7f7f7;

}



.va-pwa-ios-modal__icon-row img {

  width: 56px;

  height: 56px;

  border-radius: 12px;

  object-fit: cover;

  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);

  background: #fff;

}



.va-pwa-ios-modal__icon-label {

  margin: 0;

  font-size: 14px;

  font-weight: 700;

  color: #1a1a1a;

  line-height: 1.35;

}



.va-pwa-ios-modal__icon-label span {

  display: block;

  margin-top: 2px;

  font-size: 12px;

  font-weight: 500;

  color: #5c5c5c;

}



.va-pwa-ios-modal__lead {

  margin: 0 0 14px;

  font-size: 14px;

  color: #5c5c5c;

}



.va-pwa-ios-steps {

  margin: 0;

  padding: 0;

  list-style: none;

  counter-reset: va-pwa-step;

}



.va-pwa-ios-steps li {

  position: relative;

  margin: 0 0 12px;

  padding: 10px 12px 10px 44px;

  border-radius: 12px;

  background: #f7f7f7;

  font-size: 14px;

  line-height: 1.4;

  color: #1a1a1a;

  counter-increment: va-pwa-step;

}



.va-pwa-ios-steps li::before {

  content: counter(va-pwa-step);

  position: absolute;

  left: 12px;

  top: 50%;

  transform: translateY(-50%);

  width: 24px;

  height: 24px;

  border-radius: 50%;

  background: #ed3615;

  color: #fff;

  font-size: 12px;

  font-weight: 700;

  display: flex;

  align-items: center;

  justify-content: center;

}



.va-pwa-ios-steps strong {

  font-weight: 700;

}



.va-pwa-menu-item {

  display: none;

}



.va-pwa-menu-item.is-visible,
body.va-account-page .va-pwa-menu-item--account {

  display: list-item;

}



body.va-pwa-standalone .va-pwa-menu-item--account {

  display: none !important;

}



a.va-pwa-menu-link.is-visible {

  display: block;

}