/**
 * ============================================================
 * VN CF7 ADDRESS
 * ============================================================
 */


/*
 * ------------------------------------------------------------
 * Native fallback
 * ------------------------------------------------------------
 */

.vn-cf7-province,
.vn-cf7-ward {

    width: 100%;
    min-height: 36px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: #fff;
    color: #333;
    font-size: 13px;
    box-sizing: border-box;
}


/*
 * ------------------------------------------------------------
 * Tom Select
 * ------------------------------------------------------------
 */

.vn-cf7-address,
.ts-wrapper {
    width: 100%;
}


/*
 * Main control.
 */

.ts-control {

    min-height: 36px !important;
    padding:
        8px 12px 12px 8px !important;
    border:
        0px solid #d9d9d9 !important;
    border-radius:
        4px !important;
    background:
        #fff !important;
    color:
        #333 !important;
    font-size:
        13px !important;
    box-shadow:
        none !important;
    transition:
        border-color .2s ease,
        box-shadow .2s ease;

}


/*
 * Focus.
 */

.ts-wrapper.focus
.ts-control {

    border-color:
        #c34104 !important;

    box-shadow:
        0 0 0 2px
        rgba(195, 65, 4, .12) !important;
}


/*
 * Placeholder.
 */

.ts-control
.input-placeholder {

    color:
        #999 !important;
}


/*
 * Dropdown.
 */

.ts-dropdown {

    border:
        1px solid #ddd !important;

    border-radius:
        4px !important;

    box-shadow:
        0 8px 25px
        rgba(0, 0, 0, .12) !important;

    overflow:
        hidden;

    z-index:
        99999 !important;

}


/*
 * Search input.
 */

.ts-dropdown
.dropdown-input {

    width:
        100% !important;

    padding:
        12px 14px !important;

    border:
        0 !important;

    border-bottom:
        1px solid #eee !important;

    font-size:
        12px !important;

    outline:
        none !important;

    box-sizing:
        border-box;
}


/*
 * Options.
 */

.ts-dropdown
.option {

    padding:
        11px 14px !important;

    font-size:
        12px !important;

    line-height:
        1.4;
}


/*
 * Hover option.
 */

.ts-dropdown
.option.active {

    background:
        #f7f7f7 !important;

    color:
        #c34104 !important;
}


/*
 * Selected.
 */

.ts-dropdown
.option.selected {

    background:
        #fff3ed !important;

    color:
        #c34104 !important;

    font-weight:
        600;
}


/*
 * Disabled.
 */

.ts-wrapper.disabled
.ts-control {

    background:
        #f5f5f5 !important;

    color:
        #999 !important;

    cursor:
        not-allowed;
}


/*
 * Loading state.
 */

.vn-cf7-loading {

    opacity:
        .6;
}


/*
 * Error.
 */

.wpcf7-not-valid
.ts-control {

    border-color:
        #dc3232 !important;
}


/*
 * Mobile.
 */

@media (
    max-width: 549px
) {

    .ts-control {

        min-height:
            36px !important;
        font-weight:400;
        padding:
            8px 12px 12px 8px !important;
        font-size:
            12px !important;
    }


    .ts-dropdown
    .option {

        padding:
            8px !important;font-weight:400;
    }

}