/**
 * All of the CSS for your Public-facing functionality should be
 * included in this file.
 */

:root {
    --base-color: #666666;
    --base-color-darker: #333333;
    --success-darker: #00e50021;
    --error-darker: #e5000021;
    --error-lighter: #af4c4c;
}


.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container {
    padding: 10px;
    margin-top: 25px;
    overflow: hidden;
    background-color: var(--success-darker);
    border-radius: 4px;
    border: 2px solid var(--success-darker);
    transition: height 200ms linear;
    -webkit-transition: height 200ms linear;
    -moz-transition: height 200ms linear;
    -o-transition: height 200ms linear;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container.disabled {
    height: 0;
    padding: 0;
    border: none;
    transition: height 200ms linear;
    -webkit-transition: height 200ms linear;
    -moz-transition: height 200ms linear;
    -o-transition: height 200ms linear;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container.invalid {
    background-color: var(--error-darker);
    border-color: var(--error-darker);
}


.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container .company_name {
    display: block;
    font-weight: 600;
    color: var(--base-color);
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container.invalid .company_name {
    color: var(--error-lighter);
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container > p > span:nth-child(1) {
    font-weight: 600;
    color: var(--base-color);
    margin-right: 5px;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container > p {
    margin-bottom: 0;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .company_details_container > p > span:nth-child(2) {
    color: var(--base-color);
    font-size: 16px;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification {
    position: relative;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification input.wpforms-field-required {
    width: 100%;
    max-width: 100%;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .wpforms-validate-cui-button {
    position: absolute;
    right: 0;
    top: 0;
    height: 42px;
    padding: 0 25px;
    border-radius: 0 2px 2px 0;
    background-color: var(--base-color);
    color: white;
    align-items: center;
    cursor: pointer;
}

.wpforms-field.wpforms-field-cui-validation-field .wpforms-cui-verification .wpforms-validate-cui-button:hover {
    background-color: var(--base-color-darker);
}