/* ============================================================
   EMULENT CALCULATOR SUITE — emu-calculators.css  (v1.0.7)
   Scoped to .emu-suite. Safe alongside the Hub theme.
   If your theme already styles the suite, the ONLY rule you
   must keep is the .is-hidden rule marked REQUIRED.
   ============================================================ */

/* Poppins: delete this line if the Hub theme already loads it */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

.emu-suite{
  --emu-navy:#001745;
  --emu-green:#00CC52;
  --emu-blue:#0000FF;
  --emu-cyan:#00CCFF;
  --emu-ink:#0b1533;
  --emu-mut:#5a6478;
  --emu-line:#e3e7f0;
  --emu-bg:#f7f9fc;
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--emu-ink);
}
.emu-suite *,.emu-suite *::before,.emu-suite *::after{box-sizing:border-box;}

/* ---------- REQUIRED: mode switching depends on this ---------- */
.emu-suite .emu-field.is-hidden{display:none !important;}

/* ---------- Jump navigation ---------- */
.emu-suite .emu-nav-label{
  font-size:14px;font-weight:600;color:var(--emu-navy);
  text-transform:uppercase;letter-spacing:.08em;
  margin:0 0 14px;
}
.emu-suite .emu-index{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:22px 28px;
  background:#fff;
  border:1px solid var(--emu-line);
  border-radius:14px;
  padding:28px;
  margin:0 0 44px;
}
.emu-suite .emu-index-group{min-width:0;}
.emu-suite .emu-index-cat{
  display:flex;align-items:center;gap:8px;
  font-size:13px;font-weight:600;color:var(--emu-navy);
  margin:0 0 10px;
}
.emu-suite .emu-index-count{
  display:inline-block;
  font-size:11px;font-weight:600;line-height:1;
  color:var(--emu-navy);background:rgba(0,204,82,.16);
  border-radius:999px;padding:4px 8px;
}
.emu-suite .emu-index a{
  display:block;
  font-size:13.5px;line-height:1.4;
  color:#3a4560;text-decoration:none;
  padding:4px 0;
  transition:color .15s ease;
}
.emu-suite .emu-index a:hover{color:var(--emu-blue);}

/* ---------- Calculator card ---------- */
.emu-suite .emu-calc{
  background:#fff;
  border:1px solid var(--emu-line);
  border-radius:14px;
  padding:28px;
  margin:0 0 36px;
  scroll-margin-top:110px; /* anchored jumps clear the sticky header */
}

/* Header + description */
.emu-suite .emu-head{margin:0 0 14px;}
.emu-suite .emu-eyebrow{
  display:block;
  font-size:17px;font-weight:600;line-height:1.3;
  letter-spacing:.02em;
  color:var(--emu-navy);
  margin:0 0 10px;
}
.emu-suite .emu-rule{
  display:block;
  height:3px;border-radius:999px;
  background:linear-gradient(90deg,var(--emu-green),var(--emu-cyan));
  width:56px;
}
.emu-suite .emu-desc{
  font-size:14.5px;line-height:1.65;color:var(--emu-mut);
  margin:0 0 20px;
}

/* Mode tabs */
.emu-suite .emu-modes{
  display:flex;flex-wrap:wrap;gap:8px;
  margin:0 0 20px;
}
.emu-suite .emu-mode{
  appearance:none;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:500;line-height:1;
  color:var(--emu-navy);
  background:var(--emu-bg);
  border:1px solid var(--emu-line);
  border-radius:999px;
  padding:10px 16px;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.emu-suite .emu-mode:hover{border-color:var(--emu-green);}
.emu-suite .emu-mode[aria-selected="true"]{
  color:#fff;
  background:var(--emu-navy);
  border-color:var(--emu-navy);
}

/* Fields */
.emu-suite .emu-fields{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:16px 14px;
  margin:0 0 20px;
}
.emu-suite .emu-label{
  display:block;
  font-size:12.5px;font-weight:500;color:var(--emu-ink);
  margin:0 0 6px;
}
/* ID-scoped: #emu-suite outranks virtually any theme selector */
#emu-suite .emu-input-wrap{
  position:relative;
  display:block;
  background:#fff;
  border:1px solid var(--emu-line);
  border-radius:10px;
  transition:border-color .15s ease,box-shadow .15s ease;
}
#emu-suite .emu-input-wrap:focus-within{
  border-color:var(--emu-green);
  box-shadow:0 0 0 3px rgba(0,204,82,.15);
}
/* Affixes are pinned inside the wrap — immune to whatever display
   mode or float the theme forces on spans and inputs */
#emu-suite .emu-prefix,
#emu-suite .emu-suffix{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  font-size:13px;line-height:1;color:var(--emu-mut);
  padding:0;margin:0;
  pointer-events:none;
  z-index:2;
}
#emu-suite .emu-prefix{left:12px;}
#emu-suite .emu-suffix{right:12px;}
#emu-suite .emu-field input,
#emu-suite .emu-field input[type="text"]{
  display:block;
  width:100% !important;
  /* !important + ID beats the theme's global input styling — the
     wrap div draws the only border, so the input must draw none */
  appearance:none;-webkit-appearance:none;
  border:0 none !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  background-color:transparent !important;
  border-radius:10px !important;
  height:auto !important;
  min-height:0 !important;
  float:none !important;
  position:static !important;
  font-family:inherit;font-size:15px;color:var(--emu-ink);
  text-align:left !important;
  padding:11px 12px !important;
  margin:0 0 0 15px !important;
}
#emu-suite .emu-field input:focus,
#emu-suite .emu-field input[type="text"]:focus{
  border:0 none !important;outline:0 !important;box-shadow:none !important;
}
#emu-suite .emu-field input::placeholder{
  color:#aab2c5;opacity:1;
}
/* Input padding reserves the room the pinned affix occupies —
   text and placeholder start just after the $ / end before the % */
#emu-suite .has-prefix input{padding-left:28px !important;}
#emu-suite .has-suffix input{padding-right:30px !important;}
.emu-suite .emu-help{
  font-size:11.5px;line-height:1.45;color:var(--emu-mut);
  margin:5px 0 0;
}

/* Result panel */
.emu-suite .emu-result{
  position:relative;
  background:var(--emu-bg);
  border:1px solid var(--emu-line);
  border-radius:12px;
  padding:22px 80px 18px 22px;
  margin:0 0 16px;
  overflow:hidden;
}
.emu-suite .emu-result::before{
  content:'';
  position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--emu-green),var(--emu-cyan),var(--emu-blue));
}
.emu-suite .emu-glyph{
  position:absolute;top:20px;right:20px;
  width:46px;height:46px;
}
.emu-suite .emu-result-label{
  font-size:12px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--emu-mut);
  margin:0 0 6px;
}
.emu-suite .emu-result-value{
  font-size:34px;font-weight:700;line-height:1.1;
  color:var(--emu-navy);
  margin:0 0 8px;
  word-break:break-word;
}
.emu-suite .emu-result-value.is-small{font-size:24px;}
.emu-suite .emu-result-value.is-empty{color:#aab2c5;font-weight:600;}
.emu-suite .emu-formula{
  font-size:13px;line-height:1.55;color:var(--emu-mut);margin:0;
}
.emu-suite .emu-spacer{height:6px;}

/* Metrics grid */
.emu-suite .emu-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:16px 0 0;padding:16px 0 0;
  border-top:1px solid var(--emu-line);
}
.emu-suite .emu-metrics[hidden]{display:none;}
.emu-suite .emu-metric{min-width:0;}
.emu-suite .emu-metric dt{
  font-size:11.5px;font-weight:500;color:var(--emu-mut);
  margin:0 0 3px;
}
.emu-suite .emu-metric dd{
  font-size:14.5px;font-weight:600;color:var(--emu-navy);
  margin:0;word-break:break-word;
}

/* Actions */
.emu-suite .emu-actions{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.emu-suite .emu-btn{
  appearance:none;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:600;line-height:1;
  border-radius:999px;
  padding:11px 20px;
  transition:transform .12s ease,background .15s ease,color .15s ease,border-color .15s ease;
}
.emu-suite .emu-btn:active{transform:scale(.97);}
.emu-suite .emu-btn-primary{
  color:#fff;background:var(--emu-green);border:1px solid var(--emu-green);
}
.emu-suite .emu-btn-primary:hover{background:#00b447;border-color:#00b447;}
.emu-suite .emu-btn-ghost{
  color:var(--emu-navy);background:transparent;border:1px solid var(--emu-line);
}
.emu-suite .emu-btn-ghost:hover{border-color:var(--emu-navy);}
.emu-suite .emu-status{
  font-size:12.5px;color:var(--emu-green);
  opacity:0;transition:opacity .2s ease;
}
.emu-suite .emu-status.is-visible{opacity:1;}

/* ---------- Mobile ---------- */
@media (max-width:600px){
  .emu-suite .emu-calc{padding:20px 16px;}
  .emu-suite .emu-index{padding:20px 16px;grid-template-columns:1fr 1fr;}
  .emu-suite .emu-fields{grid-template-columns:1fr;}
  .emu-suite .emu-metrics{grid-template-columns:1fr 1fr;}
  .emu-suite .emu-result{padding-right:22px;}
  .emu-suite .emu-glyph{display:none;}
  .emu-suite .emu-result-value{font-size:28px;}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .emu-suite *{transition:none !important;}
}