/* Component styles copied from the read-only reference module-components.css.
 * Only the body scope is adapted to the FastAdmin content document. */
/* Shared business components. Layout, navigation and editor canvas stay in their own stylesheets. */
:is(body.inside-aside, body.inside-header) {
    --zf-ui-primary: #168268;
    --zf-ui-primary-hover: #126d57;
    --zf-ui-heading: #123b33;
    --zf-ui-text: #243b36;
    --zf-ui-muted: #63766b;
    --zf-ui-border: #e4ebe7;
    --zf-ui-input-border: #cddbd3;
    --zf-ui-soft: #f4f7f5;
    --zf-ui-selected: #eaf5ef;
    --zf-ui-danger: #c44848;
    --zf-ui-warning: #a66c19;
}

/* Panels and filters: distinguish section titles without adding another layout wrapper. */
:is(body.inside-aside, body.inside-header) .el-card {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-border);
    border-radius: 12px;
    background-color: #fff;
}

:is(body.inside-aside, body.inside-header) .el-card.is-always-shadow,
:is(body.inside-aside, body.inside-header) .el-card.is-hover-shadow:hover,
:is(body.inside-aside, body.inside-header) .el-card.is-hover-shadow:focus {
    /* The original element_yzd.css declares an important zero shadow. */
    box-shadow: 0 2px 10px rgba(18, 59, 51, 0.035) !important;
}

:is(body.inside-aside, body.inside-header) .el-card__header {
    padding: 17px 20px;
    border-bottom-color: var(--zf-ui-border);
    color: var(--zf-ui-heading);
    font-size: 16px;
    font-weight: 600;
}

:is(body.inside-aside, body.inside-header) .el-card__body {
    padding: 20px;
}

:is(body.inside-aside, body.inside-header) .el-card .el-card {
    border-radius: 9px;
    box-shadow: none !important;
}

:is(body.inside-aside, body.inside-header) .demo-form-inline {
    padding: 12px 14px 0;
    margin-bottom: 18px;
    border: 1px solid var(--zf-ui-border);
    border-radius: 9px;
    background: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item {
    margin-right: 12px;
    margin-bottom: 12px;
}

:is(body.inside-aside, body.inside-header) .page-toolbar,
:is(body.inside-aside, body.inside-header) .page-table-header {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-tabs__header {
    margin-bottom: 20px;
}

:is(body.inside-aside, body.inside-header) .el-tabs__item {
    color: var(--zf-ui-muted);
    font-size: 14px;
    font-weight: 500;
}

:is(body.inside-aside, body.inside-header) .el-tabs__item:hover,
:is(body.inside-aside, body.inside-header) .el-tabs__item.is-active {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-tabs__active-bar {
    height: 3px;
    border-radius: 3px;
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-tabs__nav-wrap::after {
    height: 1px;
    background-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-tabs--card > .el-tabs__header,
:is(body.inside-aside, body.inside-header) .el-tabs--card > .el-tabs__header .el-tabs__nav,
:is(body.inside-aside, body.inside-header) .el-tabs--card > .el-tabs__header .el-tabs__item,
:is(body.inside-aside, body.inside-header) .el-tabs--border-card {
    border-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
    border-bottom-color: #fff;
}

:is(body.inside-aside, body.inside-header) .el-tabs--border-card > .el-tabs__header {
    background-color: var(--zf-ui-soft);
}

/* One control size across edit forms and filters; compact actions are limited to tables. */
:is(body.inside-aside, body.inside-header) .el-input,
:is(body.inside-aside, body.inside-header) .el-textarea,
:is(body.inside-aside, body.inside-header) .el-select,
:is(body.inside-aside, body.inside-header) .el-cascader {
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-input--small,
:is(body.inside-aside, body.inside-header) .el-input--mini,
:is(body.inside-aside, body.inside-header) .el-select--small,
:is(body.inside-aside, body.inside-header) .el-select--mini,
:is(body.inside-aside, body.inside-header) .el-cascader--small,
:is(body.inside-aside, body.inside-header) .el-cascader--mini {
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-input__inner,
:is(body.inside-aside, body.inside-header) .el-textarea__inner,
:is(body.inside-aside, body.inside-header) .el-range-editor.el-input__inner {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-input-border);
    border-radius: 7px;
    background-color: #fff;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

:is(body.inside-aside, body.inside-header) .el-input__inner::placeholder,
:is(body.inside-aside, body.inside-header) .el-textarea__inner::placeholder,
:is(body.inside-aside, body.inside-header) .el-range-input::placeholder {
    color: #8a9b92;
}

:is(body.inside-aside, body.inside-header) .el-textarea__inner {
    padding: 9px 12px;
    line-height: 1.65;
}

:is(body.inside-aside, body.inside-header) .el-input__inner:hover,
:is(body.inside-aside, body.inside-header) .el-textarea__inner:hover,
:is(body.inside-aside, body.inside-header) .el-select:hover .el-input__inner,
:is(body.inside-aside, body.inside-header) .el-cascader:not(.is-disabled):hover .el-input__inner {
    border-color: #a6bcaf;
}

:is(body.inside-aside, body.inside-header) .el-input__inner:focus,
:is(body.inside-aside, body.inside-header) .el-textarea__inner:focus,
:is(body.inside-aside, body.inside-header) .el-select .el-input.is-focus .el-input__inner,
:is(body.inside-aside, body.inside-header) .el-cascader .el-input.is-focus .el-input__inner,
:is(body.inside-aside, body.inside-header) .el-range-editor.is-active {
    border-color: var(--zf-ui-primary);
    box-shadow: 0 0 0 3px rgba(22, 130, 104, 0.1);
}

:is(body.inside-aside, body.inside-header) .el-input-group__append,
:is(body.inside-aside, body.inside-header) .el-input-group__prepend,
:is(body.inside-aside, body.inside-header) .el-input-number__increase,
:is(body.inside-aside, body.inside-header) .el-input-number__decrease {
    color: var(--zf-ui-muted);
    border-color: var(--zf-ui-input-border);
    background-color: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .el-input-group--append > .el-input__inner {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

:is(body.inside-aside, body.inside-header) .el-input-group--prepend > .el-input__inner {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Keep Element's table layout: units, direct actions and upload-wrapped actions share one 40px control. */
:is(body.inside-aside, body.inside-header) .el-input-group {
    border-radius: 7px;
    vertical-align: middle;
}

:is(body.inside-aside, body.inside-header) .el-input-group__append,
:is(body.inside-aside, body.inside-header) .el-input-group__prepend {
    height: 40px;
    padding: 0 14px;
    font-size: 14px;
    line-height: 38px;
    vertical-align: middle;
}

:is(body.inside-aside, body.inside-header) .el-input-group__append { border-radius: 0 7px 7px 0; }
:is(body.inside-aside, body.inside-header) .el-input-group__prepend { border-radius: 7px 0 0 7px; }

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend):has(.el-button, .el-select) {
    padding: 0;
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) .el-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 38px;
    min-height: 38px;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-radius: inherit;
    background: transparent;
    color: inherit;
    line-height: 20px;
    vertical-align: top;
}

:is(body.inside-aside, body.inside-header) .el-input-group__append .el-button { border-radius: 0 6px 6px 0; }
:is(body.inside-aside, body.inside-header) .el-input-group__prepend .el-button { border-radius: 6px 0 0 6px; }

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) > div:has(> .el-upload),
:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) .el-upload {
    display: flex;
    align-items: stretch;
    height: 38px;
    margin: 0;
    line-height: normal;
    border-radius: inherit;
    color: inherit;
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) .el-select {
    display: block;
    width: 128px;
    margin: 0;
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) .el-select .el-input {
    min-width: 0;
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) .el-select .el-input__inner {
    height: 38px;
    padding-right: 30px;
    border: 0;
    border-radius: inherit;
    background: transparent;
    line-height: 38px;
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend) .el-select .el-input__icon {
    line-height: 38px;
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend):has(.el-button:hover:not(.is-disabled)) {
    color: var(--zf-ui-primary);
    background: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend):has(.el-button--primary:not(.is-disabled), .el-button--success:not(.is-disabled)) {
    color: #fff;
    border-color: var(--zf-ui-primary);
    background: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) :is(.el-input-group__append, .el-input-group__prepend):has(.el-button--primary:hover:not(.is-disabled), .el-button--success:hover:not(.is-disabled)) {
    border-color: var(--zf-ui-primary-hover);
    background: var(--zf-ui-primary-hover);
}

:is(body.inside-aside, body.inside-header) .el-input-group:focus-within {
    box-shadow: 0 0 0 3px rgba(22, 130, 104, 0.1);
}

:is(body.inside-aside, body.inside-header) .el-input-group:focus-within > :is(.el-input__inner, .el-input-group__append, .el-input-group__prepend) {
    border-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-input-group .el-input__inner:focus {
    box-shadow: none;
}

:is(body.inside-aside, body.inside-header) .el-dialog,
:is(body.inside-aside, body.inside-header) .el-message-box { max-width: calc(100vw - 32px); }

:is(body.inside-aside, body.inside-header) .el-input-number__increase:hover,
:is(body.inside-aside, body.inside-header) .el-input-number__decrease:hover {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-range-input,
:is(body.inside-aside, body.inside-header) .el-range-separator,
:is(body.inside-aside, body.inside-header) .el-date-editor .el-range-input {
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-form-item {
    margin-bottom: 22px;
}

:is(body.inside-aside, body.inside-header) .el-form-item__label {
    color: var(--zf-ui-muted);
    padding-right: 16px;
    font-size: 14px;
    font-weight: 500;
}

:is(body.inside-aside, body.inside-header) .el-form-item__content {
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-form-item__error {
    color: var(--zf-ui-danger);
    font-size: 13px;
    padding-top: 5px;
}

:is(body.inside-aside, body.inside-header) .el-form-item.is-error .el-input__inner,
:is(body.inside-aside, body.inside-header) .el-form-item.is-error .el-textarea__inner {
    border-color: var(--zf-ui-danger);
}

:is(body.inside-aside, body.inside-header) .el-form-item.is-error .el-input__inner:focus,
:is(body.inside-aside, body.inside-header) .el-form-item.is-error .el-textarea__inner:focus {
    box-shadow: 0 0 0 3px rgba(196, 72, 72, 0.1);
}

:is(body.inside-aside, body.inside-header) .el-input.is-disabled .el-input__inner,
:is(body.inside-aside, body.inside-header) .el-textarea.is-disabled .el-textarea__inner,
:is(body.inside-aside, body.inside-header) .el-range-editor.is-disabled,
:is(body.inside-aside, body.inside-header) .el-range-editor.is-disabled input {
    color: #86978e;
    border-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
    box-shadow: none;
}

/* Checkable controls keep their original hit areas and checked/disabled semantics. */
:is(body.inside-aside, body.inside-header) .el-checkbox__label,
:is(body.inside-aside, body.inside-header) .el-radio__label,
:is(body.inside-aside, body.inside-header) .el-switch__label {
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-checkbox__inner,
:is(body.inside-aside, body.inside-header) .el-radio__inner,
:is(body.inside-aside, body.inside-header) .el-switch__core {
    border-color: var(--zf-ui-input-border);
}

:is(body.inside-aside, body.inside-header) .el-checkbox__inner:hover,
:is(body.inside-aside, body.inside-header) .el-radio__inner:hover {
    border-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-checked .el-checkbox__inner,
:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-indeterminate .el-checkbox__inner,
:is(body.inside-aside, body.inside-header) .el-radio__input.is-checked .el-radio__inner,
:is(body.inside-aside, body.inside-header) .el-switch.is-checked .el-switch__core {
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-checked + .el-checkbox__label,
:is(body.inside-aside, body.inside-header) .el-radio__input.is-checked + .el-radio__label,
:is(body.inside-aside, body.inside-header) .el-switch__label.is-active {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-focus .el-checkbox__inner,
:is(body.inside-aside, body.inside-header) .el-radio__input:not(.is-disabled):focus-within .el-radio__inner {
    border-color: var(--zf-ui-primary);
    box-shadow: 0 0 0 3px rgba(22, 130, 104, 0.12);
}

:is(body.inside-aside, body.inside-header) .el-radio-button__inner,
:is(body.inside-aside, body.inside-header) .el-checkbox-button__inner {
    color: var(--zf-ui-muted);
    border-color: var(--zf-ui-input-border);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-radio-button__orig-radio:checked + .el-radio-button__inner,
:is(body.inside-aside, body.inside-header) .el-checkbox-button.is-checked .el-checkbox-button__inner {
    color: #fff;
    background-color: var(--zf-ui-primary);
    border-color: var(--zf-ui-primary);
    box-shadow: -1px 0 0 0 var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-disabled .el-checkbox__inner,
:is(body.inside-aside, body.inside-header) .el-radio__input.is-disabled .el-radio__inner {
    border-color: var(--zf-ui-border);
    background-color: #edf1ee;
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-disabled + .el-checkbox__label,
:is(body.inside-aside, body.inside-header) .el-radio__input.is-disabled + .el-radio__label {
    color: #728277;
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
    border-color: #82958a;
}

:is(body.inside-aside, body.inside-header) .el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before,
:is(body.inside-aside, body.inside-header) .el-radio__input.is-disabled.is-checked .el-radio__inner::after {
    background-color: #82958a;
}

:is(body.inside-aside, body.inside-header) .el-radio-button__orig-radio:disabled + .el-radio-button__inner,
:is(body.inside-aside, body.inside-header) .el-checkbox-button.is-disabled .el-checkbox-button__inner {
    color: #728277;
    border-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
    box-shadow: none;
}

:is(body.inside-aside, body.inside-header) .el-radio-button__orig-radio:disabled:checked + .el-radio-button__inner,
:is(body.inside-aside, body.inside-header) .el-checkbox-button.is-disabled.is-checked .el-checkbox-button__inner {
    color: var(--zf-ui-muted);
    border-color: var(--zf-ui-input-border);
    background-color: #e3ebe6;
}

/* Editor and setup controls: preserve canvas geometry and the actual chosen colors. */
:is(body.inside-aside, body.inside-header) .el-steps--simple {
    background-color: var(--zf-ui-soft);
    border-radius: 9px;
}

:is(body.inside-aside, body.inside-header) .el-step__head.is-process,
:is(body.inside-aside, body.inside-header) .el-step__title.is-process,
:is(body.inside-aside, body.inside-header) .el-step__description.is-process {
    color: var(--zf-ui-heading);
    border-color: var(--zf-ui-heading);
}

:is(body.inside-aside, body.inside-header) .el-step__head.is-finish,
:is(body.inside-aside, body.inside-header) .el-step__head.is-success,
:is(body.inside-aside, body.inside-header) .el-step__title.is-finish,
:is(body.inside-aside, body.inside-header) .el-step__title.is-success,
:is(body.inside-aside, body.inside-header) .el-step__description.is-finish,
:is(body.inside-aside, body.inside-header) .el-step__description.is-success {
    color: var(--zf-ui-primary);
    border-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-step__head.is-error,
:is(body.inside-aside, body.inside-header) .el-step__title.is-error,
:is(body.inside-aside, body.inside-header) .el-step__description.is-error {
    color: var(--zf-ui-danger);
    border-color: var(--zf-ui-danger);
}

:is(body.inside-aside, body.inside-header) .el-step__head.is-wait,
:is(body.inside-aside, body.inside-header) .el-step__title.is-wait,
:is(body.inside-aside, body.inside-header) .el-step__description.is-wait {
    color: #82958a;
    border-color: var(--zf-ui-input-border);
}

:is(body.inside-aside, body.inside-header) .el-step__title {
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-step__description {
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-step__line {
    background-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-collapse,
:is(body.inside-aside, body.inside-header) .el-collapse-item__header,
:is(body.inside-aside, body.inside-header) .el-collapse-item__wrap {
    border-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-collapse-item__header {
    color: var(--zf-ui-heading);
    background-color: var(--zf-ui-soft);
    font-size: 14px;
    font-weight: 500;
}

:is(body.inside-aside, body.inside-header) .el-collapse-item__header.is-active,
:is(body.inside-aside, body.inside-header) .el-collapse-item__header:hover {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-collapse-item.is-disabled .el-collapse-item__header {
    color: #728277;
}

:is(body.inside-aside, body.inside-header) .el-collapse-item__content {
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-slider__runway {
    background-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-slider__runway:not(.disabled) .el-slider__bar {
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-slider__runway:not(.disabled) .el-slider__button {
    border-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-slider__runway.disabled .el-slider__bar {
    background-color: #a8b9af;
}

:is(body.inside-aside, body.inside-header) .el-slider__runway.disabled .el-slider__button {
    border-color: #a8b9af;
}

:is(body.inside-aside, body.inside-header) .el-slider__marks-text {
    color: var(--zf-ui-muted);
    font-size: 13px;
}

:is(body.inside-aside, body.inside-header) .el-color-picker__trigger {
    border-color: var(--zf-ui-input-border);
    border-radius: 7px;
}

:is(body.inside-aside, body.inside-header) .el-color-picker:not(.is-disabled) .el-color-picker__trigger:hover {
    border-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-color-dropdown {
    border-color: var(--zf-ui-border);
    border-radius: 9px;
    box-shadow: 0 8px 28px rgba(18, 59, 51, 0.12);
}

:is(body.inside-aside, body.inside-header) .el-color-dropdown__btn {
    color: var(--zf-ui-primary);
    border-color: var(--zf-ui-input-border);
    border-radius: 6px;
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-color-dropdown__btn:hover {
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .el-color-dropdown__btn[disabled],
:is(body.inside-aside, body.inside-header) .el-color-dropdown__btn[disabled]:hover {
    color: #728277;
    border-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .el-color-dropdown__link-btn {
    color: var(--zf-ui-muted);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-color-dropdown__link-btn:hover {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-color-predefine__color-selector.selected {
    box-shadow: 0 0 3px 2px var(--zf-ui-primary);
}

/* Actions: primary/success share the platform green; destructive actions stay red. */
:is(body.inside-aside, body.inside-header) .el-button {
    border-radius: 7px;
    font-size: 14px;
    font-weight: 500;
    transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

:is(body.inside-aside, body.inside-header) .el-button--small,
:is(body.inside-aside, body.inside-header) .el-button--mini {
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-button.is-circle {
    border-radius: 50%;
}

:is(body.inside-aside, body.inside-header) .el-button.is-round {
    border-radius: 20px;
}

:is(body.inside-aside, body.inside-header) .el-button--default {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-input-border);
    background-color: #fff;
}

:is(body.inside-aside, body.inside-header) .el-button--default:hover,
:is(body.inside-aside, body.inside-header) .el-button--default:focus {
    color: var(--zf-ui-primary);
    border-color: #a6c9b8;
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .el-button--primary,
:is(body.inside-aside, body.inside-header) .el-button--success {
    color: #fff;
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-button--primary:hover,
:is(body.inside-aside, body.inside-header) .el-button--primary:focus,
:is(body.inside-aside, body.inside-header) .el-button--success:hover,
:is(body.inside-aside, body.inside-header) .el-button--success:focus {
    color: #fff;
    border-color: var(--zf-ui-primary-hover);
    background-color: var(--zf-ui-primary-hover);
}

:is(body.inside-aside, body.inside-header) .el-button--primary.is-plain,
:is(body.inside-aside, body.inside-header) .el-button--success.is-plain {
    color: var(--zf-ui-primary);
    border-color: #bedbcd;
    background-color: #f0f8f4;
}

:is(body.inside-aside, body.inside-header) .el-button--primary.is-plain:hover,
:is(body.inside-aside, body.inside-header) .el-button--success.is-plain:hover {
    color: var(--zf-ui-primary-hover);
    border-color: var(--zf-ui-primary);
    background-color: #e2f1e9;
}

:is(body.inside-aside, body.inside-header) .el-button--yzd,
:is(body.inside-aside, body.inside-header) .el-button--yzd:focus,
:is(body.inside-aside, body.inside-header) .el-button--yzd:hover {
    /* The legacy custom button is already important in style.css. */
    color: #fff !important;
    border-color: var(--zf-ui-primary) !important;
    background-color: var(--zf-ui-primary) !important;
}

:is(body.inside-aside, body.inside-header) .el-button--danger {
    color: #fff;
    border-color: var(--zf-ui-danger);
    background-color: var(--zf-ui-danger);
}

:is(body.inside-aside, body.inside-header) .el-button--danger:hover,
:is(body.inside-aside, body.inside-header) .el-button--danger:focus {
    border-color: #ae3838;
    background-color: #ae3838;
}

:is(body.inside-aside, body.inside-header) .el-button--danger.is-plain {
    color: var(--zf-ui-danger);
    border-color: #ebcccc;
    background-color: #fff5f4;
}

:is(body.inside-aside, body.inside-header) .el-button--danger.is-plain:hover {
    color: #ae3838;
    border-color: #d48686;
    background-color: #fce9e7;
}

:is(body.inside-aside, body.inside-header) .el-button--warning {
    color: #fff;
    border-color: var(--zf-ui-warning);
    background-color: var(--zf-ui-warning);
}

:is(body.inside-aside, body.inside-header) .el-button--warning.is-plain {
    color: var(--zf-ui-warning);
    border-color: #e5d4b5;
    background-color: #fcf6eb;
}

:is(body.inside-aside, body.inside-header) .el-button--info {
    color: #fff;
    border-color: #627a70;
    background-color: #627a70;
}

:is(body.inside-aside, body.inside-header) .el-button--info.is-plain {
    color: var(--zf-ui-muted);
    border-color: var(--zf-ui-input-border);
    background-color: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .el-button--text,
:is(body.inside-aside, body.inside-header) .el-link.el-link--primary,
:is(body.inside-aside, body.inside-header) .el-link.el-link--success {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-button--text:hover,
:is(body.inside-aside, body.inside-header) .el-button--text:focus,
:is(body.inside-aside, body.inside-header) .el-link.el-link--primary:hover {
    color: var(--zf-ui-primary-hover);
}

:is(body.inside-aside, body.inside-header) .el-link.el-link--danger {
    color: var(--zf-ui-danger);
}

:is(body.inside-aside, body.inside-header) .el-link.el-link--primary.is-underline:hover::after {
    border-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-link.is-disabled,
:is(body.inside-aside, body.inside-header) .el-link.is-disabled:hover {
    color: #728277;
}

:is(body.inside-aside, body.inside-header) .el-button:focus-visible {
    outline: 3px solid rgba(22, 130, 104, 0.22);
    outline-offset: 2px;
}

:is(body.inside-aside, body.inside-header) .el-button.is-disabled:not(.el-button--text),
:is(body.inside-aside, body.inside-header) .el-button.is-disabled:not(.el-button--text):hover,
:is(body.inside-aside, body.inside-header) .el-button.is-disabled:not(.el-button--text):focus {
    color: #8a9b92;
    border-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
    box-shadow: none;
}

:is(body.inside-aside, body.inside-header) .el-button--text.is-disabled {
    color: #8a9b92;
    border-color: transparent;
    background-color: transparent;
}

:is(body.inside-aside, body.inside-header) .el-button--yzd.is-disabled,
:is(body.inside-aside, body.inside-header) .el-button--yzd.is-disabled:hover,
:is(body.inside-aside, body.inside-header) .el-button--yzd.is-disabled:focus {
    color: #8a9b92 !important;
    border-color: var(--zf-ui-border) !important;
    background-color: var(--zf-ui-soft) !important;
}

:is(body.inside-aside, body.inside-header) .el-tag {
    color: var(--zf-ui-primary);
    border-color: #cce4d7;
    border-radius: 5px;
    background-color: #f0f8f4;
    font-size: 13px;
}

:is(body.inside-aside, body.inside-header) .el-tag--warning {
    color: var(--zf-ui-warning);
    border-color: #e5d4b5;
    background-color: #fcf6eb;
}

:is(body.inside-aside, body.inside-header) .el-tag--danger {
    color: var(--zf-ui-danger);
    border-color: #ebcccc;
    background-color: #fff5f4;
}

:is(body.inside-aside, body.inside-header) .el-tag--info {
    color: var(--zf-ui-muted);
    border-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .el-tag--dark {
    color: #fff;
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-tag--dark.el-tag--warning {
    border-color: var(--zf-ui-warning);
    background-color: var(--zf-ui-warning);
}

:is(body.inside-aside, body.inside-header) .el-tag--dark.el-tag--danger {
    border-color: var(--zf-ui-danger);
    background-color: var(--zf-ui-danger);
}

:is(body.inside-aside, body.inside-header) .el-tag--dark.el-tag--info {
    border-color: var(--zf-ui-muted);
    background-color: var(--zf-ui-muted);
}

:is(body.inside-aside, body.inside-header) .el-tag--plain {
    background-color: #fff;
}

/* Tables retain fixed-column sizing, scrolling and row selection behavior. */
:is(body.inside-aside, body.inside-header) .el-table {
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-table th.el-table__cell,
:is(body.inside-aside, body.inside-header) .el-table th {
    padding-top: 12px;
    padding-bottom: 12px;
    color: var(--zf-ui-muted);
    border-bottom-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
    font-weight: 600;
}

:is(body.inside-aside, body.inside-header) .el-table td.el-table__cell,
:is(body.inside-aside, body.inside-header) .el-table td {
    padding-top: 13px;
    padding-bottom: 13px;
    border-bottom-color: #edf1ee;
}

:is(body.inside-aside, body.inside-header) .el-table .cell {
    line-height: 1.65;
    font-variant-numeric: tabular-nums;
}

:is(body.inside-aside, body.inside-header) .el-table--small td,
:is(body.inside-aside, body.inside-header) .el-table--small th,
:is(body.inside-aside, body.inside-header) .el-table--mini td,
:is(body.inside-aside, body.inside-header) .el-table--mini th {
    padding-top: 9px;
    padding-bottom: 9px;
}

:is(body.inside-aside, body.inside-header) .el-table--enable-row-hover .el-table__body tr:hover > td,
:is(body.inside-aside, body.inside-header) .el-table__body tr.hover-row > td,
:is(body.inside-aside, body.inside-header) .el-table__body tr.current-row > td {
    background-color: #f0f7f3;
}

:is(body.inside-aside, body.inside-header) .el-table--striped .el-table__body tr.el-table__row--striped > td {
    background-color: #fafcfb;
}

:is(body.inside-aside, body.inside-header) .el-table--striped .el-table__body tr.el-table__row--striped:hover > td,
:is(body.inside-aside, body.inside-header) .el-table--striped .el-table__body tr.el-table__row--striped.current-row > td {
    background-color: #f0f7f3;
}

:is(body.inside-aside, body.inside-header) .el-table::before,
:is(body.inside-aside, body.inside-header) .el-table--border::after,
:is(body.inside-aside, body.inside-header) .el-table--group::after {
    background-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-table--border,
:is(body.inside-aside, body.inside-header) .el-table--border th,
:is(body.inside-aside, body.inside-header) .el-table--border td {
    border-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-table__empty-block {
    min-height: 170px;
    background-color: #fff;
}

:is(body.inside-aside, body.inside-header) .el-table__empty-text,
:is(body.inside-aside, body.inside-header) .el-empty__description p {
    color: var(--zf-ui-muted);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-table .ascending .sort-caret.ascending {
    border-bottom-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-table .descending .sort-caret.descending {
    border-top-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-pagination {
    color: var(--zf-ui-muted);
    font-size: 14px;
    font-weight: 400;
}

:is(body.inside-aside, body.inside-header) .el-pagination button,
:is(body.inside-aside, body.inside-header) .el-pager li {
    color: var(--zf-ui-muted);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
}

:is(body.inside-aside, body.inside-header) .el-pagination button:hover,
:is(body.inside-aside, body.inside-header) .el-pager li:hover,
:is(body.inside-aside, body.inside-header) .el-pager li.active {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-pagination.is-background .btn-next,
:is(body.inside-aside, body.inside-header) .el-pagination.is-background .btn-prev,
:is(body.inside-aside, body.inside-header) .el-pagination.is-background .el-pager li {
    background-color: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .el-pagination.is-background .el-pager li:not(.disabled).active {
    color: #fff;
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-pagination button:disabled,
:is(body.inside-aside, body.inside-header) .el-pagination.is-background button:disabled {
    color: #a7b3ac;
}

/* Floating surfaces are also descendants of body: do not change positioning or stacking. */
:is(body.inside-aside, body.inside-header) .el-select-dropdown,
:is(body.inside-aside, body.inside-header) .el-cascader__dropdown,
:is(body.inside-aside, body.inside-header) .el-picker-panel,
:is(body.inside-aside, body.inside-header) .el-time-panel,
:is(body.inside-aside, body.inside-header) .el-dropdown-menu,
:is(body.inside-aside, body.inside-header) .el-popover {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-border);
    border-radius: 9px;
    box-shadow: 0 8px 28px rgba(18, 59, 51, 0.12);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-select-dropdown__item,
:is(body.inside-aside, body.inside-header) .el-cascader-node,
:is(body.inside-aside, body.inside-header) .el-dropdown-menu__item {
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-select-dropdown__item.hover,
:is(body.inside-aside, body.inside-header) .el-select-dropdown__item:hover,
:is(body.inside-aside, body.inside-header) .el-cascader-node:not(.is-disabled):hover,
:is(body.inside-aside, body.inside-header) .el-dropdown-menu__item:not(.is-disabled):hover {
    color: var(--zf-ui-primary);
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .el-select-dropdown__item.selected,
:is(body.inside-aside, body.inside-header) .el-cascader-node.is-active,
:is(body.inside-aside, body.inside-header) .el-cascader-node.in-active-path,
:is(body.inside-aside, body.inside-header) .el-picker-panel__shortcut:hover,
:is(body.inside-aside, body.inside-header) .el-date-table td.available:hover,
:is(body.inside-aside, body.inside-header) .el-date-table td.today span,
:is(body.inside-aside, body.inside-header) .el-time-panel__btn.confirm {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-select-dropdown__item.is-disabled,
:is(body.inside-aside, body.inside-header) .el-dropdown-menu__item.is-disabled,
:is(body.inside-aside, body.inside-header) .el-cascader-node.is-disabled {
    color: #9baaa2;
    background-color: transparent;
}

:is(body.inside-aside, body.inside-header) .el-date-table td.current:not(.disabled) span,
:is(body.inside-aside, body.inside-header) .el-date-table td.start-date span,
:is(body.inside-aside, body.inside-header) .el-date-table td.end-date span {
    color: #fff;
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-date-table td.in-range div,
:is(body.inside-aside, body.inside-header) .el-date-table td.in-range div:hover {
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .el-dialog,
:is(body.inside-aside, body.inside-header) .el-message-box,
:is(body.inside-aside, body.inside-header) .el-notification {
    color: var(--zf-ui-text);
    border-radius: 13px;
    box-shadow: 0 16px 56px rgba(18, 59, 51, 0.18);
}

:is(body.inside-aside, body.inside-header) .el-dialog__header {
    padding: 20px 24px 18px;
    border-bottom: 1px solid var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .el-dialog__title,
:is(body.inside-aside, body.inside-header) .el-message-box__title,
:is(body.inside-aside, body.inside-header) .el-notification__title {
    color: var(--zf-ui-heading);
    font-size: 16px;
    font-weight: 600;
}

:is(body.inside-aside, body.inside-header) .el-dialog__body {
    padding: 22px 24px;
    color: var(--zf-ui-text);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-dialog__footer {
    padding: 16px 24px 20px;
    border-top: 1px solid var(--zf-ui-border);
    background-color: #fafcfb;
    border-radius: 0 0 13px 13px;
}

:is(body.inside-aside, body.inside-header) .el-dialog__headerbtn:hover .el-dialog__close,
:is(body.inside-aside, body.inside-header) .el-message-box__headerbtn:hover .el-message-box__close {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-message-box__header {
    padding: 20px 22px 12px;
}

:is(body.inside-aside, body.inside-header) .el-message-box__content {
    padding: 12px 22px;
    color: var(--zf-ui-muted);
    font-size: 14px;
    line-height: 1.65;
}

:is(body.inside-aside, body.inside-header) .el-message-box__btns {
    padding: 12px 22px 16px;
}

:is(body.inside-aside, body.inside-header) .el-drawer__header {
    margin-bottom: 0;
    padding: 20px 24px;
    color: var(--zf-ui-heading);
    border-bottom: 1px solid var(--zf-ui-border);
    font-size: 16px;
    font-weight: 600;
}

:is(body.inside-aside, body.inside-header) .el-popover__title {
    color: var(--zf-ui-heading);
    font-size: 14px;
    font-weight: 600;
}

:is(body.inside-aside, body.inside-header) .el-tooltip__popper {
    font-size: 14px;
    line-height: 1.6;
}

:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark {
    color: #fff;
    background: var(--zf-ui-text);
}

:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="top"] .popper__arrow,
:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="top"] .popper__arrow::after {
    border-top-color: var(--zf-ui-text);
}

:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="bottom"] .popper__arrow,
:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="bottom"] .popper__arrow::after {
    border-bottom-color: var(--zf-ui-text);
}

:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="left"] .popper__arrow,
:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="left"] .popper__arrow::after {
    border-left-color: var(--zf-ui-text);
}

:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="right"] .popper__arrow,
:is(body.inside-aside, body.inside-header) .el-tooltip__popper.is-dark[x-placement^="right"] .popper__arrow::after {
    border-right-color: var(--zf-ui-text);
}

:is(body.inside-aside, body.inside-header) .el-message {
    border-radius: 9px;
    box-shadow: 0 5px 20px rgba(18, 59, 51, 0.09);
}

:is(body.inside-aside, body.inside-header) .el-message__content,
:is(body.inside-aside, body.inside-header) .el-notification__content {
    font-size: 14px;
    line-height: 1.6;
}

:is(body.inside-aside, body.inside-header) .el-message--success {
    border-color: #cce4d7;
    background-color: #f0f8f4;
}

:is(body.inside-aside, body.inside-header) .el-message--success .el-message__content,
:is(body.inside-aside, body.inside-header) .el-message .el-icon-success {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-message--error {
    border-color: #eed2cf;
    background-color: #fff5f4;
}

:is(body.inside-aside, body.inside-header) .el-message--error .el-message__content,
:is(body.inside-aside, body.inside-header) .el-message .el-icon-error {
    color: var(--zf-ui-danger);
}

:is(body.inside-aside, body.inside-header) .el-loading-spinner .path {
    stroke: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .el-loading-spinner .el-loading-text,
:is(body.inside-aside, body.inside-header) .el-loading-spinner i {
    color: var(--zf-ui-primary);
}

/* Upload areas keep their existing dimensions, so form alignment and previews stay intact. */
:is(body.inside-aside, body.inside-header) .data-image,
:is(body.inside-aside, body.inside-header) .select-img-box,
:is(body.inside-aside, body.inside-header) .el-form-item .img-box,
:is(body.inside-aside, body.inside-header) .el-upload--picture-card,
:is(body.inside-aside, body.inside-header) .el-upload-dragger {
    border-color: var(--zf-ui-input-border);
    border-radius: 9px;
    background-color: #fafcfb;
    transition: border-color 160ms ease, background-color 160ms ease;
}

:is(body.inside-aside, body.inside-header) .select-img-box:hover,
:is(body.inside-aside, body.inside-header) .el-form-item .img-box:hover,
:is(body.inside-aside, body.inside-header) .el-upload--picture-card:hover,
:is(body.inside-aside, body.inside-header) .el-upload-dragger:hover,
:is(body.inside-aside, body.inside-header) .el-upload-dragger.is-dragover {
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .el-form .select-img-box {
    width: 96px;
    height: 96px;
    margin: 0 12px 8px 0;
    border-style: dashed;
    display: grid;
    align-content: center;
    justify-items: center;
    background-size: contain;
}
:is(body.inside-aside, body.inside-header) .el-form .select-img-box .upload { width: auto; height: 30px; line-height: 30px; font-size: 24px; color: var(--zf-ui-primary); }
:is(body.inside-aside, body.inside-header) .el-form .select-img-box:has(.upload)::after { content: "选择图片"; font-size: 13px; line-height: 24px; color: var(--zf-ui-muted); }

:is(body.inside-aside, body.inside-header) .el-upload-dragger .el-upload__text,
:is(body.inside-aside, body.inside-header) .el-upload__tip,
:is(body.inside-aside, body.inside-header) .el-upload-list__item-name {
    color: var(--zf-ui-muted);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .el-upload-dragger .el-upload__text em {
    color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .attachment_img_box {
    border-color: var(--zf-ui-border);
    border-radius: 9px;
}

:is(body.inside-aside, body.inside-header) .attachment_img_left {
    border-right: 1px solid var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
}

:is(body.inside-aside, body.inside-header) .attachment_img_box .el-menu {
    background-color: transparent;
}

:is(body.inside-aside, body.inside-header) .attachment_img_box .el-menu-item {
    color: var(--zf-ui-muted);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .attachment_img_box .el-menu-item.is-active,
:is(body.inside-aside, body.inside-header) .attachment_img_box .el-menu-item:hover {
    color: var(--zf-ui-primary);
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .app-attachment-item {
    border: 1px solid transparent;
    border-radius: 8px;
    background-color: #fafcfb;
    transition: border-color 160ms ease, background-color 160ms ease;
}

:is(body.inside-aside, body.inside-header) .app-attachment-item:hover,
:is(body.inside-aside, body.inside-header) .app-attachment-item.on,
:is(body.inside-aside, body.inside-header) .app-attachment-item.checked,
:is(body.inside-aside, body.inside-header) .app-attachment-item.selected {
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-selected);
}

:is(body.inside-aside, body.inside-header) .app-attachment-item .delete,
:is(body.inside-aside, body.inside-header) .attachment_img_box .menu-del {
    color: var(--zf-ui-danger);
    background-color: #fff;
    border-radius: 50%;
}

:is(body.inside-aside, body.inside-header) .advice,
:is(body.inside-aside, body.inside-header) .help-block,
:is(body.inside-aside, body.inside-header) .el-form-item__content > div[style*="font-size: 10px"] {
    color: var(--zf-ui-muted) !important;
    font-size: 13px !important;
    line-height: 1.65;
}

:is(body.inside-aside, body.inside-header) .advice,
:is(body.inside-aside, body.inside-header) .help-block {
    margin-top: 7px;
}

/* Older business forms/tables share colors and control surfaces; their grid stays unchanged. */
:is(body.inside-aside, body.inside-header) .web_content .form-control,
:is(body.inside-aside, body.inside-header) .web_content .layui-input,
:is(body.inside-aside, body.inside-header) .web_content .layui-textarea {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-input-border);
    border-radius: 7px;
    background-color: #fff;
    font-size: 14px;
    box-shadow: none;
}

:is(body.inside-aside, body.inside-header) .web_content .form-control:focus,
:is(body.inside-aside, body.inside-header) .web_content .layui-input:focus,
:is(body.inside-aside, body.inside-header) .web_content .layui-textarea:focus {
    border-color: var(--zf-ui-primary) !important;
    box-shadow: 0 0 0 3px rgba(22, 130, 104, 0.1);
}

:is(body.inside-aside, body.inside-header) .web_content .control-label,
:is(body.inside-aside, body.inside-header) .web_content .layui-form-label {
    color: var(--zf-ui-muted);
    font-size: 14px;
    font-weight: 500;
}

:is(body.inside-aside, body.inside-header) .web_content .table,
:is(body.inside-aside, body.inside-header) .web_content .layui-table {
    color: var(--zf-ui-text);
    border-color: var(--zf-ui-border);
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .web_content .table > thead > tr > th,
:is(body.inside-aside, body.inside-header) .web_content .layui-table th {
    color: var(--zf-ui-muted);
    border-color: var(--zf-ui-border);
    background-color: var(--zf-ui-soft);
    font-weight: 600;
}

:is(body.inside-aside, body.inside-header) .web_content .table > tbody > tr > td,
:is(body.inside-aside, body.inside-header) .web_content .layui-table td {
    border-color: var(--zf-ui-border);
}

:is(body.inside-aside, body.inside-header) .web_content .btn,
:is(body.inside-aside, body.inside-header) .web_content .layui-btn {
    border-radius: 7px;
    font-size: 14px;
}

:is(body.inside-aside, body.inside-header) .web_content .btn-primary,
:is(body.inside-aside, body.inside-header) .web_content .btn-success,
:is(body.inside-aside, body.inside-header) .web_content .layui-btn-normal {
    color: #fff;
    border-color: var(--zf-ui-primary);
    background-color: var(--zf-ui-primary);
}

:is(body.inside-aside, body.inside-header) .web_content .btn-danger,
:is(body.inside-aside, body.inside-header) .web_content .layui-btn-danger {
    color: #fff;
    border-color: var(--zf-ui-danger);
    background-color: var(--zf-ui-danger);
}

/* Channel settings: input with a compact one-click action. */
:is(body.inside-aside, body.inside-header) .zf-subscribe-field {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    max-width: 760px;
}

:is(body.inside-aside, body.inside-header) .zf-subscribe-field .el-input {
    flex: 1;
    min-width: 0;
}

:is(body.inside-aside, body.inside-header) .zf-subscribe-field .el-button {
    flex: 0 0 auto;
    height: 32px;
    padding: 0 18px;
}

@media (max-width: 640px) {
    :is(body.inside-aside, body.inside-header) .zf-subscribe-field {
        flex-direction: column;
        align-items: stretch;
    }
}

/* User tables: avatar and identity centered in one compact cell. */
:is(body.inside-aside, body.inside-header) .zf-user-cell {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    gap: 12px;
    text-align: left;
}

:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-avatar {
    display: block;
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #f1f5f2;
}

:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-avatar .el-image__inner,
:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 100%;
    min-width: 0;
    gap: 2px;
    text-align: left;
}

:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-name,
:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-sub {
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-name {
    color: #243b36;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

:is(body.inside-aside, body.inside-header) .zf-user-cell .zf-user-sub {
    color: #7b8d82;
    font-size: 12px;
    line-height: 18px;
}

:is(body.inside-aside, body.inside-header) .el-table .zf-user-cell {
    padding: 4px 0;
}

@media (prefers-reduced-motion: reduce) {
    :is(body.inside-aside, body.inside-header) .el-button,
    :is(body.inside-aside, body.inside-header) .el-input__inner,
    :is(body.inside-aside, body.inside-header) .el-textarea__inner,
    :is(body.inside-aside, body.inside-header) .app-attachment-item,
    :is(body.inside-aside, body.inside-header) .el-upload-dragger {
        transition: none;
    }
}

/* Shared sizing: 40px controls, 32px row actions, 14px readable labels. */
:is(body.inside-aside, body.inside-header) .el-input__inner { height: 40px; line-height: 40px; font-size: 15px; }
:is(body.inside-aside, body.inside-header) .el-textarea__inner { font-size: 15px; }
:is(body.inside-aside, body.inside-header) .el-input__icon { line-height: 40px; }
:is(body.inside-aside, body.inside-header) .el-input-number { line-height: 38px; }
:is(body.inside-aside, body.inside-header) .el-input-number.is-controls-right .el-input-number__increase,
:is(body.inside-aside, body.inside-header) .el-input-number.is-controls-right .el-input-number__decrease { line-height: 19px; }
:is(body.inside-aside, body.inside-header) .el-cascader { line-height: 40px; }
:is(body.inside-aside, body.inside-header) .el-range-editor.el-input__inner { height: 40px; padding: 3px 10px; }
:is(body.inside-aside, body.inside-header) .el-range-editor .el-range__icon,
:is(body.inside-aside, body.inside-header) .el-range-editor .el-range__close-icon,
:is(body.inside-aside, body.inside-header) .el-range-editor .el-range-separator { line-height: 32px; }
:is(body.inside-aside, body.inside-header) .el-form-item__label,
:is(body.inside-aside, body.inside-header) .el-form-item__content { line-height: 40px; }
:is(body.inside-aside, body.inside-header) .el-form-item { margin-bottom: 24px; }
:is(body.inside-aside, body.inside-header) .el-button { min-height: 40px; padding: 11px 18px; line-height: 16px; }
:is(body.inside-aside, body.inside-header) .el-button.is-circle { width: 40px; padding: 11px; }
:is(body.inside-aside, body.inside-header) .el-button--text { min-height: 32px; padding: 7px 0; }
:is(body.inside-aside, body.inside-header) .el-table .el-button { min-height: 32px; padding: 7px 10px; }
:is(body.inside-aside, body.inside-header) .el-table .el-button.is-circle { width: 32px; padding: 7px; }
:is(body.inside-aside, body.inside-header) .el-button-group .el-button { border-radius: 0; }
:is(body.inside-aside, body.inside-header) .el-button-group .el-button:first-child { border-radius: 7px 0 0 7px; }
:is(body.inside-aside, body.inside-header) .el-button-group .el-button:last-child { border-radius: 0 7px 7px 0; }
:is(body.inside-aside, body.inside-header) .el-tabs__item { height: 46px; line-height: 46px; font-size: 15px; }
:is(body.inside-aside, body.inside-header) .el-radio-button__inner { padding: 11px 16px; font-size: 14px; }
:is(body.inside-aside, body.inside-header) .el-select-dropdown__item,
:is(body.inside-aside, body.inside-header) .el-dropdown-menu__item { min-height: 38px; line-height: 38px; }
:is(body.inside-aside, body.inside-header) .el-tag { height: 26px; padding: 0 9px; line-height: 24px; }
:is(body.inside-aside, body.inside-header) .el-select__tags .el-tag { height: 24px; line-height: 22px; }
:is(body.inside-aside, body.inside-header) .el-pagination button,
:is(body.inside-aside, body.inside-header) .el-pagination .el-pager li { min-width: 34px; height: 34px; line-height: 34px; }
:is(body.inside-aside, body.inside-header) .el-pagination .el-input__inner { height: 34px; line-height: 34px; }
:is(body.inside-aside, body.inside-header) .el-pagination .el-input__icon { line-height: 34px; }
:is(body.inside-aside, body.inside-header) .el-dialog__title { font-size: 18px; }
:is(body.inside-aside, body.inside-header) .el-dialog__headerbtn { width: 32px; height: 32px; top: 16px; right: 18px; border-radius: 7px; font-size: 20px; }
:is(body.inside-aside, body.inside-header) .el-dialog__headerbtn:hover { background: #f0f5f2; }
:is(body.inside-aside, body.inside-header) .el-form-item__content a:not(.el-button) { color: var(--zf-ui-primary); }
:is(body.inside-aside, body.inside-header) .el-form-item__content a:not(.el-button):hover { color: var(--zf-ui-primary-hover); text-decoration: underline; }
:is(body.inside-aside, body.inside-header) .editor-box .edui-editor { border-color: var(--zf-ui-input-border); border-radius: 8px; overflow: hidden; }
:is(body.inside-aside, body.inside-header) .editor-box .edui-editor-toolbarboxouter { border-bottom-color: var(--zf-ui-border); background: var(--zf-ui-soft); box-shadow: none; }
:is(body.inside-aside, body.inside-header) .editor-box .edui-editor-toolbarboxinner { padding: 6px; }
:is(body.inside-aside, body.inside-header) .editor-box .edui-toolbar .edui-button .edui-button-wrap { padding: 2px; }
:is(body.inside-aside, body.inside-header) .demo-form-inline { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; padding: 16px; margin-bottom: 24px; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item { display: flex; align-items: center; min-width: 0; margin: 0; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item__label { flex: 0 0 72px; width: 72px !important; padding-right: 10px; font-size: 14px; line-height: 20px; white-space: normal; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item__content { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0; margin-left: 0 !important; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item__content::before,
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item__content::after { display: none; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item__content > .el-button + .el-button { margin-left: 0; }
:is(body.inside-aside, body.inside-header) .demo-form-inline :is(.el-input, .el-select, .el-cascader) { width: 220px; min-width: 0; max-width: 100%; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-select .el-input,
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-cascader .el-input,
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-input-number .el-input { width: 100%; min-width: 0; }
:is(body.inside-aside, body.inside-header) .demo-form-inline :is(.el-date-editor--daterange, .el-date-editor--monthrange) { width: 320px; }
:is(body.inside-aside, body.inside-header) .demo-form-inline .el-date-editor--datetimerange { width: 360px; }
@media (max-width: 600px) {
    :is(body.inside-aside, body.inside-header) .el-card__body { padding: 18px; }
    :is(body.inside-aside, body.inside-header) .el-dialog__body { padding: 16px; }
    :is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item { max-width: 100%; }
    :is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item:has(.el-input, .el-select, .el-cascader, .el-date-editor) { width: 100%; }
    :is(body.inside-aside, body.inside-header) .demo-form-inline .el-form-item__content { flex: 1; }
    :is(body.inside-aside, body.inside-header) .demo-form-inline :is(.el-input, .el-select, .el-cascader, .el-date-editor) { width: 100%; min-width: 0; }
}
/* Album gallery: keep uploaded photos square and visually separate from the add tile. */
:is(body.inside-aside, body.inside-header) .el-form .album-grid { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; padding: 2px 0 4px; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .select-img-box { float: none; width: 96px; height: 96px; margin: 0; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image { overflow: hidden; border-style: solid; border-color: var(--zf-ui-input-border); border-radius: 10px; background-color: #fff; background-position: center center; background-size: cover; box-shadow: 0 3px 10px #123b330f; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image:hover { border-color: var(--zf-ui-primary); box-shadow: 0 6px 16px #123b3318; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image .delete { position: absolute; top: 6px; right: 6px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #123b33cc; color: #fff; font-size: 13px; line-height: 1; opacity: 0; visibility: hidden; transition: opacity .16s ease, visibility .16s ease, background .16s ease; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image:hover .delete,
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image .delete:hover { opacity: 1; visibility: visible; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image .delete:hover { background: #b6534b; }
:is(body.inside-aside, body.inside-header) .el-form .album-grid .album-add { border-style: dashed; }
@media (hover: none) {
    :is(body.inside-aside, body.inside-header) .el-form .album-grid .album-image .delete { opacity: 1; visibility: visible; }
}
/* Multi-image fields: each image category can show a full gallery, not just one tile. */
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px;
    line-height: 1.2;
}
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box {
    float: none;
    flex: 0 0 96px;
    margin: 0;
}
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)) {
    overflow: hidden;
    border-style: solid;
    border-color: var(--zf-ui-input-border);
    border-radius: 10px;
    background-color: #fff;
    background-position: center center;
    background-size: cover;
    box-shadow: 0 3px 10px #123b330f;
}
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)):hover {
    border-color: var(--zf-ui-primary);
    box-shadow: 0 6px 16px #123b3318;
}
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)) .delete {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #123b33cc;
    color: #fff;
    font-size: 13px;
    line-height: 1;
    opacity: 0;
    visibility: hidden;
    transition: opacity .16s ease, visibility .16s ease, background .16s ease;
}
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)):hover .delete,
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)) .delete:hover {
    opacity: 1;
    visibility: visible;
}
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)) .delete:hover { background: #b6534b; }
:is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:has(.upload) { border-style: dashed; }
@media (hover: none) {
    :is(body.inside-aside, body.inside-header) .el-form .el-form-item__content:has(> .select-img-box) > .select-img-box:not(:has(.upload)) .delete { opacity: 1; visibility: visible; }
}


