.lbiz-area-cascader {
    width: 100%
}

.lbiz-checkbox-group {
    width: 100%
}

.l-button {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    z-index: 0;
    overflow: hidden;
    font-size: var(--td-font-body-medium);
    outline: none;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
    background-color: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    white-space: nowrap;
    border-radius: var(--td-radius-default);
    transition: all .2s linear;
    touch-action: manipulation;
    text-decoration: none
}

.l-button--variant-base .l-icon,
.l-button--variant-base .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-outline .l-icon,
.l-button--variant-outline .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-dashed .l-icon,
.l-button--variant-dashed .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-text .l-icon,
.l-button--variant-text .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button.l-size-s .l-icon,
.l-button.l-size-s .l-loading {
    font-size: var(--td-font-size-body-medium)
}

.l-button.l-size-l .l-icon,
.l-button.l-size-l .l-loading {
    font-size: var(--td-font-size-title-large)
}

.l-popup__arrow {
    position: absolute;
    z-index: 1;
    width: 8px;
    height: 8px
}

.l-popup__arrow:before {
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    transform: rotate(45deg);
    background: var(--td-bg-color-container)
}

.l-popup[data-popper-placement=top-start] .l-popup__arrow {
    left: 8px
}

.l-popup[data-popper-placement=top] .l-popup__arrow {
    left: 50%;
    margin-left: -4px
}

.l-popup[data-popper-placement=top-end] .l-popup__arrow {
    left: calc(100% - 16px)
}

.l-popup[data-popper-placement^=bottom] .l-popup__arrow {
    top: -4px
}

.l-popup[data-popper-placement=bottom-start] .l-popup__arrow {
    left: 8px
}

.l-popup[data-popper-placement=bottom] .l-popup__arrow {
    left: 50%;
    margin-left: -4px
}

.l-popup[data-popper-placement=bottom-end] .l-popup__arrow {
    left: calc(100% - 16px)
}

.l-popup[data-popper-placement^=left] .l-popup__arrow {
    right: -4px
}

.l-popup[data-popper-placement=left-start] .l-popup__arrow {
    top: 8px
}

.l-popup[data-popper-placement=left] .l-popup__arrow {
    top: 50%;
    margin-top: -4px
}

.l-popup[data-popper-placement=left-end] .l-popup__arrow {
    top: calc(100% - 16px)
}

.l-popup[data-popper-placement^=right] .l-popup__arrow {
    left: -4px
}

.l-popup[data-popper-placement=right-start] .l-popup__arrow {
    top: 8px
}

.l-popup[data-popper-placement=right] .l-popup__arrow {
    top: 50%;
    margin-top: -4px
}

.l-popup[data-popper-placement=right-end] .l-popup__arrow {
    top: calc(100% - 16px)
}

.l-popup--animation-expand-enter-active[data-popper-placement^=top] {
    animation: t-popup-animation-expand-in-top .2s cubic-bezier(.38, 0, .24, 1), t-fade-in .2s linear
}

.l-popup--animation-expand-leave-active[data-popper-placement^=top] {
    animation: t-popup-animation-expand-out-top .2s cubic-bezier(.38, 0, .24, 1), t-fade-out .2s cubic-bezier(0, 0, .15, 1)
}

.l-popup--animation-expand-enter-active[data-popper-placement^=bottom] {
    animation: t-popup-animation-expand-in-bottom .2s cubic-bezier(.38, 0, .24, 1), t-fade-in .2s linear
}

.l-popup--animation-expand-leave-active[data-popper-placement^=bottom] {
    animation: t-popup-animation-expand-out-bottom .2s cubic-bezier(.38, 0, .24, 1), t-fade-out .2s cubic-bezier(0, 0, .15, 1)
}

.l-tabs__operations {
    display: flex;
    flex-direction: row;
    position: absolute;
    border-bottom: 1px solid var(--td-component-stroke);
    background-color: var(--td-bg-color-container)
}

.l-head-menu .l-menu__item {
    height: var(--td-comp-size-m);
    line-height: var(--td-comp-size-m);
    padding: 0 var(--td-comp-paddingLR-l);
    justify-content: center;
    transition: all .28s cubic-bezier(.645, .045, .355, 1);
    gap: var(--td-comp-margin-m)
}

.l-tag-input--max-rows .l-input {
    max-height: calc(var(--max-rows, 1) * (var(--td-comp-size-m) - 2px));
    overflow-y: scroll
}

.l-tag-input--max-rows .l-input.l-size-s {
    max-height: calc(var(--max-rows, 1) * var(--td-comp-size-xs))
}

.l-tag-input--max-rows .l-input.l-size-l {
    max-height: calc(var(--max-rows, 1) * (var(--td-comp-size-xl) - 2px))
}

.l-auto-complete__panel--empty {
    height: var(--td-comp-size-m);
    line-height: var(--td-comp-size-m);
    color: var(--td-text-color-disabled);
    text-align: center
}

.l-date-picker__header-controller .l-date-picker__header-controller-month {
    width: 80px;
    display: flex
}

.l-date-picker__header-controller .l-date-picker__header-controller-year {
    width: 78px;
    display: flex
}

.l-date-picker__table table th,
.l-date-picker__table table th.l-date-picker__table-header-cell,
.l-date-picker__table table td.l-date-picker__cell {
    padding: 0;
    border: 0;
    line-height: var(--td-line-height-body-medium)
}

.l-date-picker__panel-year,
.l-date-picker__panel-month,
.l-date-picker__panel-quarter,
.l-date-picker__panel-week,
.l-date-picker__panel-date {
    display: flex;
    flex-direction: column;
    padding: var(--td-pop-padding-xl);
    gap: var(--td-comp-margin-m);
    width: 280px;
    box-sizing: border-box
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-input .l-icon,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select .l-icon,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button .l-icon,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader .l-icon,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-range-input .l-icon,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner .l-icon,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-input .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-range-input .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner .l-fake-arrow {
    color: var(--td-success-color)
}

.l-is-warning .l-form__controls-content .l-input .l-icon,
.l-is-warning .l-form__controls-content .l-select .l-icon,
.l-is-warning .l-form__controls-content .l-radio-button .l-icon,
.l-is-warning .l-form__controls-content .l-cascader .l-icon,
.l-is-warning .l-form__controls-content .l-range-input .l-icon,
.l-is-warning .l-form__controls-content .l-textarea__inner .l-icon,
.l-is-warning .l-form__controls-content .l-input .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-select .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-radio-button .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-cascader .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-range-input .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-textarea__inner .l-fake-arrow {
    color: var(--td-warning-color)
}

.l-is-error .l-form__controls-content .l-input .l-icon,
.l-is-error .l-form__controls-content .l-select .l-icon,
.l-is-error .l-form__controls-content .l-radio-button .l-icon,
.l-is-error .l-form__controls-content .l-cascader .l-icon,
.l-is-error .l-form__controls-content .l-range-input .l-icon,
.l-is-error .l-form__controls-content .l-textarea__inner .l-icon,
.l-is-error .l-form__controls-content .l-input .l-fake-arrow,
.l-is-error .l-form__controls-content .l-select .l-fake-arrow,
.l-is-error .l-form__controls-content .l-radio-button .l-fake-arrow,
.l-is-error .l-form__controls-content .l-cascader .l-fake-arrow,
.l-is-error .l-form__controls-content .l-range-input .l-fake-arrow,
.l-is-error .l-form__controls-content .l-textarea__inner .l-fake-arrow {
    color: var(--td-error-color)
}

.l-color-picker.l-popup__content {
    box-shadow: var(--td-shadow-2), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left)
}

.l-color-picker__format-mode-select .l-select,
.l-color-picker__format-mode-select .l-input {
    padding-right: 0
}

.l-color-picker__format-mode-select .l-input--prefix>.l-input__suffix {
    padding-left: 0
}

.l-color-picker__format-mode-select .l-select__right-icon {
    margin-right: var(--td-comp-margin-xs)
}

.l-image-viewer-preview-image.l-is-hide {
    animation: .2s cubic-bezier(0, 0, .15, 1) modal-mask-hide forwards
}

.l-image-viewer-preview-image.l-is-hide .l-image-viewer__modal-pic .l-image-viewer__modal-box {
    animation: .2s cubic-bezier(0, 0, .15, 1) modal-image-hide forwards
}

.l-popconfirm.l-popup[data-popper-placement^=top] .l-popup__arrow {
    bottom: -4px
}

.ldesign-defaultpage__content {
    background-color: var(--ldesign-page-background, var(--desktop-layout-panel-background, var(--td-bg-color-container)));
    border-radius: var(--layout-radius);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: inherit;
    width: 100%;
    box-sizing: border-box;
    padding: calc(var(--desktop-layout-padding, var(--td-comp-paddingTB-l)) * 2);
    gap: var(--td-comp-margin-s)
}

.ldesign-popup__title {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    margin: 0
}

.ldesign-logo.has-logo {
    gap: 6px
}

.ldesign-page {
    --ldesign-page-padding: var(--desktop-layout-padding, var(--td-comp-paddingLR-m));
    --ldesign-page-radius: var(--desktop-layout-radius, var(--td-radius-medium));
    background-color: var(--ldesign-page-background, var(--desktop-layout-panel-background, var(--td-bg-color-container)));
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: var(--ldesign-page-radius);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    flex-grow: 1;
    overflow: hidden;
    transition: var(--desktop-layout-transition)
}

.lbiz-form {
    width: 100%
}

.lbiz-Org-tree,
.lbiz-pop-frame {
    display: block
}

.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
    clear: both;
    content: "";
    display: table
}

.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    padding: 3px 5px;
    width: 28px
}

.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
    float: left;
    height: 100%
}

.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
    outline: none
}

.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
    display: none
}

.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
    color: #06c
}

.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
    fill: #06c
}

.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
    stroke: #06c
}

@media (pointer:coarse) {

    .ql-snow.ql-toolbar button:hover:not(.ql-active),
    .ql-snow .ql-toolbar button:hover:not(.ql-active) {
        color: #444
    }

    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
        fill: #444
    }

    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
        stroke: #444
    }
}

.ql-snow,
.ql-snow * {
    box-sizing: border-box
}

.ql-snow .ql-hidden {
    display: none
}

.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
    visibility: hidden
}

.ql-snow .ql-tooltip {
    position: absolute;
    transform: translateY(10px)
}

.ql-snow .ql-tooltip a {
    cursor: pointer;
    text-decoration: none
}

.ql-snow .ql-tooltip.ql-flip {
    transform: translateY(-10px)
}

.ql-snow .ql-formats {
    display: inline-block;
    vertical-align: middle
}

.ql-snow .ql-formats:after {
    clear: both;
    content: "";
    display: table
}

.ql-snow .ql-stroke {
    fill: none;
    stroke: #444;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2
}

.ql-snow .ql-stroke-miter {
    fill: none;
    stroke: #444;
    stroke-miterlimit: 10;
    stroke-width: 2
}

.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
    fill: #444
}

.ql-snow .ql-empty {
    fill: none
}

.ql-snow .ql-even {
    fill-rule: evenodd
}

.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
    stroke-width: 1
}

.ql-snow .ql-transparent {
    opacity: .4
}

.ql-snow .ql-direction svg:last-child {
    display: none
}

.ql-snow .ql-direction.ql-active svg:last-child {
    display: inline
}

.ql-snow .ql-direction.ql-active svg:first-child {
    display: none
}

.ql-snow .ql-editor h1 {
    font-size: 2em
}

.ql-snow .ql-editor h2 {
    font-size: 1.5em
}

.ql-snow .ql-editor h3 {
    font-size: 1.17em
}

.ql-snow .ql-editor h4 {
    font-size: 1em
}

.ql-snow .ql-editor h5 {
    font-size: .83em
}

.ql-snow .ql-editor h6 {
    font-size: .67em
}

.ql-snow .ql-editor a {
    text-decoration: underline
}

.ql-snow .ql-editor blockquote {
    border-left: 4px solid #ccc;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 16px
}

.ql-snow .ql-editor code,
.ql-snow .ql-editor .ql-code-block-container {
    background-color: #f0f0f0;
    border-radius: 3px
}

.ql-snow .ql-editor .ql-code-block-container {
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 5px 10px
}

.ql-snow .ql-editor code {
    font-size: 85%;
    padding: 2px 4px
}

.ql-snow .ql-editor .ql-code-block-container {
    background-color: #23241f;
    color: #f8f8f2;
    overflow: visible
}

.ql-snow .ql-editor img {
    max-width: 100%
}

.ql-snow .ql-picker {
    color: #444;
    display: inline-block;
    float: left;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    position: relative;
    vertical-align: middle
}

.ql-snow .ql-picker-label {
    cursor: pointer;
    display: inline-block;
    height: 100%;
    padding-left: 8px;
    padding-right: 2px;
    position: relative;
    width: 100%
}

.ql-snow .ql-picker-label:before {
    display: inline-block;
    line-height: 22px
}

.ql-snow .ql-picker-options {
    background-color: #fff;
    display: none;
    min-width: 100%;
    padding: 4px 8px;
    position: absolute;
    white-space: nowrap
}

.ql-snow .ql-picker-options .ql-picker-item {
    cursor: pointer;
    display: block;
    padding-bottom: 5px;
    padding-top: 5px
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    color: #ccc;
    z-index: 2
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: #ccc
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: #ccc
}

.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    display: block;
    margin-top: -1px;
    top: 100%;
    z-index: 1
}

.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
    width: 28px
}

.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
    padding: 2px 4px
}

.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
    right: 4px
}

.ql-snow .ql-icon-picker .ql-picker-options {
    padding: 4px 0
}

.ql-snow .ql-icon-picker .ql-picker-item {
    height: 24px;
    width: 24px;
    padding: 2px 4px
}

.ql-snow .ql-color-picker .ql-picker-options {
    padding: 3px 5px;
    width: 152px
}

.ql-snow .ql-color-picker .ql-picker-item {
    border: 1px solid transparent;
    float: left;
    height: 16px;
    margin: 2px;
    padding: 0;
    width: 16px
}

.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
    position: absolute;
    margin-top: -9px;
    right: 0;
    top: 50%;
    width: 18px
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before {
    content: attr(data-label)
}

.ql-snow .ql-picker.ql-header {
    width: 98px
}

.ql-snow .ql-picker.ql-header .ql-picker-label:before,
.ql-snow .ql-picker.ql-header .ql-picker-item:before {
    content: "Normal"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    content: "Heading 1"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    content: "Heading 2"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    content: "Heading 3"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    content: "Heading 4"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    content: "Heading 5"
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    content: "Heading 6"
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    font-size: 2em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    font-size: 1.5em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    font-size: 1.17em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    font-size: 1em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    font-size: .83em
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    font-size: .67em
}

.ql-snow .ql-picker.ql-font {
    width: 108px
}

.ql-snow .ql-picker.ql-font .ql-picker-label:before,
.ql-snow .ql-picker.ql-font .ql-picker-item:before {
    content: "Sans Serif"
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    content: "Serif"
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    content: "Monospace"
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    font-family: Georgia, Times New Roman, serif
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    font-family: Monaco, Courier New, monospace
}

.ql-snow .ql-picker.ql-size {
    width: 98px
}

.ql-snow .ql-picker.ql-size .ql-picker-label:before,
.ql-snow .ql-picker.ql-size .ql-picker-item:before {
    content: "Normal"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    content: "Small"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    content: "Large"
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    content: "Huge"
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    font-size: 10px
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    font-size: 18px
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    font-size: 32px
}

.ql-snow .ql-color-picker.ql-background .ql-picker-item {
    background-color: #fff
}

.ql-snow .ql-color-picker.ql-color .ql-picker-item {
    background-color: #000
}

.ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    padding: 8px
}

.ql-toolbar.ql-snow .ql-formats {
    margin-right: 15px
}

.ql-toolbar.ql-snow .ql-picker-label {
    border: 1px solid transparent
}

.ql-toolbar.ql-snow .ql-picker-options {
    border: 1px solid transparent;
    box-shadow: #0003 0 2px 8px
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-color: #ccc
}

.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
    border-color: #000
}

.ql-toolbar.ql-snow+.ql-container.ql-snow {
    border-top: 0
}

.ql-snow .ql-tooltip {
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 0 5px #ddd;
    color: #444;
    padding: 5px 12px;
    white-space: nowrap
}

.ql-snow .ql-tooltip:before {
    content: "Visit URL:";
    line-height: 26px;
    margin-right: 8px
}

.ql-snow .ql-tooltip input[type=text] {
    display: none;
    border: 1px solid #ccc;
    font-size: 13px;
    height: 26px;
    margin: 0;
    padding: 3px 5px;
    width: 170px
}

.ql-snow .ql-tooltip a.ql-preview {
    display: inline-block;
    max-width: 200px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    vertical-align: top
}

.ql-snow .ql-tooltip a.ql-action:after {
    border-right: 1px solid #ccc;
    content: "Edit";
    margin-left: 16px;
    padding-right: 8px
}

.ql-snow .ql-tooltip a.ql-remove:before {
    content: "Remove";
    margin-left: 8px
}

.ql-snow .ql-tooltip a {
    line-height: 26px
}

.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
    display: none
}

.ql-snow .ql-tooltip.ql-editing input[type=text] {
    display: inline-block
}

.ql-snow .ql-tooltip.ql-editing a.ql-action:after {
    border-right: 0;
    content: "Save";
    padding-right: 0
}

.ql-snow .ql-tooltip[data-mode=link]:before {
    content: "Enter link:"
}

.ql-snow .ql-tooltip[data-mode=formula]:before {
    content: "Enter formula:"
}

.ql-snow .ql-tooltip[data-mode=video]:before {
    content: "Enter video:"
}

.ql-snow a {
    color: #06c
}

.ql-container.ql-snow {
    border: 1px solid #ccc
}

.ql-bubble.ql-toolbar:after,
.ql-bubble .ql-toolbar:after {
    clear: both;
    content: "";
    display: table
}

.ql-bubble.ql-toolbar button,
.ql-bubble .ql-toolbar button {
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    padding: 3px 5px;
    width: 28px
}

.ql-bubble.ql-toolbar button svg,
.ql-bubble .ql-toolbar button svg {
    float: left;
    height: 100%
}

.ql-bubble.ql-toolbar button:active:hover,
.ql-bubble .ql-toolbar button:active:hover {
    outline: none
}

.ql-bubble.ql-toolbar input.ql-image[type=file],
.ql-bubble .ql-toolbar input.ql-image[type=file] {
    display: none
}

.ql-bubble.ql-toolbar button:hover,
.ql-bubble .ql-toolbar button:hover,
.ql-bubble.ql-toolbar button:focus,
.ql-bubble .ql-toolbar button:focus,
.ql-bubble.ql-toolbar button.ql-active,
.ql-bubble .ql-toolbar button.ql-active,
.ql-bubble.ql-toolbar .ql-picker-label:hover,
.ql-bubble .ql-toolbar .ql-picker-label:hover,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active,
.ql-bubble.ql-toolbar .ql-picker-item:hover,
.ql-bubble .ql-toolbar .ql-picker-item:hover,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected {
    color: #fff
}

.ql-bubble.ql-toolbar button:hover .ql-fill,
.ql-bubble .ql-toolbar button:hover .ql-fill,
.ql-bubble.ql-toolbar button:focus .ql-fill,
.ql-bubble .ql-toolbar button:focus .ql-fill,
.ql-bubble.ql-toolbar button.ql-active .ql-fill,
.ql-bubble .ql-toolbar button.ql-active .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-bubble.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
    fill: #fff
}

.ql-bubble.ql-toolbar button:hover .ql-stroke,
.ql-bubble .ql-toolbar button:hover .ql-stroke,
.ql-bubble.ql-toolbar button:focus .ql-stroke,
.ql-bubble .ql-toolbar button:focus .ql-stroke,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-bubble.ql-toolbar button:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar button:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar button:focus .ql-stroke-miter,
.ql-bubble .ql-toolbar button:focus .ql-stroke-miter,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
    stroke: #fff
}

@media (pointer:coarse) {

    .ql-bubble.ql-toolbar button:hover:not(.ql-active),
    .ql-bubble .ql-toolbar button:hover:not(.ql-active) {
        color: #ccc
    }

    .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
    .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
        fill: #ccc
    }

    .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
    .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
        stroke: #ccc
    }
}

.ql-bubble,
.ql-bubble * {
    box-sizing: border-box
}

.ql-bubble .ql-hidden {
    display: none
}

.ql-bubble .ql-out-bottom,
.ql-bubble .ql-out-top {
    visibility: hidden
}

.ql-bubble .ql-tooltip {
    position: absolute;
    transform: translateY(10px)
}

.ql-bubble .ql-tooltip a {
    cursor: pointer;
    text-decoration: none
}

.ql-bubble .ql-tooltip.ql-flip {
    transform: translateY(-10px)
}

.ql-bubble .ql-formats {
    display: inline-block;
    vertical-align: middle
}

.ql-bubble .ql-formats:after {
    clear: both;
    content: "";
    display: table
}

.ql-bubble .ql-stroke {
    fill: none;
    stroke: #ccc;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2
}

.ql-bubble .ql-stroke-miter {
    fill: none;
    stroke: #ccc;
    stroke-miterlimit: 10;
    stroke-width: 2
}

.ql-bubble .ql-fill,
.ql-bubble .ql-stroke.ql-fill {
    fill: #ccc
}

.ql-bubble .ql-empty {
    fill: none
}

.ql-bubble .ql-even {
    fill-rule: evenodd
}

.ql-bubble .ql-thin,
.ql-bubble .ql-stroke.ql-thin {
    stroke-width: 1
}

.ql-bubble .ql-transparent {
    opacity: .4
}

.ql-bubble .ql-direction svg:last-child {
    display: none
}

.ql-bubble .ql-direction.ql-active svg:last-child {
    display: inline
}

.ql-bubble .ql-direction.ql-active svg:first-child {
    display: none
}

.ql-bubble .ql-editor h1 {
    font-size: 2em
}

.ql-bubble .ql-editor h2 {
    font-size: 1.5em
}

.ql-bubble .ql-editor h3 {
    font-size: 1.17em
}

.ql-bubble .ql-editor h4 {
    font-size: 1em
}

.ql-bubble .ql-editor h5 {
    font-size: .83em
}

.ql-bubble .ql-editor h6 {
    font-size: .67em
}

.ql-bubble .ql-editor a {
    text-decoration: underline
}

.ql-bubble .ql-editor blockquote {
    border-left: 4px solid #ccc;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 16px
}

.ql-bubble .ql-editor code,
.ql-bubble .ql-editor .ql-code-block-container {
    background-color: #f0f0f0;
    border-radius: 3px
}

.ql-bubble .ql-editor .ql-code-block-container {
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 5px 10px
}

.ql-bubble .ql-editor code {
    font-size: 85%;
    padding: 2px 4px
}

.ql-bubble .ql-editor .ql-code-block-container {
    background-color: #23241f;
    color: #f8f8f2;
    overflow: visible
}

.ql-bubble .ql-editor img {
    max-width: 100%
}

.ql-bubble .ql-picker {
    color: #ccc;
    display: inline-block;
    float: left;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    position: relative;
    vertical-align: middle
}

.ql-bubble .ql-picker-label {
    cursor: pointer;
    display: inline-block;
    height: 100%;
    padding-left: 8px;
    padding-right: 2px;
    position: relative;
    width: 100%
}

.ql-bubble .ql-picker-label:before {
    display: inline-block;
    line-height: 22px
}

.ql-bubble .ql-picker-options {
    background-color: #444;
    display: none;
    min-width: 100%;
    padding: 4px 8px;
    position: absolute;
    white-space: nowrap
}

.ql-bubble .ql-picker-options .ql-picker-item {
    cursor: pointer;
    display: block;
    padding-bottom: 5px;
    padding-top: 5px
}

.ql-bubble .ql-picker.ql-expanded .ql-picker-label {
    color: #777;
    z-index: 2
}

.ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: #777
}

.ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: #777
}

.ql-bubble .ql-picker.ql-expanded .ql-picker-options {
    display: block;
    margin-top: -1px;
    top: 100%;
    z-index: 1
}

.ql-bubble .ql-color-picker,
.ql-bubble .ql-icon-picker {
    width: 28px
}

.ql-bubble .ql-color-picker .ql-picker-label,
.ql-bubble .ql-icon-picker .ql-picker-label {
    padding: 2px 4px
}

.ql-bubble .ql-color-picker .ql-picker-label svg,
.ql-bubble .ql-icon-picker .ql-picker-label svg {
    right: 4px
}

.ql-bubble .ql-icon-picker .ql-picker-options {
    padding: 4px 0
}

.ql-bubble .ql-icon-picker .ql-picker-item {
    height: 24px;
    width: 24px;
    padding: 2px 4px
}

.ql-bubble .ql-color-picker .ql-picker-options {
    padding: 3px 5px;
    width: 152px
}

.ql-bubble .ql-color-picker .ql-picker-item {
    border: 1px solid transparent;
    float: left;
    height: 16px;
    margin: 2px;
    padding: 0;
    width: 16px
}

.ql-bubble .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
    position: absolute;
    margin-top: -9px;
    right: 0;
    top: 50%;
    width: 18px
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before {
    content: attr(data-label)
}

.ql-bubble .ql-picker.ql-header {
    width: 98px
}

.ql-bubble .ql-picker.ql-header .ql-picker-label:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item:before {
    content: "Normal"
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    content: "Heading 1"
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    content: "Heading 2"
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    content: "Heading 3"
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    content: "Heading 4"
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    content: "Heading 5"
}

.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    content: "Heading 6"
}

.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
    font-size: 2em
}

.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
    font-size: 1.5em
}

.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
    font-size: 1.17em
}

.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
    font-size: 1em
}

.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
    font-size: .83em
}

.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
    font-size: .67em
}

.ql-bubble .ql-picker.ql-font {
    width: 108px
}

.ql-bubble .ql-picker.ql-font .ql-picker-label:before,
.ql-bubble .ql-picker.ql-font .ql-picker-item:before {
    content: "Sans Serif"
}

.ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    content: "Serif"
}

.ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    content: "Monospace"
}

.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
    font-family: Georgia, Times New Roman, serif
}

.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
    font-family: Monaco, Courier New, monospace
}

.ql-bubble .ql-picker.ql-size {
    width: 98px
}

.ql-bubble .ql-picker.ql-size .ql-picker-label:before,
.ql-bubble .ql-picker.ql-size .ql-picker-item:before {
    content: "Normal"
}

.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=small]:before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    content: "Small"
}

.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=large]:before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    content: "Large"
}

.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    content: "Huge"
}

.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
    font-size: 10px
}

.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
    font-size: 18px
}

.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
    font-size: 32px
}

.ql-bubble .ql-color-picker.ql-background .ql-picker-item {
    background-color: #fff
}

.ql-bubble .ql-color-picker.ql-color .ql-picker-item {
    background-color: #000
}

.ql-code-block-container {
    position: relative
}

.ql-code-block-container .ql-ui {
    right: 5px;
    top: 5px
}

.ql-bubble .ql-toolbar .ql-formats {
    margin: 8px 12px 8px 0
}

.ql-bubble .ql-toolbar .ql-formats:first-child {
    margin-left: 12px
}

.ql-bubble .ql-color-picker svg {
    margin: 1px
}

.ql-bubble .ql-color-picker .ql-picker-item.ql-selected,
.ql-bubble .ql-color-picker .ql-picker-item:hover {
    border-color: #fff
}

.ql-bubble .ql-tooltip {
    background-color: #444;
    border-radius: 25px;
    color: #fff
}

.ql-bubble .ql-tooltip-arrow {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    content: " ";
    display: block;
    left: 50%;
    margin-left: -6px;
    position: absolute
}

.ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow {
    border-bottom: 6px solid #444;
    top: -6px
}

.ql-bubble .ql-tooltip.ql-flip .ql-tooltip-arrow {
    border-top: 6px solid #444;
    bottom: -6px
}

.ql-bubble .ql-tooltip.ql-editing .ql-tooltip-editor {
    display: block
}

.ql-bubble .ql-tooltip.ql-editing .ql-formats {
    visibility: hidden
}

.ql-bubble .ql-tooltip-editor {
    display: none
}

.ql-bubble .ql-tooltip-editor input[type=text] {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 13px;
    height: 100%;
    outline: none;
    padding: 10px 20px;
    position: absolute;
    width: 100%
}

.ql-bubble .ql-tooltip-editor a {
    top: 10px;
    position: absolute;
    right: 20px
}

.ql-bubble .ql-tooltip-editor a:before {
    color: #ccc;
    content: "×";
    font-size: 16px;
    font-weight: 700
}

.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close) {
    position: relative;
    white-space: nowrap
}

.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):before {
    background-color: #444;
    border-radius: 15px;
    top: -5px;
    font-size: 12px;
    color: #fff;
    content: attr(href);
    font-weight: 400;
    overflow: hidden;
    padding: 5px 15px;
    text-decoration: none;
    z-index: 1
}

.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):after {
    border-top: 6px solid #444;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    top: 0;
    content: " ";
    height: 0;
    width: 0
}

.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):before,
.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):after {
    left: 0;
    margin-left: 50%;
    position: absolute;
    transform: translate(-50%, -100%);
    transition: visibility 0s ease .2s;
    visibility: hidden
}

.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):hover:before,
.ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):hover:after {
    visibility: visible
}

/*!
 * Quill Editor v2.0.3
 * https://quilljs.com
 * Copyright (c) 2017-2024, Slab
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
    box-sizing: border-box;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    height: 100%;
    margin: 0;
    position: relative
}

.ql-container.ql-disabled .ql-tooltip {
    visibility: hidden
}

.ql-container:not(.ql-disabled) li[data-list=checked]>.ql-ui,
.ql-container:not(.ql-disabled) li[data-list=unchecked]>.ql-ui {
    cursor: pointer
}

.ql-clipboard {
    left: -100000px;
    height: 1px;
    overflow-y: hidden;
    position: absolute;
    top: 50%
}

.ql-clipboard p {
    margin: 0;
    padding: 0
}

.ql-editor {
    box-sizing: border-box;
    counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    line-height: 1.42;
    height: 100%;
    outline: none;
    overflow-y: auto;
    padding: 12px 15px;
    tab-size: 4;
    -moz-tab-size: 4;
    text-align: left;
    white-space: pre-wrap;
    word-wrap: break-word
}

.ql-editor>* {
    cursor: text
}

.ql-editor p,
.ql-editor ol,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
    margin: 0;
    padding: 0
}

@supports (counter-set:none) {

    .ql-editor p,
    .ql-editor h1,
    .ql-editor h2,
    .ql-editor h3,
    .ql-editor h4,
    .ql-editor h5,
    .ql-editor h6 {
        counter-set: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {

    .ql-editor p,
    .ql-editor h1,
    .ql-editor h2,
    .ql-editor h3,
    .ql-editor h4,
    .ql-editor h5,
    .ql-editor h6 {
        counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

.ql-editor table {
    border-collapse: collapse
}

.ql-editor td {
    border: 1px solid #000;
    padding: 2px 5px
}

.ql-editor ol {
    padding-left: 1.5em
}

.ql-editor li {
    list-style-type: none;
    padding-left: 1.5em;
    position: relative
}

.ql-editor li>.ql-ui:before {
    display: inline-block;
    margin-left: -1.5em;
    margin-right: .3em;
    text-align: right;
    white-space: nowrap;
    width: 1.2em
}

.ql-editor li[data-list=checked]>.ql-ui,
.ql-editor li[data-list=unchecked]>.ql-ui {
    color: #777
}

.ql-editor li[data-list=bullet]>.ql-ui:before {
    content: "•"
}

.ql-editor li[data-list=checked]>.ql-ui:before {
    content: "☑"
}

.ql-editor li[data-list=unchecked]>.ql-ui:before {
    content: "☐"
}

@supports (counter-set:none) {
    .ql-editor li[data-list] {
        counter-set: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list] {
        counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered] {
    counter-increment: list-0
}

.ql-editor li[data-list=ordered]>.ql-ui:before {
    content: counter(list-0, decimal) ". "
}

.ql-editor li[data-list=ordered].ql-indent-1 {
    counter-increment: list-1
}

.ql-editor li[data-list=ordered].ql-indent-1>.ql-ui:before {
    content: counter(list-1, lower-alpha) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-1 {
        counter-set: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-1 {
        counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-2 {
    counter-increment: list-2
}

.ql-editor li[data-list=ordered].ql-indent-2>.ql-ui:before {
    content: counter(list-2, lower-roman) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-2 {
        counter-set: list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-2 {
        counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-3 {
    counter-increment: list-3
}

.ql-editor li[data-list=ordered].ql-indent-3>.ql-ui:before {
    content: counter(list-3, decimal) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-3 {
        counter-set: list-4 list-5 list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-3 {
        counter-reset: list-4 list-5 list-6 list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-4 {
    counter-increment: list-4
}

.ql-editor li[data-list=ordered].ql-indent-4>.ql-ui:before {
    content: counter(list-4, lower-alpha) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-4 {
        counter-set: list-5 list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-4 {
        counter-reset: list-5 list-6 list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-5 {
    counter-increment: list-5
}

.ql-editor li[data-list=ordered].ql-indent-5>.ql-ui:before {
    content: counter(list-5, lower-roman) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-5 {
        counter-set: list-6 list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-5 {
        counter-reset: list-6 list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-6 {
    counter-increment: list-6
}

.ql-editor li[data-list=ordered].ql-indent-6>.ql-ui:before {
    content: counter(list-6, decimal) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-6 {
        counter-set: list-7 list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-6 {
        counter-reset: list-7 list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-7 {
    counter-increment: list-7
}

.ql-editor li[data-list=ordered].ql-indent-7>.ql-ui:before {
    content: counter(list-7, lower-alpha) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-7 {
        counter-set: list-8 list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-7 {
        counter-reset: list-8 list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-8 {
    counter-increment: list-8
}

.ql-editor li[data-list=ordered].ql-indent-8>.ql-ui:before {
    content: counter(list-8, lower-roman) ". "
}

@supports (counter-set:none) {
    .ql-editor li[data-list].ql-indent-8 {
        counter-set: list-9
    }
}

@supports not (counter-set:none) {
    .ql-editor li[data-list].ql-indent-8 {
        counter-reset: list-9
    }
}

.ql-editor li[data-list=ordered].ql-indent-9 {
    counter-increment: list-9
}

.ql-editor li[data-list=ordered].ql-indent-9>.ql-ui:before {
    content: counter(list-9, decimal) ". "
}

.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 3em
}

.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 4.5em
}

.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 3em
}

.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 4.5em
}

.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 6em
}

.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 7.5em
}

.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 6em
}

.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 7.5em
}

.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 9em
}

.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 10.5em
}

.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 9em
}

.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 10.5em
}

.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 12em
}

.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 13.5em
}

.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 12em
}

.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 13.5em
}

.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 15em
}

.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 16.5em
}

.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 15em
}

.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 16.5em
}

.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 18em
}

.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 19.5em
}

.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 18em
}

.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 19.5em
}

.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 21em
}

.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 22.5em
}

.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 21em
}

.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 22.5em
}

.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 24em
}

.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 25.5em
}

.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 24em
}

.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 25.5em
}

.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 27em
}

.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 28.5em
}

.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 27em
}

.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 28.5em
}

.ql-editor li.ql-direction-rtl {
    padding-right: 1.5em
}

.ql-editor li.ql-direction-rtl>.ql-ui:before {
    margin-left: .3em;
    margin-right: -1.5em;
    text-align: left
}

.ql-editor table {
    table-layout: fixed;
    width: 100%
}

.ql-editor table td {
    outline: none
}

.ql-editor .ql-code-block-container {
    font-family: monospace
}

.ql-editor .ql-video {
    display: block;
    max-width: 100%
}

.ql-editor .ql-video.ql-align-center {
    margin: 0 auto
}

.ql-editor .ql-video.ql-align-right {
    margin: 0 0 0 auto
}

.ql-editor .ql-bg-black {
    background-color: #000
}

.ql-editor .ql-bg-red {
    background-color: #e60000
}

.ql-editor .ql-bg-orange {
    background-color: #f90
}

.ql-editor .ql-bg-yellow {
    background-color: #ff0
}

.ql-editor .ql-bg-green {
    background-color: #008a00
}

.ql-editor .ql-bg-blue {
    background-color: #06c
}

.ql-editor .ql-bg-purple {
    background-color: #93f
}

.ql-editor .ql-color-white {
    color: #fff
}

.ql-editor .ql-color-red {
    color: #e60000
}

.ql-editor .ql-color-orange {
    color: #f90
}

.ql-editor .ql-color-yellow {
    color: #ff0
}

.ql-editor .ql-color-green {
    color: #008a00
}

.ql-editor .ql-color-blue {
    color: #06c
}

.ql-editor .ql-color-purple {
    color: #93f
}

.ql-editor .ql-font-serif {
    font-family: Georgia, Times New Roman, serif
}

.ql-editor .ql-font-monospace {
    font-family: Monaco, Courier New, monospace
}

.ql-editor .ql-size-small {
    font-size: .75em
}

.ql-editor .ql-size-large {
    font-size: 1.5em
}

.ql-editor .ql-size-huge {
    font-size: 2.5em
}

.ql-editor .ql-direction-rtl {
    direction: rtl;
    text-align: inherit
}

.ql-editor .ql-align-center {
    text-align: center
}

.ql-editor .ql-align-justify {
    text-align: justify
}

.ql-editor .ql-align-right {
    text-align: right
}

.ql-editor .ql-ui {
    position: absolute
}

.ql-editor.ql-blank:before {
    color: #0009;
    content: attr(data-placeholder);
    font-style: italic;
    left: 15px;
    pointer-events: none;
    position: absolute;
    right: 15px
}

.lbiz-quill {
    width: 100%;
    display: flex;
    flex-direction: column
}

.lbiz-search-table {
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

.lbiz-search-table__table {
    min-height: 100%
}

.lbiz-search-table__table th {
    color: var(--td-text-color-primary)
}

.lbiz-search-table__table.l-table__content--scrollable-to-right .l-table__cell--fixed-right-first:after {
    border: none !important;
    width: 10px;
    box-shadow: inset -6px 0 8px -3px #00000026
}

.lbiz-search-table__table.l-table__content--scrollable-to-left .l-table__cell--fixed-left-last:after {
    border: none !important;
    width: 10px;
    box-shadow: inset 6px 0 8px -3px #00000026
}

.lbiz-search-list {
    margin-top: var(--td-pop-padding-xxl);
    flex: 1
}

.lbiz-select,
.lbiz-table {
    width: 100%
}

.lbiz-table-lineClamp {
    display: -webkit-box
}

.lbiz-tracker-button {
    display: block
}

.lbiz-tree {
    width: 100%
}

.lbiz-tree .l-tree__label {
    padding: var(--td-comp-paddingTB-xxs);
    margin-left: 0
}

.lbiz-tree .l-tree__item {
    padding: 0 0 0 calc(var(--td-comp-margin-m) * var(--level))
}

.lbiz-upload {
    display: block
}

.l-slide-down-enter-active,
.l-slide-down-leave-active {
    transition: height .2s cubic-bezier(.38, 0, .24, 1), max-height .2s cubic-bezier(.38, 0, .24, 1)
}

.slide-up-enter-active,
.slide-up-leave-active {
    transition: .25s cubic-bezier(.25, .8, .5, 1)
}

.slide-up-move {
    transition: transform .3s
}

.slide-up-enter-from,
.slide-up-leave-to {
    opacity: 0;
    transform: translateY(-15px)
}

.slide-down-enter-active,
.slide-down-leave-active {
    transition: .25s cubic-bezier(.25, .8, .5, 1)
}

.slide-down-move {
    transition: transform .3s
}

.slide-down-enter-from,
.slide-down-leave-to {
    opacity: 0;
    transform: translateY(15px)
}

.slide-left-enter-active,
.slide-left-leave-active {
    transition: .25s cubic-bezier(.25, .8, .5, 1)
}

.slide-left-move {
    transition: transform .3s
}

.slide-left-enter-from,
.slide-left-leave-to {
    opacity: 0;
    transform: translate(-15px)
}

.slide-right-enter-active,
.slide-right-leave-active {
    transition: .25s cubic-bezier(.25, .8, .5, 1)
}

.slide-right-move {
    transition: transform .3s
}

.slide-right-enter-from,
.slide-right-leave-to {
    opacity: 0;
    transform: translate(15px)
}

.fade-transition-enter-active,
.fade-transition-leave-active {
    transition: opacity .2s ease-in-out
}

.fade-transition-enter-from,
.fade-transition-leave-to {
    opacity: 0
}

.fade-slide-leave-active,
.fade-slide-enter-active {
    transition: all .3s
}

.fade-slide-enter-from {
    opacity: 0;
    transform: translate(-30px)
}

.fade-slide-leave-to {
    opacity: 0;
    transform: translate(30px)
}

.fade-down-enter-active,
.fade-down-leave-active {
    transition: opacity .25s, transform .3s
}

.fade-down-enter-from {
    opacity: 0;
    transform: translateY(-10%)
}

.fade-down-leave-to {
    opacity: 0;
    transform: translateY(10%)
}

.fade-scale-leave-active,
.fade-scale-enter-active {
    transition: all .28s
}

.fade-scale-enter-from {
    opacity: 0;
    transform: scale(1.2)
}

.fade-scale-leave-to {
    opacity: 0;
    transform: scale(.8)
}

.fade-up-enter-active,
.fade-up-leave-active {
    transition: opacity .2s, transform .25s
}

.fade-up-enter-from {
    opacity: 0;
    transform: translateY(10%)
}

.fade-up-leave-to {
    opacity: 0;
    transform: translateY(-10%)
}

@keyframes fade-slide {
    0% {
        opacity: 0;
        transform: translate(-30px)
    }

    50% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate(30px)
    }
}

@keyframes fade {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes fade-up {
    0% {
        opacity: 0;
        transform: translateY(10%)
    }

    50% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translateY(-10%)
    }
}

@keyframes fade-down {
    0% {
        opacity: 0;
        transform: translateY(-10%)
    }

    50% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translateY(10%)
    }
}

.fade-slow {
    animation: fade 3s infinite
}

.fade-slide-slow {
    animation: fade-slide 3s infinite
}

.fade-up-slow {
    animation: fade-up 3s infinite
}

.fade-down-slow {
    animation: fade-down 3s infinite
}

.collapse-transition {
    transition: .2s height ease-in-out, .2s padding-top ease-in-out, .2s padding-bottom ease-in-out
}

.collapse-transition-leave-active,
.collapse-transition-enter-active {
    transition: .2s max-height ease-in-out, .2s padding-top ease-in-out, .2s margin-top ease-in-out
}

.bounce-enter-active {
    animation: bounce-in .5s
}

.bounce-leave-active {
    animation: bounce-in .5s reverse
}

@keyframes bounce-in {
    0% {
        transform: scale(0)
    }

    50% {
        transform: scale(1.2)
    }

    to {
        transform: scale(1)
    }
}

.rotate-enter-active,
.rotate-leave-active {
    transition: all .5s
}

.rotate-enter-from,
.rotate-leave-to {
    opacity: 0;
    transform: rotate(180deg)
}

.flash-enter-active {
    animation: flash .8s
}

.flash-leave-active {
    animation: flash .8s reverse
}

@keyframes flash {

    0%,
    50%,
    to {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }
}

.shake-enter-active {
    animation: shake .6s
}

.shake-leave-active {
    animation: shake .6s reverse
}

@keyframes shake {

    0%,
    to {
        transform: translate(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate(-5px)
    }

    20%,
    40%,
    60%,
    80% {
        transform: translate(5px)
    }
}

.zoom-in-enter-active,
.zoom-in-leave-active {
    transition: all .3s
}

.zoom-in-enter-from,
.zoom-in-leave-to {
    opacity: 0;
    transform: scale(.5)
}

.zoom-out-enter-active,
.zoom-out-leave-active {
    transition: all .3s
}

.zoom-out-enter-from,
.zoom-out-leave-to {
    opacity: 0;
    transform: scale(1.5)
}

.swing-enter-active {
    animation: swing .8s
}

.swing-leave-active {
    animation: swing .8s reverse
}

@keyframes swing {
    20% {
        transform: rotate3d(0, 0, 1, 15deg)
    }

    40% {
        transform: rotate3d(0, 0, 1, -10deg)
    }

    60% {
        transform: rotate3d(0, 0, 1, 5deg)
    }

    80% {
        transform: rotate3d(0, 0, 1, -5deg)
    }

    to {
        transform: rotate3d(0, 0, 1, 0)
    }
}

.pulse-enter-active {
    animation: pulse .5s
}

.pulse-leave-active {
    animation: pulse .5s reverse
}

@keyframes pulse {
    0% {
        transform: scale(1)
    }

    50% {
        transform: scale(1.1)
    }

    to {
        transform: scale(1)
    }
}

.flip-enter-active,
.flip-leave-active {
    transition: all .6s;
    transform-style: preserve-3d
}

.flip-enter-from,
.flip-leave-to {
    opacity: 0;
    transform: rotateY(180deg)
}

.bounce-down-enter-active {
    animation: bounce-down .6s
}

.bounce-down-leave-active {
    animation: bounce-down .6s reverse
}

@keyframes bounce-down {
    0% {
        transform: translateY(-100px);
        opacity: 0
    }

    60% {
        transform: translateY(10px);
        opacity: 1
    }

    80% {
        transform: translateY(-5px)
    }

    to {
        transform: translateY(0)
    }
}

.blur-fade-enter-active,
.blur-fade-leave-active {
    transition: all .5s
}

.blur-fade-enter-from,
.blur-fade-leave-to {
    opacity: 0;
    filter: blur(10px)
}

.flip-x-enter-active,
.flip-x-leave-active {
    transition: all .6s;
    transform-style: preserve-3d
}

.flip-x-enter-from,
.flip-x-leave-to {
    opacity: 0;
    transform: rotateX(180deg)
}

.color-fade-enter-active,
.color-fade-leave-active {
    transition: all .5s
}

.color-fade-enter-from,
.color-fade-leave-to {
    color: transparent;
    background-color: transparent
}

.ripple {
    position: relative;
    overflow: hidden
}

.ripple:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    background-image: radial-gradient(circle, #fff 10%, transparent 10.01%);
    background-repeat: no-repeat;
    background-position: 50%;
    transform: scale(10);
    opacity: 0;
    transition: transform .5s, opacity 1s
}

.ripple:active:after {
    transform: scale(0);
    opacity: .3;
    transition: 0s
}

@keyframes typing {
    0% {
        width: 0
    }

    to {
        width: 100%
    }
}

@keyframes blink-caret {

    0%,
    to {
        border-color: transparent
    }

    50% {
        border-color: currentColor
    }
}

.typewriter {
    overflow: hidden;
    white-space: nowrap;
    border-right: .15em solid;
    width: 0;
    animation: typing 3.5s steps(40, end) forwards, blink-caret .75s step-end infinite
}

.hover-rise {
    transition: transform .3s ease
}

.hover-rise:hover {
    transform: translateY(-5px)
}

.hover-shadow {
    transition: box-shadow .3s ease
}

.hover-shadow:hover {
    box-shadow: 0 5px 15px #0000004d
}

.grow-enter-active,
.grow-leave-active {
    transition: all .5s;
    max-height: 1000px;
    overflow: hidden
}

.grow-enter-from,
.grow-leave-to {
    max-height: 0;
    opacity: 0;
    padding: 0
}

.blinds-enter-active,
.blinds-leave-active {
    transition: all .6s;
    overflow: hidden
}

.blinds-enter-from,
.blinds-leave-to {
    transform: scaleY(0);
    opacity: 0;
    transform-origin: top
}

.rotate-scale-enter-active,
.rotate-scale-leave-active {
    transition: all .5s
}

.rotate-scale-enter-from,
.rotate-scale-leave-to {
    transform: rotate(45deg) scale(.5);
    opacity: 0
}

.elastic-enter-active {
    animation: elastic-in .75s
}

.elastic-leave-active {
    animation: elastic-out .5s
}

@keyframes elastic-in {
    0% {
        transform: scale(0);
        opacity: 0
    }

    60% {
        transform: scale(1.1);
        opacity: 1
    }

    80% {
        transform: scale(.95)
    }

    to {
        transform: scale(1)
    }
}

@keyframes elastic-out {
    0% {
        transform: scale(1);
        opacity: 1
    }

    20% {
        transform: scale(1.1)
    }

    to {
        transform: scale(0);
        opacity: 0
    }
}

.bg-fade-enter-active,
.bg-fade-leave-active {
    transition: all .6s
}

.bg-fade-enter-from,
.bg-fade-leave-to {
    background-color: transparent !important;
    opacity: 0
}

.card-flip-container {
    perspective: 1000px
}

.card-flip {
    transition: transform .8s;
    transform-style: preserve-3d
}

.card-flip.flipped {
    transform: rotateY(180deg)
}

.card-flip-front,
.card-flip-back {
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.card-flip-back {
    transform: rotateY(180deg)
}

.shine {
    position: relative;
    overflow: hidden
}

.shine:after {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(to right, #fff0, #ffffff4d, #fff0);
    transform: rotate(30deg);
    animation: shine 3s infinite
}

@keyframes shine {
    0% {
        transform: translate(-100%) rotate(30deg)
    }

    to {
        transform: translate(100%) rotate(30deg)
    }
}

:root,
:root[theme-mode=light] {
    --td-brand-color-1: #f2f3ff;
    --td-brand-color-2: #d9e1ff;
    --td-brand-color-3: #b5c7ff;
    --td-brand-color-4: #8eabff;
    --td-brand-color-5: #618dff;
    --td-brand-color-6: #366ef4;
    --td-brand-color-7: #0052d9;
    --td-brand-color-8: #003cab;
    --td-brand-color-9: #002a7c;
    --td-brand-color-10: #001a57;
    --td-warning-color-1: #fff1e9;
    --td-warning-color-2: #ffd9c2;
    --td-warning-color-3: #ffb98c;
    --td-warning-color-4: #fa9550;
    --td-warning-color-5: #e37318;
    --td-warning-color-6: #be5a00;
    --td-warning-color-7: #954500;
    --td-warning-color-8: #713300;
    --td-warning-color-9: #532300;
    --td-warning-color-10: #3b1700;
    --td-error-color-1: #fff0ed;
    --td-error-color-2: #ffd8d2;
    --td-error-color-3: #ffb9b0;
    --td-error-color-4: #ff9285;
    --td-error-color-5: #f6685d;
    --td-error-color-6: #d54941;
    --td-error-color-7: #ad352f;
    --td-error-color-8: #881f1c;
    --td-error-color-9: #68070a;
    --td-error-color-10: #490002;
    --td-success-color-1: #e3f9e9;
    --td-success-color-2: #c6f3d7;
    --td-success-color-3: #92dab2;
    --td-success-color-4: #56c08d;
    --td-success-color-5: #2ba471;
    --td-success-color-6: #008858;
    --td-success-color-7: #006c45;
    --td-success-color-8: #005334;
    --td-success-color-9: #003b23;
    --td-success-color-10: #002515;
    --td-gray-color-1: #f3f3f3;
    --td-gray-color-2: #eee;
    --td-gray-color-3: #e8e8e8;
    --td-gray-color-4: #ddd;
    --td-gray-color-5: #c6c6c6;
    --td-gray-color-6: #a6a6a6;
    --td-gray-color-7: #8b8b8b;
    --td-gray-color-8: #777;
    --td-gray-color-9: #5e5e5e;
    --td-gray-color-10: #4b4b4b;
    --td-gray-color-11: #393939;
    --td-gray-color-12: #2c2c2c;
    --td-gray-color-13: #242424;
    --td-gray-color-14: #181818;
    --td-font-white-1: #ffffff;
    --td-font-white-2: rgba(255, 255, 255, .55);
    --td-font-white-3: rgba(255, 255, 255, .35);
    --td-font-white-4: rgba(255, 255, 255, .22);
    --td-font-gray-1: rgba(0, 0, 0, .9);
    --td-font-gray-2: rgba(0, 0, 0, .6);
    --td-font-gray-3: rgba(0, 0, 0, .4);
    --td-font-gray-4: rgba(0, 0, 0, .26);
    --td-brand-color: var(--td-brand-color-7);
    --td-warning-color: var(--td-warning-color-5);
    --td-error-color: var(--td-error-color-6);
    --td-success-color: var(--td-success-color-5);
    --td-brand-color-hover: var(--td-brand-color-6);
    --td-brand-color-focus: var(--td-brand-color-2);
    --td-brand-color-active: var(--td-brand-color-8);
    --td-brand-color-disabled: var(--td-brand-color-3);
    --td-brand-color-light: var(--td-brand-color-1);
    --td-brand-color-light-hover: var(--td-brand-color-2);
    --td-warning-color-hover: var(--td-warning-color-4);
    --td-warning-color-focus: var(--td-warning-color-2);
    --td-warning-color-active: var(--td-warning-color-6);
    --td-warning-color-disabled: var(--td-warning-color-3);
    --td-warning-color-light: var(--td-warning-color-1);
    --td-warning-color-light-hover: var(--td-warning-color-2);
    --td-error-color-hover: var(--td-error-color-5);
    --td-error-color-focus: var(--td-error-color-2);
    --td-error-color-active: var(--td-error-color-7);
    --td-error-color-disabled: var(--td-error-color-3);
    --td-error-color-light: var(--td-error-color-1);
    --td-error-color-light-hover: var(--td-error-color-2);
    --td-success-color-hover: var(--td-success-color-4);
    --td-success-color-focus: var(--td-success-color-2);
    --td-success-color-active: var(--td-success-color-6);
    --td-success-color-disabled: var(--td-success-color-3);
    --td-success-color-light: var(--td-success-color-1);
    --td-success-color-light-hover: var(--td-success-color-2);
    --td-mask-active: rgba(0, 0, 0, .6);
    --td-mask-disabled: rgba(255, 255, 255, .6);
    --td-bg-color-page: var(--td-gray-color-2);
    --td-bg-color-container: #fff;
    --td-bg-color-container-hover: var(--td-gray-color-1);
    --td-bg-color-container-active: var(--td-gray-color-3);
    --td-bg-color-container-select: #fff;
    --td-bg-color-secondarycontainer: var(--td-gray-color-1);
    --td-bg-color-secondarycontainer-hover: var(--td-gray-color-2);
    --td-bg-color-secondarycontainer-active: var(--td-gray-color-4);
    --td-bg-color-component: var(--td-gray-color-3);
    --td-bg-color-component-hover: var(--td-gray-color-4);
    --td-bg-color-component-active: var(--td-gray-color-6);
    --td-bg-color-secondarycomponent: var(--td-gray-color-4);
    --td-bg-color-secondarycomponent-hover: var(--td-gray-color-5);
    --td-bg-color-secondarycomponent-active: var(--td-gray-color-6);
    --td-bg-color-component-disabled: var(--td-gray-color-2);
    --td-bg-color-specialcomponent: #fff;
    --td-text-color-primary: var(--td-font-gray-1);
    --td-text-color-secondary: var(--td-font-gray-2);
    --td-text-color-placeholder: var(--td-font-gray-3);
    --td-text-color-disabled: var(--td-font-gray-4);
    --td-text-color-anti: #fff;
    --td-text-color-brand: var(--td-brand-color-7);
    --td-text-color-link: var(--td-brand-color-8);
    --td-border-level-1-color: var(--td-gray-color-3);
    --td-component-stroke: var(--td-gray-color-3);
    --td-border-level-2-color: var(--td-gray-color-4);
    --td-component-border: var(--td-gray-color-4);
    --td-shadow-1: 0 1px 10px rgba(0, 0, 0, .05), 0 4px 5px rgba(0, 0, 0, 8%), 0 2px 4px -1px rgba(0, 0, 0, 12%);
    --td-shadow-2: 0 3px 14px 2px rgba(0, 0, 0, .05), 0 8px 10px 1px rgba(0, 0, 0, 6%), 0 5px 5px -3px rgba(0, 0, 0, 10%);
    --td-shadow-3: 0 6px 30px 5px rgba(0, 0, 0, .05), 0 16px 24px 2px rgba(0, 0, 0, 4%), 0 8px 10px -5px rgba(0, 0, 0, 8%);
    --td-shadow-inset-top: inset 0 .5px 0 #dcdcdc;
    --td-shadow-inset-right: inset .5px 0 0 #dcdcdc;
    --td-shadow-inset-bottom: inset 0 -.5px 0 #dcdcdc;
    --td-shadow-inset-left: inset -.5px 0 0 #dcdcdc;
    --td-table-shadow-color: rgba(0, 0, 0, .08);
    --td-scrollbar-color: rgba(0, 0, 0, .1);
    --td-scrollbar-hover-color: rgba(0, 0, 0, .3);
    --td-scroll-track-color: #fff
}

.ldesign-account-selection {
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-m)
}

.ldesign-account-selection__date {
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-disabled)
}

.ldesign-account-selection__title {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary)
}

.ldesign-account-selection__list {
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-s);
    margin-top: var(--td-comp-margin-m)
}

.ldesign-account-selection__item {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-m);
    border-radius: var(--td-radius-medium);
    background-color: var(--td-bg-color-container);
    cursor: pointer;
    background-color: var(--td-bg-color-container-hover);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    display: flex;
    justify-content: space-between
}

.ldesign-account-selection__item:hover {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-account-selection__footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: var(--td-comp-margin-s)
}

.ldesign-account-selection__footer-text {
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-primary)
}

:root[theme-mode=dark] img,
:root[theme-mode=dark] svg {
    filter: brightness(70%) contrast(120%)
}

:root[weakness=true] {
    filter: invert(100%)
}

:root[grayscale=true] {
    filter: grayscale(100%)
}

img {
    filter: hue-rotate(var(--hue-rotate))
}

input:-webkit-autofill {
    -webkit-background-clip: text
}

html {
    font-size: 20px
}

html,
body {
    margin: 0;
    height: 100%;
    overflow: hidden;
    font-family: var(--td-font-family)
}

#app {
    height: 100%;
    overflow: hidden
}

#nprogress .bar {
    background: var(--td-brand-color-3);
    height: calc(var(--td-comp-size-xxxs) * .1)
}

#nprogress .peg {
    box-shadow: 0 0 var(--td-comp-size-xxxs) var(--td-brand-color), 0 0 calc(var(--td-comp-size-xxxs) / 2) var(--td-brand-color-hover)
}

.arco-affix {
    position: fixed;
    z-index: 100
}

.ldesign-web {
    height: 100%
}

* {
    -webkit-tap-highlight-color: transparent
}

.ldesign-widget-asider {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    color: inherit;
    background-size: 100% auto;
    transition: width var(--desktop-layout-transition), background-color var(--desktop-layout-transition);
    background-position: left bottom
}

.ldesign-widget-asider__header {
    height: var(--desktop-layout-header-height);
    display: flex;
    flex-direction: row;
    width: 100%;
    box-sizing: border-box;
    align-items: center;
    color: inherit;
    padding: 0 var(--td-comp-margin-m)
}

.ldesign-widget-asider__header .ldesign-widget-logo {
    flex: 1
}

.ldesign-widget-asider__header .l-button {
    color: inherit
}

.ldesign-widget-asider__header:empty {
    display: none
}

.ldesign-widget-asider__content {
    flex: 1;
    overflow: hidden
}

.ldesign-widget-asider__footer {
    height: var(--desktop-layout-header-height);
    display: flex;
    flex-direction: row;
    align-items: center;
    color: inherit;
    padding: 0 var(--td-comp-margin-m)
}

.ldesign-widget-asider__footer .l-button {
    color: inherit
}

.ldesign-widget-asider__footer:empty {
    height: var(--desktop-layout-padding)
}

.ldesign-widget-asider.is-aside-mini,
.ldesign-widget-asider.is-header,
.ldesign-widget-asider.is-header-nav,
.ldesign-widget-asider.is-header-nav-light {
    background-image: none
}

.ldesign-widget-asider.is-dark {
    background-image: none;
    color: var(--td-text-color-primary)
}

.ldesign-widget-bookmark {
    display: flex;
    height: 100%;
    padding: 0 var(--desktop-layout-padding);
    transition: inherit;
    color: inherit
}

.ldesign-widget-bookmark__content {
    flex: 1;
    overflow: auto;
    scroll-behavior: smooth;
    -ms-overflow-style: none
}

@-moz-document url-prefix() {
    .ldesign-widget-bookmark__content {
        scrollbar-width: none;
        overflow: -moz-scrollbars-none
    }
}

.ldesign-widget-bookmark__content::-webkit-scrollbar {
    display: none;
    width: 0 !important
}

.ldesign-widget-bookmark__content,
.ldesign-widget-bookmark__prefix,
.ldesign-widget-bookmark__suffix {
    height: 100%;
    display: flex;
    align-items: center;
    transition: var(--desktop-layout-transition);
    color: inherit
}

.ldesign-widget-bookmark__content .l-button,
.ldesign-widget-bookmark__prefix .l-button,
.ldesign-widget-bookmark__suffix .l-button {
    -webkit-tap-highlight-color: transparent;
    color: inherit
}

.ldesign-widget-bookmark__prefix:not(:empty)+.ldesign-widget-bookmark__content {
    margin-left: var(--desktop-layout-padding)
}

.ldesign-widget-bookmark__suffix:not(:empty) {
    margin-left: var(--desktop-layout-padding)
}

.ldesign-widget-bookmark__prefix,
.ldesign-widget-bookmark__suffix {
    gap: var(--td-comp-margin-s)
}

.ldesign-widget-bookmark__prefix .l-button:hover,
.ldesign-widget-bookmark__suffix .l-button:hover,
.ldesign-widget-bookmark__prefix .active,
.ldesign-widget-bookmark__suffix .active {
    background-color: var(--td-bg-color-container-active)
}

.ldesign-widget-bookmark__list {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 100%;
    list-style: none;
    margin: 0;
    box-sizing: border-box;
    padding: 0;
    color: inherit;
    flex-wrap: nowrap;
    transition: inherit
}

.ldesign-widget-bookmark__list.is-variant--chrome {
    padding-top: calc(var(--td-comp-margin-xxs) * .5)
}

.ldesign-widget-bookmark__list.is-variant--chrome .ldesign-widget-bookmark__list-item {
    border-top: none;
    position: relative;
    margin: 0 calc(var(--td-comp-size-xxxs) * -.7);
    padding: 0 var(--td-comp-paddingLR-m);
    cursor: pointer;
    transition: .2s;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M100 100C44.772 100 0 55.228 0 0v100h100z' fill='%23F8EAE7'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 100c55.228 0 100-44.772 100-100v100H0z' fill='%23F8EAE7'/%3E%3C/svg%3E"), url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect rx='12' width='100%' height='100%' fill='%23F8EAE7'/></svg>");
    mask-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M100 100C44.772 100 0 55.228 0 0v100h100z' fill='%23F8EAE7'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 100c55.228 0 100-44.772 100-100v100H0z' fill='%23F8EAE7'/%3E%3C/svg%3E"), url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect rx='12' width='100%' height='100%' fill='%23F8EAE7'/></svg>");
    -webkit-mask-size: calc(var(--td-comp-size-xxxs) * .7) calc(var(--td-comp-size-xxxs) * .7), calc(var(--td-comp-size-xxxs) * .7) calc(var(--td-comp-size-xxxs) * .7), calc(100% - calc(var(--td-comp-size-xxxs) * 1.4)) calc(100% + calc(var(--td-comp-size-xxxs) * .7));
    mask-size: calc(var(--td-comp-size-xxxs) * .7) calc(var(--td-comp-size-xxxs) * .7), calc(var(--td-comp-size-xxxs) * .7) calc(var(--td-comp-size-xxxs) * .7), calc(100% - calc(var(--td-comp-size-xxxs) * 1.4)) calc(100% + calc(var(--td-comp-size-xxxs) * .7));
    -webkit-mask-position: right bottom, left bottom, center top;
    mask-position: right bottom, left bottom, center top;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

.ldesign-widget-bookmark__list.is-variant--chrome .ldesign-widget-bookmark__list-item.active {
    color: var(--td-text-color-primary)
}

.ldesign-widget-bookmark__list.is-variant--chrome .ldesign-widget-bookmark__list-item.active:before {
    display: none
}

.ldesign-widget-bookmark__list.is-variant--chrome .ldesign-widget-bookmark__list-item.active+.ldesign-widget-bookmark__list-item:before {
    display: none
}

.ldesign-widget-bookmark__list.is-variant--chrome .ldesign-widget-bookmark__list-item:before {
    left: calc(var(--td-comp-size-xxxs) * .7)
}

.ldesign-widget-bookmark__list-icon {
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-large);
    color: inherit;
    position: relative;
    z-index: 2;
    margin-right: var(--td-comp-margin-xs)
}

.ldesign-widget-bookmark__list-icon:empty {
    display: none;
    margin: 0
}

.ldesign-widget-bookmark__list-icon:not(:empty)+.ldesign-widget-bookmark__list-title:before {
    left: calc(var(--td-comp-margin-s) * -3)
}

.ldesign-widget-bookmark__list-item {
    display: flex;
    align-items: center;
    height: 100%;
    cursor: pointer;
    border-top: 2px solid transparent;
    box-sizing: border-box;
    transition: inherit;
    position: relative;
    -webkit-tap-highlight-color: transparent
}

.ldesign-widget-bookmark__list-item:hover .ldesign-widget-bookmark__list-title:before {
    opacity: 1
}

.ldesign-widget-bookmark__list-item:first-child:before {
    display: none
}

.ldesign-widget-bookmark__list-item:before {
    content: "";
    display: block;
    width: 1px;
    height: var(--td-font-size-body-medium);
    background-color: var(--td-border-level-2-color);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-50%, -50%)
}

.ldesign-widget-bookmark__list-item.active {
    border-top-color: var(--td-brand-color);
    background-color: var(--td-bg-color-container)
}

.ldesign-widget-bookmark__list-item.active .ldesign-widget-bookmark__list-wrap {
    padding: 0 calc(var(--td-comp-paddingLR-l) + var(--td-comp-size-xs)) 0 var(--td-comp-paddingLR-l)
}

.ldesign-widget-bookmark__list-item:hover .ldesign-widget-bookmark__list-close,
.ldesign-widget-bookmark__list-item.active .ldesign-widget-bookmark__list-close,
.ldesign-widget-bookmark__list-item:hover .ldesign-widget-bookmark__list-lock,
.ldesign-widget-bookmark__list-item.active .ldesign-widget-bookmark__list-lock {
    transform: translate(-100%, -50%) scale(1);
    opacity: 1
}

.ldesign-widget-bookmark__list-close,
.ldesign-widget-bookmark__list-lock {
    display: inline-flex;
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs);
    align-items: center;
    justify-content: center;
    font-size: var(--td-font-size-body-medium);
    color: inherit;
    border-radius: 50%;
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%) scale(0);
    opacity: 0;
    margin-left: calc((var(--td-comp-paddingLR-l) + var(--td-comp-size-xs) - var(--td-comp-size-xs)) / -2);
    box-sizing: border-box
}

.ldesign-widget-bookmark__list-close:hover,
.ldesign-widget-bookmark__list-lock:hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-widget-bookmark__list-close:hover:not(.active),
.ldesign-widget-bookmark__list-lock:hover:not(.active) {
    background-color: var(--td-bg-color-container-active)
}

.ldesign-widget-bookmark__list-wrap {
    display: flex;
    align-items: center;
    height: 100%;
    position: relative;
    padding: 0 calc(var(--td-comp-paddingLR-l)) 0 var(--td-comp-paddingLR-l);
    transition: inherit
}

.ldesign-widget-bookmark__list-wrap:hover {
    padding: 0 calc(var(--td-comp-paddingLR-l) + var(--td-comp-size-xs)) 0 var(--td-comp-paddingLR-l)
}

.ldesign-widget-bookmark__list-title {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    white-space: nowrap;
    margin: 0;
    position: relative;
    z-index: 1
}

.ldesign-widget-bookmark__list-title:before {
    content: "";
    display: block;
    position: absolute;
    top: calc(var(--td-comp-margin-s) * -.3);
    left: calc(var(--td-comp-margin-s) * -.8);
    right: calc(var(--td-comp-margin-s) * -.8);
    bottom: calc(var(--td-comp-margin-s) * -.3);
    background-color: var(--td-bg-color-container);
    opacity: 0;
    transition: .2s;
    border-radius: var(--td-comp-size-m)
}

.ldesign-widget-bookmark__list-title-label {
    position: relative;
    z-index: 2
}

.ldesign-widget-bookmark__list.is-layout--header .ldesign-widget-bookmark__list-item,
.ldesign-widget-bookmark__list.is-layout--header-nav .ldesign-widget-bookmark__list-item {
    border-bottom: 2px solid transparent;
    border-top: none
}

.ldesign-widget-bookmark__list.is-layout--header .ldesign-widget-bookmark__list-item.active,
.ldesign-widget-bookmark__list.is-layout--header-nav .ldesign-widget-bookmark__list-item.active {
    border-bottom-color: var(--td-brand-color)
}

.ldesign-widget-bookmark__list.is-variant--light {
    padding-top: var(--td-comp-paddingTB-xs)
}

.ldesign-widget-bookmark__list.is-variant--light .ldesign-widget-bookmark__list-item {
    border-top: none;
    border-radius: var(--desktop-layout-radius) var(--desktop-layout-radius) 0 0
}

.ldesign-widget-bookmark__dropdown {
    list-style: none;
    padding: 0;
    margin: 0;
    border-radius: inherit;
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-xs)
}

.ldesign-widget-bookmark__dropdown-item {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-m);
    padding: 0 var(--td-comp-paddingLR-l);
    cursor: pointer;
    border-radius: inherit
}

.ldesign-widget-bookmark__dropdown-item:hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-widget-bookmark__dropdown-label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    margin: 0
}

.ldesign-widget-bookmark__popup {
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-xs)
}

.ldesign-widget-bookmark__popup .l-button {
    -webkit-tap-highlight-color: transparent
}

.ldesign-widget-bookmark__context {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    border-radius: inherit;
    gap: var(--td-comp-margin-xxs)
}

.ldesign-widget-bookmark__context-item {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-l);
    padding: 0 var(--td-comp-paddingLR-xs);
    cursor: pointer;
    border-radius: inherit;
    gap: var(--td-comp-margin-xxs)
}

.ldesign-widget-bookmark__context-item:hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-widget-bookmark__context-icon {
    display: flex;
    align-items: center
}

.ldesign-widget-bookmark__context-label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    margin: 0;
    min-width: 4em
}

.ldesign-widget-bookmark__toolbar {
    width: 100%
}

.ldesign-widget-bookmark__toolbar.l-space-vertical .l-button {
    justify-content: flex-start;
    padding: 0 var(--td-comp-paddingLR-s)
}

.bookmark-enter-active,
.bookmark-leave-active {
    transition: all .2s ease
}

.bookmark-enter-from,
.bookmark-leave-to {
    opacity: 0;
    transform: translate(30px)
}

.ldesign-widget-breadcrumb {
    display: flex;
    align-items: center;
    padding: 0 var(--desktop-layout-padding);
    height: 100%;
    color: inherit
}

.ldesign-widget-breadcrumb__prefix {
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    margin-right: var(--td-comp-margin-s)
}

.ldesign-widget-breadcrumb__prefix .l-icon,
.ldesign-widget-breadcrumb__prefix__home-icon {
    cursor: pointer
}

.ldesign-widget-breadcrumb__prefix .l-icon:hover,
.ldesign-widget-breadcrumb__prefix__home-icon:hover {
    color: var(--td-brand-color)
}

.ldesign-widget-breadcrumb .l-breadcrumb__item.is-active {
    cursor: default;
    color: var(--td-text-color-secondary)
}

.ldesign-widget-breadcrumb .l-breadcrumb__item.is-clickable {
    cursor: pointer
}

.ldesign-widget-breadcrumb .l-breadcrumb__item.is-clickable:hover {
    color: var(--td-brand-color)
}

.ldesign-widget-breadcrumb .l-breadcrumb__inner-text {
    font-size: var(--td-font-size-body-medium)
}

.ldesign-widget-colorlist {
    font: inherit;
    width: 100%;
    display: grid;
    gap: var(--td-comp-margin-s)
}

.ldesign-widget-colorlist__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--td-comp-size-l) * 4), 1fr));
    gap: var(--td-comp-margin-xs)
}

.ldesign-widget-colorlist__list-item {
    display: grid;
    grid-template-columns: var(--td-comp-size-xxs) 1fr;
    grid-template-rows: var(--td-font-size-body-medium) var(--td-font-size-body-small);
    grid-template-areas: "color label" "color value";
    align-items: flex-start;
    gap: var(--td-comp-margin-xxs) var(--td-comp-margin-xs);
    border: 1px solid var(--td-border-level-1-color);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-xs);
    cursor: pointer;
    color: var(--td-text-color-primary)
}

.ldesign-widget-colorlist__list-item.is-active {
    border-color: var(--td-brand-color)
}

.ldesign-widget-colorlist__list-label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    margin: 0;
    grid-area: label;
    line-height: 1
}

.ldesign-widget-colorlist__list-color {
    grid-area: color;
    display: inline-flex;
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium))
}

.ldesign-widget-colorlist__list-value {
    grid-area: value;
    margin: 0;
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-placeholder);
    line-height: 1
}

.ldesign-widget-colormode {
    display: block
}

.ldesign-widget-colormode__handler {
    color: inherit
}

::view-transition-old(root),
::view-transition-new(root) {
    animation: none;
    mix-blend-mode: normal
}

.dark::view-transition-old(root) {
    z-index: 1
}

.dark::view-transition-new(root) {
    z-index: 999
}

::view-transition-old(root) {
    z-index: 999
}

::view-transition-new(root) {
    z-index: 1
}

.ldesign-widget-demo {
    display: block
}

.ldesign-widget-fullscreen {
    color: inherit
}

.ldesign-widget-header {
    display: grid;
    grid-template-columns: 1fr auto auto;
    height: 100%;
    align-items: center;
    padding: 0 var(--desktop-layout-padding);
    gap: var(--desktop-layout-padding);
    overflow: hidden;
    color: inherit
}

.ldesign-widget-header__suffix {
    display: flex;
    align-items: center;
    gap: calc(var(--desktop-layout-padding) / 2);
    flex-shrink: 0;
    justify-content: flex-end;
    flex-wrap: nowrap
}

.ldesign-widget-header__suffix,
.ldesign-widget-header__content,
.ldesign-widget-header__prefix {
    min-width: 0;
    color: inherit
}

.ldesign-widget-header .l-button {
    -webkit-tap-highlight-color: transparent;
    color: inherit
}

.ldesign-widget-header .l-button.is-active {
    color: var(--td-brand-color)
}

.ldesign-widget-header.is-device--mobile .ldesign-widget-header__suffix {
    gap: var(--td-comp-margin-s)
}

.ldesign-widget-header.is-layout--header .l-button,
.ldesign-widget-header.is-layout--header-nav .l-button,
.ldesign-widget-header.is-layout--header-nav-light .l-button {
    color: inherit;
    --ripple-color: transparent !important
}

.ldesign-widget-header.is-layout--header .l-button:hover,
.ldesign-widget-header.is-layout--header-nav .l-button:hover,
.ldesign-widget-header.is-layout--header-nav-light .l-button:hover {
    background-color: var(--td-brand-color-hover);
    border-color: var(--td-brand-color-hover)
}

.ldesign-widget-header.is-layout--header .l-button.is-active,
.ldesign-widget-header.is-layout--header-nav .l-button.is-active,
.ldesign-widget-header.is-layout--header-nav-light .l-button.is-active {
    background-color: var(--td-brand-color-active);
    color: var(--td-text-color-anti)
}

.ldesign-widget-login-background {
    height: 100%;
    position: relative
}

.ldesign-widget-login-background__content,
.ldesign-widget-login-background__core {
    height: 100%
}

.ldesign-widget-login-background__core img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.ldesign-widget-login-background__logo {
    position: absolute;
    top: var(--td-comp-margin-l);
    left: var(--td-comp-margin-l);
    z-index: 10
}

.ldesign-widget-login-banner {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti)
}

.ldesign-widget-login-banner:hover img {
    transform: scale(1.008)
}

.ldesign-widget-login-banner__content,
.ldesign-widget-login-banner__core {
    height: 100%
}

.ldesign-widget-login-banner__core img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .2s
}

.ldesign-widget-login-banner__logo {
    position: absolute;
    top: var(--td-comp-margin-l);
    left: var(--td-comp-margin-l);
    z-index: 10
}

.ldesign-widget-login-banner__toolbar {
    position: absolute;
    z-index: 2;
    background-color: var(--td-bg-color-container);
    border-radius: var(--td-comp-size-l);
    padding: 0 var(--td-comp-paddingLR-xs);
    top: var(--td-comp-margin-m);
    left: var(--td-comp-margin-m);
    box-shadow: var(--td-shadow-1);
    overflow: hidden
}

.ldesign-widget-login-footer {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
    gap: var(--td-comp-margin-xs)
}

.ldesign-widget-login-footer__links,
.ldesign-widget-login-footer__qrcodes {
    display: none
}

.ldesign-widget-login-footer__copyright {
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary);
    text-align: center;
    line-height: var(--td-comp-size-l)
}

.ldesign-widget-login-footer.is-layout--banner-in-middle {
    gap: var(--td-comp-margin-l);
    display: flex;
    justify-content: flex-end
}

.ldesign-widget-login-footer.is-layout--banner-in-middle .ldesign-widget-login-footer__copyright {
    text-align: right;
    line-height: var(--td-comp-size-m)
}

.ldesign-widget-login-footer.is-layout--default {
    display: flex;
    align-items: center
}

.ldesign-widget-login-footer.is-layout--panel-in-center {
    grid-template-columns: auto auto 1fr;
    gap: 0
}

.ldesign-widget-login-header {
    display: flex;
    align-items: center;
    width: 100%
}

.ldesign-widget-login-header__content {
    flex: 1;
    display: flex
}

.ldesign-widget-login-header__content .ldesign-widget-logo {
    min-width: 140px
}

.ldesign-widget-login-header__welcome {
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-s)
}

.ldesign-widget-login-header__welcome h2 {
    font-size: var(--td-font-size-title-large);
    font-weight: 400;
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-widget-login-header__welcome p {
    font-size: var(--td-font-size-headline-medium);
    font-weight: 700;
    margin: 0
}

.ldesign-widget-login-links__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--td-comp-margin-xs)
}

.ldesign-widget-login-links__list-item {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-xxs);
    cursor: pointer
}

.ldesign-widget-login-links__list-item .l-image {
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs)
}

.ldesign-widget-login-links__list-item .l-image__wrapper {
    display: flex;
    align-items: center
}

.ldesign-widget-login-links__list-label {
    font-size: var(--td-font-size-body-small);
    font-weight: 400;
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-widget-login-links__handler.active,
.ldesign-widget-login-links__handler:hover {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-widget-login-links.is-layout--default .ldesign-widget-login-links__list {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-l)
}

.ldesign-widget-login-captcha {
    gap: var(--td-comp-margin-m)
}

.ldesign-widget-login-captcha.is-size--large .l-image__wrapper {
    height: var(--td-comp-size-xl);
    min-width: calc(var(--td-comp-size-xl) * 3);
    cursor: pointer
}

.ldesign-widget-login-captcha .l-col:first-child {
    flex: 1;
    overflow: hidden
}

.ldesign-widget-login-captcha .l-col:last-child {
    flex: 0 0 auto
}

.ldesign-widget-login-captcha__image {
    border-radius: var(--td-radius-medium)
}

.ldesign-widget-login-password {
    font: inherit
}

.ldesign-widget-login-remember {
    width: 100%
}

.ldesign-widget-login-remember.is-size--small {
    font-size: var(--td-font-size-body-small)
}

.ldesign-widget-login-remember .l-link,
.ldesign-widget-login-remember .l-checkbox__label,
.ldesign-widget-login-remember .l-checkbox {
    font-size: inherit
}

.ldesign-widget-login-submit,
.ldesign-widget-login-username {
    font: inherit
}

.ldesign-widget-login__form {
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-l)
}

.ldesign-widget-login__form.is-size--large {
    gap: var(--td-comp-margin-xl)
}

.ldesign-widget-login__form.is-size--small {
    gap: var(--td-comp-margin-xs)
}

.ldesign-widget-login__form .l-form__item {
    margin: 0
}

.ldesign-widget-login__form .l-form__label {
    display: none
}

.ldesign-widget-login__panel-title {
    font-size: var(--td-font-size-title-large);
    margin: 0;
    color: var(--td-text-color-primary);
    display: inline-flex;
    align-items: center;
    font-weight: 700;
    position: relative
}

.ldesign-widget-login__panel-title span {
    position: relative
}

.ldesign-widget-login__panel-title span b {
    position: relative;
    z-index: 2
}

.ldesign-widget-login__panel-title span:after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 50%;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: var(--td-brand-color-light)
}

.ldesign-widget-login__tabs {
    padding: 0;
    display: flex;
    list-style: none;
    margin: 0;
    position: relative;
    gap: var(--td-comp-margin-l)
}

.ldesign-widget-login__tabs-item {
    display: flex;
    height: var(--td-comp-size-xl);
    align-items: center;
    padding: 0 var(--td-comp-paddingLR-xl);
    font-size: var(--td-font-size-title-medium);
    color: var(--td-text-color-primary);
    cursor: pointer;
    position: relative;
    z-index: 2
}

.ldesign-widget-login__tabs-item.active {
    color: var(--td-brand-color);
    font-weight: 700
}

.ldesign-widget-login__tabs-indicator {
    display: block;
    width: 4em;
    height: var(--td-comp-size-xl);
    background-color: var(--td-brand-color-light);
    position: absolute;
    top: calc(50% - var(--td-comp-size-xl) / 2);
    left: 0;
    border-radius: var(--td-radius-medium);
    transition: .2s
}

.ldesign-widget-login-qrcodes__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: var(--td-comp-margin-l)
}

.ldesign-widget-login-qrcodes__list-item {
    display: flex;
    gap: var(--td-comp-margin-xxs);
    cursor: pointer;
    flex-direction: column;
    align-items: center
}

.ldesign-widget-login-qrcodes__list-item .l-image {
    width: calc(var(--td-comp-size-l) * 2.5);
    height: calc(var(--td-comp-size-l) * 2.5);
    background-color: var(--td-bg-color-container);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-xs);
    border-radius: var(--td-radius-default)
}

.ldesign-widget-login-qrcodes__list-item .l-image__wrapper {
    display: flex;
    align-items: center
}

.ldesign-widget-login-qrcodes__list-label {
    font-size: var(--td-font-size-body-small);
    font-weight: 400;
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-widget-login-qrcodes__handler.active,
.ldesign-widget-login-qrcodes__handler:hover {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-widget-login-qrcodes.is-layout--default .ldesign-widget-login-links__list {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-l)
}

.ldesign-widget-login-toolbar {
    display: block;
    z-index: 100;
    border: none
}

.ldesign-widget-login-toolbar .l-sticky-item--compact {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: var(--td-comp-margin-xxs)
}

.ldesign-widget-login-toolbar .l-sticky-item--compact .l-icon {
    margin: 0
}

.ldesign-widget-login-toolbar .l-sticky-item--compact.active {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-widget-login-toolbar .l-sticky-item--compact.active .l-icon {
    color: inherit
}

.ldesign-widget-logo {
    display: flex;
    align-items: center;
    overflow: hidden;
    gap: var(--td-comp-margin-xs);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent
}

.ldesign-widget-logo__label {
    font-size: var(--td-font-size-title-large);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1
}

.ldesign-widget-logo__img {
    display: inline-flex;
    align-items: center;
    font-size: var(--td-font-size-title-large)
}

.ldesign-widget-logo__img img {
    height: 1.6em
}

.ldesign-widget-logo.is-size--large .ldesign-widget-logo__label {
    font-size: var(--td-font-size-headline-small)
}

.ldesign-widget-logo.is-logo-only {
    justify-content: center
}

.ldesign-widget-logo.is-logo-only .ldesign-widget-logo__label {
    display: none
}

.ldesign-widget-logo.is-device--mobile.is-placement--login .ldesign-widget-logo__label {
    font-size: var(--td-font-size-headline-small)
}

.ldesign-widget-logo.is-device--mobile.is-placement--layout .ldesign-widget-logo__label {
    display: none
}

.ldesign-widget-menu {
    color: var(--td-text-color-primary)
}

.ldesign-widget-menu__icon {
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-large)
}

.ldesign-widget-menu__icon:not(:empty) {
    margin-right: var(--td-comp-margin-s)
}

.ldesign-widget-menu__icon .l-icon {
    width: 1em !important;
    height: 1em !important;
    display: inline-flex;
    align-items: center
}

.ldesign-widget-menu.l-default-menu {
    display: block;
    background: none;
    color: inherit;
    width: 100% !important
}

.ldesign-widget-menu.l-default-menu.l-is-collapsed .ldesign-widget-menu__icon {
    margin: 0
}

.ldesign-widget-menu.l-default-menu.l-is-collapsed .l-fade-arrow {
    display: inline-block
}

.ldesign-widget-menu.l-default-menu.l-is-collapsed .l-menu__item span {
    display: inline-block;
    width: 0;
    overflow: hidden
}

.ldesign-widget-menu.l-default-menu .l-menu {
    color: inherit
}

@-moz-document url-prefix() {
    .ldesign-widget-menu.l-default-menu .l-menu--scroll {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-widget-menu.l-default-menu .l-menu--scroll::-webkit-scrollbar {
    width: 2px;
    height: 2px
}

.ldesign-widget-menu.l-default-menu .l-menu--scroll::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 3px
}

.ldesign-widget-menu.l-default-menu .l-menu--scroll::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-widget-menu.l-default-menu .l-menu--scroll::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-widget-menu.l-default-menu .l-menu__item {
    color: inherit;
    transition: .3s;
    --ripple-color: var(--td-brand-color-hover);
    border-radius: var(--desktop-layout-radius, var(--td-radius-default));
    -webkit-tap-highlight-color: transparent
}

.ldesign-widget-menu.l-default-menu .l-menu__item:hover:not(.l-is-active):not(.l-is-disabled) {
    background-color: #0000001a
}

.ldesign-widget-menu.l-default-menu .l-menu__item.l-is-opened,
.ldesign-widget-menu.l-default-menu .l-menu__item.l-is-opened .l-icon {
    color: inherit
}

.ldesign-widget-menu.l-default-menu .l-menu__item.l-is-active:not(.l-is-opened) {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-widget-menu.l-default-menu .l-menu__item.l-is-active:not(.l-is-opened) .l-icon {
    color: inherit
}

.ldesign-widget-menu.l-default-menu.is-light .l-menu__item {
    --ripple-color: var(--td-brand-color-2)
}

.ldesign-widget-menu.l-default-menu.is-light .l-menu__item:hover:not(.l-is-active):not(.l-is-disabled) {
    background-color: var(--td-brand-color-light)
}

.ldesign-widget-menu.l-default-menu.is-light .l-menu__item.l-is-active:not(.l-is-opened) {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-widget-mobile-action {
    display: flex;
    transition: .2s;
    flex: 1;
    overflow: hidden;
    width: 100%;
    height: 100%
}

.ldesign-widget-mobile-action__nav {
    width: calc(var(--td-comp-size-l) * 6);
    border-right: 1px solid var(--td-border-level-1-color);
    box-sizing: border-box;
    overflow: auto;
    height: 100%
}

.ldesign-widget-mobile-action__nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-s);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m)
}

.ldesign-widget-mobile-action__nav-list-item {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-xl);
    border: 1px solid var(--td-border-level-1-color);
    border-radius: var(--td-radius-medium);
    padding: 0 var(--td-comp-paddingLR-s);
    gap: var(--td-comp-margin-xs);
    color: var(--td-text-color-primary);
    cursor: pointer
}

.ldesign-widget-mobile-action__nav-list-item.is-active {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color);
    border-color: var(--td-brand-color-5)
}

.ldesign-widget-mobile-action__nav-list-label {
    flex: 1;
    font-size: var(--td-font-size-body-medium);
    margin: 0;
    font-weight: 400
}

.ldesign-widget-mobile-action__nav-list-icon {
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-title-large)
}

.ldesign-widget-mobile-action__nav-list-icon svg {
    width: 1em;
    height: 1em;
    fill: currentColor
}

.ldesign-widget-mobile-action__frame .l-drawer__header {
    padding: 0 var(--td-comp-paddingLR-m)
}

.ldesign-widget-mobile-action__title {
    display: inline-flex;
    align-items: center;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
    gap: var(--td-comp-margin-xxs)
}

.ldesign-widget-mobile-action__title span {
    color: var(--td-text-color-primary);
    display: flex;
    align-items: center
}

.ldesign-widget-mobile-action__content {
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden
}

.ldesign-widget-mobile-action__content-view {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);
    flex: 1;
    overflow: auto;
    box-sizing: border-box
}

@-moz-document url-prefix() {
    .ldesign-widget-mobile-action__content-view {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-widget-mobile-action__content-view::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.ldesign-widget-mobile-action__content-view::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 11px
}

.ldesign-widget-mobile-action__content-view::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-widget-mobile-action__content-view::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-widget-mobile-action.is-device--tablet {
    grid-template-columns: 40% 1fr
}

.ldesign-widget-mobile-action.is-device--mobile {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 200%;
    overflow: hidden
}

.ldesign-widget-mobile-action.is-device--mobile.is-swipe {
    transform: translate(-50%);
    overflow: visible
}

.ldesign-widget-mobile-action.is-device--mobile .ldesign-widget-mobile-action__nav {
    flex: 0 0 auto;
    width: auto
}

.ldesign-widget-mobile-action.is-device--mobile .ldesign-widget-mobile-action__content {
    flex: 0 0 auto
}

.ldesign-widget-mobile-menu {
    display: flex
}

.ldesign-widget-mobile-menu__handler {
    z-index: 10
}

.ldesign-widget-mobile-menu__handler.is-active .l-button {
    border-left: none
}

.ldesign-widget-mobile-menu__handler .l-button {
    -webkit-tap-highlight-color: transparent
}

.ldesign-widget-mobile-menu__frame .l-drawer__header {
    padding: 0 var(--td-comp-paddingLR-m)
}

.ldesign-widget-mobile-menu__content .l-drawer__header {
    display: none
}

.ldesign-widget-mobile-menu__content .l-drawer__body {
    padding: 0;
    -ms-overflow-style: none
}

@-moz-document url-prefix() {
    .ldesign-widget-mobile-menu__content .l-drawer__body {
        scrollbar-width: none;
        overflow: -moz-scrollbars-none
    }
}

.ldesign-widget-mobile-menu__content .l-drawer__body::-webkit-scrollbar {
    display: none;
    width: 0 !important
}

.ldesign-widget-nav {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    background-size: 100% auto;
    background-position: bottom center
}

.ldesign-widget-nav__content {
    flex: 1;
    overflow: auto;
    position: relative;
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-xs);
    -ms-overflow-style: none
}

@-moz-document url-prefix() {
    .ldesign-widget-nav__content {
        scrollbar-width: none;
        overflow: -moz-scrollbars-none
    }
}

.ldesign-widget-nav__content::-webkit-scrollbar {
    display: none;
    width: 0 !important
}

.ldesign-widget-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    color: inherit;
    gap: var(--td-comp-margin-m)
}

.ldesign-widget-nav__list-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    gap: var(--td-comp-margin-xxs);
    padding: var(--td-comp-paddingTB-s) 0;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    z-index: 2;
    color: inherit
}

.ldesign-widget-nav__list-item.active {
    color: var(--td-text-color-anti)
}

.ldesign-widget-nav__list-item.active .ldesign-widget-nav__list-icon {
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti)
}

.ldesign-widget-nav__list-label {
    margin: 0;
    font-size: var(--td-font-size-body-small);
    width: 2em;
    text-align: center;
    line-height: 1.2;
    color: inherit
}

.ldesign-widget-nav__list-icon {
    font-size: var(--td-font-size-body-medium);
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    display: flex;
    align-items: center;
    transition: var(--desktop-layout-transition);
    justify-content: center;
    background-color: var(--td-brand-color-light);
    border-radius: var(--desktop-layout-radius);
    color: var(--td-brand-color)
}

.ldesign-widget-nav__list-icon .ldesign-svgicon {
    font-size: inherit;
    --width: var(--td-comp-size-xxxs)
}

.ldesign-widget-nav__list.is-horizontal {
    flex-direction: row;
    background-position: center bottom
}

.ldesign-widget-nav__list.is-horizontal .ldesign-widget-nav__list-item {
    flex-direction: row;
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-m) var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xs)
}

.ldesign-widget-nav__list.is-horizontal .ldesign-widget-nav__list-icon {
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs);
    background-color: transparent;
    color: inherit
}

.ldesign-widget-nav__list.is-horizontal .ldesign-widget-nav__list-label {
    width: auto;
    white-space: nowrap;
    font-size: var(--td-font-size-body-medium)
}

.ldesign-widget-nav__suffix,
.ldesign-widget-nav__prefix {
    display: flex;
    justify-content: center;
    height: var(--desktop-layout-header-height);
    align-items: center
}

.ldesign-widget-nav__suffix .l-button,
.ldesign-widget-nav__prefix .l-button {
    color: inherit
}

.ldesign-widget-nav__suffix .l-button:hover,
.ldesign-widget-nav__prefix .l-button:hover {
    background-color: var(--td-brand-color-2);
    color: var(--td-brand-color)
}

.ldesign-widget-nav__indicator {
    position: absolute;
    display: block;
    height: 2em;
    z-index: 1;
    background-color: var(--td-brand-color-active);
    top: 0;
    left: var(--td-comp-paddingLR-xs);
    right: var(--td-comp-paddingLR-xs);
    transition: var(--desktop-layout-transition);
    border-radius: var(--desktop-layout-radius)
}

.ldesign-widget-nav.is-light .ldesign-widget-nav__indicator {
    background-color: var(--td-brand-color-2)
}

.ldesign-widget-nav.is-light.is-horizontal .ldesign-widget-nav__indicator {
    background-color: var(--td-brand-color)
}

.ldesign-widget-nav.is-horizontal {
    flex-direction: row;
    padding: 0 var(--desktop-layout-padding);
    align-items: center
}

.ldesign-widget-nav.is-horizontal .ldesign-widget-nav__content {
    padding-left: 0;
    padding-right: 0
}

.ldesign-widget-nav.is-horizontal .ldesign-widget-nav__suffix {
    padding-left: var(--desktop-layout-padding)
}

.ldesign-widget-nav.is-device--mobile .ldesign-widget-nav__suffix {
    padding: 0
}

.ldesign-widget-user {
    display: grid;
    gap: var(--td-comp-margin-l);
    box-sizing: border-box
}

.ldesign-widget-user__handler {
    display: inline-flex;
    padding: 0 var(--td-comp-paddingLR-xxs) 0 calc(var(--td-comp-paddingLR-xxs) / 2);
    border-radius: var(--td-comp-size-l)
}

.ldesign-widget-user__handler.is-active {
    color: var(--td-brand-color)
}

.ldesign-widget-user__handler.avatar-only {
    padding: 0
}

.ldesign-widget-user__handler.avatar-only .l-image__wrapper {
    margin: 0
}

.ldesign-widget-user__handler.avatar-only .l-button__suffix {
    display: none
}

.ldesign-widget-user__avatar {
    margin-right: var(--td-comp-margin-xs);
    position: relative
}

.ldesign-widget-user__avatar.is-device--mobile {
    margin-right: 0
}

.ldesign-widget-user__avatar .l-image__wrapper {
    width: 100%;
    height: 100%
}

.ldesign-widget-user__avatar-widget {
    position: absolute;
    left: -10%;
    right: -10%;
    bottom: -5%;
    top: -15%;
    background-size: 100% 100%;
    z-index: 10
}

.ldesign-widget-user__avatar.is-size--small {
    width: var(--td-comp-size-s);
    height: var(--td-comp-size-s)
}

.ldesign-widget-user__avatar.is-size--large {
    width: calc(var(--td-comp-size-xxl) * 1.8);
    height: calc(var(--td-comp-size-xxl) * 1.8)
}

.ldesign-widget-user__avatar.is-default {
    width: 100%;
    height: 100%;
    margin: 0
}

.ldesign-widget-user__avatar.is-default svg {
    width: 100%;
    height: 100%
}

.ldesign-widget-user__name {
    font-size: var(--td-font-size-title-large);
    margin: 0;
    line-height: 1;
    height: var(--td-comp-size-m);
    display: flex;
    align-items: center
}

.ldesign-widget-user__sex {
    font-size: var(--td-font-size-title-large);
    height: var(--td-comp-size-m);
    display: flex;
    display: inline-flex;
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs);
    color: var(--td-text-color-anti);
    font-size: var(--td-font-size-body-small);
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    align-self: center;
    cursor: pointer
}

.ldesign-widget-user__sex.is-male {
    background-color: var(--td-brand-color)
}

.ldesign-widget-user__sex.is-female {
    background-color: var(--td-error-color)
}

.ldesign-widget-user__sex .l-icon {
    font-size: inherit
}

.ldesign-widget-user__degrees {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--td-comp-margin-xs);
    border-radius: inherit;
    grid-area: degree
}

.ldesign-widget-user__degrees-item {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-l);
    cursor: pointer;
    padding: 0 var(--td-comp-paddingLR-m);
    border-radius: inherit
}

.ldesign-widget-user__degrees-item:hover:not(.is-active) {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-widget-user__popup {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s)
}

.ldesign-widget-user__tips-important {
    color: var(--td-brand-color);
    margin: 0 var(--td-comp-margin-xxs);
    font-weight: 700
}

.ldesign-widget-user__information {
    display: grid;
    grid-template-columns: calc((var(--td-comp-size-xxl) * 1.8) + var(--td-comp-margin-m)) auto 1fr auto auto;
    grid-template-rows: var(--td-comp-size-m) auto;
    grid-template-areas: "avatar name sex email phone" "avatar degree degree degree degree";
    gap: var(--td-comp-margin-s) var(--td-comp-margin-xxs)
}

.ldesign-widget-user__information .ldesign-widget-user__avatar {
    grid-area: avatar
}

.ldesign-widget-user__information .ldesign-widget-user__name {
    grid-area: name
}

.ldesign-widget-user__information .ldesign-widget-user__sex {
    grid-area: sex
}

.ldesign-widget-user__information .ldesign-widget-user__email {
    grid-area: email;
    margin: 0
}

.ldesign-widget-user__information .ldesign-widget-user__phone {
    grid-area: phone;
    margin: 0
}

.ldesign-widget-user__information .ldesign-widget-user__degree {
    grid-area: degree;
    align-self: flex-end;
    padding-bottom: var(--td-comp-margin-m);
    margin: 0
}

.ldesign-widget-user__information .ldesign-widget-user__degree .l-space-item:nth-child(3) {
    flex: 1
}

.ldesign-widget-user__information.is-device--mobile {
    grid-template-columns: calc((var(--td-comp-size-l) * 1.6) + var(--td-comp-margin-m)) auto 1fr;
    grid-template-rows: auto auto auto auto;
    grid-template-areas: "avatar name sex" "degree degree degree" "phone phone phone" "email email email"
}

.ldesign-widget-user__information.is-device--mobile .ldesign-widget-user__avatar {
    width: calc(var(--td-comp-size-l) * 1.6);
    height: calc(var(--td-comp-size-l) * 1.6)
}

.ldesign-widget-user__information.is-device--mobile .ldesign-widget-user__degree {
    padding: 0
}

.ldesign-widget-user__information.is-device--mobile .ldesign-widget-user__sex {
    align-self: flex-start;
    margin-top: var(--td-comp-margin-xs)
}

.ldesign-widget-user__tools {
    display: flex;
    justify-content: flex-end
}

.ldesign-widget-user__tools .l-button:not(.l-button--theme-primary) {
    border: none;
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-widget-user__tools.is-device--mobile {
    flex-direction: column;
    gap: var(--td-comp-margin-s)
}

.ldesign-widget-user__title {
    margin: 0;
    font-size: var(--td-font-size-title-large);
    color: var(--td-text-color-primary)
}

.ldesign-widget-user__logout {
    display: grid;
    grid-template-columns: calc(var(--td-comp-size-l) * 4) 1fr;
    grid-template-rows: auto 1fr;
    grid-template-areas: "title title" "cover info";
    align-items: center;
    gap: 0 var(--td-comp-margin-l);
    padding: 0 var(--td-comp-paddingLR-m)
}

.ldesign-widget-user__logout-cover {
    height: calc(var(--td-comp-size-l) * 4);
    grid-area: cover
}

.ldesign-widget-user__logout-cover svg {
    width: 100%;
    height: 100%
}

.ldesign-widget-user__logout-title {
    font-size: var(--td-font-size-title-medium);
    color: var(--td-text-color-primary);
    margin: 0 0 var(--td-comp-margin-l) 0;
    grid-area: title
}

.ldesign-widget-user__logout-content {
    margin: 0;
    color: var(--td-text-color-primary);
    font-size: var(--td-font-size-body-medium);
    grid-area: info;
    display: flex;
    align-items: flex-start;
    align-self: flex-start;
    margin-top: var(--td-comp-margin-m)
}

.ldesign-widget-user__logout.is-device--mobile {
    grid-template-columns: 1fr;
    grid-template-rows: calc(var(--td-comp-size-l) * 3) auto auto;
    grid-template-areas: "cover" "title" "info"
}

.ldesign-widget-user__logout.is-device--mobile .ldesign-widget-user__logout-cover {
    height: calc(var(--td-comp-size-l) * 3)
}

.ldesign-widget-user__logout.is-device--mobile .ldesign-widget-user__logout-title {
    text-align: center;
    margin: var(--td-comp-margin-xl) 0 0 0
}

.ldesign-widget-user__logout.is-device--mobile .ldesign-widget-user__logout-content {
    justify-content: center
}

.ldesign-widget-user.is-variant--card {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
    gap: var(--td-comp-margin-xxxl)
}

.ldesign-widget-themelist {
    font: inherit;
    width: 100%;
    display: grid;
    gap: var(--td-comp-margin-s)
}

.ldesign-widget-themelist__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--td-comp-size-l) * 4), 1fr));
    gap: var(--td-comp-margin-xs)
}

.ldesign-widget-themelist__list-item {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto var(--td-font-size-body-medium);
    grid-template-areas: "cover cover" "title icon";
    align-items: flex-start;
    gap: var(--td-comp-margin-xxs) var(--td-comp-margin-xs);
    border: 1px solid var(--td-border-level-1-color);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-xs);
    cursor: pointer;
    color: var(--td-text-color-primary)
}

.ldesign-widget-themelist__list-item.is-active {
    border-color: var(--td-brand-color)
}

.ldesign-widget-themelist__list-label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    margin: 0;
    grid-area: title;
    line-height: 1
}

.ldesign-widget-themelist__list-cover {
    grid-area: cover;
    display: inline-flex;
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium))
}

.ldesign-widget-content {
    height: 100%;
    padding: var(--desktop-layout-padding);
    box-sizing: border-box;
    transition: inherit;
    position: relative;
    flex-grow: 1;
    display: flex;
    flex-direction: column
}

.ldesign-widget-content.has-breadcrumb {
    padding-top: 0
}

.ldesign-widget-content__refreshing {
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;
    padding: inherit;
    box-sizing: border-box;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.ldesign-widget-content__refreshing-box {
    width: calc(var(--td-comp-size-xxxxl) * 2);
    height: calc(var(--td-comp-size-xxxxl) * 2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: var(--td-bg-color-container);
    box-shadow: var(--td-shadow-1);
    border-radius: var(--desktop-layout-radius);
    gap: var(--td-comp-margin-l)
}

.ldesign-widget-content__refreshing-box p {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-widget-content__refreshing .l-watermark {
    transition: inherit
}

.ldesign-widget-content.is-content--content-scroll,
.ldesign-widget-content.is-content--auto-hidden {
    height: auto
}

.ldesign-widget-content.is-type--gridstack {
    padding: calc(var(--desktop-layout-padding) * .5)
}

.ldesign-widget-content .l-back-top {
    -webkit-tap-highlight-color: transparent
}

.ldesign-contacts {
    font: inherit;
    --contacts-avatar-width: var(--td-comp-size-m);
    --contacts-avatar-height: var(--td-comp-size-m)
}

.ldesign-contacts__userlink {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: var(--td-comp-margin-xs)
}

.ldesign-contacts__userlink .l-image__wrapper {
    width: var(--contacts-avatar-width);
    height: var(--contacts-avatar-height);
    border: 1px solid var(--td-border-level-1-color);
    box-sizing: border-box
}

.ldesign-contacts__name {
    display: inline-flex;
    width: var(--contacts-avatar-width);
    height: var(--contacts-avatar-height);
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--td-text-color-anti);
    flex-shrink: 0
}

.l-loading {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    color: var(--td-brand-color);
    font-size: var(--td-comp-size-l)
}

.l-loading--lock {
    overflow: hidden
}

.l-loading.l-size-s {
    font-size: var(--td-comp-size-xxxs)
}

.l-loading.l-size-l {
    font-size: var(--td-comp-size-xxxl)
}

.l-loading__parent--relative {
    position: relative !important
}

.l-loading__fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3500
}

.l-loading--center {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    justify-content: center
}

.l-loading__content {
    position: absolute;
    left: 48%;
    top: 20%
}

.l-loading--inherit-color {
    color: inherit
}

.l-loading__parent {
    position: relative
}

.l-loading__overlay {
    background-color: var(--td-mask-disabled)
}

.l-loading--full {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3500
}

.l-loading--hidden {
    visibility: hidden
}

.l-loading--visible {
    visibility: visible
}

.l-loading__text {
    width: auto;
    display: inline-block;
    vertical-align: middle;
    font: var(--td-font-body-medium);
    margin-left: var(--td-comp-margin-xs)
}

.l-loading__gradient {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    vertical-align: middle
}

.l-loading__gradient-conic {
    width: 100%;
    height: 100%;
    border-radius: var(--td-radius-circle);
    background: conic-gradient(from 90deg at 50% 50%, #fff 0deg, currentcolor 360deg);
    -webkit-mask: radial-gradient(transparent calc(50% - .5px), #fff 50%);
    mask: radial-gradient(transparent calc(50% - .5px), #fff 50%)
}

.l-button {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    z-index: 0;
    overflow: hidden;
    font-size: var(--td-font-body-medium);
    outline: none;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
    background-color: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    white-space: nowrap;
    border-radius: var(--td-radius-default);
    transition: all .2s linear;
    touch-action: manipulation;
    flex-shrink: 0;
    text-decoration: none
}

.l-button .l-button__text,
.l-button .l-icon {
    position: relative;
    z-index: 1;
    display: inline-flex
}

.l-button .l-icon,
.l-button .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button .l-icon+.l-button__text:not(:empty) {
    margin-left: 8px
}

.l-button .l-loading+.l-button__text:not(:empty) {
    margin-left: 8px
}

.l-button .l-button__suffix:not(:empty) {
    display: inline-flex;
    margin-left: 8px
}

.l-button--variant-base {
    color: var(--td-text-color-anti);
    height: var(--td-comp-size-m);
    font: var(--td-font-body-medium);
    padding-left: calc(var(--td-comp-paddingLR-l) - 1px);
    padding-right: calc(var(--td-comp-paddingLR-l) - 1px);
    background-color: var(--td-bg-color-component);
    border-color: var(--td-bg-color-component);
    color: var(--td-text-color-primary)
}

.l-button--variant-base .l,
.l-button--variant-base .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-base:hover,
.l-button--variant-base:focus-visible {
    background-color: var(--td-bg-color-component-hover)
}

.l-button--variant-base.l-is-loading {
    background-color: var(--td-bg-color-component)
}

.l-button--variant-base.l-is-disabled {
    background-color: var(--td-bg-color-component-disabled)
}

.l-button--variant-base:hover,
.l-button--variant-base:focus-visible {
    border-color: var(--td-bg-color-component-hover)
}

.l-button--variant-base.l-is-loading {
    border-color: var(--td-bg-color-component)
}

.l-button--variant-base.l-is-disabled {
    border-color: var(--td-bg-color-component-disabled)
}

.l-button--variant-base:hover,
.l-button--variant-base:focus-visible {
    color: var(--td-text-color-primary)
}

.l-button--variant-base.l-is-loading {
    color: var(--td-text-color-primary)
}

.l-button--variant-base.l-is-disabled {
    color: var(--td-text-color-disabled)
}

.l-button--variant-base.l-button--theme-primary {
    color: var(--td-text-color-anti);
    background-color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-button--variant-base.l-button--theme-primary:hover,
.l-button--variant-base.l-button--theme-primary:focus-visible {
    background-color: var(--td-brand-color-hover)
}

.l-button--variant-base.l-button--theme-primary.l-is-loading {
    background-color: var(--td-brand-color)
}

.l-button--variant-base.l-button--theme-primary.l-is-disabled {
    background-color: var(--td-brand-color-disabled)
}

.l-button--variant-base.l-button--theme-primary:hover,
.l-button--variant-base.l-button--theme-primary:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-base.l-button--theme-primary.l-is-loading {
    border-color: var(--td-brand-color)
}

.l-button--variant-base.l-button--theme-primary.l-is-disabled {
    border-color: var(--td-brand-color-disabled)
}

.l-button--variant-base.l-button--theme-success {
    color: var(--td-text-color-anti);
    background-color: var(--td-success-color);
    border-color: var(--td-success-color)
}

.l-button--variant-base.l-button--theme-success:hover,
.l-button--variant-base.l-button--theme-success:focus-visible {
    background-color: var(--td-success-color-hover)
}

.l-button--variant-base.l-button--theme-success.l-is-loading {
    background-color: var(--td-success-color)
}

.l-button--variant-base.l-button--theme-success.l-is-disabled {
    background-color: var(--td-success-color-disabled)
}

.l-button--variant-base.l-button--theme-success:hover,
.l-button--variant-base.l-button--theme-success:focus-visible {
    border-color: var(--td-success-color-hover)
}

.l-button--variant-base.l-button--theme-success.l-is-loading {
    border-color: var(--td-success-color)
}

.l-button--variant-base.l-button--theme-success.l-is-disabled {
    border-color: var(--td-success-color-disabled)
}

.l-button--variant-base.l-button--theme-warning {
    color: var(--td-text-color-anti);
    background-color: var(--td-warning-color);
    border-color: var(--td-warning-color)
}

.l-button--variant-base.l-button--theme-warning:hover,
.l-button--variant-base.l-button--theme-warning:focus-visible {
    background-color: var(--td-warning-color-hover)
}

.l-button--variant-base.l-button--theme-warning.l-is-loading {
    background-color: var(--td-warning-color)
}

.l-button--variant-base.l-button--theme-warning.l-is-disabled {
    background-color: var(--td-warning-color-disabled)
}

.l-button--variant-base.l-button--theme-warning:hover,
.l-button--variant-base.l-button--theme-warning:focus-visible {
    border-color: var(--td-warning-color-hover)
}

.l-button--variant-base.l-button--theme-warning.l-is-loading {
    border-color: var(--td-warning-color)
}

.l-button--variant-base.l-button--theme-warning.l-is-disabled {
    border-color: var(--td-warning-color-disabled)
}

.l-button--variant-base.l-button--theme-danger {
    color: var(--td-text-color-anti);
    background-color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-button--variant-base.l-button--theme-danger:hover,
.l-button--variant-base.l-button--theme-danger:focus-visible {
    background-color: var(--td-error-color-hover)
}

.l-button--variant-base.l-button--theme-danger.l-is-loading {
    background-color: var(--td-error-color)
}

.l-button--variant-base.l-button--theme-danger.l-is-disabled {
    background-color: var(--td-error-color-disabled)
}

.l-button--variant-base.l-button--theme-danger:hover,
.l-button--variant-base.l-button--theme-danger:focus-visible {
    border-color: var(--td-error-color-hover)
}

.l-button--variant-base.l-button--theme-danger.l-is-loading {
    border-color: var(--td-error-color)
}

.l-button--variant-base.l-button--theme-danger.l-is-disabled {
    border-color: var(--td-error-color-disabled)
}

.l-button--variant-base.l-button--ghost {
    background-color: transparent;
    color: var(--td-text-color-anti);
    border-color: var(--td-text-color-anti)
}

.l-button--variant-base.l-button--ghost:hover,
.l-button--variant-base.l-button--ghost:focus-visible {
    background-color: transparent
}

.l-button--variant-base.l-button--ghost:active,
.l-button--variant-base.l-button--ghost.l-is-loading {
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-is-disabled {
    background-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost:hover,
.l-button--variant-base.l-button--ghost:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-base.l-button--ghost:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-base.l-button--ghost.l-is-loading {
    color: var(--td-text-color-anti)
}

.l-button--variant-base.l-button--ghost.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost:hover,
.l-button--variant-base.l-button--ghost:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-base.l-button--ghost:active {
    border-color: var(--td-brand-color-active)
}

.l-button--variant-base.l-button--ghost.l-is-loading {
    border-color: var(--td-text-color-anti)
}

.l-button--variant-base.l-button--ghost.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary {
    color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-primary:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary:active {
    border-color: var(--td-brand-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary.l-is-loading {
    border-color: var(--td-brand-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-primary.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-success {
    color: var(--td-success-color);
    border-color: var(--td-success-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success:active {
    color: var(--td-success-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-success:focus-visible {
    border-color: var(--td-success-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success:active {
    border-color: var(--td-success-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success.l-is-loading {
    border-color: var(--td-success-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-success.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning {
    color: var(--td-warning-color);
    border-color: var(--td-warning-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning:active {
    color: var(--td-warning-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-warning:focus-visible {
    border-color: var(--td-warning-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning:active {
    border-color: var(--td-warning-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning.l-is-loading {
    border-color: var(--td-warning-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-warning.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger {
    color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger:active {
    color: var(--td-error-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-base.l-button--ghost.l-button--theme-danger:focus-visible {
    border-color: var(--td-error-color-hover)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger:active {
    border-color: var(--td-error-color-active)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger.l-is-loading {
    border-color: var(--td-error-color)
}

.l-button--variant-base.l-button--ghost.l-button--theme-danger.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline {
    height: var(--td-comp-size-m);
    font: var(--td-font-body-medium);
    padding-left: calc(var(--td-comp-paddingLR-l) - 1px);
    padding-right: calc(var(--td-comp-paddingLR-l) - 1px);
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-specialcomponent);
    border-color: var(--td-border-level-2-color)
}

.l-button--variant-outline .l,
.l-button--variant-outline .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-outline:hover,
.l-button--variant-outline:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-is-loading {
    color: var(--td-text-color-primary)
}

.l-button--variant-outline.l-is-disabled {
    color: var(--td-text-color-disabled)
}

.l-button--variant-outline:hover,
.l-button--variant-outline:focus-visible {
    background-color: var(--td-bg-color-specialcomponent)
}

.l-button--variant-outline.l-is-loading {
    background-color: var(--td-bg-color-specialcomponent)
}

.l-button--variant-outline.l-is-disabled {
    background-color: var(--td-bg-color-component-disabled)
}

.l-button--variant-outline:hover,
.l-button--variant-outline:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-is-loading,
.l-button--variant-outline.l-is-disabled {
    border-color: var(--td-border-level-2-color)
}

.l-button--variant-outline.l-button--theme-primary {
    color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-button--variant-outline.l-button--theme-primary:hover,
.l-button--variant-outline.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-outline.l-button--theme-primary.l-is-disabled {
    color: var(--td-brand-color-disabled)
}

.l-button--variant-outline.l-button--theme-primary:hover,
.l-button--variant-outline.l-button--theme-primary:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-button--theme-primary.l-is-loading {
    border-color: var(--td-brand-color)
}

.l-button--variant-outline.l-button--theme-primary.l-is-disabled {
    border-color: var(--td-brand-color-disabled)
}

.l-button--variant-outline.l-button--theme-success {
    color: var(--td-success-color);
    border-color: var(--td-success-color)
}

.l-button--variant-outline.l-button--theme-success:hover,
.l-button--variant-outline.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-outline.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-outline.l-button--theme-success.l-is-disabled {
    color: var(--td-success-color-disabled)
}

.l-button--variant-outline.l-button--theme-success:hover,
.l-button--variant-outline.l-button--theme-success:focus-visible {
    border-color: var(--td-success-color-hover)
}

.l-button--variant-outline.l-button--theme-success.l-is-loading {
    border-color: var(--td-success-color)
}

.l-button--variant-outline.l-button--theme-success.l-is-disabled {
    border-color: var(--td-success-color-disabled)
}

.l-button--variant-outline.l-button--theme-warning {
    color: var(--td-warning-color);
    border-color: var(--td-warning-color)
}

.l-button--variant-outline.l-button--theme-warning:hover,
.l-button--variant-outline.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-outline.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-outline.l-button--theme-warning.l-is-disabled {
    color: var(--td-warning-color-disabled)
}

.l-button--variant-outline.l-button--theme-warning:hover,
.l-button--variant-outline.l-button--theme-warning:focus-visible {
    border-color: var(--td-warning-color-hover)
}

.l-button--variant-outline.l-button--theme-warning.l-is-loading {
    border-color: var(--td-warning-color)
}

.l-button--variant-outline.l-button--theme-warning.l-is-disabled {
    border-color: var(--td-warning-color-disabled)
}

.l-button--variant-outline.l-button--theme-danger {
    color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-button--variant-outline.l-button--theme-danger:hover,
.l-button--variant-outline.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-outline.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-outline.l-button--theme-danger.l-is-disabled {
    color: var(--td-error-color-disabled)
}

.l-button--variant-outline.l-button--theme-danger:hover,
.l-button--variant-outline.l-button--theme-danger:focus-visible {
    border-color: var(--td-error-color-hover)
}

.l-button--variant-outline.l-button--theme-danger.l-is-loading {
    border-color: var(--td-error-color)
}

.l-button--variant-outline.l-button--theme-danger.l-is-disabled {
    border-color: var(--td-error-color-disabled)
}

.l-button--variant-outline.l-button--ghost {
    background-color: transparent;
    color: var(--td-text-color-anti);
    border-color: var(--td-text-color-anti)
}

.l-button--variant-outline.l-button--ghost:hover,
.l-button--variant-outline.l-button--ghost:focus-visible {
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost:active,
.l-button--variant-outline.l-button--ghost.l-is-loading {
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-is-disabled {
    background-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost:hover,
.l-button--variant-outline.l-button--ghost:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-button--ghost:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-outline.l-button--ghost.l-is-loading {
    color: var(--td-text-color-anti)
}

.l-button--variant-outline.l-button--ghost.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost:hover,
.l-button--variant-outline.l-button--ghost:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-button--ghost:active {
    border-color: var(--td-brand-color-active)
}

.l-button--variant-outline.l-button--ghost.l-is-loading {
    border-color: var(--td-text-color-anti)
}

.l-button--variant-outline.l-button--ghost.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary {
    color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-primary:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary:active {
    border-color: var(--td-brand-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary.l-is-loading {
    border-color: var(--td-brand-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-primary.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success {
    color: var(--td-success-color);
    border-color: var(--td-success-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success:active {
    color: var(--td-success-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-success:focus-visible {
    border-color: var(--td-success-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success:active {
    border-color: var(--td-success-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success.l-is-loading {
    border-color: var(--td-success-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-success.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning {
    color: var(--td-warning-color);
    border-color: var(--td-warning-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning:active {
    color: var(--td-warning-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-warning:focus-visible {
    border-color: var(--td-warning-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning:active {
    border-color: var(--td-warning-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning.l-is-loading {
    border-color: var(--td-warning-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-warning.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger {
    color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger:active {
    color: var(--td-error-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-outline.l-button--ghost.l-button--theme-danger:focus-visible {
    border-color: var(--td-error-color-hover)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger:active {
    border-color: var(--td-error-color-active)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger.l-is-loading {
    border-color: var(--td-error-color)
}

.l-button--variant-outline.l-button--ghost.l-button--theme-danger.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed {
    height: var(--td-comp-size-m);
    font: var(--td-font-body-medium);
    padding-left: calc(var(--td-comp-paddingLR-l) - 1px);
    padding-right: calc(var(--td-comp-paddingLR-l) - 1px);
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-specialcomponent);
    border-color: var(--td-border-level-2-color);
    border-style: dashed
}

.l-button--variant-dashed .l,
.l-button--variant-dashed .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-dashed:hover,
.l-button--variant-dashed:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-is-loading {
    color: var(--td-text-color-primary)
}

.l-button--variant-dashed.l-is-disabled {
    color: var(--td-text-color-disabled)
}

.l-button--variant-dashed:hover,
.l-button--variant-dashed:focus-visible {
    background-color: var(--td-bg-color-specialcomponent)
}

.l-button--variant-dashed.l-is-loading {
    background-color: var(--td-bg-color-specialcomponent)
}

.l-button--variant-dashed.l-is-disabled {
    background-color: var(--td-bg-color-component-disabled)
}

.l-button--variant-dashed:hover,
.l-button--variant-dashed:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-is-loading,
.l-button--variant-dashed.l-is-disabled {
    border-color: var(--td-border-level-2-color)
}

.l-button--variant-dashed.l-button--theme-primary {
    color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-button--variant-dashed.l-button--theme-primary:hover,
.l-button--variant-dashed.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-dashed.l-button--theme-primary.l-is-disabled {
    color: var(--td-brand-color-disabled)
}

.l-button--variant-dashed.l-button--theme-primary:hover,
.l-button--variant-dashed.l-button--theme-primary:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-button--theme-primary.l-is-loading {
    border-color: var(--td-brand-color)
}

.l-button--variant-dashed.l-button--theme-primary.l-is-disabled {
    border-color: var(--td-brand-color-disabled)
}

.l-button--variant-dashed.l-button--theme-success {
    color: var(--td-success-color);
    border-color: var(--td-success-color)
}

.l-button--variant-dashed.l-button--theme-success:hover,
.l-button--variant-dashed.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-dashed.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-dashed.l-button--theme-success.l-is-disabled {
    color: var(--td-success-color-disabled)
}

.l-button--variant-dashed.l-button--theme-success:hover,
.l-button--variant-dashed.l-button--theme-success:focus-visible {
    border-color: var(--td-success-color-hover)
}

.l-button--variant-dashed.l-button--theme-success.l-is-loading {
    border-color: var(--td-success-color)
}

.l-button--variant-dashed.l-button--theme-success.l-is-disabled {
    border-color: var(--td-success-color-disabled)
}

.l-button--variant-dashed.l-button--theme-warning {
    color: var(--td-warning-color);
    border-color: var(--td-warning-color)
}

.l-button--variant-dashed.l-button--theme-warning:hover,
.l-button--variant-dashed.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-dashed.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-dashed.l-button--theme-warning.l-is-disabled {
    color: var(--td-warning-color-disabled)
}

.l-button--variant-dashed.l-button--theme-warning:hover,
.l-button--variant-dashed.l-button--theme-warning:focus-visible {
    border-color: var(--td-warning-color-hover)
}

.l-button--variant-dashed.l-button--theme-warning.l-is-loading {
    border-color: var(--td-warning-color)
}

.l-button--variant-dashed.l-button--theme-warning.l-is-disabled {
    border-color: var(--td-warning-color-disabled)
}

.l-button--variant-dashed.l-button--theme-danger {
    color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-button--variant-dashed.l-button--theme-danger:hover,
.l-button--variant-dashed.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-dashed.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-dashed.l-button--theme-danger.l-is-disabled {
    color: var(--td-error-color-disabled)
}

.l-button--variant-dashed.l-button--theme-danger:hover,
.l-button--variant-dashed.l-button--theme-danger:focus-visible {
    border-color: var(--td-error-color-hover)
}

.l-button--variant-dashed.l-button--theme-danger.l-is-loading {
    border-color: var(--td-error-color)
}

.l-button--variant-dashed.l-button--theme-danger.l-is-disabled {
    border-color: var(--td-error-color-disabled)
}

.l-button--variant-dashed.l-button--ghost {
    background-color: transparent;
    color: var(--td-text-color-anti);
    border-color: var(--td-text-color-anti)
}

.l-button--variant-dashed.l-button--ghost:hover,
.l-button--variant-dashed.l-button--ghost:focus-visible {
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost:active,
.l-button--variant-dashed.l-button--ghost.l-is-loading {
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-is-disabled {
    background-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost:hover,
.l-button--variant-dashed.l-button--ghost:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-button--ghost:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-is-loading {
    color: var(--td-text-color-anti)
}

.l-button--variant-dashed.l-button--ghost.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost:hover,
.l-button--variant-dashed.l-button--ghost:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-button--ghost:active {
    border-color: var(--td-brand-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-is-loading {
    border-color: var(--td-text-color-anti)
}

.l-button--variant-dashed.l-button--ghost.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary {
    color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-primary:focus-visible {
    border-color: var(--td-brand-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary:active {
    border-color: var(--td-brand-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary.l-is-loading {
    border-color: var(--td-brand-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-primary.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success {
    color: var(--td-success-color);
    border-color: var(--td-success-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success:active {
    color: var(--td-success-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-success:focus-visible {
    border-color: var(--td-success-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success:active {
    border-color: var(--td-success-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success.l-is-loading {
    border-color: var(--td-success-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-success.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning {
    color: var(--td-warning-color);
    border-color: var(--td-warning-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning:active {
    color: var(--td-warning-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-warning:focus-visible {
    border-color: var(--td-warning-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning:active {
    border-color: var(--td-warning-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning.l-is-loading {
    border-color: var(--td-warning-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-warning.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger {
    color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger:active {
    color: var(--td-error-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-dashed.l-button--ghost.l-button--theme-danger:focus-visible {
    border-color: var(--td-error-color-hover)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger:active {
    border-color: var(--td-error-color-active)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger.l-is-loading {
    border-color: var(--td-error-color)
}

.l-button--variant-dashed.l-button--ghost.l-button--theme-danger.l-is-disabled {
    border-color: #ffffff38;
    background-color: transparent
}

.l-button--variant-text {
    height: var(--td-comp-size-m);
    font: var(--td-font-body-medium);
    padding-left: calc(var(--td-comp-paddingLR-l) - 1px);
    padding-right: calc(var(--td-comp-paddingLR-l) - 1px);
    color: var(--td-text-color-primary);
    background-color: transparent;
    border-color: transparent
}

.l-button--variant-text .l,
.l-button--variant-text .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--variant-text:hover,
.l-button--variant-text:focus-visible {
    color: var(--td-text-color-primary)
}

.l-button--variant-text.l-is-loading {
    color: var(--td-text-color-primary)
}

.l-button--variant-text.l-is-disabled {
    color: var(--td-text-color-disabled)
}

.l-button--variant-text:hover,
.l-button--variant-text:focus-visible {
    background-color: var(--td-bg-color-container-hover)
}

.l-button--variant-text.l-is-loading,
.l-button--variant-text.l-is-disabled {
    background-color: transparent
}

.l-button--variant-text:hover,
.l-button--variant-text:focus-visible {
    border-color: var(--td-bg-color-container-hover)
}

.l-button--variant-text.l-is-loading,
.l-button--variant-text.l-is-disabled {
    border-color: transparent
}

.l-button--variant-text.l-button--theme-primary {
    color: var(--td-brand-color)
}

.l-button--variant-text.l-button--theme-primary:hover,
.l-button--variant-text.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-text.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-text.l-button--theme-primary.l-is-disabled {
    color: var(--td-brand-color-disabled)
}

.l-button--variant-text.l-button--theme-success {
    color: var(--td-success-color)
}

.l-button--variant-text.l-button--theme-success:hover,
.l-button--variant-text.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-text.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-text.l-button--theme-success.l-is-disabled {
    color: var(--td-success-color-disabled)
}

.l-button--variant-text.l-button--theme-warning {
    color: var(--td-warning-color)
}

.l-button--variant-text.l-button--theme-warning:hover,
.l-button--variant-text.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-text.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-text.l-button--theme-warning.l-is-disabled {
    color: var(--td-warning-color-disabled)
}

.l-button--variant-text.l-button--theme-danger {
    color: var(--td-error-color)
}

.l-button--variant-text.l-button--theme-danger:hover,
.l-button--variant-text.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-text.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-text.l-button--theme-danger.l-is-disabled {
    color: var(--td-error-color-disabled)
}

.l-button--variant-text.l-button--ghost {
    background: none;
    color: var(--td-text-color-anti)
}

.l-button--variant-text.l-button--ghost:hover,
.l-button--variant-text.l-button--ghost:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-text.l-button--ghost:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-text.l-button--ghost.l-is-loading {
    color: var(--td-text-color-anti)
}

.l-button--variant-text.l-button--ghost.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-text.l-button--ghost.l-button--theme-primary {
    color: var(--td-brand-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-primary:hover,
.l-button--variant-text.l-button--ghost.l-button--theme-primary:focus-visible {
    color: var(--td-brand-color-hover)
}

.l-button--variant-text.l-button--ghost.l-button--theme-primary:active {
    color: var(--td-brand-color-active)
}

.l-button--variant-text.l-button--ghost.l-button--theme-primary.l-is-loading {
    color: var(--td-brand-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-primary.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-text.l-button--ghost.l-button--theme-success {
    color: var(--td-success-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-success:hover,
.l-button--variant-text.l-button--ghost.l-button--theme-success:focus-visible {
    color: var(--td-success-color-hover)
}

.l-button--variant-text.l-button--ghost.l-button--theme-success:active {
    color: var(--td-success-color-active)
}

.l-button--variant-text.l-button--ghost.l-button--theme-success.l-is-loading {
    color: var(--td-success-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-success.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-text.l-button--ghost.l-button--theme-warning {
    color: var(--td-warning-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-warning:hover,
.l-button--variant-text.l-button--ghost.l-button--theme-warning:focus-visible {
    color: var(--td-warning-color-hover)
}

.l-button--variant-text.l-button--ghost.l-button--theme-warning:active {
    color: var(--td-warning-color-active)
}

.l-button--variant-text.l-button--ghost.l-button--theme-warning.l-is-loading {
    color: var(--td-warning-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-warning.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button--variant-text.l-button--ghost.l-button--theme-danger {
    color: var(--td-error-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-danger:hover,
.l-button--variant-text.l-button--ghost.l-button--theme-danger:focus-visible {
    color: var(--td-error-color-hover)
}

.l-button--variant-text.l-button--ghost.l-button--theme-danger:active {
    color: var(--td-error-color-active)
}

.l-button--variant-text.l-button--ghost.l-button--theme-danger.l-is-loading {
    color: var(--td-error-color)
}

.l-button--variant-text.l-button--ghost.l-button--theme-danger.l-is-disabled {
    color: #ffffff38;
    background-color: transparent
}

.l-button.l-is-loading,
.l-button.l-is-disabled {
    cursor: not-allowed
}

.l-button.l-size-s {
    height: var(--td-comp-size-xs);
    font: var(--td-font-body-small);
    padding-left: calc(var(--td-comp-paddingLR-s) - 1px);
    padding-right: calc(var(--td-comp-paddingLR-s) - 1px)
}

.l-button.l-size-s .l,
.l-button.l-size-s .l-loading {
    font-size: var(--td-font-size-body-medium)
}

.l-button.l-size-l {
    height: var(--td-comp-size-xl);
    font: var(--td-font-body-large);
    padding-left: calc(var(--td-comp-paddingLR-xl) - 1px);
    padding-right: calc(var(--td-comp-paddingLR-xl) - 1px)
}

.l-button.l-size-l .l,
.l-button.l-size-l .l-loading {
    font-size: var(--td-font-size-title-large)
}

.l-button--shape-square {
    width: var(--td-comp-size-m);
    padding: 0
}

.l-button--shape-square.l-size-s {
    width: var(--td-comp-size-xs);
    padding: 0
}

.l-button--shape-square.l-size-l {
    width: var(--td-comp-size-xl);
    padding: 0
}

.l-button--shape-round {
    border-radius: var(--td-radius-round)
}

.l-button--shape-round.l-size-s {
    border-radius: calc(var(--td-comp-size-xs) / 2)
}

.l-button--shape-round.l-size-l {
    border-radius: calc(var(--td-comp-size-xl) / 2)
}

.l-button--shape-circle {
    width: var(--td-comp-size-m);
    padding: 0;
    text-align: center;
    border-radius: calc(var(--td-comp-size-m) / 2)
}

.l-button--shape-circle .l-icon,
.l-button--shape-circle .l-loading {
    font-size: var(--td-font-size-body-large)
}

.l-button--shape-circle.l-size-s {
    width: var(--td-comp-size-xs);
    border-radius: calc(var(--td-comp-size-xs) / 2)
}

.l-button--shape-circle.l-size-l {
    width: var(--td-comp-size-xl);
    padding: 0;
    border-radius: calc(var(--td-comp-size-xl) / 2)
}

.l-button.l-size-full-width {
    display: flex;
    width: 100%
}

.l-button--ghost {
    --ripple-color: var(--td-gray-color-10)
}

.l-button:not(.l-is-disabled):not(.l-button--ghost) {
    --ripple-color: var(--td-bg-color-container-active)
}

.l-button--variant-base:not(.l-is-disabled):not(.l-button--ghost) {
    --ripple-color: var(--td-bg-color-component-active)
}

.l-button--variant-base.l-button--theme-primary:not(.l-is-disabled):not(.l-button--ghost) {
    --ripple-color: var(--td-brand-color-active)
}

.l-button--variant-base.l-button--theme-success:not(.l-is-disabled):not(.l-button--ghost) {
    --ripple-color: var(--td-success-color-active)
}

.l-button--variant-base.l-button--theme-warning:not(.l-is-disabled):not(.l-button--ghost) {
    --ripple-color: var(--td-warning-color-active)
}

.l-button--variant-base.l-button--theme-danger:not(.l-is-disabled):not(.l-button--ghost) {
    --ripple-color: var(--td-error-color-active)
}

.l-link {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    position: relative;
    text-decoration: none;
    outline: none;
    padding: 0;
    transition: all .2s linear;
    font: var(--td-font-link-medium)
}

.l-link .l-link__prefix-icon {
    margin-right: var(--td-comp-margin-s);
    display: flex
}

.l-link .l-link__suffix-icon {
    margin-left: var(--td-comp-margin-s);
    display: flex
}

.l-link.l-size-s {
    font: var(--td-font-link-small)
}

.l-link.l-size-s .l-link__prefix-icon {
    margin-right: var(--td-comp-margin-xs);
    display: flex
}

.l-link.l-size-s .l-link__suffix-icon {
    margin-left: var(--td-comp-margin-xs);
    display: flex
}

.l-link.l-size-l {
    font: var(--td-font-link-large)
}

.l-link.l-size-l .l-link__prefix-icon {
    margin-right: var(--td-comp-margin-m);
    display: flex
}

.l-link.l-size-l .l-link__suffix-icon {
    margin-left: var(--td-comp-margin-m);
    display: flex
}

.l-link--theme-default {
    color: var(--td-text-color-primary)
}

.l-link--theme-default:active {
    color: var(--td-brand-color-active)
}

.l-link--theme-default.l-link--hover-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    border-bottom: 1px solid var(--td-text-color-primary);
    opacity: 0;
    transition: all .2s linear
}

.l-link--theme-default.l-link--hover-underline:hover:after {
    opacity: 1
}

.l-link--theme-default.l-link--hover-underline:active:after {
    opacity: 1;
    border-color: var(--td-brand-color-active)
}

.l-link--theme-default.l-link--hover-color:hover {
    color: var(--td-brand-color-hover)
}

.l-link--theme-default.l-link--hover-color.l-is-underline:hover:after {
    border-color: var(--td-brand-color-hover)
}

.l-link--theme-default.l-link--hover-color.l-is-underline:active:after {
    border-color: var(--td-brand-color-active)
}

.l-link--theme-default.l-link--hover-color:active {
    color: var(--td-brand-color-active)
}

.l-link--theme-default.l-is-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    opacity: 1;
    border-bottom: 1px solid var(--td-text-color-primary);
    transition: all .2s linear
}

.l-link--theme-default.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-text-color-disabled)
}

.l-link--theme-default.l-is-disabled:hover,
.l-link--theme-default.l-is-disabled:active {
    color: var(--td-text-color-disabled)
}

.l-link--theme-default.l-is-disabled.l-is-underline:after {
    border-color: var(--td-text-color-disabled)
}

.l-link--theme-primary {
    color: var(--td-brand-color)
}

.l-link--theme-primary:active {
    color: var(--td-brand-color-active)
}

.l-link--theme-primary.l-link--hover-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    border-bottom: 1px solid var(--td-brand-color);
    opacity: 0;
    transition: all .2s linear
}

.l-link--theme-primary.l-link--hover-underline:hover:after {
    opacity: 1
}

.l-link--theme-primary.l-link--hover-underline:active:after {
    opacity: 1;
    border-color: var(--td-brand-color-active)
}

.l-link--theme-primary.l-link--hover-color:hover {
    color: var(--td-brand-color-hover)
}

.l-link--theme-primary.l-link--hover-color.l-is-underline:hover:after {
    border-color: var(--td-brand-color-hover)
}

.l-link--theme-primary.l-link--hover-color.l-is-underline:active:after {
    border-color: var(--td-brand-color-active)
}

.l-link--theme-primary.l-link--hover-color:active {
    color: var(--td-brand-color-active)
}

.l-link--theme-primary.l-is-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    opacity: 1;
    border-bottom: 1px solid var(--td-brand-color);
    transition: all .2s linear
}

.l-link--theme-primary.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-brand-color-disabled)
}

.l-link--theme-primary.l-is-disabled:hover,
.l-link--theme-primary.l-is-disabled:active {
    color: var(--td-brand-color-disabled)
}

.l-link--theme-primary.l-is-disabled.l-is-underline:after {
    border-color: var(--td-brand-color-disabled)
}

.l-link--theme-success {
    color: var(--td-success-color)
}

.l-link--theme-success:active {
    color: var(--td-success-color-active)
}

.l-link--theme-success.l-link--hover-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    border-bottom: 1px solid var(--td-success-color);
    opacity: 0;
    transition: all .2s linear
}

.l-link--theme-success.l-link--hover-underline:hover:after {
    opacity: 1
}

.l-link--theme-success.l-link--hover-underline:active:after {
    opacity: 1;
    border-color: var(--td-success-color-active)
}

.l-link--theme-success.l-link--hover-color:hover {
    color: var(--td-success-color-hover)
}

.l-link--theme-success.l-link--hover-color.l-is-underline:hover:after {
    border-color: var(--td-success-color-hover)
}

.l-link--theme-success.l-link--hover-color.l-is-underline:active:after {
    border-color: var(--td-success-color-active)
}

.l-link--theme-success.l-link--hover-color:active {
    color: var(--td-success-color-active)
}

.l-link--theme-success.l-is-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    opacity: 1;
    border-bottom: 1px solid var(--td-success-color);
    transition: all .2s linear
}

.l-link--theme-success.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-success-color-disabled)
}

.l-link--theme-success.l-is-disabled:hover,
.l-link--theme-success.l-is-disabled:active {
    color: var(--td-success-color-disabled)
}

.l-link--theme-success.l-is-disabled.l-is-underline:after {
    border-color: var(--td-success-color-disabled)
}

.l-link--theme-danger {
    color: var(--td-error-color)
}

.l-link--theme-danger:active {
    color: var(--td-error-color-active)
}

.l-link--theme-danger.l-link--hover-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    border-bottom: 1px solid var(--td-error-color);
    opacity: 0;
    transition: all .2s linear
}

.l-link--theme-danger.l-link--hover-underline:hover:after {
    opacity: 1
}

.l-link--theme-danger.l-link--hover-underline:active:after {
    opacity: 1;
    border-color: var(--td-error-color-active)
}

.l-link--theme-danger.l-link--hover-color:hover {
    color: var(--td-error-color-hover)
}

.l-link--theme-danger.l-link--hover-color.l-is-underline:hover:after {
    border-color: var(--td-error-color-hover)
}

.l-link--theme-danger.l-link--hover-color.l-is-underline:active:after {
    border-color: var(--td-error-color-active)
}

.l-link--theme-danger.l-link--hover-color:active {
    color: var(--td-error-color-active)
}

.l-link--theme-danger.l-is-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    opacity: 1;
    border-bottom: 1px solid var(--td-error-color);
    transition: all .2s linear
}

.l-link--theme-danger.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-error-color-disabled)
}

.l-link--theme-danger.l-is-disabled:hover,
.l-link--theme-danger.l-is-disabled:active {
    color: var(--td-error-color-disabled)
}

.l-link--theme-danger.l-is-disabled.l-is-underline:after {
    border-color: var(--td-error-color-disabled)
}

.l-link--theme-warning {
    color: var(--td-warning-color)
}

.l-link--theme-warning:active {
    color: var(--td-warning-color-active)
}

.l-link--theme-warning.l-link--hover-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    border-bottom: 1px solid var(--td-warning-color);
    opacity: 0;
    transition: all .2s linear
}

.l-link--theme-warning.l-link--hover-underline:hover:after {
    opacity: 1
}

.l-link--theme-warning.l-link--hover-underline:active:after {
    opacity: 1;
    border-color: var(--td-warning-color-active)
}

.l-link--theme-warning.l-link--hover-color:hover {
    color: var(--td-warning-color-hover)
}

.l-link--theme-warning.l-link--hover-color.l-is-underline:hover:after {
    border-color: var(--td-warning-color-hover)
}

.l-link--theme-warning.l-link--hover-color.l-is-underline:active:after {
    border-color: var(--td-warning-color-active)
}

.l-link--theme-warning.l-link--hover-color:active {
    color: var(--td-warning-color-active)
}

.l-link--theme-warning.l-is-underline:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    bottom: 0;
    opacity: 1;
    border-bottom: 1px solid var(--td-warning-color);
    transition: all .2s linear
}

.l-link--theme-warning.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-warning-color-disabled)
}

.l-link--theme-warning.l-is-disabled:hover,
.l-link--theme-warning.l-is-disabled:active {
    color: var(--td-warning-color-disabled)
}

.l-link--theme-warning.l-is-disabled.l-is-underline:after {
    border-color: var(--td-warning-color-disabled)
}

.l-row {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-flow: row wrap
}

.l-row--start {
    justify-content: flex-start
}

.l-row--center {
    justify-content: center
}

.l-row--end {
    justify-content: flex-end
}

.l-row--space-between {
    justify-content: space-between
}

.l-row--space-around {
    justify-content: space-around
}

.l-row--top {
    align-items: flex-start
}

.l-row--middle {
    align-items: center
}

.l-row--bottom {
    align-items: flex-end
}

.l-row--align-top,
.l-row--align-start {
    align-items: flex-start
}

.l-row--align-middle,
.l-row--align-center {
    align-items: center
}

.l-row--align-bottom,
.l-row--align-end {
    align-items: flex-end
}

.l-row--align-stretch {
    align-items: stretch
}

.l-row--align-baseline {
    align-items: baseline
}

.l-col {
    position: relative;
    max-width: 100%;
    min-height: 1px;
    box-sizing: border-box
}

.l-col-12 {
    display: block;
    flex: 0 0 100%;
    max-width: 100%
}

.l-col-push-12 {
    left: 100%
}

.l-col-pull-12 {
    right: 100%
}

.l-col-offset-12 {
    margin-left: 100%
}

.l-col-order-12 {
    order: 12
}

.l-col-11 {
    display: block;
    flex: 0 0 91.66666667%;
    max-width: 91.66666667%
}

.l-col-push-11 {
    left: 91.66666667%
}

.l-col-pull-11 {
    right: 91.66666667%
}

.l-col-offset-11 {
    margin-left: 91.66666667%
}

.l-col-order-11 {
    order: 11
}

.l-col-10 {
    display: block;
    flex: 0 0 83.33333333%;
    max-width: 83.33333333%
}

.l-col-push-10 {
    left: 83.33333333%
}

.l-col-pull-10 {
    right: 83.33333333%
}

.l-col-offset-10 {
    margin-left: 83.33333333%
}

.l-col-order-10 {
    order: 10
}

.l-col-9 {
    display: block;
    flex: 0 0 75%;
    max-width: 75%
}

.l-col-push-9 {
    left: 75%
}

.l-col-pull-9 {
    right: 75%
}

.l-col-offset-9 {
    margin-left: 75%
}

.l-col-order-9 {
    order: 9
}

.l-col-8 {
    display: block;
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%
}

.l-col-push-8 {
    left: 66.66666667%
}

.l-col-pull-8 {
    right: 66.66666667%
}

.l-col-offset-8 {
    margin-left: 66.66666667%
}

.l-col-order-8 {
    order: 8
}

.l-col-7 {
    display: block;
    flex: 0 0 58.33333333%;
    max-width: 58.33333333%
}

.l-col-push-7 {
    left: 58.33333333%
}

.l-col-pull-7 {
    right: 58.33333333%
}

.l-col-offset-7 {
    margin-left: 58.33333333%
}

.l-col-order-7 {
    order: 7
}

.l-col-6 {
    display: block;
    flex: 0 0 50%;
    max-width: 50%
}

.l-col-push-6 {
    left: 50%
}

.l-col-pull-6 {
    right: 50%
}

.l-col-offset-6 {
    margin-left: 50%
}

.l-col-order-6 {
    order: 6
}

.l-col-5 {
    display: block;
    flex: 0 0 41.66666667%;
    max-width: 41.66666667%
}

.l-col-push-5 {
    left: 41.66666667%
}

.l-col-pull-5 {
    right: 41.66666667%
}

.l-col-offset-5 {
    margin-left: 41.66666667%
}

.l-col-order-5 {
    order: 5
}

.l-col-4 {
    display: block;
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%
}

.l-col-push-4 {
    left: 33.33333333%
}

.l-col-pull-4 {
    right: 33.33333333%
}

.l-col-offset-4 {
    margin-left: 33.33333333%
}

.l-col-order-4 {
    order: 4
}

.l-col-3 {
    display: block;
    flex: 0 0 25%;
    max-width: 25%
}

.l-col-push-3 {
    left: 25%
}

.l-col-pull-3 {
    right: 25%
}

.l-col-offset-3 {
    margin-left: 25%
}

.l-col-order-3 {
    order: 3
}

.l-col-2 {
    display: block;
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%
}

.l-col-push-2 {
    left: 16.66666667%
}

.l-col-pull-2 {
    right: 16.66666667%
}

.l-col-offset-2 {
    margin-left: 16.66666667%
}

.l-col-order-2 {
    order: 2
}

.l-col-1 {
    display: block;
    flex: 0 0 8.33333333%;
    max-width: 8.33333333%
}

.l-col-push-1 {
    left: 8.33333333%
}

.l-col-pull-1 {
    right: 8.33333333%
}

.l-col-offset-1 {
    margin-left: 8.33333333%
}

.l-col-order-1 {
    order: 1
}

.l-col-0 {
    display: none
}

.l-col-offset-0 {
    margin-left: 0
}

.l-col-order-0 {
    order: 0
}

.l-col-xs-12 {
    display: block;
    flex: 0 0 100%;
    max-width: 100%
}

.l-col-xs-push-12 {
    left: 100%
}

.l-col-xs-pull-12 {
    right: 100%
}

.l-col-xs-offset-12 {
    margin-left: 100%
}

.l-col-xs-order-12 {
    order: 12
}

.l-col-xs-11 {
    display: block;
    flex: 0 0 91.66666667%;
    max-width: 91.66666667%
}

.l-col-xs-push-11 {
    left: 91.66666667%
}

.l-col-xs-pull-11 {
    right: 91.66666667%
}

.l-col-xs-offset-11 {
    margin-left: 91.66666667%
}

.l-col-xs-order-11 {
    order: 11
}

.l-col-xs-10 {
    display: block;
    flex: 0 0 83.33333333%;
    max-width: 83.33333333%
}

.l-col-xs-push-10 {
    left: 83.33333333%
}

.l-col-xs-pull-10 {
    right: 83.33333333%
}

.l-col-xs-offset-10 {
    margin-left: 83.33333333%
}

.l-col-xs-order-10 {
    order: 10
}

.l-col-xs-9 {
    display: block;
    flex: 0 0 75%;
    max-width: 75%
}

.l-col-xs-push-9 {
    left: 75%
}

.l-col-xs-pull-9 {
    right: 75%
}

.l-col-xs-offset-9 {
    margin-left: 75%
}

.l-col-xs-order-9 {
    order: 9
}

.l-col-xs-8 {
    display: block;
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%
}

.l-col-xs-push-8 {
    left: 66.66666667%
}

.l-col-xs-pull-8 {
    right: 66.66666667%
}

.l-col-xs-offset-8 {
    margin-left: 66.66666667%
}

.l-col-xs-order-8 {
    order: 8
}

.l-col-xs-7 {
    display: block;
    flex: 0 0 58.33333333%;
    max-width: 58.33333333%
}

.l-col-xs-push-7 {
    left: 58.33333333%
}

.l-col-xs-pull-7 {
    right: 58.33333333%
}

.l-col-xs-offset-7 {
    margin-left: 58.33333333%
}

.l-col-xs-order-7 {
    order: 7
}

.l-col-xs-6 {
    display: block;
    flex: 0 0 50%;
    max-width: 50%
}

.l-col-xs-push-6 {
    left: 50%
}

.l-col-xs-pull-6 {
    right: 50%
}

.l-col-xs-offset-6 {
    margin-left: 50%
}

.l-col-xs-order-6 {
    order: 6
}

.l-col-xs-5 {
    display: block;
    flex: 0 0 41.66666667%;
    max-width: 41.66666667%
}

.l-col-xs-push-5 {
    left: 41.66666667%
}

.l-col-xs-pull-5 {
    right: 41.66666667%
}

.l-col-xs-offset-5 {
    margin-left: 41.66666667%
}

.l-col-xs-order-5 {
    order: 5
}

.l-col-xs-4 {
    display: block;
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%
}

.l-col-xs-push-4 {
    left: 33.33333333%
}

.l-col-xs-pull-4 {
    right: 33.33333333%
}

.l-col-xs-offset-4 {
    margin-left: 33.33333333%
}

.l-col-xs-order-4 {
    order: 4
}

.l-col-xs-3 {
    display: block;
    flex: 0 0 25%;
    max-width: 25%
}

.l-col-xs-push-3 {
    left: 25%
}

.l-col-xs-pull-3 {
    right: 25%
}

.l-col-xs-offset-3 {
    margin-left: 25%
}

.l-col-xs-order-3 {
    order: 3
}

.l-col-xs-2 {
    display: block;
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%
}

.l-col-xs-push-2 {
    left: 16.66666667%
}

.l-col-xs-pull-2 {
    right: 16.66666667%
}

.l-col-xs-offset-2 {
    margin-left: 16.66666667%
}

.l-col-xs-order-2 {
    order: 2
}

.l-col-xs-1 {
    display: block;
    flex: 0 0 8.33333333%;
    max-width: 8.33333333%
}

.l-col-xs-push-1 {
    left: 8.33333333%
}

.l-col-xs-pull-1 {
    right: 8.33333333%
}

.l-col-xs-offset-1 {
    margin-left: 8.33333333%
}

.l-col-xs-order-1 {
    order: 1
}

.l-col-xs-0 {
    display: none
}

.l-col-push-0 {
    left: auto
}

.l-col-pull-0 {
    right: auto
}

.l-col-xs-push-0 {
    left: auto
}

.l-col-xs-pull-0 {
    right: auto
}

.l-col-xs-offset-0 {
    margin-left: 0
}

.l-col-xs-order-0 {
    order: 0
}

@media (min-width: 768px) {
    .l-col-sm-12 {
        display: block;
        flex: 0 0 100%;
        max-width: 100%
    }

    .l-col-sm-push-12 {
        left: 100%
    }

    .l-col-sm-pull-12 {
        right: 100%
    }

    .l-col-sm-offset-12 {
        margin-left: 100%
    }

    .l-col-sm-order-12 {
        order: 12
    }

    .l-col-sm-11 {
        display: block;
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%
    }

    .l-col-sm-push-11 {
        left: 91.66666667%
    }

    .l-col-sm-pull-11 {
        right: 91.66666667%
    }

    .l-col-sm-offset-11 {
        margin-left: 91.66666667%
    }

    .l-col-sm-order-11 {
        order: 11
    }

    .l-col-sm-10 {
        display: block;
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%
    }

    .l-col-sm-push-10 {
        left: 83.33333333%
    }

    .l-col-sm-pull-10 {
        right: 83.33333333%
    }

    .l-col-sm-offset-10 {
        margin-left: 83.33333333%
    }

    .l-col-sm-order-10 {
        order: 10
    }

    .l-col-sm-9 {
        display: block;
        flex: 0 0 75%;
        max-width: 75%
    }

    .l-col-sm-push-9 {
        left: 75%
    }

    .l-col-sm-pull-9 {
        right: 75%
    }

    .l-col-sm-offset-9 {
        margin-left: 75%
    }

    .l-col-sm-order-9 {
        order: 9
    }

    .l-col-sm-8 {
        display: block;
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%
    }

    .l-col-sm-push-8 {
        left: 66.66666667%
    }

    .l-col-sm-pull-8 {
        right: 66.66666667%
    }

    .l-col-sm-offset-8 {
        margin-left: 66.66666667%
    }

    .l-col-sm-order-8 {
        order: 8
    }

    .l-col-sm-7 {
        display: block;
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%
    }

    .l-col-sm-push-7 {
        left: 58.33333333%
    }

    .l-col-sm-pull-7 {
        right: 58.33333333%
    }

    .l-col-sm-offset-7 {
        margin-left: 58.33333333%
    }

    .l-col-sm-order-7 {
        order: 7
    }

    .l-col-sm-6 {
        display: block;
        flex: 0 0 50%;
        max-width: 50%
    }

    .l-col-sm-push-6 {
        left: 50%
    }

    .l-col-sm-pull-6 {
        right: 50%
    }

    .l-col-sm-offset-6 {
        margin-left: 50%
    }

    .l-col-sm-order-6 {
        order: 6
    }

    .l-col-sm-5 {
        display: block;
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%
    }

    .l-col-sm-push-5 {
        left: 41.66666667%
    }

    .l-col-sm-pull-5 {
        right: 41.66666667%
    }

    .l-col-sm-offset-5 {
        margin-left: 41.66666667%
    }

    .l-col-sm-order-5 {
        order: 5
    }

    .l-col-sm-4 {
        display: block;
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }

    .l-col-sm-push-4 {
        left: 33.33333333%
    }

    .l-col-sm-pull-4 {
        right: 33.33333333%
    }

    .l-col-sm-offset-4 {
        margin-left: 33.33333333%
    }

    .l-col-sm-order-4 {
        order: 4
    }

    .l-col-sm-3 {
        display: block;
        flex: 0 0 25%;
        max-width: 25%
    }

    .l-col-sm-push-3 {
        left: 25%
    }

    .l-col-sm-pull-3 {
        right: 25%
    }

    .l-col-sm-offset-3 {
        margin-left: 25%
    }

    .l-col-sm-order-3 {
        order: 3
    }

    .l-col-sm-2 {
        display: block;
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }

    .l-col-sm-push-2 {
        left: 16.66666667%
    }

    .l-col-sm-pull-2 {
        right: 16.66666667%
    }

    .l-col-sm-offset-2 {
        margin-left: 16.66666667%
    }

    .l-col-sm-order-2 {
        order: 2
    }

    .l-col-sm-1 {
        display: block;
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%
    }

    .l-col-sm-push-1 {
        left: 8.33333333%
    }

    .l-col-sm-pull-1 {
        right: 8.33333333%
    }

    .l-col-sm-offset-1 {
        margin-left: 8.33333333%
    }

    .l-col-sm-order-1 {
        order: 1
    }

    .l-col-sm-0 {
        display: none
    }

    .l-col-push-0 {
        left: auto
    }

    .l-col-pull-0 {
        right: auto
    }

    .l-col-sm-push-0 {
        left: auto
    }

    .l-col-sm-pull-0 {
        right: auto
    }

    .l-col-sm-offset-0 {
        margin-left: 0
    }

    .l-col-sm-order-0 {
        order: 0
    }
}

@media (min-width: 992px) {
    .l-col-md-12 {
        display: block;
        flex: 0 0 100%;
        max-width: 100%
    }

    .l-col-md-push-12 {
        left: 100%
    }

    .l-col-md-pull-12 {
        right: 100%
    }

    .l-col-md-offset-12 {
        margin-left: 100%
    }

    .l-col-md-order-12 {
        order: 12
    }

    .l-col-md-11 {
        display: block;
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%
    }

    .l-col-md-push-11 {
        left: 91.66666667%
    }

    .l-col-md-pull-11 {
        right: 91.66666667%
    }

    .l-col-md-offset-11 {
        margin-left: 91.66666667%
    }

    .l-col-md-order-11 {
        order: 11
    }

    .l-col-md-10 {
        display: block;
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%
    }

    .l-col-md-push-10 {
        left: 83.33333333%
    }

    .l-col-md-pull-10 {
        right: 83.33333333%
    }

    .l-col-md-offset-10 {
        margin-left: 83.33333333%
    }

    .l-col-md-order-10 {
        order: 10
    }

    .l-col-md-9 {
        display: block;
        flex: 0 0 75%;
        max-width: 75%
    }

    .l-col-md-push-9 {
        left: 75%
    }

    .l-col-md-pull-9 {
        right: 75%
    }

    .l-col-md-offset-9 {
        margin-left: 75%
    }

    .l-col-md-order-9 {
        order: 9
    }

    .l-col-md-8 {
        display: block;
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%
    }

    .l-col-md-push-8 {
        left: 66.66666667%
    }

    .l-col-md-pull-8 {
        right: 66.66666667%
    }

    .l-col-md-offset-8 {
        margin-left: 66.66666667%
    }

    .l-col-md-order-8 {
        order: 8
    }

    .l-col-md-7 {
        display: block;
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%
    }

    .l-col-md-push-7 {
        left: 58.33333333%
    }

    .l-col-md-pull-7 {
        right: 58.33333333%
    }

    .l-col-md-offset-7 {
        margin-left: 58.33333333%
    }

    .l-col-md-order-7 {
        order: 7
    }

    .l-col-md-6 {
        display: block;
        flex: 0 0 50%;
        max-width: 50%
    }

    .l-col-md-push-6 {
        left: 50%
    }

    .l-col-md-pull-6 {
        right: 50%
    }

    .l-col-md-offset-6 {
        margin-left: 50%
    }

    .l-col-md-order-6 {
        order: 6
    }

    .l-col-md-5 {
        display: block;
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%
    }

    .l-col-md-push-5 {
        left: 41.66666667%
    }

    .l-col-md-pull-5 {
        right: 41.66666667%
    }

    .l-col-md-offset-5 {
        margin-left: 41.66666667%
    }

    .l-col-md-order-5 {
        order: 5
    }

    .l-col-md-4 {
        display: block;
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }

    .l-col-md-push-4 {
        left: 33.33333333%
    }

    .l-col-md-pull-4 {
        right: 33.33333333%
    }

    .l-col-md-offset-4 {
        margin-left: 33.33333333%
    }

    .l-col-md-order-4 {
        order: 4
    }

    .l-col-md-3 {
        display: block;
        flex: 0 0 25%;
        max-width: 25%
    }

    .l-col-md-push-3 {
        left: 25%
    }

    .l-col-md-pull-3 {
        right: 25%
    }

    .l-col-md-offset-3 {
        margin-left: 25%
    }

    .l-col-md-order-3 {
        order: 3
    }

    .l-col-md-2 {
        display: block;
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }

    .l-col-md-push-2 {
        left: 16.66666667%
    }

    .l-col-md-pull-2 {
        right: 16.66666667%
    }

    .l-col-md-offset-2 {
        margin-left: 16.66666667%
    }

    .l-col-md-order-2 {
        order: 2
    }

    .l-col-md-1 {
        display: block;
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%
    }

    .l-col-md-push-1 {
        left: 8.33333333%
    }

    .l-col-md-pull-1 {
        right: 8.33333333%
    }

    .l-col-md-offset-1 {
        margin-left: 8.33333333%
    }

    .l-col-md-order-1 {
        order: 1
    }

    .l-col-md-0 {
        display: none
    }

    .l-col-push-0 {
        left: auto
    }

    .l-col-pull-0 {
        right: auto
    }

    .l-col-md-push-0 {
        left: auto
    }

    .l-col-md-pull-0 {
        right: auto
    }

    .l-col-md-offset-0 {
        margin-left: 0
    }

    .l-col-md-order-0 {
        order: 0
    }
}

@media (min-width: 1200px) {
    .l-col-lg-12 {
        display: block;
        flex: 0 0 100%;
        max-width: 100%
    }

    .l-col-lg-push-12 {
        left: 100%
    }

    .l-col-lg-pull-12 {
        right: 100%
    }

    .l-col-lg-offset-12 {
        margin-left: 100%
    }

    .l-col-lg-order-12 {
        order: 12
    }

    .l-col-lg-11 {
        display: block;
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%
    }

    .l-col-lg-push-11 {
        left: 91.66666667%
    }

    .l-col-lg-pull-11 {
        right: 91.66666667%
    }

    .l-col-lg-offset-11 {
        margin-left: 91.66666667%
    }

    .l-col-lg-order-11 {
        order: 11
    }

    .l-col-lg-10 {
        display: block;
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%
    }

    .l-col-lg-push-10 {
        left: 83.33333333%
    }

    .l-col-lg-pull-10 {
        right: 83.33333333%
    }

    .l-col-lg-offset-10 {
        margin-left: 83.33333333%
    }

    .l-col-lg-order-10 {
        order: 10
    }

    .l-col-lg-9 {
        display: block;
        flex: 0 0 75%;
        max-width: 75%
    }

    .l-col-lg-push-9 {
        left: 75%
    }

    .l-col-lg-pull-9 {
        right: 75%
    }

    .l-col-lg-offset-9 {
        margin-left: 75%
    }

    .l-col-lg-order-9 {
        order: 9
    }

    .l-col-lg-8 {
        display: block;
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%
    }

    .l-col-lg-push-8 {
        left: 66.66666667%
    }

    .l-col-lg-pull-8 {
        right: 66.66666667%
    }

    .l-col-lg-offset-8 {
        margin-left: 66.66666667%
    }

    .l-col-lg-order-8 {
        order: 8
    }

    .l-col-lg-7 {
        display: block;
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%
    }

    .l-col-lg-push-7 {
        left: 58.33333333%
    }

    .l-col-lg-pull-7 {
        right: 58.33333333%
    }

    .l-col-lg-offset-7 {
        margin-left: 58.33333333%
    }

    .l-col-lg-order-7 {
        order: 7
    }

    .l-col-lg-6 {
        display: block;
        flex: 0 0 50%;
        max-width: 50%
    }

    .l-col-lg-push-6 {
        left: 50%
    }

    .l-col-lg-pull-6 {
        right: 50%
    }

    .l-col-lg-offset-6 {
        margin-left: 50%
    }

    .l-col-lg-order-6 {
        order: 6
    }

    .l-col-lg-5 {
        display: block;
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%
    }

    .l-col-lg-push-5 {
        left: 41.66666667%
    }

    .l-col-lg-pull-5 {
        right: 41.66666667%
    }

    .l-col-lg-offset-5 {
        margin-left: 41.66666667%
    }

    .l-col-lg-order-5 {
        order: 5
    }

    .l-col-lg-4 {
        display: block;
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }

    .l-col-lg-push-4 {
        left: 33.33333333%
    }

    .l-col-lg-pull-4 {
        right: 33.33333333%
    }

    .l-col-lg-offset-4 {
        margin-left: 33.33333333%
    }

    .l-col-lg-order-4 {
        order: 4
    }

    .l-col-lg-3 {
        display: block;
        flex: 0 0 25%;
        max-width: 25%
    }

    .l-col-lg-push-3 {
        left: 25%
    }

    .l-col-lg-pull-3 {
        right: 25%
    }

    .l-col-lg-offset-3 {
        margin-left: 25%
    }

    .l-col-lg-order-3 {
        order: 3
    }

    .l-col-lg-2 {
        display: block;
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }

    .l-col-lg-push-2 {
        left: 16.66666667%
    }

    .l-col-lg-pull-2 {
        right: 16.66666667%
    }

    .l-col-lg-offset-2 {
        margin-left: 16.66666667%
    }

    .l-col-lg-order-2 {
        order: 2
    }

    .l-col-lg-1 {
        display: block;
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%
    }

    .l-col-lg-push-1 {
        left: 8.33333333%
    }

    .l-col-lg-pull-1 {
        right: 8.33333333%
    }

    .l-col-lg-offset-1 {
        margin-left: 8.33333333%
    }

    .l-col-lg-order-1 {
        order: 1
    }

    .l-col-lg-0 {
        display: none
    }

    .l-col-push-0 {
        left: auto
    }

    .l-col-pull-0 {
        right: auto
    }

    .l-col-lg-push-0 {
        left: auto
    }

    .l-col-lg-pull-0 {
        right: auto
    }

    .l-col-lg-offset-0 {
        margin-left: 0
    }

    .l-col-lg-order-0 {
        order: 0
    }
}

@media (min-width: 1400px) {
    .l-col-xl-12 {
        display: block;
        flex: 0 0 100%;
        max-width: 100%
    }

    .l-col-xl-push-12 {
        left: 100%
    }

    .l-col-xl-pull-12 {
        right: 100%
    }

    .l-col-xl-offset-12 {
        margin-left: 100%
    }

    .l-col-xl-order-12 {
        order: 12
    }

    .l-col-xl-11 {
        display: block;
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%
    }

    .l-col-xl-push-11 {
        left: 91.66666667%
    }

    .l-col-xl-pull-11 {
        right: 91.66666667%
    }

    .l-col-xl-offset-11 {
        margin-left: 91.66666667%
    }

    .l-col-xl-order-11 {
        order: 11
    }

    .l-col-xl-10 {
        display: block;
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%
    }

    .l-col-xl-push-10 {
        left: 83.33333333%
    }

    .l-col-xl-pull-10 {
        right: 83.33333333%
    }

    .l-col-xl-offset-10 {
        margin-left: 83.33333333%
    }

    .l-col-xl-order-10 {
        order: 10
    }

    .l-col-xl-9 {
        display: block;
        flex: 0 0 75%;
        max-width: 75%
    }

    .l-col-xl-push-9 {
        left: 75%
    }

    .l-col-xl-pull-9 {
        right: 75%
    }

    .l-col-xl-offset-9 {
        margin-left: 75%
    }

    .l-col-xl-order-9 {
        order: 9
    }

    .l-col-xl-8 {
        display: block;
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%
    }

    .l-col-xl-push-8 {
        left: 66.66666667%
    }

    .l-col-xl-pull-8 {
        right: 66.66666667%
    }

    .l-col-xl-offset-8 {
        margin-left: 66.66666667%
    }

    .l-col-xl-order-8 {
        order: 8
    }

    .l-col-xl-7 {
        display: block;
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%
    }

    .l-col-xl-push-7 {
        left: 58.33333333%
    }

    .l-col-xl-pull-7 {
        right: 58.33333333%
    }

    .l-col-xl-offset-7 {
        margin-left: 58.33333333%
    }

    .l-col-xl-order-7 {
        order: 7
    }

    .l-col-xl-6 {
        display: block;
        flex: 0 0 50%;
        max-width: 50%
    }

    .l-col-xl-push-6 {
        left: 50%
    }

    .l-col-xl-pull-6 {
        right: 50%
    }

    .l-col-xl-offset-6 {
        margin-left: 50%
    }

    .l-col-xl-order-6 {
        order: 6
    }

    .l-col-xl-5 {
        display: block;
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%
    }

    .l-col-xl-push-5 {
        left: 41.66666667%
    }

    .l-col-xl-pull-5 {
        right: 41.66666667%
    }

    .l-col-xl-offset-5 {
        margin-left: 41.66666667%
    }

    .l-col-xl-order-5 {
        order: 5
    }

    .l-col-xl-4 {
        display: block;
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }

    .l-col-xl-push-4 {
        left: 33.33333333%
    }

    .l-col-xl-pull-4 {
        right: 33.33333333%
    }

    .l-col-xl-offset-4 {
        margin-left: 33.33333333%
    }

    .l-col-xl-order-4 {
        order: 4
    }

    .l-col-xl-3 {
        display: block;
        flex: 0 0 25%;
        max-width: 25%
    }

    .l-col-xl-push-3 {
        left: 25%
    }

    .l-col-xl-pull-3 {
        right: 25%
    }

    .l-col-xl-offset-3 {
        margin-left: 25%
    }

    .l-col-xl-order-3 {
        order: 3
    }

    .l-col-xl-2 {
        display: block;
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }

    .l-col-xl-push-2 {
        left: 16.66666667%
    }

    .l-col-xl-pull-2 {
        right: 16.66666667%
    }

    .l-col-xl-offset-2 {
        margin-left: 16.66666667%
    }

    .l-col-xl-order-2 {
        order: 2
    }

    .l-col-xl-1 {
        display: block;
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%
    }

    .l-col-xl-push-1 {
        left: 8.33333333%
    }

    .l-col-xl-pull-1 {
        right: 8.33333333%
    }

    .l-col-xl-offset-1 {
        margin-left: 8.33333333%
    }

    .l-col-xl-order-1 {
        order: 1
    }

    .l-col-xl-0 {
        display: none
    }

    .l-col-push-0 {
        left: auto
    }

    .l-col-pull-0 {
        right: auto
    }

    .l-col-xl-push-0 {
        left: auto
    }

    .l-col-xl-pull-0 {
        right: auto
    }

    .l-col-xl-offset-0 {
        margin-left: 0
    }

    .l-col-xl-order-0 {
        order: 0
    }
}

@media (min-width: 1880px) {
    .l-col-xxl-12 {
        display: block;
        flex: 0 0 100%;
        max-width: 100%
    }

    .l-col-xxl-push-12 {
        left: 100%
    }

    .l-col-xxl-pull-12 {
        right: 100%
    }

    .l-col-xxl-offset-12 {
        margin-left: 100%
    }

    .l-col-xxl-order-12 {
        order: 12
    }

    .l-col-xxl-11 {
        display: block;
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%
    }

    .l-col-xxl-push-11 {
        left: 91.66666667%
    }

    .l-col-xxl-pull-11 {
        right: 91.66666667%
    }

    .l-col-xxl-offset-11 {
        margin-left: 91.66666667%
    }

    .l-col-xxl-order-11 {
        order: 11
    }

    .l-col-xxl-10 {
        display: block;
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%
    }

    .l-col-xxl-push-10 {
        left: 83.33333333%
    }

    .l-col-xxl-pull-10 {
        right: 83.33333333%
    }

    .l-col-xxl-offset-10 {
        margin-left: 83.33333333%
    }

    .l-col-xxl-order-10 {
        order: 10
    }

    .l-col-xxl-9 {
        display: block;
        flex: 0 0 75%;
        max-width: 75%
    }

    .l-col-xxl-push-9 {
        left: 75%
    }

    .l-col-xxl-pull-9 {
        right: 75%
    }

    .l-col-xxl-offset-9 {
        margin-left: 75%
    }

    .l-col-xxl-order-9 {
        order: 9
    }

    .l-col-xxl-8 {
        display: block;
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%
    }

    .l-col-xxl-push-8 {
        left: 66.66666667%
    }

    .l-col-xxl-pull-8 {
        right: 66.66666667%
    }

    .l-col-xxl-offset-8 {
        margin-left: 66.66666667%
    }

    .l-col-xxl-order-8 {
        order: 8
    }

    .l-col-xxl-7 {
        display: block;
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%
    }

    .l-col-xxl-push-7 {
        left: 58.33333333%
    }

    .l-col-xxl-pull-7 {
        right: 58.33333333%
    }

    .l-col-xxl-offset-7 {
        margin-left: 58.33333333%
    }

    .l-col-xxl-order-7 {
        order: 7
    }

    .l-col-xxl-6 {
        display: block;
        flex: 0 0 50%;
        max-width: 50%
    }

    .l-col-xxl-push-6 {
        left: 50%
    }

    .l-col-xxl-pull-6 {
        right: 50%
    }

    .l-col-xxl-offset-6 {
        margin-left: 50%
    }

    .l-col-xxl-order-6 {
        order: 6
    }

    .l-col-xxl-5 {
        display: block;
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%
    }

    .l-col-xxl-push-5 {
        left: 41.66666667%
    }

    .l-col-xxl-pull-5 {
        right: 41.66666667%
    }

    .l-col-xxl-offset-5 {
        margin-left: 41.66666667%
    }

    .l-col-xxl-order-5 {
        order: 5
    }

    .l-col-xxl-4 {
        display: block;
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }

    .l-col-xxl-push-4 {
        left: 33.33333333%
    }

    .l-col-xxl-pull-4 {
        right: 33.33333333%
    }

    .l-col-xxl-offset-4 {
        margin-left: 33.33333333%
    }

    .l-col-xxl-order-4 {
        order: 4
    }

    .l-col-xxl-3 {
        display: block;
        flex: 0 0 25%;
        max-width: 25%
    }

    .l-col-xxl-push-3 {
        left: 25%
    }

    .l-col-xxl-pull-3 {
        right: 25%
    }

    .l-col-xxl-offset-3 {
        margin-left: 25%
    }

    .l-col-xxl-order-3 {
        order: 3
    }

    .l-col-xxl-2 {
        display: block;
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }

    .l-col-xxl-push-2 {
        left: 16.66666667%
    }

    .l-col-xxl-pull-2 {
        right: 16.66666667%
    }

    .l-col-xxl-offset-2 {
        margin-left: 16.66666667%
    }

    .l-col-xxl-order-2 {
        order: 2
    }

    .l-col-xxl-1 {
        display: block;
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%
    }

    .l-col-xxl-push-1 {
        left: 8.33333333%
    }

    .l-col-xxl-pull-1 {
        right: 8.33333333%
    }

    .l-col-xxl-offset-1 {
        margin-left: 8.33333333%
    }

    .l-col-xxl-order-1 {
        order: 1
    }

    .l-col-xxl-0 {
        display: none
    }

    .l-col-push-0 {
        left: auto
    }

    .l-col-pull-0 {
        right: auto
    }

    .l-col-xxl-push-0 {
        left: auto
    }

    .l-col-xxl-pull-0 {
        right: auto
    }

    .l-col-xxl-offset-0 {
        margin-left: 0
    }

    .l-col-xxl-order-0 {
        order: 0
    }
}

.l-layout {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-layout,
.l-layout__direction-vertical {
    display: flex;
    flex-direction: column;
    background: var(--td-bg-color-page);
    flex: auto
}

.l-layout--with-sider,
.l-layout__direction-horizontal {
    flex-direction: row
}

.l-layout__header {
    height: var(--td-comp-size-xxxl);
    background-color: var(--td-bg-color-container)
}

.l-layout__content {
    flex: auto
}

.l-layout__sider {
    position: relative;
    transition: all .2s;
    background: var(--td-bg-color-container);
    width: 232px
}

.l-layout__footer {
    color: var(--td-text-color-placeholder);
    padding: 24px
}

.l-divider {
    margin: 0;
    padding: 0;
    list-style: none;
    font: var(--td-font-body-medium);
    margin: var(--td-comp-margin-xxl) 0;
    border-top: 1px solid var(--td-border-level-1-color);
    color: var(--td-text-color-primary);
    box-sizing: border-box
}

.l-divider--dashed {
    border-top-style: dashed
}

.l-divider--horizontal {
    width: 100%;
    display: flex
}

.l-divider--vertical {
    border-top: 0;
    display: inline-block;
    margin: 0 var(--td-comp-margin-m);
    border-left: 1px solid var(--td-border-level-1-color);
    height: .9em;
    vertical-align: middle
}

.l-divider--with-text {
    display: flex;
    border-top: 0;
    white-space: nowrap;
    align-items: center
}

.l-divider--with-text .l-divider__inner-text:not(:empty) {
    padding: 0 1em;
    display: inline-block
}

.l-divider--with-text:before,
.l-divider--with-text:after {
    content: "";
    width: 50%;
    border-top: 1px solid var(--td-border-level-1-color)
}

.l-divider--with-text-left:before {
    width: 5%
}

.l-divider--with-text-left:after {
    width: 95%
}

.l-divider--with-text-right:before {
    width: 95%
}

.l-divider--with-text-right:after {
    width: 5%
}

.l-divider--dashed:before,
.l-divider--dashed:after {
    border-top: 1px dashed var(--td-border-level-1-color)
}

.l-divider--vertical.l-divider--dashed {
    border-left: 1px dashed var(--td-border-level-1-color)
}

.l-space {
    display: inline-flex
}

.l-space .l-space-item {
    width: inherit
}

.l-space-align-start {
    align-items: flex-start
}

.l-space-align-end {
    align-items: flex-end
}

.l-space-align-baseline {
    align-items: baseline
}

.l-space-align-center {
    align-items: center
}

.l-space-vertical {
    flex-direction: column
}

.l-space-vertical .l-space-item-separator {
    width: 100%
}

.l-space.l-space--break-line {
    flex-wrap: wrap
}

.l-space.l-space--polyfill {
    display: flex
}

.l-space.l-space--polyfill.l-space-horizontal,
.l-space.l-space--polyfill.l-space--break-line {
    margin-left: calc(-1 * var(--td-space-column-gap, 0))
}

.l-space.l-space--polyfill.l-space-vertical,
.l-space.l-space--polyfill.l-space--break-line {
    margin-top: calc(-1 * var(--td-space-row-gap, 0))
}

.l-space.l-space--polyfill.l-space-horizontal>*,
.l-space.l-space--polyfill.l-space--break-line>* {
    margin-left: var(--td-space-column-gap)
}

.l-space.l-space--polyfill.l-space-vertical>*,
.l-space.l-space--polyfill.l-space--break-line>* {
    margin-top: var(--td-space-row-gap)
}

.l-descriptions {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-descriptions__header {
    color: var(--td-text-color-primary);
    font: var(--td-font-title-medium);
    margin-bottom: var(--td-comp-margin-m);
    font-weight: 600
}

.l-descriptions__body {
    border-collapse: collapse;
    font: var(--td-font-body-medium);
    width: 100%
}

.l-descriptions__body.l-size-l>tbody>tr>td {
    padding: var(--td-comp-paddingTB-l)
}

.l-descriptions__body.l-size-m>tbody>tr>td {
    padding: var(--td-comp-paddingLR-m) var(--td-comp-paddingLR-l)
}

.l-descriptions__body.l-size-s>tbody>tr>td {
    padding: var(--td-comp-paddingLR-s) var(--td-comp-paddingLR-l)
}

.l-descriptions__body .l-descriptions__label {
    color: var(--td-text-color-placeholder)
}

.l-descriptions__body--fixed {
    table-layout: fixed
}

.l-descriptions__body--border>tbody>tr>td {
    border: 1px solid var(--td-component-border)
}

.l-descriptions__body--border .l-descriptions__label {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-descriptions__body--border .l-descriptions__label:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-affix {
    position: fixed;
    z-index: 500
}

.l-anchor {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    --td-anchor-space-base: var(--td-size-6);
    position: relative;
    background: var(--td-bg-color-container);
    width: 200px;
    color: var(--td-text-color-primary);
    font: var(--td-font-body-medium)
}

.l-anchor .l-is-active>a {
    color: var(--td-brand-color)
}

.l-anchor__line {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background-color: var(--td-component-stroke);
    cursor: pointer
}

.l-anchor__line-cursor-wrapper {
    position: absolute;
    display: block;
    height: 0;
    opacity: 0;
    transition: all .2s cubic-bezier(.24, .41, .51, .9)
}

.l-anchor__line-cursor-wrapper .l-anchor__line-cursor {
    width: 1px;
    height: 100%;
    background-color: var(--td-brand-color)
}

.l-anchor__item {
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingTB-l);
    --level: 1;
    padding-left: calc(var(--level) * var(--td-anchor-space-base));
    display: flex;
    flex-direction: column
}

.l-anchor__item.l-is-active {
    font-weight: 500
}

.l-anchor__item-link {
    display: inline-block;
    position: relative;
    overflow: hidden;
    word-break: break-all;
    color: var(--td-text-color-primary);
    text-decoration: none;
    text-align: justify
}

.l-anchor a {
    transition: color .2s linear
}

.l-anchor a:hover {
    color: var(--td-brand-color);
    cursor: pointer
}

.l-anchor a:active {
    color: var(--td-brand-color-active)
}

.l-anchor.l-size-s {
    width: 120px
}

.l-anchor.l-size-l {
    width: 320px
}

.l-anchor__target {
    cursor: pointer;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary)
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        display: none
    }
}

.l-anchor__target .l-anchor__copy {
    display: none;
    margin: 0 0 0 var(--td-comp-margin-xs)
}

.l-anchor__target:hover .l-anchor__copy {
    display: inline-block
}

.l-anchor__target:target:after {
    display: inline-block;
    content: "";
    width: 6px;
    height: 6px;
    border-radius: var(--td-radius-circle);
    background-color: var(--td-brand-color);
    vertical-align: middle;
    animation: fadeOut 2s 2s linear 1;
    animation-fill-mode: forwards
}

.l-message {
    margin: 0;
    padding: 0;
    list-style: none;
    width: fit-content;
    outline: 0;
    border-radius: var(--td-radius-medium);
    background-color: var(--td-bg-color-container);
    box-shadow: var(--td-shadow-3), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    color: var(--td-text-color-primary);
    font: var(--td-font-body-medium);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l)
}

.l-message>.l-icon,
.l-message>[data-l-icon]>.l-icon,
.l-message .l-loading {
    color: var(--td-brand-color);
    margin-right: var(--td-comp-margin-s);
    flex-shrink: 0;
    font-size: calc(var(--td-font-size-body-medium) + 6px)
}

.l-message.l-is-success>.l-icon,
.l-message.l-is-success>[data-l-icon]>.l-icon,
.l-message.l-is-success .l-loading {
    color: var(--td-success-color)
}

.l-message.l-is-warning>.l-icon,
.l-message.l-is-warning>[data-l-icon]>.l-icon,
.l-message.l-is-warning .l-loading {
    color: var(--td-warning-color)
}

.l-message.l-is-error>.l-icon,
.l-message.l-is-error>[data-l-icon]>.l-icon,
.l-message.l-is-error .l-loading {
    color: var(--td-error-color)
}

.l-message.l-is-closable .l-message__close {
    display: inline-flex;
    margin-right: 0;
    margin-left: var(--td-comp-margin-xxl);
    cursor: pointer;
    color: var(--td-text-color-secondary)
}

.l-message.l-is-closable .l-message__close .l-icon-close {
    font-size: calc(var(--td-font-size-body-medium) + 2px);
    border-radius: var(--td-radius-default);
    transition: all .2s linear
}

.l-message.l-is-closable .l-message__close .l-icon-close:hover {
    background: var(--td-bg-color-container-hover)
}

.l-message.l-is-closable .l-message__close .l-icon-close:active {
    background: var(--td-bg-color-container-active)
}

.l-message__list {
    position: fixed;
    z-index: 6000
}

.l-message__list .l-message {
    margin-bottom: var(--td-comp-margin-s);
    word-break: break-all
}

.content-placement-top .l-popup[data-popper-placement^=top] .l-popup__content {
    margin-bottom: var(--td-comp-margin-s)
}

.content-placement-top .l-popup[data-popper-placement^=top] .l-popup__content--arrow {
    margin-bottom: var(--td-comp-margin-l)
}

.content-placement-bottom .l-popup[data-popper-placement^=bottom] .l-popup__content {
    margin-top: var(--td-comp-margin-s)
}

.content-placement-bottom .l-popup[data-popper-placement^=bottom] .l-popup__content--arrow {
    margin-top: var(--td-comp-margin-l)
}

.content-placement-left .l-popup[data-popper-placement^=left] .l-popup__content {
    margin-right: var(--td-comp-margin-s)
}

.content-placement-left .l-popup[data-popper-placement^=left] .l-popup__content--arrow {
    margin-right: var(--td-comp-margin-l)
}

.content-placement-left .l-popup[data-popper-placement^=left] .l-popup__content--text {
    max-width: 480px
}

.content-placement-right .l-popup[data-popper-placement^=right] .l-popup__content {
    margin-left: var(--td-comp-margin-s)
}

.content-placement-right .l-popup[data-popper-placement^=right] .l-popup__content--arrow {
    margin-left: var(--td-comp-margin-l)
}

.content-placement-right .l-popup[data-popper-placement^=right] .l-popup__content--text {
    max-width: 480px
}

.l-popup {
    font: var(--td-font-body-medium);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--td-text-color-primary);
    display: inline-block;
    z-index: 5500
}

.l-popup__content {
    position: relative;
    background: var(--td-bg-color-container);
    box-shadow: var(--td-shadow-2), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left);
    border-radius: var(--td-radius-medium);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-s);
    font-size: var(--td-font-size-body-medium);
    line-height: var(--td-line-height-body-medium);
    box-sizing: border-box;
    word-break: break-all
}

.l-popup__arrow {
    position: absolute;
    z-index: 1;
    width: var(--td-size-4);
    height: var(--td-size-4)
}

.l-popup__arrow:before {
    position: absolute;
    content: "";
    width: var(--td-size-4);
    height: var(--td-size-4);
    transform: rotate(45deg);
    background: var(--td-bg-color-container)
}

.l-popup[data-popper-placement^=top] .l-popup__content {
    margin-bottom: var(--td-comp-margin-s)
}

.l-popup[data-popper-placement^=top] .l-popup__content--arrow {
    margin-bottom: var(--td-comp-margin-l)
}

.l-popup[data-popper-placement^=bottom] .l-popup__content {
    margin-top: var(--td-comp-margin-s)
}

.l-popup[data-popper-placement^=bottom] .l-popup__content--arrow {
    margin-top: var(--td-comp-margin-l)
}

.l-popup[data-popper-placement^=left] .l-popup__content {
    margin-right: var(--td-comp-margin-s)
}

.l-popup[data-popper-placement^=left] .l-popup__content--arrow {
    margin-right: var(--td-comp-margin-l)
}

.l-popup[data-popper-placement^=left] .l-popup__content--text {
    max-width: 480px
}

.l-popup[data-popper-placement^=right] .l-popup__content {
    margin-left: var(--td-comp-margin-s)
}

.l-popup[data-popper-placement^=right] .l-popup__content--arrow {
    margin-left: var(--td-comp-margin-l)
}

.l-popup[data-popper-placement^=right] .l-popup__content--text {
    max-width: 480px
}

.l-popup[data-popper-placement^=top] .l-popup__arrow:before {
    border-top-left-radius: 100%;
    box-shadow: var(--td-shadow-inset-left), var(--td-shadow-inset-bottom)
}

.l-popup[data-popper-placement=top-start] .l-popup__arrow {
    left: var(--td-size-4)
}

.l-popup[data-popper-placement=top] .l-popup__arrow {
    left: 50%;
    margin-left: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement=top-end] .l-popup__arrow {
    left: calc(100% - var(--td-size-4) * 2)
}

.l-popup[data-popper-placement^=bottom] .l-popup__arrow {
    top: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement^=bottom] .l-popup__arrow:before {
    border-bottom-right-radius: 100%;
    box-shadow: var(--td-shadow-inset-top), var(--td-shadow-inset-right)
}

.l-popup[data-popper-placement=bottom-start] .l-popup__arrow {
    left: var(--td-size-4)
}

.l-popup[data-popper-placement=bottom] .l-popup__arrow {
    left: 50%;
    margin-left: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement=bottom-end] .l-popup__arrow {
    left: calc(100% - var(--td-size-4) * 2)
}

.l-popup[data-popper-placement^=left] .l-popup__arrow {
    right: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement^=left] .l-popup__arrow:before {
    box-shadow: var(--td-shadow-inset-left), var(--td-shadow-inset-top)
}

.l-popup[data-popper-placement=left-start] .l-popup__arrow {
    top: var(--td-size-4)
}

.l-popup[data-popper-placement=left] .l-popup__arrow {
    top: 50%;
    margin-top: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement=left-end] .l-popup__arrow {
    top: calc(100% - var(--td-size-4) * 2)
}

.l-popup[data-popper-placement^=right] .l-popup__arrow {
    left: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement^=right] .l-popup__arrow:before {
    box-shadow: var(--td-shadow-inset-right), var(--td-shadow-inset-bottom)
}

.l-popup[data-popper-placement=right-start] .l-popup__arrow {
    top: var(--td-size-4)
}

.l-popup[data-popper-placement=right] .l-popup__arrow {
    top: 50%;
    margin-top: calc(var(--td-size-4) / -2)
}

.l-popup[data-popper-placement=right-end] .l-popup__arrow {
    top: calc(100% - var(--td-size-4) * 2)
}

.l-popup--animation-enter,
.l-popup--animation-enter-from,
.l-popup--animation-exiting,
.l-popup--animation-leave-to {
    opacity: 0;
    visibility: hidden
}

.l-popup--animation-enter-to,
.l-popup--animation-entering,
.l-popup--animation-leave-from,
.l-popup--animation-leave {
    opacity: 1;
    visibility: visible;
    transform: none
}

.l-popup--animation-enter-active {
    transition: opacity .2s linear
}

.l-popup--animation-leave-active {
    transition: opacity .2s cubic-bezier(0, 0, .15, 1), visibility .2s cubic-bezier(.82, 0, 1, .9)
}

.l-popup--animation-expand-enter-active[data-popper-placement^=top] {
    animation: t-popup-animation-expand-in-top .2s cubic-bezier(.38, 0, .24, 1), l-fade-in .2s linear
}

.l-popup--animation-expand-leave-active[data-popper-placement^=top] {
    animation: t-popup-animation-expand-out-top .2s cubic-bezier(.38, 0, .24, 1), l-fade-out .2s cubic-bezier(0, 0, .15, 1)
}

@keyframes t-popup-animation-expand-in-top {
    0% {
        clip-path: polygon(-20% 120%, 120% 120%, 120% 120%, -20% 120%)
    }

    to {
        clip-path: polygon(-20% 0, 120% 0, 120% 120%, -20% 120%)
    }
}

@keyframes t-popup-animation-expand-out-top {
    0% {
        clip-path: polygon(-20% 0, 120% 0, 120% 120%, -20% 120%)
    }

    to {
        clip-path: polygon(-20% 120%, 120% 120%, 120% 120%, -20% 120%)
    }
}

.l-popup--animation-expand-enter-active[data-popper-placement^=bottom] {
    animation: t-popup-animation-expand-in-bottom .2s cubic-bezier(.38, 0, .24, 1), l-fade-in .2s linear
}

.l-popup--animation-expand-leave-active[data-popper-placement^=bottom] {
    animation: t-popup-animation-expand-out-bottom .2s cubic-bezier(.38, 0, .24, 1), l-fade-out .2s cubic-bezier(0, 0, .15, 1)
}

@keyframes t-popup-animation-expand-in-bottom {
    0% {
        clip-path: polygon(-20% 0, 120% 0, 120% 0, -20% 0)
    }

    to {
        clip-path: polygon(-20% 0, 120% 0, 120% 120%, -20% 120%)
    }
}

@keyframes t-popup-animation-expand-out-bottom {
    0% {
        clip-path: polygon(-20% 0, 120% 0, 120% 120%, -20% 120%)
    }

    to {
        clip-path: polygon(-20% 0, 120% 0, 120% 0, -20% 0)
    }
}

.l-tooltip .l-popup__content {
    display: inline-block;
    border: 0;
    z-index: 5600;
    margin-bottom: 1px;
    max-width: 480px;
    word-break: break-word;
    box-sizing: border-box;
    border-radius: var(--td-radius-medium);
    color: var(--td-text-color-primary)
}

.l-tooltip--default .l-popup__content {
    color: var(--td-text-color-anti);
    background: var(--td-gray-color-13);
    box-shadow: inset 0 .5px 0 var(--td-gray-color-9), inset .5px 0 0 var(--td-gray-color-9), inset 0 -.5px 0 var(--td-gray-color-9), inset -.5px 0 0 var(--td-gray-color-9)
}

.l-tooltip--default[data-popper-placement^=left] .l-popup__arrow:before {
    box-shadow: inset -.5px 0 0 var(--td-gray-color-9), inset 0 .5px 0 var(--td-gray-color-9)
}

.l-tooltip--default[data-popper-placement^=right] .l-popup__arrow:before {
    box-shadow: inset .5px 0 0 var(--td-gray-color-9), inset 0 -.5px 0 var(--td-gray-color-9)
}

.l-tooltip--default[data-popper-placement^=top] .l-popup__arrow:before {
    box-shadow: inset 0 -.5px 0 var(--td-gray-color-9), inset -.5px 0 0 var(--td-gray-color-9)
}

.l-tooltip--default[data-popper-placement^=bottom] .l-popup__arrow:before {
    box-shadow: inset .5px 0 0 var(--td-gray-color-9), inset 0 .5px 0 var(--td-gray-color-9)
}

.l-tooltip--primary .l-popup__content {
    color: var(--td-brand-color);
    background: var(--td-brand-color-light)
}

.l-tooltip--success .l-popup__content {
    color: var(--td-success-color);
    background: var(--td-success-color-light)
}

.l-tooltip--danger .l-popup__content {
    color: var(--td-error-color);
    background: var(--td-error-color-light)
}

.l-tooltip--warning .l-popup__content {
    color: var(--td-warning-color);
    background: var(--td-warning-color-light)
}

.l-tooltip .l-popup__arrow {
    background: inherit;
    height: auto
}

.l-tooltip .l-popup__arrow:before {
    background: inherit
}

.l-tooltip--noshadow .l-popup__content,
.l-tooltip--noshadow[data-popper-placement] .l-popup__arrow:before {
    box-shadow: none
}

@keyframes changeColor {
    0% {
        color: var(--td-brand-color-hover)
    }

    to {
        color: var(--td-brand-color-active)
    }
}

.l-breadcrumb {
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    font: var(--td-font-body-medium);
    display: flex;
    align-items: center
}

.l-breadcrumb__separator {
    margin: 0 var(--td-comp-margin-xs);
    display: flex;
    align-items: center
}

.l-breadcrumb__separator .l-icon {
    color: var(--td-text-color-placeholder)
}

.l-breadcrumb__item {
    display: flex;
    align-items: center;
    color: var(--td-text-color-placeholder);
    text-decoration: none
}

.l-breadcrumb__item.l-is-current {
    color: var(--td-text-color-primary)
}

.l-breadcrumb__item.l-is-current .l-icon {
    color: var(--td-text-color-placeholder)
}

.l-breadcrumb__item:last-child {
    color: var(--td-text-color-primary)
}

.l-breadcrumb__item:last-child .l-breadcrumb__separator {
    display: none
}

.l-breadcrumb__item .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-breadcrumb__item .l-link {
    color: inherit;
    text-decoration: none
}

.l-breadcrumb__item .l-link:hover {
    color: var(--td-brand-color)
}

.l-breadcrumb__item .l-is-disabled {
    cursor: not-allowed
}

.l-breadcrumb__item .l-is-disabled .l-breadcrumb__inner {
    color: var(--td-text-color-disabled)
}

.l-breadcrumb__item .l-is-disabled .l-breadcrumb__inner:hover {
    color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-breadcrumb__item .l-is-disabled .l-breadcrumb__inner:active {
    animation: none
}

.l-breadcrumb__item--arrow,
.l-breadcrumb__item--slash {
    margin: 0 var(--td-comp-margin-xs);
    line-height: 0;
    color: var(--td-text-color-placeholder);
    display: inline-block;
    vertical-align: middle
}

.l-breadcrumb__inner {
    font: var(--td-font-body-medium);
    word-break: break-all;
    display: inline-block;
    vertical-align: middle
}

.l-breadcrumb__inner .l-icon {
    margin: 0 var(--td-comp-margin-xs)
}

.l-breadcrumb__select {
    position: relative
}

.l-breadcrumb__select:hover .l-breadcrumb__option {
    display: block
}

.l-breadcrumb__select-item:hover .l-icon {
    color: var(--td-brand-color)
}

.l-breadcrumb__option {
    display: none;
    position: absolute;
    top: 28px;
    left: 50%;
    transform: translate(-50%);
    max-width: 120px;
    background: var(--td-bg-color-container);
    box-shadow: var(--td-shadow-2);
    z-index: 20
}

.l-breadcrumb__option-item {
    padding: 8px;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.l-breadcrumb__option-item:hover,
.l-breadcrumb__option-item.l-is-active {
    color: var(--td-brand-color)
}

.l-breadcrumb__inner-msg {
    display: none;
    position: absolute;
    left: 50%;
    bottom: 30px;
    transform: translate(-50%);
    width: 300px;
    padding: 8px;
    color: var(--td-text-color-primary);
    background: var(--td-bg-color-container);
    border-radius: calc(var(--td-radius-default) * .5);
    box-shadow: var(--td-shadow-2);
    z-index: 20
}

.l-breadcrumb__inner-msg:before {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 50%;
    margin-left: -4px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 6px 0;
    border-color: var(--td-bg-color-container) transparent transparent transparent;
    z-index: 20
}

.l-breadcrumb--text-overflow {
    position: relative;
    display: flex;
    align-items: center
}

.l-breadcrumb--text-overflow:hover .l-breadcrumb__inner-msg {
    display: block
}

.l-breadcrumb--text-overflow .l-breadcrumb__inner {
    max-width: 120px;
    display: flex;
    align-items: center;
    transition: color .2s linear
}

.l-breadcrumb--text-overflow .l-breadcrumb__inner-text {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.l-breadcrumb--text-overflow .l-breadcrumb__inner:hover {
    color: var(--td-brand-color);
    cursor: pointer
}

.l-breadcrumb--text-overflow .l-breadcrumb__inner:active {
    animation: .2s linear changeColor
}

.l-dropdown {
    font: var(--td-font-body-medium);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: var(--td-bg-color-container);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    position: relative;
    box-shadow: var(--td-shadow-2);
    border: .5px solid var(--td-component-border);
    border-radius: var(--td-radius-medium)
}

.l-dropdown__menu {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    border-radius: var(--td-radius-medium);
    padding: var(--td-pop-padding-m);
    gap: 2px;
    overflow-y: auto;
    overflow-x: hidden
}

@-moz-document url-prefix() {
    .l-dropdown__menu {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-dropdown__menu::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.l-dropdown__menu::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.l-dropdown__menu::-webkit-scrollbar-thumb:vertical:hover,
.l-dropdown__menu::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-dropdown__menu .l-divider {
    margin: var(--td-comp-margin-xs) var(--td-comp-margin-s) var(--td-comp-margin-xxs) var(--td-comp-margin-s);
    color: var(--td-brand-color-light);
    width: calc(100% - var(--td-comp-margin-s) * 2)
}

.l-dropdown__menu .l-dropdown__item-direction {
    margin: 0 0 0 var(--td-comp-margin-s)
}

.l-dropdown__menu--overflow .l-dropdown__submenu-wrapper--right {
    left: calc(100% - 14px)
}

.l-dropdown__menu--overflow .l-dropdown__submenu-wrapper--left {
    right: calc(100% - 14px)
}

.l-dropdown__submenu {
    background-color: var(--td-bg-color-container);
    box-shadow: var(--td-shadow-2);
    border-radius: var(--td-radius-medium);
    border: .5px solid var(--td-component-border);
    z-index: 1100;
    position: absolute;
    padding: var(--td-pop-padding-m);
    display: none;
    overflow-y: auto;
    overflow-x: visible
}

@-moz-document url-prefix() {
    .l-dropdown__submenu {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-dropdown__submenu::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.l-dropdown__submenu::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.l-dropdown__submenu::-webkit-scrollbar-thumb:vertical:hover,
.l-dropdown__submenu::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-dropdown__submenu ul {
    list-style: none;
    display: grid;
    padding-left: 0;
    gap: 2px
}

.l-dropdown__submenu--disabled {
    visibility: hidden
}

.l-dropdown__submenu .l-dropdown__item-direction {
    margin: 0 0 0 var(--td-comp-margin-s)
}

.l-dropdown__submenu-wrapper--right {
    left: calc(100% - 6px)
}

.l-dropdown__submenu-wrapper--left {
    right: calc(100% - 6px)
}

.l-dropdown__item {
    border-radius: var(--td-radius-default);
    font: var(--td-font-body-medium);
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    outline: none;
    transition: background-color .2s cubic-bezier(.82, 0, 1, .9);
    white-space: nowrap;
    display: flex;
    align-items: center;
    padding: calc(var(--td-comp-paddingTB-xs) - 1px) var(--td-comp-paddingLR-s);
    --ripple-color: var(--td-bg-color-container-active)
}

.l-dropdown__item-icon {
    display: flex;
    color: currentcolor;
    margin-right: var(--td-comp-margin-s);
    font-size: var(--td-font-size-body-large)
}

.l-dropdown__item:hover>div>div {
    display: flex
}

.l-dropdown__item--disabled {
    cursor: not-allowed
}

.l-dropdown__item-content {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between;
    max-width: 100%
}

.l-dropdown__item-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1
}

.l-dropdown__item.l-dropdown__item--suffix .l-dropdown__item-sub-icon {
    color: currentcolor;
    font-size: var(--td-font-size-body-large);
    flex-shrink: 0
}

.l-dropdown__item--theme-default {
    color: var(--td-text-color-primary)
}

.l-dropdown__item--theme-default:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-default:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-default.l-dropdown__item--active {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light)
}

.l-dropdown__item--theme-default.l-dropdown__item--active:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-default.l-dropdown__item--active:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-default.l-dropdown__item--disabled {
    color: var(--td-text-color-disabled)
}

.l-dropdown__item--theme-default.l-dropdown__item--disabled:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-default.l-dropdown__item--suffix:hover {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.l-dropdown__item--theme-success {
    color: var(--td-success-color)
}

.l-dropdown__item--theme-success:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-success:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-success.l-dropdown__item--active {
    background-color: var(--td-success-color-light)
}

.l-dropdown__item--theme-success.l-dropdown__item--active:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-success.l-dropdown__item--active:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-success.l-dropdown__item-disabled {
    color: var(--td-text-color-disabled)
}

.l-dropdown__item--theme-success.l-dropdown__item-disabled:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-success.l-dropdown__item--suffix:hover {
    background-color: var(--td-success-color-light)
}

.l-dropdown__item--theme-error {
    color: var(--td-error-color)
}

.l-dropdown__item--theme-error:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-error:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-error.l-dropdown__item--active {
    background-color: var(--td-error-color-light)
}

.l-dropdown__item--theme-error.l-dropdown__item--active:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-error.l-dropdown__item--active:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-error.l-dropdown__item--disabled {
    color: var(--td-text-color-disabled)
}

.l-dropdown__item--theme-error.l-dropdown__item--disabled:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-error.l-dropdown__item--suffix:hover {
    background-color: var(--td-error-color-light)
}

.l-dropdown__item--theme-warning {
    color: var(--td-warning-color)
}

.l-dropdown__item--theme-warning:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-warning:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-warning.l-dropdown__item--active {
    background-color: var(--td-warning-color-light)
}

.l-dropdown__item--theme-warning.l-dropdown__item--active:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-warning.l-dropdown__item--active:active {
    background-color: var(--td-bg-color-container-active)
}

.l-dropdown__item--theme-warning.l-dropdown__item--disabled {
    color: var(--td-text-color-disabled)
}

.l-dropdown__item--theme-warning.l-dropdown__item--disabled:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-dropdown__item--theme-warning.l-dropdown__item--suffix:hover {
    background-color: var(--td-warning-color-light)
}

.l-tabs {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    background-color: var(--td-bg-color-container)
}

.l-tabs__header.l-is-left {
    float: left
}

.l-tabs__header.l-is-right {
    float: right
}

.l-tabs__header .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-tabs__nav {
    position: relative;
    overflow: hidden;
    -webkit-user-select: none;
    user-select: none
}

.l-tabs__operations {
    display: flex;
    flex-direction: row;
    position: absolute;
    border-bottom: 1px solid var(--td-component-stroke)
}

.l-tabs__operations--left {
    left: 0;
    z-index: 2
}

.l-tabs__operations--right {
    right: 0;
    z-index: 2
}

.l-tabs__operations--right .l-tabs__btn:first-child {
    box-shadow: -10px 0 20px 5px #0000000d
}

.l-tabs__operations--right .l-tabs__nav-action {
    display: flex;
    align-items: center;
    width: 100%;
    flex: 1
}

.l-tabs__btn {
    width: 40px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--td-bg-color-secondarycontainer);
    border-left: 1px solid var(--td-component-stroke);
    cursor: pointer;
    color: var(--td-text-color-secondary);
    font: var(--td-font-body-large);
    transition: all .24s cubic-bezier(.38, 0, .24, 1);
    z-index: 1;
    opacity: 1
}

.l-tabs__btn:hover {
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-tabs__btn.l-size-m {
    height: var(--td-comp-size-xxl);
    line-height: var(--td-comp-size-xxl)
}

.l-tabs__btn.l-size-l {
    height: var(--td-comp-size-xxxxl);
    line-height: var(--td-comp-size-xxxxl)
}

.l-tabs__btn--left {
    border-right: 1px solid var(--td-component-stroke);
    box-shadow: 10px 0 20px 5px #0000000d
}

.l-tabs__btn--left.fade-enter,
.l-tabs__btn--left.fade-enter-from,
.l-tabs__btn--left.fade-leave-to {
    transform: translate(-50px)
}

.l-tabs__btn--right.fade-enter,
.l-tabs__btn--right.fade-enter-from,
.l-tabs__btn--right.fade-leave-to {
    transform: translate(50px)
}

.l-tabs__nav-container {
    position: relative
}

.l-tabs__nav-container.l-is-top:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: auto;
    right: auto;
    bottom: 0;
    left: 0;
    background-color: var(--td-component-stroke)
}

.l-tabs__nav-container.l-is-bottom:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
    background-color: var(--td-component-stroke)
}

.l-tabs__nav-container.l-is-left:after {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: auto;
    left: auto;
    background-color: var(--td-component-stroke)
}

.l-tabs__nav-container.l-is-right:after {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
    background-color: var(--td-component-stroke)
}

.l-tabs__nav-container.l-is-addable {
    margin-right: 40px
}

.l-tabs__nav-container.l-tabs__nav--card:after {
    content: "";
    background-color: transparent
}

.l-tabs__scroll-btn {
    position: absolute;
    z-index: 1;
    width: 40px;
    height: 100%;
    display: block;
    background-color: var(--td-bg-color-secondarycontainer);
    text-align: center;
    border-bottom: 1px solid var(--td-component-stroke);
    cursor: pointer;
    color: var(--td-text-color-secondary);
    font: var(--td-font-body-large)
}

.l-tabs__scroll-btn.l-size-m {
    height: var(--td-comp-size-xxl);
    line-height: var(--td-comp-size-xxl)
}

.l-tabs__scroll-btn.l-size-l {
    height: var(--td-comp-size-xxxxl);
    line-height: var(--td-comp-size-xxxxl)
}

.l-tabs__nav-scroll {
    position: relative;
    display: inline-block;
    display: flex;
    flex: auto;
    align-self: stretch;
    overflow: hidden;
    white-space: nowrap;
    transform: translate(0);
    z-index: 1
}

.l-tabs__nav-wrap {
    position: relative;
    display: flex;
    font-size: 0
}

.l-tabs__nav-wrap.l-is-smooth {
    transition: transform .24s cubic-bezier(0, 0, .15, 1)
}

.l-tabs__nav-wrap.l-is-vertical {
    flex-direction: column
}

.l-tabs__bar {
    position: absolute;
    background-color: var(--td-brand-color);
    z-index: 1;
    transition: all .24s cubic-bezier(.38, 0, .24, 1);
    border-radius: var(--td-radius-small)
}

.l-tabs__bar.l-is-top {
    bottom: 0;
    left: 0;
    height: 3px
}

.l-tabs__bar.l-is-bottom {
    top: 0;
    left: 0;
    height: 3px
}

.l-tabs__bar.l-is-left {
    top: 0;
    right: 0;
    width: 3px
}

.l-tabs__bar.l-is-right {
    top: 0;
    left: 0;
    width: 3px
}

.l-tabs__nav-item {
    display: inline-flex;
    align-items: center;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    position: relative;
    overflow: hidden;
    z-index: 0;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color cubic-bezier(.38, 0, .24, 1) .2s;
    --ripple-color: var(--td-bg-color-container-active)
}

.l-tabs__nav-item-wrapper {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-m);
    padding: 0 var(--td-comp-paddingLR-s);
    margin-left: var(--td-comp-margin-s);
    margin-right: var(--td-comp-margin-s);
    border-radius: var(--td-radius-default);
    transition: background-color cubic-bezier(.38, 0, .24, 1) .2s;
    --ripple-color: var(--td-bg-color-container-active)
}

.l-tabs__nav-item.l-size-l {
    font: var(--td-font-body-large)
}

.l-tabs__nav-item.l-size-l .l-tabs__nav-item-wrapper {
    height: var(--td-comp-size-xxl);
    padding: 0 var(--td-comp-paddingLR-m)
}

.l-tabs__nav-item-text-wrapper {
    position: relative;
    display: flex;
    align-items: center
}

.l-tabs__nav-item:not(.l-is-disabled):not(.l-is-active):hover .l-tabs__nav-item-wrapper {
    background-color: var(--td-bg-color-container-hover)
}

.l-tabs__nav-item.l-is-left,
.l-tabs__nav-item.l-is-right {
    display: flex;
    align-items: center
}

.l-tabs__nav-item.l-size-m {
    height: var(--td-comp-size-xxl);
    line-height: var(--td-comp-size-xxl)
}

.l-tabs__nav-item.l-size-l {
    height: var(--td-comp-size-xxxxl);
    line-height: var(--td-comp-size-xxxxl)
}

.l-tabs__nav-item.l-is-active {
    color: var(--td-brand-color);
    text-shadow: 0 0 .3px currentcolor
}

.l-tabs__nav-item.l-is-disabled {
    color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-tabs__nav-item>.remove-btn {
    margin-left: var(--td-comp-margin-s);
    transition: all .3s cubic-bezier(.645, .045, .355, 1)
}

.l-tabs__nav--card {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-tabs__nav--card.l-tabs__nav-item {
    padding-right: var(--td-comp-paddingLR-l);
    padding-left: var(--td-comp-paddingLR-l);
    border-bottom: 1px solid var(--td-component-stroke)
}

.l-tabs__nav--card.l-tabs__nav-item:after {
    display: none
}

.l-tabs__nav--card.l-tabs__nav-item:not(.l-is-disabled):not(.l-is-active):hover {
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-tabs__nav--card.l-tabs__nav-item:not(:first-of-type) {
    border-left: 1px solid var(--td-component-stroke)
}

.l-tabs__nav--card.l-tabs__nav-item:last-of-type {
    border-right: 1px solid var(--td-component-stroke)
}

.l-tabs__nav--card.l-tabs__nav-item.l-is-active {
    color: var(--td-brand-color);
    background-color: var(--td-bg-color-container);
    border-bottom-color: var(--td-bg-color-container)
}

.l-tabs__nav--card.l-tabs__nav-item.l-size-l {
    padding-left: var(--td-comp-paddingLR-xl);
    padding-right: var(--td-comp-paddingLR-xl)
}

.l-tabs__nav--card .l-icon-close {
    color: var(--td-text-color-secondary);
    transition: color cubic-bezier(.38, 0, .24, 1) .2s
}

.l-tabs__nav--card .l-icon-close:hover {
    color: var(--td-text-color-primary)
}

.l-tabs__content {
    overflow: hidden;
    position: relative
}

.l-tab-panel.l-is-hidden {
    display: none
}

a.l-menu__item {
    text-decoration: none;
    color: unset
}

a.l-menu__item:hover,
a.l-menu__item:active {
    color: inherit
}

.l-menu__logo>* {
    margin-left: var(--td-comp-margin-xxl)
}

.l-head-menu {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    width: 100%;
    background-color: var(--td-bg-color-container)
}

.l-head-menu__inner {
    display: flex;
    height: var(--td-comp-size-xxxl)
}

.l-head-menu__inner li+li {
    margin-left: var(--td-comp-margin-s)
}

.l-head-menu__inner .l-menu:first-child {
    margin-left: var(--td-comp-margin-xxl)
}

.l-head-menu .l-menu__logo:not(:empty) {
    height: 100%;
    margin-right: var(--td-comp-margin-xxxl)
}

.l-head-menu .l-menu {
    flex: 1;
    display: flex;
    align-items: center
}

.l-head-menu .l-menu__operations:not(:empty) {
    position: relative;
    display: flex;
    align-items: center;
    height: var(--td-comp-size-xxxl);
    line-height: 64px;
    text-align: right;
    margin-right: var(--td-comp-margin-s);
    overflow: hidden
}

.l-head-menu .l-menu__operations-icon {
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
    line-height: var(--td-comp-size-m);
    box-sizing: border-box
}

.l-head-menu .l-submenu>.l-menu__item {
    overflow: unset
}

.l-head-menu .l-submenu>.l-menu__item:before {
    content: "";
    display: block;
    position: absolute;
    bottom: -20px;
    left: 0;
    right: 0;
    height: 20px
}

.l-head-menu .l-menu__item {
    height: var(--td-comp-size-m);
    line-height: var(--td-comp-size-m);
    padding: 0 var(--td-comp-paddingLR-l);
    justify-content: center;
    transition: all .28s cubic-bezier(.645, .045, .355, 1)
}

.l-head-menu__submenu {
    border-top: 1px solid var(--td-component-stroke);
    padding-left: 0
}

.l-head-menu .l-fake-arrow {
    margin-left: var(--td-comp-margin-m)
}

.l-default-menu {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    width: 232px;
    display: inline-block;
    background: var(--td-bg-color-container);
    transition: width .28s cubic-bezier(.645, .045, .355, 1);
    white-space: nowrap
}

.l-default-menu .l-menu__item {
    color: var(--td-text-color-secondary)
}

.l-default-menu.l-is-collapsed {
    width: 64px
}

.l-default-menu.l-is-collapsed .l-menu__logo>* {
    margin-left: var(--td-comp-margin-l)
}

.l-default-menu.l-is-collapsed .l-menu .l-menu__item {
    padding: 0 14px;
    justify-content: center
}

.l-default-menu.l-is-collapsed .l-menu .l-menu__item .l-menu__item-link {
    margin-left: 0;
    opacity: 0;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.l-default-menu.l-is-collapsed .l-fake-arrow {
    display: none
}

.l-default-menu.l-is-collapsed .l-menu__item {
    text-overflow: initial
}

.l-default-menu.l-is-collapsed .l-menu__item.l-is-active.l-is-opened {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light)
}

.l-default-menu.l-is-collapsed .l-menu__item.l-is-active.l-is-opened .l-icon {
    color: var(--td-brand-color)
}

.l-default-menu.l-is-collapsed .l-menu__item.l-menu__item--plain:after {
    content: ""
}

.l-default-menu.l-is-collapsed .l-menu__item span {
    display: none
}

.l-default-menu.l-is-collapsed .l-menu__item .l-icon {
    margin-right: initial
}

.l-default-menu.l-is-collapsed .l-submenu-icon {
    display: none
}

.l-default-menu.l-is-collapsed .l-submenu>.l-menu__item {
    min-width: initial
}

.l-default-menu.l-is-collapsed .l-submenu>.l-menu__item:after {
    content: "";
    display: block;
    position: absolute;
    right: -20px;
    top: 0;
    bottom: 0;
    width: 20px
}

.l-default-menu.l-is-collapsed .l-menu-group:first-child .l-menu-group__title {
    display: none
}

.l-default-menu.l-is-collapsed .l-menu-group:first-child .l-menu-group__title+* {
    margin-top: 0
}

.l-default-menu.l-is-collapsed .l-menu-group__title {
    padding: 0;
    font-size: 0
}

.l-default-menu.l-is-collapsed .l-menu-group__title:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 1px;
    width: 20px;
    background: var(--td-component-stroke)
}

.l-default-menu.l-is-collapsed .l-menu__operations {
    text-align: center
}

.l-default-menu.l-is-collapsed .l-menu__operations-icon {
    display: block
}

.l-default-menu.l-is-collapsed .l-menu__log>* {
    margin: 0 auto
}

.l-default-menu__inner {
    display: flex;
    flex-direction: column;
    height: 100%
}

.l-default-menu__inner .l-menu__logo:not(:empty) {
    box-sizing: border-box;
    width: 100%;
    height: var(--td-comp-size-xxxl);
    border-bottom: 1px solid var(--td-component-stroke)
}

.l-default-menu__inner .l-menu {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-s);
    position: relative;
    flex: 1
}

.l-default-menu__inner .l-menu--scroll {
    overflow-y: auto;
    overflow-x: hidden
}

@-moz-document url-prefix() {
    .l-default-menu__inner .l-menu--scroll {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-default-menu__inner .l-menu--scroll::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-default-menu__inner .l-menu--scroll::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-default-menu__inner .l-menu--scroll::-webkit-scrollbar-thumb:vertical:hover,
.l-default-menu__inner .l-menu--scroll::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-default-menu__inner .l-menu>*:not(.l-menu-group):not(:first-child) {
    margin-top: var(--td-comp-margin-xs)
}

.l-default-menu__inner .l-menu .l-menu-group>*:not(:first-child),
.l-default-menu__inner .l-menu .l-menu__sub>*:not(:first-child),
.l-default-menu__inner .l-menu .l-submenu>*:not(:first-child) {
    margin-top: var(--td-comp-margin-xs)
}

.l-default-menu__inner .l-menu-group__title {
    position: relative;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l) var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-l);
    color: var(--td-text-color-placeholder);
    font-size: var(--td-font-body-small);
    box-sizing: border-box
}

.l-default-menu .l-submenu {
    position: relative
}

.l-default-menu .l-menu__operations:not(:empty) {
    width: 100%;
    position: relative;
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-l);
    top: 0;
    left: 0;
    text-align: left;
    border-top: solid 1px var(--td-component-stroke);
    box-sizing: border-box
}

.l-default-menu .l-menu__operations-icon {
    width: 32px;
    height: 32px;
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
    cursor: pointer;
    color: var(--td-text-color-primary);
    box-sizing: border-box
}

.l-default-menu .l-menu__item.l-is-opened {
    color: var(--td-text-color-primary);
    background-color: unset
}

.l-default-menu .l-menu__item.l-is-opened .l-icon {
    color: var(--td-text-color-primary)
}

.l-default-menu .l-menu__sub {
    padding: 0;
    overflow: hidden
}

.l-default-menu .l-menu__sub .l-menu__item {
    padding-left: var(--padding-left, 32px)
}

.l-default-menu .l-slide-down-enter-active .l-menu__sub {
    height: 100%
}

.l-default-menu .l-menu__item {
    position: relative;
    padding: 0 10px 0 16px;
    height: var(--td-comp-size-l);
    line-height: var(--td-comp-size-l);
    border-bottom: 0;
    text-align: left;
    border-radius: var(--td-radius-default);
    transition: background-color .28s cubic-bezier(.38, 0, .24, 1), padding .28s cubic-bezier(.38, 0, .24, 1);
    box-sizing: border-box
}

.l-default-menu .l-menu__item .l-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0
}

.l-default-menu .l-menu__item .l-fake-arrow {
    margin-left: auto;
    min-width: 16px
}

.l-default-menu .l-menu__item.l-is-active:not(.l-is-opened) {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light)
}

.l-default-menu .l-menu__item.l-is-active:not(.l-is-opened) .l-icon {
    color: var(--td-brand-color)
}

.l-default-menu .l-menu__item:hover:not(.l-is-active):not(.l-is-disabled) {
    background: var(--td-bg-color-secondarycontainer-hover)
}

.l-default-menu.l-menu--dark {
    background: var(--td-gray-color-13)
}

.l-default-menu.l-menu--dark .l-menu__item {
    color: var(--td-font-white-2)
}

.l-default-menu.l-menu--dark .l-menu__logo:not(:empty) {
    border-bottom-color: var(--td-gray-color-10)
}

.l-default-menu.l-menu--dark .l-menu__operations:not(:empty) {
    border-top-color: var(--td-gray-color-10)
}

.l-default-menu.l-menu--dark .l-menu__item:hover:not(.l-is-active):not(.l-is-disabled) {
    background-color: var(--td-gray-color-10)
}

.l-default-menu.l-menu--dark .l-menu__item.l-is-active:not(.l-is-opened) {
    color: var(--td-text-color-anti);
    background-color: var(--td-brand-color)
}

.l-default-menu.l-menu--dark .l-menu__item.l-is-active:not(.l-is-opened) .l-icon {
    color: var(--td-text-color-anti)
}

.l-default-menu.l-menu--dark .l-menu__item.l-is-opened.l-is-active {
    background-color: transparent
}

.l-default-menu.l-menu--dark .l-menu-group__title {
    color: var(--td-font-white-3)
}

.l-default-menu.l-menu--dark.l-is-collapsed .l-menu-group__title:after {
    background-color: var(--td-gray-color-10)
}

.l-default-menu.l-menu--dark.l-is-collapsed .l-menu__item.l-is-active.l-is-opened {
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti)
}

.l-default-menu.l-menu--dark.l-is-collapsed .l-menu__item.l-is-active.l-is-opened .l-icon {
    color: var(--td-text-color-anti)
}

.l-menu {
    color: var(--td-text-color-primary);
    font: var(--td-font-body-medium);
    list-style: none;
    padding: 0;
    margin: 0
}

.l-menu--dark {
    color: var(--td-font-white-2)
}

.l-menu__logo:not(:empty) {
    display: flex;
    align-items: center
}

.l-menu .l-submenu {
    position: relative
}

.l-menu .l-submenu.l-is-active>.l-menu__item {
    color: var(--td-gray-color-13)
}

.l-menu .l-submenu.l-is-active>.l-menu__item .l-icon {
    color: var(--td-gray-color-13)
}

.l-menu .l-submenu .l-submenu-icon {
    width: 16px;
    height: 16px
}

.l-menu .l-submenu.l-is-opened .l-submenu-icon {
    transform: scaleY(-1)
}

.l-menu__spacer:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1
}

.l-menu__spacer--left:before {
    left: -16px;
    width: 16px;
    top: 0;
    bottom: 0
}

.l-menu__spacer--top:before {
    top: -20px;
    left: 0;
    right: 0;
    height: 20px
}

.l-menu__item {
    position: relative;
    display: flex;
    align-items: center;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: var(--td-text-color-primary);
    cursor: pointer;
    text-overflow: ellipsis;
    border-radius: var(--td-radius-default);
    --ripple-color: var(--td-bg-color-container-active)
}

.l-menu__item>.l-fake-arrow {
    margin-left: var(--td-comp-margin-m)
}

.l-menu__item ::selection {
    background: transparent
}

.l-menu__item-spacer {
    overflow: unset
}

.l-menu__item-spacer:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1
}

.l-menu__item-spacer--right:before {
    right: -16px;
    width: 16px;
    top: 0;
    bottom: 0
}

.l-menu__item-spacer--bottom:before {
    bottom: -20px;
    left: 0;
    right: 0;
    height: 20px
}

.l-menu__item a {
    color: unset;
    text-decoration: none
}

.l-menu__item a.l-menu__item-link {
    color: unset;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.l-menu__item a.l-menu__item-link:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.l-menu__item.l-is-active {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light)
}

.l-menu__item.l-is-opened {
    color: var(--td-brand-color)
}

.l-menu__item:hover:not(.l-is-active):not(.l-is-opened):not(.l-is-disabled) {
    background-color: var(--td-bg-color-container-hover)
}

.l-menu__item.l-is-disabled {
    color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-menu__content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.l-icon+.l-menu__content,
.l-icon+.l-menu__item-link {
    margin-left: var(--td-comp-margin-s)
}

.l-menu--dark.l-head-menu {
    background-color: var(--td-gray-color-13)
}

.l-menu--dark .l-menu__item {
    color: var(--td-text-color-anti);
    --ripple-color: var(--td-gray-color-11)
}

.l-menu--dark .l-menu__item.l-is-active {
    color: var(--td-text-color-anti);
    background-color: var(--td-brand-color)
}

.l-menu--dark .l-menu__item.l-is-opened,
.l-menu--dark .l-menu__item.l-is-opened .l-icon {
    color: var(--td-text-color-anti)
}

.l-menu--dark .l-menu__item.l-is-disabled {
    color: var(--td-font-white-4)
}

.l-menu--dark .l-menu__item:hover:not(.l-is-active):not(.l-is-opened):not(.l-is-disabled) {
    background-color: var(--td-gray-color-10)
}

.l-menu--dark .l-menu__popup {
    background: var(--td-gray-color-13);
    border: solid .5px var(--td-gray-color-10)
}

.l-menu--dark .l-menu__popup .l-menu__item {
    color: var(--td-text-color-anti);
    border-radius: var(--td-radius-default)
}

.l-menu--dark .l-menu__popup .l-menu__item.l-is-active {
    color: var(--td-text-color-anti);
    background-color: var(--td-brand-color)
}

.l-menu--dark .l-menu__popup .l-menu__item:hover:not(.l-is-active) {
    background-color: var(--td-gray-color-10)
}

.l-menu--dark .l-head-menu__submenu {
    border-top: 1px solid transparent
}

.l-menu--dark .l-menu__operations-icon {
    color: var(--td-bg-color-container)
}

.l-menu--dark .l-menu__operations-icon:hover {
    background-color: var(--td-brand-color)
}

.l-menu__popup {
    overflow: hidden;
    background: var(--td-bg-color-container);
    z-index: 1000;
    border-radius: var(--td-radius-medium);
    opacity: 0;
    list-style: none;
    padding: 0;
    margin: 0
}

.l-menu__popup.l-popup__content {
    position: absolute
}

.l-menu__popup-wrapper {
    padding: var(--td-pop-padding-m);
    height: 100%;
    list-style: none;
    margin: 0
}

@-moz-document url-prefix() {
    .l-menu__popup-wrapper {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-menu__popup-wrapper::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.l-menu__popup-wrapper::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.l-menu__popup-wrapper::-webkit-scrollbar-thumb:vertical:hover,
.l-menu__popup-wrapper::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-menu__popup .l-fake-arrow {
    margin-left: auto
}

.l-menu__popup .l-menu__item {
    padding-left: var(--td-comp-paddingLR-l);
    padding-right: var(--td-comp-paddingLR-l)
}

.l-menu__popup.l-is-vertical {
    min-width: var(--popup-width, 160px)
}

.l-menu__popup.l-is-horizontal .l-menu__item {
    white-space: nowrap
}

.l-menu__popup.l-is-horizontal li+li {
    margin-top: var(--td-comp-margin-xs)
}

.l-menu__popup.l-is-opened {
    opacity: 1;
    box-shadow: 0 5px 5px -3px #0000001a, 0 8px 10px 1px #0000000f, 0 3px 14px 6px #0000000d;
    overflow: visible
}

.l-menu__popup .l-menu__item {
    color: var(--td-text-color-primary);
    height: var(--td-comp-size-s);
    line-height: var(--td-comp-size-s)
}

.l-menu__popup .l-menu__item+.l-menu__item {
    margin-left: 0
}

.l-menu__popup .l-menu__item:hover:not(.l-is-active) {
    background-color: var(--td-bg-color-container-hover)
}

.l-menu__popup .l-is-disabled {
    color: var(--td-text-color-disabled)
}

.l-menu__operations-icon {
    margin-right: var(--td-comp-margin-l);
    border-radius: var(--td-radius-default);
    color: var(--td-text-color-primary);
    transition: background-color .24s cubic-bezier(.38, 0, .24, 1)
}

.l-menu__operations-icon:hover {
    background-color: var(--td-brand-color-light)
}

.l-opacity-transition {
    transition: opacity .28s cubic-bezier(.55, 0, .1, 1)
}

.horizontal-collapse-transition .l-submenu__title .l-submenu__icon-arrow {
    transition: .2s;
    opacity: 0
}

.l-menu__popup {
    top: 0;
    left: calc(100% - var(--td-pop-padding-m))
}

.l-menu__popup .l-menu__item:not(:first-child),
.l-menu__popup .l-submenu:not(:first-child) {
    margin-top: var(--td-comp-margin-xxs)
}

.l-is-head-menu .l-menu__popup {
    margin-top: calc((var(--td-comp-size-xxxl) - var(--td-comp-size-m)) / 2) !important
}

.l-menu-is-nested .l-menu__popup {
    margin-top: calc(0px - var(--td-pop-padding-m)) !important
}

.l-input-adornment {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex
}

.l-input-adornment__prepend .l-input,
.l-input-adornment__append .l-input,
.l-input-adornment__prepend .l-textarea__inner,
.l-input-adornment__append .l-textarea__inner {
    background-color: transparent
}

.l-input-adornment__prepend {
    background-color: var(--td-bg-color-secondarycontainer);
    color: var(--td-text-color-primary);
    word-break: keep-all;
    margin-right: -1px
}

.l-input-adornment__append {
    background-color: var(--td-bg-color-secondarycontainer);
    color: var(--td-text-color-primary);
    word-break: keep-all;
    margin-left: -1px
}

.l-input-adornment__text {
    display: inline-flex;
    height: 100%;
    align-items: center;
    box-sizing: border-box;
    white-space: nowrap;
    padding: 0 var(--td-comp-paddingLR-s);
    border: 1px solid var(--td-border-level-2-color)
}

.l-input-adornment>:first-child {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-input-adornment>:first-child .l-input,
.l-input-adornment>:first-child .l-input-adornment__text,
.l-input-adornment>:first-child .l-textarea__inner {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-input-adornment>:last-child {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-input-adornment>:last-child .l-input,
.l-input-adornment>:last-child .l-input-adornment__text,
.l-input-adornment>:last-child .l-textarea__inner {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-input-adornment>:not(:last-child):hover {
    z-index: 2
}

.l-input-adornment>:not(:first-child):not(:last-child) .l-input,
.l-input-adornment>:not(:first-child):not(:last-child) .l-textarea__inner {
    border-radius: 0
}

.input-readonly.l-is-readonly {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-specialcomponent)
}

.input-readonly.l-is-readonly .l-input__inner {
    cursor: pointer
}

.input-disabled.l-is-disabled {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled)
}

.input-disabled.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.input-disabled.l-is-disabled .l-input__inner {
    cursor: not-allowed;
    color: var(--td-text-color-disabled);
    text-overflow: initial
}

.input-disabled.l-is-disabled .l-input__inner::placeholder {
    color: var(--td-text-color-disabled)
}

.input-disabled.l-is-disabled>.l-input__prefix .l-icon,
.input-disabled.l-is-disabled>.l-input__suffix .l-icon {
    color: var(--td-text-color-disabled)
}

.input-disabled.l-is-disabled>.l-input__prefix .l-icon:hover,
.input-disabled.l-is-disabled>.l-input__suffix .l-icon:hover {
    color: var(--td-text-color-disabled)
}

.l-tips {
    font-size: var(--td-font-size-body-small)
}

.l-tips.l-is-default {
    color: var(--td-text-color-placeholder)
}

.l-tips.l-is-error {
    color: var(--td-error-color)
}

.l-tips.l-is-warning {
    color: var(--td-warning-color)
}

.l-tips.l-is-success {
    color: var(--td-success-color)
}

.l-input {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    height: var(--td-comp-size-m);
    border-width: 1px;
    border-style: solid;
    border-radius: var(--td-radius-default);
    border-color: var(--td-border-level-2-color);
    padding: 0 var(--td-comp-paddingLR-s);
    background-color: var(--td-bg-color-specialcomponent);
    outline: none;
    color: var(--td-text-color-primary);
    font: var(--td-font-body-medium);
    width: 100%;
    box-sizing: border-box;
    transition: border cubic-bezier(.38, 0, .24, 1) .2s, box-shadow cubic-bezier(.38, 0, .24, 1) .2s, background-color cubic-bezier(.38, 0, .24, 1) .2s;
    display: flex;
    align-items: center;
    overflow: hidden
}

.l-input:hover {
    border-color: var(--td-brand-color)
}

.l-input:focus {
    z-index: 1;
    border-color: var(--td-brand-color);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus)
}

.l-input--borderless:not(.l-input--focused) {
    border-color: transparent;
    transition: border cubic-bezier(.38, 0, .24, 1) .2s, box-shadow cubic-bezier(.38, 0, .24, 1) .2s, background-color cubic-bezier(.38, 0, .24, 1) .2s
}

.l-input--borderless:not(.l-input--focused):hover {
    border-color: var(--td-component-border);
    background-color: var(--td-bg-color-container-hover);
    cursor: pointer
}

.l-input--borderless:not(.l-input--focused).l-is-disabled {
    border: none;
    background-color: var(--td-bg-color-component-disabled)
}

.l-input--focused {
    border-color: var(--td-brand-color);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus);
    z-index: 1
}

.l-input :focus-visible {
    outline: none
}

.l-input__inner {
    flex: 1;
    border: none;
    outline: none;
    padding: 0;
    max-width: 100%;
    min-width: 0;
    color: var(--td-text-color-primary);
    font: inherit;
    background-color: transparent;
    box-sizing: border-box;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-input__inner::placeholder {
    color: var(--td-text-color-placeholder)
}

.l-input__inner:placeholder-shown {
    text-overflow: ellipsis;
    width: 100%
}

.l-input__inner[type=password]::-ms-reveal {
    display: none
}

.l-input__inner[type=search]::-webkit-search-decoration,
.l-input__inner[type=search]::-webkit-search-cancel-button,
.l-input__inner[type=search]::-webkit-search-results-button,
.l-input__inner[type=search]::-webkit-search-results-decoration {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.l-input__inner.l-input--soft-hidden {
    width: 0
}

.l-input__extra {
    font: var(--td-font-body-small);
    color: var(--td-text-color-placeholder)
}

.l-input__status {
    position: absolute;
    right: -24px;
    top: 0
}

.l-input.l-input--suffix>span.l-input__clear {
    opacity: 0;
    visibility: hidden;
    transition: border cubic-bezier(.38, 0, .24, 1) .2s, box-shadow cubic-bezier(.38, 0, .24, 1) .2s, background-color cubic-bezier(.38, 0, .24, 1) .2s
}

.l-input.l-input--suffix:hover>span.l-input__clear {
    opacity: 1;
    visibility: visible
}

.l-input.l-is-success {
    border-color: var(--td-success-color)
}

.l-input.l-is-success:focus {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-input.l-is-success.l-input--focused {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-input.l-is-success>.l-input__extra {
    color: var(--td-success-color)
}

.l-input.l-is-warning {
    border-color: var(--td-warning-color)
}

.l-input.l-is-warning:focus {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-input.l-is-warning.l-input--focused {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-input.l-is-warning>.l-input__extra {
    color: var(--td-warning-color)
}

.l-input.l-is-error {
    border-color: var(--td-error-color)
}

.l-input.l-is-error:focus {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-input.l-is-error.l-input--focused {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-input.l-is-error>.l-input__extra {
    color: var(--td-error-color)
}

.l-input.l-is-readonly {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-specialcomponent)
}

.l-input.l-is-readonly .l-input__inner {
    cursor: pointer
}

.l-input.l-is-disabled {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled)
}

.l-input.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.l-input.l-is-disabled .l-input__inner {
    cursor: not-allowed;
    color: var(--td-text-color-disabled);
    text-overflow: initial
}

.l-input.l-is-disabled .l-input__inner::placeholder {
    color: var(--td-text-color-disabled)
}

.l-input.l-is-disabled>.l-input__prefix .l-icon,
.l-input.l-is-disabled>.l-input__suffix .l-icon {
    color: var(--td-text-color-disabled)
}

.l-input.l-is-disabled>.l-input__prefix .l-icon:hover,
.l-input.l-is-disabled>.l-input__suffix .l-icon:hover {
    color: var(--td-text-color-disabled)
}

.l-input.l-input--prefix>.l-input__prefix {
    z-index: 2;
    height: 100%;
    text-align: center;
    display: flex;
    align-items: center
}

.l-input.l-input--prefix>.l-input__prefix-icon {
    font-size: var(--td-font-size-body-large)
}

.l-input.l-input--suffix>.l-input__suffix {
    z-index: 2;
    height: 100%;
    text-align: center;
    display: flex;
    align-items: center
}

.l-input.l-input--suffix>.l-input__suffix-icon {
    font-size: var(--td-font-size-body-large)
}

.l-input .l-input__suffix-clear {
    cursor: pointer
}

.l-input.l-size-l {
    height: var(--td-comp-size-xl);
    font: var(--td-font-body-large);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m)
}

.l-input.l-size-s {
    height: var(--td-comp-size-xs);
    font: var(--td-font-body-small)
}

.l-input .l-input__prefix>.l-icon,
.l-input .l-input__suffix>.l-icon {
    font-size: inherit
}

.l-input .l-input__prefix>.l-icon {
    font-size: 16px;
    color: var(--td-text-color-placeholder)
}

.l-input .l-input__prefix:not(:empty) {
    margin-right: var(--td-comp-margin-s)
}

.l-input .l-input__suffix>.l-icon {
    color: var(--td-text-color-placeholder);
    transition: all .2s linear
}

.l-input .l-input__suffix>.l-icon:hover {
    color: var(--td-text-color-secondary);
    transition: all .2s linear
}

.l-input .l-input__suffix:not(:empty) {
    margin-left: var(--td-comp-margin-s)
}

.l-input.l-is-focused .l-input__prefix>.l-icon {
    color: var(--td-brand-color)
}

.l-input.l-is-focused .l-input__suffix>.l-icon-time,
.l-input.l-is-focused .l-input__suffix .l-icon-calendar {
    color: var(--td-brand-color)
}

.l-input-group {
    position: relative;
    display: inline-flex;
    align-items: stretch
}

.l-input-group .l-input__wrap {
    border-radius: 0
}

.l-input-group .l-input__wrap:first-child {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-input-group .l-input__wrap:last-child {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-input-group .l-button,
.l-input-group .l-select {
    border-radius: 0
}

.l-input-group .l-button:not(:first-child),
.l-input-group .l-select:not(:first-child) {
    margin-left: -1px
}

.l-input-group .l-input__wrap:not(:first-child) .l-input {
    margin-left: -1px
}

.l-input-group .l-input__wrap:first-child .l-input {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-input-group .l-input__wrap:last-child .l-input {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-input-group .l-button:first-child,
.l-input-group .l-select:first-child {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-input-group .l-button:last-child,
.l-input-group .l-select:last-child {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-input-group--separate .l-input__wrap+.l-input__wrap {
    margin-left: var(--td-comp-margin-xxxl)
}

.l-input-group--separate .l-button,
.l-input-group--separate .l-select {
    border-radius: var(--td-radius-default)
}

.l-input-group--separate .l-button:first-child,
.l-input-group--separate .l-select:first-child {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-input-group--separate .l-button:last-child,
.l-input-group--separate .l-select:last-child {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-input-group--separate .l-input__wrap .l-input,
.l-input-group--separate .l-input__wrap .l-input:first-child {
    border-radius: var(--td-radius-default)
}

.l-input-group--separate .l-input__wrap .l-input:last-child {
    border-radius: var(--td-radius-default)
}

.l-input-group .l-input__inner,
.l-input-group .l-button,
.l-input-group .l-select {
    position: relative;
    z-index: 0
}

.l-input-group .l-input__inner:hover,
.l-input-group .l-button:hover,
.l-input-group .l-select:hover,
.l-input-group .l-input__inner:focus,
.l-input-group .l-button:focus,
.l-input-group .l-select:focus,
.l-input-group .l-input__inner:active,
.l-input-group .l-button:active,
.l-input-group .l-select:active {
    z-index: 1
}

.l-input__wrap {
    width: 100%
}

.l-input__tips {
    height: auto;
    min-height: var(--td-line-height-body-small);
    font: var(--td-font-body-small);
    position: absolute
}

.l-input__tips--default {
    color: var(--td-text-color-placeholder)
}

.l-input__tips--success {
    color: var(--td-success-color)
}

.l-input__tips--warning {
    color: var(--td-warning-color)
}

.l-input__tips--error {
    color: var(--td-error-color)
}

.l-align-center>.l-input__inner {
    text-align: center
}

.l-align-right>.l-input__inner {
    text-align: right
}

.l-input__input-pre {
    position: absolute;
    visibility: hidden;
    white-space: pre;
    display: block
}

.l-input--auto-width {
    width: fit-content;
    min-width: 60px
}

.l-input__limit-number {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-placeholder);
    background: var(--td-bg-color-specialcomponent)
}

.l-input__limit-number.l-is-disabled {
    background: var(--td-bg-color-component-disabled)
}

.l-input-number {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    padding: 0 var(--td-comp-size-m);
    -webkit-user-select: none;
    user-select: none;
    width: 144px
}

.l-input-number:not(.l-input-number--column)>.l-input-number__decrease+.l-input__wrap {
    margin-left: var(--td-comp-margin-xs)
}

.l-input-number input::-webkit-outer-spin-button,
.l-input-number input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.l-input-number input[type=number] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield
}

.l-input-number>.l-input__tips {
    position: absolute;
    left: 0
}

.l-input-number input+.l-input__suffix {
    margin-left: var(--td-comp-paddingLR-s)
}

.l-input-number .l-input__prefix {
    margin-right: var(--td-comp-paddingLR-s)
}

.l-input-number .l-input {
    color: var(--td-text-color-primary)
}

.l-input-number.l-input-number--auto-width {
    width: auto
}

.l-input-number.l-input-number--auto-width.l-is-controls-right {
    min-width: auto;
    width: auto
}

.l-input-number.l-input-number--auto-width .l-input__inner {
    min-width: 42px
}

.l-input-number .l-input-number__decrease,
.l-input-number .l-input-number__increase {
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    position: absolute;
    top: 0;
    border: 1px solid var(--td-border-level-2-color);
    box-sizing: border-box;
    border-radius: var(--td-radius-default);
    background-color: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    cursor: pointer;
    transition: all cubic-bezier(.38, 0, .24, 1) .2s
}

.l-input-number .l-input-number__decrease:hover,
.l-input-number .l-input-number__increase:hover {
    color: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-input-number .l-input-number__decrease:hover .l-icon,
.l-input-number .l-input-number__increase:hover .l-icon {
    color: var(--td-brand-color)
}

.l-input-number .l-input-number__decrease:active,
.l-input-number .l-input-number__increase:active {
    color: var(--td-brand-color);
    background-color: var(--td-bg-color-container-hover)
}

.l-input-number .l-input-number__decrease .l-icon,
.l-input-number .l-input-number__increase .l-icon {
    position: relative;
    z-index: 1;
    font-size: var(--td-font-size-body-large);
    color: var(--td-text-color-secondary)
}

.l-input-number .l-input-number__decrease.l-is-disabled,
.l-input-number .l-input-number__increase.l-is-disabled {
    color: var(--td-text-color-disabled);
    cursor: no-drop;
    background-color: var(--td-bg-color-component-disabled)
}

.l-input-number .l-input-number__decrease.l-is-disabled .l-icon,
.l-input-number .l-input-number__increase.l-is-disabled .l-icon {
    color: var(--td-text-color-disabled)
}

.l-input-number .l-input-number__decrease.l-is-disabled:hover,
.l-input-number .l-input-number__increase.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.l-input-number .l-input-number__decrease.l-is-disabled:hover .l-icon,
.l-input-number .l-input-number__increase.l-is-disabled:hover .l-icon {
    color: var(--td-text-color-disabled)
}

.l-input-number .l-input-number__decrease.l-is-disabled::placeholder,
.l-input-number .l-input-number__increase.l-is-disabled::placeholder {
    color: var(--td-text-color-disabled)
}

.l-input-number .l-input-number__decrease {
    left: 0
}

.l-input-number .l-input-number__increase {
    right: -8px
}

.l-input-number.l-is-disabled .l-input {
    cursor: no-drop;
    background-color: var(--td-bg-color-component-disabled);
    color: var(--td-text-color-disabled)
}

.l-input-number.l-is-disabled .l-input:hover,
.l-input-number.l-is-disabled .l-input:focus,
.l-input-number.l-is-disabled .l-input:active {
    border-color: var(--td-border-level-2-color)
}

.l-input-number.l-is-disabled .l-input-number__decrease,
.l-input-number.l-is-disabled .l-input-number__increase {
    color: var(--td-text-color-disabled);
    cursor: no-drop;
    background-color: var(--td-bg-color-component-disabled)
}

.l-input-number.l-is-disabled .l-input-number__decrease .l-icon,
.l-input-number.l-is-disabled .l-input-number__increase .l-icon {
    color: var(--td-text-color-secondary)
}

.l-input-number.l-size-s {
    width: 120px;
    padding: 0 var(--td-comp-size-xs)
}

.l-input-number.l-size-s .l-input {
    font-size: var(--td-font-size-body-small);
    height: var(--td-comp-size-xs);
    line-height: var(--td-comp-size-xs)
}

.l-input-number.l-size-s .l-input-number__decrease,
.l-input-number.l-size-s .l-input-number__increase {
    font-size: var(--td-font-size-body-medium);
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs)
}

.l-input-number.l-size-l {
    width: 168px;
    padding: 0 var(--td-comp-size-xl)
}

.l-input-number.l-size-l .l-input {
    height: var(--td-comp-size-xl);
    line-height: var(--td-comp-size-xl)
}

.l-input-number.l-size-l .l-input-number__decrease,
.l-input-number.l-size-l .l-input-number__increase {
    font-size: 18px;
    width: var(--td-comp-size-xl);
    height: var(--td-comp-size-xl)
}

.l-input-number.l-size-l.l-is-controls-right .l-input {
    height: var(--td-comp-size-xl);
    line-height: var(--td-comp-size-xl);
    padding-right: calc(var(--td-comp-size-xl) + var(--td-comp-paddingLR-s))
}

.l-input-number.l-size-l.l-is-controls-right .l-input-number__decrease,
.l-input-number.l-size-l.l-is-controls-right .l-input-number__increase {
    width: var(--td-comp-size-xl);
    font-size: var(--td-font-size-body-large)
}

.l-input-number.l-size-l .l-input--prefix {
    font: var(--td-font-body-large);
    padding: 0 var(--td-comp-paddingLR-m)
}

.l-input-number.l-input-number--normal {
    padding: 0;
    border-radius: var(--td-radius-default)
}

.l-input-number.l-input-number--normal.l-is-disabled {
    cursor: no-drop;
    color: var(--td-text-color-disabled)
}

.l-input-number.l-input-number--normal.l-is-disabled:hover .l-input {
    border-color: var(--td-border-level-2-color)
}

.l-input-number.l-input-number--normal.l-is-disabled::placeholder {
    color: var(--td-text-color-disabled)
}

.l-input-number.l-input-number--normal.l-is-disabled .l-input:focus {
    box-shadow: none
}

.l-input-number.l-is-controls-right {
    width: 96px;
    padding: 0
}

.l-input-number.l-is-controls-right:hover .l-input-number__decrease,
.l-input-number.l-is-controls-right:hover .l-input-number__increase {
    opacity: 1;
    visibility: visible
}

.l-input-number.l-is-controls-right .l-input {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding-right: calc(var(--td-comp-size-m) + var(--td-comp-paddingLR-s));
    border-radius: var(--td-radius-default)
}

.l-input-number.l-is-controls-right .l-input-number__decrease,
.l-input-number.l-is-controls-right .l-input-number__increase {
    width: var(--td-comp-size-m);
    height: calc(calc(var(--td-comp-size-m) / 2) - 2px);
    border: 0;
    left: initial;
    top: initial;
    right: 1px;
    border-radius: 0;
    background: var(--td-bg-color-secondarycontainer);
    opacity: 0;
    visibility: hidden;
    z-index: 2
}

.l-input-number.l-is-controls-right .l-input-number__decrease .l-icon,
.l-input-number.l-is-controls-right .l-input-number__increase .l-icon {
    font-size: var(--td-font-size-body-small)
}

.l-input-number.l-is-controls-right .l-input-number__decrease:hover,
.l-input-number.l-is-controls-right .l-input-number__increase:hover {
    background: var(--td-bg-color-component-hover)
}

.l-input-number.l-is-controls-right .l-input-number__decrease:hover .l-icon,
.l-input-number.l-is-controls-right .l-input-number__increase:hover .l-icon {
    color: var(--td-text-color-primary)
}

.l-input-number.l-is-controls-right .l-input-number__decrease.l-is-disabled,
.l-input-number.l-is-controls-right .l-input-number__increase.l-is-disabled {
    color: var(--td-text-color-disabled);
    cursor: no-drop;
    background-color: var(--td-bg-color-component-disabled)
}

.l-input-number.l-is-controls-right .l-input-number__decrease.l-is-disabled .l-icon,
.l-input-number.l-is-controls-right .l-input-number__increase.l-is-disabled .l-icon {
    color: var(--td-text-color-disabled)
}

.l-input-number.l-is-controls-right .l-input-number__decrease.l-is-disabled:hover,
.l-input-number.l-is-controls-right .l-input-number__increase.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.l-input-number.l-is-controls-right .l-input-number__decrease.l-is-disabled:hover .l-icon,
.l-input-number.l-is-controls-right .l-input-number__increase.l-is-disabled:hover .l-icon {
    color: var(--td-text-color-disabled)
}

.l-input-number.l-is-controls-right .l-input-number__decrease.l-is-disabled::placeholder,
.l-input-number.l-is-controls-right .l-input-number__increase.l-is-disabled::placeholder {
    color: var(--td-text-color-disabled)
}

.l-input-number.l-is-controls-right .l-input-number__increase {
    top: 1px;
    border-top-right-radius: calc(var(--td-radius-default) - 1px)
}

.l-input-number.l-is-controls-right .l-input-number__decrease {
    top: calc(calc(calc(var(--td-comp-size-m) / 2) - 2px) + 3px);
    border-bottom-right-radius: calc(var(--td-radius-default) - 1px)
}

.l-input-number.l-is-controls-right.l-size-l {
    width: 120px
}

.l-input-number.l-is-controls-right.l-size-l .l-input-number__increase,
.l-input-number.l-is-controls-right.l-size-l .l-input-number__decrease {
    height: calc(calc(var(--td-comp-size-xl) / 2) - 2px)
}

.l-input-number.l-is-controls-right.l-size-l .l-input-number__decrease {
    top: calc(calc(calc(var(--td-comp-size-xl) / 2) - 2px) + 3px)
}

.l-input-number.l-is-controls-right.l-size-s {
    width: 88px
}

.l-input-number.l-is-controls-right.l-size-s .l-input-number__increase,
.l-input-number.l-is-controls-right.l-size-s .l-input-number__decrease {
    height: calc(calc(var(--td-comp-size-xs) / 2) - 2px)
}

.l-input-number.l-is-controls-right.l-size-s .l-input-number__decrease {
    top: calc(calc(calc(var(--td-comp-size-xs) / 2) - 2px) + 3px)
}

.l-input-number--row .l-input__wrap {
    width: initial;
    margin-right: var(--td-comp-margin-xs)
}

.l-input-number--row .l-input-number__increase {
    right: 0
}

.l-checkbox-group {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    flex-wrap: wrap;
    gap: 16px
}

.l-checkbox {
    font: var(--td-font-body-medium);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    color: var(--td-text-color-primary)
}

.l-checkbox+.l-checkbox {
    margin-left: inherit
}

.l-checkbox__former {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.l-checkbox__input {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    border: 1px solid var(--td-border-level-2-color);
    border-radius: var(--td-radius-default);
    background-color: var(--td-bg-color-container);
    box-sizing: border-box;
    flex-shrink: 0
}

.l-checkbox__input:after {
    content: "";
    position: absolute;
    opacity: 0;
    box-sizing: border-box
}

.l-checkbox__label {
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
    font: var(--td-font-body-medium)
}

.l-checkbox:hover .l-checkbox__input {
    border-color: var(--td-brand-color);
    transition: border-color .2s linear
}

.l-checkbox.l-is-checked .l-checkbox__input {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color);
    transition: background-color .2s cubic-bezier(.82, 0, 1, .9)
}

.l-checkbox.l-is-checked .l-checkbox__input:after {
    opacity: 1;
    top: 6px;
    left: 3px;
    width: 5px;
    height: 9px;
    border: 2px solid var(--td-text-color-anti);
    border-radius: 0 0 1px;
    border-top: 0;
    border-left: 0;
    transform: rotate(45deg) scale(1) translate(-50%, -50%);
    background: transparent
}

.l-checkbox.l-is-indeterminate .l-checkbox__input {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color);
    transition: background-color .2s cubic-bezier(.82, 0, 1, .9)
}

.l-checkbox.l-is-indeterminate .l-checkbox__input:after {
    opacity: 1;
    width: 16px;
    height: 4px;
    left: -1px;
    right: 0;
    top: 5px;
    border: unset;
    transform: scale(.5);
    background-color: var(--td-font-white-1)
}

.l-checkbox.l-is-disabled {
    cursor: not-allowed
}

.l-checkbox.l-is-disabled .l-checkbox__label {
    color: var(--td-text-color-disabled)
}

.l-checkbox.l-is-disabled .l-checkbox__input {
    background-color: var(--td-bg-color-component-disabled)
}

.l-checkbox.l-is-disabled:hover .l-checkbox__input,
.l-checkbox.l-is-disabled.l-is-checked .l-checkbox__input {
    border-color: var(--td-border-level-2-color)
}

.l-checkbox.l-is-disabled.l-is-checked .l-checkbox__input:after {
    border-color: var(--td-text-color-disabled)
}

.l-checkbox.l-is-disabled.l-is-indeterminate .l-checkbox__input {
    border-color: var(--td-border-level-2-color)
}

.l-checkbox.l-is-disabled.l-is-indeterminate .l-checkbox__input:after {
    background-color: var(--td-text-color-disabled)
}

.l-checkbox:focus-visible:focus-visible {
    outline: 2px solid var(--td-brand-color);
    outline-offset: var(--td-comp-paddingTB-xs);
    border-radius: 0
}

.l-tag {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    align-items: center;
    flex-direction: row;
    padding: 0px var(--td-comp-paddingLR-s);
    height: var(--td-comp-size-xs);
    font: var(--td-font-body-small);
    color: var(--td-text-color-anti);
    border-radius: var(--td-radius-default);
    border: 1px solid transparent;
    white-space: nowrap
}

.l-tag .l-icon {
    margin-right: var(--td-comp-margin-xs);
    width: calc(var(--td-font-size-body-medium) + 2px);
    height: calc(var(--td-font-size-body-medium) + 2px);
    flex-shrink: 0
}

.l-tag .l-tag__icon-close {
    margin-right: 0;
    margin-left: var(--td-comp-margin-s);
    font: var(--td-font-body-medium);
    cursor: pointer;
    transition: color .2s cubic-bezier(.38, 0, .24, 1)
}

.l-tag--default {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-component)
}

.l-tag--default .l-tag__icon-close {
    color: var(--td-text-color-placeholder)
}

.l-tag--default .l-tag__icon-close:hover {
    color: var(--td-text-color-primary)
}

.l-tag--default:active {
    cursor: default
}

.l-tag--default.l-tag--disabled {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled);
    border-color: var(--td-component-border);
    cursor: not-allowed
}

.l-tag--default.l-tag--disabled:hover {
    cursor: not-allowed
}

.l-tag--default.l-tag--disabled .l-icon:hover {
    cursor: pointer
}

.l-tag--default.l-tag--outline {
    border-color: var(--td-component-border)
}

.l-tag--default.l-tag--light {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-tag--default.l-tag--light-outline {
    border-color: var(--td-component-border);
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-tag--primary {
    background-color: var(--td-brand-color)
}

.l-tag--primary.l-tag--outline {
    border-color: var(--td-brand-color)
}

.l-tag--primary.l-tag--light {
    background-color: var(--td-brand-color-light)
}

.l-tag--primary.l-tag--light-outline {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color-light)
}

.l-tag--primary.l-tag--light,
.l-tag--primary.l-tag--outline,
.l-tag--primary.l-tag--light-outline {
    color: var(--td-brand-color)
}

.l-tag--primary.l-tag--light .l-tag__icon-close:hover,
.l-tag--primary.l-tag--outline .l-tag__icon-close:hover,
.l-tag--primary.l-tag--light-outline .l-tag__icon-close:hover {
    color: var(--td-brand-color-hover)
}

.l-tag--success {
    background-color: var(--td-success-color)
}

.l-tag--success.l-tag--outline {
    border-color: var(--td-success-color)
}

.l-tag--success.l-tag--light {
    background-color: var(--td-success-color-light)
}

.l-tag--success.l-tag--light-outline {
    border-color: var(--td-success-color);
    background-color: var(--td-success-color-light)
}

.l-tag--success.l-tag--light,
.l-tag--success.l-tag--outline,
.l-tag--success.l-tag--light-outline {
    color: var(--td-success-color)
}

.l-tag--success.l-tag--light .l-tag__icon-close:hover,
.l-tag--success.l-tag--outline .l-tag__icon-close:hover,
.l-tag--success.l-tag--light-outline .l-tag__icon-close:hover {
    color: var(--td-success-color-hover)
}

.l-tag--warning {
    background-color: var(--td-warning-color)
}

.l-tag--warning.l-tag--outline {
    border-color: var(--td-warning-color)
}

.l-tag--warning.l-tag--light {
    background-color: var(--td-warning-color-light)
}

.l-tag--warning.l-tag--light-outline {
    border-color: var(--td-warning-color);
    background-color: var(--td-warning-color-light)
}

.l-tag--warning.l-tag--light,
.l-tag--warning.l-tag--outline,
.l-tag--warning.l-tag--light-outline {
    color: var(--td-warning-color)
}

.l-tag--warning.l-tag--light .l-tag__icon-close:hover,
.l-tag--warning.l-tag--outline .l-tag__icon-close:hover,
.l-tag--warning.l-tag--light-outline .l-tag__icon-close:hover {
    color: var(--td-warning-color-hover)
}

.l-tag--danger {
    background-color: var(--td-error-color)
}

.l-tag--danger.l-tag--outline {
    border-color: var(--td-error-color)
}

.l-tag--danger.l-tag--light {
    background-color: var(--td-error-color-light)
}

.l-tag--danger.l-tag--light-outline {
    border-color: var(--td-error-color);
    background-color: var(--td-error-color-light)
}

.l-tag--danger .l-tag__icon-close {
    fill: var(--td-error-color)
}

.l-tag--danger .l-tag__icon-close:hover {
    fill: var(--td-error-color-hover)
}

.l-tag--danger.l-tag--light,
.l-tag--danger.l-tag--outline,
.l-tag--danger.l-tag--light-outline {
    color: var(--td-error-color)
}

.l-tag--danger.l-tag--light .l-tag__icon-close:hover,
.l-tag--danger.l-tag--outline .l-tag__icon-close:hover,
.l-tag--danger.l-tag--light-outline .l-tag__icon-close:hover {
    color: var(--td-error-color-hover)
}

.l-tag--dark.l-tag:not(.l-tag--default) .l-tag__icon-close {
    color: var(--td-font-white-2)
}

.l-tag--dark.l-tag:not(.l-tag--default) .l-tag__icon-close:hover {
    color: var(--td-font-white-1)
}

.l-tag.l-tag--outline {
    background: transparent
}

.l-tag.l-size-s {
    padding: 0px var(--td-comp-paddingLR-xs);
    height: var(--td-comp-size-xxs);
    font: var(--td-font-body-small)
}

.l-tag.l-size-s .l-icon {
    font-size: var(--td-font-body-small)
}

.l-tag.l-size-l {
    padding: 0px var(--td-comp-paddingLR-m);
    height: var(--td-comp-size-m);
    font: var(--td-font-body-medium)
}

.l-tag.l-size-l .l-icon {
    font: var(--td-font-body-medium)
}

.l-tag.l-tag--round {
    border-radius: var(--td-radius-extraLarge)
}

.l-tag.l-tag--mark {
    border-radius: 0 var(--td-radius-extraLarge) var(--td-radius-extraLarge) 0
}

.l-tag.l-tag--ellipsis .l-tag--text {
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-tag.l-tag--check:not(.l-tag--disabled) {
    transition: background-color .2s cubic-bezier(.38, 0, .24, 1);
    cursor: pointer
}

.l-tag.l-tag--check:not(.l-tag--disabled).l-tag--default.l-tag--dark:not(.l-tag--checked):hover {
    background-color: var(--td-bg-color-component-hover)
}

.l-tag.l-tag--check:not(.l-tag--disabled).l-tag--primary.l-tag--dark.l-tag--checked:hover {
    background-color: var(--td-brand-color-hover)
}

.l-tag.l-tag--check:not(.l-tag--disabled).l-tag--default.l-tag--outline:not(.l-tag--checked):hover {
    color: var(--td-brand-color-hover)
}

.l-tag--check.l-tag--disabled.l-tag--primary.l-tag--dark {
    background-color: var(--td-brand-color-disabled);
    cursor: not-allowed
}

.l-tag--check.l-tag--disabled.l-tag--primary.l-tag--outline {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled);
    border-color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-check-tag-group .l-tag:not(:last-child) {
    margin-right: var(--td-comp-margin-s)
}

a .l-tag {
    cursor: pointer;
    transition: all .2s linear
}

a .l-tag:hover {
    color: var(--td-brand-color);
    background-color: var(--td-bg-color-component-hover)
}

a .l-tag:active {
    color: var(--td-brand-color-active);
    background-color: var(--td-bg-color-component-active)
}

@keyframes l-fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes l-fade-out {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes l-spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.l-icon-loading {
    animation: l-spin 1s linear infinite
}

@keyframes l-zoom-out {
    0% {
        transform: scale(.2)
    }

    to {
        transform: scale(1)
    }
}

.l-tag-input {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-tag-input .l-tag {
    vertical-align: middle;
    animation: t-fade-in .2s ease-in-out;
    margin: 3px var(--td-comp-margin-xs) 3px 0
}

.l-tag-input .l-tag-input__drag_wrapper+.l-tag-input__drag_wrapper {
    margin-left: var(--td-comp-margin-xs)
}

.l-tag-input .l-input {
    overflow: hidden;
    min-height: var(--td-comp-size-m);
    height: fit-content;
    padding: 0 var(--td-comp-paddingLR-s) 0 var(--td-comp-margin-xs)
}

.l-tag-input .l-input .l-input__suffix-icon {
    right: var(--td-comp-margin-s)
}

.l-tag-input .l-input.l-size-s {
    padding: 0 var(--td-comp-paddingLR-s) 0 var(--td-comp-margin-xs);
    min-height: var(--td-comp-size-xs)
}

.l-tag-input .l-input.l-size-s .l-tag {
    margin: 1px var(--td-comp-margin-xs) 1px 0
}

.l-tag-input .l-input.l-size-l {
    min-height: var(--td-comp-size-xl);
    padding: 0 var(--td-comp-paddingLR-m) 0 var(--td-comp-margin-s)
}

.l-tag-input .l-input.l-size-l .l-input__suffix-icon {
    right: var(--td-comp-margin-m)
}

.l-tag-input.l-is-empty .l-input__inner {
    margin-left: var(--td-comp-margin-xs)
}

.l-tag-input:hover .l-input__inner:not(.l-input--soft-hidden),
.l-tag-input .l-input--focused .l-input__inner:not(.l-input--soft-hidden) {
    min-width: 20px
}

.l-tag-input .l-tag-input__prefix {
    margin-left: var(--td-comp-margin-xs);
    line-height: 1
}

.l-tag-input .l-tag-input__prefix>.l-icon {
    color: var(--td-text-color-placeholder)
}

.l-tag-input .l-input .l-input__prefix:not(:empty) {
    margin-right: 0
}

.l-tag-input.l-input--auto-width .l-input.l-input--focused {
    padding-right: calc(var(--td-comp-paddingLR-xxl) + var(--td-comp-paddingLR-xxs))
}

.l-tag-input.l-input--auto-width .l-input__prefix {
    white-space: nowrap
}

.l-tag-input .l-input__prefix--scrollable {
    overflow-y: hidden;
    overflow-x: auto
}

@-moz-document url-prefix() {
    .l-tag-input .l-input__prefix--scrollable {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-tag-input .l-input__prefix--scrollable::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-tag-input .l-input__prefix--scrollable::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-tag-input .l-input__prefix--scrollable::-webkit-scrollbar-thumb:vertical:hover,
.l-tag-input .l-input__prefix--scrollable::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-tag-input__suffix-clear {
    cursor: pointer
}

.l-tag-input--break-line:not(.l-is-empty) .l-input {
    display: block
}

.l-tag-input--break-line:not(.l-is-empty) .l-input.l-input--prefix>.l-input__prefix {
    display: inline;
    text-align: left
}

.l-tag-input--break-line:not(.l-is-empty) .l-input .l-input__suffix-icon {
    position: absolute;
    bottom: 0
}

.l-tag-input--break-line:not(.l-is-empty) .l-tag-input__prefix {
    vertical-align: middle
}

.l-tag-input__prefix {
    width: max-content;
    display: inline-block;
    margin-right: var(--td-comp-margin-s)
}

.l-tag-input--break-line.l-tag-input--with-tag:not(.l-input--auto-width) .l-input,
.l-tag-input.l-input--auto-width:hover .l-input {
    padding-right: calc(var(--td-comp-paddingLR-xxl) + var(--td-comp-paddingLR-xxs))
}

.l-tag-input--break-line.l-tag-input--with-tag:not(.l-input--auto-width) .l-size-l .l-input,
.l-tag-input.l-input--auto-width:hover .l-size-l .l-input {
    padding-right: calc(var(--td-comp-paddingLR-xxl) + var(--td-comp-paddingLR-xs))
}

.l-tag-input.l-input--auto-width .l-input {
    padding-right: 0
}

.l-select-input {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    display: inline-block;
    vertical-align: middle
}

.l-select-input--multiple .l-input--auto-width.l-tag-input__with-suffix-icon.l-tag-input--with-tag .l-input {
    padding-right: var(--td-comp-paddingLR-xl)
}

.l-select-input--multiple .l-input--auto-width.l-tag-input__with-suffix-icon.l-tag-input--with-tag .l-input.l-size-l {
    padding-right: calc(var(--td-comp-paddingLR-xl) + var(--td-comp-paddingLR-s))
}

.l-select-input--multiple .l-input--auto-width.l-tag-input__with-suffix-icon.l-is-empty .l-input {
    padding-right: var(--td-comp-paddingLR-s)
}

.l-select-input--multiple .l-input--auto-width.l-tag-input__with-suffix-icon.l-is-empty .l-input.l-size-l {
    padding-right: var(--td-comp-paddingLR-m)
}

.l-select-input--borderless .l-input {
    box-shadow: none;
    border: 1px solid transparent;
    background: transparent;
    transition: all .2s linear
}

.l-select-input--borderless .l-input:hover:not(.l-input--focused) {
    border-color: var(--td-component-border);
    background-color: var(--td-bg-color-container-hover);
    border-radius: var(--td-radius-default)
}

.l-select-input--borderless .l-input--focused {
    border-color: var(--td-brand-color);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus);
    background-color: var(--td-bg-color-specialcomponent)
}

.l-select-input--borderless.l-select-input--multiple:not(.l-select-input--empty).l-select-input--popup-visible input {
    display: inline-block
}

.l-select-input--borderless.l-select-input--multiple:not(.l-select-input--empty).l-select-input--popup-visible .l-input {
    background-color: var(--td-bg-color-container-hover)
}

.l-select-input--borderless.l-tag-input {
    border: 0;
    box-shadow: none;
    background: transparent;
    transition: background-color .2s linear
}

.l-select-input--borderless.l-tag-input:hover {
    background-color: var(--td-bg-color-container-hover);
    border-radius: var(--td-radius-default)
}

.l-pagination-mini {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-pagination-mini--outline .l-pagination-mini__prev {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    position: relative;
    z-index: 1
}

.l-pagination-mini--outline .l-pagination-mini__current {
    border-radius: 0;
    position: relative;
    margin-left: -1px
}

.l-pagination-mini--outline .l-pagination-mini__current:hover {
    z-index: 1
}

.l-pagination-mini--outline .l-pagination-mini__next {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: relative;
    margin-left: -1px
}

.l-pagination-mini--outline .l-pagination-mini__next:hover {
    z-index: 1
}

.l-pagination {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    white-space: nowrap;
    color: var(--td-text-color-secondary);
    -webkit-user-select: none;
    user-select: none
}

.l-pagination.l-is-disabled {
    color: var(--td-text-color-disabled)
}

.l-pagination__total {
    font: var(--td-font-body-medium);
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.l-pagination .l-select__wrap {
    width: auto
}

.l-pagination__select {
    flex-shrink: 0;
    margin-right: var(--td-comp-margin-l);
    height: var(--td-comp-size-m);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary)
}

.l-pagination__btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    cursor: pointer;
    color: var(--td-text-color-secondary);
    border-radius: var(--td-radius-default);
    font: var(--td-font-body-large);
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    line-height: var(--td-comp-size-m)
}

.l-pagination__btn:hover {
    background-color: var(--td-bg-color-secondarycontainer-hover);
    transition: all .2s cubic-bezier(.82, 0, 1, .9)
}

.l-pagination__btn:active {
    background-color: var(--td-bg-color-secondarycontainer-active)
}

.l-pagination__btn.l-is-disabled,
.l-pagination__btn.l-is-disabled:hover,
.l-pagination__btn.l-is-disabled:active {
    background: none;
    color: var(--td-text-color-disabled)
}

.l-pagination__btn.l-is-disabled {
    cursor: not-allowed
}

.l-pagination__btn-prev {
    margin-right: var(--td-comp-margin-s)
}

.l-pagination__btn-next {
    margin-left: var(--td-comp-margin-s)
}

.l-pagination__btn+.l-pagination__select {
    margin-right: 0
}

.l-pagination__pager {
    flex-shrink: 0;
    display: inline-flex;
    vertical-align: middle;
    list-style: none;
    padding: 0;
    margin: 0
}

.l-pagination__pager li:not(:last-child) {
    margin-right: var(--td-comp-margin-s)
}

.l-pagination__number {
    display: inline-block;
    border: 1px solid var(--td-component-border);
    text-align: center;
    border-radius: var(--td-radius-default);
    cursor: pointer;
    background-color: var(--td-bg-color-container);
    box-sizing: border-box;
    height: var(--td-comp-size-m);
    min-width: var(--td-comp-size-m);
    line-height: calc(var(--td-comp-size-m) - 2px);
    font-size: var(--td-font-body-medium);
    padding-left: var(--td-comp-paddingLR-xs);
    padding-right: var(--td-comp-paddingLR-xs)
}

.l-pagination__number:hover {
    color: var(--td-brand-color-hover);
    border-color: var(--td-brand-color-hover);
    transition: all .2s cubic-bezier(.82, 0, 1, .9)
}

.l-pagination__number:active,
.l-pagination__number.l-is-current {
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti);
    border-color: var(--td-brand-color)
}

.l-pagination__number.l-is-current.l-is-disabled,
.l-pagination__number.l-is-current.l-is-disabled:hover,
.l-pagination__number.l-is-current.l-is-disabled:active {
    background-color: var(--td-brand-color-focus);
    color: var(--td-text-color-anti);
    border-color: var(--td-brand-color-focus)
}

.l-pagination__number.l-is-disabled {
    cursor: auto;
    background-color: var(--td-bg-color-component-disabled);
    color: var(--td-text-color-disabled)
}

.l-pagination__number.l-is-disabled:hover,
.l-pagination__number.l-is-disabled:active {
    background-color: var(--td-bg-color-component-disabled);
    color: var(--td-text-color-disabled);
    border-color: var(--td-component-border)
}

.l-pagination__number--more {
    border: 0 none;
    padding: 0
}

.l-pagination__number--more:hover {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-secondarycontainer-hover);
    transition: all .2s cubic-bezier(.82, 0, 1, .9)
}

.l-pagination__number--more:active {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-secondarycontainer-active)
}

.l-pagination__number--more.l-is-disabled,
.l-pagination__number--more.l-is-disabled:hover,
.l-pagination__number--more.l-is-disabled:active {
    background: none
}

.l-pagination__number--more .l-icon-more {
    transform: rotate(90deg);
    color: var(--td-text-color-disabled)
}

.l-pagination__jump {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    margin-left: var(--td-comp-margin-s);
    font-size: var(--td-font-body-medium);
    gap: var(--td-comp-margin-s);
    background-color: var(--td-bg-color-secondarycontainer);
    height: var(--td-comp-size-m);
    padding-left: var(--td-comp-margin-s);
    border-radius: var(--td-radius-default)
}

.l-pagination .l-input-adornment__append {
    border: none;
    height: calc(var(--td-comp-size-m) - 4px);
    color: var(--td-text-color-secondary);
    background-color: transparent
}

.l-pagination .l-input-adornment__append .l-input-adornment__text {
    border: none
}

.l-pagination .l-input-number {
    width: 56px
}

.l-pagination .l-input-number .l-input {
    height: calc(var(--td-comp-size-m) - 4px);
    border-radius: var(--td-radius-default)
}

.l-pagination .l-input-number .l-input__inner {
    text-align: center
}

.l-pagination.l-size-s {
    font: var(--td-font-body-small)
}

.l-pagination.l-size-s .l-pagination__jump {
    height: var(--td-comp-size-xs)
}

.l-pagination.l-size-s .l-input-adornment__append {
    height: calc(var(--td-comp-size-xs) - 4px);
    font: var(--td-font-body-small)
}

.l-pagination.l-size-s .l-input-number {
    width: 48px
}

.l-pagination.l-size-s .l-input-number .l-input {
    height: calc(var(--td-comp-size-xs) - 4px)
}

.l-pagination.l-size-s .l-pagination__total {
    font: var(--td-font-body-small)
}

.l-pagination.l-size-s .l-pagination__select {
    height: var(--td-comp-size-xs);
    font-size: var(--td-font-size-body-small)
}

.l-pagination.l-size-s .l-pagination__number {
    border: 0 none;
    height: var(--td-comp-size-xs);
    min-width: var(--td-comp-size-xs);
    line-height: var(--td-comp-size-xs);
    font-size: var(--td-font-body-small);
    padding-left: var(--td-comp-paddingLR-xxs);
    padding-right: var(--td-comp-paddingLR-xxs)
}

.l-pagination.l-size-s .l-pagination__number:hover:not(.l-pagination.l-size-s .l-pagination__number.l-is-current) {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-secondarycontainer-hover);
    transition: all .2s cubic-bezier(.82, 0, 1, .9)
}

.l-pagination.l-size-s .l-pagination__number:active:not(.l-pagination.l-size-s .l-pagination__number.l-is-current) {
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-secondarycontainer-active)
}

.l-pagination.l-size-s .l-pagination__number.l-is-disabled {
    background: none;
    color: var(--td-text-color-disabled)
}

.l-pagination.l-size-s .l-pagination__number.l-is-current.l-is-disabled {
    background-color: var(--td-brand-color-focus);
    color: var(--td-text-color-anti);
    border-color: var(--td-brand-color-focus)
}

.l-pagination.l-size-s .l-pagination__btn {
    border: 0 none;
    background: none;
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs);
    line-height: var(--td-comp-size-xs)
}

.l-pagination.l-size-s .l-pagination__btn:hover {
    background-color: var(--td-bg-color-secondarycontainer-hover);
    transition: all .2s cubic-bezier(.82, 0, 1, .9)
}

.l-pagination.l-size-s .l-pagination__btn:active {
    background-color: var(--td-bg-color-secondarycontainer-active)
}

.l-pagination.l-size-s .l-pagination__btn.l-is-disabled,
.l-pagination.l-size-s .l-pagination__btn.l-is-disabled:hover,
.l-pagination.l-size-s .l-pagination__btn.l-is-disabled:active {
    background: none;
    color: var(--td-text-color-disabled)
}

.l-pagination-ie .l-select .l-input__inner {
    min-width: 54px
}

.default-step-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: var(--td-radius-circle);
    font-size: var(--td-font-size-body-large)
}

.l-steps {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    width: 100%
}

.l-steps .l-steps-item {
    flex: 1;
    overflow: hidden;
    vertical-align: top;
    margin-right: var(--td-comp-margin-s);
    position: relative;
    display: flex
}

.l-steps .l-steps-item:last-child {
    flex: none
}

.l-steps .l-steps-item__inner {
    width: fit-content;
    position: relative;
    display: flex
}

.l-steps .l-steps-item__inner.l-steps-item--clickable {
    cursor: pointer
}

.l-steps .l-steps-item--finish .l-steps-item__icon .l-icon {
    color: var(--td-brand-color)
}

.l-steps .l-steps-item--finish .l-steps-item__icon--number {
    border-color: var(--td-brand-color)
}

.l-steps .l-steps-item--finish .l-steps-item__title {
    color: var(--td-text-color-primary);
    font-weight: 400
}

.l-steps .l-steps-item--finish .l-steps-item__description {
    color: var(--td-text-color-secondary)
}

.l-steps .l-steps-item--process .l-steps-item__icon .l-icon {
    color: var(--td-brand-color)
}

.l-steps .l-steps-item--process .l-steps-item__icon--number {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti);
    font-weight: 700
}

.l-steps .l-steps-item--process .l-steps-item__title {
    color: var(--td-brand-color);
    font-weight: 700
}

.l-steps .l-steps-item--process .l-steps-item__description {
    color: var(--td-text-color-secondary)
}

.l-steps .l-steps-item--error .l-steps-item__icon .l-icon {
    color: var(--td-error-color)
}

.l-steps .l-steps-item--error .l-steps-item__icon--number {
    color: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-steps .l-steps-item--error .l-steps-item__title {
    color: var(--td-error-color)
}

.l-steps .l-steps-item--error .l-steps-item__description {
    color: var(--td-text-color-secondary)
}

.l-steps .l-steps-item__icon {
    vertical-align: top;
    font-size: var(--td-font-size-body-medium);
    margin-right: var(--td-comp-margin-s);
    color: var(--td-text-color-placeholder)
}

.l-steps .l-steps-item__icon--number {
    color: var(--td-text-color-placeholder);
    border: 1px solid var(--td-text-color-placeholder);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: var(--td-radius-circle);
    font-size: var(--td-font-size-body-large)
}

.l-steps .l-steps-item__icon--finish {
    border: 1px solid var(--td-brand-color);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: var(--td-radius-circle);
    font-size: var(--td-font-size-body-large)
}

.l-steps .l-steps-item__icon--error {
    border: 1px solid var(--td-error-color);
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: var(--td-radius-circle);
    font-size: var(--td-font-size-body-large)
}

.l-steps .l-steps-item__icon>.l-icon {
    font-size: calc(var(--td-font-size-body-medium) + 10px)
}

.l-steps .l-steps-item__title {
    position: relative;
    padding-right: var(--td-comp-margin-s);
    color: var(--td-text-color-placeholder);
    font-size: var(--td-font-size-body-large);
    line-height: 24px
}

.l-steps .l-steps-item__description {
    color: var(--td-text-color-placeholder);
    font-size: var(--td-font-size-body-medium);
    margin-bottom: var(--td-comp-margin-xs);
    line-height: 22px
}

.l-steps--line-separator .l-steps-item:before,
.l-steps--line-separator .l-steps-item:after,
.l-steps--line-separator .l-steps-item__title:after {
    border-style: solid
}

.l-steps--dashed-separator .l-steps-item:before,
.l-steps--dashed-separator .l-steps-item:after,
.l-steps--dashed-separator .l-steps-item__title:after {
    border-style: dashed
}

.l-steps--horizontal.l-steps--default-anchor .l-steps-item__title {
    width: fit-content;
    margin-bottom: var(--td-comp-margin-xs)
}

.l-steps--horizontal.l-steps--default-anchor .l-steps-item__icon__number {
    width: 22px;
    height: 22px
}

.l-steps--horizontal.l-steps--default-anchor .l-steps-item__icon>.l-icon {
    font-size: calc(var(--td-font-size-body-medium) + 10px)
}

.l-steps--horizontal.l-steps--default-anchor .l-steps-item:not(:last-child) .l-steps-item__title:after {
    content: "";
    display: block;
    width: 9999px;
    border-left: 0;
    border-top: 0;
    border-bottom-width: 1px;
    border-bottom-color: var(--td-text-color-placeholder);
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--arrow-separator .l-steps-item:not(:last-child):after {
    flex: 1;
    height: 24px;
    content: "^";
    transform: rotate(90deg);
    display: inline-flex;
    justify-content: center;
    align-items: flex-end;
    border: 0;
    font-size: var(--td-font-size-body-large);
    color: var(--td-text-color-placeholder)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--default-anchor .l-steps-item--finish:not(:last-child) .l-steps-item__title:after {
    border-bottom-width: 2px;
    border-bottom-color: var(--td-brand-color);
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse .l-steps-item:not(:last-child) .l-steps-item__title:after {
    content: "";
    display: block;
    width: 9999px;
    border-left: 0;
    border-top: 0;
    border-bottom-width: 1px;
    border-bottom-color: var(--td-text-color-placeholder);
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item:not(:last-child):after {
    flex: 1;
    height: 24px;
    content: "^";
    transform: rotate(90deg);
    display: inline-flex;
    justify-content: center;
    align-items: flex-end;
    border: 0;
    font-size: var(--td-font-size-body-large);
    color: var(--td-text-color-placeholder)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item:not(:last-child):after {
    transform: rotate(-90deg)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item--process:not(:last-child):after,
.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse .l-steps-item--finish:not(:last-child) .l-steps-item__title:after {
    border-bottom-width: 2px;
    border-bottom-color: var(--td-brand-color);
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse .l-steps-item--process:not(:last-child) .l-steps-item__title:after,
.l-steps--horizontal.l-steps--default-anchor.l-steps--reverse .l-steps-item--finish:not(:last-child) .l-steps-item__title:after {
    border-bottom-width: 2px;
    border-bottom-color: var(--td-brand-color);
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item {
    overflow: visible
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item .l-steps-item__title {
    padding-right: 0;
    margin-bottom: var(--td-comp-margin-xs)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item--finish .l-steps-item__icon {
    border-color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item--process .l-steps-item__icon {
    background: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item--error .l-steps-item__icon {
    background: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item__inner {
    display: flex;
    flex-direction: column;
    align-items: center
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item__icon {
    display: block;
    width: 8px;
    height: 8px;
    border: 2px solid var(--td-text-color-placeholder);
    border-radius: var(--td-radius-circle);
    margin-bottom: var(--td-comp-margin-xs);
    position: relative;
    box-sizing: border-box;
    flex-shrink: 0
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item__content {
    text-align: center;
    width: 140px
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--arrow-separator .l-steps-item:not(:last-child):after {
    flex: 1;
    content: "^";
    display: inline-flex;
    justify-content: center;
    align-items: flex-start;
    border: 0;
    font-size: var(--td-font-size-body-large);
    transform: rotate(90deg);
    color: var(--td-text-color-placeholder)
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item:not(:last-child):after {
    content: "";
    display: block;
    width: calc(100% - 16px);
    border-left: 0;
    border-top: 0;
    border-bottom-width: 1px;
    border-bottom-color: var(--td-text-color-placeholder);
    position: absolute;
    left: 78px;
    top: 2.5px
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item:not(:last-child):not(.l-steps-item--finish):after {
    border-color: var(--td-text-color-placeholder)
}

.l-steps--horizontal.l-steps--dot-anchor .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color);
    border-bottom-color: var(--td-brand-color);
    border-bottom-width: 2px
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item:not(:last-child):after {
    flex: 1;
    content: "^";
    display: inline-flex;
    justify-content: center;
    align-items: flex-start;
    border: 0;
    font-size: var(--td-font-size-body-large);
    transform: rotate(90deg);
    color: var(--td-text-color-placeholder)
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item:not(:last-child):after {
    transform: rotate(-90deg)
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item--process:not(:last-child):after,
.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color)
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse .l-steps-item:not(:last-child):after {
    content: "";
    display: block;
    width: calc(100% - 16px);
    border-left: 0;
    border-top: 0;
    border-bottom-width: 1px;
    border-bottom-color: var(--td-text-color-placeholder);
    position: absolute;
    left: 78px;
    top: 2.5px
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse .l-steps-item:not(:last-child):not(.l-steps-item--finish):after {
    border-color: var(--td-text-color-placeholder)
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color);
    border-bottom-color: var(--td-brand-color);
    border-bottom-width: 2px
}

.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse .l-steps-item--process:not(:last-child):after,
.l-steps--horizontal.l-steps--dot-anchor.l-steps--reverse .l-steps-item--finish:not(:last-child):after {
    color: var(--td-brand-color);
    border-bottom-color: var(--td-brand-color);
    border-bottom-width: 2px
}

.l-steps--vertical {
    width: fit-content;
    flex-direction: column
}

.l-steps--vertical.l-steps--positive.l-steps--arrow-separator .l-steps-item:not(:last-child):before {
    content: "^";
    border: 0;
    height: calc(100% - 24px);
    position: absolute;
    top: 24px;
    left: 6px;
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-large);
    transform: rotate(180deg);
    color: var(--td-text-color-placeholder)
}

.l-steps--vertical.l-steps--positive.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--positive .l-steps-item {
    padding-bottom: var(--td-comp-margin-xxl);
    margin-bottom: 5px
}

.l-steps--vertical.l-steps--positive .l-steps-item:not(:last-child):before {
    content: "";
    display: block;
    height: 100%;
    border-left: 0;
    border-top: 0;
    border-right-width: 1px;
    border-right-color: var(--td-text-color-placeholder);
    position: absolute;
    top: 35px;
    left: 11px
}

.l-steps--vertical.l-steps--positive .l-steps-item--finish:not(:last-child):before {
    border-right-width: 2px;
    border-right-color: var(--td-brand-color);
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--default-anchor .l-steps-item__content {
    margin-left: 0
}

.l-steps--vertical.l-steps--default-anchor .l-steps-item__title {
    margin-bottom: var(--td-comp-margin-xs)
}

.l-steps--vertical.l-steps--dot-anchor.l-steps--positive.l-steps--arrow-separator .l-steps-item:not(:last-child):before {
    content: "^";
    border: 0;
    height: calc(100% - 4px);
    position: absolute;
    top: 8px;
    left: 0;
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-placeholder)
}

.l-steps--vertical.l-steps--dot-anchor.l-steps--positive.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--dot-anchor.l-steps--positive .l-steps-item:not(:last-child):before {
    content: "";
    display: block;
    height: 100%;
    border-bottom: 0;
    border-left: 0;
    border-right-width: 1px;
    border-right-color: var(--td-text-color-placeholder);
    position: absolute;
    left: 3.5px;
    top: 17px
}

.l-steps--vertical.l-steps--dot-anchor.l-steps--positive .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color);
    border-right-color: var(--td-brand-color);
    border-right-width: 2px
}

.l-steps--vertical.l-steps--dot-anchor.l-steps--positive .l-steps-item:not(:last-child).l-steps-item--default:before {
    border-color: var(--td-text-color-placeholder)
}

.l-steps--vertical.l-steps--dot-anchor .l-steps-item {
    margin-bottom: 0
}

.l-steps--vertical.l-steps--dot-anchor .l-steps-item .l-steps-item__title {
    margin-bottom: var(--td-comp-margin-xs)
}

.l-steps--vertical.l-steps--dot-anchor .l-steps-item--finish .l-steps-item__icon {
    border-color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--dot-anchor .l-steps-item--process .l-steps-item__icon {
    background: var(--td-brand-color);
    border-color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--dot-anchor .l-steps-item--error .l-steps-item__icon {
    background: var(--td-error-color);
    border-color: var(--td-error-color)
}

.l-steps--vertical.l-steps--dot-anchor .l-steps-item__icon {
    display: block;
    width: 8px;
    height: 8px;
    border: 2px solid var(--td-text-color-placeholder);
    border-radius: var(--td-radius-circle);
    margin-bottom: var(--td-comp-margin-xs);
    position: relative;
    box-sizing: border-box;
    flex-shrink: 0;
    top: 8px
}

.l-steps--vertical.l-steps--reverse.l-steps--arrow-separator .l-steps-item:not(:last-child):before {
    content: "^";
    border: 0;
    height: calc(100% - 24px);
    position: absolute;
    top: 24px;
    left: 6px;
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-large);
    transform: rotate(180deg);
    color: var(--td-text-color-placeholder)
}

.l-steps--vertical.l-steps--reverse.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--reverse.l-steps--arrow-separator .l-steps-item:not(:last-child):before {
    transform: rotate(0);
    margin-top: var(--td-comp-margin-xs)
}

.l-steps--vertical.l-steps--reverse.l-steps--arrow-separator .l-steps-item--process:not(:last-child):before,
.l-steps--vertical.l-steps--reverse.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--reverse .l-steps-item {
    padding-bottom: var(--td-comp-margin-xxl);
    margin-bottom: 5px
}

.l-steps--vertical.l-steps--reverse .l-steps-item:not(:last-child):before {
    content: "";
    display: block;
    height: 100%;
    border-left: 0;
    border-bottom: 0;
    border-right-width: 1px;
    border-right-color: var(--td-text-color-placeholder);
    position: absolute;
    top: 35px;
    left: 11px
}

.l-steps--vertical.l-steps--reverse .l-steps-item--process:not(:last-child):before,
.l-steps--vertical.l-steps--reverse .l-steps-item--finish:not(:last-child):before {
    border-right-width: 2px;
    border-right-color: var(--td-brand-color);
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor.l-steps--arrow-separator .l-steps-item:not(:last-child):before {
    content: "^";
    border: 0;
    height: calc(100% - 4px);
    position: absolute;
    top: 8px;
    left: 0;
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-placeholder)
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor.l-steps--arrow-separator .l-steps-item--process:not(:last-child):before,
.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor.l-steps--arrow-separator .l-steps-item--finish:not(:last-child):before {
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor .l-steps-item {
    margin-bottom: 0
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor .l-steps-item:not(:last-child):before {
    content: "";
    display: block;
    height: 100%;
    border-bottom: 0;
    border-left: 0;
    border-right-width: 1px;
    border-right-color: var(--td-text-color-placeholder);
    position: absolute;
    left: 3.5px;
    top: 17px
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor .l-steps-item:last-child:before {
    display: none
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor .l-steps-item--process:not(:last-child):before,
.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor .l-steps-item--finish:not(:last-child):before {
    border-right-width: 2px;
    border-right-color: var(--td-brand-color);
    color: var(--td-brand-color)
}

.l-steps--vertical.l-steps--reverse.l-steps--dot-anchor .l-steps-item:not(:last-child).l-steps-item--default:before {
    border-color: var(--td-text-color-placeholder)
}

.l-sticky-tool {
    position: fixed;
    opacity: 1;
    box-sizing: border-box;
    background-color: var(--td-bg-color-container);
    border: .5px solid var(--td-component-border);
    box-shadow: var(--td-shadow-3)
}

.l-sticky-tool-popup-content {
    box-shadow: var(--td-shadow-3);
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary)
}

.l-sticky-tool .l-sticky-item {
    opacity: 1;
    position: relative;
    margin: var(--td-comp-margin-xs);
    text-align: center;
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary);
    transition: background-color .2s linear
}

.l-sticky-tool .l-sticky-item:hover {
    cursor: pointer;
    background-color: var(--td-bg-color-container-hover)
}

.l-sticky-tool .l-sticky-item--normal {
    width: var(--td-comp-size-xxxl);
    height: var(--td-comp-size-xxxl)
}

.l-sticky-tool .l-sticky-item--normal .l-icon {
    width: 24px;
    height: 24px;
    margin: var(--td-comp-margin-s) var(--td-comp-margin-l) 0 var(--td-comp-margin-l);
    color: var(--td-text-color-primary)
}

.l-sticky-tool .l-sticky-item--compact {
    width: var(--td-comp-size-xl);
    height: var(--td-comp-size-xl)
}

.l-sticky-tool .l-sticky-item--compact .l-icon {
    width: 24px;
    height: 24px;
    margin: var(--td-comp-margin-s);
    color: var(--td-text-color-primary)
}

.l-sticky-tool .l-sticky-item--square {
    border-radius: var(--td-radius-default)
}

.l-sticky-tool .l-sticky-item--round {
    border-radius: var(--td-radius-circle)
}

.l-sticky-tool .l-sticky-item .l-sticky-item__label {
    width: 100%;
    height: var(--td-comp-size-xxs);
    line-height: var(--td-comp-size-xxs);
    margin-top: var(--td-comp-margin-xxs);
    text-align: center
}

.l-sticky-tool--square {
    border-radius: var(--td-radius-medium)
}

.l-sticky-tool--round {
    border-radius: var(--td-radius-round)
}

.l-back-top {
    position: fixed;
    z-index: 300;
    overflow: hidden;
    outline: none;
    border-color: transparent;
    background-color: transparent;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    white-space: nowrap;
    border-width: .5px;
    border-style: solid;
    transition: background .2s linear, border .2s linear, color .2s linear, opacity .2s linear, visibility .2s linear;
    touch-action: manipulation;
    box-shadow: var(--td-shadow-3);
    visibility: hidden;
    opacity: 0;
    color: var(--td-text-color-primary)
}

.l-back-top__text {
    font: var(--td-font-body-small);
    text-align: center;
    margin-top: var(--td-comp-margin-xxs)
}

.l-back-top__icon {
    font-size: var(--td-font-headline-small)
}

.l-back-top.l-size-m .l-back-top__icon {
    margin-top: 2px
}

.l-back-top--show {
    visibility: visible;
    opacity: 1
}

.l-back-top--theme-light {
    border-color: var(--td-component-border);
    background-color: var(--td-bg-color-container)
}

.l-back-top--theme-light:hover {
    border-color: var(--td-bg-color-container-hover);
    background-color: var(--td-bg-color-container-hover)
}

.l-back-top--theme-light .l-back-top__text {
    color: var(--td-text-color-secondary)
}

.l-back-top--theme-light .l-back-top__icon {
    color: var(--td-text-color-primary)
}

.l-back-top--theme-primary {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color)
}

.l-back-top--theme-primary:hover {
    border-color: var(--td-brand-color-hover);
    background-color: var(--td-brand-color-hover)
}

.l-back-top--theme-primary .l-back-top__text,
.l-back-top--theme-primary .l-back-top__icon {
    color: var(--td-text-color-anti)
}

.l-back-top--theme-dark {
    border-color: #000000e6;
    background-color: #000000e6
}

.l-back-top--theme-dark:hover {
    border-color: #0009;
    background-color: #0009
}

.l-back-top--theme-dark .l-back-top__text,
.l-back-top--theme-dark .l-back-top__icon {
    color: var(--td-text-color-anti)
}

.l-back-top.l-size-s {
    width: var(--td-comp-size-xxl);
    height: var(--td-comp-size-xxl)
}

.l-back-top.l-size-s .l-back-top__text {
    display: none
}

.l-back-top.l-size-m {
    width: var(--td-comp-size-xxxxl);
    height: var(--td-comp-size-xxxxl)
}

.l-back-top.l-size-m .l-back-top__text {
    display: block
}

.l-back-top--circle {
    border-radius: var(--td-radius-circle)
}

.l-back-top--square {
    border-radius: var(--td-radius-medium)
}

.l-select-option__highlight-item .l-is-highlight {
    color: var(--td-brand-color)
}

.l-auto-complete {
    width: 100%
}

.l-auto-complete .l-input__suffix-clear {
    display: none
}

.l-auto-complete:hover .l-input__suffix-clear {
    display: inline-block
}

.l-select__wrap {
    width: 100%
}

.l-select__dropdown .l-popup__content {
    margin: var(--td-comp-paddingTB-s) 0;
    padding: 0;
    max-height: 300px;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: var(--td-shadow-2)
}

@-moz-document url-prefix() {
    .l-select__dropdown .l-popup__content {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-select__dropdown .l-popup__content::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.l-select__dropdown .l-popup__content::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.l-select__dropdown .l-popup__content::-webkit-scrollbar-thumb:vertical:hover,
.l-select__dropdown .l-popup__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-select__dropdown-inner {
    min-height: var(--td-comp-size-m)
}

.l-select__dropdown-inner .l-select__list .l-select__list {
    padding: 0
}

.l-select__dropdown-inner .l-select__list,
.l-select__dropdown-inner .l-tree {
    padding: var(--td-pop-padding-m)
}

.l-select__dropdown-inner--size-s {
    min-height: var(--td-comp-size-xs)
}

.l-select__dropdown-inner--size-s .l-select__list,
.l-select__dropdown-inner--size-s .l-tree {
    padding: var(--td-pop-padding-s)
}

.l-select__dropdown-inner--size-l {
    min-height: var(--td-comp-size-xl)
}

.l-select__dropdown-inner--size-l .l-select__list,
.l-select__dropdown-inner--size-l .l-tree {
    padding: var(--td-pop-padding-l)
}

.l-select__list {
    margin: 0;
    padding: 0;
    list-style: none
}

.l-select__dropdown.l-popup {
    padding: 0
}

.l-select__empty.l-size-s {
    line-height: var(--td-comp-size-xs)
}

.l-select__empty {
    text-align: center;
    color: var(--td-text-color-disabled);
    line-height: var(--td-comp-size-m);
    padding: 0 var(--td-comp-paddingLR-s)
}

.l-select__empty.l-size-l {
    line-height: var(--td-comp-size-xl)
}

.l-select__loading-tips.l-size-s {
    min-height: var(--td-comp-size-xs);
    line-height: var(--td-comp-size-xs)
}

.l-select__loading-tips {
    position: fixed;
    top: var(--td-comp-paddingTB-s);
    left: 0;
    bottom: var(--td-comp-paddingTB-s);
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--td-bg-color-container);
    border-radius: var(--td-radius-default);
    min-height: var(--td-comp-size-m);
    line-height: var(--td-comp-size-m);
    color: var(--td-text-color-disabled);
    z-index: 1000
}

.l-select__loading-tips.l-size-l {
    min-height: var(--td-comp-size-xl);
    line-height: var(--td-comp-size-xl)
}

.l-select-option-group+.l-select-option-group {
    padding-top: var(--td-comp-margin-xs);
    margin-top: var(--td-comp-margin-xs)
}

.l-select-option-group__divider+.l-select-option-group__divider {
    position: relative
}

.l-select-option-group__divider+.l-select-option-group__divider:before {
    content: "";
    width: 100%;
    height: 1px;
    padding: 0 var(--td-comp-paddingLR-s);
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    background-color: var(--td-border-level-1-color);
    background-clip: content-box
}

ul.l-select-option-group__header,
.l-select-option-group__header {
    color: var(--td-text-color-placeholder);
    display: block;
    height: var(--td-comp-size-s);
    line-height: var(--td-comp-size-s);
    padding: 0 var(--td-comp-paddingLR-s);
    box-sizing: border-box;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-select-option-group__header.l-size-l {
    height: var(--td-comp-size-l);
    line-height: var(--td-comp-size-l);
    padding: 0 var(--td-comp-paddingLR-m)
}

.l-select-option-group__header.l-size-s {
    height: var(--td-comp-size-xxs);
    line-height: var(--td-comp-size-xxs);
    padding: 0 var(--td-comp-paddingLR-s)
}

.l-select-option {
    display: flex;
    align-items: center;
    border-radius: var(--td-radius-default);
    height: var(--td-comp-size-s);
    font: var(--td-font-body-medium);
    cursor: pointer;
    padding: 0 var(--td-comp-paddingLR-s);
    color: var(--td-text-color-primary);
    transition: background-color .2s cubic-bezier(.38, 0, .24, 1);
    box-sizing: border-box;
    --ripple-color: var(--td-bg-color-container-active)
}

.l-select-option span {
    position: relative;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-select-option:not(.l-is-disabled):not(.l-is-selected):hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-select-option:not(.l-is-disabled):not(.l-is-selected):hover .l-checkbox__label {
    color: inherit
}

.l-select-option:not(.l-is-disabled):not(.l-is-selected):hover .l-checkbox__input {
    border-color: var(--td-brand-color)
}

.l-select-option .l-checkbox__label {
    color: var(--td-text-color-primary);
    flex: 1;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-select-option .l-checkbox {
    width: 100%
}

.l-select-option.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-text-color-disabled);
    background: var(--td-bg-color-specialcomponent)
}

.l-select-option.l-is-disabled:hover,
.l-select-option.l-is-disabled :active {
    background: var(--td-bg-color-specialcomponent)
}

.l-select-option.l-size-l {
    height: var(--td-comp-size-l);
    padding: 0 var(--td-comp-paddingLR-m);
    font: var(--td-font-body-large)
}

.l-select-option.l-size-m {
    font: var(--td-font-body-medium)
}

.l-select-option.l-size-s {
    height: var(--td-comp-size-xxs);
    padding: 0 var(--td-comp-paddingLR-s);
    font: var(--td-font-body-small)
}

.l-select-option.l-is-selected:not(.l-is-disabled) {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light);
    transition: all .2s linear
}

.l-select-option.l-is-selected:not(.l-is-disabled) .l-checkbox__label {
    color: var(--td-brand-color)
}

.l-select-option.l-is-selected:not(.l-is-disabled):hover {
    background-color: var(--td-brand-color-light)
}

.l-select-option.l-select-option__hover:not(.l-is-disabled).l-select-option.l-select-option__hover:not(.l-is-selected),
.l-select-option.l-select-option__hover:not(.l-is-disabled).l-select-option.l-select-option--hover:not(.l-is-selected),
.l-select-option.l-select-option--hover:not(.l-is-disabled).l-select-option.l-select-option__hover:not(.l-is-selected),
.l-select-option.l-select-option--hover:not(.l-is-disabled).l-select-option.l-select-option--hover:not(.l-is-selected) {
    background-color: var(--td-bg-color-container-hover)
}

.l-select-option.l-select-option__hover:not(.l-is-disabled).l-select-option.l-select-option__hover:not(.l-is-selected) .l-checkbox__input,
.l-select-option.l-select-option__hover:not(.l-is-disabled).l-select-option.l-select-option--hover:not(.l-is-selected) .l-checkbox__input,
.l-select-option.l-select-option--hover:not(.l-is-disabled).l-select-option.l-select-option__hover:not(.l-is-selected) .l-checkbox__input,
.l-select-option.l-select-option--hover:not(.l-is-disabled).l-select-option.l-select-option--hover:not(.l-is-selected) .l-checkbox__input {
    border-color: var(--td-brand-color)
}

.l-select-option.l-select-option__hover .l-checkbox__label,
.l-select-option.l-select-option--hover .l-checkbox__label {
    color: inherit
}

.l-select-option+.l-select-option {
    margin-top: var(--td-comp-paddingTB-xxs)
}

.l-select.l-select-input--borderless .l-select__right-icon {
    position: relative;
    margin: 0
}

.l-select .l-fake-arrow {
    color: var(--td-text-color-placeholder)
}

.l-select .l-fake-arrow--active {
    color: var(--td-brand-color)
}

.l-is-selected.l-select-option__hover {
    background-color: var(--td-brand-color-light-hover)
}

.l-is-selected.l-select-option__hover .l-checkbox__label {
    color: var(--td-brand-color)
}

.l-cascader .l-fake-arrow {
    color: var(--td-text-color-placeholder)
}

.l-cascader .l-fake-arrow--active {
    color: var(--td-brand-color)
}

.l-cascader__popup .l-popup__content {
    padding: 0;
    box-shadow: var(--td-shadow-2);
    border-radius: var(--td-radius-medium);
    border: .5px solid var(--td-component-border);
    overflow: hidden
}

.l-cascader__panel {
    display: flex;
    height: 100%
}

.l-cascader__panel.l-cascader--normal {
    height: 200px
}

.l-cascader__panel.l-cascader--multiple {
    height: 280px
}

.l-cascader__panel--empty {
    width: 100%;
    height: var(--td-comp-size-s);
    line-height: var(--td-comp-size-s);
    color: var(--td-text-color-disabled);
    margin: var(--td-pop-padding-m);
    text-align: center;
    padding-left: 0
}

.l-cascader__panel--empty:hover {
    background: none;
    cursor: default
}

.l-cascader__menu {
    width: 148px;
    overflow: auto;
    box-sizing: content-box;
    padding: var(--td-pop-padding-m);
    background: var(--td-bg-color-container)
}

.l-cascader__menu.l-size-l {
    padding: var(--td-pop-padding-l)
}

.l-cascader__menu.l-size-s {
    padding: var(--td-pop-padding-s)
}

.l-cascader__menu--segment {
    border-right: 1px solid var(--td-component-stroke)
}

.l-cascader__menu--filter {
    width: auto;
    min-width: 148px
}

.l-cascader__item {
    position: relative;
    display: flex;
    align-items: center;
    height: var(--td-comp-size-s);
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    padding: 0 var(--td-comp-paddingLR-s);
    border-radius: var(--td-radius-default);
    margin-top: var(--td-comp-margin-xxs);
    transition: background-color .2s cubic-bezier(.82, 0, 1, .9);
    list-style: none;
    --ripple-color: var(--td-bg-color-container-active)
}

.l-cascader__item.l-size-s {
    height: var(--td-comp-size-xs);
    font: var(--td-font-body-small);
    padding: 0px var(--td-comp-paddingLR-s)
}

.l-cascader__item.l-size-l {
    height: var(--td-comp-size-m);
    font: var(--td-font-body-large);
    padding: 0 var(--td-comp-paddingLR-m)
}

.l-cascader__item.l-is-disabled {
    color: var(--td-text-color-disabled);
    background-color: transparent;
    cursor: not-allowed
}

.l-cascader__item-icon.l-icon {
    position: absolute;
    height: 100%;
    right: 0;
    top: 0;
    background: transparent;
    margin: 0 8px;
    font-size: 16px;
    color: var(--td-text-color-placeholder)
}

.l-cascader__item-icon.l-loading {
    display: flex;
    color: var(--td-text-color-brand)
}

.l-cascader__item.l-is-expanded {
    background: var(--td-brand-color-light);
    color: var(--td-text-color-brand)
}

.l-cascader__item.l-is-expanded .l-icon-chevron-right {
    color: var(--td-text-color-brand)
}

.l-cascader__item.l-is-expanded:hover {
    cursor: pointer
}

.l-cascader__item:first-child {
    margin-top: 0
}

.l-cascader__item .l-checkbox {
    max-width: 100%
}

.l-cascader__item .l-checkbox .l-checkbox__input {
    flex-shrink: 0
}

.l-cascader__item .l-checkbox .l-checkbox__label {
    display: block;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-cascader__item .l-checkbox .l-checkbox__label .l-cascader__item__label--filter {
    color: var(--td-text-color-brand)
}

.l-cascader__item--with-icon {
    padding: 0 calc(var(--td-comp-paddingLR-s) + 14px) 0 var(--td-comp-paddingLR-s)
}

.l-cascader__item--leaf .l-checkbox {
    width: 100%
}

.l-cascader__item-label {
    display: block;
    position: relative;
    white-space: nowrap;
    padding: 0
}

.l-cascader__item-label--ellipsis {
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-cascader__item-label--filter {
    color: var(--td-text-color-brand)
}

.l-cascader__item:hover:not(.l-is-expanded):not(.l-is-disabled) {
    background: var(--td-bg-color-container-hover);
    cursor: pointer
}

.l-cascader__item.l-is-selected {
    color: var(--td-brand-color);
    background: var(--td-brand-color-light)
}

.l-cascader__item.l-is-selected .l-checkbox__label {
    color: var(--td-brand-color)
}

.l-date-picker,
.l-date-range-picker {
    display: inline-flex;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-date-picker__header-controller-month-popup>.l-popup__content,
.l-date-picker__header-controller-year-popup>.l-popup__content {
    max-height: 160px
}

.l-date-picker__panel-container>.l-popup__content,
.l-date-range-picker__panel-container>.l-popup__content {
    padding: 0;
    min-width: 280px
}

.l-date-picker__panel,
.l-date-range-picker__panel {
    display: flex;
    flex-direction: column
}

.l-date-picker__panel--direction-row,
.l-date-range-picker__panel--direction-row {
    flex-direction: row
}

.l-date-picker__panel .l-time-picker__panel,
.l-date-range-picker__panel .l-time-picker__panel {
    width: 216px
}

.l-date-picker__panel .l-time-picker__panel-section-body,
.l-date-range-picker__panel .l-time-picker__panel-section-body {
    padding: 0
}

.l-date-picker__panel .l-time-picker__panel-body,
.l-date-range-picker__panel .l-time-picker__panel-body {
    margin: 0
}

.l-date-picker__panel-content,
.l-date-range-picker__panel-content,
.l-date-range-picker__panel-content-wrapper {
    display: flex
}

.l-date-picker__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--td-comp-margin-m);
    width: 100%
}

.l-date-picker__header-controller {
    display: inline-flex;
    gap: var(--td-comp-margin-s)
}

.l-date-picker__header-controller .l-date-picker__header-controller-month {
    width: calc(var(--td-comp-size-m) * 2.7);
    display: flex
}

.l-date-picker__header-controller .l-date-picker__header-controller-year {
    width: calc(var(--td-comp-size-m) * 3);
    display: flex
}

.l-date-picker__table table {
    width: 100%;
    border-collapse: collapse
}

.l-date-picker__table table th {
    text-align: center;
    color: var(--td-text-color-secondary);
    font-weight: 400
}

.l-date-picker__table table td.l-date-picker__cell {
    text-align: center;
    font-weight: 500
}

.l-date-picker__table table th,
.l-date-picker__table table td.l-date-picker__cell {
    padding: 0;
    border: 0;
    line-height: var(--td-line-height-body-medium)
}

.l-date-picker__table table thead:after {
    content: "-";
    display: block;
    line-height: var(--td-comp-margin-xs);
    color: transparent
}

.l-date-picker__table table thead:before {
    content: "-";
    display: block;
    line-height: var(--td-comp-margin-xs);
    color: transparent
}

.l-date-picker__table-week-row {
    cursor: pointer;
    position: sticky
}

.l-date-picker__table-week-row .l-date-picker__cell:first-child .l-date-picker__cell-inner {
    color: var(--td-text-color-disabled)
}

.l-date-picker__table-week-row .l-date-picker__cell:hover .l-date-picker__cell-inner {
    box-shadow: none;
    background: none
}

.l-date-picker__table-week-row:after {
    content: "";
    position: absolute;
    left: var(--td-comp-margin-xxxl);
    right: 0;
    top: calc(var(--td-comp-margin-xs) - 1px);
    z-index: 10;
    height: var(--td-comp-size-xs);
    border-radius: var(--td-radius-default);
    transition: box-shadow .2s cubic-bezier(.38, 0, .24, 1), background-color .2s linear, border-color .2s linear, color .2s linear;
    pointer-events: none
}

.l-date-picker__table-week-row:hover .l-date-picker__cell:first-child .l-date-picker__cell-inner {
    color: var(--td-brand-color)
}

.l-date-picker__table-week-row:hover:after {
    box-shadow: inset 0 0 0 1px var(--td-brand-color)
}

.l-date-picker__table-week-row--active:after {
    opacity: 1;
    z-index: 0;
    background-color: var(--td-brand-color)
}

.l-date-picker__table-week-row--active .l-date-picker__cell:first-child .l-date-picker__cell-inner {
    color: var(--td-brand-color)
}

.l-date-picker__table-week-row--active .l-date-picker__cell .l-date-picker__cell-inner {
    background: transparent;
    color: var(--td-text-color-anti)
}

.l-date-picker__table-week-row--range:after {
    opacity: 1;
    z-index: 0;
    background-color: var(--td-brand-color-light)
}

.l-date-picker__table-week-row--range .l-date-picker__cell .l-date-picker__cell-inner {
    background: transparent
}

.l-date-picker__footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: var(--td-pop-padding-xl);
    gap: var(--td-comp-margin-s)
}

.l-date-picker__footer--bottom {
    border-top: 1px solid var(--td-component-stroke)
}

.l-date-picker__footer--top {
    border-bottom: 1px solid var(--td-component-stroke)
}

.l-date-picker__footer--left {
    flex-direction: column;
    border-right: 1px solid var(--td-component-stroke)
}

.l-date-picker__footer--left .l-date-picker__presets {
    flex-direction: column
}

.l-date-picker__footer--right {
    flex-direction: column;
    border-left: 1px solid var(--td-component-stroke)
}

.l-date-picker__footer--right .l-date-picker__presets {
    flex-direction: column
}

.l-date-picker__presets {
    display: flex;
    gap: var(--td-comp-margin-s);
    white-space: nowrap;
    min-width: var(--td-comp-size-xl)
}

.l-date-picker__presets .l-button {
    cursor: pointer
}

.l-date-picker__presets a {
    color: var(--td-brand-color)
}

.l-date-picker__presets a:hover {
    color: var(--td-brand-color-hover)
}

.l-date-picker__panel-time,
.l-date-range-picker__panel-time {
    display: flex;
    flex-direction: column;
    gap: calc(var(--td-comp-margin-m) / 2);
    padding: var(--td-pop-padding-xl) calc(var(--td-pop-padding-xl) - var(--td-comp-margin-xs));
    border-left: 1px solid var(--td-component-stroke)
}

.l-date-picker__panel-time-viewer,
.l-date-range-picker__panel-time-viewer {
    display: flex;
    height: var(--td-comp-size-m);
    line-height: var(--td-line-height-body-medium);
    align-items: center;
    justify-content: center;
    color: var(--td-text-color-primary)
}

.l-date-picker__panel-time .l-time-picker__panel-body,
.l-date-range-picker__panel-time .l-time-picker__panel-body {
    margin: 0
}

.l-date-picker__panel-year,
.l-date-picker__panel-month,
.l-date-picker__panel-quarter,
.l-date-picker__panel-week,
.l-date-picker__panel-date {
    display: flex;
    flex-direction: column;
    padding: var(--td-pop-padding-xl);
    gap: var(--td-comp-margin-m);
    width: auto;
    box-sizing: border-box
}

.l-date-picker__panel-year .l-date-picker__cell--hover-highlight+.l-date-picker__cell--hover-highlight:before,
.l-date-picker__panel-month .l-date-picker__cell--hover-highlight+.l-date-picker__cell--hover-highlight:before,
.l-date-picker__panel-year .l-date-picker__cell--hover-highlight+.l-date-picker__cell--hover-highlight:after,
.l-date-picker__panel-month .l-date-picker__cell--hover-highlight+.l-date-picker__cell--hover-highlight:after {
    opacity: 1;
    left: calc(0px - calc(var(--td-comp-size-xs) + var(--td-comp-margin-xxl)))
}

.l-date-picker__panel-year .l-date-picker__cell--hover-highlight+.l-date-picker__cell--active:after,
.l-date-picker__panel-month .l-date-picker__cell--hover-highlight+.l-date-picker__cell--active:after {
    opacity: 1;
    left: calc(0px - calc(var(--td-comp-size-xs) + var(--td-comp-margin-xxl)));
    z-index: 5
}

.l-date-picker__panel-year .l-date-picker__cell--highlight+.l-date-picker__cell--highlight:before,
.l-date-picker__panel-month .l-date-picker__cell--highlight+.l-date-picker__cell--highlight:before {
    left: calc(0px - calc(var(--td-comp-size-xs) + var(--td-comp-margin-xxl)))
}

.l-date-picker__panel-year .l-date-picker__header-controller-year,
.l-date-picker__panel-month .l-date-picker__header-controller-year,
.l-date-picker__panel-quarter .l-date-picker__header-controller-year {
    width: 130px;
    display: flex
}

.l-date-picker__panel-year .l-date-picker__table table tbody,
.l-date-picker__panel-month .l-date-picker__table table tbody,
.l-date-picker__panel-quarter .l-date-picker__table table tbody {
    width: 100%;
    display: flex;
    gap: var(--td-comp-margin-m);
    flex-direction: column
}

.l-date-picker__panel-year .l-date-picker__table table tbody tr,
.l-date-picker__panel-month .l-date-picker__table table tbody tr,
.l-date-picker__panel-quarter .l-date-picker__table table tbody tr {
    display: flex;
    justify-content: space-between
}

.l-date-picker__panel-year .l-date-picker__cell--disabled+.l-date-picker__cell--disabled:before,
.l-date-picker__panel-month .l-date-picker__cell--disabled+.l-date-picker__cell--disabled:before,
.l-date-picker__panel-quarter .l-date-picker__cell--disabled+.l-date-picker__cell--disabled:before {
    left: calc(0px - var(--td-comp-size-xxxl))
}

.l-date-picker__panel-year .l-date-picker__cell:nth-child(1),
.l-date-picker__panel-month .l-date-picker__cell:nth-child(1),
.l-date-picker__panel-quarter .l-date-picker__cell:nth-child(1) {
    text-align: left
}

.l-date-picker__panel-year .l-date-picker__cell:nth-child(3),
.l-date-picker__panel-month .l-date-picker__cell:nth-child(3),
.l-date-picker__panel-quarter .l-date-picker__cell:nth-child(3) {
    text-align: right
}

.l-date-picker__panel-year .l-date-picker__cell-inner,
.l-date-picker__panel-month .l-date-picker__cell-inner,
.l-date-picker__panel-quarter .l-date-picker__cell-inner {
    width: var(--td-comp-size-xxl)
}

.l-date-picker__cell {
    cursor: pointer;
    position: relative;
    padding: 0
}

.l-date-picker__cell:before,
.l-date-picker__cell:after {
    content: "";
    position: absolute;
    top: 50%;
    right: -5%;
    left: -5%;
    z-index: 1;
    opacity: 0;
    border-radius: var(--td-radius-default);
    height: var(--td-comp-size-xs);
    transform: translateY(-50%);
    transition: opacity .2s cubic-bezier(0, 0, .15, 1)
}

.l-date-picker__cell:hover .l-date-picker__cell-inner {
    box-shadow: inset 0 0 0 1px var(--td-brand-color)
}

.l-date-picker__cell-inner {
    position: relative;
    z-index: 5;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs);
    margin: calc(var(--td-comp-margin-xs) - 1px);
    border-radius: var(--td-radius-default);
    transition: box-shadow .2s cubic-bezier(.38, 0, .24, 1), background-color .2s linear, border-color .2s linear, color .2s linear
}

.l-date-picker__cell--now .l-date-picker__cell-inner {
    color: var(--td-brand-color);
    background: var(--td-brand-color-light)
}

.l-date-picker__cell--hover-highlight:after {
    opacity: 1;
    background-color: var(--td-brand-color-light)
}

.l-date-picker__cell--highlight:before {
    opacity: 1;
    background-color: var(--td-brand-color-light)
}

.l-date-picker__cell--highlight.l-date-picker__cell--hover-highlight:after {
    opacity: 1;
    background-color: #0000000f
}

.l-date-picker__cell--additional:hover .l-date-picker__cell-inner {
    box-shadow: none;
    border-color: var(--td-bg-color-container-hover);
    background-color: var(--td-bg-color-container-hover)
}

.l-date-picker__cell--additional .l-date-picker__cell-inner {
    color: var(--td-text-color-disabled)
}

.l-date-picker__cell--active .l-date-picker__cell-inner {
    color: var(--td-text-color-anti);
    background-color: var(--td-brand-color)
}

.l-date-picker__cell--active-start:before {
    opacity: 1;
    left: calc(calc(var(--td-comp-margin-xs) - 1px) * 2);
    border-top-left-radius: var(--td-radius-default);
    border-bottom-left-radius: var(--td-radius-default)
}

.l-date-picker__cell--active-start:hover:before {
    left: -5%
}

.l-date-picker__cell--active-end:before {
    opacity: 1;
    right: calc(calc(var(--td-comp-margin-xs) - 1px) * 2);
    border-top-right-radius: var(--td-radius-default);
    border-bottom-right-radius: var(--td-radius-default)
}

.l-date-picker__cell--active-end:hover:before {
    right: -5%
}

.l-date-picker__cell--disabled:hover .l-date-picker__cell-inner {
    box-shadow: none;
    background-color: var(--td-bg-color-component-disabled)
}

.l-date-picker__cell--disabled .l-date-picker__cell-inner {
    cursor: not-allowed;
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled)
}

.l-date-picker__cell--disabled+.l-date-picker__cell--disabled:before {
    opacity: 1;
    left: calc(0px - var(--td-comp-size-l));
    background-color: var(--td-bg-color-component-disabled);
    border-radius: var(--td-radius-default)
}

.l-date-picker__input--placeholder input {
    color: var(--td-text-color-placeholder)
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center
}

.l-time-picker,
.l-time-range-picker {
    width: 240px;
    background: transparent;
    display: inline-block;
    position: relative;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-time-picker.l-is-disabled,
.l-time-range-picker.l-is-disabled {
    cursor: not-allowed
}

.l-time-picker>*:focus,
.l-time-range-picker>*:focus,
.l-time-picker>*:active,
.l-time-range-picker>*:active {
    outline: 0
}

.l-time-picker__group,
.l-time-range-picker__group {
    position: relative
}

.l-time-picker__group.active,
.l-time-range-picker__group.active {
    border: 1px solid var(--td-brand-color);
    box-shadow: 0 0 2px 2px var(--td-brand-color-focus)
}

.l-time-picker__group.active+.l-time-picker__icon-wrap>.l-time-picker__icon-clear,
.l-time-range-picker__group.active+.l-time-picker__icon-wrap>.l-time-picker__icon-clear {
    display: block
}

.l-time-picker__group-text,
.l-time-range-picker__group-text {
    color: var(--td-text-color-primary)
}

.l-time-picker__group input,
.l-time-range-picker__group input {
    cursor: pointer
}

.l-time-range-picker {
    width: auto
}

.l-time-picker__panel {
    width: 280px;
    background: transparent;
    border-radius: var(--td-radius-default);
    display: inline-block;
    position: relative;
    font: var(--td-font-body-medium);
    --timePickerPanelOffsetTop: 15;
    --timePickerPanelOffsetBottom: 21
}

.l-time-picker__panel-body {
    width: 100%;
    height: calc(calc(var(--td-comp-size-xs) + var(--td-size-3)) * 7 + var(--td-size-3));
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: center
}

.l-time-picker__panel-body-active-mask {
    position: absolute;
    top: 50%;
    height: var(--td-comp-size-xs);
    width: 100%;
    display: flex
}

.l-time-picker__panel-body-active-mask>div {
    flex: 1;
    transform: translateY(calc(0px - (calc(var(--td-comp-size-xs) + var(--td-size-3)) / 2)));
    height: var(--td-comp-size-xs);
    background-color: var(--td-brand-color-light);
    margin: var(--td-size-3) var(--td-comp-margin-xs);
    border-radius: var(--td-radius-default)
}

.l-time-picker__panel-body-scroll {
    flex: 1;
    height: 100%;
    overflow-y: scroll;
    text-align: center;
    position: relative;
    list-style: none;
    padding: 0;
    margin: 0
}

.l-time-picker__panel-body-scroll::-webkit-scrollbar {
    width: 0
}

.l-time-picker__panel-body-scroll:after,
.l-time-picker__panel-body-scroll:before {
    display: block;
    height: 50%;
    content: ""
}

.l-time-picker__panel-body-scroll:before {
    height: calc(50% - var(--timePickerPanelOffsetTop, 0) * 1px)
}

.l-time-picker__panel-body-scroll:after {
    height: calc(50% - var(--timePickerPanelOffsetBottom, 0) * 1px)
}

.l-time-picker__panel-body-scroll:last-child {
    border-right: 0
}

.l-time-picker__panel-body-scroll-item {
    height: var(--td-comp-size-xs);
    font: var(--td-font-body-medium);
    line-height: var(--td-comp-size-xs);
    color: var(--td-text-color-secondary);
    margin: var(--td-size-3) var(--td-comp-margin-xs);
    border-radius: var(--td-radius-default);
    text-align: center;
    cursor: pointer;
    transition: .2s linear
}

.l-time-picker__panel-body-scroll-item:not(.l-time-picker__panel-body-scroll-item.l-is-current):not(.l-time-picker__panel-body-scroll-item.l-is-disabled):hover {
    color: var(--td-text-color-primary)
}

.l-time-picker__panel-body-scroll-item:not(.l-time-picker__panel-body-scroll-item.l-is-current):not(.l-time-picker__panel-body-scroll-item.l-is-disabled):active {
    background-color: var(--td-bg-color-container-hover)
}

.l-time-picker__panel-body-scroll-item.l-is-disabled {
    color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-time-picker__panel-body-scroll-item.l-is-hidden {
    display: none;
    cursor: not-allowed
}

.l-time-picker__panel-body-scroll-item.l-is-current {
    color: var(--td-brand-color)
}

.l-time-picker__panel-section-body {
    padding: var(--td-pop-padding-xl) calc(var(--td-pop-padding-xl) - var(--td-comp-margin-xs))
}

.l-time-picker__panel-section-footer {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
    background-color: transparent;
    position: relative;
    border-top: 1px solid var(--td-border-level-1-color);
    box-sizing: border-box;
    padding: var(--td-pop-padding-xl)
}

.range-input-disabled.l-is-disabled {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled)
}

.range-input-disabled.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.range-input-disabled.l-is-disabled .l-range-input__inner {
    cursor: not-allowed;
    color: var(--td-text-color-disabled)
}

.range-input-disabled.l-is-disabled .l-range-input__inner::placeholder {
    color: var(--td-text-color-disabled)
}

.range-input-disabled.l-is-disabled>.l-range-input__prefix .l-icon,
.range-input-disabled.l-is-disabled>.l-range-input__suffix .l-icon {
    color: var(--td-text-color-disabled)
}

.l-range-input {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    position: relative;
    font: var(--td-font-body-medium);
    height: var(--td-comp-size-m);
    border-width: 1px;
    border-style: solid;
    border-radius: var(--td-radius-default);
    border-color: var(--td-border-level-2-color);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-s) var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-s);
    background-color: var(--td-bg-color-specialcomponent);
    color: var(--td-text-color-primary);
    font-size: var(--td-font-body-medium);
    box-sizing: border-box;
    transition: all cubic-bezier(.38, 0, .24, 1) .2s;
    display: inline-flex;
    flex-direction: column;
    gap: 4px
}

.l-range-input:hover {
    border-color: var(--td-brand-color)
}

.l-range-input--borderless:not(.l-is-focused) {
    border-color: transparent;
    transition: all cubic-bezier(.38, 0, .24, 1) .2s
}

.l-range-input--borderless:not(.l-is-focused):hover {
    border-color: var(--td-component-border);
    cursor: pointer
}

.l-range-input--borderless:not(.l-is-focused).l-is-disabled {
    border: none;
    background-color: var(--td-bg-color-component-disabled)
}

.l-range-input.l-is-focused {
    z-index: 1;
    border-color: var(--td-brand-color);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus)
}

.l-range-input.l-is-success {
    border-color: var(--td-success-color)
}

.l-range-input.l-is-success:focus {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-range-input.l-is-success.l-range-input--focused {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-range-input.l-is-success>.l-range-input__extra {
    color: var(--td-success-color)
}

.l-range-input.l-is-success>.l-range-input__tips {
    color: var(--td-success-color);
    font-size: var(--td-font-size-body-small);
    margin-left: calc(-1 * var(--td-comp-paddingLR-xs))
}

.l-range-input.l-is-warning {
    border-color: var(--td-warning-color)
}

.l-range-input.l-is-warning:focus {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-range-input.l-is-warning.l-range-input--focused {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-range-input.l-is-warning>.l-range-input__extra {
    color: var(--td-warning-color)
}

.l-range-input.l-is-warning>.l-range-input__tips {
    color: var(--td-warning-color);
    font-size: var(--td-font-size-body-small);
    margin-left: calc(-1 * var(--td-comp-paddingLR-xs))
}

.l-range-input.l-is-error {
    border-color: var(--td-error-color)
}

.l-range-input.l-is-error:focus {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-range-input.l-is-error.l-range-input--focused {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-range-input.l-is-error>.l-range-input__extra {
    color: var(--td-error-color)
}

.l-range-input.l-is-error>.l-range-input__tips {
    color: var(--td-error-color);
    font-size: var(--td-font-size-body-small);
    margin-left: calc(-1 * var(--td-comp-paddingLR-xs))
}

.l-range-input.l-is-disabled {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled)
}

.l-range-input.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.l-range-input.l-is-disabled .l-range-input__inner {
    cursor: not-allowed;
    color: var(--td-text-color-disabled)
}

.l-range-input.l-is-disabled .l-range-input__inner::placeholder {
    color: var(--td-text-color-disabled)
}

.l-range-input.l-is-disabled>.l-range-input__prefix .l-icon,
.l-range-input.l-is-disabled>.l-range-input__suffix .l-icon {
    color: var(--td-text-color-disabled)
}

.l-range-input.l-range-input--prefix .l-range-input__prefix,
.l-range-input.l-range-input--suffix .l-range-input__suffix {
    height: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    font-size: var(--td-font-size-body-medium)
}

.l-range-input.l-size-l {
    height: var(--td-comp-size-xl);
    font: var(--td-font-body-large);
    padding-top: var(--td-comp-paddingTB-xs);
    padding-bottom: var(--td-comp-paddingTB-xs)
}

.l-range-input.l-size-l .l-input {
    padding: 0 var(--td-comp-margin-s)
}

.l-range-input.l-size-s {
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-margin-xs);
    height: var(--td-comp-size-xs);
    font: var(--td-font-body-small)
}

.l-range-input__inner {
    height: 100%;
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-s)
}

.l-range-input__inner .l-input__wrap {
    height: 100%;
    border-radius: var(--td-radius-small)
}

.l-range-input__inner>.l-range-input__prefix {
    flex-shrink: 0
}

.l-range-input__inner .l-input {
    padding: 0 var(--td-comp-paddingLR-xs);
    height: 100%;
    border: 0;
    box-shadow: none;
    font-size: inherit;
    border-radius: var(--td-radius-small)
}

.l-range-input__inner .l-input:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-range-input__inner .l-input__inner {
    width: 100%;
    height: 100%;
    line-height: 1
}

.l-range-input__inner .l-input.l-is-focused {
    background-color: var(--td-bg-color-component)
}

.l-range-input__extra {
    font: var(--td-font-body-small);
    color: var(--td-text-color-placeholder)
}

.l-range-input__status {
    position: absolute;
    right: calc(0px - var(--td-comp-margin-xxxl));
    top: 0
}

.l-range-input.l-range-input--suffix .l-input__clear {
    opacity: 0;
    visibility: hidden;
    transition: all cubic-bezier(.38, 0, .24, 1) .2s
}

.l-range-input.l-range-input--suffix:hover .l-input__clear {
    opacity: 1;
    visibility: visible
}

.l-range-input .l-range-input__suffix-clear {
    cursor: pointer
}

.l-range-input__prefix>.l-icon,
.l-range-input__suffix>.l-icon {
    transition: color .2s linear;
    font-size: 16px;
    color: var(--td-text-color-placeholder);
    flex-shrink: 0
}

.l-range-input-popup {
    width: 100%
}

.l-range-input-popup--visible .l-range-input {
    border-color: var(--td-brand-color);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus)
}

.l-range-input-popup--visible .l-range-input .l-icon-time,
.l-range-input-popup--visible .l-range-input .l-icon-calendar {
    color: var(--td-brand-color)
}

.l-range-input-popup--visible .l-range-input .l-input.l-is-focused {
    background-color: var(--td-bg-color-component)
}

.l-form {
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    font: var(--td-font-body-medium)
}

.l-form:not(.l-form-inline) .l-form__item:last-of-type {
    margin: 0
}

.l-form__item {
    margin-bottom: var(--td-comp-margin-xxl)
}

.l-form__item.l-form__item-with-help {
    margin-bottom: var(--td-comp-margin-xs)
}

.l-form__item.l-form__item-with-extra {
    margin-bottom: var(--td-comp-margin-xxl)
}

.l-form__label {
    float: left;
    padding-right: var(--td-comp-paddingLR-xl);
    vertical-align: middle;
    line-height: var(--td-comp-margin-xxxl);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    white-space: nowrap
}

.l-form__label--top {
    float: none;
    min-height: var(--td-comp-margin-xxxl)
}

.l-form__label--left {
    text-align: left
}

.l-form__label--right {
    text-align: right
}

.l-form__label--required label:before {
    display: inline-block;
    margin-right: var(--td-comp-margin-xs);
    color: var(--td-error-color);
    line-height: var(--td-line-height-body-medium);
    content: "*"
}

.l-form__label--colon label:after {
    content: ":";
    position: relative;
    margin: 0 var(--td-comp-margin-xxs)
}

.l-form__controls {
    min-height: var(--td-comp-margin-xxxl);
    display: flow-root;
    position: relative
}

.l-form__controls-content {
    display: flex;
    align-items: center;
    min-height: var(--td-comp-margin-xxxl)
}

.l-form__controls .l-form__item {
    margin-bottom: 0;
    margin-right: var(--td-comp-margin-xxl)
}

.l-form__controls.l-is-success .l-form__status .l-icon,
.l-form__controls.l-is-success .l-input__extra,
.l-form__controls.l-form--success-border.l-is-success .l-input__extra {
    color: var(--td-success-color)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-input,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-range-input,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner {
    border-color: var(--td-success-color)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-input--focused,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select--focused,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button--focused,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader--focused,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-range-input--focused,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner--focused {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-input .l,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select .l,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button .l,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader .l,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-range-input .l,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner .l,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-input .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-range-input .l-fake-arrow,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner .l-fake-arrow {
    color: var(--td-success-color)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select>.l-select__right-icon:not(.l-select__right-icon-clear) {
    color: var(--td-success-color)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-radio-button:last-child {
    border-right-color: var(--td-success-color)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-textarea__inner.l-is-focused,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-cascader.l-is-active,
.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-select.l-is-active {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-form__controls.l-form--success-border.l-is-success .l-form__controls-content .l-form__status .l-icon {
    color: var(--td-success-color)
}

.l-form__status {
    display: flex;
    margin: 0 var(--td-comp-margin-s)
}

.l-form__status>.l-icon {
    font-size: var(--td-comp-size-xxxs)
}

.l-form__status-without-icon {
    width: 25px;
    height: 25px
}

.l-form__status button {
    width: var(--td-comp-size-m)
}

.l-form__status button+button {
    margin-left: var(--td-comp-margin-s)
}

.l-form-inline {
    display: flex;
    flex-wrap: wrap;
    row-gap: var(--td-comp-margin-l)
}

.l-form-inline .l-form__item {
    margin: 0;
    min-width: 200px;
    display: inline-block;
    margin-right: var(--td-comp-margin-xxl)
}

.l-input__extra,
.l-input__help {
    margin: 0;
    width: 100%;
    height: auto;
    min-height: var(--td-line-height-body-small);
    font: var(--td-font-body-small);
    color: var(--td-text-color-placeholder)
}

.l-input__extra {
    position: absolute;
    bottom: calc(0px - var(--td-line-height-body-small));
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.l-is-warning .l-input__extra {
    color: var(--td-warning-color)
}

.l-is-warning .l-form__controls-content .l-input,
.l-is-warning .l-form__controls-content .l-select,
.l-is-warning .l-form__controls-content .l-radio-button,
.l-is-warning .l-form__controls-content .l-cascader,
.l-is-warning .l-form__controls-content .l-range-input,
.l-is-warning .l-form__controls-content .l-textarea__inner {
    border-color: var(--td-warning-color)
}

.l-is-warning .l-form__controls-content .l-input--focused,
.l-is-warning .l-form__controls-content .l-select--focused,
.l-is-warning .l-form__controls-content .l-radio-button--focused,
.l-is-warning .l-form__controls-content .l-cascader--focused,
.l-is-warning .l-form__controls-content .l-range-input--focused,
.l-is-warning .l-form__controls-content .l-textarea__inner--focused {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-is-warning .l-form__controls-content .l-input .l,
.l-is-warning .l-form__controls-content .l-select .l,
.l-is-warning .l-form__controls-content .l-radio-button .l,
.l-is-warning .l-form__controls-content .l-cascader .l,
.l-is-warning .l-form__controls-content .l-range-input .l,
.l-is-warning .l-form__controls-content .l-textarea__inner .l,
.l-is-warning .l-form__controls-content .l-input .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-select .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-radio-button .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-cascader .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-range-input .l-fake-arrow,
.l-is-warning .l-form__controls-content .l-textarea__inner .l-fake-arrow {
    color: var(--td-warning-color)
}

.l-is-warning .l-form__controls-content .l-select>.l-select__right-icon:not(.l-select__right-icon-clear) {
    color: var(--td-warning-color)
}

.l-is-warning .l-form__controls-content .l-radio-button:last-child {
    border-right-color: var(--td-warning-color)
}

.l-is-warning .l-form__controls-content .l-textarea__inner.l-is-focused,
.l-is-warning .l-form__controls-content .l-cascader.l-is-active,
.l-is-warning .l-form__controls-content .l-select.l-is-active {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-is-warning .l-form__controls-content .l-form__status .l-icon {
    color: var(--td-warning-color)
}

.l-is-error .l-input__extra {
    color: var(--td-error-color)
}

.l-is-error .l-form__controls-content .l-input,
.l-is-error .l-form__controls-content .l-select,
.l-is-error .l-form__controls-content .l-radio-button,
.l-is-error .l-form__controls-content .l-cascader,
.l-is-error .l-form__controls-content .l-range-input,
.l-is-error .l-form__controls-content .l-textarea__inner {
    border-color: var(--td-error-color)
}

.l-is-error .l-form__controls-content .l-input--focused,
.l-is-error .l-form__controls-content .l-select--focused,
.l-is-error .l-form__controls-content .l-radio-button--focused,
.l-is-error .l-form__controls-content .l-cascader--focused,
.l-is-error .l-form__controls-content .l-range-input--focused,
.l-is-error .l-form__controls-content .l-textarea__inner--focused {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-is-error .l-form__controls-content .l-input .l,
.l-is-error .l-form__controls-content .l-select .l,
.l-is-error .l-form__controls-content .l-radio-button .l,
.l-is-error .l-form__controls-content .l-cascader .l,
.l-is-error .l-form__controls-content .l-range-input .l,
.l-is-error .l-form__controls-content .l-textarea__inner .l,
.l-is-error .l-form__controls-content .l-input .l-fake-arrow,
.l-is-error .l-form__controls-content .l-select .l-fake-arrow,
.l-is-error .l-form__controls-content .l-radio-button .l-fake-arrow,
.l-is-error .l-form__controls-content .l-cascader .l-fake-arrow,
.l-is-error .l-form__controls-content .l-range-input .l-fake-arrow,
.l-is-error .l-form__controls-content .l-textarea__inner .l-fake-arrow {
    color: var(--td-error-color)
}

.l-is-error .l-form__controls-content .l-select>.l-select__right-icon:not(.l-select__right-icon-clear) {
    color: var(--td-error-color)
}

.l-is-error .l-form__controls-content .l-radio-button:last-child {
    border-right-color: var(--td-error-color)
}

.l-is-error .l-form__controls-content .l-textarea__inner.l-is-focused,
.l-is-error .l-form__controls-content .l-cascader.l-is-active,
.l-is-error .l-form__controls-content .l-select.l-is-active {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-is-error .l-form__controls-content .l-form__status .l-icon {
    color: var(--td-error-color)
}

.l-radio-group {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    border-radius: var(--td-radius-default);
    flex-wrap: wrap
}

@-moz-document url-prefix() {
    .l-radio-group {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-radio-group::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.l-radio-group::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 7px
}

.l-radio-group::-webkit-scrollbar-thumb:vertical:hover,
.l-radio-group::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-radio-group .l-radio {
    margin-right: var(--td-comp-margin-xxl)
}

.l-radio-group.l-radio-group__outline {
    flex-wrap: wrap;
    row-gap: var(--td-comp-margin-xs)
}

.l-radio-group.l-radio-group__outline.l-size-s .l-radio-button {
    height: var(--td-comp-size-xs)
}

.l-radio-group.l-radio-group__outline.l-size-m .l-radio-button {
    height: var(--td-comp-size-m)
}

.l-radio-group.l-radio-group__outline.l-size-l .l-radio-button {
    height: var(--td-comp-size-xl)
}

.l-radio-group.l-radio-group__outline .l-radio-button:first-child {
    border-radius: var(--td-radius-default) 0 0 var(--td-radius-default)
}

.l-radio-group.l-radio-group__outline .l-radio-button:last-child {
    border-radius: 0 var(--td-radius-default) var(--td-radius-default) 0
}

.l-radio-group.l-radio-group__outline .l-radio-button:only-child {
    border-radius: var(--td-radius-default)
}

.l-radio-group.l-radio-group__outline .l-radio-button.l-is-checked {
    color: var(--td-brand-color)
}

.l-radio-group.l-radio-group__outline .l-radio-button.l-is-disabled.l-is-checked {
    color: var(--td-brand-color-disabled);
    border-color: var(--td-brand-color-disabled);
    background-color: var(--td-bg-color-specialcomponent)
}

.l-radio-group.l-radio-group--filled {
    border-color: var(--td-bg-color-component);
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
    border-radius: var(--td-radius-default);
    background-color: var(--td-bg-color-component);
    position: relative
}

.l-radio-group.l-radio-group--filled .l-radio-group__bg-block {
    position: absolute;
    left: 2px;
    top: 2px;
    width: 0;
    height: calc(100% - 4px);
    background-color: var(--td-bg-color-container-select);
    transition: all .2s cubic-bezier(.38, 0, .24, 1);
    border-radius: var(--td-radius-small)
}

.l-radio-group.l-radio-group--filled .l-radio-button {
    color: var(--td-text-color-secondary);
    border: 0;
    background-color: transparent
}

.l-radio-group.l-radio-group--filled .l-radio-button:hover {
    color: var(--td-text-color-primary)
}

.l-radio-group.l-radio-group--filled .l-radio-button:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: calc(100% - 16px);
    background-color: var(--td-component-border);
    transition: opacity .2s cubic-bezier(0, 0, .15, 1)
}

.l-radio-group.l-radio-group--filled .l-radio-button:first-child:before {
    opacity: 0
}

.l-radio-group.l-radio-group--filled .l-radio-button.l-is-checked {
    position: relative;
    color: var(--td-text-color-primary);
    z-index: 1;
    border: 0;
    transition: color .2s linear
}

.l-radio-group.l-radio-group--filled .l-radio-button.l-is-checked:before {
    opacity: 0
}

.l-radio-group.l-radio-group--filled .l-radio-button.l-is-checked+label:before {
    opacity: 0
}

.l-radio-group.l-radio-group--filled .l-radio-button.l-is-disabled {
    background-color: transparent
}

.l-radio-group.l-radio-group--filled .l-radio-button.l-is-disabled.l-is-checked {
    color: var(--td-text-color-disabled)
}

.l-radio-group.l-radio-group--filled .l-radio-button.l-is-disabled.l-is-checked~.l-radio-group__bg-block {
    background-color: var(--td-bg-color-component-disabled)
}

.l-radio-group.l-radio-group--primary-filled .l-radio-group__bg-block {
    background-color: var(--td-brand-color)
}

.l-radio-group.l-radio-group--primary-filled .l-radio-button.l-is-checked,
.l-radio-group.l-radio-group--primary-filled .l-radio-button.l-is-disabled.l-is-checked {
    color: var(--td-text-color-anti)
}

.l-radio-group.l-radio-group--primary-filled .l-radio-button.l-is-disabled.l-is-checked~.l-radio-group__bg-block {
    background-color: var(--td-brand-color-disabled)
}

.l-radio-group.l-size-s .l-radio-button {
    height: calc(var(--td-comp-size-xs) - (var(--td-comp-paddingTB-xxs) * 2));
    padding: 0px var(--td-comp-paddingLR-s);
    font: var(--td-font-body-small)
}

.l-radio-group.l-size-s .l-radio-button:before {
    height: calc(100% - 16px)
}

.l-radio-group.l-size-m .l-radio-button {
    height: calc(var(--td-comp-size-m) - (var(--td-comp-paddingTB-xxs) * 2));
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-l);
    font: var(--td-font-body-medium)
}

.l-radio-group.l-size-m .l-radio-button:before {
    height: calc(100% - 20px)
}

.l-radio-group.l-size-l .l-radio-button {
    height: calc(var(--td-comp-size-xl) - (var(--td-comp-paddingTB-xxs) * 2));
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-xl);
    font: var(--td-font-body-large)
}

.l-radio-group.l-size-l .l-radio-button:before {
    height: calc(100% - 24px)
}

.l-radio-group .l-radio-button {
    cursor: pointer;
    position: relative;
    border: 1px solid;
    border-color: var(--td-border-level-2-color);
    border-right: 0;
    display: inline-flex;
    align-items: center;
    transition: color .2s cubic-bezier(0, 0, .15, 1);
    color: var(--td-text-color-primary);
    white-space: nowrap;
    box-sizing: border-box
}

.l-radio-group .l-radio-button:first-child {
    border-radius: var(--td-radius-small) 0 0 var(--td-radius-small)
}

.l-radio-group .l-radio-button:last-child {
    border-right: 1px solid;
    border-right-color: var(--td-border-level-2-color);
    border-radius: 0 var(--td-radius-small) var(--td-radius-small) 0
}

.l-radio-group .l-radio-button__former {
    opacity: 0;
    height: 0;
    width: 0;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-radio-group .l-radio-button:hover {
    color: var(--td-brand-color)
}

.l-radio-group .l-radio-button.l-is-checked {
    border-right: 1px solid;
    border-color: var(--td-brand-color);
    transition: border-color .2s cubic-bezier(0, 0, .15, 1)
}

.l-radio-group .l-radio-button.l-is-checked+.l-radio-button {
    border-left: 0
}

.l-radio-group .l-radio-button.l-is-disabled {
    cursor: not-allowed;
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled)
}

.l-radio-group .l-radio-button.l-is-disabled:hover {
    border-color: var(--td-border-level-2-color);
    color: var(--td-text-color-disabled)
}

.l-radio-group .l-radio-button.l-is-disabled:hover:after {
    width: 0
}

.l-radio-group .l-radio-button.l-is-disabled.l-is-checked {
    color: var(--td-text-color-disabled)
}

.l-radio-group .l-radio-button.l-is-disabled.l-is-checked:after {
    width: 0
}

.l-radio {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    cursor: pointer;
    display: inline-block
}

.l-radio__former {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    opacity: 0;
    position: absolute
}

.l-radio__input {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    border-radius: var(--td-radius-circle);
    border: 1px solid var(--td-border-level-2-color);
    background-color: var(--td-bg-color-container);
    transition: border .2s cubic-bezier(0, 0, .15, 1)
}

.l-radio__input:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px;
    transform: scale(.5);
    opacity: 0;
    border-radius: var(--td-radius-circle);
    background-color: var(--td-brand-color);
    transition: all .2s cubic-bezier(0, 0, .15, 1)
}

.l-radio__label {
    display: inline-block;
    margin-left: var(--td-comp-margin-s);
    color: var(--td-text-color-primary);
    vertical-align: middle;
    font: var(--td-font-body-medium);
    white-space: nowrap
}

.l-radio:hover .l-radio__input,
.l-radio.l-is-checked .l-radio__input {
    border-color: var(--td-brand-color)
}

.l-radio.l-is-checked .l-radio__input:after {
    opacity: 1
}

.l-radio.l-is-disabled {
    cursor: not-allowed
}

.l-radio.l-is-disabled .l-radio__label {
    color: var(--td-text-color-disabled)
}

.l-radio.l-is-disabled .l-radio__input {
    background-color: var(--td-bg-color-component-disabled)
}

.l-radio.l-is-disabled:hover .l-radio__input,
.l-radio.l-is-disabled.l-is-checked .l-radio__input {
    border-color: var(--td-border-level-2-color)
}

.l-radio.l-is-disabled.l-is-checked .l-radio__input:after {
    background-color: var(--td-text-color-disabled)
}

.l-radio:focus-visible:focus-visible {
    outline: 2px solid var(--td-brand-color);
    outline-offset: var(--td-comp-paddingTB-xs);
    border-radius: 0
}

.l-slider__input-container {
    display: flex;
    align-items: center;
    margin-left: var(--td-comp-margin-xxl)
}

.l-slider__input-container.is-vertical {
    padding-top: var(--td-comp-paddingTB-l);
    margin-left: 0
}

.l-slider__input-container .l-slider__center-line {
    width: var(--td-size-4);
    height: 1px;
    background: #000000e6;
    margin: 0 var(--td-comp-margin-s)
}

.l-slider {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    height: calc(var(--td-comp-paddingTB-xs) * 2 + var(--td-size-2));
    width: 100%;
    position: relative;
    padding: var(--td-comp-paddingTB-xs) 0
}

.l-slider__container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.l-slider__container.is-vertical {
    height: 100%;
    flex-direction: column
}

.l-slider__rail {
    position: absolute;
    width: 100%;
    height: var(--td-size-2);
    background-color: var(--td-bg-color-secondarycomponent);
    transition: .2s linear;
    border-radius: var(--td-radius-round)
}

.l-slider__rail:hover {
    background-color: var(--td-bg-color-secondarycomponent-hover)
}

.l-slider__track {
    position: absolute;
    height: var(--td-size-2);
    background-color: var(--td-brand-color);
    right: auto;
    border-radius: var(--td-radius-round)
}

.l-slider__step {
    position: absolute;
    width: 100%;
    height: var(--td-size-2);
    cursor: pointer
}

.l-slider__button {
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs);
    border: 2px solid var(--td-brand-color);
    background-color: #fff;
    border-radius: var(--td-radius-circle);
    transition: .2s;
    -webkit-user-select: none;
    user-select: none;
    box-sizing: border-box;
    box-shadow: var(--td-shadow-1)
}

.l-slider__button--dragging {
    box-shadow: 0 0 0 2px var(--td-brand-color-focus)
}

.l-slider__button:hover {
    background-color: var(--td-gray-color-1)
}

.l-slider__button-wrapper {
    position: absolute;
    z-index: 2;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: transparent;
    text-align: center;
    -webkit-user-select: none;
    user-select: none;
    line-height: normal;
    outline: none;
    cursor: pointer;
    display: flex;
    align-items: center
}

.l-slider__stop {
    position: absolute;
    width: 1px;
    height: var(--td-size-2);
    background-color: var(--td-bg-color-secondarycomponent);
    top: 4px
}

.l-slider__mark {
    position: absolute;
    top: 2px;
    left: 0;
    width: 100%
}

.l-slider__mark-text {
    position: absolute;
    display: inline-block;
    font: var(--td-font-body-small);
    color: var(--td-text-color-primary);
    top: calc(var(--td-size-2) + var(--td-comp-paddingTB-xs) + 2px);
    transform: translate(-50%);
    cursor: pointer
}

.l-slider__mark-text:first-child {
    transform: translate(0)
}

.l-slider__mark-text:last-child {
    transform: translate(-100%)
}

.l-slider--vertical {
    height: 100%;
    padding: 0;
    display: flex;
    justify-content: center;
    position: relative
}

.l-slider--vertical .l-slider__rail {
    width: var(--td-size-2);
    height: 100%
}

.l-slider--vertical .l-slider__track {
    width: var(--td-size-2);
    top: auto
}

.l-slider--vertical .l-slider__step {
    width: var(--td-size-2);
    height: 100%
}

.l-slider--vertical .l-slider__handle {
    margin-top: -6px;
    margin-left: -5px;
    top: auto;
    transform: translateY(50%)
}

.l-slider--vertical .l-slider__mark {
    top: 0;
    left: 12px;
    width: 18px;
    height: 100%
}

.l-slider--vertical .l-slider__stop {
    width: var(--td-size-2);
    height: 1px;
    left: 4px;
    background-color: var(--td-bg-color-secondarycomponent)
}

.l-slider--vertical .l-slider__mark-text {
    transform: translateY(-50%);
    margin-top: 0;
    margin-left: var(--td-comp-margin-xxs)
}

.l-slider--vertical .l-slider__button-wrapper {
    top: auto;
    position: absolute;
    z-index: 2;
    left: 50%;
    transform: translate(-50%, 50%);
    background-color: transparent;
    text-align: center;
    -webkit-user-select: none;
    user-select: none;
    line-height: normal;
    outline: none;
    cursor: pointer;
    display: flex;
    align-items: center
}

.l-is-disabled {
    cursor: not-allowed
}

.l-is-disabled .l-slider__track {
    background-color: var(--td-brand-color-disabled)
}

.l-is-disabled .l-slider__rail {
    background-color: var(--td-bg-color-component-disabled)
}

.l-is-disabled .l-slider__handle {
    border: 2px solid var(--td-brand-color-disabled)
}

.l-is-disabled .l-slider__button {
    border-color: var(--td-brand-color-disabled);
    outline: none
}

.l-is-disabled .l-slider__mark-text {
    color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-is-disabled .l-slider__button-wrapper {
    cursor: not-allowed
}

.l-switch {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    list-style: none;
    position: relative;
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    outline: none;
    border: 0;
    padding: 0;
    margin: 0;
    height: var(--td-comp-size-xxs);
    line-height: var(--td-comp-size-xxs);
    border-radius: var(--td-radius-round);
    min-width: calc(var(--td-comp-size-xxs) / .618);
    transition: all .2s cubic-bezier(.38, 0, .24, 1);
    background-color: var(--td-bg-color-secondarycomponent);
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none
}

.l-switch:hover {
    background-color: var(--td-bg-color-secondarycomponent-hover)
}

.l-switch__handle {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 4px;
    left: 4px;
    width: calc(var(--td-comp-size-xxs) - 2 * 4px);
    height: calc(var(--td-comp-size-xxs) - 2 * 4px);
    border-radius: var(--td-radius-round);
    transition: all .2s cubic-bezier(.38, 0, .24, 1);
    box-shadow: var(--td-shadow-1)
}

.l-switch__handle .l-icon {
    font-size: calc(var(--td-comp-size-xxs) - 4px);
    color: transparent
}

.l-switch__handle:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: var(--td-radius-round);
    background-color: #fff;
    transition: all .2s cubic-bezier(.38, 0, .24, 1)
}

.l-switch:active:not(.l-is-disabled):not(.l-is-loading) .l-switch__handle:before {
    left: 0;
    right: -6px
}

.l-switch:active:not(.l-is-disabled):not(.l-is-loading).l-is-checked .l-switch__handle:before {
    right: 0;
    left: -6px
}

.l-switch:active:not(.l-is-disabled):not(.l-is-loading) .l-switch__content {
    opacity: 0
}

.l-switch__content {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    color: var(--td-text-color-anti);
    padding: 0 var(--td-comp-margin-xs) 0 calc(calc(var(--td-comp-size-xxs) / .618) / 2 + 2px);
    font-size: var(--td-font-size-body-small);
    min-width: calc(var(--td-comp-size-xxs) / .618);
    transition: padding .2s cubic-bezier(.38, 0, .24, 1), opacity .2s linear
}

.l-switch__content .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-switch.l-is-checked {
    background-color: var(--td-brand-color)
}

.l-switch.l-is-checked:hover {
    background-color: var(--td-brand-color-hover)
}

.l-switch.l-is-checked .l-switch__handle {
    left: calc(100% - 2.5px);
    transform: translate(-100%);
    width: calc(var(--td-comp-size-xxs) - 2 * 2.5px);
    height: calc(var(--td-comp-size-xxs) - 2 * 2.5px);
    top: 2.5px
}

.l-switch.l-is-checked .l-switch__content {
    padding: 0 calc(calc(var(--td-comp-size-xxs) / .618) / 2 + 2px) 0 var(--td-comp-margin-xs);
    color: var(--td-text-color-anti)
}

.l-switch.l-is-loading {
    cursor: not-allowed;
    background-color: var(--td-bg-color-component-disabled)
}

.l-switch.l-is-loading .l-loading {
    display: inline-flex
}

.l-switch.l-is-loading .l-switch__handle .l-icon {
    color: var(--td-bg-color-component-disabled)
}

.l-switch.l-is-loading.l-is-checked {
    background-color: var(--td-brand-color-focus)
}

.l-switch.l-is-loading.l-is-checked .l-switch__handle .l-icon {
    color: var(--td-brand-color-focus)
}

.l-switch.l-is-disabled {
    cursor: not-allowed;
    background-color: var(--td-bg-color-component-disabled)
}

.l-switch.l-is-disabled .l-switch__handle {
    box-shadow: none
}

.l-switch.l-is-disabled.l-is-checked {
    background-color: var(--td-brand-color-disabled)
}

.l-switch.l-is-disabled.l-is-checked .l-switch__handle {
    box-shadow: none
}

.l-switch.l-is-disabled.l-is-checked .l-switch__handle .l-icon {
    color: var(--td-brand-color-disabled)
}

.l-switch.l-size-l {
    min-width: calc(var(--td-comp-size-xs) / .618);
    height: var(--td-comp-size-xs);
    line-height: var(--td-comp-size-xs);
    border-radius: var(--td-radius-round)
}

.l-switch.l-size-l:active:not(.l-is-disabled):not(.l-is-loading) .l-switch__handle:before {
    left: 0;
    right: -8px
}

.l-switch.l-size-l:active:not(.l-is-disabled):not(.l-is-loading).l-is-checked .l-switch__handle:before {
    right: 0;
    left: -8px
}

.l-switch.l-size-l .l-switch__handle {
    top: 5px;
    left: 5px;
    width: calc(var(--td-comp-size-xs) - 2 * 5px);
    height: calc(var(--td-comp-size-xs) - 2 * 5px)
}

.l-switch.l-size-l .l-switch__handle .l-icon {
    font-size: calc(var(--td-comp-size-xs) - 4px)
}

.l-switch.l-size-l .l-switch__content {
    padding: 0 var(--td-comp-margin-s) 0 calc(calc(var(--td-comp-size-xs) / .618) / 2 + 4px);
    min-width: calc(var(--td-comp-size-xs) / .618);
    font-size: var(--td-font-size-body-large)
}

.l-switch.l-size-l .l-switch__content .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-switch.l-size-l.l-is-checked .l-switch__handle {
    left: calc(100% - 3px);
    top: 3px;
    width: calc(var(--td-comp-size-xs) - 2 * 3px);
    height: calc(var(--td-comp-size-xs) - 2 * 3px)
}

.l-switch.l-size-l.l-is-checked .l-switch__content {
    padding: 0 calc(calc(var(--td-comp-size-xs) / .618) / 2 + 4px) 0 var(--td-comp-margin-s)
}

.l-switch.l-size-s {
    min-width: calc(var(--td-comp-size-xxxs) / .618);
    height: var(--td-comp-size-xxxs);
    line-height: var(--td-comp-size-xxxs);
    border-radius: var(--td-radius-round)
}

.l-switch.l-size-s:active:not(.l-is-disabled):not(.l-is-loading) .l-switch__handle:before {
    left: 0;
    right: -4px
}

.l-switch.l-size-s:active:not(.l-is-disabled):not(.l-is-loading).l-is-checked .l-switch__handle:before {
    right: 0;
    left: -4px
}

.l-switch.l-size-s .l-switch__handle {
    top: 3px;
    left: 3px;
    width: calc(var(--td-comp-size-xxxs) - 2 * 3px);
    height: calc(var(--td-comp-size-xxxs) - 2 * 3px)
}

.l-switch.l-size-s .l-switch__handle .l-icon {
    font-size: calc(var(--td-comp-size-xxxs) - 4px)
}

.l-switch.l-size-s .l-switch__content {
    padding: 0 var(--td-comp-margin-xxs) 0 calc(calc(var(--td-comp-size-xxxs) / .618) / 2 + 2px);
    min-width: calc(var(--td-comp-size-xxxs) / .618);
    font-size: 9px
}

.l-switch.l-size-s .l-switch__content .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-switch.l-size-s.l-is-checked .l-switch__handle {
    left: calc(100% - 2px);
    top: 2px;
    width: calc(var(--td-comp-size-xxxs) - 2 * 2px);
    height: calc(var(--td-comp-size-xxxs) - 2 * 2px)
}

.l-switch.l-size-s.l-is-checked .l-switch__content {
    padding: 0 calc(calc(var(--td-comp-size-xxxs) / .618) / 2 + 2px) 0 var(--td-comp-margin-xxs)
}

.l-textarea {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    width: 100%
}

.l-textarea__inner {
    display: flex;
    width: 100%;
    height: var(--td-comp-size-xxxl);
    border: 1px solid var(--td-border-level-2-color);
    border-radius: var(--td-radius-default);
    padding: calc(calc(var(--td-comp-size-m) - var(--td-line-height-body-medium)) / 2) var(--td-comp-paddingLR-s);
    background-color: var(--td-bg-color-specialcomponent);
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    resize: vertical;
    outline: none;
    transition: all cubic-bezier(.38, 0, .24, 1) .2s, height 0s;
    box-sizing: border-box
}

.l-textarea__inner:hover {
    border-color: var(--td-brand-color)
}

.l-textarea__inner:focus {
    border-color: var(--td-brand-color);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus)
}

.l-textarea__inner::placeholder {
    color: var(--td-text-color-placeholder)
}

.l-textarea__inner.l-is-success {
    border-color: var(--td-success-color)
}

.l-textarea__inner.l-is-success:focus {
    box-shadow: 0 0 0 2px var(--td-success-color-focus)
}

.l-textarea__inner.l-is-warning {
    border-color: var(--td-warning-color)
}

.l-textarea__inner.l-is-warning:focus {
    box-shadow: 0 0 0 2px var(--td-warning-color-focus)
}

.l-textarea__inner.l-is-error {
    border-color: var(--td-error-color)
}

.l-textarea__inner.l-is-error:focus {
    box-shadow: 0 0 0 2px var(--td-error-color-focus)
}

.l-textarea__info_wrapper {
    display: flex;
    column-gap: var(--td-comp-margin-s);
    justify-content: space-between
}

.l-textarea__info_wrapper_align {
    justify-content: end
}

.l-textarea__limit {
    font: var(--td-font-body-small);
    color: var(--td-text-color-placeholder)
}

.l-textarea .l-is-disabled {
    color: var(--td-text-color-disabled);
    background-color: var(--td-bg-color-component-disabled);
    cursor: not-allowed
}

.l-textarea .l-is-disabled:hover {
    border-color: var(--td-border-level-2-color)
}

.l-textarea .l-is-disabled::placeholder {
    color: var(--td-text-color-disabled)
}

.l-textarea .l-resize-none {
    resize: none
}

.l-textarea__tips {
    height: auto;
    min-height: var(--td-comp-size-xs);
    font: var(--td-font-body-small);
    display: inline-block
}

.l-textarea__tips--normal {
    color: var(--td-text-color-placeholder)
}

.l-textarea__tips--success {
    color: var(--td-success-color)
}

.l-textarea__tips--warning {
    color: var(--td-warning-color)
}

.l-textarea__tips--error {
    color: var(--td-error-color)
}

.l-transfer {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    font: var(--td-font-body-medium);
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    background: transparent;
    color: var(--td-text-color-primary);
    max-height: 100%
}

.l-transfer__list {
    position: relative;
    display: inline-block;
    min-width: 200px;
    height: 200px;
    padding-top: var(--td-comp-size-xxl);
    border: 0;
    word-break: break-word;
    vertical-align: middle
}

.l-transfer__list-source,
.l-transfer__list-target {
    border: 1px solid var(--td-border-level-1-color);
    border-radius: var(--td-radius-medium)
}

.l-transfer__list-header {
    position: absolute;
    display: flex;
    justify-content: space-between;
    top: 0;
    height: var(--td-comp-size-xxl);
    line-height: var(--td-comp-size-xxl);
    width: calc(200px - var(--td-comp-margin-s) * 2);
    padding: 0 var(--td-comp-paddingLR-s);
    margin: 0 var(--td-comp-margin-s);
    box-sizing: border-box
}

.l-transfer__list-header+:not(.l-transfer__list--with-search) {
    border-top: 1px solid var(--td-border-level-1-color)
}

.l-transfer__list-header .l-checkbox {
    margin-right: 0
}

.l-transfer__list-header .l-checkbox__label {
    margin: 0
}

.l-transfer__list-header div {
    display: flex
}

.l-transfer__list-header div>span {
    margin-left: var(--td-comp-margin-s)
}

.l-transfer__list-header>span {
    color: var(--td-text-color-placeholder)
}

.l-transfer__list-body {
    position: relative;
    height: 100%;
    box-sizing: border-box
}

.l-transfer__list--with-search {
    padding-top: var(--td-comp-size-m);
    border-top: 0
}

.l-transfer__list-content {
    height: 100%;
    width: 100%;
    overflow: auto
}

.l-transfer__list-content .l-checkbox-group {
    width: 100%;
    flex-direction: column;
    gap: var(--td-comp-margin-xs);
    margin: var(--td-comp-margin-s) 0
}

.l-transfer__list-content .l-checkbox-group .l-checkbox {
    margin-right: var(--td-comp-margin-s);
    --ripple-color: var(--td-bg-color-container-active)
}

.l-transfer__list-content .l-checkbox-group .l-checkbox+.l-checkbox {
    margin-left: var(--td-comp-margin-s)
}

.l-transfer__list-content .l-checkbox-group .l-checkbox__label {
    margin: 0;
    flex: 1
}

.l-transfer__list-content .l-checkbox-group .l-checkbox__label>span {
    margin-left: var(--td-comp-margin-s);
    display: inline-block
}

.l-transfer__list .l-transfer__list-item {
    padding: var(--td-comp-paddingLR-xs) var(--td-comp-paddingLR-s);
    display: flex;
    cursor: pointer;
    margin: 0 var(--td-comp-margin-s);
    border-radius: var(--td-radius-default);
    transition: background-color .2s cubic-bezier(.38, 0, .24, 1)
}

.l-transfer__list .l-transfer__list-item:first-child {
    margin-top: 0
}

.l-transfer__list .l-transfer__list-item.l-is-disabled:hover {
    background: transparent
}

.l-transfer__list-item:hover {
    background: var(--td-bg-color-container-hover);
    transition: background-color .2s cubic-bezier(.38, 0, .24, 1)
}

.l-transfer__list-item.l-is-checked {
    background: var(--td-brand-color-light)
}

.l-transfer__list-wrapper {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: auto;
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m)
}

.l-transfer__list-pagination {
    height: var(--td-comp-size-xs);
    vertical-align: middle;
    padding: var(--td-comp-paddingTB-m)
}

.l-transfer__list-footer {
    position: absolute;
    left: 0;
    bottom: 0;
    border-top: 1px solid var(--td-border-level-1-color);
    width: 100%
}

.l-transfer__operations {
    display: inline-flex;
    flex-direction: column;
    margin: auto var(--td-comp-margin-s);
    vertical-align: middle;
    overflow: hidden;
    gap: var(--td-comp-margin-l)
}

.l-transfer__operations .l-icon {
    font-size: var(--td-comp-size-xxxs)
}

.l-transfer__operations .l-icon+.l-button__text {
    margin-left: 0
}

.l-transfer__empty {
    text-align: center;
    position: absolute;
    color: var(--td-text-color-placeholder);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.l-transfer__search-wrapper {
    position: absolute;
    top: 0;
    width: 100%;
    padding: 0 var(--td-comp-margin-s);
    box-sizing: border-box
}

.l-transfer__search .l-transfer__list {
    height: 240px
}

.l-transfer--with-tree .l-transfer__list {
    height: auto
}

.l-transfer--with-tree .l-transfer__list .l-tree {
    padding: 0 var(--td-comp-paddingLR-m);
    margin: var(--td-comp-margin-s) 0
}

.l-transfer__pagination .l-transfer__list {
    height: 240px;
    padding-bottom: calc(var(--td-comp-size-xs) + var(--td-comp-paddingTB-m) * 2)
}

.l-transfer__footer .l-transfer__list {
    height: 248px;
    padding-bottom: 48px
}

.l-transfer__pagination.l-transfer__footer .l-transfer__list {
    height: 288px;
    padding-bottom: calc(calc(var(--td-comp-size-xs) + var(--td-comp-paddingTB-m) * 2) + 48px)
}

.l-transfer__search.l-transfer__footer .l-transfer__list {
    height: 288px;
    padding-bottom: 48px
}

.l-transfer__search.l-transfer__pagination .l-transfer__list {
    height: 280px;
    padding-bottom: 48px
}

.l-transfer__search.l-transfer__footer.l-transfer__pagination .l-transfer__list {
    height: 328px;
    padding-bottom: 88px
}

.l-transfer__wrapper .l-transfer__list {
    height: 320px;
    width: 206px;
    overflow: scroll
}

.l-tree {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    position: relative
}

.l-tree.l-is-disabled,
.l-tree.l-is-disabled .l-icon {
    color: var(--td-text-color-disabled)
}

.l-tree.l-is-disabled .l-tree__item.l-is-active {
    background-color: var(--td-bg-color-container-hover);
    color: var(--td-text-color-disabled)
}

.l-tree.l-is-disabled .l-tree__item .l-icon {
    color: var(--td-text-color-secondary)
}

.l-tree__empty {
    color: var(--td-text-color-disabled)
}

.l-tree__branch {
    display: block
}

.l-tree__item {
    --level: 0;
    --hscale: 2;
    will-change: opacity, max-height;
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    padding: 0 0 0 calc(var(--td-comp-margin-xxl) * var(--level));
    cursor: default;
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000
}

.l-tree__item .l-icon,
.l-tree__item .l-loading {
    display: inline-block;
    position: relative;
    z-index: 2;
    font-size: calc(var(--td-font-size-body-medium) + 2px)
}

.l-tree__item .l-icon {
    color: var(--td-text-color-secondary)
}

.l-tree__item .l-checkbox {
    align-items: center;
    font-size: 0
}

.l-tree__item .l-checkbox__input {
    flex-shrink: 0
}

.l-tree__item .l-checkbox__label {
    overflow: hidden;
    text-overflow: ellipsis
}

.l-tree__item .l-tree__icon--default .l-icon {
    transform: rotate(0)
}

.l-tree__item--open .l-icon {
    color: var(--td-text-color-brand)
}

.l-tree__item--open .l-tree__icon--default .l-icon {
    transform: rotate(90deg)
}

.l-tree__item--clickable {
    cursor: pointer
}

.l-tree__item--locked {
    color: var(--td-text-color-disabled)
}

.l-tree__item--matched {
    color: inherit
}

.l-tree__item--draggable {
    cursor: pointer
}

.l-tree__item--draggable:hover {
    background-color: var(--td-bg-color-container-hover);
    background-clip: content-box
}

.l-tree__item--draggable:after {
    position: absolute;
    top: -1px;
    right: 0;
    left: 0;
    display: block;
    height: 2px;
    border-radius: 1px;
    content: "";
    padding: inherit;
    background-clip: content-box
}

.l-tree__item--tip-top:after {
    background-color: var(--td-brand-color)
}

.l-tree__item--tip-bottom:after {
    top: unset;
    bottom: -1px;
    background-color: var(--td-brand-color)
}

.l-tree__item--tip-highlight {
    background-color: var(--td-brand-color-light);
    background-clip: content-box
}

.l-tree__item:before {
    content: "";
    display: block;
    width: 0;
    flex: 0 0 auto;
    height: calc(var(--td-comp-size-m) + 2px)
}

.l-tree--block-node .l-tree__label {
    flex: 1
}

.l-tree--hoverable .l-tree__label:not(.l-is-active):not(.l-is-checked):hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-tree__line {
    --level: 0;
    --color: var(--td-border-level-1-color);
    --space: var(--td-comp-margin-xxl);
    --iconSize: 16px;
    position: absolute;
    left: calc(var(--td-comp-margin-xxl) * var(--level) - var(--td-comp-margin-l));
    bottom: var(--td-comp-margin-l);
    width: 1px;
    height: calc(var(--td-comp-size-m) + 2px);
    pointer-events: none
}

.l-tree__line:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    height: calc(var(--td-comp-size-m) + 2px);
    width: var(--td-comp-margin-m);
    border-left: 1px solid var(--color);
    border-bottom: 1px solid var(--color)
}

.l-tree__line--first:before {
    height: var(--td-line-height-body-medium)
}

.l-tree__line--leaf:before {
    width: var(--td-comp-margin-m)
}

.l-tree__icon {
    position: relative;
    flex: none;
    display: inline-flex;
    align-items: center;
    text-align: center;
    width: calc(var(--td-font-size-body-medium) + 2px);
    font-size: 0;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer
}

.l-tree__icon:after {
    content: "";
    display: block;
    position: absolute;
    left: -2px;
    top: -2px;
    width: calc(calc(var(--td-font-size-body-medium) + 2px) + 4px);
    height: calc(calc(var(--td-font-size-body-medium) + 2px) + 4px);
    border-radius: var(--td-radius-default)
}

.l-tree__icon:not(:empty):hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-tree__icon:empty {
    cursor: initial
}

.l-tree__label {
    --ripple-color: var(--td-bg-color-container-active);
    flex-wrap: nowrap;
    flex: 1;
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xs);
    margin-left: var(--td-comp-margin-xs);
    border-radius: var(--td-radius-default);
    cursor: pointer;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-tree__label.l-is-checked {
    font-weight: 500;
    color: var(--td-text-color-primary);
    background-color: var(--td-brand-color-light)
}

.l-tree__label::selection {
    background-color: transparent
}

.l-is-active .l-tree__label {
    font-weight: 500;
    color: var(--td-text-color-primary);
    background-color: var(--td-brand-color-light)
}

.l-tree__space {
    display: block;
    flex: 1 0 auto
}

.l-tree__operations {
    display: flex;
    flex: 0 0 auto;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto
}

.l-tree__operations .l-icon {
    cursor: pointer
}

.l-tree__item.l-is-disabled {
    color: var(--td-text-color-disabled);
    cursor: default
}

.l-tree__item.l-is-disabled .l-checkbox {
    cursor: default
}

.l-tree__item--hidden {
    display: none
}

.l-tree--transition .l-tree__label {
    transition: background-color .24s cubic-bezier(.38, 0, .24, 1)
}

.l-tree--transition .l-tree__icon {
    transition: color, transform .24s cubic-bezier(.38, 0, .24, 1)
}

.l-tree--transition .l-tree__icon:after {
    transition: .2s linear
}

.l-tree--transition .l-tree__icon:not(:empty):hover {
    transition: .2s linear
}

.l-tree--transition .l-tree__icon--default .l-icon {
    transition: color, transform cubic-bezier(.38, 0, .24, 1) .2s
}

.l-tree--transition .l-tree__item--visible {
    display: flex;
    max-height: calc(calc(var(--td-comp-size-m) + 2px) * var(--hscale) + 0px);
    opacity: 1;
    transition: opacity .15s linear .15s, max-height .15s linear 0s
}

.l-tree--transition .l-tree__item--hidden {
    display: flex;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
    animation: initial;
    transition: opacity .15s linear 0s, max-height .15s linear .15s
}

.l-tree--transition .l-tree__item--enter-active {
    animation: t-tree-toggle .3s linear
}

.l-tree--transition .l-tree__item--leave-active {
    animation: t-tree-toggle .3s reverse linear forwards
}

.l-tree__vscroll,
.l-tree__lazyload {
    overflow-y: auto
}

.l-tree__vscroll-cursor {
    position: absolute;
    width: 1px;
    height: 1px;
    transition: transform .2s
}

.l-tree--scrolling .l-tree__item {
    will-change: initial
}

.l-tree--scrolling .v-enter,
.l-tree--scrolling .v-leave,
.l-tree--scrolling .l-tree__item--visible,
.l-tree--scrolling .l-tree__item--hidden,
.l-tree--scrolling .l-tree__item--enter,
.l-tree--scrolling .l-tree__item--enter-active,
.l-tree--scrolling .l-tree__item--enter-to,
.l-tree--scrolling .l-tree__item--leave,
.l-tree--scrolling .l-tree__item--leave-active .l-tree__item--leave-to {
    animation: none;
    transition: none
}

.l-tree--scrolling .l-tree__item--visible,
.l-tree--scrolling .l-tree__item--enter-to,
.l-tree--scrolling .l-tree__item--enter-active {
    max-height: initial
}

.l-tree--scrolling .l-tree__item--leave-to,
.l-tree--scrolling .l-tree__item--leave-active {
    max-height: 0
}

@keyframes t-tree-toggle {
    0% {
        opacity: 0;
        max-height: 0
    }

    50% {
        opacity: 0;
        max-height: calc(calc(var(--td-comp-size-m) + 2px) * var(--hscale) + 0px)
    }

    to {
        opacity: 1;
        max-height: calc(calc(var(--td-comp-size-m) + 2px) * var(--hscale) + 0px)
    }
}

.l-tree-select {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-tree-select--without-input input {
    display: none
}

.l-tree-select--without-input .l-input__suffix-icon {
    margin-left: auto
}

.l-tree-select .l-fake-arrow {
    transition: color .2s cubic-bezier(.38, 0, .24, 1);
    color: var(--td-text-color-placeholder)
}

.l-tree-select .l-fake-arrow--highlight {
    color: var(--td-text-color-brand)
}

.l-tree-select .l-fake-arrow--disable {
    color: var(--td-text-color-disabled)
}

.l-tree-select--placeholder {
    color: var(--td-text-color-placeholder)
}

.l-tree-select.l-single-suffix {
    padding-right: 20px
}

.l-tree-select.l-tag-prefix {
    padding-left: 4px
}

.l-tree-select-popup .l-popup__content {
    padding: var(--td-pop-padding-m);
    max-height: 300px;
    overflow-y: auto
}

@-moz-document url-prefix() {
    .l-tree-select-popup .l-popup__content {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-tree-select-popup .l-popup__content::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.l-tree-select-popup .l-popup__content::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.l-tree-select-popup .l-popup__content::-webkit-scrollbar-thumb:vertical:hover,
.l-tree-select-popup .l-popup__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-color-picker__panel {
    padding: 0;
    width: 256px;
    background: var(--td-bg-color-container);
    box-shadow: var(--td-shadow-2), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left);
    border-radius: var(--td-radius-medium);
    -webkit-user-select: none;
    user-select: none
}

.l-popup__content .l-color-picker__panel {
    background: transparent;
    box-shadow: unset
}

.l-color-picker {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-color-picker.t-popup__content {
    box-shadow: var(--td-shadow-2), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left)
}

.l-color-picker__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--td-comp-size-xxxs);
    background: transparent;
    transition: .2s linear;
    color: var(--td-text-color-secondary);
    border-radius: var(--td-radius-default);
    cursor: pointer
}

.l-color-picker__icon:hover {
    background: var(--td-bg-color-container-hover);
    transition: .2s linear
}

.l-color-picker__icon.l-is-disabled {
    color: var(--td-text-color-disabled);
    pointer-events: none
}

.l-color-picker__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--td-pop-padding-xl);
    position: relative;
    z-index: 2
}

.l-color-picker__head .l-color-picker__close {
    flex-shrink: 0
}

.l-color-picker__head+.l-color-picker__body {
    padding-top: 0
}

.l-color-picker__body {
    padding: var(--td-pop-padding-xl);
    padding-bottom: calc(var(--td-pop-padding-xl) - 4px)
}

.l-color-picker__thumb {
    position: absolute;
    z-index: 1;
    outline: none;
    border-color: currentcolor;
    width: calc(var(--td-comp-size-xxxs) + var(--td-size-1));
    height: calc(var(--td-comp-size-xxxs) + var(--td-size-1));
    border-radius: var(--td-radius-circle);
    box-shadow: var(--td-shadow-1);
    background: var(--td-text-color-anti);
    color: var(--td-text-color-brand);
    padding: 2px;
    box-sizing: border-box
}

.l-color-picker__thumb:before {
    content: "";
    width: 100%;
    height: 100%;
    background: currentcolor;
    border-radius: var(--td-radius-circle);
    display: block
}

.l-color-picker__saturation {
    height: 160px;
    border-radius: var(--td-radius-default);
    position: relative;
    overflow: hidden;
    background: transparent
}

.l-color-picker__saturation:before,
.l-color-picker__saturation:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.l-color-picker__saturation:before {
    background: linear-gradient(90deg, #fff, transparent)
}

.l-color-picker__saturation:after {
    background: linear-gradient(0deg, #000, transparent)
}

.l-color-picker__saturation .l-color-picker__thumb {
    width: calc(var(--td-comp-size-xxxs) + var(--td-size-1));
    height: calc(var(--td-comp-size-xxxs) + var(--td-size-1));
    border-radius: var(--td-radius-circle);
    transform: translate(-50%, -50%)
}

.l-color-picker__slider-wrapper {
    border-radius: 4px;
    padding: 0 calc(calc(var(--td-comp-size-xxxs) + var(--td-size-1)) / 2);
    position: relative
}

.l-color-picker__slider-wrapper--hue-type {
    background: red
}

.l-color-picker__slider-wrapper--alpha-type {
    background: var(--td-text-color-anti);
    background-image: linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5), linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5);
    background-size: 6px 6px;
    background-position: 0 0, 3px 3px
}

.l-color-picker__slider-padding {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 8px;
    border-radius: 4px
}

.l-color-picker__slider {
    height: 8px;
    position: relative;
    border-radius: 4px;
    cursor: pointer;
    color: transparent;
    outline: none;
    z-index: 1
}

.l-color-picker__slider .l-color-picker__thumb {
    transform: translate(calc(calc(var(--td-comp-size-xxxs) + var(--td-size-1)) * -.5), -50%);
    top: 50%
}

.l-color-picker__slider .l-color-picker__rail {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit
}

.l-color-picker__alpha,
.l-color-picker__format {
    margin: var(--td-comp-margin-m) 0 0 0
}

.l-color-picker__hue {
    background: linear-gradient(90deg, red, #ff0 17%, #0f0 33%, #0ff, #00f 67%, #f0f 83%, red)
}

.l-color-picker__alpha .l-color-picker__rail {
    background: linear-gradient(to right, transparent, currentcolor)
}

.l-color-picker__sliders-wrapper {
    display: flex;
    align-items: center;
    margin: var(--td-comp-margin-m) 0
}

.l-color-picker__sliders {
    width: 100%
}

.l-color-picker__sliders-preview {
    flex-shrink: 0;
    margin-left: var(--td-comp-margin-m);
    width: var(--td-comp-size-s);
    height: var(--td-comp-size-s);
    border-radius: var(--td-radius-default);
    overflow: hidden;
    background: var(--td-text-color-anti);
    background-image: linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5), linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5);
    background-size: 6px 6px;
    background-position: 0 0, 3px 3px
}

.l-color-picker__sliders-preview-inner {
    display: block;
    width: 100%;
    height: 100%
}

.l-color-picker__gradient {
    padding: 0;
    display: flex;
    align-items: center;
    margin-bottom: var(--td-comp-margin-m)
}

.l-color-picker__gradient-slider {
    flex: 1
}

.l-color-picker__gradient-degree {
    position: relative;
    flex-shrink: 0;
    margin-left: var(--td-comp-margin-m);
    width: var(--td-comp-size-xxl)
}

.l-color-picker__gradient-degree .l-input {
    margin: 0;
    font: var(--td-font-body-small)
}

.l-color-picker__gradient-degree .l-input-number {
    width: 100%;
    padding: 0
}

.l-color-picker__gradient .gradient-thumbs {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    border-radius: inherit;
    cursor: pointer
}

.l-color-picker__gradient .gradient-thumbs__item {
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    z-index: 0;
    cursor: pointer
}

.l-color-picker__gradient .gradient-thumbs__item:before {
    display: none
}

.l-color-picker__gradient .gradient-thumbs__item.l-is-active {
    z-index: 1;
    outline: 2px solid var(--td-component-border)
}

.l-color-picker__gradient .gradient-thumbs__item-inner {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: var(--td-radius-circle);
    overflow: hidden
}

.l-color-picker__gradient .gradient-thumbs__item-inner:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: currentcolor
}

.l-color-picker__format {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.l-color-picker__format--item:first-child {
    flex-shrink: 0
}

.l-color-picker__format--item:last-child {
    flex: 1
}

.l-color-picker__format--item .l-size-m,
.l-color-picker__format--item .l-input.l-size-m {
    font: var(--td-font-body-small)
}

.l-color-picker__format--item .l-input-number .l-input {
    margin: 0
}

.l-color-picker__format--item .input-group {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin-left: var(--td-comp-margin-s)
}

.l-color-picker__format--item .input-group__item {
    flex: 1;
    width: 0;
    margin-left: -1px
}

.l-color-picker__format--item .input-group__item .l-input {
    padding: 0 1px
}

.l-color-picker__format--item .input-group__item .l-input:focus,
.l-color-picker__format--item .input-group__item .l-input:focus-within,
.l-color-picker__format--item .input-group__item .l-input:hover {
    z-index: 1
}

.l-color-picker__format--item .input-group__item:not(:first-child):not(:last-child) .l-input {
    border-radius: 0
}

.l-color-picker__format--item .input-group__item:first-child:not(:last-child) .l-input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.l-color-picker__format--item .input-group__item:last-child:not(:first-child) .l-input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.l-color-picker__format--item .input-group .l-input-number {
    width: 100%;
    padding: 0;
    max-width: 100%
}

.l-color-picker__format-mode-select {
    width: 72px;
    display: flex
}

.l-color-picker__format-mode-select .t-select,
.l-color-picker__format-mode-select .t-input {
    padding-right: 0
}

.l-color-picker__format-mode-select .t-input--prefix>.t-input__suffix {
    padding-left: 0
}

.l-color-picker__format-mode-select .t-select__right-icon {
    margin-right: var(--td-comp-margin-xs)
}

.l-color-picker__swatches-wrap {
    margin-top: var(--td-comp-margin-m);
    position: relative
}

.l-color-picker__swatches-wrap .l-color-picker__swatches+.l-color-picker__swatches {
    margin-top: var(--td-comp-margin-m)
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--title {
    font: var(--td-font-body-small);
    padding: 0;
    color: var(--td-text-color-primary);
    display: flex;
    align-items: center;
    justify-content: space-between
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    font-size: 0
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--actions .l-color-picker__icon {
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs);
    margin-left: var(--td-comp-margin-s)
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--items {
    width: 100%;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(10, var(--td-comp-size-xxxs));
    gap: calc(calc(256px - calc(calc(var(--td-pop-padding-xl) * 2) + calc(var(--td-comp-size-xxxs) * 10))) / 9) calc(calc(256px - calc(calc(var(--td-pop-padding-xl) * 2) + calc(var(--td-comp-size-xxxs) * 10))) / 9);
    max-height: calc(4 * calc(var(--td-comp-size-xxxs) + calc(calc(256px - calc(calc(var(--td-pop-padding-xl) * 2) + calc(var(--td-comp-size-xxxs) * 10))) / 9)));
    overflow-x: hidden;
    overflow-y: auto;
    padding: calc(var(--td-pop-padding-xl) - 8px);
    position: relative;
    left: calc(0px - calc(var(--td-pop-padding-xl) - 8px));
    box-sizing: content-box
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--item {
    display: flex;
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs);
    border-radius: var(--td-radius-default);
    padding: 0;
    overflow: hidden;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    position: relative;
    transform-origin: center;
    transition: all .2s cubic-bezier(.38, 0, .24, 1);
    box-sizing: border-box
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--item:hover {
    transform: scale(1.25);
    transform-origin: center
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--item__color {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--td-component-border);
    border-radius: var(--td-radius-default);
    flex-shrink: 0
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--item__inner {
    width: 100%;
    height: 100%;
    display: block
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--item:not(.l-is-active):hover {
    padding: 0
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--item.l-is-active .l-color-picker__swatches--item__color,
.l-color-picker__swatches-wrap .l-color-picker__swatches--item.l-is-active .l-color-picker__swatches--color {
    border-color: var(--td-text-color-brand)
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--color {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: var(--td-radius-default);
    box-sizing: border-box
}

.l-color-picker__swatches-wrap .l-color-picker__swatches--inner {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: var(--td-radius-default);
    box-shadow: var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left)
}

.l-color-picker__trigger--default {
    display: inline-flex;
    align-items: center
}

.l-color-picker__trigger--default>.l-input {
    width: fit-content
}

.l-color-picker__trigger--default .l-input {
    padding: 0 var(--td-comp-paddingLR-s) 0 var(--td-comp-paddingLR-xs)
}

.l-color-picker__trigger--default__color {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center
}

.l-color-picker__trigger--default__color .color-inner {
    border: 1px solid var(--td-scrollbar-color);
    display: block;
    width: calc(var(--td-comp-size-xs) - 2px);
    height: calc(var(--td-comp-size-xs) - 2px);
    color: transparent;
    position: relative;
    border-radius: var(--td-radius-small)
}

.l-color-picker__trigger--default__color .color-inner.l-size-s {
    width: calc(var(--td-comp-size-xxs) - 2px);
    height: calc(var(--td-comp-size-xxs) - 2px)
}

.l-color-picker__trigger--default__color .color-inner.l-size-l {
    width: calc(var(--td-comp-size-s) - 2px);
    height: calc(var(--td-comp-size-s) - 2px)
}

.l-color-picker__gradient-slider {
    padding: 0 calc(calc(var(--td-comp-size-xxxs) + var(--td-size-1)) / 2);
    border-radius: 4px
}

.l-color-picker__gradient-slider .l-color-picker--bg-alpha {
    background: var(--td-text-color-anti);
    background-image: linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5), linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5);
    background-size: 6px 6px;
    background-position: 0 0, 3px 3px
}

.l-color-picker__panel.l-is-disabled .l-color-picker__saturation,
.l-color-picker__panel.l-is-disabled .l-color-picker__slider,
.l-color-picker__panel.l-is-disabled .l-color-picker__swatches--item {
    opacity: .8;
    cursor: not-allowed
}

.l-color-picker__panel.l-is-disabled .l-color-picker__gradient-slider .gradient-thumbs,
.l-color-picker__panel.l-is-disabled .l-color-picker__gradient-slider .gradient-thumbs__item {
    cursor: not-allowed
}

.l-color-picker__panel.l-is-disabled .l-color-picker__swatches--item:hover {
    padding: 0
}

.l-color-picker__select-options>.l-popup__content {
    box-shadow: var(--td-shadow-1), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left)
}

.l-image__wrapper {
    position: relative;
    background: var(--td-bg-color-secondarycontainer);
    z-index: 1
}

.l-image__wrapper--shape-square {
    border-radius: 0
}

.l-image__wrapper--shape-round {
    border-radius: var(--td-radius-medium)
}

.l-image__wrapper--shape-circle {
    border-radius: 50%
}

.l-image__wrapper--gallery {
    border-radius: var(--td-radius-medium)
}

.l-image__wrapper--gallery .l-image {
    position: relative;
    z-index: 5
}

.l-image__wrapper--need-hover {
    cursor: pointer
}

.l-image {
    width: 100%;
    height: 100%;
    border-radius: inherit;
    position: relative;
    z-index: inherit
}

.l-image--fit-fill {
    object-fit: fill
}

.l-image--fit-contain {
    object-fit: contain
}

.l-image--fit-cover {
    object-fit: cover
}

.l-image--fit-scale-down {
    object-fit: scale-down
}

.l-image--fit-none {
    object-fit: none
}

.l-image--position-center {
    object-position: center
}

.l-image--position-bottom {
    object-position: bottom
}

.l-image--position-top {
    object-position: top
}

.l-image--position-left {
    object-position: left
}

.l-image--position-right {
    object-position: right
}

.l-image__gallery-shadow {
    position: absolute;
    left: 0;
    right: -24px;
    top: 24px;
    bottom: 24px;
    background: #eeeeee42;
    border-radius: var(--td-radius-medium);
    z-index: 3
}

.l-image__gallery-shadow:before,
.l-image__gallery-shadow:after {
    content: "";
    position: absolute;
    left: 0;
    border-radius: var(--td-radius-medium)
}

.l-image__gallery-shadow:after {
    top: -16px;
    right: 16px;
    bottom: -16px;
    background: #eeec;
    z-index: 4
}

.l-image__gallery-shadow:before {
    top: -8px;
    right: 8px;
    bottom: -8px;
    background: #eeeeee80;
    z-index: 2
}

.l-image__placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0
}

.l-image__overlay-content {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 6;
    opacity: 1;
    visibility: visible;
    transition: visibility 0s, opacity .2s linear
}

.l-image__overlay-content--hidden {
    visibility: hidden;
    opacity: 0
}

.l-image__loading,
.l-image__error {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1
}

.l-image__loading {
    color: var(--td-text-color-secondary)
}

.l-image__error {
    color: var(--td-text-color-disabled)
}

.l-avatar {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    display: inline-flex;
    background: var(--td-brand-color-focus);
    color: var(--td-text-color-brand);
    overflow: hidden;
    white-space: nowrap;
    vertical-align: middle;
    justify-content: center;
    align-items: center;
    box-sizing: content-box;
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    font-size: var(--td-font-size-body-large);
    line-height: var(--td-comp-size-m)
}

.l-avatar.l-avatar__icon {
    font-size: var(--td-comp-size-xxs)
}

.l-avatar--circle {
    border-radius: var(--td-radius-circle)
}

.l-avatar--round {
    border-radius: var(--td-radius-default)
}

.l-avatar.l-size-s {
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs);
    font-size: var(--td-font-size-body-medium);
    line-height: var(--td-comp-size-xs)
}

.l-avatar.l-size-s.l-avatar__icon {
    font-size: var(--td-comp-size-xxxs)
}

.l-avatar.l-size-l {
    width: var(--td-comp-size-xl);
    height: var(--td-comp-size-xl);
    font-size: var(--td-font-size-title-large);
    line-height: var(--td-comp-size-xl)
}

.l-avatar.l-size-l.l-avatar__icon {
    font-size: var(--td-comp-size-xs)
}

.l-avatar>.l-image__wrapper {
    max-width: 100%;
    max-height: 100%
}

.l-avatar-group {
    display: inline-flex;
    align-items: center
}

.l-avatar-group .l-avatar {
    border: 2px solid var(--td-bg-color-container)
}

.l-avatar-group.l-avatar--offset-right .l-avatar:not(:last-child) {
    margin-right: calc(0px - var(--td-size-3))
}

.l-avatar-group.l-avatar--offset-right .l-avatar:not(:last-child).l-size-s {
    margin-right: calc(0px - var(--td-size-2))
}

.l-avatar-group.l-avatar--offset-right .l-avatar:not(:last-child).l-size-l {
    margin-right: calc(0px - var(--td-size-4))
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(1) {
    z-index: 49
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(2) {
    z-index: 48
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(3) {
    z-index: 47
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(4) {
    z-index: 46
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(5) {
    z-index: 45
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(6) {
    z-index: 44
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(7) {
    z-index: 43
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(8) {
    z-index: 42
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(9) {
    z-index: 41
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(10) {
    z-index: 40
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(11) {
    z-index: 39
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(12) {
    z-index: 38
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(13) {
    z-index: 37
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(14) {
    z-index: 36
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(15) {
    z-index: 35
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(16) {
    z-index: 34
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(17) {
    z-index: 33
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(18) {
    z-index: 32
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(19) {
    z-index: 31
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(20) {
    z-index: 30
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(21) {
    z-index: 29
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(22) {
    z-index: 28
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(23) {
    z-index: 27
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(24) {
    z-index: 26
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(25) {
    z-index: 25
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(26) {
    z-index: 24
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(27) {
    z-index: 23
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(28) {
    z-index: 22
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(29) {
    z-index: 21
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(30) {
    z-index: 20
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(31) {
    z-index: 19
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(32) {
    z-index: 18
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(33) {
    z-index: 17
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(34) {
    z-index: 16
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(35) {
    z-index: 15
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(36) {
    z-index: 14
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(37) {
    z-index: 13
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(38) {
    z-index: 12
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(39) {
    z-index: 11
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(40) {
    z-index: 10
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(41) {
    z-index: 9
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(42) {
    z-index: 8
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(43) {
    z-index: 7
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(44) {
    z-index: 6
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(45) {
    z-index: 5
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(46) {
    z-index: 4
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(47) {
    z-index: 3
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(48) {
    z-index: 2
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(49) {
    z-index: 1
}

.l-avatar-group.l-avatar--offset-left .l-avatar:nth-child(50) {
    z-index: 0
}

.l-avatar-group.l-avatar--offset-left .l-avatar:not(:first-child) {
    margin-left: calc(0px - var(--td-size-3))
}

.l-avatar-group.l-avatar--offset-left .l-avatar:not(:first-child).l-size-s {
    margin-left: calc(0px - var(--td-size-2))
}

.l-avatar-group.l-avatar--offset-left .l-avatar:not(:first-child).l-size-l {
    margin-left: calc(0px - var(--td-size-4))
}

.l-badge {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    display: inline-block
}

.l-badge--dot,
.l-badge--circle,
.l-badge--round {
    position: absolute;
    top: 0;
    right: 0;
    color: var(--td-text-color-anti);
    text-align: center;
    font: var(--td-font-body-small);
    transform: translate(50%, -50%);
    transform-origin: 100% 0;
    box-sizing: content-box
}

.l-badge--static {
    position: static;
    display: inline-block;
    transform: none
}

.l-badge--dot {
    right: 1px;
    margin-top: 1px;
    width: 6px;
    height: 6px;
    border-radius: var(--td-radius-circle);
    background-color: var(--td-error-color)
}

.l-badge--circle,
.l-badge--round {
    padding-right: calc((var(--td-comp-size-xxs) - 8px) / 2);
    padding-left: calc((var(--td-comp-size-xxs) - 8px) / 2);
    min-width: 8px;
    height: var(--td-comp-size-xxs);
    background-color: var(--td-error-color);
    line-height: var(--td-comp-size-xxs)
}

.l-badge--circle.l-size-s,
.l-badge--round.l-size-s {
    padding-right: calc((var(--td-comp-size-xxxs) - 8px) / 2);
    padding-left: calc((var(--td-comp-size-xxxs) - 8px) / 2);
    min-width: 8px;
    height: var(--td-comp-size-xxxs);
    line-height: var(--td-comp-size-xxxs)
}

.l-badge--circle {
    border-radius: calc(var(--td-comp-size-xxs) / 2)
}

.l-badge--round {
    border-radius: var(--td-radius-default)
}

.l-calendar {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid var(--td-border-level-1-color);
    background-color: var(--td-bg-color-container);
    border-radius: var(--td-radius-large)
}

.l-calendar .l-is-disabled.l-calendar__table-body-cell:hover {
    cursor: not-allowed
}

.l-calendar .l-is-disabled .l-calendar__table-body-cell-display {
    color: var(--td-text-color-disabled)
}

.l-calendar .l-is-disabled .l-calendar__table-body-cell-display:hover {
    box-shadow: none
}

.l-calendar--full {
    min-width: 560px;
    padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl)
}

.l-calendar--full .l-calendar__control {
    padding: 0
}

.l-calendar--full .l-calendar__title {
    font: var(--td-font-title-large);
    flex: 1
}

.l-calendar--full .l-calendar__panel {
    position: relative;
    margin-top: var(--td-comp-margin-xxxl)
}

.l-calendar--full .l-calendar__panel-title {
    font: var(--td-font-title-large);
    color: var(--td-text-color-primary);
    position: absolute
}

.l-calendar--full .l-calendar__table-head-cell,
.l-calendar--full .l-calendar__table-body-cell {
    margin-right: var(--td-comp-margin-s);
    position: relative
}

.l-calendar--full .l-calendar__table-body-cell {
    border-top: 2px solid var(--td-border-level-1-color);
    padding: 0;
    height: 104px;
    line-height: var(--td-line-height-body-medium);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    margin-left: 0;
    transition-duration: .2s;
    transition-property: border-top, background;
    transition-timing-function: linear
}

.l-calendar--full .l-calendar__table-body-cell-content {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-xs);
    width: 100%;
    box-sizing: border-box
}

.l-calendar--full .l-calendar__table-body-cell.l-is-checked,
.l-calendar--full .l-calendar__table-body-cell.l-is-checked:hover {
    background-color: var(--td-brand-color-light)
}

.l-calendar--full .l-calendar__table-body-cell--now {
    border-top: 2px solid var(--td-brand-color)
}

.l-calendar--full .l-calendar__table-body-cell--now .l-calendar__table-body-cell-display {
    color: var(--td-text-color-primary)
}

.l-calendar--full .l-calendar__footer {
    height: 90px;
    padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl);
    border-top: 1px solid var(--td-border-level-1-color)
}

.l-calendar--card {
    width: 280px;
    border-radius: var(--td-radius-medium);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m)
}

.l-calendar--card .l-calendar__control {
    padding: 0
}

.l-calendar--card .l-calendar__control-section {
    width: 100%;
    justify-content: flex-start
}

.l-calendar--card .l-calendar__control-section-cell:last-child {
    flex: 1;
    text-align: right;
    display: block
}

.l-calendar--card .l-calendar__panel.l-calendar__panel--month {
    height: 200px;
    margin-top: var(--td-comp-margin-m)
}

.l-calendar--card .l-calendar__panel.l-calendar__panel--year {
    height: 168px;
    margin-top: var(--td-comp-margin-m)
}

.l-calendar--card .l-calendar__panel.l-calendar__panel--year .l-calendar__table-body-cell-display {
    min-width: var(--td-comp-size-xxl)
}

.l-calendar--card .l-calendar__table {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-self: start;
    align-items: flex-start
}

.l-calendar--card .l-calendar__table-head-row,
.l-calendar--card .l-calendar__table-body-row {
    flex: 1;
    background: var(--td-bg-color-container)
}

.l-calendar--card .l-calendar__table-head-cell,
.l-calendar--card .l-calendar__table-body-cell {
    width: 100%;
    height: 100%;
    justify-content: center;
    font: var(--td-font-body-medium);
    box-sizing: border-box
}

.l-calendar--card .l-calendar__table-head-cell-display,
.l-calendar--card .l-calendar__table-body-cell-display {
    width: var(--td-comp-size-xs);
    line-height: var(--td-comp-size-xs)
}

.l-calendar--card .l-calendar__table-body {
    display: flex;
    flex-direction: column;
    justify-self: center;
    align-items: center;
    flex: 1
}

.l-calendar--card .l-calendar__table-body-cell {
    justify-content: center;
    align-items: center
}

.l-calendar--card .l-calendar__table-body-cell:hover {
    background-color: var(--td-bg-color-container)
}

.l-calendar--card .l-calendar__table-body-cell-display {
    font: var(--td-font-body-medium);
    padding-top: calc(var(--td-comp-paddingTB-xxs) / 2);
    padding-bottom: calc(var(--td-comp-paddingTB-xxs) / 2);
    text-align: center;
    border-radius: var(--td-radius-default);
    transition: all .2s linear
}

.l-calendar--card .l-calendar__table-body-cell-display:hover {
    box-shadow: inset 0 0 0 1px var(--td-brand-color);
    transition: box-shadow .2s linear
}

.l-calendar--card .l-calendar__table-body-cell--now .l-calendar__table-body-cell-display {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light);
    position: relative
}

.l-calendar--card .l-is-checked .l-calendar__table-body-cell-display {
    background: var(--td-brand-color);
    border-radius: var(--td-radius-default);
    color: var(--td-text-color-anti)
}

.l-calendar--card .l-calendar__footer {
    height: var(--td-comp-size-xxl);
    padding: 0 var(--td-comp-paddingLR-m);
    border-top: 1px solid var(--td-border-level-1-color)
}

.l-calendar__control {
    display: flex;
    justify-content: flex-end;
    align-items: center
}

.l-calendar__control-section {
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center
}

.l-calendar__control-section:last-child {
    margin-right: 0
}

.l-calendar__control-section-cell {
    height: 100%;
    margin-right: var(--td-comp-margin-s);
    display: flex
}

.l-calendar__control-section-cell .l-radio-group {
    vertical-align: bottom
}

.l-calendar__control-section-cell .l-select {
    display: inline
}

.l-calendar__control-section-cell:last-child {
    margin-right: 0
}

.l-calendar__panel {
    box-sizing: border-box;
    width: 100%
}

.l-calendar__table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    height: 100%
}

.l-calendar__table-head,
.l-calendar__table-body {
    width: 100%
}

.l-calendar__table-head-row,
.l-calendar__table-body-row {
    width: 100%;
    display: flex
}

.l-calendar__table-head-cell,
.l-calendar__table-body-cell {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    font: var(--td-font-title-small);
    color: var(--td-text-color-primary);
    cursor: default;
    padding: 0
}

.l-calendar__table-head-cell:last-child,
.l-calendar__table-body-cell:last-child {
    margin-right: 0
}

.l-calendar__table-head {
    margin-bottom: var(--td-comp-margin-s);
    display: block
}

.l-calendar__table-head-row {
    padding-bottom: 0;
    background: var(--td-bg-color-container)
}

.l-calendar__table-head-cell {
    height: 100%;
    font: var(--td-font-title-small);
    color: var(--td-text-color-secondary)
}

.l-calendar__table-body-cell {
    cursor: pointer
}

.l-calendar__table-body-cell:hover {
    background-color: var(--td-bg-color-container-hover);
    transition: background-color .2s linear
}

.l-calendar__table-body-cell-display {
    font: var(--td-font-title-small);
    color: var(--td-text-color-primary)
}

.l-card {
    font: var(--td-font-body-medium);
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    box-sizing: border-box;
    border-radius: var(--td-radius-medium);
    background-color: var(--td-bg-color-container);
    color: var(--td-text-color-primary);
    transition: box-shadow .2s cubic-bezier(.38, 0, .24, 1)
}

.l-card--bordered {
    border: 1px solid var(--td-component-border)
}

.l-card--shadow-hover:hover,
.l-card--shadow {
    box-shadow: var(--td-shadow-1)
}

.l-card__cover {
    display: flow-root
}

.l-card__cover img {
    display: flow-root;
    width: 100%;
    max-height: 100%;
    border-radius: var(--td-radius-default) var(--td-radius-default) 0 0
}

.l-card__body {
    display: flow-root;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl)
}

.l-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl);
    position: relative
}

.l-card__header-wrapper {
    flex: 1;
    display: flex;
    align-items: center
}

.l-card__header+.l-card__cover img {
    border-radius: 0
}

.l-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl)
}

.l-card__footer-wrapper {
    flex: 1
}

.l-size-s .l-card__body,
.l-size-s .l-card__header,
.l-size-s .l-card__footer {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-l)
}

.l-card__avatar {
    margin-right: var(--td-comp-margin-l);
    width: var(--td-comp-size-xxxl);
    height: var(--td-comp-size-xxxl)
}

.l-card__title {
    font: var(--td-font-title-medium);
    color: var(--td-text-color-primary);
    margin-right: var(--td-comp-margin-l);
    word-break: break-all
}

.l-card__subtitle {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    word-break: break-all
}

.l-card__description {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    margin-top: var(--td-comp-margin-xs);
    word-break: break-all
}

.l-card__actions {
    float: right;
    color: var(--td-brand-color)
}

.l-card__title--bordered {
    border-bottom: 1px solid var(--td-component-border)
}

.l-comment {
    font: var(--td-font-body-medium);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    color: var(--td-text-color-primary)
}

.l-comment__inner {
    display: flex
}

.l-comment__avatar {
    flex-shrink: 0;
    margin-right: var(--td-comp-margin-xxl);
    cursor: pointer;
    display: flex
}

.l-comment__avatar-image {
    width: var(--td-comp-size-xxxl);
    height: var(--td-comp-size-xxxl);
    border-radius: var(--td-radius-circle)
}

.l-comment__content {
    flex: auto;
    font: var(--td-font-body-medium)
}

.l-comment__author {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: baseline;
    margin-bottom: var(--td-comp-margin-s)
}

.l-comment__name {
    display: inline-flex;
    align-items: center;
    font: var(--td-font-title-medium);
    padding-right: var(--td-comp-paddingLR-s);
    cursor: pointer
}

.l-comment__time {
    font: var(--td-font-body-small);
    padding-right: var(--td-comp-paddingLR-s);
    color: var(--td-text-color-placeholder)
}

.l-comment__detail {
    word-break: break-all;
    font: var(--td-font-body-medium)
}

.l-comment__quote {
    margin-top: var(--td-comp-margin-l);
    border-left: 4px solid var(--td-component-stroke);
    padding-left: var(--td-comp-margin-l)
}

.l-comment__quote .l-comment__name,
.l-comment__quote .l-comment__detail {
    color: var(--td-text-color-secondary)
}

.l-comment__actions {
    margin-top: var(--td-comp-margin-s);
    display: flex;
    justify-content: flex-end;
    list-style: none;
    padding: 0;
    gap: var(--td-comp-margin-s)
}

.l-comment__actions .l-button--variant-text {
    color: var(--td-text-color-placeholder)
}

.l-comment__actions .l-button--variant-text .l-button__text {
    gap: var(--td-comp-margin-s)
}

.l-comment__reply {
    margin-top: var(--td-comp-margin-l);
    margin-left: calc(var(--td-comp-size-xxxl) + var(--td-comp-margin-xxl));
    background-color: var(--td-bg-color-secondarycontainer);
    border-radius: var(--td-radius-medium);
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl)
}

.l-comment__reply .l-button--variant-text {
    color: var(--td-text-color-placeholder)
}

.l-comment__reply .l-button--variant-text:hover {
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-comment__reply .l-button--variant-text .l-button__text {
    gap: var(--td-comp-margin-s)
}

.l-empty {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    list-style: none;
    padding: 0;
    text-align: center
}

.l-empty__image {
    font-size: 48px;
    display: flex;
    justify-content: center
}

.l-empty__title {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    margin-top: var(--td-comp-margin-s);
    margin-bottom: 0
}

.l-empty__description {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-placeholder);
    margin-top: var(--td-comp-margin-xs);
    margin-bottom: 0
}

.l-empty__action {
    margin-top: var(--td-comp-margin-xxl);
    margin-bottom: 0
}

.l-empty.l-size-s .l-empty__image {
    font-size: 20px
}

.l-empty.l-size-s .l-empty__title,
.l-empty.l-size-s .l-empty__description {
    font: var(--td-font-body-small);
    margin-top: var(--td-comp-margin-xxs)
}

.l-empty.l-size-l .l-empty__image {
    font-size: 64px
}

@keyframes tDialogZoomIn {
    0% {
        opacity: 0;
        transform: scale(.01)
    }

    to {
        opacity: 1
    }
}

@keyframes tDialogZoomOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: scale(.01)
    }
}

@keyframes tDialogMaskIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes tDialogMaskOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.l-dialog-zoom .animation-enter {
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(0, 0, .15, 1);
    animation-play-state: paused
}

.l-dialog-zoom .animation-exit {
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.38, 0, .24, 1);
    animation-play-state: paused
}

.l-dialog-zoom .animation-active {
    animation-play-state: running;
    animation-fill-mode: both
}

.l-dialog-zoom-enter,
.l-dialog-zoom-enter-from,
.l-dialog-zoom-appear {
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(0, 0, .15, 1);
    animation-play-state: paused
}

.l-dialog-zoom-exit {
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.38, 0, .24, 1);
    animation-play-state: paused
}

.l-dialog-zoom-enter-active,
.l-dialog-zoom-appear-active {
    animation-name: tDialogZoomIn;
    animation-play-state: running;
    animation-fill-mode: both
}

.l-dialog-zoom-exit-active {
    animation-name: tDialogZoomOut;
    animation-play-state: running;
    animation-fill-mode: both
}

.l-dialog-zoom__vue-enter-active .l-dialog {
    animation-name: tDialogZoomIn;
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(0, 0, .15, 1);
    animation-play-state: paused
}

.l-dialog-zoom__vue-enter-active .l-dialog__mask {
    animation-name: tDialogMaskIn;
    animation-duration: .2s;
    animation-timing-function: linear;
    animation-play-state: running;
    animation-fill-mode: both
}

.l-dialog-zoom__vue-leave-active .l-dialog {
    animation-name: tDialogZoomOut;
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.38, 0, .24, 1);
    animation-play-state: paused
}

.l-dialog-zoom__vue-leave-active .l-dialog__mask {
    animation-name: tDialogMaskOut;
    animation-duration: .2s;
    animation-timing-function: linear;
    animation-play-state: running;
    animation-fill-mode: both
}

.l-dialog-zoom__vue-enter-to .l-dialog,
.l-dialog-zoom__vue-leave-to .l-dialog {
    animation-play-state: running;
    animation-fill-mode: both
}

.l-dialog-fade-enter,
.l-dialog-fade-appear {
    opacity: 0;
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(0, 0, .15, 1);
    animation-play-state: paused
}

.l-dialog-fade-exit {
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(0, 0, .15, 1);
    animation-play-state: paused
}

.l-dialog-fade-enter.l-dialog-fade-enter-active,
.l-dialog-fade-appear.l-dialog-fade-appear-active {
    animation-name: tDialogFadeIn;
    animation-play-state: running
}

.l-dialog-fade-exit.l-dialog-fade-exit-active {
    animation-name: tDialogFadeOut;
    animation-play-state: running
}

@keyframes tDialogFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes tDialogFadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.l-dialog {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 480px;
    background-color: var(--td-bg-color-container);
    position: relative;
    border: 1px solid var(--td-border-level-1-color);
    border-radius: var(--td-radius-large)
}

.l-dialog .l-icon.l-is-info {
    color: var(--td-brand-color)
}

.l-dialog .l-icon.l-is-success {
    color: var(--td-success-color)
}

.l-dialog .l-icon.l-is-warning {
    color: var(--td-warning-color)
}

.l-dialog .l-icon.l-is-error {
    color: var(--td-error-color)
}

.l-dialog--lock {
    overflow: hidden
}

.l-dialog__header {
    color: var(--td-text-color-primary);
    font: var(--td-font-title-medium);
    font-weight: 600;
    display: flex;
    align-items: center;
    word-break: break-word;
    gap: var(--td-comp-margin-s);
    box-sizing: border-box
}

.l-dialog__header .l-dialog__header-content {
    display: flex;
    align-items: flex-start;
    width: 100%
}

.l-dialog__header .l-icon:not(.l-icon-close) {
    font-size: calc(var(--td-font-size-body-large) + 8px);
    display: inline-flex;
    align-items: center;
    margin-right: var(--td-comp-margin-s);
    flex-shrink: 0
}

.l-dialog__header--fullscreen {
    background-color: var(--td-bg-color-secondarycontainer);
    min-height: var(--td-comp-size-xxxl);
    justify-content: flex-end;
    display: flex;
    align-items: center;
    flex-direction: row;
    padding: 0 var(--td-comp-paddingLR-xxl)
}

.l-dialog__header--fullscreen .l-dialog__header-content {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center
}

.l-dialog__body {
    color: var(--td-text-color-secondary);
    font: var(--td-font-body-medium);
    overflow: auto;
    padding: var(--td-comp-paddingTB-l) 0;
    word-break: break-word
}

@-moz-document url-prefix() {
    .l-dialog__body {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-dialog__body::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-dialog__body::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-dialog__body::-webkit-scrollbar-thumb:vertical:hover,
.l-dialog__body::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-dialog__body__icon,
.l-dialog__body--icon {
    padding: var(--td-comp-paddingTB-l) 0
}

.l-dialog__body--fullscreen {
    box-sizing: border-box;
    padding: var(--td-comp-paddingTB-xl) var(--td-comp-paddingLR-xxl);
    height: calc(100% - var(--td-comp-size-xxxl) - var(--td-comp-size-xxxxl));
    overflow: auto
}

@-moz-document url-prefix() {
    .l-dialog__body--fullscreen {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-dialog__body--fullscreen::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-dialog__body--fullscreen::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-dialog__body--fullscreen::-webkit-scrollbar-thumb:vertical:hover,
.l-dialog__body--fullscreen::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-dialog__body--fullscreen--without-footer {
    box-sizing: border-box;
    padding: var(--td-comp-paddingTB-xl) var(--td-comp-paddingLR-xxl);
    height: calc(100% - var(--td-comp-size-xxxl));
    overflow: auto
}

.l-dialog__footer {
    width: 100%;
    text-align: right;
    padding: var(--td-comp-paddingTB-l) 0 0
}

.l-dialog__footer .l-button+.l-button {
    margin-left: var(--td-comp-margin-s)
}

.l-dialog__footer--fullscreen {
    min-height: var(--td-comp-size-xxxxl);
    padding: 0 var(--td-comp-paddingLR-xxl) var(--td-comp-paddingTB-xxl);
    box-sizing: border-box
}

.l-dialog--default {
    padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl)
}

.l-dialog__close {
    font-size: calc(var(--td-font-size-body-large) + 4px);
    color: var(--td-text-color-secondary);
    display: flex;
    width: calc(var(--td-font-size-body-large) + 4px);
    height: calc(var(--td-font-size-body-large) + 4px);
    align-items: center;
    border-radius: var(--td-radius-default);
    transition: all .2s linear;
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs)
}

.l-dialog__close:hover {
    cursor: pointer;
    background: var(--td-bg-color-container-hover)
}

.l-dialog__close:active {
    background: var(--td-bg-color-container-active)
}

.l-dialog__close--fullscreen {
    display: flex;
    background: transparent
}

.l-dialog__close--fullscreen:hover {
    cursor: pointer;
    background: var(--td-bg-color-secondarycontainer-hover)
}

.l-dialog__close--fullscreen:active {
    background: var(--td-bg-color-secondarycontainer-active)
}

.l-dialog.l-dialog--draggable:hover {
    cursor: move
}

.l-dialog.l-dialog--draggable .l-dialog__header:hover,
.l-dialog.l-dialog--draggable .l-dialog__body:hover,
.l-dialog.l-dialog--draggable .l-dialog__footer:hover {
    cursor: auto
}

.l-dialog__fullscreen {
    width: 100%;
    border-radius: 0
}

.l-dialog__ctx {
    pointer-events: auto;
    outline: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.l-dialog__ctx.l-dialog__ctx--modeless {
    pointer-events: none
}

.l-dialog__ctx.l-dialog__ctx--fixed {
    position: fixed;
    z-index: 2500
}

.l-dialog__ctx.l-dialog__ctx--absolute,
.l-dialog__ctx.l-dialog__ctx--absolute .l-dialog__mask,
.l-dialog__ctx.l-dialog__ctx--absolute .l-dialog__wrap {
    position: absolute
}

.l-dialog__ctx.l-is-visible {
    visibility: visible
}

.l-dialog__ctx.l-is-hidden {
    visibility: hidden
}

.l-dialog__ctx.l-is-display {
    display: block
}

.l-dialog__ctx.l-not-display {
    display: none
}

.l-dialog__ctx .l-dialog__mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: var(--td-mask-active);
    pointer-events: auto
}

.l-dialog__ctx .l-dialog__wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: auto
}

@-moz-document url-prefix() {
    .l-dialog__ctx .l-dialog__wrap {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-dialog__ctx .l-dialog__wrap::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.l-dialog__ctx .l-dialog__wrap::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.l-dialog__ctx .l-dialog__wrap::-webkit-scrollbar-thumb:vertical:hover,
.l-dialog__ctx .l-dialog__wrap::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-dialog__ctx .l-dialog__position {
    display: flex;
    justify-content: center;
    min-height: 100%;
    width: 100%;
    position: relative;
    padding: 48px 0;
    box-sizing: border-box
}

.l-dialog__ctx .l-dialog__position.l-dialog--top {
    align-items: flex-start;
    padding-top: 20vh
}

.l-dialog__ctx .l-dialog__position.l-dialog--center {
    align-items: center
}

.l-dialog__ctx .l-dialog__position_fullscreen {
    display: flex;
    justify-content: center;
    min-height: 100%;
    width: 100%;
    position: relative;
    box-sizing: border-box
}

.l-dialog__ctx .l-is-hidden {
    background: none
}

.l-dialog__ctx .l-dialog {
    pointer-events: auto;
    z-index: 2500
}

.l-dialog__ctx.l-dialog__ctx--modeless .l-dialog {
    box-shadow: var(--td-shadow-3)
}

.l-image-viewer__img-error {
    height: 440px;
    width: 440px;
    background-color: var(--td-bg-color-component-disabled);
    border-radius: 4px;
    color: #000;
    cursor: inherit;
    position: absolute
}

.l-image-viewer__img-error .l-image-viewer__img-error-content {
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
    font: var(--td-font-body-medium)
}

.l-image-viewer__img-error .l-image-viewer__img-error-content .l-image-viewer__img-error-text {
    margin-top: var(--td-comp-margin-s)
}

@keyframes modal-image-hide {
    0% {
        transform: scale(1)
    }

    to {
        transform: scale(0)
    }
}

@keyframes modal-mask-show {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes modal-mask-hide {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.l-image-viewer-preview-image {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3000;
    overflow: hidden;
    animation: .2s cubic-bezier(.82, 0, 1, .9) modal-mask-show
}

.l-image-viewer-preview-image.l-is-hide {
    animation: .2s cubic-bezier(0, 0, .15, 1) modal-mask-hide
}

.l-image-viewer-preview-image.l-is-hide .l-image-viewer__modal-pic .l-image-viewer__modal-box {
    animation: .2s cubic-bezier(0, 0, .15, 1) modal-image-hide
}

.l-image-viewer-preview-image .l-image-viewer__modal-index {
    text-align: center;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-anti);
    position: absolute;
    top: 92px;
    left: 50%;
    transform: translate(-50%);
    background: #0006;
    border-radius: var(--td-radius-default);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-s);
    z-index: 1
}

.l-image-viewer-preview-image .l-image-viewer__modal-mask {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: var(--td-mask-active);
    height: 100%;
    width: 100%;
    transition: all .2s ease;
    opacity: 1
}

.l-image-viewer-preview-image .l-image-viewer__modal-pic {
    height: 0;
    width: 0;
    position: absolute;
    top: 50%;
    left: 50%
}

.l-image-viewer-preview-image .l-image-viewer__modal-pic .l-image-viewer__modal-box {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    animation: .2s cubic-bezier(.38, 0, .24, 1) modal-image-show
}

.l-image-viewer-preview-image .l-image-viewer__modal-pic .l-image-viewer__modal-box .l-image-viewer__modal-image {
    display: block;
    max-width: min(90vw, 1000px);
    max-height: min(90vh, 800px);
    transition: all .2s cubic-bezier(.38, 0, .24, 1);
    transform: rotate(0);
    object-fit: contain
}

.l-image-viewer-preview-image .l-image-viewer__modal-header {
    width: 100%;
    position: absolute;
    top: 0;
    z-index: 1;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--td-bg-color-container);
    padding: 0 0 12px
}

.l-image-viewer-preview-image .l-image-viewer__modal-header.l-is-show {
    padding: 12px 0
}

@keyframes preview-icon-range {
    0% {
        transform: translate(-50%, 50%) rotate(0)
    }

    to {
        transform: translate(-50%, 50%) rotate(-180deg)
    }
}

@keyframes preview-icon-unrange {
    0% {
        transform: translate(-50%, 50%) rotate(-180deg)
    }

    to {
        transform: translate(-50%, 50%) rotate(0)
    }
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-pre-bt {
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 50%);
    background-color: var(--td-bg-color-container);
    color: var(--td-text-color-primary);
    border-radius: 50%;
    box-shadow: var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left);
    animation: .2s cubic-bezier(.38, 0, .24, 1) 0s 1 normal forwards running preview-icon-unrange
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-pre-bt .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-pre-bt:hover {
    background-color: inherit
}

@keyframes preview-image-show {
    0% {
        height: 0
    }

    to {
        height: 40px
    }
}

@keyframes preview-image-hide {
    0% {
        height: 40px
    }

    to {
        height: 0
    }
}

.l-image-viewer-preview-image .l-image-viewer__modal-header.l-is-show .l-image-viewer__header-prev {
    animation: .2s cubic-bezier(.38, 0, .24, 1) 0s 1 normal forwards running preview-image-show
}

.l-image-viewer-preview-image .l-image-viewer__modal-header.l-is-show .l-image-viewer__header-pre-bt {
    animation: .2s cubic-bezier(.38, 0, .24, 1) 0s 1 normal forwards running preview-icon-range
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-prev {
    width: calc(40px / 9 * 16 * 7 + 4px * 6);
    animation: .2s cubic-bezier(.38, 0, .24, 1) 0s 1 normal forwards running preview-image-hide;
    display: flex;
    position: relative;
    overflow: hidden
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-prev:before,
.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-prev:after {
    content: "";
    position: absolute;
    height: 100%;
    z-index: 1;
    width: calc(40px / 9 * 16);
    pointer-events: none
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-prev:before {
    left: 0;
    background-image: linear-gradient(to right, var(--td-bg-color-container), rgba(255, 255, 255, 0))
}

.l-image-viewer-preview-image .l-image-viewer__modal-header .l-image-viewer__header-prev:after {
    right: 0;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0), var(--td-bg-color-container))
}

.l-image-viewer-preview-image .l-image-viewer__header-trans {
    height: 100%;
    transition: transform .2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin-left: calc(40px / 9 * 16 * 3 + 4px * 3)
}

.l-image-viewer-preview-image .l-image-viewer__header-box {
    box-sizing: border-box;
    width: calc(40px / 9 * 16);
    height: 40px;
    position: relative;
    transition: .2s;
    overflow: hidden;
    border-radius: var(--td-radius-default);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-image-viewer-preview-image .l-image-viewer__header-box .l-image-viewer__header-img {
    width: auto;
    height: 100%
}

.l-image-viewer-preview-image .l-image-viewer__header-box:hover,
.l-image-viewer-preview-image .l-image-viewer__header-box.l-is-active {
    border-color: var(--td-brand-color)
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon {
    cursor: pointer;
    color: var(--td-text-color-primary);
    border-radius: var(--td-radius-default);
    transition: .2s
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-close-bt {
    top: 100px;
    right: 40px
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-next-bt,
.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-prev-bt {
    top: 50%;
    transform: translateY(-50%)
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-prev-bt {
    left: 40px
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-next-bt {
    right: 40px
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-close-bt,
.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-prev-bt,
.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-image-viewer__modal-next-bt {
    position: fixed;
    z-index: 10;
    color: var(--td-text-color-anti);
    background-color: #0006;
    border-radius: 50%;
    width: var(--td-comp-size-xl);
    height: var(--td-comp-size-xl);
    display: flex;
    justify-content: center;
    align-items: center
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon .l-image-viewer__modal-icon-label {
    margin-left: 2px
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-is-disabled {
    color: #ffffff38
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon.l-is-disabled:hover {
    background-color: #0006
}

.l-image-viewer-preview-image .l-image-viewer__modal-icon:hover {
    background-color: #0003
}

.l-image-viewer__mask {
    width: 100vh;
    height: 100vh;
    left: 0;
    top: 0;
    z-index: 99;
    position: fixed;
    background-color: transparent
}

.l-image-viewer__utils {
    width: 100%;
    position: absolute;
    bottom: 32px;
    z-index: 1;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--td-text-color-primary);
    -webkit-user-select: none;
    user-select: none
}

.l-image-viewer__utils .l-image-viewer__utils-content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    line-height: 100%;
    background: var(--td-bg-color-container);
    border-radius: var(--td-radius-medium);
    padding: 0 var(--td-comp-paddingLR-xs)
}

.l-image-viewer__utils .l-image-viewer__utils-content .l-image-viewer__modal-icon {
    margin: 0 var(--td-comp-margin-xs);
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--td-radius-default);
    transition: .2s
}

.l-image-viewer__utils .l-image-viewer__utils-content .l-image-viewer__modal-icon:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-image-viewer__utils .l-image-viewer__utils-content .l-image-viewer__utils-scale {
    width: var(--td-comp-size-xl);
    text-align: center;
    cursor: inherit
}

.l-image-viewer__utils .l-image-viewer__utils-content .l-image-viewer__utils-scale:hover {
    background-color: var(--td-bg-color-container)
}

.l-image-viewer-mini__footer .l-image-viewer__utils {
    position: inherit
}

.l-image-viewer-mini__content {
    max-width: min(90vw, 1000px);
    max-height: min(90vh, 800px)
}

@keyframes modal-image-show {
    0% {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

.l-image-viewer-mini__content .l-image-viewer__modal-pic .l-image-viewer__modal-box {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.l-image-viewer-mini__content .l-image-viewer__modal-pic .l-image-viewer__modal-box .l-image-viewer__modal-image {
    display: block;
    max-width: min(80vw, 800px);
    max-height: min(80vh, 600px);
    transition: all .2s ease;
    transform: rotate(0);
    object-fit: contain
}

.l-image-viewer__dialog.l-dialog__ctx--fixed {
    z-index: 3000
}

.l-image-viewer__dialog .l-dialog__header {
    padding: 0 var(--td-comp-paddingLR-s);
    pointer-events: none
}

.l-image-viewer__dialog .l-dialog__header .l-image-viewer__dialog-title {
    pointer-events: all
}

.l-image-viewer__dialog .l-dialog__header .l-dialog__close {
    pointer-events: auto
}

.l-image-viewer__dialog .l-dialog {
    border-color: var(--td-component-border);
    overflow: hidden;
    padding: 0;
    box-shadow: var(--td-shadow-3)
}

.l-image-viewer__dialog .l-dialog__header {
    height: 40px;
    width: 100%;
    font-size: var(--td-font-size-body-medium);
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-image-viewer__dialog .l-dialog__header-content {
    margin-left: 32px;
    justify-content: center
}

.l-image-viewer__dialog .l-dialog__close:hover {
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-list {
    font: var(--td-font-body-medium);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: auto;
    color: var(--td-text-color-primary);
    background: var(--td-bg-color-container)
}

@-moz-document url-prefix() {
    .l-list {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-list::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-list::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-list::-webkit-scrollbar-thumb:vertical:hover,
.l-list::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-list__inner {
    list-style: none;
    padding: 0;
    margin: 0
}

.l-list-item {
    font: var(--td-font-body-medium);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l);
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative
}

.l-list-item:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px
}

.l-list-item-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex: 1
}

.l-list-item__meta {
    display: flex
}

.l-list-item__meta-avatar {
    width: var(--td-comp-size-xxxl);
    height: var(--td-comp-size-xxxl);
    border-radius: calc(var(--td-comp-size-xxxl) / 2);
    overflow: hidden;
    background: var(--td-bg-color-page);
    margin-right: var(--td-comp-margin-l);
    flex-shrink: 0
}

.l-list-item__meta-avatar img {
    max-width: 100%;
    width: 100%;
    height: 100%
}

.l-list-item__meta-title {
    padding: 0;
    font: var(--td-font-title-medium);
    margin: 0 0 var(--td-comp-margin-s);
    color: var(--td-text-color-primary)
}

.l-list-item__meta-description {
    margin-right: var(--td-comp-margin-xxl);
    color: var(--td-text-color-primary)
}

.l-list-item__action {
    list-style: none;
    padding: 0;
    flex-shrink: 0
}

.l-list-item__action>li {
    display: inline-block
}

.l-list-item__action>li:not(:last-child) {
    margin-right: var(--td-comp-margin-l)
}

.l-list-item__action>li .l-icon {
    color: var(--td-text-color-secondary);
    font-size: var(--td-comp-size-xxxs)
}

.l-list-item__action>li .l-icon:hover {
    color: var(--td-text-color-link);
    cursor: pointer
}

.l-list-item__action>li>a {
    text-decoration: none;
    color: var(--td-brand-color)
}

.l-list--split .l-list-item:after {
    background: var(--td-border-level-1-color)
}

.l-list--stripe .l-list-item:nth-child(2n) {
    background: var(--td-bg-color-secondarycontainer)
}

.l-list--vertical-action .l-list-item {
    flex-direction: column
}

.l-list.l-size-s .l-list-item {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-m)
}

.l-list.l-size-l .l-list-item {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl)
}

.l-list__header,
.l-list__footer {
    background: var(--td-bg-color-container);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l)
}

.l-list__load {
    background: var(--td-bg-color-container);
    text-align: center;
    line-height: var(--td-line-height-body-medium)
}

.l-list__load>div {
    display: flex;
    align-items: center;
    justify-content: center
}

.l-list__load:not(:empty) {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l)
}

.l-list__load .l-loading {
    font-size: var(--td-comp-size-xxxs);
    margin-right: var(--td-comp-margin-s)
}

.l-list__load .l-loading.l-is-load-more {
    cursor: pointer
}

.l-progress {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-progress__inner {
    position: relative;
    height: 100%;
    background: var(--td-brand-color);
    border-radius: var(--td-radius-round);
    transition: all .2s cubic-bezier(.38, 0, .24, 1)
}

.l-progress__info {
    margin-left: var(--td-comp-margin-s);
    color: var(--td-text-color-primary);
    white-space: nowrap;
    display: inline-flex
}

.l-progress__icon {
    font-size: calc(var(--td-font-size-body-medium) + 2px)
}

.l-progress__bar {
    width: 100%;
    height: var(--td-size-3);
    overflow: hidden;
    background: var(--td-bg-color-component);
    border-radius: var(--td-radius-round)
}

.l-progress--thin {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.l-progress--plump {
    height: var(--td-comp-size-xxs);
    border-radius: calc(var(--td-comp-size-xxs) / 2);
    display: flex;
    align-items: center
}

.l-progress--plump .l-progress__info {
    font-size: var(--td-font-size-body-small)
}

.l-progress--over-ten .l-progress__info {
    position: absolute;
    top: 50%;
    z-index: 10;
    right: var(--td-comp-margin-s);
    color: var(--td-text-color-anti);
    transform: translateY(-50%)
}

.l-progress--under-ten .l-progress__info,
.l-progress--under-ten .l-progress__inner {
    display: inline-block
}

.l-progress--under-ten .l-progress__info {
    vertical-align: top
}

.l-progress--circle {
    position: relative
}

.l-progress--circle .l-progress__info {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    width: 100%;
    margin: 0;
    font-size: inherit;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    transform: translate(-50%, -50%)
}

.l-progress--circle .l-progress__circle-outer {
    stroke: var(--td-bg-color-component)
}

.l-progress--circle .l-progress__circle-inner {
    stroke: var(--td-brand-color);
    transition: all .2s cubic-bezier(.38, 0, .24, 1)
}

.l-progress--circle .l-progress__icon {
    font-size: 2.4em
}

.l-progress--status--active .l-progress__inner:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    content: "";
    animation: progress-active-animation 2s cubic-bezier(.23, .99, .86, .2) infinite;
    background: var(--td-text-color-anti);
    opacity: .2
}

.l-progress--status--success .l-progress__inner {
    background: var(--td-success-color)
}

.l-progress--status--success .l-progress__circle-inner {
    stroke: var(--td-success-color)
}

.l-progress--status--success .l-progress__icon {
    color: var(--td-success-color)
}

.l-progress--status--warning .l-progress__inner {
    background: var(--td-warning-color)
}

.l-progress--status--warning .l-progress__circle-inner {
    stroke: var(--td-warning-color)
}

.l-progress--status--warning .l-progress__icon {
    color: var(--td-warning-color)
}

.l-progress--status--error .l-progress__inner {
    background: var(--td-error-color)
}

.l-progress--status--error .l-progress__circle-inner {
    stroke: var(--td-error-color)
}

.l-progress--status--error .l-progress__icon {
    color: var(--td-error-color)
}

@keyframes progress-active-animation {
    0% {
        width: 0;
        opacity: .1
    }

    35% {
        width: 50%;
        opacity: .4
    }

    to {
        width: 100%;
        opacity: 0
    }
}

:root,
:root[theme-mode=light] {
    --skeleton-animation-gradient: rgba(0, 0, 0, .04)
}

:root[theme-mode=dark] {
    --skeleton-animation-gradient: rgba(255, 255, 255, .06)
}

.l-skeleton {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-skeleton__row {
    display: flex;
    margin-bottom: var(--td-comp-margin-l);
    align-items: center
}

.l-skeleton__row:only-child,
.l-skeleton__row:last-child {
    margin-bottom: 0
}

.l-skeleton__col {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--td-bg-color-secondarycontainer);
    color: var(--td-text-color-disabled);
    margin-right: var(--td-comp-margin-l)
}

.l-skeleton__col:first-child:last-child,
.l-skeleton__col:last-child {
    margin-right: 0
}

.l-skeleton--type-text {
    width: 100%;
    height: var(--td-font-size-body-large);
    border-radius: var(--td-radius-default)
}

.l-skeleton--type-rect {
    width: 120px;
    height: 88px;
    border-radius: var(--td-radius-default)
}

.l-skeleton--type-circle {
    width: 32px;
    height: 32px;
    border-radius: var(--td-radius-circle);
    flex-shrink: 0
}

.l-skeleton--animation-gradient {
    position: relative;
    overflow-x: hidden
}

.l-skeleton--animation-gradient:after {
    content: " ";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), var(--skeleton-animation-gradient), rgba(255, 255, 255, 0));
    animation: t-skeleton--gradient 1.5s linear 2s infinite
}

.l-skeleton--animation-flashed {
    animation: t-skeleton--flashed 2s linear 2s infinite
}

@keyframes t-skeleton--gradient {
    0% {
        transform: translate(-100%) skew(-15deg)
    }

    to {
        transform: translate(100%) skew(-15deg)
    }
}

@keyframes t-skeleton--flashed {
    0% {
        opacity: 1
    }

    50% {
        background-color: #e6e6e64d;
        opacity: .3
    }

    to {
        opacity: 1
    }
}

.l-statistic {
    display: inline-block;
    font-size: var(--td-font-size-body-medium);
    line-height: var(--td-line-height-body-medium);
    color: var(--td-text-color-secondary)
}

.l-statistic-title {
    font-size: var(--td-font-body-medium);
    margin-bottom: var(--td-comp-margin-s)
}

.l-statistic-content {
    display: inline-block;
    color: var(--td-text-color-primary);
    text-align: left;
    white-space: nowrap
}

.l-statistic-content-value {
    font-size: var(--td-font-size-headline-medium);
    line-height: var(--td-line-height-headline-medium);
    font-family: TCloudNumber, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol
}

.l-statistic-content-unit {
    font-size: var(--td-font-size-body-medium);
    margin-left: var(--td-comp-margin-xs);
    font-family: TCloudNumber, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol
}

.l-statistic-content-suffix {
    display: inline-flex;
    align-items: center;
    font-size: var(--td-font-size-title-large);
    margin-left: var(--td-comp-margin-s)
}

.l-statistic-content-prefix {
    display: inline-flex;
    align-items: center;
    font-size: var(--td-font-size-title-large);
    margin-right: var(--td-comp-margin-s)
}

.l-statistic-content-prefix .l-icon {
    font-size: var(--td-font-size-title-large)
}

.l-statistic-extra {
    margin-top: 8px
}

.l-statistic-extra .l-space .l-space-item {
    display: flex
}

.l-swiper {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative
}

.l-swiper__wrap {
    display: block;
    position: relative;
    height: 100%
}

.l-swiper__content {
    position: relative;
    z-index: 1;
    overflow: hidden
}

.l-swiper__container {
    position: relative;
    display: flex;
    flex-direction: row;
    height: 100%;
    z-index: 1
}

.l-swiper__container__item {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
    display: inline-block
}

.l-swiper__arrow {
    display: flex;
    align-items: center
}

.l-swiper__arrow svg.l-icon {
    width: 20px;
    height: 20px
}

.l-swiper__arrow svg.l-icon:before {
    font-size: 24px
}

.l-swiper__arrow--default .l-swiper__arrow-left {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    width: 24px;
    height: 24px;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-font-white-2);
    transition: .2s linear;
    cursor: pointer;
    left: 16px
}

.l-swiper__arrow--default .l-swiper__arrow-left:hover {
    color: var(--td-bg-color-container);
    background-color: var(--td-font-white-4);
    border-radius: var(--td-radius-default);
    transition: .2s linear
}

.l-swiper__arrow--default .l-swiper__arrow-left:active {
    background-color: var(--td-font-white-3);
    transition: .2s linear
}

.l-swiper__arrow--default .l-swiper__arrow-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    width: 24px;
    height: 24px;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-font-white-2);
    transition: .2s linear;
    cursor: pointer;
    right: 16px
}

.l-swiper__arrow--default .l-swiper__arrow-right:hover {
    color: var(--td-bg-color-container);
    background-color: var(--td-font-white-4);
    border-radius: var(--td-radius-default);
    transition: .2s linear
}

.l-swiper__arrow--default .l-swiper__arrow-right:active {
    background-color: var(--td-font-white-3);
    transition: .2s linear
}

.l-swiper-card .l-swiper__container {
    display: block
}

.l-swiper-card .l-swiper__container .l-is-active {
    z-index: 2
}

.l-swiper-card .l-swiper__card {
    position: absolute;
    top: 0;
    left: 0;
    width: 41.5%;
    height: 100%;
    z-index: 0
}

.l-swiper-fade .l-swiper__container {
    display: block
}

.l-swiper-fade .l-swiper__fade {
    position: absolute;
    top: 0;
    left: 0
}

.l-swiper__navigation {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    display: flex;
    flex-direction: row;
    bottom: 0;
    margin: 0;
    padding: 0;
    z-index: 2
}

.l-swiper__navigation>li {
    flex: 1 0 auto;
    list-style-type: none;
    display: flex
}

.l-swiper__navigation .l-swiper__arrow svg.l-icon {
    width: 16px;
    height: 16px
}

.l-swiper__navigation-bars .l-swiper__navigation-item {
    cursor: pointer;
    margin: 0 0 0 6px;
    padding: 18px 0;
    width: 14px;
    height: auto
}

.l-swiper__navigation-bars .l-swiper__navigation-item span {
    width: 100%;
    height: 3px
}

.l-swiper__navigation-bars .l-swiper__navigation-item:nth-child(1) {
    margin-left: 0
}

.l-swiper__navigation-bars .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper__navigation-bars .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active {
    width: 24px
}

.l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item {
    cursor: pointer;
    margin: 0 0 0 6px;
    padding: 18px 0;
    width: 14px;
    height: auto
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item span {
    border-radius: 1.5px
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item span {
    width: 100%;
    height: 3px
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item:nth-child(1) {
    margin-left: 0
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item.l-is-active {
    width: 24px
}

.l-swiper__navigation-dots-bar .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper__navigation-dots .l-swiper__navigation-item {
    cursor: pointer;
    margin: 0 0 0 6px;
    padding: 18px 0;
    width: var(--td-size-2);
    height: auto
}

.l-swiper__navigation-dots .l-swiper__navigation-item span {
    border-radius: 50%
}

.l-swiper__navigation-dots .l-swiper__navigation-item span {
    width: 100%;
    height: var(--td-size-2)
}

.l-swiper__navigation-dots .l-swiper__navigation-item:nth-child(1) {
    margin-left: 0
}

.l-swiper__navigation-dots .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper__navigation-dots .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper__navigation-dots .l-swiper__navigation-item span:active,
.l-swiper__navigation-dots .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper__navigation--fraction {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: auto;
    right: auto;
    bottom: calc(0px - calc(var(--td-line-height-body-medium) + 12px));
    height: var(--td-line-height-body-medium);
    line-height: var(--td-line-height-body-medium)
}

.l-swiper__navigation--fraction .l-swiper__arrow-left {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper__navigation--fraction .l-swiper__arrow-left:hover {
    color: var(--td-text-color-primary)
}

.l-swiper__navigation--fraction .l-swiper__arrow-left:active {
    color: var(--td-brand-color-active)
}

.l-swiper__navigation--fraction .l-swiper__arrow-right {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper__navigation--fraction .l-swiper__arrow-right:hover {
    color: var(--td-text-color-primary)
}

.l-swiper__navigation--fraction .l-swiper__arrow-right:active {
    color: var(--td-brand-color-active)
}

.l-swiper__navigation--fraction .l-swiper__navigation-text-fraction {
    display: inline-block;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.l-swiper--vertical .l-swiper__container {
    flex-direction: column
}

.l-swiper--vertical .l-swiper__navigation {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    right: 0;
    bottom: auto;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item {
    cursor: pointer;
    margin: 6px 0 0;
    padding: 0 18px;
    width: auto;
    height: 14px
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    width: 3px;
    height: 100%
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item:nth-child(1) {
    margin-top: 0
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active {
    height: 24px
}

.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item {
    cursor: pointer;
    margin: 6px 0 0;
    padding: 0 18px;
    width: auto;
    height: 14px
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item span {
    border-radius: 1.5px
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item span {
    width: 3px;
    height: 100%
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item:nth-child(1) {
    margin-top: 0
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item.l-is-active {
    height: 24px
}

.l-swiper--vertical .l-swiper__navigation-dots-bar .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item {
    cursor: pointer;
    margin: 6px 0 0;
    padding: 0 18px;
    width: auto;
    max-height: var(--td-size-2)
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item span {
    border-radius: 50%
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item span {
    width: var(--td-size-2);
    height: 100%
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item:nth-child(1) {
    margin-top: 0
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item span:active,
.l-swiper--vertical .l-swiper__navigation-dots .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--outside .l-swiper__navigation {
    bottom: -36px
}

.l-swiper--outside .l-swiper__navigation--fraction {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: auto;
    right: auto;
    bottom: calc(0px - calc(var(--td-line-height-body-medium) + 12px));
    height: var(--td-line-height-body-medium);
    line-height: var(--td-line-height-body-medium)
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__arrow-left {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__arrow-left:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__arrow-left:active {
    color: var(--td-brand-color-active)
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__arrow-right {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__arrow-right:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__arrow-right:active {
    color: var(--td-brand-color-active)
}

.l-swiper--outside .l-swiper__navigation--fraction .l-swiper__navigation-text-fraction {
    display: inline-block;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background-color: var(--td-text-color-disabled)
}

.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-text-color-primary)
}

.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:active,
.l-swiper--outside .l-swiper__navigation-bars .l-is-active span {
    background-color: var(--td-brand-color-active)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation {
    bottom: auto;
    right: -36px
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: auto;
    right: auto;
    bottom: calc(0px - calc(var(--td-line-height-body-medium) + 12px));
    height: var(--td-line-height-body-medium);
    line-height: var(--td-line-height-body-medium)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__arrow-left {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__arrow-left:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__arrow-left:active {
    color: var(--td-brand-color-active)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__arrow-right {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__arrow-right:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__arrow-right:active {
    color: var(--td-brand-color-active)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation--fraction .l-swiper__navigation-text-fraction {
    display: inline-block;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background-color: var(--td-text-color-disabled)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-text-color-primary)
}

.l-swiper--outside.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:active,
.l-swiper--outside.l-swiper--vertical .l-swiper__navigation-bars .l-is-active span {
    background-color: var(--td-brand-color-active)
}

.l-swiper--inside .l-swiper__navigation {
    bottom: 0
}

.l-swiper--inside .l-swiper__navigation--fraction {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: auto;
    right: auto;
    bottom: calc(0px - calc(var(--td-line-height-body-medium) + 12px));
    height: var(--td-line-height-body-medium);
    line-height: var(--td-line-height-body-medium)
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__arrow-left {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__arrow-left:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__arrow-left:active {
    color: var(--td-brand-color-active)
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__arrow-right {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-medium);
    height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__arrow-right:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__arrow-right:active {
    color: var(--td-brand-color-active)
}

.l-swiper--inside .l-swiper__navigation--fraction .l-swiper__navigation-text-fraction {
    display: inline-block;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.l-swiper--large .l-swiper__arrow i.l-icon:before {
    font-size: 32px
}

.l-swiper--large .l-swiper__arrow--default .l-swiper__arrow-left {
    width: 32px;
    height: 32px;
    left: 24px
}

.l-swiper--large .l-swiper__arrow--default .l-swiper__arrow-right {
    width: 32px;
    height: 32px;
    right: 24px
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item {
    cursor: pointer;
    margin: 0 0 0 8px;
    padding: 24px 0;
    width: 21px;
    height: auto
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item span {
    width: 100%;
    height: 4px
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item:nth-child(1) {
    margin-left: 0
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active {
    width: 36px
}

.l-swiper--large .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--large .l-swiper__navigation--fraction {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: auto;
    right: auto;
    bottom: calc(0px - calc(var(--td-line-height-body-large) + 12px));
    height: var(--td-line-height-body-large);
    line-height: var(--td-line-height-body-large)
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__arrow-left {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-large);
    height: var(--td-line-height-body-large);
    cursor: pointer
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__arrow-left:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__arrow-left:active {
    color: var(--td-brand-color-active)
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__arrow-right {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-large);
    height: var(--td-line-height-body-large);
    cursor: pointer
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__arrow-right:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__arrow-right:active {
    color: var(--td-brand-color-active)
}

.l-swiper--large .l-swiper__navigation--fraction .l-swiper__navigation-text-fraction {
    display: inline-block;
    font-size: var(--td-font-size-body-large);
    color: var(--td-text-color-secondary);
    margin: 0
}

.l-swiper--large.l-swiper--outside .l-swiper__navigation {
    bottom: -48px
}

.l-swiper--large.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background-color: var(--td-text-color-disabled)
}

.l-swiper--large.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-text-color-primary)
}

.l-swiper--large.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:active,
.l-swiper--large.l-swiper--outside .l-swiper__navigation-bars .l-is-active span {
    background-color: var(--td-brand-color-active)
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item {
    cursor: pointer;
    margin: 8px 0 0;
    padding: 0 24px;
    width: auto;
    height: 21px
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    width: 4px;
    height: 100%
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item:nth-child(1) {
    margin-top: 0
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active {
    height: 36px
}

.l-swiper--large.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--large.l-swiper--vertical.l-swiper--outside .l-swiper__navigation {
    right: -48px
}

.l-swiper--large.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background-color: var(--td-text-color-disabled)
}

.l-swiper--large.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-text-color-primary)
}

.l-swiper--large.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:active,
.l-swiper--large.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-is-active span {
    background-color: var(--td-brand-color-active)
}

.l-swiper--small .l-swiper__arrow i.l-icon:before {
    font-size: 16px
}

.l-swiper--small .l-swiper__arrow--default .l-swiper__arrow-left {
    width: 16px;
    height: 16px;
    left: 8px
}

.l-swiper--small .l-swiper__arrow--default .l-swiper__arrow-right {
    width: 16px;
    height: 16px;
    right: 8px
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item {
    cursor: pointer;
    margin: 0 0 0 4px;
    padding: 12px 0;
    width: 9px;
    height: auto
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item span {
    width: 100%;
    height: 2px
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item:nth-child(1) {
    margin-left: 0
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active {
    width: 15px
}

.l-swiper--small .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--small .l-swiper__navigation--fraction {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: auto;
    right: auto;
    bottom: calc(0px - calc(var(--td-line-height-body-small) + 12px));
    height: var(--td-line-height-body-small);
    line-height: var(--td-line-height-body-small)
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__arrow-left {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-small);
    height: var(--td-line-height-body-small);
    cursor: pointer
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__arrow-left:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__arrow-left:active {
    color: var(--td-brand-color-active)
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__arrow-right {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    background-color: transparent;
    color: var(--td-text-color-secondary);
    width: var(--td-line-height-body-small);
    height: var(--td-line-height-body-small);
    cursor: pointer
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__arrow-right:hover {
    color: var(--td-text-color-primary)
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__arrow-right:active {
    color: var(--td-brand-color-active)
}

.l-swiper--small .l-swiper__navigation--fraction .l-swiper__navigation-text-fraction {
    display: inline-block;
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary);
    margin: 0
}

.l-swiper--small.l-swiper--outside .l-swiper__navigation {
    bottom: -24px
}

.l-swiper--small.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background-color: var(--td-text-color-disabled)
}

.l-swiper--small.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-text-color-primary)
}

.l-swiper--small.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:active,
.l-swiper--small.l-swiper--outside .l-swiper__navigation-bars .l-is-active span {
    background-color: var(--td-brand-color-active)
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item {
    cursor: pointer;
    margin: 4px 0 0;
    padding: 0 12px;
    width: auto;
    height: 9px
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    width: 2px;
    height: 100%
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item:nth-child(1) {
    margin-top: 0
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background: var(--td-font-white-4)
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-font-white-2)
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item span:active {
    background-color: var(--td-bg-color-container)
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active {
    height: 15px
}

.l-swiper--small.l-swiper--vertical .l-swiper__navigation-bars .l-swiper__navigation-item.l-is-active span {
    background-color: var(--td-bg-color-container)
}

.l-swiper--small.l-swiper--vertical.l-swiper--outside .l-swiper__navigation {
    right: -24px
}

.l-swiper--small.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span {
    background-color: var(--td-text-color-disabled)
}

.l-swiper--small.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:hover {
    background-color: var(--td-text-color-primary)
}

.l-swiper--small.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-swiper__navigation-item span:active,
.l-swiper--small.l-swiper--vertical.l-swiper--outside .l-swiper__navigation-bars .l-is-active span {
    background-color: var(--td-brand-color-active)
}

@-moz-document url-prefix() {
    .scrollbar {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.scrollbar::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.scrollbar::-webkit-scrollbar-thumb:vertical:hover,
.scrollbar::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.scrollbar.l-table__affixed-footer-elm::-webkit-scrollbar-track,
.scrollbar.l-table__scrollbar--obvious::-webkit-scrollbar-track {
    background: var(--td-scroll-track-color)
}

.l-table__affixed-footer-wrap>.scrollbar.l-table__affixed-footer-elm::-webkit-scrollbar-thumb,
.l-table--width-overflow.l-table--footer-affixed .l-table__content::-webkit-scrollbar-thumb,
.l-table--width-overflow.l-table--horizontal-bar-affixed .l-table__content::-webkit-scrollbar-thumb {
    background: transparent
}

.l-table.l-table--overflow-visible {
    overflow: initial
}

.l-table {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-container);
    position: relative
}

.l-table:focus-visible {
    outline: none
}

.l-table .l-loading--full {
    z-index: 72
}

.l-table.l-vertical-align-top th,
.l-table.l-vertical-align-top td {
    vertical-align: top
}

.l-table.l-vertical-align-middle th,
.l-table.l-vertical-align-middle td {
    vertical-align: middle
}

.l-table.l-vertical-align-bottom th,
.l-table.l-vertical-align-bottom td {
    vertical-align: bottom
}

.l-table .l-table__resize-line {
    display: none;
    position: absolute;
    left: 10px;
    width: 0;
    border-left: 1px solid var(--td-component-border);
    z-index: 1001
}

.l-table__column-controller-trigger.l-align-top-right,
.l-table__column-controller-trigger.l-align-bottom-right {
    text-align: right
}

.l-table__column-controller-trigger {
    padding: var(--td-comp-paddingTB-l) 0
}

.l-table__column-controller-item:not(:last-child) {
    margin-bottom: var(--td-comp-margin-l)
}

.l-table__content {
    position: relative
}

@-moz-document url-prefix() {
    .l-table__content {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-table__content::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-table__content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-table__content::-webkit-scrollbar-thumb:vertical:hover,
.l-table__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-table__pagination {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l);
    box-sizing: border-box
}

.l-table .l-icon {
    font-size: var(--td-font-size-body-large)
}

.l-table table {
    width: 100%;
    border-spacing: 0
}

.l-table .l-text-ellipsis {
    line-height: var(--td-line-height-body-medium);
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-table th,
.l-table td {
    position: relative;
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l);
    border-bottom: 1px solid var(--td-component-border);
    line-height: var(--td-line-height-body-medium);
    font-weight: 400;
    overflow-wrap: break-word;
    background-color: inherit;
    box-sizing: border-box;
    text-align: left
}

.l-table th.l-table__th-drag {
    padding: 0;
    height: 0;
    text-align: center
}

.l-table thead td,
.l-table th {
    color: var(--td-text-color-placeholder)
}

.l-table td[key=row-select] {
    padding: 13px 0 11px var(--td-comp-paddingLR-l)
}

.l-table td.l-align-left,
.l-table th.l-align-left {
    text-align: left
}

.l-table td.l-align-right,
.l-table th.l-align-right {
    text-align: right
}

.l-table td.l-align-center,
.l-table th.l-align-center {
    text-align: center
}

.l-table tr {
    background-color: var(--td-bg-color-container)
}

.l-table.l-size-s th,
.l-table.l-size-s td {
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s)
}

.l-table.l-size-l th,
.l-table.l-size-l td {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl)
}

.l-table .l-table__expandable-icon-cell,
.l-table .l-table__selection-cell {
    padding: 0;
    height: 0
}

.l-table td.l-table__handle-draggable {
    text-align: center;
    height: 0;
    padding: 0
}

.l-table .l-table__cell--selectable>.l-checkbox {
    vertical-align: middle
}

.l-table .l-table__cell--selectable+td,
.l-table .l-table__cell--selectable+th {
    padding-left: 0
}

.l-table--bordered td,
.l-table--bordered th {
    border-left: 1px solid var(--td-component-border)
}

.l-table--bordered td.l-table__cell--fixed-left-last:before,
.l-table--bordered th.l-table__cell--fixed-left-last:before {
    border-right: 1px solid var(--td-component-border)
}

.l-table--bordered th:first-child,
.l-table--bordered td.l-table__td-first-col {
    border-left-width: 0
}

.l-table--bordered:not(.l-table--rowspan-colspan) td:first-child {
    border-left-width: 0
}

.l-table--bordered .l-table__content {
    border-left: 1px solid var(--td-component-border)
}

.l-table--bordered .l-table__content::-webkit-scrollbar-corner {
    background-color: transparent
}

.l-table--bordered .l-table__content {
    border: 1px solid var(--td-component-border);
    border-radius: var(--td-radius-default)
}

.l-table--bordered .l-table--loading {
    border-bottom: 1px solid var(--td-component-border)
}

.l-table--bordered .l-table__pagination {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l)
}

.l-table--bordered .l-table__bottom-content+.l-table__pagination {
    padding: 0
}

.l-table--bordered.l-table__header--fixed .l-table__content {
    border-bottom: 1px solid var(--td-component-border)
}

.l-table--bordered .l-table__td-last-row {
    border-bottom: none
}

.l-table--striped:not(.l-table--bordered) th,
.l-table--striped:not(.l-table--bordered) td {
    border-bottom: none
}

.l-table--striped.l-table--header-fixed>.l-table__content>table>tbody tr:nth-of-type(2n) {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table--striped:not(.l-table--header-fixed)>.l-table__content>table>tbody>tr:nth-of-type(odd):not(.l-table__expanded-row) {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table--striped.l-table--hoverable.l-table__header--fixed tbody tr:nth-of-type(2n):hover {
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-table--striped.l-table--hoverable:not(.l-table__header--fixed)>.l-table__content>table>tbody tr:nth-of-type(odd):hover {
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-table--striped.l-table--hoverable>.l-table__content>table>tbody tr {
    transition: background-color .2s linear
}

.l-table--striped.l-table--hoverable>.l-table__content>table>tbody tr:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-table--hoverable tbody tr {
    transition: background-color .2s linear
}

.l-table--hoverable tbody tr:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-table.l-table--align-top tbody td {
    vertical-align: top
}

.l-table .l-table__cell--highlight {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table__header--fixed table {
    table-layout: fixed
}

.l-table__header--fixed th,
.l-table__header--fixed td {
    overflow-wrap: break-word
}

.l-table__header--fixed.l-table__header,
.l-table__header--fixed .l-table__header {
    width: fit-content;
    position: relative;
    z-index: 5
}

@-moz-document url-prefix() {
    .l-table__header--fixed .l-table__header {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-table__header--fixed .l-table__header::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-table__header--fixed .l-table__header::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-table__header--fixed .l-table__header::-webkit-scrollbar-thumb:vertical:hover,
.l-table__header--fixed .l-table__header::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-table__header--fixed .l-table__body {
    overflow-y: auto;
    width: fit-content
}

@-moz-document url-prefix() {
    .l-table__header--fixed .l-table__body {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.l-table__header--fixed .l-table__body::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.l-table__header--fixed .l-table__body::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 11px
}

.l-table__header--fixed .l-table__body::-webkit-scrollbar-thumb:vertical:hover,
.l-table__header--fixed .l-table__body::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-table:not(.l-table--bordered) .l-table__cell--selectable+td,
.l-table:not(.l-table--bordered) .l-table__cell--selectable+th {
    padding-left: 0
}

.l-table__cell--fixed.l-table__header--fixed .l-table__header {
    overflow: hidden;
    width: 100%
}

.l-table__cell--fixed.l-table__header--fixed .l-table__header .l-table__cell--fixed-left:last-child:after,
.l-table__cell--fixed.l-table__header--fixed .l-table__header .l-table__cell--fixed-right:last-child:after {
    content: "";
    position: absolute;
    right: -6px;
    width: 6px;
    height: 100%;
    top: 0;
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table__cell--fixed.l-table__header--fixed .l-table__body {
    overflow: auto scroll
}

.l-table__cell--fixed .l-table__content {
    overflow: auto hidden
}

.l-table__cell--fixed table {
    table-layout: fixed;
    min-width: 100%
}

.l-table__cell--fixed th,
.l-table__cell--fixed td {
    position: relative
}

.l-table__cell--fixed .l-table__cell--fixed-left-last:before {
    z-index: -1;
    background-color: inherit
}

.l-table__cell--fixed .l-table__cell--fixed-left-last:after {
    position: absolute;
    top: 0;
    bottom: 0;
    content: "";
    transition: box-shadow .3s;
    pointer-events: none;
    z-index: -2
}

.l-table__cell--fixed .l-table__cell--fixed-left-last:after {
    right: 0;
    transform: translate(100%)
}

.l-table__cell--fixed .l-table__cell--fixed-right-first:before {
    z-index: -1;
    background-color: inherit
}

.l-table__cell--fixed .l-table__cell--fixed-right-first:after {
    position: absolute;
    top: 0;
    bottom: 0;
    content: "";
    transition: box-shadow .3s;
    pointer-events: none;
    z-index: -2
}

.l-table__cell--fixed .l-table__cell--fixed-right-first:after {
    left: 0;
    transform: translate(-100%)
}

.l-table .l-table__cell-resizable {
    position: relative
}

.l-table .l-table__cell-resizable .l-table__cell--resizer {
    position: absolute;
    top: 0;
    right: -5px;
    bottom: 0;
    z-index: 10;
    width: 10px;
    cursor: col-resize
}

.l-table .l-table__row--disabled {
    color: var(--td-text-color-disabled)
}

.l-table .l-table__cell--title {
    display: flex;
    align-items: center
}

.l-table__column-controller-desc {
    margin-bottom: var(--td-comp-margin-xxl)
}

.l-table__column-controller-block {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l);
    border: 1px solid var(--td-component-border);
    border-bottom: 1px solid var(--td-component-border)
}

.l-table__column-controller-block+.l-table__column-controller-block {
    border-top: 0;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l);
    border-bottom: 1px solid var(--td-component-border)
}

.l-table__column-controller--fixed .l-checkbox {
    width: 108px
}

.l-table.l-table__row--active-single tbody>tr.l-table__row--active,
.l-table.l-table__row--active-multiple tbody>tr.l-table__row--active {
    background-color: var(--td-brand-color-light)
}

.l-table.l-table__row--active-single tbody>tr.l-table__row--active.l-table__row--hover,
.l-table.l-table__row--active-multiple tbody>tr.l-table__row--active.l-table__row--hover {
    background-color: var(--td-brand-color-light-hover)
}

.l-table.l-table--hoverable tbody>tr.l-table__row--active:hover {
    background-color: var(--td-brand-color-light-hover)
}

.l-table.l-table--row-expandable tbody>tr.l-table__row--hover,
.l-table.l-table--row-select tbody>tr.l-table__row--hover,
.l-table.l-table__row--active-multiple tbody>tr.l-table__row--hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-table--bordered .l-table__cell--sortable .l-table__cell--title,
.l-table--bordered .l-table__cell--filterable .l-table__cell--title {
    justify-content: space-between
}

.l-table th.l-align-right .l-table__cell--title {
    justify-content: flex-end
}

.l-table__cell--sort-trigger {
    text-align: center;
    vertical-align: text-bottom
}

.l-table__cell--sort-trigger svg {
    vertical-align: initial
}

.l-table--loading {
    position: relative
}

.l-table--loading-progressbar {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    height: 1px;
    background-color: var(--td-brand-color);
    animation: tTableProgressbar 2s ease-in-out;
    animation-fill-mode: both
}

.l-table--loading-message {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    color: var(--td-text-color-placeholder)
}

.l-table__expanded-cell {
    padding-left: 45px
}

.l-table__async-loading {
    text-align: center
}

.l-table__async-loading.l-is-load-more {
    cursor: pointer
}

.l-table__empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    color: var(--td-text-color-disabled)
}

.l-table__filter-icon,
.l-table__sort-icon {
    align-items: center;
    background-color: transparent;
    display: inline-flex;
    cursor: pointer;
    vertical-align: text-bottom;
    transition: .2s linear
}

.l-table__filter-icon>svg,
.l-table__sort-icon>svg {
    margin-top: 0
}

.l-table__sort-icon .l-is-focus,
.l-table__sort-icon.l-is-focus,
.l-table__sort-icon:hover {
    color: var(--td-brand-color);
    border-radius: var(--td-radius-circle);
    transition: .2s linear
}

.l-table__filter-icon .l-is-focus,
.l-table__filter-icon.l-is-focus,
.l-table__filter-icon:hover {
    color: var(--td-brand-color);
    transition: .2s linear
}

.l-table__filter-pop .l-popup__content {
    padding: 0
}

.l-table__filter-pop .l-table__filter-pop-content .l-table__filter-pop-content-inner {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l)
}

.l-table__filter-pop .l-table__filter-pop-content .l-table__filter-pop-content-inner .l-table__filter-popup-input {
    margin-bottom: var(--td-comp-margin-s)
}

.l-table__filter-pop .l-table__filter-pop-content .l-radio-group {
    display: block;
    height: auto
}

.l-table__filter-pop .l-table__filter-pop-content .l-checkbox-group {
    display: block
}

.l-table__filter-pop .l-table__filter-pop-content .l-checkbox,
.l-table__filter-pop .l-table__filter-pop-content .l-radio {
    display: block;
    margin: var(--td-comp-margin-xs) 0
}

.l-table__filter-pop .l-table__filter-pop-content .l-table__filter-pop-content-button {
    border-top: 1px solid var(--td-component-border);
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l)
}

.l-table__filter-pop .l-table__filter-pop-content .l-table__filter-pop-content-button .l-button+.l-button {
    margin-left: var(--td-comp-margin-l)
}

.l-table__filter-pop .l-table__list-filter-input--sticky .l-table__filter-pop-content .l-table__filter-pop-content-inner {
    padding: 0;
    max-height: 280px;
    overflow: auto;
    position: relative
}

.l-table__filter-pop .l-table__list-filter-input--sticky .l-table__filter-pop-content .l-table__filter-pop-content-inner .l-input__wrap {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l) 0 var(--td-comp-paddingLR-l);
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: var(--td-bg-color-container)
}

.l-table__filter-pop .l-table__list-filter-input--sticky .l-table__filter-pop-content .l-table__filter-pop-content-inner .l-radio-group {
    padding: 0 var(--td-comp-paddingLR-l)
}

.l-table__filter-pop-content-inner>.l-input__wrap {
    width: 200px
}

.l-table__filter-pop-content-inner>.l-date-range-picker__panel {
    margin: calc(0px - var(--td-comp-margin-l))
}

.l-table__sort-icon--active {
    color: var(--td-brand-color);
    transition: .2s linear
}

.l-table__double-icons {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.l-table__double-icons .l-table__sort-icon {
    position: relative
}

.l-table__double-icons .l-table-sort-asc {
    top: var(--td-comp-margin-xxs)
}

.l-table__double-icons .l-table-sort-desc {
    bottom: var(--td-comp-margin-xxs)
}

.l-table__filter-icon-wrap {
    display: flex;
    align-items: center;
    pointer-events: all;
    height: var(--td-font-size-body-large);
    width: var(--td-font-size-body-large);
    margin-left: var(--td-comp-margin-s)
}

.l-table--bordered .l-table__filter-icon-wrap {
    justify-content: flex-end
}

.l-table--bordered .l-table__cell--sortable.l-table__cell--filterable .l-table__filter-icon-wrap {
    justify-content: space-between;
    flex: 1
}

.l-table .l-align-center .l-table__cell--sortable,
.l-table .l-align-center .l-table__cell--filterable {
    display: flex;
    justify-content: space-around
}

.l-table__expand-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--td-text-color-placeholder);
    cursor: pointer;
    transition: all .2s cubic-bezier(.38, 0, .24, 1) 0s
}

.l-table__expand-box:hover {
    color: var(--td-brand-color);
    transition: .2s linear
}

@keyframes tTableProgressbar {
    0% {
        width: 0
    }

    to {
        width: 100%
    }
}

.l-table__th-row-select .l-table__th-cell-inner {
    display: inline-flex;
    align-items: center
}

.l-table-expandable-icon-cell+.l-table__cell--selectable[key=row-select] {
    padding-left: var(--td-comp-margin-s)
}

.l-table__filter--bottom-buttons {
    display: flex;
    justify-content: flex-end;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l);
    border-top: 1px solid var(--td-component-border)
}

.l-table__filter--bottom-buttons>.l-button+.l-button {
    margin-left: var(--td-comp-margin-s)
}

.l-table__row-filter-inner {
    position: sticky;
    left: 0;
    text-align: center
}

.l-table__filter-result {
    display: flex;
    align-items: center;
    justify-content: center
}

.l-table__filter-result>.l-button {
    margin-left: var(--td-comp-margin-s)
}

.l-table--layout-fixed {
    table-layout: fixed
}

.l-table--layout-auto {
    table-layout: auto
}

.l-table__ellipsis {
    white-space: nowrap;
    width: 100%
}

.l-table__content {
    overflow: auto
}

.l-table__content--scrollable-to-left .l-table__cell--fixed-left-last:after {
    border-right: 2px solid var(--td-component-border)
}

.l-table__content--scrollable-to-right .l-table__cell--fixed-right-first:after {
    border-left: 2px solid var(--td-component-border)
}

.l-table--bordered.l-table__content--scrollable-to-left .l-table__cell--fixed-left-last:after {
    border-right: 4px solid var(--td-component-border)
}

.l-table--bordered.l-table__content--scrollable-to-right .l-table__cell--fixed-right-first:after {
    border-left: 4px solid var(--td-component-border)
}

.l-table__scroll-bar-divider {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 100%;
    border-right: 1px solid var(--td-component-border);
    z-index: 71
}

.l-table__footer,
.l-table__header.l-table__header--fixed {
    position: sticky;
    z-index: 50
}

.l-table:not(.l-table--striped) .l-table__footer>tr {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table__header--fixed:not(.l-table__header--multiple)>tr>th {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table__row--fixed-top,
.l-table__row--fixed-bottom {
    position: sticky;
    z-index: 70
}

.l-table__row--fixed-bottom-first>td {
    border-top: 1px solid var(--td-component-border)
}

.l-table--bordered .l-table__content .l-table__row--without-border-bottom>td {
    border-bottom: 0
}

.l-table--bordered tbody>tr:last-child>td,
.l-table--bordered tfoot>tr:last-child>td {
    border-bottom: 0
}

.l-table--bordered tfoot>tr:first-child>td {
    border-top: 1px solid var(--td-component-border)
}

.l-table__header.l-table__header--fixed {
    top: 0
}

.l-table__footer.l-table__footer--fixed {
    bottom: 0
}

.l-table--column-fixed .l-table__cell--fixed-left-last:before {
    z-index: -1;
    background-color: inherit
}

.l-table--column-fixed .l-table__cell--fixed-left-last:after {
    position: absolute;
    top: 0;
    bottom: 0;
    content: "";
    transition: box-shadow .3s;
    pointer-events: none;
    z-index: -2
}

.l-table--column-fixed .l-table__cell--fixed-left-last:after {
    right: 0;
    transform: translate(100%)
}

.l-table--column-fixed .l-table__cell--fixed-right-first:before {
    z-index: -1;
    background-color: inherit
}

.l-table--column-fixed .l-table__cell--fixed-right-first:after {
    position: absolute;
    top: 0;
    bottom: 0;
    content: "";
    transition: box-shadow .3s;
    pointer-events: none;
    z-index: -2
}

.l-table--column-fixed .l-table__cell--fixed-right-first:after {
    left: 0;
    transform: translate(-100%)
}

.l-table--column-fixed .l-table__cell--fixed-left,
.l-table--column-fixed .l-table__cell--fixed-right {
    position: sticky
}

.l-table--column-fixed .l-table__cell--fixed-left {
    z-index: 30
}

.l-table--column-fixed .l-table__cell--fixed-right {
    z-index: 31
}

.l-table__empty-row>td {
    padding: 0;
    border: 0
}

.l-table:not(.l-table--bordered) .l-table__header.l-table--bordered>tr:first-child>th {
    border-top: 1px solid var(--td-component-border)
}

.l-table--multiple-header .l-table__header th.l-table__header-th--bordered {
    border-left-width: 1px
}

.l-table__header.l-table__header--multiple>tr {
    background-color: var(--td-bg-color-container)
}

.l-table__tree-op-icon {
    margin-right: var(--td-comp-margin-s);
    cursor: pointer;
    display: inline-flex;
    vertical-align: -3px
}

.l-table__tree-op-icon:hover {
    color: var(--td-brand-color);
    transition: .2s linear
}

.l-table__tree-leaf-node .l-table__tree-op-icon {
    min-width: 0;
    margin-right: var(--td-comp-margin-xxs)
}

.l-table__virtual-scroll-cursor {
    position: absolute;
    width: 1px;
    height: 1px;
    transition: transform .2s
}

.l-table__virtual-scroll-header {
    position: absolute;
    z-index: 51;
    left: 0
}

.l-table__affixed-header-elm-wrap {
    overflow: hidden
}

.l-table__affixed-header-elm-wrap,
.l-table__affixed-header-elm {
    position: absolute;
    left: 0;
    z-index: 51
}

.l-table__affixed-header-elm {
    overflow: auto;
    transition: opacity .2s linear;
    opacity: 1
}

.l-table__affixed-footer-elm {
    overflow: auto;
    z-index: 50
}

.l-table--bordered .l-table__affixed-header-elm {
    border: 1px solid var(--td-component-border);
    border-bottom: 0;
    border-right: 0
}

.l-table--bordered .l-table__affixed-footer-elm {
    border-left: 1px solid var(--td-component-border);
    border-bottom: 1px solid var(--td-component-border)
}

.l-table--multiple-header.l-table--bordered .l-table__affixed-header-elm {
    border-right: 0
}

.l-is-hidden {
    display: none
}

.l-positive-rotate-90 {
    transform: rotate(90deg)
}

.l-negative-rotate-180 {
    transform: rotate(180deg)
}

.l-table__expanded-row>td,
.l-table__row--full>td {
    padding: 0
}

.l-table__row-full-element {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l)
}

.l-table__row-full-inner {
    position: sticky;
    left: 0
}

.l-table__row-full-inner:not(.l-table__empty) {
    display: inline-block
}

.l-table__tree-col {
    display: flex;
    align-items: center
}

.l-table__tree-col--inline {
    display: inline
}

.l-table--full-height {
    height: 100%
}

.l-table--loading .l-table__content {
    min-height: 168px
}

.l-table__handle-draggable:hover,
.l-table--row-draggable tr,
.l-table__th--drag-sort {
    cursor: move
}

.l-table__ele--draggable-chosen {
    box-shadow: var(--td-shadow-1)
}

.l-table:not(.l-table--row-edit) .l-table__cell--editable {
    min-height: 22px;
    line-height: var(--td-line-height-body-medium);
    cursor: pointer
}

.l-table:not(.l-table--row-edit) .l-table__cell--editable .l-icon {
    margin-left: var(--td-comp-margin-s);
    font-size: var(--td-font-size-body-large);
    transition: .2s linear;
    color: var(--td-text-color-placeholder)
}

.l-table:not(.l-table--row-edit) .l-table__cell--editable .l-icon:hover {
    color: var(--td-brand-color)
}

.l-table:not(.l-table--row-edit) .l-table__cell--editable:hover {
    transition: .2s linear
}

.l-affix .l-table__pagination {
    background-color: var(--td-bg-color-container)
}

.l-table--bordered .l-affix .l-table__pagination {
    border-top: 1px solid var(--td-component-border)
}

.l-table__bottom-content+.l-table__pagination-wrap .l-table__pagination {
    border: 0;
    padding: 0
}

.l-table--column-resizable:not(.l-table--bordered) th {
    border-top: 1px solid transparent
}

.l-table--column-resizable:not(.l-table--bordered) thead.l-table__header:hover th:not(:last-child) {
    border-right: 1px solid var(--td-component-border)
}

.l-table--column-resizable:not(.l-table--bordered) thead.l-table__header:hover th {
    border-top: 1px solid var(--td-component-border)
}

.l-table--column-resizable:not(.l-table--bordered).l-table__content--scrollable-to-left.l-table__content--scrollable-to-right thead.l-table__header:hover .l-table__cell--fixed-left-last:not(:last-child),
.l-table--column-resizable:not(.l-table--bordered).l-table__content--scrollable-to-left thead.l-table__header:hover .l-table__cell--fixed-left-last:not(:last-child) {
    border-right: 0
}

.l-table td.l-table__cell-check,
.l-table th.l-table__cell-check {
    padding: 0;
    height: 0
}

.l-table td.l-table__cell-check .l-radio__label:empty,
.l-table th.l-table__cell-check .l-radio__label:empty,
.l-table td.l-table__cell-check .l-checkbox__label:empty,
.l-table th.l-table__cell-check .l-checkbox__label:empty {
    display: none
}

.l-table .l-table__cell-check .l-radio,
.l-table .l-table__cell-check .l-checkbox,
.l-table .l-table__cell-check .l-table__th-cell-inner {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.l-table td .l-input__tips {
    position: initial
}

.l-table .l-table__sort-column {
    background-color: var(--td-bg-color-secondarycontainer)
}

.l-table__ellipsis-content.l-size-s .l-popup__content {
    font: var(--td-font-body-medium)
}

.l-table--bordered .l-table__content {
    box-sizing: border-box
}

.l-timeline {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column
}

.l-timeline-item {
    min-height: 72px;
    display: flex;
    flex-direction: row;
    position: relative
}

.l-timeline-item__label.l-timeline-item__label--alternate {
    position: absolute
}

.l-timeline-item__wrapper {
    width: 8px;
    position: relative
}

.l-timeline-item__wrapper .l-timeline-item__dot {
    box-sizing: unset;
    position: absolute;
    width: 4px;
    height: 4px;
    border: 2px solid transparent;
    border-radius: 50%;
    top: 8px
}

.l-timeline-item__wrapper .l-timeline-item__dot--primary {
    border-color: var(--td-brand-color)
}

.l-timeline-item__wrapper .l-timeline-item__dot--default {
    border-color: var(--td-component-border)
}

.l-timeline-item__wrapper .l-timeline-item__dot--success {
    border-color: var(--td-success-color)
}

.l-timeline-item__wrapper .l-timeline-item__dot--warning {
    border-color: var(--td-warning-color)
}

.l-timeline-item__wrapper .l-timeline-item__dot--error {
    border-color: var(--td-error-color)
}

.l-timeline-item__wrapper .l-timeline-item__dot--custom {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    top: 4px;
    border: 0
}

.l-timeline-item__wrapper .l-timeline-item__dot--custom .l-timeline-item__dot-content {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: 0
}

.l-timeline-item__wrapper .l-timeline-item__tail {
    position: absolute;
    border-left: 2px solid transparent;
    left: 50%;
    height: calc(100% - 24px);
    bottom: 0;
    transform: translate(-50%);
    padding-bottom: var(--td-comp-size-s);
    border-color: var(--td-component-border);
    box-sizing: border-box
}

.l-timeline-item__wrapper .l-timeline-item__tail--theme-dot {
    border-style: dashed;
    border-right: 0
}

.l-timeline-item__label {
    color: var(--td-text-color-secondary);
    font-size: var(--td-font-size-body-medium)
}

.l-timeline-item__content {
    flex: 1;
    padding-left: var(--td-comp-margin-l);
    font-size: var(--td-font-size-body-large)
}

.l-timeline-item--last .l-timeline-item__tail {
    display: none
}

.l-timeline-label.l-timeline-label--alternate.l-timeline-left .l-timeline-item__label {
    text-align: right;
    left: 0
}

.l-timeline-label.l-timeline-label--alternate.l-timeline-left .l-timeline-item__wrapper {
    margin-left: 100px
}

.l-timeline-label.l-timeline-label--alternate.l-timeline-right .l-timeline-item__label {
    text-align: left;
    right: 0
}

.l-timeline-label.l-timeline-label--alternate.l-timeline-right .l-timeline-item__wrapper {
    margin-right: 100px
}

.l-timeline-right .l-timeline-item {
    flex-direction: row-reverse
}

.l-timeline-right .l-timeline-item__content {
    text-align: right;
    padding-left: 0;
    padding-right: var(--td-comp-margin-l)
}

.l-timeline-alternate .l-timeline-item-left {
    margin-left: calc(50% - 4px)
}

.l-timeline-alternate .l-timeline-item-right {
    text-align: right;
    flex-direction: row-reverse;
    margin-right: calc(50% - 4px)
}

.l-timeline-alternate .l-timeline-item-right .l-timeline-item__content {
    padding-right: var(--td-comp-margin-l);
    padding-left: 0
}

.l-timeline-label.l-timeline-alternate .l-timeline-item__label {
    width: 100%
}

.l-timeline-label.l-timeline-alternate .l-timeline-item-left .l-timeline-item__label--alternate {
    left: 0;
    transform: translate(-100%);
    text-align: right;
    padding-right: var(--td-comp-margin-l)
}

.l-timeline-label.l-timeline-alternate .l-timeline-item-right .l-timeline-item__label--alternate {
    right: 0;
    transform: translate(100%);
    text-align: left;
    padding-left: var(--td-comp-margin-l)
}

.l-timeline-horizontal {
    min-height: 200px;
    flex-direction: row;
    align-items: center
}

.l-timeline-horizontal .l-timeline-item {
    flex-direction: column;
    padding-right: 8px;
    min-width: 160px
}

.l-timeline-horizontal .l-timeline-item__wrapper {
    width: 100%;
    height: 8px
}

.l-timeline-horizontal .l-timeline-item__wrapper .l-timeline-item__dot {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: unset;
    width: 4px;
    height: 4px;
    border-radius: 50%
}

.l-timeline-horizontal .l-timeline-item__wrapper .l-timeline-item__dot--custom {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    border: 0
}

.l-timeline-horizontal .l-timeline-item__wrapper .l-timeline-item__dot--custom .l-timeline-item__dot-content {
    position: absolute;
    left: 0;
    transform: translateY(-50%);
    top: 50%
}

.l-timeline-horizontal .l-timeline-item__wrapper .l-timeline-item__tail {
    left: calc(8px + var(--td-comp-margin-s));
    top: 50%;
    transform: translateY(-50%);
    width: calc(100% - calc(8px + var(--td-comp-margin-s)));
    border: 0;
    border-top: 2px solid transparent;
    padding-bottom: 0;
    border-color: var(--td-component-border)
}

.l-timeline-horizontal .l-timeline-item__wrapper .l-timeline-item__tail--theme-dot {
    border-style: dashed;
    border-right: 0
}

.l-timeline-horizontal .l-timeline-item__content {
    padding-left: unset;
    padding-top: var(--td-comp-margin-l);
    flex: unset
}

.l-timeline-vertical .l-timeline-item__content {
    padding-bottom: var(--td-comp-margin-l)
}

.l-timeline-label.l-timeline-horizontal.l-timeline-top .l-timeline-item__label--alternate {
    top: 0;
    width: 100%;
    transform: translateY(-100%);
    padding-bottom: 0
}

.l-timeline-label.l-timeline-horizontal.l-timeline-bottom .l-timeline-item {
    flex-direction: column-reverse
}

.l-timeline-label.l-timeline-horizontal.l-timeline-bottom .l-timeline-item__wrapper {
    padding-top: 0
}

.l-timeline-label.l-timeline-horizontal.l-timeline-bottom .l-timeline-item__label--alternate {
    padding-top: var(--td-comp-margin-l);
    bottom: 0;
    width: 100%;
    transform: translateY(100%)
}

.l-timeline-label.l-timeline-horizontal.l-timeline-bottom .l-timeline-item__content {
    padding-top: 0;
    padding-bottom: var(--td-comp-margin-l)
}

.l-timeline-label.l-timeline-horizontal.l-timeline-alternate .l-timeline-item-top .l-timeline-item__label--alternate {
    top: 0;
    width: 100%;
    transform: translateY(-100%);
    padding-bottom: var(--td-comp-margin-l)
}

.l-timeline-label.l-timeline-horizontal.l-timeline-alternate .l-timeline-item-bottom {
    flex-direction: column-reverse;
    position: relative;
    transform: translateY(calc(-100% + 8px))
}

.l-timeline-label.l-timeline-horizontal.l-timeline-alternate .l-timeline-item-bottom .l-timeline-item__content {
    padding-bottom: var(--td-comp-margin-l);
    padding-top: unset
}

.l-timeline-label.l-timeline-horizontal.l-timeline-alternate .l-timeline-item-bottom .l-timeline-item__label--alternate {
    bottom: 0;
    transform: translateY(100%);
    padding-top: var(--td-comp-margin-l)
}

.l-collapse {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    border: solid 1px var(--td-component-border);
    border-bottom: 0;
    background: var(--td-bg-color-container)
}

.l-collapse.l--border-less {
    border: none
}

.l-collapse.l--border-less .l-collapse-panel__header {
    border-bottom: none
}

.l-collapse.l--border-less .l-collapse-panel__body {
    background: var(--td-bg-color-container);
    border: none
}

.l-collapse-panel__icon {
    transition: all .2s cubic-bezier(.38, 0, .24, 1);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center
}

.l-collapse-panel__icon>.l-fake-arrow {
    transform: rotate(-90deg);
    transition: all .2s cubic-bezier(.38, 0, .24, 1)
}

.l-collapse-panel__icon--left {
    margin-right: var(--td-comp-margin-s)
}

.l-collapse-panel__icon--right {
    margin-left: var(--td-comp-margin-s)
}

.l-collapse-panel__icon--active>.l-fake-arrow {
    transform: rotate(0)
}

.l-collapse-panel__icon:hover {
    background-color: var(--td-bg-color-container-hover);
    border-radius: var(--td-radius-small)
}

.l-collapse-panel__wrapper {
    overflow: hidden
}

.l-collapse-panel__wrapper.l--borderless .l-collapse-panel__header {
    border-bottom: none
}

.l-collapse-panel__wrapper.l--borderless .l-collapse-panel__body {
    background: var(--td-bg-color-container);
    border: none
}

.l-collapse-panel__wrapper .l-collapse-panel__header {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l);
    border-bottom: solid 1px var(--td-component-border);
    font: var(--td-font-title-small);
    display: flex;
    align-items: center
}

.l-collapse-panel__wrapper .l-collapse-panel__header--blank {
    flex: 1
}

.l-collapse-panel__wrapper .l-collapse-panel__header.l-is-clickable {
    cursor: pointer
}

.l-collapse-panel__wrapper .l-collapse-panel__header-left,
.l-collapse-panel__wrapper .l-collapse-panel__header-right,
.l-collapse-panel__wrapper .l-collapse-panel__header-right-content {
    display: flex
}

.l-collapse-panel__wrapper .l-collapse-panel__body {
    border-bottom: solid 1px var(--td-component-border);
    background: var(--td-bg-color-secondarycontainer);
    overflow: inherit
}

.l-collapse-panel__wrapper .l-collapse-panel__body--collapsed {
    border: none
}

.l-collapse-panel__wrapper .l-collapse-panel__content {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l) var(--td-comp-paddingTB-m) calc(var(--td-comp-paddingLR-l) + var(--td-comp-margin-xxl));
    color: var(--td-text-color-secondary)
}

.l-collapse-panel.l-is-disabled .l-collapse-panel__header {
    cursor: not-allowed;
    color: var(--td-text-color-disabled)
}

.l-collapse-panel.l-is-disabled .l-collapse-panel__icon {
    cursor: not-allowed;
    pointer-events: none
}

.l-collapse-panel.l-is-disabled .l-collapse-panel__body {
    background: var(--td-bg-color-component-disabled)
}

.l-collapse-panel.l-is-disabled .l-collapse-panel__content {
    color: var(--td-text-color-disabled)
}

.l-rate {
    display: flex;
    align-items: center
}

.l-rate .l-rate__star-top {
    position: absolute;
    width: 0;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
    transition: all .2s cubic-bezier(.38, 0, .24, 1)
}

.l-rate .l-rate__star-top,
.l-rate .l-rate__star-bottom {
    display: grid
}

.l-rate__list {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0
}

.l-rate__item {
    position: relative;
    cursor: pointer;
    transition: all .2s cubic-bezier(.38, 0, .24, 1)
}

.l-rate__item:hover {
    transform: scale(1.33)
}

.l-rate__item--half .l-rate__star-top {
    width: 50%
}

.l-rate__item--full .l-rate__star-top {
    width: 100%
}

.l-rate__text {
    color: var(--td-text-color-primary);
    font: var(--td-font-mark-medium);
    margin-left: var(--td-comp-margin-l)
}

.l-typography {
    color: var(--td-text-color-primary);
    font: var(--td-font-body-medium);
    margin: var(--td-comp-margin-m) 0
}

h1.l-typography {
    font: var(--td-font-headline-large);
    margin-top: var(--td-comp-margin-xxxxl);
    margin-bottom: var(--td-comp-margin-l)
}

h2.l-typography {
    font: var(--td-font-headline-medium);
    margin-top: var(--td-comp-margin-xxxl);
    margin-bottom: var(--td-comp-margin-l)
}

h3.l-typography {
    font: var(--td-font-headline-small);
    margin-top: var(--td-comp-margin-xxl);
    margin-bottom: var(--td-comp-margin-m)
}

h4.l-typography {
    font: var(--td-font-title-large);
    margin-top: var(--td-comp-margin-xl);
    margin-bottom: var(--td-comp-margin-m)
}

h5.l-typography {
    font: var(--td-font-title-medium);
    margin-top: var(--td-comp-margin-l);
    margin-bottom: var(--td-comp-margin-m)
}

h6.l-typography {
    font: var(--td-font-title-small)
}

.l-typography strong {
    font-weight: 600
}

.l-typography mark {
    background-color: #fcdf47
}

.l-typography code {
    border-radius: var(--td-radius-default);
    border: 1px solid var(--td-component-border);
    margin: 0 var(--td-comp-margin-xs);
    background-color: var(--td-bg-color-secondarycontainer);
    padding: 1px var(--td-comp-paddingLR-s);
    transition: background-color .2s;
    white-space: nowrap;
    font: var(--td-font-body-small);
    font-family: Source Code Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei;
    display: inline-block
}

.l-typography code:hover {
    border-radius: var(--td-radius-default);
    border: 1px solid var(--td-component-border);
    background-color: var(--td-bg-color-secondarycontainer-hover)
}

.l-typography kbd {
    border-radius: var(--td-radius-default);
    border: 1px solid var(--td-component-border);
    margin: 0 var(--td-comp-margin-xs);
    background-color: var(--td-bg-color-secondarycontainer);
    padding: 1px var(--td-comp-paddingLR-s);
    box-shadow: 0 1px 0 0 var(--td-component-border);
    font: var(--td-font-body-small);
    font-family: Source Code Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei;
    display: inline-block
}

.l-typography--disabled {
    color: var(--td-text-color-disabled);
    cursor: not-allowed
}

.l-typography--success {
    color: var(--td-success-color)
}

.l-typography--warning {
    color: var(--td-warning-color)
}

.l-typography--error {
    color: var(--td-error-color)
}

.l-typography--secondary {
    color: var(--td-text-color-secondary)
}

.l-typography-ellipsis-symbol,
.l-typography .l-icon-copy {
    color: var(--td-brand-color);
    cursor: pointer
}

.l-typography-ellipsis-symbol:hover,
.l-typography .l-icon-copy:hover {
    color: var(--td-brand-color-hover)
}

.l-typography .l-icon-checked {
    color: var(--td-success-color)
}

.l-alert {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: flex-start;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-xl);
    opacity: 1;
    transition: opacity .2s;
    border-radius: var(--td-radius-medium)
}

.l-alert.l-is-hidden {
    display: none
}

.l-alert--closing {
    opacity: 0
}

.l-alert--info {
    background-color: var(--td-brand-color-focus)
}

.l-alert--info .l-alert__icon,
.l-alert--info .l-alert__swiper-trigger-wrap,
.l-alert--info .l-alert__swiper-trigger--active {
    color: var(--td-brand-color)
}

.l-alert--success {
    background-color: var(--td-success-color-focus)
}

.l-alert--success .l-alert__icon {
    color: var(--td-success-color)
}

.l-alert--success .l-alert__swiper-trigger-wrap {
    color: var(--td-success-color-focus)
}

.l-alert--success .l-alert__swiper-trigger--active {
    color: var(--td-success-color)
}

.l-alert--warning {
    background-color: var(--td-warning-color-focus)
}

.l-alert--warning .l-alert__icon {
    color: var(--td-warning-color)
}

.l-alert--warning .l-alert__swiper-trigger-wrap {
    color: var(--td-warning-color-focus)
}

.l-alert--warning .l-alert__swiper-trigger--active {
    color: var(--td-warning-color)
}

.l-alert--error {
    background-color: var(--td-error-color-focus)
}

.l-alert--error .l-alert__icon {
    color: var(--td-error-color)
}

.l-alert--error .l-alert__swiper-trigger-wrap {
    color: var(--td-error-color-focus)
}

.l-alert--error .l-alert__swiper-trigger--active {
    color: var(--td-error-color)
}

.l-alert__icon {
    font-size: var(--td-line-height-body-medium);
    display: inherit
}

.l-alert__icon,
.l-alert__close {
    flex: 0 0 auto;
    line-height: var(--td-line-height-body-small)
}

.l-alert__content {
    flex: 1 1 0;
    font-size: var(--td-font-size-body-medium);
    line-height: var(--td-line-height-body-medium);
    overflow: hidden
}

.l-alert__title,
.l-alert__message {
    width: 100%;
    display: flex
}

.l-alert__title {
    color: var(--td-text-color-primary);
    font-weight: 700
}

.l-alert__title+.l-alert__message {
    margin-top: var(--td-comp-margin-s)
}

.l-alert__description {
    color: var(--td-text-color-secondary);
    flex: 0 1 auto;
    transition: height .2s
}

.l-alert__operation {
    flex: 0 0 auto;
    padding: 0 var(--td-comp-paddingLR-s);
    color: var(--td-brand-color);
    cursor: pointer;
    transition: color .2s
}

.l-alert__operation:hover {
    color: var(--td-brand-color-hover)
}

.l-alert__operation:active {
    color: var(--td-brand-color-active)
}

.l-alert__icon+.l-alert__content {
    margin-left: var(--td-comp-margin-s)
}

.l-alert__collapse {
    margin-top: var(--td-comp-margin-s);
    color: var(--td-brand-color);
    cursor: pointer
}

.l-alert__close {
    display: inline-flex;
    align-items: center;
    margin-left: var(--td-comp-margin-l);
    color: var(--td-text-color-secondary);
    cursor: pointer;
    transition: color .2s
}

.l-alert__close:hover {
    color: var(--td-text-color-primary)
}

.l-alert__close>.l-icon {
    font-size: calc(var(--td-line-height-body-medium) - 2px);
    padding: calc((var(--td-line-height-body-medium) - calc(var(--td-line-height-body-medium) - 2px)) / 2) 0
}

.l-drawer-fade-enter,
.l-drawer-fade-appear {
    opacity: 0;
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: linear;
    animation-play-state: paused
}

.l-drawer-fade-exit {
    animation-duration: .2s;
    animation-fill-mode: both;
    animation-timing-function: linear;
    animation-play-state: paused
}

.l-drawer-fade-enter.l-drawer-fade-enter-active,
.l-drawer-fade-enter.l-drawer-fade-enter-active.l-drawer-fade-enter-to,
.l-drawer-fade-appear.l-drawer-fade-appear-active,
.l-drawer-fade-appear.l-drawer-fade-appear-active.l-drawer-fade-appear-to {
    animation-name: tDrawerFadeIn;
    animation-duration: .2s;
    animation-play-state: running
}

.l-drawer-fade-exit.l-drawer-fade-exit-active,
.l-drawer-fade-leave-active.l-drawer-fade-leave-to {
    animation-name: tDrawerFadeOut;
    animation-duration: .2s;
    animation-play-state: running
}

@keyframes tDrawerFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes tDrawerFadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.l-drawer {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    position: fixed;
    z-index: 1500;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    outline: none
}

.l-drawer--lock {
    overflow: hidden
}

.l-drawer--attach {
    position: absolute
}

.l-drawer--left,
.l-drawer--right {
    top: 0
}

.l-drawer--left {
    left: 0
}

.l-drawer--right {
    right: 0
}

.l-drawer--top,
.l-drawer--bottom {
    left: 0
}

.l-drawer--top {
    top: 0
}

.l-drawer--bottom {
    bottom: 0
}

.l-drawer__mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--td-mask-active);
    transition: opacity .2s cubic-bezier(.38, 0, .24, 1);
    opacity: 0
}

.l-drawer__content-wrapper {
    display: flex;
    flex-direction: column;
    background: var(--td-bg-color-container);
    width: 16px;
    height: 16px;
    font-size: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    box-shadow: var(--td-shadow-2);
    overflow: hidden;
    pointer-events: auto;
    transition: transform .28s cubic-bezier(.38, 0, .24, 1), visibility .28s cubic-bezier(.38, 0, .24, 1);
    position: relative
}

.l-drawer .l-drawer__content-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    visibility: hidden
}

.l-drawer .l-drawer__content-wrapper--left,
.l-drawer .l-drawer__content-wrapper--right {
    top: 0
}

.l-drawer .l-drawer__content-wrapper--left {
    left: 0;
    transform: translate(-100%)
}

.l-drawer .l-drawer__content-wrapper--right {
    right: 0;
    transform: translate(100%)
}

.l-drawer .l-drawer__content-wrapper--top,
.l-drawer .l-drawer__content-wrapper--bottom {
    left: 0
}

.l-drawer .l-drawer__content-wrapper--top {
    top: 0;
    transform: translateY(-100%)
}

.l-drawer .l-drawer__content-wrapper--bottom {
    bottom: 0;
    transform: translateY(100%)
}

.l-drawer__header {
    display: flex;
    align-items: center;
    min-height: var(--td-comp-size-xxxl);
    padding: 0 var(--td-comp-paddingLR-l);
    font: var(--td-font-title-medium);
    color: var(--td-text-color-primary);
    border-bottom: 1px solid var(--td-border-level-1-color);
    border-radius: var(--td-radius-small) var(--td-radius-small) 0 0;
    box-sizing: border-box
}

.l-drawer__body {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l);
    overflow: auto;
    flex: 1
}

.l-drawer__footer {
    width: 100%;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l);
    text-align: left;
    border-top: 1px solid var(--td-border-level-1-color);
    background-color: var(--td-bg-color-container);
    box-sizing: border-box
}

.l-drawer__footer .l-button {
    margin-left: var(--td-comp-margin-s)
}

.l-drawer__footer .l-button:first-child {
    margin-left: 0
}

.l-drawer__close-btn {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs);
    top: calc((var(--td-comp-size-xxxl) - var(--td-comp-size-xs)) / 2);
    right: var(--td-comp-margin-s);
    color: var(--td-text-color-primary);
    background-color: var(--td-bg-color-container);
    border-radius: var(--td-radius-default);
    cursor: pointer;
    transition: background-color .2s
}

.l-drawer__close-btn:hover {
    background-color: var(--td-bg-color-container-hover)
}

.l-drawer__close-btn:active {
    background-color: var(--td-bg-color-container-active)
}

.l-drawer__close-btn .l-icon {
    font-size: calc(var(--td-font-size-body-medium) + 2px);
    vertical-align: unset
}

.l-drawer--open {
    width: 100%;
    height: 100%;
    pointer-events: auto
}

.l-drawer--open>.l-drawer__content-wrapper {
    visibility: visible
}

.l-drawer--open>.l-drawer__mask {
    opacity: 1;
    width: 100%;
    height: 100%
}

.l-drawer--without-mask {
    pointer-events: none
}

[tabindex="-1"]:focus {
    outline: none !important
}

.l-guide {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-guide--lock {
    overflow: hidden
}

.l-guide--absolute {
    position: absolute
}

.l-guide--fixed {
    position: fixed
}

.l-guide__overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999997
}

.l-guide__highlight {
    z-index: 999998;
    transition: .2s cubic-bezier(0, 0, .15, 1);
    border-radius: var(--td-radius-default)
}

.l-guide__highlight--dialog {
    border-radius: var(--td-radius-large)
}

.l-guide__highlight--mask {
    box-shadow: 0 0 0 0 var(--td-mask-active), var(--td-mask-active) 0 0 0 5000px
}

.l-guide__highlight--nomask {
    border-radius: var(--td-radius-medium);
    border: 2px solid var(--td-brand-color);
    box-sizing: border-box
}

.l-guide__reference {
    z-index: 999999
}

.l-guide__wrapper {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    z-index: 999999;
    padding-top: 20vh
}

.l-guide__wrapper--center {
    padding-top: 0;
    align-items: center
}

.l-guide__dialog {
    min-width: 320px;
    max-width: 500px;
    padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl);
    border-radius: var(--td-radius-large);
    background: var(--td-bg-color-container);
    animation: tGuideDialogFadeIn .3s ease-out;
    box-sizing: border-box
}

.l-guide__dialog--nomask {
    border: 1px solid var(--td-component-border)
}

.l-guide__dialog .l-guide__title {
    font: var(--td-font-title-medium);
    font-weight: 700
}

.l-guide__dialog .l-guide__desc {
    margin-top: var(--td-comp-margin-l);
    font: var(--td-font-body-medium)
}

.l-guide__tooltip {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-s);
    min-width: 240px;
    max-width: 600px;
    max-height: 300px
}

.l-guide__title {
    text-align: left;
    color: var(--td-text-color-primary);
    font: var(--td-font-title-small);
    font-weight: 700
}

.l-guide__desc {
    margin-top: var(--td-comp-margin-s);
    text-align: left;
    color: var(--td-text-color-secondary);
    font: var(--td-font-body-small)
}

.l-guide__action {
    display: flex;
    align-items: center
}

.l-guide__action button {
    margin-right: var(--td-comp-margin-s)
}

.l-guide__action button:last-child {
    margin-right: 0
}

.l-guide__footer {
    display: flex;
    align-items: center
}

.l-guide__footer--popup {
    margin-top: var(--td-comp-margin-l)
}

.l-guide__footer--dialog {
    margin-top: 24px
}

.l-guide__footer--dialog .l-guide__action {
    display: flex;
    justify-content: center
}

.l-guide__counter {
    color: var(--td-text-color-placeholder);
    text-align: left;
    font: var(--td-font-body-small);
    flex: 1
}

.l-guide__popup .l-guide__popup--content {
    background: none;
    box-shadow: none;
    padding: 0
}

@keyframes tGuideDialogFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.l-notification {
    color: var(--td-text-color-primary);
    margin: 0;
    padding: 0;
    list-style: none;
    font: var(--td-font-body-medium);
    outline: 0;
    border: 0;
    background-color: var(--td-bg-color-container);
    display: flex;
    box-shadow: var(--td-shadow-2), var(--td-shadow-inset-top), var(--td-shadow-inset-right), var(--td-shadow-inset-bottom), var(--td-shadow-inset-left);
    box-sizing: border-box;
    border-radius: var(--td-radius-medium);
    width: 360px;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l)
}

.l-notification__icon {
    width: calc(var(--td-font-size-body-large) + 8px);
    text-align: center;
    margin-right: var(--td-comp-margin-s)
}

.l-notification__icon .l-icon {
    font-size: calc(var(--td-font-size-body-large) + 8px)
}

.l-notification .l-icon.l-is-info {
    color: var(--td-brand-color)
}

.l-notification .l-icon.l-is-success {
    color: var(--td-success-color)
}

.l-notification .l-icon.l-is-warning {
    color: var(--td-warning-color)
}

.l-notification .l-icon.l-is-error {
    color: var(--td-error-color-6)
}

.l-notification__main {
    flex: 1
}

.l-notification__title__wrap {
    display: flex;
    justify-content: space-between
}

.l-notification__title {
    font: var(--td-font-title-medium);
    color: var(--td-text-color-primary)
}

.l-notification .l-icon-close {
    cursor: pointer;
    font-size: var(--td-font-size-body-large);
    border-radius: var(--td-radius-default);
    color: var(--td-text-color-secondary)
}

.l-notification .l-icon-close:hover {
    background: var(--td-bg-color-container-hover)
}

.l-notification .l-icon-close:active {
    background: var(--td-bg-color-container-active)
}

.l-notification__content {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    margin-top: var(--td-comp-margin-s);
    max-height: 66px;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.l-notification__detail {
    margin-top: var(--td-comp-margin-l);
    text-align: right;
    font: var(--td-font-body-medium)
}

.l-notification__detail-item {
    cursor: pointer
}

.l-notification__detail-item:hover {
    color: inherit;
    background: var(--td-bg-color-container-hover)
}

.l-notification__detail-item:active {
    color: inherit;
    background: var(--td-bg-color-container-active)
}

.l-notification__detail-item+.l-notification__detail-item {
    margin-left: var(--td-comp-margin-s)
}

.l-notification__detail-item.l-is-active {
    color: var(--td-brand-color)
}

.l-notification__show--top-left {
    position: fixed;
    top: 0;
    left: 0
}

.l-notification__show--top-left>.l-notification {
    animation-duration: .3s;
    animation-name: slidein-top-left
}

@keyframes slidein-top-left {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.l-notification__show--top-right {
    position: fixed;
    top: 0;
    right: 0
}

.l-notification__show--top-right>.l-notification {
    animation-duration: .3s;
    animation-name: slidein-top-right
}

@keyframes slidein-top-right {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.l-notification__show--bottom-left {
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column-reverse
}

.l-notification__show--bottom-left>.l-notification {
    animation-duration: .3s;
    animation-name: slidein-bottom-left
}

@keyframes slidein-bottom-left {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.l-notification__show--bottom-right {
    position: fixed;
    bottom: 0;
    right: 0;
    display: flex;
    flex-direction: column-reverse
}

.l-notification__show--bottom-right>.l-notification {
    animation-duration: .3s;
    animation-name: slidein-bottom-right
}

@keyframes slidein-bottom-right {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.l-notification-list__show {
    position: fixed
}

.l-popconfirm {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
    min-width: 160px;
    border-radius: var(--td-radius-medium)
}

.l-popconfirm .l-popup__content {
    padding: 0
}

.l-popconfirm.l-popup[data-popper-placement^=top] .l-popup__arrow {
    bottom: calc(-var(--td-size-4)/2)
}

.l-popconfirm__content {
    position: relative;
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l);
    border-radius: var(--td-radius-medium)
}

.l-popconfirm__body {
    display: flex;
    align-items: flex-start;
    text-align: left
}

.l-popconfirm__body>.l-icon {
    display: inline-block;
    margin-right: var(--td-comp-margin-s);
    padding: calc(calc(var(--td-line-height-body-medium) - calc(var(--td-font-size-body-medium) + 6px)) / 2) 0;
    font-size: calc(var(--td-font-size-body-medium) + 6px)
}

.l-popconfirm__confirm {
    margin-left: var(--td-comp-margin-s)
}

.l-popconfirm__inner {
    display: inline-block;
    vertical-align: top;
    max-width: 320px;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary)
}

.l-popconfirm__icon--warning {
    color: var(--td-warning-color)
}

.l-popconfirm__icon--danger {
    color: var(--td-error-color)
}

.l-popconfirm__icon--default {
    color: var(--td-brand-color)
}

.l-popconfirm__buttons {
    text-align: right;
    margin-top: var(--td-comp-margin-l)
}

.l-popconfirm__buttons>span:last-child {
    margin-right: 0
}

.l-upload {
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none
}

.l-upload .l-is-bordered {
    border: 1px solid var(--td-component-border)
}

.l-upload .l-upload__trigger {
    display: inline-block
}

.l-upload .l-icon {
    font-size: calc(var(--td-font-size-body-medium) + 2px);
    flex-shrink: 0
}

.l-upload .l-icon-check-circle-filled {
    color: var(--td-success-color)
}

.l-upload .l-icon-error-circle-filled {
    color: var(--td-error-color)
}

.l-upload .l-icon-time-filled {
    color: var(--td-text-color-placeholder)
}

.l-upload .l-icon-add {
    color: var(--td-text-color-primary)
}

.l-upload__list-file {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    margin-right: var(--td-comp-margin-m);
    overflow: hidden
}

.l-upload__list-file .l-icon {
    font-size: var(--td-comp-size-xl);
    color: var(--td-brand-color)
}

.l-upload__list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--td-comp-margin-m);
    width: 496px;
    height: 124px;
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);
    border: 1px solid var(--td-component-border);
    border-radius: var(--td-radius-default);
    font: var(--td-font-body-medium)
}

.l-upload__list-item.l-is--error .l-upload__list-name,
.l-upload__list-item.l-is--error .l-upload__list-file .l-icon {
    color: var(--td-error-color)
}

.l-upload__list-content {
    display: flex;
    align-items: center
}

.l-upload-list__control {
    cursor: pointer
}

.l-upload-list__control:hover {
    color: var(--td-error-color)
}

.l-upload__list-img {
    object-fit: cover;
    max-width: 100%;
    max-height: 100%;
    cursor: pointer
}

.l-upload__list-name {
    max-width: 200px;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-upload--highlight {
    color: var(--td-text-color-brand)
}

.l-upload__single-name {
    margin-right: var(--td-comp-margin-s)
}

.l-upload__card {
    font: var(--td-font-body-small);
    overflow: hidden;
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--td-comp-margin-s)
}

.l-upload__card .l-is-disabled :hover {
    cursor: not-allowed
}

.l-upload__card-item {
    cursor: pointer;
    box-sizing: border-box;
    list-style: none
}

.l-upload__card-item:after {
    content: "";
    display: block
}

.l-upload__card-item:hover .l-upload__card-mask {
    opacity: 1;
    transition: opacity .2s linear
}

.l-upload__card-item.l-is--error .l-icon-warning_fill {
    color: var(--td-error-color);
    margin-bottom: var(--td-comp-margin-s)
}

.l-upload__card-item.l-is--error .l-upload__card-status {
    color: var(--td-error-color)
}

.l-upload__card-item.l-is-background {
    transition: border-color .2s linear
}

.l-upload__card .l-icon-loading {
    margin-bottom: var(--td-comp-margin-s)
}

.l-upload__card-name {
    max-width: 100%;
    margin-top: var(--td-comp-margin-s);
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-upload__card-content {
    position: relative;
    width: 110px;
    height: 110px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    background-color: var(--td-bg-color-secondarycontainer);
    border: 1px dashed var(--td-component-border);
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
    border-radius: var(--td-radius-default)
}

.l-upload__card-container {
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: var(--td-bg-color-secondarycontainer);
    border: 1px dashed var(--td-component-border);
    box-sizing: border-box;
    position: relative;
    border-radius: var(--td-radius-default);
    transition: border .2s linear
}

.l-upload__card-container:hover:not(.l-is-disabled) {
    border-color: var(--td-brand-color);
    transition: border-color .2s linear
}

.l-upload__card-container>.l-icon {
    color: var(--td-text-color-placeholder)
}

.l-upload__card-container>.l-icon,
.l-upload__card-container .l-loading {
    font-size: var(--td-comp-size-xs);
    margin-bottom: var(--td-comp-margin-s)
}

.l-upload__card-container>p,
.l-upload__card-container .l-upload__add-text {
    color: var(--td-text-color-placeholder);
    margin: 0
}

.l-upload__card-status-wrap {
    text-align: center
}

.l-upload__card-status-wrap>svg {
    margin-bottom: var(--td-comp-margin-s)
}

.l-upload__card-status-wrap .l-icon,
.l-upload__card-status-wrap .l-loading {
    font-size: var(--td-comp-size-xs)
}

.l-upload__card-image {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%
}

.l-upload__card-status {
    color: var(--td-text-color-disabled);
    font: var(--td-font-body-small)
}

.l-upload__card-mask {
    background-color: var(--td-mask-active);
    color: var(--td-text-color-anti);
    will-change: transform;
    opacity: 0;
    z-index: 2;
    transition: opacity .2s linear;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.l-upload__card-mask-item-divider {
    margin: 0 var(--td-comp-margin-l);
    border-left: 1px var(--td-text-color-anti) solid;
    height: var(--td-comp-size-xxxs)
}

.l-upload__card-mask-item>.l-icon {
    cursor: pointer;
    font-size: calc(var(--td-font-size-body-medium) + 2px)
}

.l-upload__dialog .l-dialog {
    max-width: 80%
}

.l-upload__dialog .l-dialog--default {
    padding: 32px
}

.l-upload__dialog .l-dialog-body {
    padding-bottom: 0
}

.l-upload__dialog .l-dialog-body-img-box img {
    display: block;
    max-width: 100%;
    max-height: 100%
}

.l-upload__dragger {
    display: flex;
    width: 336px;
    height: 144px;
    border: 1px dashed var(--td-component-border);
    border-radius: var(--td-radius-small);
    font: var(--td-font-body-medium);
    color: var(--td-text-color-secondary);
    cursor: pointer;
    padding: var(--td-comp-margin-l);
    position: relative;
    overflow: auto;
    box-sizing: border-box;
    transition: border-color .2s linear
}

.l-upload__dragger.l-is--active {
    background-color: var(--td-bg-color-container-active);
    border-color: var(--td-brand-color)
}

.l-upload__dragger:hover {
    border-color: var(--td-brand-color)
}

.l-upload__dragger-btns {
    position: absolute;
    bottom: var(--td-comp-margin-l)
}

.l-upload__dragger .l-size-s {
    display: block
}

.l-upload__dragger-center {
    justify-content: center;
    align-items: center
}

.l-upload__dragger-error,
.l-upload__dragger-error:hover {
    border-color: var(--td-error-color)
}

.l-upload__dragger-text {
    display: flex;
    align-items: center;
    font: var(--td-font-body-medium);
    color: var(--td-text-color-primary);
    margin-bottom: var(--td-comp-margin-s);
    max-width: calc(336px - var(--td-comp-margin-l) * 2 - 0)
}

.l-upload__dragger-text .l-upload__single-name {
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-upload__tips {
    display: block;
    color: var(--td-text-color-placeholder);
    margin-top: var(--td-comp-margin-s);
    font: var(--td-font-body-small)
}

.l-upload__tips.l-upload__tips-error {
    color: var(--td-error-color)
}

.l-upload__tips.l-upload__tips-warn {
    color: var(--td-warning-color)
}

.l-upload__placeholder {
    color: var(--td-text-color-placeholder)
}

.l-upload__display-text--margin {
    margin-top: var(--td-comp-margin-s)
}

.l-upload__single-display-text {
    color: var(--td-text-color-secondary);
    font: var(--td-font-body-small);
    display: flex;
    align-items: center
}

.l-upload__single-display-text .l-upload__flow-status .l-icon {
    font-size: calc(var(--td-font-size-body-medium) + 2px)
}

.l-icon-clear-circle-filled {
    color: var(--td-text-color-placeholder);
    margin-top: var(--td-comp-margin-xxs);
    transition: color .2s linear
}

.l-icon-clear-circle-filled:hover {
    color: var(--td-text-color-secondary);
    cursor: pointer;
    transition: color .2s linear
}

.l-upload__single-percent {
    margin-left: var(--td-comp-margin-xs)
}

.l-upload__single-progress {
    color: var(--td-brand-color);
    display: flex;
    align-items: center
}

.l-upload__single-progress .l-loading {
    font-size: calc(var(--td-font-size-body-medium) + 2px);
    flex-shrink: 0
}

.l-upload__single-input-delete {
    margin-left: var(--td-comp-margin-l);
    font: var(--td-font-body-medium);
    color: var(--td-brand-color);
    cursor: pointer
}

.l-upload__single-input-preview {
    display: flex;
    justify-content: space-between;
    flex: 1
}

.l-upload__single-input-text {
    display: block;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    text-overflow: ellipsis
}

.l-upload__single-file-input {
    display: flex;
    align-items: center
}

.l-upload__single-file-input .l-upload__trigger {
    margin-left: var(--td-comp-margin-l)
}

.l-upload__single-file-input .l-upload__single-progress {
    white-space: nowrap
}

.l-upload__single-file-input .l-input__inner {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.l-upload__dragger-progress {
    width: 100%;
    display: flex
}

.l-upload__dragger-progress .l-icon,
.l-upload__dragger-progress .l-loading {
    font-size: calc(var(--td-font-size-body-medium) + 2px);
    flex-shrink: 0
}

.l-upload__dragger-img-wrap {
    width: 110px;
    height: 110px;
    background-color: var(--td-bg-color-secondarycontainer);
    border-radius: var(--td-radius-default);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.l-upload__dragger-img-wrap>.l-image__wrapper--shape-square {
    width: 100%
}

.l-upload__dragger-img-wrap>.l-image__wrapper--shape-square .l-space-item {
    text-align: center
}

.l-upload__dragger-img-wrap>img {
    max-width: 100%;
    max-height: 100%
}

.l-upload__dragger-img-wrap+.l-upload__dragger-progress-info {
    margin-left: var(--td-comp-margin-l);
    max-width: calc(336px - var(--td-comp-margin-l) * 2 - calc(110px + var(--td-comp-margin-l)))
}

.l-upload__dragger-progress-info {
    flex: 1
}

.l-upload__dragger-progress-info .l-upload__single-display-text {
    margin-bottom: var(--td-comp-margin-s)
}

.l-upload__dragger-progress-info .l-button:hover {
    background-color: transparent
}

.l-upload__dragger-progress-cancel,
.l-upload__dragger-progress-reupload {
    margin-right: var(--td-comp-margin-l)
}

.l-upload__dragger-progress-cancel:hover,
.l-upload__dragger-progress-reupload:hover,
.l-upload__dragger-delete-btn:hover,
.l-upload__dragger-upload-btn:hover {
    border-color: transparent
}

.l-upload__flow-image-flow {
    width: 498px
}

.l-upload__flow {
    min-width: 498px;
    max-width: 960px
}

.l-upload__flow-placeholder {
    display: inline-block;
    margin-left: var(--td-comp-margin-l)
}

.l-upload__flow-op {
    display: flex;
    align-items: center
}

.l-upload__flow-bottom {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--td-comp-margin-xxl)
}

.l-upload__flow-bottom .l-button+.l-button {
    margin-left: var(--td-comp-margin-s)
}

.l-upload__flow-empty {
    width: 100%;
    height: 184px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--td-text-color-placeholder)
}

.l-upload__flow-table {
    width: 100%;
    border: 1px dashed var(--td-component-border);
    margin-top: var(--td-comp-margin-xxl);
    border-collapse: collapse
}

.l-upload__flow-table>thead>tr,
.l-upload__flow-table>tbody>tr,
.l-upload__flow-table>tfoot>tr,
.l-upload__flow-table>tr {
    border-top: 1px solid var(--td-component-border)
}

.l-upload__flow-table>thead>tr>th,
.l-upload__flow-table>tbody>tr>th,
.l-upload__flow-table>tfoot>tr>th,
.l-upload__flow-table>tr>th {
    color: var(--td-text-color-placeholder);
    font-weight: 400;
    border: 1px solid var(--td-component-border);
    text-align: left;
    background-color: var(--td-bg-color-container)
}

.l-upload__flow-table>thead>tr>td,
.l-upload__flow-table>tbody>tr>td,
.l-upload__flow-table>tfoot>tr>td,
.l-upload__flow-table>tr>td {
    color: var(--td-text-color-primary)
}

.l-upload__flow-table>thead>tr>td,
.l-upload__flow-table>tbody>tr>td,
.l-upload__flow-table>tfoot>tr>td,
.l-upload__flow-table>tr>td,
.l-upload__flow-table>thead>tr>th,
.l-upload__flow-table>tbody>tr>th,
.l-upload__flow-table>tfoot>tr>th,
.l-upload__flow-table>tr>th {
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l)
}

.l-upload__flow-table__batch-row {
    border-left: 1px solid var(--td-component-border)
}

.l-upload__flow-button {
    color: var(--td-text-color-placeholder);
    cursor: pointer;
    transition: color .2s linear
}

.l-upload__flow-button:hover {
    color: var(--td-text-color-secondary)
}

.l-upload__flow-status {
    display: flex;
    align-items: center
}

.l-upload__flow-status .l-icon,
.l-upload__flow-status .l-loading {
    margin-right: var(--td-comp-margin-s);
    font-size: calc(var(--td-font-size-body-medium) + 2px)
}

.l-upload__flow-card-area {
    border: 1px dashed var(--td-component-border);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);
    margin-top: var(--td-comp-margin-xxl);
    transition: border .2s linear
}

.l-upload__flow-card-area:hover {
    border-color: var(--td-brand-color);
    transition: border-color .2s linear
}

.l-upload__icon-delete,
.l-upload__single-input-clear {
    color: var(--td-text-color-placeholder);
    cursor: pointer;
    transition: color .2s linear
}

.l-upload__icon-delete:hover,
.l-upload__single-input-clear:hover {
    color: var(--td-text-color-secondary);
    transition: color .2s linear
}

.l-icon.l-upload__single-input-clear {
    display: none
}

.l-upload__single-input-preview:hover .l-upload__single-input-clear {
    display: initial
}

.l-upload__single-input-preview:hover .l-upload__status-icon {
    display: none
}

.l-upload .l-upload__single-name {
    color: var(--td-text-color-secondary)
}

.l-upload .l-upload__file-thumbnail {
    margin-right: var(--td-comp-paddingLR-s);
    width: var(--td-comp-size-xxl);
    height: var(--td-comp-size-xxl);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

.l-upload .l-upload__file-thumbnail>svg {
    font-size: var(--td-comp-size-s);
    color: var(--td-text-color-placeholder)
}

.l-upload__card-name {
    margin-top: 8px
}

.l-upload--theme-file-input {
    width: 100%
}

.l-upload__dragger-btns>.l-button {
    padding: 0
}

.l-upload__file-info {
    display: flex;
    align-items: center
}

.l-upload__card-container.l-is-disabled {
    cursor: not-allowed
}

.l-upload__card-container.l-is-disabled .l-upload__add-text,
.l-upload__card-container.l-is-disabled .l-icon {
    color: var(--td-text-color-disabled)
}

:root {
    --td-screen-xs: 320px;
    --td-screen-sm: 768px;
    --td-screen-md: 992px;
    --td-screen-lg: 1200px;
    --td-screen-xl: 1400px;
    --td-screen-xxl: 1880px
}

@-moz-document url-prefix() {
    .narrow-scrollbar {
        scrollbar-color: var(--td-scrollbar-color) transparent;
        scrollbar-width: thin
    }
}

.narrow-scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.narrow-scrollbar::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    background-clip: content-box;
    background-color: var(--td-scrollbar-color);
    border-radius: 15px
}

.narrow-scrollbar::-webkit-scrollbar-thumb:vertical:hover,
.narrow-scrollbar::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: var(--td-scrollbar-hover-color)
}

.l-fake-arrow path {
    transition: d .2s;
    stroke: currentcolor
}

.l-fake-arrow--active path {
    d: path("M3.75 10.2002L7.99274 5.7998L12.2361 10.0425")
}

.l-slide-down-enter-active,
.l-slide-down-leave-active {
    transition: height .2s cubic-bezier(.38, 0, .24, 1)
}

:root,
:root[theme-mode=light] {
    --td-brand-color-1: #f2f3ff;
    --td-brand-color-2: #d9e1ff;
    --td-brand-color-3: #b5c7ff;
    --td-brand-color-4: #8eabff;
    --td-brand-color-5: #618dff;
    --td-brand-color-6: #366ef4;
    --td-brand-color-7: #0052d9;
    --td-brand-color-8: #003cab;
    --td-brand-color-9: #002a7c;
    --td-brand-color-10: #001a57;
    --td-warning-color-1: #fff1e9;
    --td-warning-color-2: #ffd9c2;
    --td-warning-color-3: #ffb98c;
    --td-warning-color-4: #fa9550;
    --td-warning-color-5: #e37318;
    --td-warning-color-6: #be5a00;
    --td-warning-color-7: #954500;
    --td-warning-color-8: #713300;
    --td-warning-color-9: #532300;
    --td-warning-color-10: #3b1700;
    --td-error-color-1: #fff0ed;
    --td-error-color-2: #ffd8d2;
    --td-error-color-3: #ffb9b0;
    --td-error-color-4: #ff9285;
    --td-error-color-5: #f6685d;
    --td-error-color-6: #d54941;
    --td-error-color-7: #ad352f;
    --td-error-color-8: #881f1c;
    --td-error-color-9: #68070a;
    --td-error-color-10: #490002;
    --td-success-color-1: #e3f9e9;
    --td-success-color-2: #c6f3d7;
    --td-success-color-3: #92dab2;
    --td-success-color-4: #56c08d;
    --td-success-color-5: #2ba471;
    --td-success-color-6: #008858;
    --td-success-color-7: #006c45;
    --td-success-color-8: #005334;
    --td-success-color-9: #003b23;
    --td-success-color-10: #002515;
    --td-gray-color-1: #f3f3f3;
    --td-gray-color-2: #eee;
    --td-gray-color-3: #e8e8e8;
    --td-gray-color-4: #ddd;
    --td-gray-color-5: #c6c6c6;
    --td-gray-color-6: #a6a6a6;
    --td-gray-color-7: #8b8b8b;
    --td-gray-color-8: #777;
    --td-gray-color-9: #5e5e5e;
    --td-gray-color-10: #4b4b4b;
    --td-gray-color-11: #393939;
    --td-gray-color-12: #2c2c2c;
    --td-gray-color-13: #242424;
    --td-gray-color-14: #181818;
    --td-font-white-1: rgba(255, 255, 255, .9);
    --td-font-white-2: rgba(255, 255, 255, .55);
    --td-font-white-3: rgba(255, 255, 255, .35);
    --td-font-white-4: rgba(255, 255, 255, .22);
    --td-font-gray-1: rgba(0, 0, 0, .9);
    --td-font-gray-2: rgba(0, 0, 0, .6);
    --td-font-gray-3: rgba(0, 0, 0, .4);
    --td-font-gray-4: rgba(0, 0, 0, .26);
    --td-brand-color: var(--td-brand-color-7);
    --td-warning-color: var(--td-warning-color-5);
    --td-error-color: var(--td-error-color-6);
    --td-success-color: var(--td-success-color-5);
    --td-brand-color-hover: var(--td-brand-color-6);
    --td-brand-color-focus: var(--td-brand-color-2);
    --td-brand-color-active: var(--td-brand-color-8);
    --td-brand-color-disabled: var(--td-brand-color-3);
    --td-brand-color-light: var(--td-brand-color-1);
    --td-brand-color-light-hover: var(--td-brand-color-2);
    --td-warning-color-hover: var(--td-warning-color-4);
    --td-warning-color-focus: var(--td-warning-color-2);
    --td-warning-color-active: var(--td-warning-color-6);
    --td-warning-color-disabled: var(--td-warning-color-3);
    --td-warning-color-light: var(--td-warning-color-1);
    --td-warning-color-light-hover: var(--td-warning-color-2);
    --td-error-color-hover: var(--td-error-color-5);
    --td-error-color-focus: var(--td-error-color-2);
    --td-error-color-active: var(--td-error-color-7);
    --td-error-color-disabled: var(--td-error-color-3);
    --td-error-color-light: var(--td-error-color-1);
    --td-error-color-light-hover: var(--td-error-color-2);
    --td-success-color-hover: var(--td-success-color-4);
    --td-success-color-focus: var(--td-success-color-2);
    --td-success-color-active: var(--td-success-color-6);
    --td-success-color-disabled: var(--td-success-color-3);
    --td-success-color-light: var(--td-success-color-1);
    --td-success-color-light-hover: var(--td-success-color-2);
    --td-mask-active: rgba(0, 0, 0, .6);
    --td-mask-disabled: rgba(255, 255, 255, .6);
    --td-bg-color-page: var(--td-gray-color-2);
    --td-bg-color-container: #fff;
    --td-bg-color-container-hover: var(--td-gray-color-1);
    --td-bg-color-container-active: var(--td-gray-color-3);
    --td-bg-color-container-select: #fff;
    --td-bg-color-secondarycontainer: var(--td-gray-color-1);
    --td-bg-color-secondarycontainer-hover: var(--td-gray-color-2);
    --td-bg-color-secondarycontainer-active: var(--td-gray-color-4);
    --td-bg-color-component: var(--td-gray-color-3);
    --td-bg-color-component-hover: var(--td-gray-color-4);
    --td-bg-color-component-active: var(--td-gray-color-6);
    --td-bg-color-secondarycomponent: var(--td-gray-color-4);
    --td-bg-color-secondarycomponent-hover: var(--td-gray-color-5);
    --td-bg-color-secondarycomponent-active: var(--td-gray-color-6);
    --td-bg-color-component-disabled: var(--td-gray-color-2);
    --td-bg-color-specialcomponent: #fff;
    --td-text-color-primary: var(--td-font-gray-1);
    --td-text-color-secondary: var(--td-font-gray-2);
    --td-text-color-placeholder: var(--td-font-gray-3);
    --td-text-color-disabled: var(--td-font-gray-4);
    --td-text-color-anti: #fff;
    --td-text-color-brand: var(--td-brand-color-7);
    --td-text-color-link: var(--td-brand-color-8);
    --td-border-level-1-color: var(--td-gray-color-3);
    --td-component-stroke: var(--td-gray-color-3);
    --td-border-level-2-color: var(--td-gray-color-4);
    --td-component-border: var(--td-gray-color-4);
    --td-shadow-1: 0 1px 10px rgba(0, 0, 0, .05), 0 4px 5px rgba(0, 0, 0, 8%), 0 2px 4px -1px rgba(0, 0, 0, 12%);
    --td-shadow-2: 0 3px 14px 2px rgba(0, 0, 0, .05), 0 8px 10px 1px rgba(0, 0, 0, 6%), 0 5px 5px -3px rgba(0, 0, 0, 10%);
    --td-shadow-3: 0 6px 30px 5px rgba(0, 0, 0, .05), 0 16px 24px 2px rgba(0, 0, 0, 4%), 0 8px 10px -5px rgba(0, 0, 0, 8%);
    --td-shadow-inset-top: inset 0 .5px 0 #dcdcdc;
    --td-shadow-inset-right: inset .5px 0 0 #dcdcdc;
    --td-shadow-inset-bottom: inset 0 -.5px 0 #dcdcdc;
    --td-shadow-inset-left: inset -.5px 0 0 #dcdcdc;
    --td-table-shadow-color: rgba(0, 0, 0, .08);
    --td-scrollbar-color: rgba(0, 0, 0, .1);
    --td-scrollbar-hover-color: rgba(0, 0, 0, .3);
    --td-scroll-track-color: #fff
}

:root[theme-mode=dark] {
    --td-brand-color-1: #1b2f51;
    --td-brand-color-2: #173463;
    --td-brand-color-3: #143975;
    --td-brand-color-4: #103d88;
    --td-brand-color-5: #0d429a;
    --td-brand-color-6: #054bbe;
    --td-brand-color-7: #2667d4;
    --td-brand-color-8: #4582e6;
    --td-brand-color-9: #699ef5;
    --td-brand-color-10: #96bbf8;
    --td-warning-color-1: #4f2a1d;
    --td-warning-color-2: #582f21;
    --td-warning-color-3: #733c23;
    --td-warning-color-4: #a75d2b;
    --td-warning-color-5: #cf6e2d;
    --td-warning-color-6: #dc7633;
    --td-warning-color-7: #e8935c;
    --td-warning-color-8: #ecbf91;
    --td-warning-color-9: #eed7bf;
    --td-warning-color-10: #f3e9dc;
    --td-error-color-1: #472324;
    --td-error-color-2: #5e2a2d;
    --td-error-color-3: #703439;
    --td-error-color-4: #83383e;
    --td-error-color-5: #a03f46;
    --td-error-color-6: #c64751;
    --td-error-color-7: #de6670;
    --td-error-color-8: #ec888e;
    --td-error-color-9: #edb1b6;
    --td-error-color-10: #eeced0;
    --td-success-color-1: #193a2a;
    --td-success-color-2: #1a4230;
    --td-success-color-3: #17533d;
    --td-success-color-4: #0d7a55;
    --td-success-color-5: #059465;
    --td-success-color-6: #43af8a;
    --td-success-color-7: #46bf96;
    --td-success-color-8: #80d2b6;
    --td-success-color-9: #b4e1d3;
    --td-success-color-10: #deede8;
    --td-gray-color-1: #f3f3f3;
    --td-gray-color-2: #eee;
    --td-gray-color-3: #e8e8e8;
    --td-gray-color-4: #ddd;
    --td-gray-color-5: #c6c6c6;
    --td-gray-color-6: #a6a6a6;
    --td-gray-color-7: #8b8b8b;
    --td-gray-color-8: #777;
    --td-gray-color-9: #5e5e5e;
    --td-gray-color-10: #4b4b4b;
    --td-gray-color-11: #393939;
    --td-gray-color-12: #2c2c2c;
    --td-gray-color-13: #242424;
    --td-gray-color-14: #181818;
    --td-font-white-1: rgba(255, 255, 255, .9);
    --td-font-white-2: rgba(255, 255, 255, .55);
    --td-font-white-3: rgba(255, 255, 255, .35);
    --td-font-white-4: rgba(255, 255, 255, .22);
    --td-font-gray-1: rgba(0, 0, 0, .9);
    --td-font-gray-2: rgba(0, 0, 0, .6);
    --td-font-gray-3: rgba(0, 0, 0, .4);
    --td-font-gray-4: rgba(0, 0, 0, .26);
    --td-brand-color: var(--td-brand-color-8);
    --td-warning-color: var(--td-warning-color-5);
    --td-error-color: var(--td-error-color-6);
    --td-success-color: var(--td-success-color-5);
    --td-brand-color-hover: var(--td-brand-color-7);
    --td-brand-color-focus: var(--td-brand-color-2);
    --td-brand-color-active: var(--td-brand-color-9);
    --td-brand-color-disabled: var(--td-brand-color-3);
    --td-brand-color-light: var(--td-brand-color-1);
    --td-brand-color-light-hover: var(--td-brand-color-2);
    --td-warning-color-hover: var(--td-warning-color-4);
    --td-warning-color-focus: var(--td-warning-color-2);
    --td-warning-color-active: var(--td-warning-color-6);
    --td-warning-color-disabled: var(--td-warning-color-3);
    --td-warning-color-light: var(--td-warning-color-1);
    --td-warning-color-light-hover: var(--td-warning-color-2);
    --td-error-color-hover: var(--td-error-color-5);
    --td-error-color-focus: var(--td-error-color-2);
    --td-error-color-active: var(--td-error-color-7);
    --td-error-color-disabled: var(--td-error-color-3);
    --td-error-color-light: var(--td-error-color-1);
    --td-error-color-light-hover: var(--td-error-color-2);
    --td-success-color-hover: var(--td-success-color-4);
    --td-success-color-focus: var(--td-success-color-2);
    --td-success-color-active: var(--td-success-color-6);
    --td-success-color-disabled: var(--td-success-color-3);
    --td-success-color-light: var(--td-success-color-1);
    --td-success-color-light-hover: var(--td-success-color-2);
    --td-mask-active: rgba(0, 0, 0, .4);
    --td-mask-disabled: rgba(0, 0, 0, .6);
    --td-bg-color-page: var(--td-gray-color-14);
    --td-bg-color-container: var(--td-gray-color-13);
    --td-bg-color-container-hover: var(--td-gray-color-12);
    --td-bg-color-container-active: var(--td-gray-color-10);
    --td-bg-color-container-select: var(--td-gray-color-9);
    --td-bg-color-secondarycontainer: var(--td-gray-color-12);
    --td-bg-color-secondarycontainer-hover: var(--td-gray-color-11);
    --td-bg-color-secondarycontainer-active: var(--td-gray-color-9);
    --td-bg-color-component: var(--td-gray-color-11);
    --td-bg-color-component-hover: var(--td-gray-color-10);
    --td-bg-color-component-active: var(--td-gray-color-9);
    --td-bg-color-secondarycomponent: var(--td-gray-color-10);
    --td-bg-color-secondarycomponent-hover: var(--td-gray-color-9);
    --td-bg-color-secondarycomponent-active: var(--td-gray-color-8);
    --td-bg-color-component-disabled: var(--td-gray-color-12);
    --td-bg-color-specialcomponent: transparent;
    --td-text-color-primary: var(--td-font-white-1);
    --td-text-color-secondary: var(--td-font-white-2);
    --td-text-color-placeholder: var(--td-font-white-3);
    --td-text-color-disabled: var(--td-font-white-4);
    --td-text-color-anti: #fff;
    --td-text-color-brand: var(--td-brand-color-8);
    --td-text-color-link: var(--td-brand-color-8);
    --td-border-level-1-color: var(--td-gray-color-11);
    --td-component-stroke: var(--td-gray-color-11);
    --td-border-level-2-color: var(--td-gray-color-9);
    --td-component-border: var(--td-gray-color-9);
    --td-shadow-1: 0 4px 6px rgba(0, 0, 0, .06), 0 1px 10px rgba(0, 0, 0, 8%), 0 2px 4px rgba(0, 0, 0, 12%);
    --td-shadow-2: 0 8px 10px rgba(0, 0, 0, .12), 0 3px 14px rgba(0, 0, 0, 10%), 0 5px 5px rgba(0, 0, 0, 16%);
    --td-shadow-3: 0 16px 24px rgba(0, 0, 0, .14), 0 6px 30px rgba(0, 0, 0, 12%), 0 8px 10px rgba(0, 0, 0, 20%);
    --td-shadow-inset-top: inset 0 .5px 0 #5e5e5e;
    --td-shadow-inset-right: inset .5px 0 0 #5e5e5e;
    --td-shadow-inset-bottom: inset 0 -.5px 0 #5e5e5e;
    --td-shadow-inset-left: inset -.5px 0 0 #5e5e5e;
    --td-table-shadow-color: rgba(0, 0, 0, .55);
    --td-scrollbar-color: rgba(255, 255, 255, .1);
    --td-scrollbar-hover-color: rgba(255, 255, 255, .3);
    --td-scroll-track-color: #333
}

:root {
    --td-radius-small: 2px;
    --td-radius-default: 3px;
    --td-radius-medium: 6px;
    --td-radius-large: 9px;
    --td-radius-extraLarge: 12px;
    --td-radius-round: 999px;
    --td-radius-circle: 50%
}

:root {
    --td-font-family: PingFang SC, Microsoft YaHei, Arial Regular;
    --td-font-family-medium: PingFang SC, Microsoft YaHei, Arial Medium;
    --td-font-size-link-small: 12px;
    --td-font-size-link-medium: 14px;
    --td-font-size-link-large: 16px;
    --td-font-size-mark-small: 12px;
    --td-font-size-mark-medium: 14px;
    --td-font-size-body-small: 12px;
    --td-font-size-body-medium: 14px;
    --td-font-size-body-large: 16px;
    --td-font-size-title-small: 14px;
    --td-font-size-title-medium: 16px;
    --td-font-size-title-large: 20px;
    --td-font-size-headline-small: 24px;
    --td-font-size-headline-medium: 28px;
    --td-font-size-headline-large: 36px;
    --td-font-size-display-medium: 48px;
    --td-font-size-display-large: 64px;
    --td-line-height-link-small: 20px;
    --td-line-height-link-medium: 22px;
    --td-line-height-link-large: 24px;
    --td-line-height-mark-small: 20px;
    --td-line-height-mark-medium: 22px;
    --td-line-height-body-small: 20px;
    --td-line-height-body-medium: 22px;
    --td-line-height-body-large: 24px;
    --td-line-height-title-small: 22px;
    --td-line-height-title-medium: 24px;
    --td-line-height-title-large: 28px;
    --td-line-height-headline-small: 32px;
    --td-line-height-headline-medium: 36px;
    --td-line-height-headline-large: 44px;
    --td-line-height-display-medium: 56px;
    --td-line-height-display-large: 72px;
    --td-font-link-small: var(--td-font-size-link-small) / var(--td-line-height-link-small) var(--td-font-family);
    --td-font-link-medium: var(--td-font-size-link-medium) / var(--td-line-height-link-medium) var(--td-font-family);
    --td-font-link-large: var(--td-font-size-link-large) / var(--td-line-height-link-large) var(--td-font-family);
    --td-font-mark-small: 600 var(--td-font-size-mark-small) / var(--td-line-height-mark-small) var(--td-font-family);
    --td-font-mark-medium: 600 var(--td-font-size-mark-medium) / var(--td-line-height-mark-medium) var(--td-font-family);
    --td-font-body-small: var(--td-font-size-body-small) / var(--td-line-height-body-small) var(--td-font-family);
    --td-font-body-medium: var(--td-font-size-body-medium) / var(--td-line-height-body-medium) var(--td-font-family);
    --td-font-body-large: var(--td-font-size-body-large) / var(--td-line-height-body-large) var(--td-font-family);
    --td-font-title-small: 600 var(--td-font-size-title-small) / var(--td-line-height-title-small) var(--td-font-family);
    --td-font-title-medium: 600 var(--td-font-size-title-medium) / var(--td-line-height-title-medium) var(--td-font-family);
    --td-font-title-large: 600 var(--td-font-size-title-large) / var(--td-line-height-title-large) var(--td-font-family);
    --td-font-headline-small: 600 var(--td-font-size-headline-small) / var(--td-line-height-headline-small) var(--td-font-family);
    --td-font-headline-medium: 600 var(--td-font-size-headline-medium) / var(--td-line-height-headline-medium) var(--td-font-family);
    --td-font-headline-large: 600 var(--td-font-size-headline-large) / var(--td-line-height-headline-large) var(--td-font-family);
    --td-font-display-medium: 600 var(--td-font-size-display-medium) / var(--td-line-height-display-medium) var(--td-font-family);
    --td-font-display-large: 600 var(--td-font-size-display-large) / var(--td-line-height-display-large) var(--td-font-family)
}

:root {
    --td-size-1: 2px;
    --td-size-2: 4px;
    --td-size-3: 6px;
    --td-size-4: 8px;
    --td-size-5: 12px;
    --td-size-6: 16px;
    --td-size-7: 20px;
    --td-size-8: 24px;
    --td-size-9: 28px;
    --td-size-10: 32px;
    --td-size-11: 36px;
    --td-size-12: 40px;
    --td-size-13: 48px;
    --td-size-14: 56px;
    --td-size-15: 64px;
    --td-size-16: 72px;
    --td-comp-size-xxxs: var(--td-size-6);
    --td-comp-size-xxs: var(--td-size-7);
    --td-comp-size-xs: var(--td-size-8);
    --td-comp-size-s: var(--td-size-9);
    --td-comp-size-m: var(--td-size-10);
    --td-comp-size-l: var(--td-size-11);
    --td-comp-size-xl: var(--td-size-12);
    --td-comp-size-xxl: var(--td-size-13);
    --td-comp-size-xxxl: var(--td-size-14);
    --td-comp-size-xxxxl: var(--td-size-15);
    --td-comp-size-xxxxxl: var(--td-size-16);
    --td-pop-padding-s: var(--td-size-2);
    --td-pop-padding-m: var(--td-size-3);
    --td-pop-padding-l: var(--td-size-4);
    --td-pop-padding-xl: var(--td-size-5);
    --td-pop-padding-xxl: var(--td-size-6);
    --td-comp-paddingLR-xxs: var(--td-size-1);
    --td-comp-paddingLR-xs: var(--td-size-2);
    --td-comp-paddingLR-s: var(--td-size-4);
    --td-comp-paddingLR-m: var(--td-size-5);
    --td-comp-paddingLR-l: var(--td-size-6);
    --td-comp-paddingLR-xl: var(--td-size-8);
    --td-comp-paddingLR-xxl: var(--td-size-10);
    --td-comp-paddingTB-xxs: var(--td-size-1);
    --td-comp-paddingTB-xs: var(--td-size-2);
    --td-comp-paddingTB-s: var(--td-size-4);
    --td-comp-paddingTB-m: var(--td-size-5);
    --td-comp-paddingTB-l: var(--td-size-6);
    --td-comp-paddingTB-xl: var(--td-size-8);
    --td-comp-paddingTB-xxl: var(--td-size-10);
    --td-comp-margin-xxs: var(--td-size-1);
    --td-comp-margin-xs: var(--td-size-2);
    --td-comp-margin-s: var(--td-size-4);
    --td-comp-margin-m: var(--td-size-5);
    --td-comp-margin-l: var(--td-size-6);
    --td-comp-margin-xl: var(--td-size-7);
    --td-comp-margin-xxl: var(--td-size-8);
    --td-comp-margin-xxxl: var(--td-size-10);
    --td-comp-margin-xxxxl: var(--td-size-12)
}

.ldesign-coverlist {
    --coverlist-item-width: calc(var(--td-comp-size-l) * 5);
    --coverlist-radius: var(--td-radius-default);
    display: grid;
    list-style: none;
    margin: 0;
    width: 100%;
    padding: 0;
    grid-template-columns: repeat(var(--coverlist-fittype), minmax(var(--coverlist-item-width), 1fr));
    gap: var(--coverlist-gap, var(--td-comp-margin-m))
}

.ldesign-coverlist.auto-adjust {
    grid-template-columns: repeat(auto-fit, minmax(var(--coverlist-item-width), 1fr))
}

.ldesign-coverlist.is-layout--cell .ldesign-coverlist__item {
    display: flex;
    flex-direction: row;
    align-items: center
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas: "cover title action" "cover description description";
    gap: calc(var(--td-comp-margin-xxs) / 2) var(--td-comp-margin-s)
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__item:not(.has-action) {
    grid-template-columns: auto 1fr;
    grid-template-areas: "cover title" "cover description"
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__item:not(.has-description) {
    grid-template-rows: auto;
    grid-template-areas: "cover title action"
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__item:not(.has-description):not(.has-action) {
    grid-template-columns: auto 1fr;
    grid-template-areas: "cover title"
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__item:not(.has-description) .ldesign-coverlist__label {
    padding: 0
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__item:hover .ldesign-coverlist__action {
    opacity: 1
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__cover {
    width: var(--coverlist-cover-width, 100%)
}

.ldesign-coverlist.is-layout--horizontal .ldesign-coverlist__action {
    opacity: 0
}

.ldesign-coverlist.is-variant--gray-filled .ldesign-coverlist__cover {
    background-color: var(--coverlist-cover-background, var(--td-bg-color-container-active))
}

.ldesign-coverlist.is-variant--gray-filled .ldesign-coverlist__item {
    background-color: var(--td-bg-color-container-hover);
    border-color: var(--td-bg-color-container-hover)
}

.ldesign-coverlist.is-variant--gray-filled .ldesign-coverlist__item:hover {
    border-color: var(--td-brand-color-hover)
}

.ldesign-coverlist.is-variant--gray-filled .ldesign-coverlist__item.active {
    background-color: var(--td-brand-color-light);
    border-color: var(--td-brand-color)
}

.ldesign-coverlist__item {
    border: 1px solid var(--td-border-level-1-color);
    padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-xs);
    border-radius: var(--desktop-layout-radius, var(--coverlist-radius));
    cursor: pointer;
    transition: .2s;
    position: relative;
    color: var(--td-text-color-primary);
    -webkit-tap-highlight-color: transparent
}

.ldesign-coverlist__item:not(.has-description) .ldesign-coverlist__label {
    padding: var(--td-comp-paddingTB-xxs) 0;
    align-items: center
}

.ldesign-coverlist__item.active {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color);
    --td-gray-color-1: var(--td-bg-color-container);
    --td-gray-color-3: var(--td-brand-color-2);
    --td-gray-color-5: var(--td-bg-color-container);
    --td-gray-color-7: var(--td-brand-color)
}

.ldesign-coverlist__item.active .ldesign-coverlist__cover img {
    transform: scale(1.05)
}

.ldesign-coverlist__item.active .ldesign-coverlist__description {
    color: var(--td-brand-color-5)
}

.ldesign-coverlist__item:hover:not(.active) {
    border-color: var(--td-brand-color-4);
    color: var(--td-brand-color)
}

.ldesign-coverlist__item:hover:not(.active) .ldesign-coverlist__cover {
    background-color: var(--coverlist-cover-background, var(--td-brand-color-light))
}

.ldesign-coverlist__item:hover:not(.active) .ldesign-coverlist__cover img {
    transform: scale(1.05)
}

.ldesign-coverlist__cover {
    width: var(--coverlist-cover-width, 100%);
    aspect-ratio: var(--coverlist-aspect-ratio);
    background-color: var(--coverlist-cover-background, var(--td-bg-color-secondarycontainer));
    overflow: hidden;
    border-radius: inherit;
    grid-area: cover;
    display: flex;
    align-items: center;
    justify-content: center
}

.ldesign-coverlist__cover:empty {
    display: none
}

.ldesign-coverlist__cover .l-image__wrapper {
    width: 100%;
    aspect-ratio: var(--coverlist-aspect-ratio)
}

.ldesign-coverlist__cover span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%
}

.ldesign-coverlist__cover img,
.ldesign-coverlist__cover svg {
    transition: .2s;
    width: 100%;
    height: 100%
}

.ldesign-coverlist__label {
    margin: 0;
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    display: flex;
    align-items: flex-start;
    line-height: 1.2;
    flex: 1;
    grid-area: title;
    overflow: hidden
}

.ldesign-coverlist__description {
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-placeholder);
    margin: 0;
    grid-area: description;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    flex-direction: column
}

.ldesign-coverlist__description:empty {
    display: none
}

.ldesign-coverlist__description>span {
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.ldesign-coverlist__action {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-xxs);
    transition: .2s;
    grid-area: action
}

.ldesign-coverlist__action .l-button {
    font-size: var(--td-font-size-body-small);
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs)
}

.ldesign-coverlist__action .l-button .l-icon {
    width: var(--td-font-size-body-small)
}

.ldesign-coverlist__footer:not(:empty) {
    padding: var(--td-comp-paddingTB-s) 0 0 0;
    border-top: 1px solid var(--td-border-level-1-color);
    grid-column: span 2;
    margin-top: var(--td-comp-margin-s);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    display: flex;
    align-items: center
}

.ldesign-defaultpage {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    width: 100%;
    height: 100%;
    transition: inherit;
    --defaultpage-padding: 0;
    box-sizing: border-box;
    flex: 1
}

.ldesign-defaultpage.is-loose {
    --defaultpage-padding: var(--td-comp-margin-m)
}

.ldesign-defaultpage__content {
    background-color: var(--td-bg-color-container);
    border-radius: var(--layout-radius);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: inherit;
    width: 100%;
    box-sizing: border-box;
    padding: calc(var(--desktop-layout-padding, var(--td-comp-paddingTB-l)) * 2);
    gap: var(--td-comp-margin-s)
}

.ldesign-defaultpage__icon {
    --size: calc(var(--td-comp-size-xxxl) * 2.2);
    color: var(--td-brand-color);
    width: var(--size);
    display: flex;
    align-items: center
}

.ldesign-defaultpage__icon svg {
    width: 100%;
    height: auto
}

.ldesign-defaultpage__title {
    font-size: var(--td-font-size-title-large);
    color: var(--td-text-color-primary);
    margin: var(--td-comp-margin-m) 0 0 0
}

.ldesign-defaultpage__title+.ldesign-defaultpage__description {
    margin-top: var(--td-comp-margin-xxs)
}

.ldesign-defaultpage__description {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0 0 var(--td-comp-margin-l) 0;
    text-align: center;
    word-break: break-all
}

.ldesign-defaultpage__description b {
    color: var(--td-brand-color);
    margin: 0 var(--td-comp-margin-s);
    text-decoration: underline;
    cursor: pointer;
    word-wrap: break-word;
    word-break: break-all
}

.ldesign-defaultpage__description b:hover {
    color: var(--td-brand-color-hover)
}

.ldesign-defaultpage__description b:active {
    color: var(--td-brand-color-active)
}

.ldesign-defaultpage.is-size--small .ldesign-defaultpage__icon {
    --size: calc(var(--td-comp-size-xxxl) * 1.2)
}

.ldesign-defaultpage.is-size--small .ldesign-defaultpage__description {
    font-size: var(--td-font-size-body-small)
}

.ldesign-defaultpage.is-size--medium .ldesign-defaultpage__icon {
    --size: calc(var(--td-comp-size-xxxl) * 1.5)
}

.ldesign-defaultpage.is-size--medium .ldesign-defaultpage__content {
    gap: var(--td-comp-margin-l)
}

.ldesign-defaultpage.is-size--large .ldesign-defaultpage__icon {
    --size: calc(var(--td-comp-size-xxxl) * 2.4)
}

.ldesign-defaultpage.is-size--large .ldesign-defaultpage__content {
    gap: var(--td-comp-margin-xl)
}

.ldesign-defaultpage.is-device--mobile .ldesign-defaultpage__icon {
    --size: calc(var(--td-comp-size-xxxl) * 1.6)
}

.ldesign-defaultpage.is-device--mobile .ldesign-defaultpage__title {
    font-size: var(--td-font-size-title-small)
}

.ldesign-defaultpage.is-device--mobile .ldesign-defaultpage__description {
    font-size: var(--td-font-size-body-small)
}

.ldesign-popup {
    display: block;
    width: var(--popup-width);
    max-height: var(--popup-height);
    display: grid;
    grid-template-rows: auto 1fr;
    padding-bottom: var(--popup-padding, var(--td-comp-paddingTB-m))
}

.ldesign-popup:not(.has-head) {
    padding-top: var(--popup-padding, var(--td-comp-paddingTB-m))
}

.ldesign-popup:not(.has-head) .ldesign-popup__body {
    padding-top: 0
}

.ldesign-popup__head {
    padding: 0 var(--popup-padding, var(--td-comp-paddingLR-m));
    height: var(--td-comp-size-xxxl);
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    border-bottom: 1px solid var(--td-border-level-1-color)
}

.ldesign-popup__title {
    font-size: var(--td-font-size-title-medium);
    color: var(--td-text-color-primary);
    margin: 0
}

.ldesign-popup__body {
    overflow: auto;
    padding: 0 var(--popup-padding, var(--td-comp-paddingLR-m));
    box-sizing: border-box;
    padding-top: var(--popup-padding, var(--td-comp-paddingTB-m))
}

@-moz-document url-prefix() {
    .ldesign-popup__body {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-popup__body::-webkit-scrollbar {
    width: 3px;
    height: 3px
}

.ldesign-popup__body::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 5px
}

.ldesign-popup__body::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-popup__body::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-popup__wrap {
    padding: 0
}

.ldesign-popup__handler {
    color: inherit
}

.ldesign-popup__handler.is-active {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-dropdown {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
    border-radius: inherit;
    gap: var(--td-comp-margin-xxs)
}

.ldesign-dropdown__item {
    display: flex;
    padding: 0 var(--td-comp-paddingLR-m);
    height: var(--td-comp-size-s);
    align-items: center;
    cursor: pointer;
    border-radius: inherit
}

.ldesign-dropdown__item:hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-editorlayout {
    display: grid;
    --editorlayout-header-height: calc(var(--td-comp-size-xxxxl));
    --editorlayout-left-width: calc(var(--td-comp-size-xxxl) * 6);
    --editorlayout-right-width: calc(var(--td-comp-size-xxxl) * 6);
    --editorlayout-header-background: var(--td-bg-color-container);
    --editorlayout-left-background: var(--td-bg-color-container);
    --editorlayout-right-background: var(--td-bg-color-container);
    grid-template-columns: var(--editorlayout-left-width) 1fr var(--editorlayout-right-width);
    grid-template-rows: var(--editorlayout-header-height) 1fr;
    grid-template-areas: "header header header" "left content right";
    height: 100%;
    color: var(--td-text-color-primary);
    overflow: hidden
}

.ldesign-editorlayout:not(.has-left) {
    grid-template-columns: 1fr var(--editorlayout-right-width);
    grid-template-areas: "header header" "content right"
}

.ldesign-editorlayout:not(.has-left):not(.has-right) {
    grid-template-columns: 1fr;
    grid-template-areas: "header" "content"
}

.ldesign-editorlayout:not(.has-left):not(.has-header) {
    grid-template-rows: 1fr;
    grid-template-areas: "content right"
}

.ldesign-editorlayout:not(.has-header) {
    grid-template-rows: 1fr;
    grid-template-areas: "left content right";
    overflow: hidden
}

.ldesign-editorlayout__header {
    grid-area: header;
    background-color: var(--editorlayout-header-background);
    border-bottom: 1px solid var(--td-border-level-1-color);
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding: 0 var(--td-comp-paddingLR-m)
}

.ldesign-editorlayout__left {
    grid-area: left;
    background-color: var(--editorlayout-left-background)
}

.ldesign-editorlayout__right {
    grid-area: right;
    background-color: var(--editorlayout-right-background);
    overflow: auto;
    border-left: 1px solid var(--td-border-level-1-color)
}

@-moz-document url-prefix() {
    .ldesign-editorlayout__right {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-editorlayout__right::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-editorlayout__right::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 7px
}

.ldesign-editorlayout__right::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-editorlayout__right::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-editorlayout__content {
    grid-area: content;
    overflow: auto;
    display: grid
}

@-moz-document url-prefix() {
    .ldesign-editorlayout__content {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-editorlayout__content::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-editorlayout__content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 7px
}

.ldesign-editorlayout__content::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-editorlayout__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-editorlayout__content iframe {
    width: 100%;
    height: 100%;
    border: none;
    margin: 0
}

.ldesign-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--td-comp-paddingTB-l) 0
}

.ldesign-empty__content {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary)
}

.ldesign-empty__icon,
.ldesign-empty__icon-content {
    display: flex;
    align-items: center
}

.ldesign-fake-arrow {
    vertical-align: middle
}

.ldesign-fake-arrow path {
    transition: d var(--layout-transition);
    stroke: currentcolor
}

.ldesign-fake-arrow--active path {
    d: path("M3.75 10.2002L7.99274 5.7998L12.2361 10.0425")
}

.ldesign-filelist {
    --filelist-icon-size: var(--td-comp-size-xs);
    display: grid
}

.ldesign-filelist__item {
    display: grid;
    grid-template-columns: var(--filelist-icon-size) 1fr auto;
    grid-template-rows: auto var(--td-comp-size-xxs);
    grid-template-areas: "icon name status" "icon size action";
    gap: var(--td-comp-margin-xxs) var(--td-comp-margin-l);
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-s);
    border-bottom: 1px solid var(--td-border-level-1-color)
}

.ldesign-filelist__icon {
    grid-area: icon;
    width: var(--filelist-icon-size);
    height: var(--filelist-icon-size);
    overflow: hidden
}

.ldesign-filelist__icon-svg {
    width: 100%;
    height: 100%;
    display: flex
}

.ldesign-filelist__icon-svg svg {
    width: 100%;
    height: 100%
}

.ldesign-filelist__name {
    grid-area: name;
    margin: 0;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    line-height: 1.4;
    cursor: pointer;
    overflow: hidden;
    word-break: break-all
}

.ldesign-filelist__name:hover {
    color: var(--td-brand-color)
}

.ldesign-filelist__size {
    grid-area: size;
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary);
    margin: 0;
    display: flex;
    align-items: center
}

.ldesign-filelist__action {
    grid-area: action
}

.ldesign-filelist__action .l-button .l-icon {
    font-size: var(--td-font-size-body-small)
}

.ldesign-filelist__status {
    grid-area: status;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end
}

.ldesign-flashbox {
    display: block;
    border-radius: var(--layout-radius, var(--td-radius-default));
    border: 1px solid var(--td-border-level-1-color);
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box
}

.ldesign-flashbox:after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    height: 80%;
    transition-duration: .3s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    opacity: 0;
    outline-color: transparent;
    outline-style: solid;
    outline-width: 2px;
    border-radius: inherit
}

.ldesign-flashbox:before {
    content: "";
    display: block;
    position: absolute;
    width: 20%;
    height: 20%;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    background-color: var(--td-brand-color-light);
    transition-duration: .3s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    opacity: 0;
    z-index: 1;
    border-radius: inherit
}

.ldesign-flashbox:hover:after,
.ldesign-flashbox.active:after {
    width: 100%;
    height: 100%;
    outline-color: var(--td-brand-color-6);
    outline-style: solid;
    outline-width: 1px;
    opacity: 1
}

.ldesign-flashbox.active:after {
    outline-color: var(--td-brand-color)
}

.ldesign-flashbox.active:before {
    opacity: 1;
    width: 100%;
    height: 100%;
    border-radius: inherit
}

.ldesign-flashbox__content {
    position: relative;
    border-radius: inherit;
    z-index: 2;
    color: inherit;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.ldesign-list {
    list-style: none;
    margin: 0;
    padding: 0
}

.ldesign-list-item {
    --list-prefix-width: auto;
    --list-suffix-width: auto;
    --list-date-fontsize: var(--td-font-size-body-medium);
    --list-date-color: var(--td-text-color-secondary);
    --list-title-fontsize: var(--td-font-size-body-large);
    --list-padding: var(--td-comp-paddingTB-m);
    display: grid;
    grid-template-columns: var(--list-prefix-width) 1fr var(--list-suffix-width);
    padding: var(--list-padding) calc(var(--list-padding, var(--td-comp-paddingTB-l)) / 2);
    cursor: pointer
}

.ldesign-list-item:hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-list-item:not(.has-prefix) {
    grid-template-columns: 1fr var(--list-suffix-width)
}

.ldesign-list-item:not(.has-prefix):not(.has-suffix) {
    grid-template-columns: 1fr
}

.ldesign-list-item:not(.has-suffix) {
    grid-template-columns: var(--list-prefix-width) 1fr
}

.ldesign-list-item__title {
    font-size: var(--list-title-fontsize);
    font-weight: 400;
    margin: 0;
    line-height: var(--td-line-height-title-medium);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis
}

.ldesign-list-item__suffix {
    margin: 0
}

.ldesign-list-item__suffix:not(:empty) {
    margin-left: var(--td-comp-margin-l)
}

.ldesign-list-item__prefix {
    display: flex;
    align-items: flex-start
}

.ldesign-list-item__prefix:not(:empty) {
    margin-right: var(--td-comp-margin-l)
}

.ldesign-list-item__prefix,
.ldesign-list-item__suffix {
    padding-top: calc(var(--td-line-height-title-medium) * .2)
}

.ldesign-list-item__date {
    font-size: var(--list-date-fontsize);
    color: var(--list-date-color);
    margin: 0
}

.ldesign-list-item__label {
    display: inline-flex;
    height: var(--td-comp-size-s);
    padding: 0 var(--td-comp-paddingLR-s);
    border-radius: var(--td-radius-default);
    color: var(--td-text-color-anti);
    font-size: var(--td-font-size-body-small);
    align-items: center;
    background-color: var(--td-brand-color);
    margin: 0
}

.ldesign-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: var(--td-bg-color-container);
    border-radius: var(--layout-radius);
    gap: var(--td-comp-margin-xs)
}

.ldesign-loading.is-loose {
    background-color: transparent
}

.ldesign-loading__label {
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-svgicon,
.ldesign-svgicon.l-icon {
    display: inline-flex;
    align-items: center;
    font-size: inherit
}

.ldesign-svgicon svg {
    min-width: 1em;
    min-height: 1em;
    width: var(--width);
    height: var(--height)
}

.ldesign-logo {
    display: flex;
    align-items: center;
    cursor: pointer;
    width: 100%;
    color: inherit;
    --width: var(--td-comp-size-m);
    --height: var(--td-comp-size-m)
}

.ldesign-logo.has-logo {
    gap: min(var(--td-comp-margin-s), 6px)
}

.ldesign-logo.is-icononly {
    justify-content: center
}

.ldesign-logo__favicon {
    display: inline-flex;
    align-items: center;
    height: var(--td-comp-size-m);
    width: var(--td-comp-size-m)
}

.ldesign-logo__favicon svg {
    width: var(--width);
    height: var(--height)
}

.ldesign-logo__title {
    font-size: var(--td-font-size-title-large);
    margin: 0;
    line-height: 1;
    white-space: nowrap;
    flex: 1;
    overflow: hidden;
    color: inherit;
    text-overflow: ellipsis;
    font-family: Alibaba PuHuiTi;
    font-weight: 700
}

.ldesign-logo.ldesign-size--large .ldesign-logo__title {
    font-size: var(--td-font-size-headline-small)
}

.ldesign-logo.is-top,
.ldesign-logo.is-mix,
.ldesign-logo.is-mix-aside,
.ldesign-logo.is-top-lite {
    color: var(--td-font-white-color-1)
}

.ldesign-logo.is-small.has-logo {
    gap: var(--td-comp-margin-xxs)
}

.ldesign-logo.is-small .ldesign-logo__title {
    font-size: var(--td-font-size-title-medium);
    max-width: 10em
}

.ldesign-logo.is-large .ldesign-logo__title {
    font-size: var(--td-font-size-headline-small)
}

.ldesign-page {
    --ldesign-page-padding: var(--desktop-layout-padding, var(--td-comp-paddingLR-m));
    --ldesign-page-radius: var(--desktop-layout-radius, var(--td-radius-medium));
    background-color: var(--page-background, var(--desktop-layout-panel-background, var(--td-bg-color-container)));
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: var(--ldesign-page-radius);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    flex-grow: 1;
    overflow: hidden
}

.ldesign-page+.ldesign-page {
    display: none
}

.ldesign-page__header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between
}

.ldesign-page__header-content {
    flex: 1
}

.ldesign-page__header:not(:empty) {
    padding: var(--ldesign-page-padding)
}

.ldesign-page__header-suffix {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-s)
}

.ldesign-page__body {
    flex: 1;
    display: flex;
    overflow: hidden;
    position: relative
}

.ldesign-page__sideleft {
    position: relative;
    display: flex;
    flex-direction: column
}

.ldesign-page__sideleft-content {
    flex: 1;
    overflow: auto;
    padding: var(--page-sideleft-padding, var(--ldesign-page-padding))
}

@-moz-document url-prefix() {
    .ldesign-page__sideleft-content {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-page__sideleft-content::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-page__sideleft-content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 7px
}

.ldesign-page__sideleft-content::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-page__sideleft-content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-page__sideleft-header:not(:empty),
.ldesign-page__sideleft-footer:not(:empty) {
    padding: var(--page-sideright-padding, var(--ldesign-page-padding))
}

.ldesign-page__sideleft-handler {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-flex;
    width: var(--td-comp-size-xs);
    height: var(--td-comp-size-xs);
    align-items: center;
    justify-content: center;
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium));
    transform: translate(100%)
}

.ldesign-page__sideleft:not(:empty) {
    width: var(--page-sideleft-width, 25%);
    flex-shrink: 0
}

.ldesign-page__sideright {
    position: relative;
    display: flex;
    flex-direction: column
}

.ldesign-page__sideright-header:not(:empty),
.ldesign-page__sideright-footer:not(:empty) {
    padding: var(--page-sideright-padding, var(--ldesign-page-padding))
}

.ldesign-page__sideright-content {
    flex: 1;
    overflow: auto;
    padding: var(--page-sideright-padding, var(--ldesign-page-padding))
}

@-moz-document url-prefix() {
    .ldesign-page__sideright-content {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-page__sideright-content::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-page__sideright-content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 7px
}

.ldesign-page__sideright-content::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-page__sideright-content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-page__sideright-handler {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-flex;
    width: var(--td-comp-size-m);
    height: var(--td-comp-size-m);
    align-items: center;
    justify-content: center;
    background-color: var(--td-brand-color);
    color: var(--td-text-color-anti);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium))
}

.ldesign-page__sideright:not(:empty) {
    width: var(--page-sideright-width, 25%);
    flex-shrink: 0
}

.ldesign-page__main {
    flex: 1;
    flex-shrink: 0;
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden
}

.ldesign-page__main-content {
    flex: 1;
    overflow: auto;
    box-sizing: border-box
}

.ldesign-page__main-content:not(:empty) {
    padding: var(--page-content-padding, var(--ldesign-page-padding))
}

@-moz-document url-prefix() {
    .ldesign-page__main-content:not(:empty) {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-page__main-content:not(:empty)::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-page__main-content:not(:empty)::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 7px
}

.ldesign-page__main-content:not(:empty)::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-page__main-content:not(:empty)::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-page__main-footer:not(:empty) {
    padding: var(--ldesign-page-padding)
}

.ldesign-page__main-header:not(:empty) {
    padding: var(--ldesign-page-padding)
}

.ldesign-page__footer:not(:empty) {
    padding: var(--ldesign-page-padding)
}

.ldesign-page.is-compact>.ldesign-page__body>.ldesign-page__main>.ldesign-page__main-content {
    padding: 0
}

.ldesign-page.is-variant--divider .ldesign-page__header:not(:empty) {
    border-bottom: 1px solid var(--td-border-level-1-color)
}

.ldesign-page.is-variant--divider .ldesign-page__sideright:not(:empty) {
    border-left: 1px solid var(--td-border-level-1-color)
}

.ldesign-page.is-variant--divider .ldesign-page__sideleft:not(:empty) {
    border-right: 1px solid var(--td-border-level-1-color)
}

.ldesign-page.is-variant--divider .ldesign-page__footer:not(:empty) {
    border-top: 1px solid var(--td-border-level-1-color)
}

.ldesign-page.is-device--mobile .ldesign-page__sideleft:not(:empty),
.ldesign-page.is-device--mobile .ldesign-page__sideright:not(:empty) {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background-color: var(--td-bg-color-container);
    z-index: 100;
    width: 60%;
    transform: translate(-100%);
    transition: var(--desktop-layout-transition)
}

.ldesign-page.is-device--mobile .ldesign-page__sideleft:not(:empty).is-visible,
.ldesign-page.is-device--mobile .ldesign-page__sideright:not(:empty).is-visible {
    transform: translate(0);
    box-shadow: var(--td-shadow-2)
}

.ldesign-page.is-device--mobile .ldesign-page__sideright {
    left: auto;
    right: 0;
    transform: translate(100%)
}

.ldesign-page.is-device--mobile .ldesign-page__main-footer {
    display: flex;
    justify-content: center
}

.ldesign-panel {
    display: grid;
    grid-template-rows: auto 1fr;
    background-color: var(--panel-background, var(--td-bg-color-container));
    transition: var(--layout-transition);
    overflow: hidden;
    height: 100%;
    box-sizing: border-box;
    border-radius: var(--panel-radius);
    --panel-header-height: 0px;
    --panel-padding: var(--td-comp-paddingTB-l);
    --panel-title-width: auto;
    --panel-more-width: auto;
    --panel-radius: var(--td-radius-default)
}

.ldesign-panel.has-title .ldesign-panel__header,
.ldesign-panel.has-tab .ldesign-panel__header,
.ldesign-panel.has-more .ldesign-panel__header {
    --panel-header-height: var(--td-comp-size-xxxl);
    border-bottom: 1px solid var(--td-border-level-1-color)
}

.ldesign-panel__header {
    display: grid;
    grid-template-columns: var(--panel-title-width) 1fr var(--panel-more-width);
    gap: var(--td-comp-margin-xl);
    padding: var(--panel-padding);
    padding-top: 0;
    padding-bottom: 0;
    box-sizing: border-box;
    height: var(--panel-header-height)
}

.ldesign-panel__title {
    font-size: var(--panel-title-fontsize, var(--td-font-size-title-medium));
    margin: 0;
    color: var(--panel-title-color, var(--td-text-color-primary));
    display: flex;
    align-items: center
}

.ldesign-panel__title .l-badge {
    font: inherit
}

.ldesign-panel__tab {
    display: flex;
    align-items: center;
    position: relative;
    gap: var(--td-comp-margin-xl)
}

.ldesign-panel__tab-item {
    cursor: pointer;
    padding: 0 var(--td-comp-paddingLR-s)
}

.ldesign-panel__tab-item.active {
    color: var(--td-brand-color);
    font-weight: 700
}

.ldesign-panel__tab-item .l-badge {
    color: inherit;
    font: inherit
}

.ldesign-panel__tab-indicate {
    display: block;
    width: 1em;
    height: 2px;
    background-color: var(--td-brand-color);
    position: absolute;
    left: 0;
    bottom: 0;
    transition: .2s
}

.ldesign-panel__more {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.ldesign-panel__more>* {
    cursor: pointer
}

.ldesign-panel__content {
    overflow: auto;
    padding: var(--panel-padding)
}

@-moz-document url-prefix() {
    .ldesign-panel__content {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-panel__content::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.ldesign-panel__content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 11px
}

.ldesign-panel__content::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-panel__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-popframe {
    display: block
}

.ldesign-popframe.hide-header .l-drawer__header {
    display: none
}

.ldesign-popframe:not(.is-custom-padding) .l-dialog__position {
    padding: 0 !important
}

.ldesign-popframe.is-device--mobile .l-dialog__wrap {
    padding: 0;
    -ms-overflow-style: none
}

@-moz-document url-prefix() {
    .ldesign-popframe.is-device--mobile .l-dialog__wrap {
        scrollbar-width: none;
        overflow: -moz-scrollbars-none
    }
}

.ldesign-popframe.is-device--mobile .l-dialog__wrap::-webkit-scrollbar {
    display: none;
    width: 0 !important
}

.ldesign-popframe:not(.is-scroll) .l-drawer__body {
    overflow: hidden
}

.ldesign-popframe__header {
    display: flex;
    width: 100%;
    align-items: center
}

.ldesign-popframe__header .l-button {
    width: calc(var(--td-font-size-body-large) + 4px);
    height: calc(var(--td-font-size-body-large) + 4px);
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
    box-sizing: content-box
}

.ldesign-popframe__header .l-button .l-icon {
    margin: 0;
    font-size: inherit
}

.ldesign-popframe__header .l-button .l-dialog__close svg {
    width: .7em;
    height: .7em
}

.ldesign-popframe__header-suffix {
    flex: 1;
    display: flex;
    justify-content: flex-end
}

.ldesign-popframe__content {
    position: relative;
    display: flex;
    flex-direction: column
}

.ldesign-popframe__content.is-scroll {
    min-height: 100%
}

.ldesign-popframe__content:not(.is-scroll) {
    height: 100%
}

.ldesign-popframe__content .l-watermark {
    flex: 1
}

.ldesign-popframe__footer {
    display: flex;
    align-items: center
}

.ldesign-popframe .l-drawer__header {
    padding: 0 var(--pop-frame-padding, var(--td-comp-paddingLR-l))
}

.ldesign-popframe .l-drawer__content-wrapper {
    transition: .2s
}

.ldesign-popframe .l-drawer__footer:empty {
    display: none
}

.ldesign-popframe .l-drawer__body {
    padding: var(--pop-frame-padding, var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l));
    display: flex;
    flex-direction: column
}

.ldesign-popframe:not(.has-footer) {
    grid-template-rows: auto 1fr auto
}

.ldesign-popframe .l-dialog {
    width: var(--pop-frame-width);
    height: var(--pop-frame-height);
    max-height: 100%;
    display: grid;
    transition: width .2s, height .2s;
    grid-template-rows: auto 1fr auto;
    gap: var(--td-comp-margin-l)
}

.ldesign-popframe .l-dialog__position {
    height: 100%
}

.ldesign-popframe .l-dialog--default {
    padding: var(--td-comp-paddingTB-l) var(--td-comp-paddingTB-l) var(--td-comp-paddingLR-l)
}

.ldesign-popframe .l-dialog__footer,
.ldesign-popframe .l-dialog__body {
    padding: 0
}

.ldesign-popframe .l-dialog__header {
    gap: var(--td-comp-margin-xxs)
}

.ldesign-popframe .l-dialog__body {
    display: block;
    margin: 0 calc(var(--td-comp-paddingLR-l) * -1);
    padding: 0 var(--td-comp-paddingLR-l)
}

@-moz-document url-prefix() {
    .ldesign-popframe .l-dialog__body {
        scrollbar-color: rgba(0, 0, 0, .2) transparent;
        scrollbar-width: thin
    }
}

.ldesign-popframe .l-dialog__body::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-popframe .l-dialog__body::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0003;
    border-radius: 7px
}

.ldesign-popframe .l-dialog__body::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-popframe .l-dialog__body::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-popframe.is-fullscreen .l-dialog {
    border-radius: 0
}

.ldesign-popframe.is-role-drawer .l-drawer__footer .l-space {
    flex-direction: row-reverse
}

.ldesign-popframe.is-role-dialog .ldesign-popframe__footer {
    justify-content: flex-end
}

.ldesign-popframe.is-role-dialog .ldesign-popframe__footer.is-align-center,
.ldesign-popframe.is-role-drawer .ldesign-popframe__footer.is-align-center {
    justify-content: center
}

.ldesign-popframe.is-role-dialog .ldesign-popframe__footer.is-align-right,
.ldesign-popframe.is-role-drawer .ldesign-popframe__footer.is-align-right {
    justify-content: flex-end
}

.ldesign-popframe.is-role-dialog .ldesign-popframe__footer.is-align-left,
.ldesign-popframe.is-role-drawer .ldesign-popframe__footer.is-align-left {
    justify-content: flex-start
}

.ldesign-svgsprite {
    width: 1em;
    height: 1em;
    fill: currentColor
}

.ldesign-title {
    font-size: var(--td-font-size-title-medium);
    color: var(--td-text-color-primary);
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-xs)
}

.ldesign-title__label {
    font-size: inherit;
    margin: 0;
    flex: 1
}

.ldesign-title.is-size--medium {
    font-size: var(--td-font-size-title-large)
}

.ldesign-title.is-size--large {
    font-size: var(--td-font-size-headline-small)
}

.ldesign-title.is-variant--vertical-line:before {
    content: "";
    display: block;
    width: 3px;
    height: var(--td-font-size-title-medium);
    background-color: var(--td-brand-color);
    border-radius: 2px
}

.ldesign-asyncrender {
    display: flex
}

.ldesign-grids__item {
    height: 100%;
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium));
    overflow: hidden
}

.ldesign-grids__item:not(.is-editable) .ldesign-grids__item-content:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 10;
    cursor: pointer
}

.ldesign-grids__item:not(.is-readonly):hover .ldesign-grids__item-toolbar {
    transform: translate(0)
}

.ldesign-grids__item:not(.is-readonly):hover .ldesign-grids__item-content {
    box-shadow: var(--td-shadow-1)
}

.ldesign-grids__item-content {
    box-sizing: border-box;
    border: 1px dashed var(--td-bg-color-container);
    background-color: var(--td-bg-color-container);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium));
    transition: .2s;
    position: relative
}

.ldesign-grids__item-content:hover .ldesign-grids__toolbar {
    opacity: 1;
    z-index: 10
}

.ldesign-grids__item-toolbar {
    position: absolute;
    z-index: 11;
    display: flex;
    width: 100%;
    justify-content: flex-end;
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
    box-sizing: border-box;
    transform: translateY(-100%);
    transition: .2s
}

.ldesign-grids__item-toolbar .l-button {
    padding: 0;
    width: var(--td-comp-size-xxxs);
    height: var(--td-comp-size-xxxs)
}

.ldesign-grids__item.is-active {
    background-color: var(--td-bg-color-component-hover)
}

.ldesign-grids__item.is-active .ldesign-grids__item-content {
    border-color: var(--td-brand-color)
}

.grid-stack {
    position: relative
}

.grid-stack-rtl {
    direction: ltr
}

.grid-stack-rtl>.grid-stack-item {
    direction: rtl
}

.grid-stack-placeholder>.placeholder-content {
    background-color: #0000001a;
    margin: 0;
    position: absolute;
    width: auto;
    z-index: 0 !important
}

.grid-stack>.grid-stack-item {
    position: absolute;
    padding: 0
}

.grid-stack>.grid-stack-item>.grid-stack-item-content {
    margin: 0;
    position: absolute;
    width: auto;
    overflow-x: hidden;
    overflow-y: auto
}

.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content {
    overflow-y: hidden
}

.grid-stack-item>.ui-resizable-handle {
    position: absolute;
    font-size: .1px;
    display: block;
    -ms-touch-action: none;
    touch-action: none
}

.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle,
.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle {
    display: none
}

.grid-stack-item>.ui-resizable-ne,
.grid-stack-item>.ui-resizable-nw,
.grid-stack-item>.ui-resizable-se,
.grid-stack-item>.ui-resizable-sw {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23666" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 20 20"><path d="m10 3 2 2H8l2-2v14l-2-2h4l-2 2"/></svg>');
    background-repeat: no-repeat;
    background-position: center
}

.grid-stack-item>.ui-resizable-ne {
    transform: rotate(45deg)
}

.grid-stack-item>.ui-resizable-sw {
    transform: rotate(45deg)
}

.grid-stack-item>.ui-resizable-nw {
    transform: rotate(-45deg)
}

.grid-stack-item>.ui-resizable-se {
    transform: rotate(-45deg)
}

.grid-stack-item>.ui-resizable-nw {
    cursor: nw-resize;
    width: 20px;
    height: 20px;
    top: 0
}

.grid-stack-item>.ui-resizable-n {
    cursor: n-resize;
    height: 10px;
    top: 0;
    left: 25px;
    right: 25px
}

.grid-stack-item>.ui-resizable-ne {
    cursor: ne-resize;
    width: 20px;
    height: 20px;
    top: 0
}

.grid-stack-item>.ui-resizable-e {
    cursor: e-resize;
    width: 10px;
    top: 15px;
    bottom: 15px
}

.grid-stack-item>.ui-resizable-se {
    cursor: se-resize;
    width: 20px;
    height: 20px
}

.grid-stack-item>.ui-resizable-s {
    cursor: s-resize;
    height: 10px;
    left: 25px;
    bottom: 0;
    right: 25px
}

.grid-stack-item>.ui-resizable-sw {
    cursor: sw-resize;
    width: 20px;
    height: 20px
}

.grid-stack-item>.ui-resizable-w {
    cursor: w-resize;
    width: 10px;
    top: 15px;
    bottom: 15px
}

.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle {
    display: none !important
}

.grid-stack-item.ui-draggable-dragging {
    will-change: left, top;
    cursor: move
}

.grid-stack-item.ui-resizable-resizing {
    will-change: width, height
}

.ui-draggable-dragging,
.ui-resizable-resizing {
    z-index: 10000
}

.ui-draggable-dragging>.grid-stack-item-content,
.ui-resizable-resizing>.grid-stack-item-content {
    box-shadow: 1px 4px 6px #0003;
    opacity: .8
}

.grid-stack-animate,
.grid-stack-animate .grid-stack-item {
    transition: left .3s, top .3s, height .3s, width .3s
}

.grid-stack-animate .grid-stack-item.ui-draggable-dragging,
.grid-stack-animate .grid-stack-item.ui-resizable-resizing,
.grid-stack-animate .grid-stack-item.grid-stack-placeholder {
    transition: left 0s, top 0s, height 0s, width 0s
}

.grid-stack>.grid-stack-item[gs-y="0"] {
    top: 0
}

.grid-stack>.grid-stack-item[gs-x="0"] {
    left: 0%
}

.gs-12>.grid-stack-item {
    width: 8.333%
}

.gs-12>.grid-stack-item[gs-x="1"] {
    left: 8.333%
}

.gs-12>.grid-stack-item[gs-w="2"] {
    width: 16.667%
}

.gs-12>.grid-stack-item[gs-x="2"] {
    left: 16.667%
}

.gs-12>.grid-stack-item[gs-w="3"] {
    width: 25%
}

.gs-12>.grid-stack-item[gs-x="3"] {
    left: 25%
}

.gs-12>.grid-stack-item[gs-w="4"] {
    width: 33.333%
}

.gs-12>.grid-stack-item[gs-x="4"] {
    left: 33.333%
}

.gs-12>.grid-stack-item[gs-w="5"] {
    width: 41.667%
}

.gs-12>.grid-stack-item[gs-x="5"] {
    left: 41.667%
}

.gs-12>.grid-stack-item[gs-w="6"] {
    width: 50%
}

.gs-12>.grid-stack-item[gs-x="6"] {
    left: 50%
}

.gs-12>.grid-stack-item[gs-w="7"] {
    width: 58.333%
}

.gs-12>.grid-stack-item[gs-x="7"] {
    left: 58.333%
}

.gs-12>.grid-stack-item[gs-w="8"] {
    width: 66.667%
}

.gs-12>.grid-stack-item[gs-x="8"] {
    left: 66.667%
}

.gs-12>.grid-stack-item[gs-w="9"] {
    width: 75%
}

.gs-12>.grid-stack-item[gs-x="9"] {
    left: 75%
}

.gs-12>.grid-stack-item[gs-w="10"] {
    width: 83.333%
}

.gs-12>.grid-stack-item[gs-x="10"] {
    left: 83.333%
}

.gs-12>.grid-stack-item[gs-w="11"] {
    width: 91.667%
}

.gs-12>.grid-stack-item[gs-x="11"] {
    left: 91.667%
}

.gs-12>.grid-stack-item[gs-w="12"] {
    width: 100%
}

.gs-1>.grid-stack-item {
    width: 100%
}

.ldesign-grids {
    display: flex;
    background-color: var(--td-bg-color-page);
    min-height: 100%;
    box-sizing: border-box
}

.ldesign-grids.is-readonly .ldesign-grids__item-content {
    overflow: hidden
}

.ldesign-grids.is-readonly .ldesign-grids__item-content>* {
    height: 100%
}

.ldesign-grids:not(.is-readonly) {
    border: var(--ldesign-grid-margin) solid var(--td-bg-color-page)
}

.ldesign-grids-handler__tabs {
    padding: var(--ldesign-page-padding)
}

.ldesign-grids-handler__content {
    flex: 1;
    overflow: auto;
    padding: var(--ldesign-page-padding)
}

@-moz-document url-prefix() {
    .ldesign-grids-handler__content {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-grids-handler__content::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-grids-handler__content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 7px
}

.ldesign-grids-handler__content::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-grids-handler__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-areapicker {
    --width: calc(var(--td-comp-size-l) * 18);
    --height: calc(var(--td-comp-size-l) * 12);
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr auto;
    height: var(--height);
    grid-template-areas: "header" "body" "footer";
    width: var(--width);
    transition: .2s
}

.ldesign-areapicker.is-variant--cascader {
    width: auto
}

.ldesign-areapicker.is-variant--cascader.is-ellipsis .ldesign-areapicker__wrap-column {
    min-width: calc(var(--td-comp-size-l) * 3.8);
    max-width: calc(var(--td-comp-size-l) * 4.2)
}

.ldesign-areapicker.is-variant--cascader .ldesign-areapicker__wrap {
    display: inline-flex
}

.ldesign-areapicker.is-variant--cascader .ldesign-areapicker__wrap-column {
    display: inline-flex;
    min-width: calc(var(--td-comp-size-l) * 3.5);
    padding: 0 var(--td-comp-paddingLR-xs);
    border-left: 1px solid var(--td-border-level-1-color);
    width: auto
}

.ldesign-areapicker.is-variant--cascader .ldesign-areapicker__wrap-column-item {
    padding: 0 var(--td-comp-paddingLR-xs);
    height: var(--td-comp-size-m)
}

.ldesign-areapicker.is-variant--cascader .ldesign-areapicker__wrap-column-item-buttons {
    display: none
}

.ldesign-areapicker.is-variant--cascader .ldesign-areapicker__wrap-column:first-child {
    border-left: none
}

.ldesign-areapicker.is-size--small {
    --width: calc(var(--td-comp-size-l) * 15);
    --height: calc(var(--td-comp-size-l) * 10)
}

.ldesign-areapicker.is-size--small.is-variant--cascader .ldesign-areapicker__wrap-column-item {
    height: var(--td-comp-size-s)
}

.ldesign-areapicker.is-size--small .ldesign-areapicker__tabs {
    font-size: var(--td-font-size-body-medium)
}

.ldesign-areapicker.is-size--small .ldesign-areapicker__wrap-column {
    padding: var(--td-comp-paddingTB-xxs) 0;
    gap: calc(var(--td-comp-margin-xxs) / 2)
}

.ldesign-areapicker.is-size--small .ldesign-areapicker__wrap-column-item {
    height: var(--td-comp-size-s)
}

.ldesign-areapicker__popup {
    padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs)
}

.ldesign-areapicker__header {
    border-bottom: 1px solid var(--td-border-level-1-color);
    grid-area: header
}

.ldesign-areapicker__body {
    grid-area: body;
    overflow: hidden;
    position: relative
}

.ldesign-areapicker__loading {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    left: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.ldesign-areapicker__loading:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: var(--td-bg-color-container);
    opacity: .6
}

.ldesign-areapicker__loading>* {
    position: relative;
    z-index: 2
}

.ldesign-areapicker__footer {
    grid-area: footer;
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-m);
    padding-top: var(--td-comp-paddingTB-l);
    justify-content: flex-end;
    border-top: 1px solid var(--td-border-level-1-color)
}

.ldesign-areapicker__empty {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.ldesign-areapicker__empty-label {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-placeholder)
}

.ldesign-areapicker__wrap {
    height: 100%;
    display: grid;
    align-items: flex-start;
    grid-template-columns: repeat(6, 100%);
    transition: .2s
}

.ldesign-areapicker__wrap-column {
    list-style: none;
    margin: 0;
    padding: var(--td-comp-paddingTB-m) 0;
    width: var(--width);
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-xs);
    height: 100%;
    overflow: auto;
    box-sizing: border-box
}

@-moz-document url-prefix() {
    .ldesign-areapicker__wrap-column {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-areapicker__wrap-column::-webkit-scrollbar {
    width: 2px;
    height: 2px
}

.ldesign-areapicker__wrap-column::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 3px
}

.ldesign-areapicker__wrap-column::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-areapicker__wrap-column::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-areapicker__wrap-column-item {
    height: var(--td-comp-size-l);
    display: flex;
    align-items: center;
    cursor: pointer;
    flex-shrink: 0;
    padding: 0 var(--td-comp-paddingLR-xs) 0 var(--td-comp-paddingLR-s);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium))
}

.ldesign-areapicker__wrap-column-item-label {
    font-size: inherit;
    font-weight: inherit;
    margin: 0;
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.ldesign-areapicker__wrap-column-item-arrow {
    color: var(--td-text-color-placeholder);
    margin-left: var(--td-comp-margin-m)
}

.ldesign-areapicker__wrap-column-item-buttons {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-m);
    opacity: 0
}

.ldesign-areapicker__wrap-column-item-buttons .l-button {
    transition: .2s
}

.ldesign-areapicker__wrap-column-item-buttons .l-button__text {
    font-size: var(--td-font-size-body-small)
}

.ldesign-areapicker__wrap-column-item-buttons .l-button__text .l-icon {
    font-size: inherit
}

.ldesign-areapicker__wrap-column-item.is-active {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color);
    font-weight: 700
}

.ldesign-areapicker__wrap-column-item:not(.is-active):hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-areapicker__wrap-column-item:hover .ldesign-areapicker__wrap-column-item-buttons {
    opacity: 1
}

.ldesign-areapicker__tabs {
    list-style: none;
    margin: 0;
    padding: 0 var(--td-comp-paddingLR-s);
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-xxs);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-primary)
}

.ldesign-areapicker__tabs-item {
    height: var(--td-comp-size-l);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-xxs)
}

.ldesign-areapicker__tabs-item .l-icon {
    color: var(--td-text-color-placeholder)
}

.ldesign-areapicker__tabs-item.is-active {
    color: var(--td-brand-color);
    font-weight: 700
}

.ldesign-areapicker__tabs-item:not(.is-active).is-readonly {
    color: var(--td-text-color-placeholder);
    cursor: not-allowed
}

.areapicker-enter-active,
.areapicker-leave-active {
    transition: all .2s ease
}

.areapicker-enter-from,
.areapicker-leave-to {
    transform: translate(30px) scale(.7);
    opacity: 0
}

.areapicker-cascader-enter-active,
.areapicker-cascader-leave-active {
    transition: all .2s ease
}

.areapicker-cascader-enter-from,
.areapicker-cascader-leave-to {
    transform: translate(30px);
    opacity: 0
}

.ldesign-buttons {
    display: inline-flex;
    width: 100%;
    flex-direction: nowrap;
    overflow: hidden;
    gap: var(--ldesign-buttons-gutter, var(--td-comp-margin-s))
}

.ldesign-buttons.is-align--right {
    justify-content: flex-end
}

.ldesign-buttons.is-align-center {
    justify-content: center
}

.ldesign-buttons.is-align--left {
    justify-content: flex-start
}

.ldesign-buttons.is-align-justiry {
    justify-content: flex-end
}

.ldesign-buttons__content {
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-xxs)
}

.ldesign-buttons__content .l-button {
    background-color: transparent;
    color: var(--td-text-color-primary);
    border: none;
    --ripple-color: transparent !important
}

.ldesign-buttons__content .l-button:hover {
    background-color: var(--td-bg-color-container-hover)
}

.ldesign-form {
    font: inherit;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

.ldesign-form.has-header,
.ldesign-form.has-footer {
    min-height: 100%
}

.ldesign-form__header {
    display: flex;
    border-bottom: 1px solid var(--td-border-level-1-color)
}

.ldesign-form__footer {
    display: flex;
    border-top: 1px solid var(--td-border-level-1-color)
}

.ldesign-form__content {
    flex: 1;
    flex-grow: 1;
    overflow: auto
}

@-moz-document url-prefix() {
    .ldesign-form__content {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-form__content::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-form__content::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 7px
}

.ldesign-form__content::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-form__content::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-form.is-in-scrollcontainer {
    padding-bottom: var(--form-gutter)
}

.ldesign-form.has-footer .ldesign-form__footer,
.ldesign-form.has-header .ldesign-form__footer,
.ldesign-form.has-footer .ldesign-form__content,
.ldesign-form.has-header .ldesign-form__content,
.ldesign-form.has-footer .ldesign-form__header,
.ldesign-form.has-header .ldesign-form__header {
    padding: var(--form-padding)
}

.ldesign-form .l-form {
    display: grid;
    gap: calc(var(--form-gutter))
}

.ldesign-form__skeleton {
    position: absolute;
    top: 0;
    left: 0
}

.ldesign-form__skeleton-row {
    display: grid;
    grid-template-columns: repeat(var(--form-cols), 1fr)
}

.ldesign-form__skeleton-input {
    height: var(--td-comp-size-l);
    background-color: red;
    width: 100%
}

.ldesign-form__title {
    font-size: var(--td-font-size-title-medium);
    color: var(--td-text-color-primary);
    margin: 0
}

.ldesign-form__title:empty {
    display: none
}

.ldesign-form__buttons {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-s);
    flex: 1;
    overflow: hidden
}

.ldesign-form__buttons.is-inline .ldesign-form__buttons-prefix {
    justify-content: flex-end
}

.ldesign-form__buttons-prefix {
    flex: 1;
    overflow: hidden;
    display: flex;
    gap: var(--td-comp-margin-s)
}

.ldesign-form__buttons-suffix {
    gap: var(--td-comp-margin-s);
    display: flex
}

.ldesign-form__buttons-suffix.is-align--right {
    justify-content: flex-end
}

.ldesign-form__buttons-suffix.is-align-center {
    justify-content: center
}

.ldesign-form__buttons-suffix:only-child {
    flex: 1
}

.ldesign-form__buttons.is-align--center .ldesign-form__buttons-prefix,
.ldesign-form__buttons.is-align--left .ldesign-form__buttons-prefix,
.ldesign-form__buttons.is-align--right .ldesign-form__buttons-prefix,
.ldesign-form__buttons.is-align--center .ldesign-form__buttons-suffix,
.ldesign-form__buttons.is-align--left .ldesign-form__buttons-suffix,
.ldesign-form__buttons.is-align--right .ldesign-form__buttons-suffix {
    flex: 0 0 auto
}

.ldesign-form__buttons.is-align--center {
    justify-content: center
}

.ldesign-form__buttons.is-align--right {
    justify-content: flex-end
}

.ldesign-form__row {
    display: grid;
    grid-template-columns: repeat(var(--form-cols), 1fr);
    list-style: none;
    margin: 0;
    padding: 0;
    gap: var(--form-gutter)
}

.ldesign-form__group {
    display: grid;
    gap: var(--form-gutter)
}

.ldesign-form__group:not(.has-more) .ldesign-form__expand {
    display: none
}

.ldesign-form__preview,
.ldesign-form__more {
    display: grid;
    gap: var(--form-gutter);
    margin-top: 1px
}

.ldesign-form__more {
    margin-top: -1px
}

.ldesign-form__col {
    grid-column: span var(--form-col);
    position: relative
}

.ldesign-form__col.hide-colon .l-form__label {
    display: none
}

.ldesign-form__col.is-static .l-input {
    padding: 0;
    border: none
}

.ldesign-form__col.is-static .l-input.l-is-disabled {
    background-color: transparent;
    color: inherit
}

.ldesign-form__col.is-static .l-input.l-is-disabled .l-input__inner {
    color: inherit
}

.ldesign-form__col.is-static .l-textarea__inner {
    border: none;
    padding-left: 0;
    padding-right: 0
}

.ldesign-form__col.is-static .l-form__label {
    color: var(--td-text-color-secondary)
}

.ldesign-form__col.is-button:after {
    width: 0px !important
}

.ldesign-form__col.is-button .l-form__label {
    font-size: 0
}

.ldesign-form__col.is-button .ldesign-form__core-content {
    gap: var(--td-comp-margin-s)
}

.ldesign-form__col.is-adjust {
    grid-column: span var(--form-adjust-col)
}

.ldesign-form__col.is-multiple-label .l-form__label {
    display: inline-flex
}

.ldesign-form__col.is-multiple-label .l-form__label label {
    display: inline-block;
    width: calc(100% - var(--form-colon-width));
    line-height: 1.1;
    white-space: wrap
}

.ldesign-form__col .l-form__label {
    padding-right: var(--form-label-space)
}

.ldesign-form__col .l-form__item {
    position: relative;
    z-index: 10
}

.ldesign-form__core {
    flex: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    overflow: hidden;
    gap: var(--form-inner-space, var(--td-comp-margin-s))
}

.ldesign-form__core-prefix:empty,
.ldesign-form__core-suffix:empty {
    display: none
}

.ldesign-form__core-content {
    flex-shrink: 0;
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: row
}

.ldesign-form__core-content .l-date-picker,
.ldesign-form__core-content .l-date-range-picker {
    width: 100%
}

.ldesign-form__core-content.is-button-align--right,
.ldesign-form__core-content.is-button-align--right .ldesign-form__buttons-suffix {
    justify-content: flex-end
}

.ldesign-form__core-content.is-button-align--center,
.ldesign-form__core-content.is-button-align--center .ldesign-form__buttons-suffix {
    justify-content: center
}

.ldesign-form__core-content.is-button-align--left,
.ldesign-form__core-content.is-button-align--left .ldesign-form__buttons-suffix {
    justify-content: flex-start
}

.ldesign-form__core-content.is-button-align--justify .ldesign-form__buttons-suffix,
.ldesign-form__core-content.is-content-align--right {
    justify-content: flex-end
}

.ldesign-form.is-variant--document {
    padding: calc(var(--form-gutter) / 2) 0
}

.ldesign-form.is-variant--document .l-form__label {
    padding: 0 var(--form-label-padding)
}

.ldesign-form.is-variant--document .ldesign-form__row {
    padding: 0 calc(var(--form-gutter) / 2)
}

.ldesign-form.is-variant--document .ldesign-form__row+.ldesign-form__row {
    margin-top: -1px
}

.ldesign-form.is-variant--document .ldesign-form__core {
    padding-left: calc(var(--form-gutter) / 2)
}

.ldesign-form.is-variant--document .ldesign-form__col:before {
    content: "";
    display: block;
    position: absolute;
    top: calc(var(--form-gutter) / -2);
    left: calc(var(--form-gutter) / -2);
    bottom: calc(var(--form-gutter) / -2);
    right: calc(var(--form-gutter) / -2);
    box-sizing: border-box;
    border: 1px solid var(--td-border-level-1-color);
    z-index: 9
}

.ldesign-form.is-variant--document .ldesign-form__col:after {
    content: "";
    display: block;
    position: absolute;
    top: calc(var(--form-gutter) / -2 + 1px);
    bottom: calc(var(--form-gutter) / -2 + 1px);
    left: calc(var(--form-gutter) / -2);
    width: calc(var(--form-label-width) + var(--form-gutter) / 2);
    background-color: var(--td-bg-color-container-hover);
    border-right: 1px solid var(--td-border-level-1-color);
    box-sizing: border-box;
    z-index: 8
}

.ldesign-form.is-variant--document .ldesign-form__col+.ldesign-form__col {
    margin-left: -1px
}

.ldesign-formpage__buttons {
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-s)
}

.ldesign-formpage__buttons.is-align--right {
    justify-content: flex-end
}

.ldesign-formpage__buttons .l-button {
    padding: 0;
    --ripple-color: transparent !important
}

.ldesign-formpage__buttons .l-button:hover {
    border-color: transparent;
    background-color: transparent
}

.ldesign-formpage .ldesign-page__main-content {
    position: relative
}

.ldesign-formpage__loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 100;
    gap: var(--td-comp-margin-m);
    background-color: var(--td-bg-color-container)
}

.ldesign-formpage__loading p {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-formpage__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%
}

.ldesign-formpage__empty p {
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-secondary);
    margin: 0
}

.ldesign-formpage__table {
    min-height: 100%
}

.ldesign-formpage__table.is-empty {
    display: flex;
    flex-direction: column
}

.ldesign-formpage__table.is-empty table {
    height: 100%
}

.ldesign-formpage__table.is-empty .l-table__content {
    flex: 1;
    display: flex;
    flex-direction: column
}

.ldesign-formpage__table.is-empty .l-table__content table {
    flex: 1
}

.ldesign-formpage__table th {
    color: var(--td-text-color-primary);
    border-top: 1px solid var(--td-component-border)
}

.ldesign-formpage__table th:before {
    content: "";
    display: inline-block;
    width: 1px;
    height: var(--td-font-size-body-medium);
    background-color: var(--td-bg-color-component-hover);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%)
}

.ldesign-formpage__table.l-table__content--scrollable-to-right .l-table__cell--fixed-right-first:after {
    border: none;
    width: 10px;
    box-shadow: inset -6px 0 8px -3px #00000026
}

.ldesign-formpage__table.l-table__content--scrollable-to-left .l-table__cell--fixed-left-last:after {
    border: none;
    width: 10px;
    box-shadow: inset 6px 0 8px -3px #00000026
}

.fade-enter-active,
.fade-leave-active {
    transition: opacity .2s ease-in-out
}

.fade-enter-from,
.fade-leave-to {
    opacity: 0
}

.ldesign-tree {
    display: block
}

.ldesign-upload {
    display: block
}

.ldesign-upload__list {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%
}

.ldesign-userpicker {
    display: block;
    border: 1px solid var(--td-border-level-1-color);
    border-radius: var(--td-radius-default);
    width: 100%
}

.ldesign-userpicker__content {
    min-height: var(--td-comp-size-xxxl);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-m)
}

.ldesign-userpicker__toolbar {
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-m);
    display: flex;
    justify-content: flex-end
}

.ldesign-userpicker__tree {
    height: 100%;
    overflow: auto
}

@-moz-document url-prefix() {
    .ldesign-userpicker__tree {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-userpicker__tree::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-userpicker__tree::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 7px
}

.ldesign-userpicker__tree::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-userpicker__tree::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-userpicker__tree .l-tree__label {
    margin-left: 0
}

.ldesign-userpicker__tree .l-tree__icon:empty {
    display: none
}

.ldesign-userpicker__tree .l-tree__icon:empty+.l-tree__label {
    padding-left: 0
}

.ldesign-userpicker__panel {
    flex: 1;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr var(--userpicker-list-width, 300px)
}

.ldesign-grids-handler {
    display: flex;
    flex-direction: column;
    height: 100%
}

.ldesign-grids-handler__content {
    flex: 1;
    overflow: auto
}

.ldesign-grids-handler__list {
    list-style: none;
    padding: 0;
    display: grid;
    margin: 0;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--td-comp-size-l) * 3), 1fr));
    gap: var(--td-comp-margin-m)
}

.ldesign-grids-handler__list-item {
    display: grid;
    gap: var(--td-comp-margin-s);
    cursor: pointer
}

.ldesign-grids-handler__group {
    display: grid;
    gap: var(--td-comp-margin-s);
    margin: var(--td-comp-margin-l) 0 0 0
}

.ldesign-grids-handler__group-title {
    font-size: var(--td-font-size-title-medium);
    color: var(--td-text-color-primary);
    margin: 0
}

.ldesign-grids-handler__title {
    font-size: var(--td-font-size-body-medium);
    margin: 0
}

.ldesign-grids-handler__cover {
    border: 1px solid var(--td-border-level-1-color);
    aspect-ratio: 1.4;
    display: flex;
    align-items: center;
    justify-content: center
}

.ldesign-grids-handler__cover .l-image__wrapper {
    width: 100%;
    aspect-ratio: 1.4
}

.ldesign-grids__title {
    margin: 0
}

.ldesign-gridstack-page {
    display: block;
    height: 100%;
    overflow: auto
}

@-moz-document url-prefix() {
    .ldesign-gridstack-page {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-gridstack-page::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.ldesign-gridstack-page::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 7px
}

.ldesign-gridstack-page::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-gridstack-page::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-desktop-defaultpage {
    display: block
}

.ldesign-setting-colors {
    display: grid;
    list-style: none;
    padding: 0;
    width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--td-comp-size-l) * 4), 1fr));
    gap: var(--td-comp-margin-s)
}

.ldesign-setting-colors__item {
    overflow: hidden
}

.ldesign-setting-colors__item:last-child {
    grid-column: 1 / -1;
    background-color: var(--td-bg-color-container-hover);
    padding: var(--td-comp-paddingTB-xs) var(--td-comp-paddingLR-m);
    border-radius: var(--td-radius-medium);
    display: flex;
    align-items: center;
    gap: var(--td-comp-margin-s);
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary)
}

.ldesign-setting-colors__content {
    width: 100%
}

.ldesign-setting-colors__content .l-color-picker__head {
    padding-top: 0
}

.ldesign-setting-colors__content .l-space-item {
    flex-shrink: 0;
    width: 100%
}

.ldesign-setting-colors__row {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m) 0 var(--td-comp-paddingLR-m);
    gap: var(--td-comp-margin-xs);
    list-style: none;
    margin: 0;
    width: 256px
}

.ldesign-setting-colors__row li:first-child {
    flex: 1;
    overflow: hidden
}

.ldesign-setting-colors__buttons {
    padding: 0 var(--td-comp-paddingLR-m) var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);
    display: flex;
    justify-content: flex-end;
    gap: var(--td-comp-margin-xs)
}

.ldesign-setting-colors__box {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-m);
    border: 1px solid var(--td-border-level-1-color);
    box-sizing: border-box;
    border-radius: var(--td-radius-medium);
    padding: 0 var(--td-comp-paddingLR-xxs);
    cursor: pointer;
    transition: .2s
}

.ldesign-setting-colors__box:hover {
    border-color: var(--td-brand-color)
}

.ldesign-setting-colors__box-color {
    display: inline-flex;
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs);
    border-radius: var(--td-radius-medium)
}

.ldesign-setting-colors__box-label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    margin: 0;
    flex: 1;
    margin: 0 var(--td-comp-margin-xs)
}

.ldesign-setting-colors__box-close {
    color: var(--td-text-color-placeholder);
    display: inline-flex;
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs);
    align-items: center;
    justify-content: center;
    border-radius: 50%
}

.ldesign-setting-colors__box-close:hover {
    color: var(--td-brand-color);
    background-color: var(--td-brand-color-light)
}

.colors-enter-active,
.colors-leave-active {
    transition: all .2s ease
}

.colors-enter-from,
.colors-leave-to {
    transform: translate(30px);
    opacity: 0
}

.ldesign-setting-colormode {
    margin-top: var(--td-comp-margin-l);
    display: flex;
    flex-direction: column;
    gap: var(--td-comp-margin-m);
    width: 100%
}

.ldesign-setting-colormode__cover {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--td-bg-color-container)
}

.ldesign-setting-colormode__cover.is-active {
    background-color: var(--td-brand-color-light)
}

.ldesign-desktopsetting__layoutpicker {
    display: grid;
    width: 100%;
    gap: var(--td-comp-margin-m);
    padding: var(--td-comp-paddingTB-m) 0
}

.ldesign-desktopsetting__layoutpicker-row {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-xxxl)
}

.ldesign-desktopsetting__layoutpicker-row h2 {
    flex: 1;
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    color: var(--td-text-color-primary)
}

.ldesign-desktopsetting__loginlayoutpicker {
    width: 100%;
    display: grid;
    gap: var(--td-comp-margin-m);
    padding: var(--td-comp-paddingTB-m) 0
}

.ldesign-desktopsetting__loginlayoutpicker-row {
    display: flex;
    align-items: center;
    height: var(--td-comp-size-xxxl)
}

.ldesign-desktopsetting__loginlayoutpicker-row h2 {
    flex: 1;
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    color: var(--td-text-color-primary)
}

.ldesign-desktopsetting__radius {
    display: grid;
    gap: var(--td-comp-margin-m);
    padding: var(--td-comp-paddingTB-l) 0;
    width: 100%
}

.ldesign-radius {
    display: grid;
    grid-template-columns: 1fr calc(var(--td-comp-size-xxl) * 3);
    grid-template-rows: repeat(2, var(--td-comp-size-xl));
    gap: var(--td-comp-margin-m);
    grid-template-areas: "preview select" "preview default"
}

.ldesign-radius>* {
    background-color: var(--td-bg-color-container-hover);
    border-radius: var(--td-radius-default);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--td-comp-margin-xs)
}

.ldesign-radius__preview {
    grid-area: preview
}

.ldesign-radius__preview-box {
    width: calc(var(--td-comp-size-xxxxl));
    height: calc(var(--td-comp-size-xxxxl));
    border: 2px solid var(--td-brand-color);
    border-radius: var(--td-radius-default);
    background-color: var(--td-bg-color-container);
    display: flex;
    align-items: center;
    justify-content: center
}

.ldesign-radius__select {
    grid-area: select
}

.ldesign-radius__select .l-input {
    height: var(--td-comp-size-l)
}

.ldesign-radius__default {
    grid-area: default;
    cursor: pointer
}

.ldesign-radius__default:hover {
    background-color: var(--td-brand-color-light);
    color: var(--td-brand-color)
}

.ldesign-radius__default.is-default {
    cursor: not-allowed
}

.ldesign-setting-size {
    display: grid;
    grid-template-columns: 60% 1fr;
    grid-template-rows: auto auto;
    width: 100%;
    grid-template-areas: "preview select" "preview button";
    gap: var(--td-comp-margin-m)
}

.ldesign-setting-size__select {
    grid-area: select;
    overflow: hidden
}

.ldesign-setting-size__button {
    grid-area: button;
    overflow: hidden
}

.ldesign-setting-size__button .l-button {
    background-color: var(--td-bg-color-container-hover);
    color: var(--td-text-color-primary);
    border-color: var(--td-bg-color-container-hover)
}

.ldesign-setting-size__button .l-button:hover {
    background-color: var(--td-bg-color-container-active);
    border-color: var(--td-bg-color-container-active);
    --ripple-color: var(--td-bg-color-component-hover) !important
}

.ldesign-setting-size__preview {
    grid-area: preview;
    background-color: var(--td-bg-color-container-hover);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--td-comp-margin-xs);
    color: var(--td-brand-color)
}

.ldesign-setting-size__preview .l-icon {
    width: 1.2em;
    height: 1.2em
}

.ldesign-setting-size__preview span {
    display: flex;
    align-items: center;
    line-height: 1;
    color: inherit
}

.ldesign-setting-size-wrap {
    display: grid;
    gap: var(--td-comp-margin-m);
    padding: var(--td-comp-paddingTB-l) 0;
    width: 100%
}

.ldesign-setting {
    width: 100%;
    height: 100%;
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);
    box-sizing: border-box;
    overflow: auto;
    color: var(--td-text-color-primary)
}

@-moz-document url-prefix() {
    .ldesign-setting {
        scrollbar-color: rgba(0, 0, 0, .1) transparent;
        scrollbar-width: thin
    }
}

.ldesign-setting::-webkit-scrollbar {
    width: 3px;
    height: 3px
}

.ldesign-setting::-webkit-scrollbar-thumb {
    border: 0px solid transparent;
    background-clip: content-box;
    background-color: #0000001a;
    border-radius: 5px
}

.ldesign-setting::-webkit-scrollbar-thumb:vertical:hover,
.ldesign-setting::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: #0000004d
}

.ldesign-setting__tabs {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    background-color: var(--td-bg-color-component);
    position: relative;
    gap: var(--td-comp-margin-s);
    border: calc(var(--td-comp-size-xxxs) * .2) solid var(--td-bg-color-component);
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium))
}

.ldesign-setting__tabs-item {
    height: var(--td-comp-size-l);
    display: flex;
    align-items: center;
    padding: 0 var(--td-comp-paddingLR-m);
    position: relative;
    z-index: 2;
    white-space: nowrap;
    cursor: pointer;
    color: var(--td-text-color-secondary)
}

.ldesign-setting__tabs-item.active {
    color: var(--td-brand-color);
    font-weight: 700
}

.ldesign-setting__tabs-indicator {
    display: inline-block;
    height: 100%;
    height: var(--td-comp-size-l);
    width: 4em;
    background-color: var(--td-bg-color-container);
    position: absolute;
    border-radius: inherit;
    transition: .2s
}

.ldesign-setting__content.common {
    padding-top: var(--td-comp-paddingTB-l)
}

.ldesign-setting__content .l-input {
    border-color: var(--td-bg-color-container-hover);
    background-color: var(--td-bg-color-container-hover);
    box-shadow: none
}

.ldesign-setting__content .l-input.l-is-focused {
    border-color: var(--td-brand-color);
    background-color: var(--td-brand-color-light);
    box-shadow: 0 0 0 2px var(--td-brand-color-focus)
}

.ldesign-setting-row {
    display: flex;
    align-items: center;
    padding: var(--td-comp-paddingTB-l) 0
}

.ldesign-setting-row__label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    color: var(--td-text-color-primary);
    margin: 0
}

.ldesign-setting-row__content {
    flex: 1;
    display: flex;
    justify-content: flex-end
}

.ldesign-setting-row__content .l-radio:last-child {
    margin-right: 0
}

.ldesign-settingpage__title {
    font-size: var(--td-font-size-title-large);
    margin: 0;
    color: var(--td-text-color-primary)
}

.ldesign-window__setting .l-drawer__body {
    padding: 0
}

.ldesign-window__setting .l-drawer__close-btn {
    background-color: transparent
}

.ldesign-window__setting-banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.ldesign-window__setting-banner svg {
    width: 100%;
    height: auto
}

.ldesign-window__setting-title {
    font-size: inherit;
    margin: 0;
    position: relative;
    z-index: 2
}

.ldesign-nofile,
.ldesign-norouter {
    height: 100%;
    overflow: hidden;
    border-radius: var(--desktop-layout-radius, var(--td-radius-medium));
    transition: inherit;
    flex: 1;
    display: flex;
    flex-direction: column
}

.ldesign-notfound {
    display: flex;
    height: 100%
}

.ldesign-personalcenter__information {
    display: grid;
    background-color: var(--td-bg-color-container);
    padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-m);
    grid-template-columns: calc(var(--td-comp-size-l) * 3) 1fr auto;
    gap: var(--td-comp-margin-l);
    border-radius: var(--desktop-layout-radius)
}

.ldesign-personalcenter__information-prefix {
    width: calc(var(--td-comp-size-l) * 3);
    aspect-ratio: 1
}

.ldesign-personalcenter__information-prefix .l-image__wrapper {
    width: 100%;
    height: 100%
}

.ldesign-personalcenter__information-sex {
    display: inline-flex;
    width: var(--td-comp-size-xxs);
    height: var(--td-comp-size-xxs);
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--td-text-color-anti)
}

.ldesign-personalcenter__information-sex.is-male {
    background-color: var(--td-brand-color)
}

.ldesign-personalcenter__information-sex.is-female {
    background-color: var(--td-error-color)
}

.ldesign-personalcenter__information-avatar-error {
    display: flex;
    width: 100%;
    height: 100%
}

.ldesign-personalcenter__information-avatar-error svg {
    width: 100%;
    height: 100%
}

.ldesign-personalcenter__information-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--td-comp-size-l) * 5), 1fr));
    gap: var(--td-comp-margin-m) var(--td-comp-margin-l)
}

.ldesign-personalcenter__information-item {
    display: grid;
    gap: var(--td-comp-margin-xxs);
    grid-template-columns: auto 1fr
}

.ldesign-personalcenter__information-label {
    font-size: var(--td-font-size-body-medium);
    font-weight: 400;
    color: var(--td-text-color-secondary);
    margin: 0;
    display: flex;
    align-items: center
}

.ldesign-personalcenter__information-value {
    margin: 0;
    color: var(--td-text-color-primary);
    font-size: var(--td-font-size-body-medium);
    display: flex;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    gap: var(--td-comp-margin-xs)
}

.ldesign-personalcenter__information-value.is-userflag {
    font-weight: 700;
    font-size: var(--td-font-size-title-medium)
}

.ldesign-root {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: var(--td-bg-color-container)
}

.ldesign-root__loading {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.root-enter-active,
.root-leave-active {
    transition: all .2s ease
}

.root-enter-from,
.root-leave-to {
    opacity: 0;
    transform: translate(30px)
}

.ldesign-login {
    height: 100%;
    display: flex;
    width: 100%;
    flex-direction: column;
    background-color: var(--td-bg-color-container);
    color: var(--td-text-color-primary);
    --ldesign-login-max-width: 1200px;
    overflow: hidden;
    position: relative
}

.ldesign-login.is-device--mobile .ldesign-login__middle,
.ldesign-login__header {
    width: 100%
}

.ldesign-login__panel {
    display: grid;
    gap: var(--td-comp-margin-l);
    box-sizing: border-box
}

.ldesign-login__panel.is-size--large {
    gap: var(--td-comp-margin-xxl)
}

.ldesign-login__copyright {
    font-size: var(--td-font-size-body-small);
    color: var(--td-text-color-secondary);
    width: 100%
}

.ldesign-login__middle {
    max-width: var(--ldesign-login-max-width);
    width: 80%;
    margin: 0 auto;
    display: flex;
    height: 100%;
    box-sizing: border-box
}

.ldesign-login__banner {
    background-color: var(--td-brand-color);
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-anti);
    position: relative
}

.ldesign-login__content {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%
}

.ldesign-login__footer {
    display: grid;
    width: 100%
}

.ldesign-login__loading {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: var(--td-font-size-body-medium);
    color: var(--td-text-color-placeholder);
    gap: var(--td-comp-margin-m)
}

.ldesign-login__loading p {
    margin: 0
}

.ldesign-layout {
    --desktop-layout-uncollapsed-width: calc(var(--td-comp-size-l) * 8);
    --desktop-layout-collapsed-width: calc(var(--td-comp-size-l) * 1.2);
    --desktop-layout-header-height: calc(var(--td-comp-size-l) * 1.6);
    --desktop-layout-nav-height: calc(var(--td-comp-size-l) * 1.3);
    --desktop-layout-bookmark-height: calc(var(--td-comp-size-l) * 1.1);
    --desktop-layout-breadcrumb-height: calc(var(--td-font-size-body-medium) + var(--desktop-layout-padding) * 2);
    --desktop-layout-bookmark-background: var(--td-bg-color-secondarycontainer);
    --desktop-layout-header-background: var(--td-bg-color-container);
    --desktop-layout-nav-background: var(--td-bg-color-container);
    --desktop-layout-asider-background: var(--td-bg-color-container);
    --desktop-layout-asider-width: var(--desktop-layout-uncollapsed-width);
    --desktop-layout-transition: .2s cubic-bezier(.25, .1, .25, 1);
    --desktop-layout-radius: var(--td-radius-medium);
    --desktop-layout-padding: var(--td-comp-margin-m);
    --desktop-layout-background: var(--td-bg-color-page);
    --desktop-layout-panel-background: var(--td-bg-color-container);
    color: var(--td-text-color-primary)
}

.ldesign-layout.is-device--mobile {
    --desktop-layout-padding: var(--td-comp-margin-s)
}

.ldesign-layout__wrapper .ldesign-layout:not(:last-child) {
    display: none
}