/* PointCompass CSS entrypoint: account.css */
@import url("./account-owner-foundation.css");
@import url("./account-owner-workspace.css");
@import url("./account-shell.css");

/* v8.5.0.61 | Google Places autocomplete dropdown must sit above account modals. */
.pac-container {
  z-index: 2147483647 !important;
  border-radius: 16px;
  border: 1px solid rgba(162, 212, 238, 0.75);
  box-shadow: 0 18px 42px rgba(13, 49, 94, 0.18);
  overflow: hidden;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.pac-item {
  padding: 10px 12px;
  font-size: 0.92rem;
  color: #19315E;
}
.pac-item-query {
  color: #19315E;
  font-weight: 750;
}


/* v8.5.0.61 | Account contact details popup repair and address autocomplete layering. */
.account-contact-details-modal {
  z-index: 32000;
  place-items: start center;
  align-items: start;
  padding: clamp(10px, 4vh, 34px) 16px 16px;
  overflow: auto;
}
.account-contact-details-panel {
  width: min(980px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: clamp(18px, 2.2vw, 26px);
}
.account-contact-details-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  margin-bottom: 14px;
}
.account-contact-details-head h3 {
  margin: 0.1rem 0 0.35rem;
  font-size: clamp(1.7rem, 2.6vw, 2.25rem);
  letter-spacing: -0.045em;
}
.account-contact-details-head .support-copy {
  max-width: 68rem;
  margin: 0;
}
.account-contact-details-close {
  width: 46px;
  height: 46px;
  min-width: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
}
.account-contact-details-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(162, 212, 238, 0.45);
}
@media (max-width: 760px) {
  .account-contact-details-modal {
    padding: 8px;
  }
  .account-contact-details-panel {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
    border-radius: 22px;
  }
  .account-contact-details-head {
    gap: 12px;
  }
  .account-contact-details-actions {
    justify-content: stretch;
  }
  .account-contact-details-actions .btn {
    flex: 1 1 180px;
  }
}

/* v8.5.0.61 | Hard containment fix for Account contact popup visibility. */
.account-contact-details-modal:not(.hidden) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 65000 !important;
  display: grid !important;
  place-items: start center !important;
  align-items: start !important;
  padding: clamp(12px, 5vh, 44px) 16px 16px !important;
  overflow: auto !important;
  pointer-events: auto !important;
}
.account-contact-details-modal:not(.hidden) > .modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 65000 !important;
}
.account-contact-details-modal:not(.hidden) > .account-contact-details-panel {
  position: relative !important;
  z-index: 65002 !important;
  width: min(980px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 48px) !important;
  overflow: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}
#pointcompass-popup-host {
  z-index: 70000 !important;
}

/* v8.5.0.61 | Final hard fix: contact editor is mounted to body and its panel is forced above the backdrop. */
.account-contact-details-modal:not(.hidden) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 90000 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(12px, 5vh, 48px) 16px 16px !important;
  overflow: auto !important;
  pointer-events: auto !important;
}
.account-contact-details-modal:not(.hidden) > .modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: auto !important;
}
.account-contact-details-modal:not(.hidden) > .account-contact-details-panel {
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  width: min(980px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 56px) !important;
  overflow: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  margin: 0 auto !important;
  pointer-events: auto !important;
  background: linear-gradient(145deg, rgba(255,255,255,0.98), rgba(243,247,250,0.96)) !important;
  border: 1px solid rgba(162,212,238,0.85) !important;
  box-shadow: 0 30px 90px rgba(13,49,94,0.32) !important;
}
.account-contact-details-modal:not(.hidden) .form-grid {
  display: grid !important;
}

/* v8.6.0.0: multi-provider sign-in modal */
.auth-provider-panel { max-width: 560px; }
.auth-provider-grid { display: grid; gap: 10px; margin: 16px 0; }
.auth-provider-btn { justify-content: center; width: 100%; }
.auth-provider-btn[disabled] { opacity: .45; cursor: not-allowed; }
.auth-magic-link-form { margin-top: 14px; }

/* v8.6.0.2 social sign-in branding */
.auth-provider-grid { gap: 12px; }
.auth-provider-btn {
  align-items: center;
  border-radius: 16px;
  cursor: pointer;
  display: flex;
  font-weight: 800;
  gap: 12px;
  justify-content: center;
  min-height: 54px;
  padding: 12px 18px;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
  width: 100%;
}
.auth-provider-btn:hover,
.auth-provider-btn:focus-visible { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(25, 49, 94, .12); }
.auth-provider-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.auth-provider-icon { align-items: center; display: inline-flex; flex: 0 0 24px; height: 24px; justify-content: center; width: 24px; }
.auth-provider-icon svg { display: block; height: 22px; width: 22px; }
.auth-provider-btn-google { background: #fff; border: 1px solid #dadce0; color: #3c4043; }
.auth-provider-btn-facebook { background: #1877F2; border: 1px solid #1877F2; color: #fff; }
.auth-provider-btn-apple { background: #000; border: 1px solid #000; color: #fff; }
.auth-provider-btn-microsoft { background: #fff; border: 1px solid rgba(25,49,94,.18); color: #1f2937; }
.auth-provider-icon-facebook { background: #fff; border-radius: 50%; color: #1877F2; font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-weight: 900; line-height: 1; }
.auth-provider-icon-apple { color: #fff; font-size: 25px; line-height: 1; }
.auth-provider-icon-microsoft { color: #737373; font-size: 18px; }
