/* Fluent Forms - Custom CSS */

.fluentform .ff-el-form-control {
    border-color: transparent;
}

.fluentform .ff-el-group {
    margin-bottom: 16px;
}

.fluentform label {
    font-size: 14px !important;
    font-weight: 500 !important;
    font-family: inherit !important;
    margin-bottom: 12px !important;
}

.transparent_input,
#fluentform_5 .ff-name-field-wrapper .ff-el-form-control,
#fluentform_9 .ff-name-field-wrapper .ff-el-form-control {
    background: transparent !important;
    border: 1px solid rgb(255, 255, 255, 0.6) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    color: #A3A3A3 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    padding: 4px 12px !important;
    height: 36px !important;
    ;
}

@media (min-width:767px) {

    #fluentform_5 .ff_submit_btn_wrapper button,
    #fluentform_9 .ff_submit_btn_wrapper button {
        margin-bottom: 0px !important;
    }

    .ff-t-container.ff-column-container.ff_columns_total_3.custom-form-container {
        padding-top: 10px;
    }
}

form#fluentform_5 .custom-policy-html,
form#fluentform_5 .ff_submit_btn_wrapper,
form#fluentform_9 .custom-policy-html,
form#fluentform_9 .ff_submit_btn_wrapper {
    padding-left: 10px;
}

select#ff_5_dropdown,
select#ff_9_dropdown {
    padding: 8px 8px !important;
    font-size: 14px !important;
}

.ff-el-group.ff-custom_html.custom-policy-html p {
    line-height: 16px !important;
    margin-block-end: 0px;
}

.custom-policy-html-mobile {
    display: none;
}

.custom-policy-html .desktop {
    display: block;
}

@media only screen and (min-width:767px) and (max-width:1439px) {

    form#fluentform_5 .ff-t-cell.ff-t-column-1,
    form#fluentform_5 .ff-t-cell.ff-t-column-2,
    form#fluentform_9 .ff-t-cell.ff-t-column-1,
    form#fluentform_9 .ff-t-cell.ff-t-column-2 {
        flex-basis: 100% !important;
    }

    form#fluentform_5 .ff_columns_total_3.custom-form-container,
    form#fluentform_9 .ff-t-container.ff-column-container.ff_columns_total_3 {
        flex-direction: column;
    }

    .footer-menu-section {
        justify-content: space-between;
        align-items: start;
    }
}

select#ff_5_dropdown option,
select#ff_9_dropdown option {
    background: white;
    color: black;
}

@media only screen and (max-width: 1439px) {

    form#fluentform_5 .custom-policy-html-mobile,
    form#fluentform_9 .custom-policy-html-mobile,
    .custom-social-mobile {
        display: block !important;
    }

    .custom-social-mobile {

        text-align: center !important;
    }

    form#fluentform_5 .custom-policy-html.desktop,
    form#fluentform_5 .ff-t-container.ff-column-container.ff_columns_total_2[data-name=ff_cn_id_1] .ff-t-column-2,
    form#fluentform_9 .custom-policy-html.desktop,
    form#fluentform_9 .ff-t-container.ff-column-container.ff_columns_total_2[data-name=ff_cn_id_1] .ff-t-column-2 {
        display: none !important;
    }

    form#fluentform_5 .ff-btn-submit,
    form#fluentform_9 .ff-btn-submit {
        width: 100% !important;
    }

    .copyright-footer-section {
        display: flex ! important;
        flex-direction: column-reverse !important;
        justify-content: center !important;
        align-items: center !important;

        .elementor-widget-text-editor {
            text-align: center !important;
        }

        .elementor-widget-nav-menu {
            align-self: center !important;
        }
    }

    .footer-inner-container {
        display: flex ! important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;

        .elementor-hidden-tablet {
            display: none !important;
        }
    }
}

.ff_submit_btn_wrapper {
    margin-bottom: 0px !important;
}

footer .fluentform .ff-el-group:not(.ff_submit_btn_wrapper) {
    margin-bottom: 10px !important;
}

.ff-message-success {
    border: 0px !important;
    box-shadow: none !important;
}

/* --- Button Base Styles & Reset --- */
/* --- Master Shared Selectors for Third-Party Custom Red Buttons --- */
.ff-btn-submit,
button.forminator-button-submit {
    overflow: hidden !important;
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 24px !important;
    border-radius: 100px !important;
    cursor: pointer !important;
    background-color: var(--e-global-color-primary) !important;
    color: #ffffff !important;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

/* 1. Original Text Tracking */
.ff-btn-submit .elementor-button-text,
button.forminator-button-submit .elementor-button-text {
    display: block !important;
    transform: translateY(0) !important;
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

/* 2. Rolling Duplicate Text Setup */
.ff-btn-submit::after,
button.forminator-button-submit::after {
    content: attr(data-hover) !important;
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: none !important;
    transform: translateY(100%) !important;
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

/* --- Combined Hover States --- */
.ff-btn-submit:hover,
button.forminator-button-submit:hover {
    background-color: #ffffff !important;
    color: var(--e-global-color-primary) !important;
}

.ff-btn-submit:hover .elementor-button-text,
button.forminator-button-submit:hover .elementor-button-text {
    transform: translateY(-150%) !important;
}

.ff-btn-submit:hover::after,
button.forminator-button-submit:hover::after {
    transform: translateY(0) !important;
    color: var(--e-global-color-primary) !important;
}

.forminator-ui.forminator-custom-form[data-design=default] .forminator-button:hover {
    box-shadow: none !important;
}

/* Forminator Custom Form Styles */
.forminator-ui .forminator-radio .forminator-radio-bullet:before {
    background: var(--e-global-color-primary) !important;
}

.forminator-ui .forminator-radio input:checked+.forminator-radio-bullet {
    border-color: var(--e-global-color-primary) !important;
    background-color: transparent !important;

    &:hover {
        border-color: var(--e-global-color-primary) !important;
    }
}