﻿.ql-toolbar .ql-picker:not(.ql-color-picker):not(.ql-icon-picker).ql-table-up {
    width: 28px
}

    .ql-toolbar .ql-picker:not(.ql-color-picker):not(.ql-icon-picker).ql-table-up .ql-picker-label {
        padding: 2px 4px
    }

        .ql-toolbar .ql-picker:not(.ql-color-picker):not(.ql-icon-picker).ql-table-up .ql-picker-label svg {
            position: static;
            margin-top: 0
        }

.ql-toolbar .ql-picker.ql-expanded .ql-picker-options {
    z-index: 1
}

.ql-editor .ql-table {
    display: table;
    border-collapse: collapse;
    table-layout: fixed;
    width: auto
}

    .ql-editor .ql-table[data-full] {
        width: 100%
    }

.ql-editor .ql-table-wrapper {
    width: 100%;
    overflow: auto;
    scrollbar-width: none
}

.ql-editor .ql-table-caption {
    position: relative;
    word-break: break-word;
    outline: 0
}

    .ql-editor .ql-table-caption .ql-table-caption--switch {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 2px;
        border-radius: 4px;
        border: 1px solid #0003;
        font-size: 12px;
        cursor: pointer;
        background-color: #fff
    }

        .ql-editor .ql-table-caption .ql-table-caption--switch:hover {
            background-color: #eee
        }

.ql-editor .ql-table-cell {
    padding: 8px 12px;
    border-color: transparent;
    font-size: 14px;
    outline: 0;
    overflow: auto
}

.ql-editor .ql-table-cell-inner {
    display: inline-block;
    min-width: 100%;
    word-break: break-word;
    outline: 0;
    counter-reset: list-0
}

.ql-editor .ql-table col {
    border-collapse: separate;
    text-indent: initial;
    display: table-column;
    table-layout: fixed
}

.ql-editor .ql-table tr + tr td {
    border-top: none
}

.ql-editor .ql-table td {
    border: 1px solid #a1a1aa
}

    .ql-editor .ql-table td + td {
        border-left: none
    }

.table-up-toolbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none
}

    .table-up-toolbox * {
        pointer-events: all
    }

.table-up-tooltip {
    position: absolute;
    z-index: 2000;
    padding: .25rem .75rem;
    border-radius: .25rem;
    font-size: .75rem;
    color: #fff;
    white-space: nowrap;
    background-color: #303133;
    transition: opacity .15s linear
}

    .table-up-tooltip.transparent {
        opacity: 0
    }

    .table-up-tooltip.hidden {
        display: none
    }

.table-up-button {
    --table-btn-color: #606266;
    --table-btn-bg-hover: #f3f4f6;
    --table-btn-color-border: #dcdfe6;
    --table-btn-border: 0.0625rem solid var(--table-btn-color-border);
    --table-btn-confirm-color-border: #409eff;
    --table-btn-confirm-bg: #409eff;
    --table-btn-confirm-hover: #79bbff;
    --table-btn-confirm-outline-focus-visible: 0.125rem solid #a0cfff;
    box-sizing: border-box;
    display: inline-flex;
    height: 2rem;
    line-height: 1;
    margin: 0;
    padding: .5rem 1rem;
    border-radius: .25rem;
    border: var(--table-btn-border);
    color: var(--table-btn-color);
    background-color: transparent;
    font-size: .875rem;
    cursor: pointer
}

    .table-up-button + .table-up-button {
        margin-left: .375rem
    }

    .table-up-button:hover {
        background-color: var(--table-btn-bg-hover)
    }

    .table-up-button.confirm {
        border-color: var(--table-btn-confirm-color-border);
        background-color: var(--table-btn-confirm-bg);
        color: #fff
    }

        .table-up-button.confirm:hover {
            border-color: var(--table-btn-confirm-hover);
            background-color: var(--table-btn-confirm-hover)
        }

        .table-up-button.confirm:focus-visible {
            outline: var(--table-btn-confirm-outline-focus-visible);
            outline-offset: .0625rem
        }

.table-up-dialog {
    --dialog-bg: rgba(0, 0, 0, 0.5);
    --dialog-color-border: #ebeef5;
    --dialog-color-boxshadow: rgba(0, 0, 0, 0.12);
    --dialog-border: 0.0625rem solid var(--dialog-color-border);
    --dialog-boxshadow: 0 0 0.75rem var(--dialog-color-boxshadow);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2000;
    height: 100%;
    background-color: var(--dialog-bg);
    overflow: auto
}

.table-up-dialog__overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1rem;
    overflow: auto;
    text-align: center
}

    .table-up-dialog__overlay::after {
        content: '';
        display: inline-block;
        height: 100%;
        width: 0;
        vertical-align: middle
    }

.table-up-dialog__content {
    display: inline-block;
    max-width: 50vw;
    width: 100%;
    vertical-align: middle;
    background-color: #fff;
    border-radius: .25rem;
    border: var(--dialog-border);
    font-size: 1.125rem;
    box-shadow: var(--dialog-boxshadow);
    text-align: left;
    overflow: hidden;
    box-sizing: border-box
}

.table-up-color-picker {
    --color-picker-bg-color: #ffffff;
    box-sizing: border-box;
    display: inline-flex;
    flex-direction: column;
    width: 16.75rem;
    padding: .5rem;
    border-radius: .375rem;
    background: var(--color-picker-bg-color);
    box-shadow: 0 0 .375rem #b2b5b8
}

.table-up-color-picker__content {
    box-sizing: border-box;
    width: 100%;
    height: 11.75rem;
    padding-top: .5rem
}

.table-up-color-picker__selector {
    width: 14.375rem;
    height: 9.375rem;
    position: absolute
}

.table-up-color-picker__background {
    width: 100%;
    height: 100%;
    background: linear-gradient(to top,#000 0,rgba(0,0,0,0) 100%),linear-gradient(to right,#fff 0,rgba(255,255,255,0) 100%)
}

.table-up-color-picker__background-handle {
    box-sizing: border-box;
    position: absolute;
    border: .0625rem solid #fff;
    cursor: pointer;
    top: 0;
    left: 14.375rem;
    border-radius: 100%;
    width: .625rem;
    height: .625rem;
    transform: translate(-.3125rem,-.3125rem)
}

.table-up-color-picker__hue {
    width: .75rem;
    height: 9.375rem;
    margin-left: 15rem;
    position: absolute;
    background: linear-gradient(0deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)
}

.table-up-color-picker__hue-handle {
    box-sizing: border-box;
    position: absolute;
    border: .0625rem solid #fff;
    cursor: pointer;
    background-color: #fff;
    box-shadow: 0 0 .125rem #0009;
    left: 0;
    width: 1rem;
    height: .625rem;
    transform: translate(-.125rem,-.3125rem)
}

.table-up-color-picker__alpha {
    width: 14.375rem;
    height: .75rem;
    position: absolute;
    margin-top: 10rem;
    background: linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(135deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(135deg,transparent 75%,#ccc 75%);
    background-size: .75rem .75rem;
    background-position: 0 0,.375rem 0,.375rem -.375rem,0 .375rem
}

.table-up-color-picker__alpha-bg {
    position: relative;
    height: 100%;
    background: linear-gradient(to right,rgba(255,255,255,0) 0,#fff 100%)
}

.table-up-color-picker__alpha-handle {
    box-sizing: border-box;
    position: absolute;
    border: .0625rem solid #fff;
    cursor: pointer;
    background-color: #fff;
    box-shadow: 0 0 .125rem #0009;
    top: 0;
    width: .625rem;
    height: 1rem;
    transform: translate(-.3125rem,-.125rem)
}

.table-up-color-picker__action {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: .375rem;
    width: 100%;
    padding-top: .5rem;
    border-top: .0625rem solid #e9ecef
}

.table-up-color-picker__action-item {
    flex: 1;
    display: inline-flex;
    align-items: center;
    font-size: .75rem
}

.table-up-color-picker__input {
    box-sizing: border-box;
    width: 100%;
    height: 1.375rem;
    margin-left: .125rem;
    padding: .125rem 0 .125rem .25rem;
    background-color: #fff;
    border: .0625rem solid #ced4da;
    border-radius: .25rem;
    outline: 0;
    color: #405057
}

.table-up-tooltip .table-up-color-picker {
    --color-picker-bg-color: transparent;
    box-shadow: none;
    width: 15.75rem;
    padding: .5rem 0
}

.ql-container .table-up-selection {
    --select-color: #0589f340;
    display: none;
    position: absolute;
    overflow: hidden;
    pointer-events: none;
    z-index: -1
}

.ql-container .table-up-selection__line {
    position: absolute;
    background-color: var(--select-color);
    pointer-events: none
}

.table-up-resize-line__col, .table-up-resize-line__row {
    position: absolute;
    z-index: 0
}

    .table-up-resize-line__col.is-hidden, .table-up-resize-line__row.is-hidden {
        display: none
    }

    .table-up-resize-line__col::after, .table-up-resize-line__col::before, .table-up-resize-line__row::after, .table-up-resize-line__row::before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        z-index: 1
    }

.table-up-resize-line__row {
    height: .0625rem;
    cursor: ns-resize
}

    .table-up-resize-line__row::after, .table-up-resize-line__row::before {
        width: 100%;
        height: .5rem
    }

    .table-up-resize-line__row::before {
        transform: translateY(-.5rem)
    }

.table-up-resize-line__col {
    width: .0625rem;
    cursor: ew-resize
}

    .table-up-resize-line__col::after, .table-up-resize-line__col::before {
        height: 100%;
        width: .5rem
    }

    .table-up-resize-line__col::before {
        transform: translateX(-.5rem)
    }

.table-up-resize-box {
    position: absolute;
    z-index: 0
}

    .table-up-resize-box.is-hidden {
        display: none
    }

    .table-up-resize-box.is-caption-bottom .table-up-resize-box__corner {
        border-top-width: 0;
        border-bottom-width: .0625rem;
        border-top-left-radius: 0;
        border-bottom-left-radius: 50%
    }

    .table-up-resize-box.is-align-right .table-up-resize-box__col-separator {
        left: -.125rem
    }

    .table-up-resize-box.is-align-right .table-up-resize-box__corner {
        border-left-width: 0;
        border-right-width: .0625rem;
        border-top-left-radius: 0;
        border-top-right-radius: 50%
    }

    .table-up-resize-box.is-align-right.is-caption-bottom .table-up-resize-box__corner {
        border-top-right-radius: 0;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 50%
    }

.table-up-resize-box__col, .table-up-resize-box__row {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden
}

.table-up-resize-box__col-wrapper, .table-up-resize-box__row-wrapper {
    display: flex
}

.table-up-resize-box__col-header, .table-up-resize-box__row-header {
    position: relative;
    flex-shrink: 0;
    background-color: #f3f4f5;
    border: .0625rem solid #ccc
}

.table-up-resize-box__col-wrapper {
    height: 100%
}

.table-up-resize-box__col-header {
    height: 100%;
    cursor: pointer;
    border-right-color: transparent
}

    .table-up-resize-box__col-header:last-child {
        border-right-color: #ccc
    }

.table-up-resize-box__col-separator {
    position: absolute;
    top: 0;
    bottom: 0;
    right: -.125rem;
    width: .125rem;
    cursor: ew-resize;
    z-index: 0
}

    .table-up-resize-box__col-separator::after {
        right: -.375rem
    }

    .table-up-resize-box__col-separator::before {
        left: -.375rem
    }

    .table-up-resize-box__col-separator::after, .table-up-resize-box__col-separator::before {
        content: '';
        position: absolute;
        top: 0;
        display: block;
        width: .5rem;
        height: 100%;
        z-index: 1
    }

.table-up-resize-box__row-wrapper {
    flex-direction: column;
    width: 100%
}

.table-up-resize-box__row-header {
    width: 100%;
    cursor: pointer;
    border-bottom-color: transparent
}

    .table-up-resize-box__row-header:last-child {
        border-bottom-color: #ccc
    }

.table-up-resize-box__row-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -.125rem;
    height: .125rem;
    cursor: ns-resize;
    z-index: 0
}

    .table-up-resize-box__row-separator::after {
        bottom: -.375rem
    }

    .table-up-resize-box__row-separator::before {
        top: -.375rem
    }

    .table-up-resize-box__row-separator::after, .table-up-resize-box__row-separator::before {
        content: '';
        position: absolute;
        left: 0;
        display: block;
        width: 100%;
        height: .5rem;
        z-index: 1
    }

.table-up-resize-box__corner {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #f3f4f5;
    border: .0625rem solid #ccc;
    border-right-width: 0;
    border-bottom-width: 0;
    border-top-left-radius: 50%;
    cursor: pointer
}

.table-up-drag-line {
    position: fixed;
    z-index: 0;
    background-color: #409eff
}

    .table-up-drag-line.is-col {
        width: .125rem;
        cursor: ew-resize
    }

    .table-up-drag-line.is-row {
        height: .125rem;
        cursor: ns-resize
    }

.table-up-scale {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    pointer-events: none
}

.table-up-scale__block {
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-100%,-100%);
    width: .75rem;
    height: .75rem;
    background-color: #f1f5f9;
    border: .0625rem solid grey;
    cursor: nwse-resize;
    pointer-events: all
}

.table-up-scale.is-align-right .table-up-scale__block {
    cursor: nesw-resize
}

.table-up-scale.is-hidden {
    display: none
}

.table-up-scrollbar {
    position: absolute;
    z-index: 1;
    transition: opacity .15s linear
}

.table-up-scrollbar__container {
    position: relative
}

.table-up-scrollbar.is-transparent {
    opacity: 0
}

.table-up-scrollbar.is-vertical {
    top: .125rem;
    bottom: .125rem;
    left: -.5rem;
    width: .375rem
}

    .table-up-scrollbar.is-vertical .table-up-scrollbar__thumb {
        width: 100%
    }

.table-up-scrollbar.is-horizontal {
    bottom: .125rem;
    left: .125rem;
    right: .125rem;
    height: .375rem
}

    .table-up-scrollbar.is-horizontal .table-up-scrollbar__thumb {
        height: 100%
    }

.table-up-scrollbar__thumb {
    border-radius: .3125rem;
    background-color: #d2d2d2;
    cursor: pointer
}

    .table-up-scrollbar__thumb:hover {
        background-color: #a1a1aa
    }

.table-up-scrollbar--origin.ql-container .ql-table-wrapper {
    scrollbar-width: inherit
}

.table-up-align, .table-up-menu {
    position: absolute;
    z-index: 1;
    display: none;
    align-items: center;
    padding: .25rem;
    border-radius: .375rem;
    box-shadow: 0 0 .5rem rgba(0,0,0,.5);
    background-color: #fff;
    font-size: .875rem
}

.table-up-align__item, .table-up-menu__item {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .25rem;
    border-radius: .25rem;
    cursor: pointer
}

    .table-up-align__item:hover, .table-up-menu__item:hover {
        background-color: #eee
    }

    .table-up-align__item.is-break, .table-up-menu__item.is-break {
        align-self: stretch;
        width: .0625rem;
        padding: 0;
        margin: .125rem .25rem;
        background-color: #a3a3a3;
        cursor: default
    }

.table-up-align .icon, .table-up-menu .icon {
    display: flex;
    flex-shrink: 0;
    font-size: 1.25rem
}

.table-up-align span, .table-up-menu span {
    text-wrap: nowrap
}

.table-up-menu.is-contextmenu {
    flex-direction: column;
    padding: .25rem .5rem;
    max-height: 21.875rem;
    overflow-y: auto;
    overflow-x: hidden
}

    .table-up-menu.is-contextmenu .table-up-menu__item {
        display: flex;
        justify-content: flex-start;
        width: 100%;
        gap: .25rem;
        cursor: pointer
    }

    .table-up-menu.is-contextmenu .is-break {
        width: 100%;
        height: .0625rem;
        flex-shrink: 0;
        margin: .25rem 0;
        background-color: #a3a3a3
    }

.table-up-align--active {
    display: flex
}

.table-up-align .icon {
    width: 1.25rem;
    height: 1.25rem
}

.table-up-color-map {
    display: flex;
    flex-direction: column
}

.table-up-color-map--used {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row-reverse;
    margin-top: .25rem;
    padding-top: .25rem;
    border-top: .0625rem solid #ccc
}

.table-up-color-map__content {
    display: flex;
    flex-direction: column
}

.table-up-color-map__content-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .25rem
}

.table-up-color-map__item {
    width: .875rem;
    height: .875rem;
    margin: .125rem;
    border: .0625rem solid #a3a3a3;
    cursor: pointer
}

.table-up-color-map__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    height: 1.25rem;
    padding: 0 .375rem;
    color: #303133;
    background-color: #fff;
    cursor: pointer
}

    .table-up-color-map__btn:hover {
        background-color: #edeeef
    }

.table-up-input__item {
    --input-height: 2rem;
    --input-inner-height: calc(var(--input-height) - 0.125rem);
    --input-color-text: #606266;
    --input-color-boxshaow: #dcdfe6;
    --input-color-focus: #409eff;
    --input-color-error: #f56c6c;
    --input-boxshaow: 0 0 0 0.0625rem var(--input-color-boxshaow) inset;
    --input-boxshaow-focus: 0 0 0 0.0625rem var(--input-color-focus) inset;
    --input-boxshaow-error: 0 0 0 0.0625rem var(--input-color-error) inset;
    display: flex;
    align-items: center
}

    .table-up-input__item + .table-up-input__item {
        margin-top: 1.125rem
    }

.table-up-input__label {
    width: 5rem;
    flex-shrink: 0
}

.table-up-input__input {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: var(--input-height);
    line-height: var(--input-height);
    padding: .0625rem .5rem;
    border-radius: .25rem;
    box-shadow: var(--input-boxshaow);
    transition: box-shadow .2s linear
}

    .table-up-input__input.focus {
        box-shadow: var(--input-boxshaow-focus)
    }

    .table-up-input__input input {
        width: 100%;
        height: var(--input-inner-height);
        line-height: var(--input-inner-height);
        flex-grow: 1;
        font-size: .875rem;
        color: var(--input-color-text);
        outline: 0;
        border: 0;
        padding: 0
    }

    .table-up-input__input.error {
        box-shadow: var(--input-boxshaow-error)
    }

.table-up-input__error-tip {
    position: absolute;
    top: 100%;
    left: 0;
    font-size: .75rem;
    color: var(--input-color-error);
    line-height: 1rem
}

.ql-snow .table-up-select-box {
    --select-box-color-bg-hover: #f5f5f5;
    --select-box-color-bg-active: #e0f2fe;
    --select-box-custom-color-text: #0d0d0d;
    --select-box-custom-color-bg: transparent;
    --select-box-custom-color-bg-hover: #ebebeb
}

.table-up-select-box {
    --select-box-color-border: #e5e7eb;
    --select-box-border: 0.0625rem solid var(--select-box-color-border);
    --select-box-color-active: #0ea5e9;
    --select-box-color-bg-hover: #f5f5f5;
    --select-box-color-bg-active: transparent;
    --select-box-custom-color-text: #f5f5f5;
    --select-box-custom-color-bg: transparent;
    --select-box-custom-color-bg-hover: #2c2c2c
}

.table-up-select-box__block {
    display: flex;
    width: 10rem;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center
}

.table-up-select-box__item {
    margin: .125rem;
    height: 1rem;
    width: 1rem;
    border: var(--select-box-border)
}

    .table-up-select-box__item.active {
        border-color: var(--select-box-color-active);
        background-color: var(--select-box-color-bg-active)
    }

.table-up-select-box__custom {
    padding: .5rem;
    color: var(--select-box-custom-color-text);
    background-color: var(--select-box-custom-color-bg);
    font-size: 1rem;
    text-align: center;
    cursor: pointer
}

    .table-up-select-box__custom:hover {
        background-color: var(--select-box-custom-color-bg-hover)
    }

.table-up-creator {
    padding: 1.5rem
}

.table-up-creator__input {
    display: flex;
    flex-direction: column;
    width: 100%
}

.table-up-creator__control {
    margin-top: 1rem;
    text-align: right
}

.table-up-creator__checkbox {
    --check-color: #212121;
    --checked-color: #506eec;
    display: flex;
    align-items: center;
    margin-top: .25rem;
    cursor: pointer;
    font-size: .75rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

    .table-up-creator__checkbox input {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        width: 1.125rem;
        height: 1.125rem;
        border: .0625rem solid var(--check-color);
        border-radius: .3125rem;
        background-color: transparent;
        display: inline-block;
        position: relative;
        margin-right: .625rem;
        cursor: pointer
    }

        .table-up-creator__checkbox input:before {
            content: '';
            background-color: var(--checked-color);
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%) scale(0);
            width: .625rem;
            height: .625rem;
            border-radius: .1875rem;
            transition: all .2s ease-in-out
        }

        .table-up-creator__checkbox input:checked:before {
            transform: translate(-50%,-50%) scale(1)
        }
