/* Breed Weight Calculator — structural styles only. Theme colors are
   supplied per-instance as inline CSS custom properties (see
   templates/calculator.php), so this single stylesheet serves every
   breed page regardless of which of the 6 palettes it's using.
   Everything is scoped under .bwc-calc-wrap. */

.bwc-calc-wrap{
  box-sizing:border-box;
  background:var(--bwc-bg);
  color:var(--bwc-ink);
  font-family:'Inter',sans-serif;
  line-height:1.5;
  padding:2rem 1.25rem 3rem;
  border-radius:14px;
  max-width:920px;
  margin:0 auto;
}
.bwc-calc-wrap *,
.bwc-calc-wrap *::before,
.bwc-calc-wrap *::after{
  box-sizing:border-box;
}

/* ---- Hero ---- */
.bwc-calc-wrap .bwc-hero{
  display:flex;
  flex-wrap:wrap;
  gap:1.5rem;
  align-items:flex-end;
  justify-content:space-between;
  padding-bottom:1.75rem;
  border-bottom:1px solid var(--bwc-line);
  margin-bottom:2rem;
}
.bwc-calc-wrap .bwc-eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--bwc-primary-deep);
  margin:0 0 0.6rem;
}
.bwc-calc-wrap .bwc-h1{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:clamp(1.5rem,4vw,2.3rem);
  line-height:1.12;
  margin:0 0 0.5rem;
  color:var(--bwc-primary-deep);
}
.bwc-calc-wrap .bwc-sub{
  max-width:38ch;
  margin:0;
  color:var(--bwc-ink-soft);
  font-size:0.98rem;
}
.bwc-calc-wrap .bwc-icon{
  flex-shrink:0;
  width:88px;
  height:68px;
}

/* ---- Layout ---- */
.bwc-calc-wrap .bwc-grid{
  display:grid;
  grid-template-columns:340px 1fr;
  gap:1.5rem;
}
@media (max-width:760px){
  .bwc-calc-wrap .bwc-grid{grid-template-columns:1fr;}
}
.bwc-calc-wrap .bwc-card{
  background:var(--bwc-surface);
  border:1px solid var(--bwc-line);
  border-radius:14px;
  padding:1.5rem;
}

/* ---- Form ---- */
.bwc-calc-wrap fieldset.bwc-fieldset{border:none;margin:0 0 1.25rem;padding:0;}
.bwc-calc-wrap .bwc-legend{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.7rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--bwc-primary);
  margin-bottom:0.6rem;
  padding:0;
}
.bwc-calc-wrap .bwc-field{margin-bottom:1.1rem;}
.bwc-calc-wrap .bwc-row{display:flex;gap:0.5rem;}
.bwc-calc-wrap input[type=number].bwc-input{
  width:100%;
  padding:0.6rem 0.7rem;
  border:1.5px solid var(--bwc-line);
  border-radius:9px;
  font-family:'IBM Plex Mono',monospace;
  font-size:1rem;
  background:#fff;
  color:var(--bwc-ink);
}
.bwc-calc-wrap input.bwc-input:focus-visible,
.bwc-calc-wrap .bwc-toggle button:focus-visible,
.bwc-calc-wrap .bwc-seg button:focus-visible{
  outline:2.5px solid var(--bwc-primary);
  outline-offset:2px;
}
.bwc-calc-wrap .bwc-toggle{
  display:flex;
  border:1.5px solid var(--bwc-line);
  border-radius:9px;
  overflow:hidden;
  flex-shrink:0;
}
.bwc-calc-wrap .bwc-toggle button{
  border:none;
  background:#fff;
  color:var(--bwc-ink-soft);
  font-family:'IBM Plex Mono',monospace;
  font-size:0.82rem;
  padding:0 0.75rem;
  cursor:pointer;
}
.bwc-calc-wrap .bwc-toggle button.bwc-active{background:var(--bwc-primary-deep);color:#fff;}
.bwc-calc-wrap .bwc-seg{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  border:1.5px solid var(--bwc-line);
  border-radius:9px;
  overflow:hidden;
}
.bwc-calc-wrap .bwc-seg button{
  border:none;
  background:#fff;
  color:var(--bwc-ink-soft);
  font-size:0.85rem;
  font-weight:600;
  padding:0.55rem 0.4rem;
  cursor:pointer;
  border-left:1.5px solid var(--bwc-line);
}
.bwc-calc-wrap .bwc-seg button:first-child{border-left:none;}
.bwc-calc-wrap .bwc-seg button.bwc-active{background:var(--bwc-primary);color:#fff;}
.bwc-calc-wrap .bwc-hint{
  font-size:0.78rem;
  color:var(--bwc-ink-soft);
  margin-top:0.4rem;
}

/* ---- Results ---- */
.bwc-calc-wrap .bwc-result-figure{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:2.4rem;
  color:var(--bwc-primary-deep);
  line-height:1;
  margin:0.2rem 0 0.15rem;
}
.bwc-calc-wrap .bwc-result-range{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.88rem;
  color:var(--bwc-primary);
  margin:0;
}
.bwc-calc-wrap .bwc-result-label{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--bwc-ink-soft);
  margin:0;
}
.bwc-calc-wrap .bwc-result-note{
  font-size:0.86rem;
  color:var(--bwc-ink-soft);
  margin-top:0.75rem;
  border-top:1px solid var(--bwc-line);
  padding-top:0.75rem;
}

.bwc-calc-wrap svg text{font-family:'IBM Plex Mono',monospace;}
.bwc-calc-wrap .bwc-curve-wrap{margin-top:1.4rem;}
.bwc-calc-wrap .bwc-curve-title{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--bwc-ink-soft);
  margin-bottom:0.5rem;
}

.bwc-calc-wrap table.bwc-table{
  width:100%;
  border-collapse:collapse;
  margin-top:1rem;
  font-size:0.88rem;
}
.bwc-calc-wrap table.bwc-table th,
.bwc-calc-wrap table.bwc-table td{
  text-align:left;
  padding:0.55rem 0.4rem;
  border-bottom:1px solid var(--bwc-line);
}
.bwc-calc-wrap table.bwc-table th{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.68rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--bwc-primary);
  font-weight:600;
}
.bwc-calc-wrap table.bwc-table td.bwc-num{font-family:'IBM Plex Mono',monospace;}
.bwc-calc-wrap table.bwc-table tr.bwc-current-row td{background:var(--bwc-line);font-weight:600;}

.bwc-calc-wrap .bwc-footer{
  margin-top:2rem;
  font-size:0.78rem;
  color:var(--bwc-ink-soft);
  max-width:70ch;
}
