/* BPay Social canonical stylesheet entrypoint.
 *
 * Historical styles remain available only as a low-priority compatibility
 * layer. The consumer UI system and product presentation below are the
 * authoritative presentation layers.
 */

@import url("/styles.css") layer(legacy);
@import url("/account.css") layer(legacy);
@import url("/experience.css") layer(legacy);
@import url("/engine-v4.css") layer(legacy);
@import url("/experience-v5.css") layer(legacy);
@import url("/social-v6.css") layer(legacy);
@import url("/social-v6-live.css") layer(legacy);
@import url("/social-v6-media.css") layer(legacy);
@import url("/social-v15.css") layer(legacy);
@import url("/social-v15-native.css") layer(legacy);
@import url("/social-v151.css") layer(legacy);
@import url("/social/phase1/identity.css") layer(legacy);
@import url("/social/phase1/split.css") layer(legacy);
@import url("/social/ui/system.css");
@import url("/social/ui/product.css");
@import url("/social/ui/product-v4.css");
@import url("/social/ui/product-v4-1.css");
@import url("/social/ui/product-v4-2.css");
@import url("/social/ui/product-v4-3.css");
@import url("/social/ui/home-v1.css");
@import url("/social/ui/chats-v1.css");
@import url("/social/ui/chat-v2.css");
@import url("/social/ui/shell-v2-browser.css");

/* Product concepts do not appear as fake functionality. These are enabled
 * only when their shared financial contracts exist. */
.bpay-goal-preview,
.request-preview {
  display: none !important;
}

.bpay-direct-money-actions {
  grid-template-columns: 1fr;
}

.social-startup-error {
  max-width: 36rem;
  margin: 4rem auto;
}

.social-startup-error strong,
.social-startup-error p {
  display: block;
}

/* Home v1.1 focused patch. Keep the V1 lower composition intact while making
 * the money-position block more useful and preserving every lower Home surface. */
.bpay-home-v1.bpay-home-v1-1 .bpay-home-position {
  min-height: 204px;
  margin-bottom: 2px;
  border-radius: 24px;
  cursor: pointer;
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-position > div {
  min-height: 134px;
  padding: 20px 20px 18px;
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-position > div > span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-position strong {
  font-size: clamp(28px, 6.8vw, 33px);
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-position-note {
  display: block;
  margin-top: 8px;
  color: rgba(255,255,255,.76);
  font-size: 12.5px;
  font-weight: 680;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-position > button {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: 58px !important;
  height: auto !important;
  max-height: none !important;
  padding: 10px 18px 10px 20px;
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-position > button > span {
  max-width: 72%;
  color: rgba(255,255,255,.84);
  line-height: 1.25;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.bpay-home-v1.bpay-home-v1-1 .bpay-home-actions {
  margin-top: 2px;
}

.bpay-home-v1 .bpay-home-recent {
  display: none !important;
}

@media (max-width: 390px) {
  .bpay-home-v1.bpay-home-v1-1 .bpay-home-position {
    min-height: 198px;
  }

  .bpay-home-v1.bpay-home-v1-1 .bpay-home-position > div {
    min-height: 130px;
    padding-inline: 18px;
  }

  .bpay-home-v1.bpay-home-v1-1 .bpay-home-position > div > span + span {
    padding-left: 18px;
  }
}