@import '../node_modules/ac-btns/src/Btns.scss';
$border-color: #d9d9d9;
$border-hover-color: #505766;
$font-size: 12px;
.ac-search-cn {
    // border-bottom: 1px solid #D0D0D0;
    &-ctns-out {
        padding-left: 16px;
        padding-right: 16px;
        background-color: #fff;
    }

    &-ctns {
        display: flex;
        justify-content: space-between;
        &.close {
            .ac-search-cn-ctn {
                :not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)) {
                    display: none;
                } 
            }
        }
    }

    &-ctn {
        width: calc(100% - 90px);
        display: inline-block;
    }

    &-formitem {
        width: calc(100% / 3);
        padding-right: 8px;
        display: inline-block;
        margin-bottom: 12px;
        position: relative;
        vertical-align: bottom;
        .u-row{
            display: flex;
            align-items: center;
            margin: 0;
        }
        .input-control{
            width: calc(100% - 100px);
        }
        .u-form-control{
            padding: 0 8px;
        }
        .u-select .u-select-selection-rendered{
            margin-left: 0;
            margin-right: 0;
        }
        input,
        .u-select .u-select-selection,
        .u-input-number,.u-input-number.u-input-group>span:first-child,.u-input-number.u-input-group>span:last-child {
            border-color: $border-color;
        }
        .datepicker-input-group.u-input-group:hover > input,
        .calendar-picker.u-input-group:hover>input,
        .u-form-control:hover,.u-select-enabled .u-select-selection:hover,.u-input-number:hover{
            border-color: $border-hover-color;
        }
        .u-form-control:active,.u-select .u-select-selection:active,.u-input-number:active,
        .u-form-control:focus,.u-select .u-select-selection:focus,.u-input-number:focus{
            border-color: $border-hover-color;
        }
        .u-select .u-select-arrow,.datepicker-container .u-input-group-btn,.datepicker-input-group .u-input-group-btn,
        .u-input-number.u-input-group > span:first-child,.u-input-number.u-input-group > span:last-child,
        .u-input-group.simple .u-input-group-btn{
            color: #adb4bc;
        }
        .u-select .u-select-arrow,.u-input-group.simple .u-input-group-btn{
            right: 8px;
        }
        .u-select-selection-placeholder, .u-select-search-field-placeholder{
            left: 8px;
        }
        .u-select-selection--single .u-select-selection-selected-value{
            padding-left: 8px;
        }

        .u-label {
            display: inline-block;
            width: 140px;
            padding-left: 15px;
            padding-right: 10px;
            text-align: right;
            font-size: $font-size;
            color: #111111;
            .uf-mi.mast {
                padding: 0;
                color: #ff0000;
            }
        }

        &-mast {
            position: absolute;
            color: #ff0000;
            z-index: 2;
            top: 8px;
            left: 4px;
        }

        .datepicker-input-group .u-form-control {
            float: unset;
        }

        .ref-input-wrap {
            width: 100% !important;
        }

        .u-input-number.u-input-group.simple {
            display: inline-block;

            .u-form-control {
                float: unset;
                height: 30px;
            }

            .u-input-group-btn {
                position: absolute;
                right: 2px;

                .icon-group {
                    height: 30px;
                }
            }
        }

        
        .u-input-number-group {
            display: flex;
            justify-content: space-between;
            .u-input-number-group-split {
                position: unset;
                line-height: 32px;
            }

            .u-input-number.u-input-group .u-form-control {
                padding-right: 12px;
                border-bottom-right-radius: 3px;
                border-top-right-radius: 3px;
                border-bottom-left-radius: 3px;
                border-top-left-radius: 3px;
                text-align: left;
            }

            .u-input-group-btn {
                display: none;
            }

            .u-input-group-addon {
                display: none;
            }
        }
        
        &-value {
            padding-right: 10px;
            position: absolute;
            z-index: 2;
            top: -28px;
            width: 100%;
            text-align: center;
            display: block;
            pointer-events: none;

            &-text {
                padding: 5px 10px;
                border-radius: 4px;
                background: #fff;
                box-shadow: 1px 1px 10px px rgba(0, 0, 0, 0.3);
                pointer-events: all;
                font-size: $font-size;
                word-break: break-all;

                &.top {
                    text-align: left;
                    display: block;
                }
            }
        }
        
        .ncc-refer-container .refer-wrapper .refer-wrapper-content{
            height: 32px;
        }

        .container-refer {
            //参照
            height: 32px;

            input {
                font-size: 14px;
                color: #424242;
                border: 1px solid #d5d6d9;
                padding: 0 7px;
            }

            .ant-input-suffix {
                color: #d5d6d9;
            }
        }

        //禁用状态
        .u-form-control[disabled] {
            background: #f3f3f3;
            border-color: #e0e0e0;
            color: #2B344B !important;
        }

        .u-select-disabled {
            .u-select-selection {
                background: #f3f3f3;
                border-color: #e0e0e0;
                color: #2B344B;
            }
        }

        input::-webkit-input-placeholder {
            color: #cccccc !important;
            font-size: $font-size;
        }

        .u-select-selection-placeholder,
        .u-select-search-field-placeholder {
            color: #cccccc;
            font-size: $font-size;
        }
    }

    &-btns {
        width: 130px;
        display: inline-block;
        height: 32px;
        display: flex;
        justify-content: flex-end;
        align-self: flex-end;
        margin-bottom: 8px;
        margin-right: 0;
        .u-button {
            padding: 0;
            min-width: auto;
        }
        & &-reset-ys {
            line-height: 32px;
        }
    }

    &-open {
        float: right;
        cursor: pointer;
        color: #9FABBF;
        user-select: none;
        font-size: 12px;
        line-height: 32px;

        .uf {
            color: #505766;
            padding: 0 2px;
            margin-left: 5px;
            font-size: 14px;
        }
    }

    &-header {
        padding-top: 8px;
        padding-bottom: 8px;
        padding-left: 16px;
        padding-right: 16px;
        background-color: #fff;
        min-height: 40px;
    }

    &-case {
        font-size: 14px;

        &-list {
            .u-dropdown-menu-item {
                padding: 0 24px !important;
            }
        }
    }

    &-selected {
        color: #0073e1;
        margin-left: 24px;
        cursor: pointer;
    }

    &-selected-data {
        width: calc(100% - 250px);
        display: inline-block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1;
        position: relative;
        top: 2px;
        padding-left: 20px;
    }

    &-selected-sample {
        font-size: $font-size;
        cursor: pointer;
    }

    &-selected-complex {
        &-item {
            line-height: 15px;
            font-size: $font-size;

            &-title {
                margin-left: 8px;
                width: 65px;
                min-height: 15px;
                color: #555;
                text-align: right;
                word-break: break-all;
                word-wrap: break-word;
            }

            &-ctn {
                width: 260px;
                color: #111;
                margin-left: 12px;
                word-break: normal;
                word-wrap: break-word;
            }
        }
    }
}

//参照样式
// .ncc-refer-model.ant-modal.referModal{
//     .columnSetting{
//         background: #eceff5;
//         .SettingBtn,.SettingBtn:hover{
//             background: #eceff5;
//         }
//     }
//     .pagination-new .ant-pagination.mini{
//         text-align: center;
//     }
//     .ant-modal-footer{
//         padding: 7px 20px;
//         .refer-footer-btns-container{
//             button.ant-btn-primary{
//                 border: 1px solid #e14c46;
//             }
//             .refer-modal-footer-cancle-btn{
//                 margin-left: 8px;
//             }
//         }
       
//     }
// }