/**
 * Forms Theme Styles
 *
 * Gravity Forms / filter UI use design tokens from Elementor / kit (same vars as DesignTokensMap sync).
 */

/* =====================
   GRAVITY FORMS
   ===================== */

/* Form Fields - Normal State */
.gform_wrapper input[type='text'],
.gform_wrapper input[type='email'],
.gform_wrapper input[type='tel'],
.gform_wrapper input[type='url'],
.gform_wrapper input[type='number'],
.gform_wrapper input[type='password'],
.gform_wrapper input[type='search'],
.gform_wrapper input[type='date'],
.gform_wrapper input[type='time'],
.gform_wrapper input[type='datetime-local'],
.gform_wrapper select {
  color: var(--form-input-text);
  background-color: var(--form-input-bg);
  border: 1px solid var(--form-input-border);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  font-family: var(--font-primary);
  font-weight: 400;
  font-size: var(--text-base, 1rem);
  line-height: 1.5;
  width: 100%;
  height: var(--form-input-height);
  box-sizing: border-box;
  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

.gform_wrapper textarea {
  color: var(--form-input-text);
  background-color: var(--form-input-bg);
  border: 1px solid var(--form-input-border);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  font-family: var(--font-primary);
  font-weight: 400;
  font-size: var(--text-base, 1rem);
  line-height: 1.5;
  width: 100%;
  min-height: var(--form-textarea-min-height);
  box-sizing: border-box;
  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder {
  color: var(--form-input-placeholder);
}

.gform_wrapper select {
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.gform_wrapper .ginput_container_select:has(select:not([multiple])) {
  position: relative;
}

.gform_wrapper .ginput_container_select:has(select:not([multiple])) select {
  background-image: none;
  padding-right: calc(var(--space-3) + var(--space-6));
}

.gform_wrapper .ginput_container_select:has(select:not([multiple]))::after {
  content: '';
  position: absolute;
  right: var(--space-3);
  top: 50%;
  width: 0;
  height: 0;
  border-left: var(--space-1) solid transparent;
  border-right: var(--space-1) solid transparent;
  border-top: calc(var(--space-1) + 1px) solid var(--form-label);
  transform: translateY(-25%);
  pointer-events: none;
}

.gform_wrapper select[multiple] {
  padding-right: var(--space-3);
  height: auto;
}

.gform_wrapper select:disabled,
.gform_wrapper input:disabled,
.gform_wrapper textarea:disabled {
  background-color: var(--form-input-disabled-bg);
  color: var(--form-input-disabled-text);
  border-color: var(--form-input-disabled-border);
  cursor: not-allowed;
  opacity: var(--form-input-disabled-opacity);
}

/* Form Fields - Hover */
.gform_wrapper input:hover:not(:disabled):not(:focus),
.gform_wrapper select:hover:not(:disabled):not(:focus),
.gform_wrapper textarea:hover:not(:disabled):not(:focus) {
  border-color: var(--form-input-border-hover);
}

/* Form Fields - Focus State */
.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
  outline: none;
  border-color: var(--form-input-border-focus);
  box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
}

/* Labels */
.gform_wrapper .gfield_label,
.gform_wrapper label.gfield_label {
  display: block;
  color: var(--form-label);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: 500;
  margin-bottom: var(--space-2);
}

.gform_wrapper .gfield_required {
  color: var(--form-label-required);
}

/* Sub-labels */
.gform_wrapper .gfield_sub_label,
.gform_wrapper label.gfield_sub_label {
  color: var(--form-description);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: 400;
}

/* Descriptions */
.gform_wrapper .gfield_description {
  color: var(--form-description);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
}

/* Radio and Checkboxes */
.gform_wrapper input[type='radio'],
.gform_wrapper input[type='checkbox'] {
  accent-color: var(--form-choice-accent);
  width: auto;
  height: auto;
  margin-right: var(--space-2);
}

.gform_wrapper .gfield_radio label,
.gform_wrapper .gfield_checkbox label {
  color: var(--form-label);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
}

/* Submit Button */
.gform_wrapper .gform_button,
.gform_wrapper input[type='submit'],
.gform_wrapper button[type='submit'] {
  color: var(--form-button-text);
  background-color: var(--form-button-bg);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-6);
  font-family: var(--font-primary);
  font-size: var(--text-base, 1rem);
  font-weight: 700;
  cursor: pointer;
  transition: background-color var(--transition-fast);
}

.gform_wrapper .gform_button:hover,
.gform_wrapper .gform_button:focus,
.gform_wrapper input[type='submit']:hover,
.gform_wrapper input[type='submit']:focus,
.gform_wrapper button[type='submit']:hover,
.gform_wrapper button[type='submit']:focus {
  background-color: var(--form-button-bg-hover);
}

/* Form Container */
.gform_wrapper {
  background-color: transparent;
}

/* Field spacing */
.gform_wrapper .gfield {
  margin-bottom: var(--space-4);
}

/* Name field container */
.gform_wrapper .ginput_complex {
  display: flex;
  gap: var(--space-3);
}

.gform_wrapper .ginput_complex .name_first,
.gform_wrapper .ginput_complex .name_last {
  flex: 1;
}

/* Validation - Error Messages */
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea {
  border-color: var(--form-error-border) !important;
}

.gform_wrapper .gfield_error .gfield_label,
.gform_wrapper .validation_message,
.gform_wrapper .gfield_validation_message {
  color: var(--form-error-text);
}

/* Validation - Success Messages */
.gform_wrapper .gform_confirmation_message {
  color: var(--form-success-text);
  background-color: var(--form-success-bg);
  padding: var(--space-4);
  border-radius: var(--radius-md);
  margin: var(--space-4) 0;
}

/* Additional Gravity Forms Elements */
.gform_wrapper .gfield_time_hour,
.gform_wrapper .gfield_time_minute,
.gform_wrapper .gfield_time_ampm {
  display: inline-block;
  margin-right: var(--space-2);
}

.gform_wrapper .ginput_container_date input {
  width: auto;
}

.gform_wrapper .gfield_list_header {
  font-weight: 700;
  margin-bottom: var(--space-2);
}

.gform_wrapper .gfield_list_cell input {
  width: 100%;
}

/* File Upload */
.gform_wrapper .ginput_container_fileupload input[type='file'] {
  padding: 0;
  border: none;
  background: transparent;
}

/* Number Field Spinner */
.gform_wrapper input[type='number']::-webkit-inner-spin-button,
.gform_wrapper input[type='number']::-webkit-outer-spin-button {
  opacity: 1;
}

/* Footer / Submit area */
.gform_wrapper .gform_footer {
  margin-top: var(--space-4);
}

/* =====================
   FILTER WIDGET
   ===================== */

/* Filter Widget Inputs */
.wu-filter-widget__field select,
.wu-filter-widget__field input[type='text'],
.wu-filter-widget__field input[type='number'] {
  color: var(--form-input-text);
  background-color: var(--form-input-bg);
  border: 1px solid var(--form-input-border);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  font-family: var(--font-primary);
  font-weight: 400;
  font-size: var(--text-base, 1rem);
  line-height: 1.5;
  width: 100%;
  height: var(--form-input-height);
  box-sizing: border-box;
  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

.wu-filter-widget__field select {
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

.wu-filter-widget__field:has(> select:not([multiple])) {
  position: relative;
}

.wu-filter-widget__field:has(> select:not([multiple])) select {
  background-image: none;
  padding-right: calc(var(--space-3) + var(--space-6));
}

.wu-filter-widget__field:has(> select:not([multiple]))::after {
  content: '';
  position: absolute;
  right: var(--space-3);
  top: 50%;
  width: 0;
  height: 0;
  border-left: var(--space-1) solid transparent;
  border-right: var(--space-1) solid transparent;
  border-top: calc(var(--space-1) + 1px) solid var(--form-label);
  transform: translateY(-25%);
  pointer-events: none;
}

.wu-filter-widget__field select:hover:not(:disabled):not(:focus),
.wu-filter-widget__field input:hover:not(:disabled):not(:focus) {
  border-color: var(--form-input-border-hover);
}

.wu-filter-widget__field select:focus,
.wu-filter-widget__field input:focus {
  outline: none;
  border-color: var(--form-input-border-focus);
  box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
}

.wu-filter-widget__field label {
  display: block;
  color: var(--form-label);
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: 500;
  margin-bottom: var(--space-2);
}

/* Filter Widget Submit Button */
.wu-filter-widget__submit button {
  color: var(--form-button-text);
  background-color: var(--form-button-bg);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-6);
  font-family: var(--font-primary);
  font-size: var(--text-base, 1rem);
  font-weight: 700;
  cursor: pointer;
  height: var(--form-input-height);
  width: 100%;
  box-sizing: border-box;
  transition: background-color var(--transition-fast);
}

.wu-filter-widget__submit button:hover,
.wu-filter-widget__submit button:focus {
  background-color: var(--form-button-bg-hover);
}

/* =====================
   TOM SELECT
   ===================== */

.wu-filter-widget .ts-wrapper {
  width: 100%;
  min-width: 0;
}

.wu-filter-widget .ts-control {
  background-color: var(--form-input-bg);
  border: 1px solid var(--form-input-border);
  border-radius: var(--radius-md);
  color: var(--form-input-text);
  font-family: var(--font-primary);
  font-weight: 400;
  font-size: var(--text-base, 1rem);
  line-height: 1.5;
  padding: var(--space-2) calc(var(--space-3) + var(--space-6)) var(--space-2) var(--space-3);
  height: var(--form-input-height);
  box-sizing: border-box;
  align-items: center;
  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);
}

.wu-filter-widget .ts-control::after {
  content: '';
  position: absolute;
  right: var(--space-3);
  top: 50%;
  width: 0;
  height: 0;
  border-left: var(--space-1) solid transparent;
  border-right: var(--space-1) solid transparent;
  border-top: calc(var(--space-1) + 1px) solid var(--form-label);
  transform: translateY(-25%);
  pointer-events: none;
}

.wu-filter-widget .ts-wrapper.dropdown-active .ts-control::after {
  transform: translateY(-25%) rotate(180deg);
}

.wu-filter-widget .ts-wrapper.focus .ts-control {
  outline: none;
  border-color: var(--form-input-border-focus);
  box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
}

.wu-filter-widget .ts-dropdown {
  background-color: var(--form-input-bg);
  border: 1px solid var(--form-input-border);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  font-family: var(--font-primary);
  font-size: var(--text-base, 1rem);
}

.wu-filter-widget .ts-dropdown .option {
  padding: var(--space-2) var(--space-3);
}

.wu-filter-widget .ts-dropdown .option.active {
  background-color: var(--form-choice-accent);
  color: var(--form-button-text);
}