[hidden] { display: none; }
.ipro-input,
.ipro-select,
.ipro-textarea,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar)
  :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="image"])),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea) {
  display: block;
  width: 100%;
  padding: 0 var(--ipro-space-3);
  background-color: var(--ipro-surface-0); 
  color: var(--ipro-ink-900);
  font: var(--ipro-form-weight-input) var(--ipro-text-base)/1.5 var(--ipro-font-body);
  border: var(--ipro-form-border-width) solid var(--ipro-line-field);
  border-radius: var(--ipro-form-radius);
  transition: border-color var(--ipro-transition-fast) var(--ipro-easing-standard),
              box-shadow var(--ipro-transition-fast) var(--ipro-easing-standard);
}
.ipro-input,
.ipro-select,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar)
  :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="image"])),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select) {
  height: var(--ipro-form-field-height);
}
.ipro-input::placeholder,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) input::placeholder,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) textarea::placeholder {
  color: var(--ipro-ink-500); 
}
.ipro-select,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select) {
  white-space: nowrap;
}
.ipro-input:focus-visible,
.ipro-select:focus-visible,
.ipro-textarea:focus-visible,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input:focus-visible),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select:focus-visible),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea:focus-visible) {
  border-width: var(--ipro-form-border-width-focus);
  border-color: var(--ipro-vetiver-700);
  outline: none;
  margin: -1px;
}
.ipro-input[aria-invalid="true"]:focus-visible,
.ipro-select[aria-invalid="true"]:focus-visible,
.ipro-textarea[aria-invalid="true"]:focus-visible,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[aria-invalid="true"]:focus-visible),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select[aria-invalid="true"]:focus-visible),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea[aria-invalid="true"]:focus-visible) {
  border-color: var(--ipro-danger-600);
  box-shadow: var(--ipro-form-halo-danger);
}
@media (forced-colors: active) {
  .ipro-input:focus-visible,
  .ipro-select:focus-visible,
  .ipro-textarea:focus-visible,
  :where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input:focus-visible),
  :where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select:focus-visible),
  :where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea:focus-visible) {
    outline: 2px solid;
    outline-offset: 2px;
  }
}
.ipro-input[aria-invalid="true"],
.ipro-select[aria-invalid="true"],
.ipro-textarea[aria-invalid="true"],
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[aria-invalid="true"]),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select[aria-invalid="true"]),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea[aria-invalid="true"]) {
  border-color: var(--ipro-danger-600);
}
.ipro-input.is-valid,
.ipro-select.is-valid,
.ipro-textarea.is-valid {
  border-color: var(--ipro-vetiver-700);
}
.ipro-input:disabled,
.ipro-select:disabled,
.ipro-textarea:disabled,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input:disabled),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select:disabled),
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea:disabled) {
  background-color: var(--ipro-surface-50); 
  border-color: var(--ipro-line-100);
  color: var(--ipro-ink-500); 
  cursor: not-allowed;
}
.ipro-input:disabled::placeholder,
.ipro-textarea:disabled::placeholder { color: var(--ipro-ink-500); }
.ipro-label,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(label:not(.ipro-checkbox-label):not(.ipro-radio-label)) {
  display: block;
  margin-bottom: var(--ipro-space-2); 
  font: var(--ipro-form-weight-label) var(--ipro-form-label-size)/1.4 var(--ipro-font-body);
  color: var(--ipro-ink-700);
}
.ipro-help {
  margin-top: var(--ipro-space-2);
  font: var(--ipro-form-weight-input) var(--ipro-form-label-size)/1.4 var(--ipro-font-body);
  color: var(--ipro-ink-500);
}
.ipro-help--error {
  color: var(--ipro-danger-600);
  display: inline-flex;
  align-items: center;
  gap: var(--ipro-space-1); 
}
:where(.ipro-filter-field, .ipro-qs__field, .ipro-form-group):has([aria-invalid="true"]) .ipro-label,
:where(.ipro-filter-field, .ipro-qs__field, .ipro-form-group):has([aria-invalid="true"]) .ipro-qs__label {
  color: var(--ipro-danger-600);
}
.ipro-textarea,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(textarea) {
  height: var(--ipro-form-textarea-height);
  min-height: var(--ipro-form-textarea-height);
  max-height: var(--ipro-form-textarea-max);
  padding-block: var(--ipro-space-3);
  resize: vertical;
}
@supports (appearance: base-select) {
  .ipro-select {
    display: flex;
    align-items: center;
  }
}
@supports not (appearance: base-select) {
  .ipro-select,
  :where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select) {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%236B7068' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 8 10 13 15 8'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--ipro-space-3) center;
    background-size: var(--ipro-form-select-chevron) var(--ipro-form-select-chevron);
    padding-right: calc(var(--ipro-space-3) * 2 + var(--ipro-form-select-chevron));
  }
  .ipro-select:disabled,
  :where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(select:disabled) {
    opacity: 1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%239AA09A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 8 10 13 15 8'/%3E%3C/svg%3E");
  }
}
.ipro-select--sm {
  display: inline-flex;
  width: auto;
  width: 220px;
  max-width: 100%;
}
.ipro-checkbox,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="checkbox"]) {
  -webkit-appearance: none;
  appearance: none;
  flex-shrink: 0;
  width: var(--ipro-form-checkbox-size);
  height: var(--ipro-form-checkbox-size);
  margin: 0;
  background: var(--ipro-surface-0);
  border: var(--ipro-form-border-width) solid var(--ipro-ink-500); 
  border-radius: var(--ipro-form-checkbox-radius);
  cursor: pointer;
  transition: background-color var(--ipro-transition-fast) var(--ipro-easing-standard),
              border-color var(--ipro-transition-fast) var(--ipro-easing-standard);
}
.ipro-checkbox:checked,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="checkbox"]:checked) {
  background-color: var(--ipro-vetiver-700);
  border-color: var(--ipro-vetiver-700);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: var(--ipro-form-checkbox-icon) var(--ipro-form-checkbox-icon);
}
.ipro-checkbox:disabled,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="checkbox"]:disabled) {
  border-color: var(--ipro-line-100);
  background-color: var(--ipro-surface-50);
  cursor: not-allowed;
}
.ipro-checkbox:focus-visible,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="checkbox"]:focus-visible) {
  outline: var(--ipro-form-border-width-focus) solid var(--ipro-vetiver-700);
  outline-offset: 2px;
}
.ipro-checkbox-label,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(label:has(> input[type="checkbox"])) {
  display: flex;
  align-items: flex-start;
  gap: var(--ipro-space-3);
  font: var(--ipro-form-weight-input) var(--ipro-text-base)/1.4 var(--ipro-font-body);
  color: var(--ipro-ink-900);
  cursor: pointer;
}
.ipro-radio,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="radio"]) {
  -webkit-appearance: none;
  appearance: none;
  flex-shrink: 0;
  width: var(--ipro-form-radio-size);
  height: var(--ipro-form-radio-size);
  margin: 0;
  background: var(--ipro-surface-0);
  border: var(--ipro-form-radio-border-width) solid var(--ipro-ink-500); 
  border-radius: 50%;
  cursor: pointer;
  transition: border-color var(--ipro-transition-fast) var(--ipro-easing-standard);
}
.ipro-radio:checked,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="radio"]:checked) {
  border-color: var(--ipro-vetiver-700);
  background-image: radial-gradient(circle, var(--ipro-vetiver-700) 0 calc(var(--ipro-form-radio-dot) / 2), transparent calc(var(--ipro-form-radio-dot) / 2 + 0.5px));
  background-repeat: no-repeat;
  background-position: center;
}
.ipro-radio:disabled,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="radio"]:disabled) {
  border-color: var(--ipro-line-100);
  background-color: var(--ipro-surface-50);
  cursor: not-allowed;
}
.ipro-radio:focus-visible,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(input[type="radio"]:focus-visible) {
  outline: var(--ipro-form-border-width-focus) solid var(--ipro-vetiver-700);
  outline-offset: 2px;
}
.ipro-radio-label,
:where(.ipro-form, .ipro-qs__form, .ipro-filterbar) :where(label:has(> input[type="radio"])) {
  display: flex;
  align-items: flex-start;
  gap: var(--ipro-space-3);
  font: var(--ipro-form-weight-input) var(--ipro-text-base)/1.4 var(--ipro-font-body);
  color: var(--ipro-ink-900);
  cursor: pointer;
}
.ipro-btn {
  height: var(--ipro-form-btn-height);
  padding: 0 var(--ipro-space-5); 
  border-radius: var(--ipro-form-radius);
  font: var(--ipro-form-weight-btn) var(--ipro-text-base)/1 var(--ipro-font-body);
  background: var(--ipro-vetiver-700);
  color: var(--ipro-on-dark-full);
  border: var(--ipro-form-border-width) solid transparent;
}
.ipro-btn:hover { background: var(--ipro-vetiver-800); }
.ipro-btn:active { background: var(--ipro-vetiver-900); }
.ipro-btn:focus-visible {
  outline: var(--ipro-form-border-width-focus) solid var(--ipro-vetiver-700);
  outline-offset: 2px;
}
.ipro-btn--sm { height: var(--ipro-form-field-height); }
.ipro-btn--secondary {
  background: transparent;
  color: var(--ipro-vetiver-700); 
  border-color: var(--ipro-vetiver-700);
}
.ipro-btn--secondary:hover { background: var(--ipro-vetiver-50); color: var(--ipro-vetiver-700); }
.ipro-btn--tertiary {
  background: transparent;
  border-color: transparent;
  height: auto;
  padding: 0;
  color: var(--ipro-vetiver-700); 
  text-decoration: underline;
  text-underline-offset: 3px;
}
.ipro-btn--tertiary:hover {
  background: transparent;
  color: var(--ipro-vetiver-800);
  text-decoration-thickness: 2px;
}
.ipro-btn--ghost {
  background: transparent;
  color: var(--ipro-ink-700);
  box-shadow: none;
  padding: 0 var(--ipro-space-4);
}
.ipro-btn--ghost:hover {
  background: var(--ipro-surface-100);
  color: var(--ipro-ink-900);
  box-shadow: none;
}
.ipro-btn--danger { background: var(--ipro-danger-600); }
.ipro-btn--danger:hover { background: var(--ipro-danger-700); }
.ipro-btn--on-dark { background: var(--ipro-laiton-300); color: var(--ipro-ink-900); }
.ipro-btn--on-dark:hover { background: var(--ipro-surface-0); color: var(--ipro-ink-900); }
.ipro-btn--ghost-dark {
  background: transparent;
  color: var(--ipro-on-dark-full);
  border: var(--ipro-form-border-width) solid var(--ipro-on-dark-fill-200);
  box-shadow: none;
}
.ipro-btn--ghost-dark:hover {
  background: var(--ipro-on-dark-fill-100);
  color: var(--ipro-on-dark-full);
  border-color: var(--ipro-on-dark-fill-200);
}
.ipro-btn[disabled],
.ipro-btn:disabled {
  background: var(--ipro-surface-50);
  border-color: var(--ipro-line-100);
  color: var(--ipro-ink-500); 
  cursor: not-allowed;
  box-shadow: none;
}
.ipro-input-group {
  border-width: var(--ipro-form-border-width);
  border-color: var(--ipro-line-field);
  border-radius: var(--ipro-form-radius);
}
.ipro-input-group:focus-within {
  border-width: var(--ipro-form-border-width-focus);
  border-color: var(--ipro-vetiver-700);
  outline: none;
  margin: -1px;
}
@media (forced-colors: active) {
  .ipro-input-group:focus-within { outline: 2px solid; outline-offset: 2px; }
}
.ipro-form-section-title { margin-bottom: var(--ipro-space-5); }
.ipro-form-group { display: flex; flex-direction: column; position: relative; }
.ipro-form-group + .ipro-form-group,
.ipro-form-group + .ipro-form-actions { margin-top: var(--ipro-space-4); }
.ipro-form-actions { margin-top: var(--ipro-space-5); display: flex; gap: var(--ipro-space-3); }
.ipro-form-row--2col {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--ipro-space-4); 
}
.ipro-form-row--2col > .ipro-form-group + .ipro-form-group { margin-top: 0; }
.ipro-form-group + .ipro-form-row--2col,
.ipro-form-row--2col + .ipro-form-group,
.ipro-form-row--2col + .ipro-form-row--2col { margin-top: var(--ipro-space-4); }
.ipro-form-group__icon {
  position: absolute;
  right: var(--ipro-space-3);
  bottom: 10px; 
  width: var(--ipro-form-state-icon);
  height: var(--ipro-form-state-icon);
  color: var(--ipro-vetiver-700);
  pointer-events: none;
}
