/*
 * Bonzai inline embed - UX tuned
 * - Very compact default (no useless whitespace)
 * - Large only during 3DS (.is-3ds)
 * - No scroll/page interference
 */

#bonzai-inline-container {
  margin-top: 10px;
}

#bonzai-inline-container.is-hidden {
  display: none !important;
}

/* Center and constrain in right sidebar */
#bonzai-inline-container,
#bonzai-inline-loading,
#bonzai-inline-error {
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

/* Light “card” feel but tight */
#bonzai-inline-container {
  padding: 10px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .08);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .05);
}

#bonzai-inline-iframe {
  display: block;
  width: 100%;

  height: 320px;
  /* hauteur compacte mais utilisable */
  min-height: 300px;
  /* empêche l’écrasement */
  max-height: none;
  /* CRUCIAL : ne jamais plafonner */

  border: 1px solid rgba(0, 0, 0, .10);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

#bonzai-inline-sdk {
  display: none;
  width: 100%;
  max-width: 520px;
  min-height: 360px;
  margin: 0 auto;
  padding: 18px;
  border: 1px solid rgba(0, 0, 0, .10);
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}

#bonzai-inline-sdk.bonzai-inflow-mounted iframe {
  display: block;
  margin: 0 auto;
  background: #fff;
  border-radius: 12px;
}

/* 3DS mode: tall and usable */
#bonzai-inline-iframe.is-3ds {
  /*
   * IMPORTANT:
   * Do NOT cap the height with viewport units here.
   * The goal is to avoid scrolling *inside* the iframe during 3DS.
   * If the merchant sets a large value, the page can scroll — that's fine.
   */
  height: var(--bonzai-3ds-height, 860px);
  min-height: 560px;
  max-height: none;
}

/* Loading / error blocks */
#bonzai-inline-loading,
#bonzai-inline-error {
  padding: 12px;
  border-radius: 12px;
  background: rgba(0, 0, 0, .05);
  font-size: 14px;
  line-height: 1.35;
}

#bonzai-inline-error {
  background: rgba(220, 53, 69, .10);
}

@media (max-width:768px) {

  #bonzai-inline-container,
  #bonzai-inline-loading,
  #bonzai-inline-error {
    max-width: 100%;
  }

  #bonzai-inline-container {
    padding: 10px;
  }

  #bonzai-inline-iframe {
    height: 360px;
    min-height: 320px;
    max-height: none;
  }

  #bonzai-inline-iframe.is-3ds {
    /* On small screens, keep a soft cap so the iframe doesn't become absurdly tall */
    height: min(92vh, var(--bonzai-3ds-height, 860px));
    min-height: 560px;
    max-height: 92vh;
  }
}