/*!
 * ny-mw-calc.css
 *
 * Minimal structural styles for the New York Minimum Wage Impact Calculator.
 * These styles lay out the form elements cleanly without imposing heavy
 * visual design.  They are scoped beneath the #ny-mw-calc selector to
 * prevent unintended bleed into the broader site.  Additional aesthetic
 * styling should be provided via the WordPress Customizer’s Additional
 * CSS, as defined in the accompanying deliverable.
 */

#ny-mw-calc {
  font-family: inherit;
  margin-bottom: 1rem;
}

#ny-mw-calc .ny-mw-calc-control {
  margin-bottom: 0.75rem;
}

#ny-mw-calc label {
  font-weight: 600;
  margin-right: 0.5rem;
}

#ny-mw-calc select,
#ny-mw-calc input[type="number"],
#ny-mw-calc button {
  font-size: 1rem;
  padding: 0.25rem 0.5rem;
}

#ny-mw-calc .ny-mw-calc-rows {
  margin-bottom: 0.75rem;
}

#ny-mw-calc .ny-mw-calc-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-end;
  margin-bottom: 0.5rem;
  border-bottom: 1px solid #e1e1e1;
  padding-bottom: 0.5rem;
}

#ny-mw-calc .ny-mw-calc-row .ny-row-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  flex-grow: 1;
}

#ny-mw-calc .ny-field {
  display: flex;
  flex-direction: column;
  min-width: 10rem;
}

#ny-mw-calc .ny-row-actions {
  display: flex;
  align-items: flex-end;
}

#ny-mw-calc .ny-remove-row {
  background: transparent;
  border: 1px solid #6c757d;
  color: #6c757d;
  padding: 0.25rem 0.5rem;
  cursor: pointer;
}

#ny-mw-calc .ny-remove-row:hover,
#ny-mw-calc .ny-remove-row:focus {
  background: #e1e1e1;
}

#ny-mw-calc .ny-add-row {
  background: #02084d;
  color: #ffffff;
  border: none;
  padding: 0.5rem 1rem;
  cursor: pointer;
  font-size: 1rem;
}

#ny-mw-calc .ny-add-row:hover,
#ny-mw-calc .ny-add-row:focus {
  background: #0c2d70;
}

#ny-mw-calc .ny-advanced-settings {
  margin-top: 1rem;
}

#ny-mw-calc .ny-advanced-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 0.5rem;
}

#ny-mw-calc .ny-mw-calc-results p {
  margin: 0.25rem 0;
}

#ny-mw-calc .ny-mw-calc-disclaimer {
  font-size: 0.875rem;
  color: #6c757d;
  margin-top: 0.5rem;
}