/* ==========================================================================
   Calculator Floating
   File: assets/calculator-floating.css
   ========================================================================== */

.calculator-iframe-wrapper {
  position: fixed;
  bottom: 20px;
  right: 24px;
  top: auto;
  left: auto;
  width: 380px;
  height: min(720px, calc(100dvh - 40px));
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - 40px);
  background: var(--bg-surface, #ffffff);
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 1.25rem;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,.25);
  overflow: hidden;
  z-index: 2147483646;
  display: flex;
  flex-direction: column;
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
}

html[dir="ltr"] .calculator-iframe-wrapper {
  right: auto;
  left: 24px;
}

.calculator-iframe-wrapper.hidden { display: none !important; }

.calculator-iframe-wrapper .global-tool-header {
  background-color: var(--bg-header, #ffffff);
}

.calculator-iframe-wrapper .global-tool-iframe {
  width: 100%;
  height: 100%;
  min-height: 0;
  border: none;
  flex: 1 1 auto;
}

@media (max-width: 640px) {
  .calculator-iframe-wrapper {
    right: 8px;
    left: 8px;
    bottom: 8px;
    width: auto;
    height: min(720px, calc(100dvh - 76px));
    max-width: none;
    max-height: calc(100dvh - 76px);
    border-radius: 16px;
  }

  html[dir="ltr"] .calculator-iframe-wrapper {
    left: 8px;
    right: 8px;
  }
}