/* ============================================================
   MERCHANTFEES CALCULATOR WIDGET
   The live cost readout is the page's signature element.
   ============================================================ */
.mf-calc{
  background:var(--mf-surface);
  border:1px solid var(--mf-line);
  border-radius:var(--mf-radius-lg);
  box-shadow:var(--mf-shadow);
  overflow:hidden;
  margin:0 0 12px;
}
.mf-calc__grid{display:grid;grid-template-columns:1fr 340px;}
@media(max-width:720px){.mf-calc__grid{grid-template-columns:1fr;}}

/* ---- inputs ---- */
.mf-calc__inputs{padding:26px 26px 28px;}
.mf-calc__title{font-family:var(--mf-font-display);font-weight:600;font-size:1.06rem;color:var(--mf-navy-800);margin:0 0 4px;}
.mf-calc__hint{font-size:.86rem;color:var(--mf-muted);margin:0 0 20px;}

.mf-field{margin-bottom:20px;}
.mf-field__label{display:flex;justify-content:space-between;align-items:baseline;font-weight:600;font-size:.92rem;color:var(--mf-navy-800);margin-bottom:8px;}
.mf-field__val{font-family:var(--mf-font-display);color:var(--mf-blue-500);font-weight:600;}
.mf-input{position:relative;}
.mf-input__prefix{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--mf-faint);font-weight:600;pointer-events:none;}
.mf-input input[type=number]{
  width:100%;font-family:var(--mf-font-body);font-size:1.05rem;font-weight:600;color:var(--mf-ink);
  padding:12px 14px 12px 28px;border:1.5px solid var(--mf-line);border-radius:10px;background:var(--mf-bg);
  -moz-appearance:textfield;
}
.mf-input input::-webkit-outer-spin-button,.mf-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.mf-input input:focus{border-color:var(--mf-blue-400);background:#fff;outline:none;box-shadow:0 0 0 3px rgba(63,134,212,.14);}

.mf-range{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:6px;background:var(--mf-line);outline:none;}
.mf-range::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--mf-blue-500);cursor:pointer;border:3px solid #fff;box-shadow:0 1px 4px rgba(10,26,54,.3);}
.mf-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--mf-blue-500);cursor:pointer;border:3px solid #fff;}

/* card mix */
.mf-mix{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}
.mf-mix__cell label{font-size:.78rem;color:var(--mf-muted);font-weight:600;display:block;margin-bottom:4px;}
.mf-mix__cell .mf-input input{padding-left:14px;padding-right:24px;font-size:.95rem;}
.mf-mix__pct{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--mf-faint);font-weight:600;}
.mf-mix__note{font-size:.78rem;margin-top:6px;}
.mf-mix__note.is-bad{color:#c0392b;}
.mf-mix__note.is-ok{color:var(--mf-good);}

/* ---- result panel : the signature ---- */
.mf-calc__result{background:linear-gradient(165deg,var(--mf-navy-700),var(--mf-navy-900));color:#fff;padding:26px 24px 28px;display:flex;flex-direction:column;}
.mf-result__eyebrow{font-family:var(--mf-font-display);text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;color:var(--mf-gold);}
.mf-result__big{font-family:var(--mf-font-display);font-weight:700;font-size:3.1rem;line-height:1;letter-spacing:-.02em;margin:6px 0 2px;color:#fff;font-variant-numeric:tabular-nums;}
.mf-result__biglabel{font-size:.84rem;color:#9fb0c9;margin-bottom:20px;}
.mf-result__rows{display:flex;flex-direction:column;gap:1px;background:rgba(255,255,255,.09);border-radius:10px;overflow:hidden;}
.mf-result__row{display:flex;justify-content:space-between;align-items:baseline;background:rgba(255,255,255,.03);padding:11px 14px;font-size:.92rem;}
.mf-result__row span{color:#bccbe2;}
.mf-result__row b{font-family:var(--mf-font-display);font-weight:600;color:#fff;font-variant-numeric:tabular-nums;}
.mf-result__row--hi b{color:var(--mf-gold);font-size:1.04rem;}
.mf-result__foot{margin-top:auto;padding-top:16px;font-size:.76rem;color:#8294ad;line-height:1.5;}

/* pending (unverified) state */
.mf-pending{padding:26px;text-align:center;}
.mf-pending__badge{display:inline-flex;align-items:center;gap:7px;background:var(--mf-warn-bg);color:var(--mf-warn);border:1px solid var(--mf-gold-soft);border-radius:999px;font-size:.8rem;font-weight:600;padding:5px 13px;margin-bottom:14px;}
.mf-pending p{color:var(--mf-muted);max-width:42ch;margin:0 auto 16px;}

/* verified flag under the calculator */
.mf-verified{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;color:var(--mf-good);font-weight:600;margin:6px 0 0;}
.mf-verified .mf-dot{width:8px;height:8px;border-radius:50%;background:var(--mf-good);}