/* Hydrant Flow Test Calculator — from Figma node 2372:31771 */
.rf-hydrant{font-family:var(--rf-font,"Inter",-apple-system,sans-serif);color:#001D36;width:100%}
.rf-hydrant *{box-sizing:border-box}

/* Inputs row */
.rf-hydrant__inputs{display:flex;gap:1.5rem;align-items:flex-end;flex-wrap:wrap;margin:0 0 3.5rem}
.rf-hydrant__field{display:flex;flex-direction:column;gap:0.25rem;flex:1 1 220px}
.rf-hydrant__field label{font-family:"Inter",sans-serif;font-size:1rem;font-weight:500;line-height:1.5;color:#001D36}
.rf-hydrant__field input{height:56px;padding:0.75rem;border:1px solid #D5D7DA;border-radius:12px;
  font-family:inherit;font-size:16px;color:#001D36;background:#fff;width:100%}
.rf-hydrant__field input:focus{outline:none;border-color:#004987;box-shadow:0 0 0 3px rgba(0,73,135,.12)}
.rf-hydrant__btn{height:56px;padding:0 36px;border:0;border-radius:56px;background:#004987;color:#fff;
  font-family:inherit;font-size:16px;font-weight:600;cursor:pointer;flex:0 0 auto;
  transition:box-shadow .15s ease,background .15s ease,border-color .15s ease}
/* hover matches the navbar Contact Us button (.rf-btn): darken + 2px orange outer ring */
.rf-hydrant__btn:hover,.rf-hydrant__btn:focus-visible{background:#013a6b;box-shadow:0 0 0 2px #F9500D}

/* Body: results (left) + chart (right) */
.rf-hydrant__body{display:grid;grid-template-columns:19rem 1fr;gap:2rem;align-items:start}
.calculator_result{background:#EAF5FF !important;color:#001D36 !important;border-radius:12px;
  padding:20px 24px;font-size:16px;line-height:1.9;display:block;min-width:19rem;margin:1.5rem 0}
.calculator_result strong{font-weight:700}
.rf-hydrant__note{margin-top:28px;font-size:16px;line-height:1.7;color:#414651}
.rf-hydrant__note p{margin:0}

/* Chart */
.rf-hydrant__chart{min-width:0}
#chart_div{width:100% !important;min-height:500px}

@media (max-width:900px){
  .rf-hydrant__inputs{flex-direction:column;align-items:stretch;gap:1.5rem;margin-bottom:2rem}
  .rf-hydrant__field{flex:0 0 auto}
  .rf-hydrant__field label{font-size:0.875rem;line-height:1.5}
  .rf-hydrant__btn{width:100%;margin-top:0.5rem}
  .rf-hydrant__body{grid-template-columns:1fr;gap:2rem}
  .calculator_result{min-width:0}
  #chart_div{min-height:420px}
}
