/**handles:kl-variant-inline**/

/* Variant inline layout – two columns, responsive; keeps native behavior */
.kl-calc .design-variant-inline{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: start;
}
@media (max-width: 640px){
  .kl-calc .design-variant-inline{ grid-template-columns: 1fr; }
}
.kl-calc .variant-line{
  display: grid;
  grid-template-columns: auto 1fr;
  grid-auto-rows: auto;
  gap: 6px 10px;
  border: 1px solid var(--kl-border, #e5e7eb);
  border-radius: 10px;
  padding: 12px;
  background: #fff;
}
.kl-calc .variant-line > input[type="radio"]{ align-self: start; margin-top: 2px; }
.kl-calc .default-variant-label, .kl-calc .custom-variant-label{
  font-weight: 600; font-size: 13px; color: var(--kl-text, #111827);
}
.kl-calc .variant-line .select-wrapper,
.kl-calc .variant-line .variant-custom-input-wrap{
  grid-column: 1 / -1;
  min-width: 0;
}
.kl-calc .variant-line select,
.kl-calc .variant-line input[type="number"]{
  width: 100%;
  appearance: none;
  border: 1px solid var(--kl-border, #e5e7eb);
  border-radius: 10px;
  padding: 10px 12px;
  line-height: 1.4;
  outline: none;
  background: #fff;
  transition: box-shadow .15s, border-color .15s;
}
.kl-calc .variant-line select:focus,
.kl-calc .variant-line input[type="number"]:focus{
  border-color: transparent;
  box-shadow: 0 0 0 3px rgba(59,130,246,.35);
}
.kl-calc .variant-line .error-message{
  display: block; margin-top: 6px; font-size: 12px; color: #ef4444;
}