/* ------------------------------------------- editor ------------------------------------------- */

.fa-cron-react-editor-main {
    border: 1px solid #ccc;
    font: 14px Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
    width: 820px;
}

.fa-cron-react-editor-main input[type="radio" i] {
    margin: 4px;
}

.fa-cron-react-editor-main input[type="checkbox" i] {
    margin: 4px;
}

.fa-cron-react-editor-main input {
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    background-color: #fff;
    border-radius: 2px;
    padding-left: 10px;
    border: 1px solid #e6e6e6;
}

.fa-cron-react-editor-content {
    margin: 12px; 
    height: 360px;
}

.fa-cron-react-editor-content input {
    margin: 0 6px;
}

/* ------------------------------------------- tab ------------------------------------------- */

.fa-cron-react-editor-tab {
    display: flex;
    background-color: #EEE;
}

.fa-cron-react-editor-tab-item,
.fa-cron-react-editor-tab-item-active {
    cursor: pointer;
    transition: all ease-in-out 0.3s;
    background-color: #EEE;
    width: 90px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fa-cron-react-editor-tab-item-active {
    background-color: #FFF;
}


/* ------------------------------------------- tab ------------------------------------------- */


/* ------------------------------------------- lablel ------------------------------------------- */

.fa-cron-react-editor-lablel-title {
    font-size: 10px;
    color: #FFF;
    background-color: #429fff;
    width: 80px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fa-cron-react-editor-lablel-value {
    font-size: 14px;
    color: #43a6fe;
    background-color: #eeeeee;
    width: 80px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* ------------------------------------------- panel ------------------------------------------- */

.fa-cron-react-editor-flex-row-center {
    display: flex;
    align-items: center;
}

.fa-cron-react-editor-panel-item {
    display: flex;
    align-items: center;
    padding-bottom: 12px;
}

.fa-cron-react-editor-panel-label {
    cursor: pointer;
    display: flex;
    align-items: center;
}

.fa-cron-react-editor-input {
    width: 50px;
}

.fa-cron-react-editor-panel-checkbox-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 600px;
}

/* ------------------------------------------- checkbox ------------------------------------------- */
.fa-cron-react-editor-checkbox {
    cursor: pointer;
    margin: 4px 0;
    display: flex;
    align-items: center;
}

.fa-cron-react-editor-checkbox i {
    right: auto;
    left: 0;
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: 12px;
    border-radius: 2px;
    -webkit-transition: .1s linear;
    transition: .1s linear;
    margin-right: 6px;
}

.fa-cron-react-editor-checkbox:hover i {
    border: 1px solid #43a6fe;
}

.fa-cron-react-editor-checkbox-icon-not {
    border: 1px solid #d2d2d2;
    background-color: #fff;
}

.fa-cron-react-editor-checkbox-icon-ok {
    border: 1px solid #43a6fe;
    background-color: #43a6fe;
    color: #FFF;
}

.fa-cron-react-editor-checkbox-icon-ok::before {
    content: url(./assets/icon_check.svg);
    /* margin: 1px; */
}

/* ------------------------------------------- radio ------------------------------------------- */
.fa-cron-react-editor-radio {
    cursor: pointer;
    margin: 4px;
    display: flex;
    align-items: center;
}

.fa-cron-react-editor-radio-round, .fa-cron-react-editor-radio-round-checked {
    width: 16px;
    height: 16px;
    border: 1px solid #999;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-transition: .1s linear;
    transition: .1s linear;
    margin-right: 6px;
}

.fa-cron-react-editor-radio-round-checked {
    border: 1px solid #43a6fe;
}

.fa-cron-react-editor-radio-point, .fa-cron-react-editor-radio-point-checked {
    width: 0;
    height: 0;
    background-color: #43a6fe;
    border-radius: 4px;
    -webkit-transition: .1s linear;
    transition: .1s linear;
}

.fa-cron-react-editor-radio-point-checked {
    width: 8px;
    height: 8px;
}