.gform-theme--api,
.gform-theme--framework {
    --gf-ctrl-date-picker-bg-color: var(--wp--preset--color--base) !important;
    --gf-ctrl-date-picker-cell-content-color: var(--wp--preset--color--contrast) !important;
    --gf-ctrl-date-picker-header-icons-color: var(--wp--preset--color--contrast) !important;
    --gf-field-pg-prog-bar-bg-color-blue: var(--wp--preset--color--primary) !important;
    --gf-ctrl-border-width: 2px;
}

.gform_wrapper.gform-theme--api,
.gform_wrapper.gform-theme--foundation {
    --gf-form-gap-x: 1.5rem;
    --gf-form-gap-y: 2rem;
    --gf-field-gap-x: 1.5rem;
    --gf-field-gap-y: 2rem;
    --gf-ctrl-btn-bg-color-hover-primary: var(--wp--preset--color--primary);
    --gf-ctrl-btn-color-hover-primary: var(--wp--preset--color--base);
    --gf-ctrl-btn-radius: 0 0 30px 0;
    --gf-ctrl-checkbox-check-radius: 5px;
    --gf-ctrl-btn-bg-color-ctrl: var(--wp--preset--color--primary);
    --gf-ctrl-btn-bg-color-hover-ctrl: var(--wp--preset--color--accent);
    --gf-ctrl-file-zone-icon-color: var(--wp--preset--color--primary);
    --gf-ctrl-file-btn-color: var(--wp--preset--color--primary);
    --gf-ctrl-file-btn-bg-color: var(--gf-color-primary);
    --gf-ctrl-file-btn-bg-color-hover: var(--wp--preset--color--primary) !important;
    --gf-ctrl-file-btn-color-hover: var(--wp--preset--color--base);
    --gf-ctrl-accent-color: var(--wp--preset--color--primary);
    --gf-ctrl-choice-check-color: var(--wp--preset--color--primary);
    --gf-ctrl-shadow: none;
    --gf-field-section-border-color: var(--wp--preset--color--primary);
    --gf-ctrl-outline-color-focus: var(--wp--preset--color--neutral);
    --gf-ctrl-border-color-focus: var(--wp--preset--color--neutral-dark);
    --gf-ctrl-btn-bg-color-hover-secondary: var(--wp--preset--color--accent);
    --gf-ctrl-shadow-color-focus: transparent;

    /* submit button styles */
    --gf-ctrl-btn-padding-x-sm: 0.85rem;
    --gf-ctrl-btn-padding-x-md: 1.5rem;
    --gf-ctrl-btn-padding-x-lg: 2rem;
    --gf-ctrl-btn-font-size-md: 16px;
    --gf-ctrl-btn-font-size-lg: 18px;
    --gf-ctrl-btn-font-weight: 700;
    --gf-ctrl-btn-text-transform: uppercase;
    --gf-ctrl-btn-letter-spacing: 0.05em;
    --gf-form-spinner-fg-color: var(--gf-ctrl-btn-color-primary);
    --gf-form-spinner-bg-color: var(--gf-color-primary);
}

/* footer submit button - align right */
.gform_wrapper .gform_footer {
    justify-content: flex-end;
}

/* inline submit button - align right */
.gform_wrapper .gform_fields .gfield--type-submit {
    justify-content: flex-end;
}

.gform_wrapper input[type=submit] {
    background-image: linear-gradient(90deg, var(--wp--preset--color--primary) 0%, var(--wp--preset--color--primary) 50%, var(--wp--preset--color--accent) 50%, var(--wp--preset--color--accent) 100%);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 202% 100%;
    border: none !important;
    transition: all 0.25s ease;
    transition-property: border-color, color, background-position, background-color;
    white-space: nowrap;

    &:hover {
        background-position: left bottom;
    }
}

.gform_wrapper .gform-fields-underline-style {
    & input:not([type=submit], [type=button], [type=checkbox], [type=radio]),
    & select,
    & textarea {
        background-color: transparent;
        border-left: 0;
        border-right: 0;
        border-top: 0;
    }

    & input:not([type=submit], [type=button]),
    & select,
    & textarea {
        border-width: 1px;
    }
}

.gform--remove-legend_wrapper .gform_required_legend {
    display: none;
}

.gform_wrapper .gform_fields .gfield:not(.gfield--type-multiselect) select option {
    color: black;
}

.gform-theme--framework.ui-datepicker select.ui-datepicker-month,
.gform-theme--framework.ui-datepicker select.ui-datepicker-year {
    --gf-icon-ctrl-select: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.097631 1.31658 -0.097631 1.70711 0.292893L5 3.58579L8.29289 0.292893C8.68342 -0.0976311 9.31658 -0.0976311 9.70711 0.292893C10.0976 0.683417 10.0976 1.31658 9.70711 1.70711L5.70711 5.70711C5.31658 6.09763 4.68342 6.09763 4.29289 5.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893Z' fill='rgba(0, 0, 0, 0.65)'/%3E%3C/svg%3E");

    border-color: var(--wp--preset--color--accent);
    color: var(--wp--preset--color--contrast);
}

.gform_wrapper .gform_title {
    border-left: 4px solid var(--wp--preset--color--accent);
    font-size: var(--wp--preset--font-size--h-3);
    padding-left: 1.5rem;
}

.gform_wrapper .gfield_total {
    border: 0.125rem solid #dce0e4;
    padding: 1.25rem 2rem;
}

.gform_description,
.gform_wrapper .gfield_total label,
.gform_wrapper .gfield_total .ginput_total {
    font-size: var(--wp--preset--font-size--h-5) !important;
    font-weight: 700 !important;
}

.gform_wrapper .gfield_total .ginput_total {
    border: 2px solid #dce0e4;
    padding: 0.5rem;
}

.gform_wrapper .gform-loader {
    position: absolute !important;
    right: 1rem;
}

.gform_wrapper:has(.gform-loader) .gform-footer {
    position: relative;
}

.gform_wrapper:has(.gform-loader) input[type=submit] {
    padding-right: 3rem !important;
}

/* prepaid coupons custom style */
.prepaid-coupons_wrapper .gform_fields {
    position: relative;
}

.prepaid-coupons_wrapper .gfield--type-product.prepaid-coupons__quantity {
    align-items: center;
    display: grid;
    grid-template-columns: 1fr 2fr;

    & .ginput_container_singleproduct {
        align-items: center;
        flex-direction: row-reverse;
        gap: 1.5rem;
    }

    & .gfield_label_before_complex,
    & .gfield_label_product {
        font-weight: 700;
        margin: 0;
    }

    & .ginput_quantity {
        margin: 0;
    }

    & .ginput_product_price {
        font-size: var(--wp--preset--font-size--large);
    }

    & .ginput_product_price_wrapper .ginput_product_price_label,
    & .ginput_container_singleproduct .ginput_quantity_label {
        display: none;
    }
}

#securepay-ui-container {
    background: var(--wp--preset--color--base);
    border: 2px solid #dce0e4 !important;
}

@media screen and (min-width: 768px) {
    .prepaid-coupons_wrapper .gfield--type-product.prepaid-coupons__quantity {
        width: 70%;
    }

    .prepaid-coupons_wrapper .prepaid-coupons__total.gfield_total {
        position: absolute;
        right: 0;
        top: 0;
        width: 25%;
    }
}

@media screen and (max-width: 599px) {
    .prepaid-coupons_wrapper .gfield--type-product.prepaid-coupons__quantity {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        justify-content: space-between;
    }

    .prepaid-coupons_wrapper .gfield--type-product.prepaid-coupons__quantity .ginput_quantity {
        inline-size: 80px;
    }

    .prepaid-coupons_wrapper .gfield--type-product.prepaid-coupons__quantity .ginput_product_price {
        font-size: 1rem;
    }

    .gf_simple_horizontal_wrapper.gform_wrapper {
        width: 100%;
    }

    .gf_simple_horizontal_wrapper.gform_wrapper form.gf_simple_horizontal {
        width: 100%;

        & .gform_body,
        & .gform_footer {
            display: block !important;
            width: 100%;
        }

        & .gform_footer {
            margin-top: var(--wp--preset--spacing--30);
        }
    }
}

@media screen and (max-width: 1380px) {
    .gform_wrapper .gform-3-col-breakpoint .gfield--width-third,
    .gform_wrapper .gform-3-col-breakpoint .gfield--width-two-thirds {
        grid-column: span 6;
    }
}

@media screen and (max-width: 950px) {
    .gform_wrapper .gform-3-col-breakpoint .gfield--width-third,
    .gform_wrapper .gform-3-col-breakpoint .gfield--width-two-thirds {
        grid-column: span 12;
    }
}
