@import "../../../styles/variables.less";

.@{gbc-prefix}-import{
    font-size: @gbc-import-font-size;
    color: @gbc-import-color;
    &-modal{
        max-width: 430px;
        .@{grc-prefix}-modal{
            &-body{
                padding-top: @gbc-import-modal-padding-top;
            }
            &-footer{
                text-align: center;
                border-top: none;
                padding-bottom: @gbc-import-modal-padding-bottom;
            }
        }
    }
    &-upload{
        position: relative;
        width: 100%;
        cursor: pointer;
        &_inner{
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            min-height: @gbc-import-upload-height;
            background: @gbc-import-upload-bg;
            border: 1px dashed  @border-color-base;
        }
        &_icon{
            font-size: @gbc-import-upload-icon-size;
            color: @gbc-import-upload-icon-color;
        }
        input[type="file"]{
            width: 100%;
            cursor: pointer;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            opacity: 0;
        }
    }
    &-result{
        color: @gbc-import-result-color;
        &_header,
        &_body{
            display: flex;
            align-items: center;
            flex-direction: column;
        }
        &_header{
            font-size: @gbc-import-result-icon-font-size;
        }
        &_title{
            font-size: @gbc-import-result-title-font-size;
            margin: @gbc-import-result-title-margin;
        }
        &_tip{
            color: @gbc-import-result-tip-color;
            margin: @gbc-import-result-tip-margin;
        }
        &_footer{
            display: flex;
            align-items: center;
            height: @gbc-import-result-footer-height;
            background-color: @gbc-import-result-footer-bg;
            padding: @gbc-import-result-footer-padding;
            margin: @gbc-import-result-footer-margin;
            >span{
                display: inline-block;
                margin-left: 5px;
            }
        }
    }
    &-fail{
        &_header,
        &_tip{
            color: @gbc-import-fail-color;
        }
        &_footer{
            border: 1px solid @gbc-import-fail-color;
        }
        .@{grc-prefix}-table{
            margin-top: 10px;
            box-sizing: content-box;
            &-header{
                margin-bottom: 0!important;
                padding-bottom: 0!important;
                overflow: auto !important;
            }
            &-thead>tr>th{
                font-weight: normal;
                background-color: @gbc-import-table-header-bg;
            }
            &-thead>tr>th,
            &-tbody>tr>td{
                padding: @gbc-import-table-ceil-padding-verticle @gbc-import-table-ceil-padding-horizontal;
                border-bottom: none;
            }
            &-tbody>tr:nth-of-type(2n){
                background-color: @gbc-import-table-tbody-even-bg;
            }
        }
    }
    &-success{
        &_header{
            color: @gbc-import-success-color;
        }
    }
}