/* =============================================================================
   FX / VAT / WHT estimator — mobile fit for outer + inner containers
   Loads LAST on pricing. Cache-bust so results always show.
   Desktop (≥981px) untouched.
   ============================================================================= */

@media (max-width:980px){
  /* Outer shell: sit inside page gutter, no double squeeze / clip */
  body.pricing-page #fee-calculator.fee-calculator.estimator-command,
  body.pricing-page aside#fee-calculator.fee-calculator,
  #fee-calculator.fee-calculator.estimator-command,
  #fee-calculator.fee-calculator{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-top:18px!important;
    margin-bottom:18px!important;
    margin-left:0!important;
    margin-right:0!important;
    padding:16px!important;
    border-radius:22px!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
  }

  #fee-calculator.fee-calculator.estimator-command::before{
    border-radius:22px!important;
  }

  #fee-calculator > *{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  /* Intro block */
  #fee-calculator .fee-calculator-intro{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    align-items:start!important;
    margin-bottom:14px!important;
    width:100%!important;
    min-width:0!important;
  }

  #fee-calculator .estimator-title-block,
  #fee-calculator .estimator-context{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  #fee-calculator .estimator-title-block .eyebrow,
  #fee-calculator .fee-calculator-intro .eyebrow{
    max-width:100%!important;
    white-space:normal!important;
  }

  #fee-calculator #fee-calculator-title,
  #fee-calculator h3{
    font-size:clamp(1.2rem,5.2vw,1.55rem)!important;
    line-height:1.18!important;
    letter-spacing:-.03em!important;
    max-width:100%!important;
    margin:10px 0 0!important;
    overflow-wrap:break-word!important;
  }

  #fee-calculator .estimator-context p{
    font-size:13.5px!important;
    line-height:1.5!important;
    margin:0 0 10px!important;
  }

  #fee-calculator .selected-estimate-pill{
    display:flex!important;
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:unset!important;
    align-items:flex-start!important;
    gap:8px!important;
    padding:10px 12px!important;
    border-radius:14px!important;
    font-size:12px!important;
    line-height:1.35!important;
  }

  /* Workspace + inner panels */
  #fee-calculator .estimator-workspace{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    align-items:stretch!important;
  }

  #fee-calculator .estimator-panel,
  #fee-calculator .estimator-input-panel,
  #fee-calculator .estimator-output-panel{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:14px!important;
    border-radius:18px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }

  #fee-calculator .estimator-panel::before{
    left:14px!important;
    right:14px!important;
  }

  #fee-calculator .estimator-panel-head{
    display:grid!important;
    gap:8px!important;
    padding-bottom:12px!important;
    margin-bottom:12px!important;
    width:100%!important;
    min-width:0!important;
  }

  #fee-calculator .estimator-panel-head strong{
    font-size:clamp(1.05rem,4.4vw,1.25rem)!important;
    line-height:1.2!important;
    max-width:100%!important;
    overflow-wrap:break-word!important;
    color:#fff!important;
  }

  #fee-calculator .estimator-panel-head .panel-kicker{
    max-width:100%!important;
  }

  /* Fields / grids / actions — single column, full width */
  #fee-calculator .fee-tool-grid,
  #fee-calculator .fee-results,
  #fee-calculator .fee-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
  }

  #fee-calculator .fee-field,
  #fee-calculator .field.fee-field{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:12px!important;
    border-radius:16px!important;
    box-sizing:border-box!important;
  }

  #fee-calculator .fee-field label{
    display:block!important;
    font-size:12px!important;
    line-height:1.3!important;
    margin-bottom:6px!important;
  }

  #fee-calculator .fee-field input,
  #fee-calculator .fee-field select,
  #fee-calculator .zatra-select-trigger,
  #fee-calculator .estimator-command .zatra-select-trigger{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    box-sizing:border-box!important;
  }

  #fee-calculator .fee-field small{
    font-size:11px!important;
    line-height:1.4!important;
    overflow-wrap:break-word!important;
  }

  #fee-calculator .fee-actions .btn{
    width:100%!important;
    min-height:48px!important;
    white-space:normal!important;
    justify-content:center!important;
    text-align:center!important;
    padding:12px 14px!important;
  }

  #fee-calculator .fee-results div{
    width:100%!important;
    min-width:0!important;
    padding:12px!important;
    border-radius:16px!important;
    box-sizing:border-box!important;
  }

  #fee-calculator .fee-results strong{
    font-size:clamp(1rem,4.2vw,1.25rem)!important;
    overflow-wrap:anywhere!important;
  }

  #fee-calculator .fee-results .net-result{
    grid-column:1 / -1!important;
  }

  #fee-calculator .tax-note{
    margin-top:12px!important;
    padding:12px 14px!important;
    border-radius:14px!important;
    font-size:12.5px!important;
    line-height:1.45!important;
  }

  /* Invoice export inner strip */
  #fee-calculator .invoice-export-panel{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:12px!important;
    padding:14px!important;
    border-radius:16px!important;
    width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  #fee-calculator .invoice-export-panel::after{
    position:static!important;
    display:block!important;
    margin-top:4px!important;
    right:auto!important;
    top:auto!important;
  }

  #fee-calculator .invoice-export-copy{
    padding-right:0!important;
    width:100%!important;
    min-width:0!important;
  }

  #fee-calculator .invoice-export-copy strong{
    font-size:clamp(1.15rem,4.8vw,1.45rem)!important;
    line-height:1.15!important;
  }

  #fee-calculator .invoice-export-copy small{
    max-width:100%!important;
    font-size:12.5px!important;
  }
}

@media (max-width:680px){
  #fee-calculator.fee-calculator.estimator-command,
  #fee-calculator.fee-calculator{
    padding:14px!important;
    border-radius:18px!important;
  }

  #fee-calculator .estimator-panel,
  #fee-calculator .estimator-input-panel,
  #fee-calculator .estimator-output-panel{
    padding:12px!important;
    border-radius:16px!important;
  }
}

/* =============================================================================
   Premium decision checks — left-margin decorator line
   ============================================================================= */

body.pricing-page .premium-decision-band .decision-checks,
.premium-decision-band .decision-checks,
ul.decision-checks{
  position:relative!important;
  display:grid!important;
  gap:12px!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
  justify-items:start!important;
  align-items:stretch!important;
  text-align:left!important;
}

body.pricing-page .premium-decision-band .decision-checks li,
.premium-decision-band .decision-checks li,
ul.decision-checks li{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  padding:14px 16px 14px 20px!important;
  border-radius:18px!important;
  box-sizing:border-box!important;
  width:100%!important;
  margin-left:0!important;
  margin-right:auto!important;
  text-align:left!important;
  justify-self:start!important;
  align-self:stretch!important;
}

body.pricing-page .premium-decision-band .decision-checks li::before,
.premium-decision-band .decision-checks li::before,
ul.decision-checks li::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  bottom:0!important;
  width:5px!important;
  border-radius:18px 0 0 18px!important;
  background:linear-gradient(180deg,var(--zatra-red,var(--red,#ed0000)),#f6b600)!important;
  opacity:.95!important;
  pointer-events:none!important;
  z-index:2!important;
}

/* Force left alignment of decision-check copy */
body.pricing-page .premium-decision-band,
body.pricing-page .premium-decision-band > div,
body.pricing-page .premium-decision-band .decision-checks,
body.pricing-page .premium-decision-band .decision-checks li{
  text-align:left!important;
}
