form {
    border: var(--base-border);
    border-radius: var(--base-border-radius);
    padding: var(--base-sm-padding);
    margin: var(--base-sm-margin) auto;
    box-shadow: var(--base-shadow);
  
    & label {
        display: block;
        margin-bottom: var(--base-sm-margin);
    }
  
    & fieldset {
        border: var(--base-border);
        padding: var(--base-sm-padding);
        border-radius: var(--base-border-radius);
        margin-bottom: var(--base-sm-margin);
    }
  
    & legend {
        font-weight: var(--font-weight-bold);
        padding: 0 0.5rem;
    }
    
    & input[type="text"],
    & input[type="email"],
    & input[type="password"],
    & input[type="search"],
    & input[type="tel"],
    & input[type="url"],
    & input[type="number"],
    & input[type="date"],
    & input[type="datetime-local"],
    & input[type="month"],
    & input[type="week"],
    & input[type="time"],
    & input[type="file"],
    & input[type="submit"],
    & button[type="submit"],
    & textarea,
    & select {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        display: block;
        width: var(--base-width);
        max-width: var(--base-width);
        padding: calc(var(--base-sm-padding) * 1.5) calc(var(--base-sm-padding) * 2);
        border: var(--base-border);
        border-radius: var(--base-border-radius);
        transition: border-color 0.3s ease;
        margin-bottom: var(--base-sm-margin);
    }
  
    & input:focus,
    & textarea:focus,
    & select:focus {
        border-color: var(--primary-color);
        outline: none;
    }
  
    & input[type="checkbox"],
    & input[type="radio"] {
      display: inline-block;
      margin-right: var(--base-sm-margin);
      transform: scale(1.1);
      accent-color: var(--primary-color);
      cursor: pointer;
    }
  
    & label.inline {
      display: inline-block;
      margin-right: var(--base-sm-margin);
    }
  
    & input[type="range"] {
      width: var(--base-width);
      margin: var(--base-sm-margin) 0;
      cursor: pointer;
    }
  
    & button,
    & select,
    & input[type="submit"],
    & input[type="reset"],
    & input[type="button"] {
      cursor: pointer;
      transition: background-color 0.3s ease;
    }
  
    & button:hover,
    & input[type="submit"]:hover,
    & input[type="reset"]:hover,
    & input[type="button"]:hover {
        border-color: var(--secondary-light-green);
        background-color: var(--secondary-light-green);
    }
  
    & small,
    & .form-hint {
        display: block;
        margin-bottom: var(--base-sm-margin);
        color: var(--primary-dark-40-transparent);
        font-size: calc(var(--base-font-size) * 0.75);
    }
  
    & .error {
        color: var(--error-color);
    }
  
    & input:disabled,
    & textarea:disabled,
    & select:disabled,
    & button:disabled {
        background-color: var(--star-grey);
        cursor: not-allowed;
    }
  
    & input[type="file"] {
        padding: var(--base-sm-padding);
    }
  
    & .form-group {
      margin-bottom: calc(var(--base-sm-margin) * 2);
    }

    /* Form Button Styles to match theme */
    & .btn{
        border-radius: calc(var(--base-font-size) * 0.25) !important;
        font-weight: var(--font-weight-bold) !important;
        font-size: calc(var(--base-font-size) * 1.20) !important;
        text-align: var(--base-text-align-center) !important;
        &.btn-primary{
            background-color: var(--primary-dark) !important;
            border: var(--base-border) !important;
            border-color: var(--primary-dark) !important;
            color: var(--white-color) !important;
        }
        &[id^="wpforms-submit-"] {
            height: calc(var(--base-font-size) * 2.5) !important;
        }
    }
  }
  