:root,
html[data-theme="light"] {
  color-scheme: light;
  --pc-primary: #2563eb;
  --pc-primary-hover: #1d4ed8;
  --pc-primary-soft: rgba(37, 99, 235, 0.1);
  --pc-primary-border: rgba(37, 99, 235, 0.28);
  --pc-page-bg: #f4f7fb;
  --pc-page-bg-soft: #edf2f8;
  --pc-shell-bg: #ffffff;
  --pc-header-bg: #ffffff;
  --pc-sidebar-bg: #f8fafc;
  --pc-control-bg: #ffffff;
  --pc-surface: #ffffff;
  --pc-surface-soft: #f8fafc;
  --pc-surface-raised: #ffffff;
  --pc-text: #182230;
  --pc-text-soft: #667085;
  --pc-text-faint: #7b8798;
  --pc-text-inverse: #ffffff;
  --pc-border: #dce3ea;
  --pc-border-strong: #c7d0dc;
  --pc-hover: rgba(37, 99, 235, 0.07);
  --pc-active: rgba(37, 99, 235, 0.12);
  --pc-overlay: rgba(15, 23, 42, 0.3);
  --pc-success: #16875a;
  --pc-success-soft: #e8f5ee;
  --pc-warning: #b86408;
  --pc-warning-soft: #fff4dd;
  --pc-danger: #d64545;
  --pc-danger-soft: #fceded;
  --pc-info: #2563eb;
  --pc-info-soft: #eaf2fb;
  --pc-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
  --pc-shadow-soft: 0 8px 22px rgba(15, 23, 42, 0.06);
}

html[data-theme="dark"],
body.pc-theme-dark,
body.darktheme {
  color-scheme: dark;
  --pc-primary: #60a5fa;
  --pc-primary-hover: #93c5fd;
  --pc-primary-soft: rgba(96, 165, 250, 0.16);
  --pc-primary-border: rgba(96, 165, 250, 0.34);
  --pc-page-bg: #0b1220;
  --pc-page-bg-soft: #101827;
  --pc-shell-bg: #101827;
  --pc-header-bg: #101827;
  --pc-sidebar-bg: #0f1726;
  --pc-control-bg: #131d2e;
  --pc-surface: #131d2e;
  --pc-surface-soft: #172235;
  --pc-surface-raised: #1b2738;
  --pc-text: #eaf1fa;
  --pc-text-soft: #aab8ca;
  --pc-text-faint: #91a0b5;
  --pc-text-inverse: #08111e;
  --pc-border: #2a3a50;
  --pc-border-strong: #3a4d67;
  --pc-hover: rgba(96, 165, 250, 0.1);
  --pc-active: rgba(96, 165, 250, 0.16);
  --pc-overlay: rgba(2, 6, 23, 0.64);
  --pc-success: #4ade80;
  --pc-success-soft: rgba(74, 222, 128, 0.14);
  --pc-warning: #fbbf24;
  --pc-warning-soft: rgba(251, 191, 36, 0.14);
  --pc-danger: #f87171;
  --pc-danger-soft: rgba(248, 113, 113, 0.14);
  --pc-info: #60a5fa;
  --pc-info-soft: rgba(96, 165, 250, 0.14);
  --pc-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
  --pc-shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.2);
}

html,
body {
  background: var(--pc-page-bg);
  color: var(--pc-text);
}

body#tabs {
  --admin-shell-bg: var(--pc-shell-bg);
  --admin-sidebar-bg: var(--pc-sidebar-bg);
  --admin-sidebar-bg-soft: var(--pc-surface-soft);
  --admin-sidebar-border: var(--pc-border);
  --admin-sidebar-text: var(--pc-text-soft);
  --admin-sidebar-text-strong: var(--pc-text);
  --admin-sidebar-subtext: var(--pc-text-faint);
  --admin-header-surface: var(--pc-header-bg);
  --admin-header-border: var(--pc-border);
  --admin-header-text: var(--pc-text-soft);
  --admin-header-text-strong: var(--pc-text);
  --admin-header-bg: var(--pc-header-bg);
  --admin-accent: var(--pc-primary);
  --admin-accent-soft: var(--pc-primary-soft);
  --admin-accent-glow: var(--pc-primary-border);
  --admin-content-bg: var(--pc-page-bg);
  --admin-page-bg: var(--pc-page-bg);
  --admin-page-surface: var(--pc-surface);
  --admin-page-surface-soft: var(--pc-surface-soft);
  --admin-page-border: var(--pc-border);
  --admin-page-border-strong: var(--pc-border-strong);
  --admin-page-text: var(--pc-text);
  --admin-page-text-soft: var(--pc-text-soft);
  --admin-page-text-faint: var(--pc-text-faint);
  --admin-page-accent: var(--pc-primary);
  --admin-page-accent-soft: var(--pc-primary-soft);
  --admin-page-shadow: var(--pc-shadow);
  --admin-page-shadow-soft: var(--pc-shadow-soft);
  background: var(--pc-page-bg) !important;
  color: var(--pc-text);
}

body.inside-header {
  --admin-page-bg: var(--pc-page-bg);
  --admin-page-surface: var(--pc-surface);
  --admin-page-surface-soft: var(--pc-surface-soft);
  --admin-page-border: var(--pc-border);
  --admin-page-border-strong: var(--pc-border-strong);
  --admin-page-text: var(--pc-text);
  --admin-page-text-soft: var(--pc-text-soft);
  --admin-page-text-faint: var(--pc-text-faint);
  --admin-page-accent: var(--pc-primary);
  --admin-page-accent-soft: var(--pc-primary-soft);
  --admin-page-shadow: var(--pc-shadow);
  --admin-page-shadow-soft: var(--pc-shadow-soft);
  background: var(--pc-page-bg) !important;
  color: var(--pc-text);
}

body#tabs .wrapper,
body#tabs .main-header,
body#tabs .main-header .logo,
body#tabs .main-header .navbar,
body#tabs .main-sidebar,
body#tabs .left-side {
  background: var(--pc-shell-bg) !important;
}

body#tabs .main-header {
  border-bottom: 1px solid var(--pc-border);
}

body#tabs .main-header .logo {
  color: var(--pc-text) !important;
  border-right: 1px solid var(--pc-border) !important;
  text-shadow: none;
}

body#tabs .main-header .logo img {
  background: var(--pc-surface-soft) !important;
  border: 1px solid var(--pc-border);
}

body#tabs .main-header .navbar {
  background: var(--pc-header-bg) !important;
  border-bottom: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body#tabs #secondnav {
  background: var(--pc-header-bg) !important;
  border-bottom-color: var(--pc-border);
}

body#tabs .content-wrapper,
body#tabs .tab-addtabs,
body#tabs .tab-addtabs .tab-pane,
body#tabs .tab-addtabs .tab-pane iframe {
  background: var(--pc-page-bg) !important;
}

body#tabs .main-header .navbar .nav > li > a,
body#tabs .nav-addtabs > li > a,
body#tabs #secondnav .nav-addtabs > li > a {
  color: var(--pc-text-soft) !important;
}

body#tabs .main-header .navbar .nav > li > a:hover,
body#tabs .main-header .navbar .nav > li > a:focus,
body#tabs .main-header .navbar .nav .open > a,
body#tabs .nav-addtabs > li > a:hover,
body#tabs .nav-addtabs > li > a:focus {
  background: var(--pc-hover) !important;
  color: var(--pc-text) !important;
}

body#tabs .nav-addtabs > li.active > a,
body#tabs .nav-addtabs > li.active > a:hover,
body#tabs .nav-addtabs > li.active > a:focus,
body#tabs #secondnav .nav-addtabs > li.active > a,
body#tabs #secondnav .nav-addtabs > li.active,
body#tabs #secondnav .nav-addtabs > li:hover {
  background: var(--pc-active) !important;
  border-color: var(--pc-primary-border) !important;
  color: var(--pc-text) !important;
  box-shadow: none !important;
}

body#tabs .main-sidebar,
body#tabs .left-side {
  background: var(--pc-sidebar-bg) !important;
  border-right: 1px solid var(--pc-border);
}

body#tabs .sidebar-menu > li > a,
body#tabs .sidebar-menu .treeview-menu > li > a,
body#tabs .sidebar a {
  color: var(--pc-text-soft) !important;
}

body#tabs .sidebar-menu > li:hover > a,
body#tabs .sidebar-menu > li.active > a,
body#tabs .sidebar-menu li.treeview.active > a,
body#tabs .sidebar-menu .treeview-menu > li > a:hover,
body#tabs .sidebar-menu .treeview-menu > li.active > a {
  background: var(--pc-active) !important;
  color: var(--pc-text) !important;
  box-shadow: inset 3px 0 0 var(--pc-primary) !important;
}

body#tabs .sidebar-menu > li > a > .fa,
body#tabs .sidebar-menu > li > a > .glyphicon,
body#tabs .sidebar-menu > li > a > .ion,
body#tabs .sidebar-menu li > a > .pull-right-container > .fa-angle-left,
body#tabs .sidebar-menu li > a > .fa-angle-left {
  color: var(--pc-text-faint) !important;
}

body#tabs .sidebar-menu > li:hover > a > .fa,
body#tabs .sidebar-menu > li.active > a > .fa,
body#tabs .sidebar-menu > li:hover > a > .glyphicon,
body#tabs .sidebar-menu > li.active > a > .glyphicon,
body#tabs .sidebar-menu > li:hover > a > .ion,
body#tabs .sidebar-menu > li.active > a > .ion {
  color: var(--pc-primary) !important;
}

body#tabs .sidebar-menu li.treeview > a,
body#tabs .sidebar-menu li.treeview.active > a,
body#tabs .sidebar-menu li.treeview.treeview-open > a,
body#tabs .sidebar-menu .treeview-menu,
body#tabs.sidebar-collapse .sidebar-menu > li:hover > a,
body#tabs.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
  background-color: var(--pc-sidebar-bg) !important;
}

body#tabs .sidebar-menu .treeview-menu:before {
  background: var(--pc-border-strong);
}

body#tabs .sidebar-menu .treeview-menu > li > a:before {
  background: var(--pc-text-faint);
  box-shadow: none;
}

body#tabs .sidebar-menu .treeview-menu > li.active > a:before,
body#tabs .sidebar-menu .treeview-menu > li > a:hover:before {
  background: var(--pc-primary);
  box-shadow: 0 0 0 4px var(--pc-primary-soft);
}

body#tabs .main-header .navbar .dropdown-menu,
body#tabs .navbar-nav > .user-menu > .dropdown-menu,
body#tabs .navbar-nav > .user-menu > .dropdown-menu > li.user-header,
body#tabs .navbar-nav > .user-menu > .dropdown-menu > li.user-body,
body#tabs .navbar-nav > .user-menu > .dropdown-menu > li.user-footer {
  background: var(--pc-surface-raised) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body#tabs .navbar-nav > .user-menu > .dropdown-menu > li.user-header p,
body#tabs .navbar-nav > .user-menu > .dropdown-menu > li.user-header small,
body#tabs .navbar-nav > .user-menu > .dropdown-menu a {
  color: var(--pc-text) !important;
}

body#tabs .main-header .navbar .dropdown-menu > li > a:hover,
body#tabs .main-header .navbar .dropdown-menu > li > a:focus,
body#tabs .navbar-nav > .user-menu > .dropdown-menu a:hover,
body#tabs .navbar-nav > .user-menu > .dropdown-menu a:focus {
  background: var(--pc-hover) !important;
  color: var(--pc-primary) !important;
}

body#tabs .navbar-nav > .user-menu .user-image,
body#tabs .navbar-nav > .user-menu > .dropdown-menu > li.user-header > img {
  border-color: var(--pc-border-strong) !important;
}

body#tabs .saas-shell-user-meta__name,
body#tabs .saas-shell-user-meta__role {
  color: var(--pc-text) !important;
}

body#tabs .main-footer {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text-soft) !important;
}

.pc-theme-nav-item {
  display: flex !important;
  align-items: center;
  min-height: 64px;
}

.pc-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin: 0 3px;
  padding: 0;
  border: 1px solid var(--pc-border);
  border-radius: 8px;
  background: var(--pc-surface-soft);
  color: var(--pc-text-soft);
  cursor: pointer;
}

.pc-theme-toggle:hover,
.pc-theme-toggle:focus {
  border-color: var(--pc-primary-border);
  background: var(--pc-primary-soft);
  color: var(--pc-primary);
  outline: none;
}

.pc-theme-toggle .pc-theme-icon-sun,
.pc-theme-toggle[data-theme-current="dark"] .pc-theme-icon-moon {
  display: none;
}

.pc-theme-toggle[data-theme-current="dark"] .pc-theme-icon-sun {
  display: inline-block;
}

.pc-control-sidebar,
.control-sidebar.pc-control-sidebar,
.control-sidebar.pc-control-sidebar + .control-sidebar-bg {
  background: var(--pc-control-bg) !important;
  color: var(--pc-text) !important;
}

.pc-control-sidebar {
  border-left: 1px solid var(--pc-border);
  box-shadow: -12px 0 30px rgba(15, 23, 42, 0.12);
}

.pc-control-sidebar__close {
  float: right;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: -4px -4px 0 8px;
  padding: 0;
  border: 1px solid var(--pc-border);
  border-radius: 6px;
  background: var(--pc-surface-soft);
  color: var(--pc-text-soft);
}

.pc-control-sidebar__close:hover,
.pc-control-sidebar__close:focus {
  border-color: var(--pc-primary-border);
  background: var(--pc-primary-soft);
  color: var(--pc-primary);
  outline: none;
}

.pc-control-sidebar .tab-content {
  padding: 0 18px 24px;
}

.pc-control-sidebar__header {
  margin: 0 -18px 20px;
  padding: 20px 18px 16px;
  border-bottom: 1px solid var(--pc-border);
}

.pc-control-sidebar__header h4 {
  margin: 0 0 6px;
  color: var(--pc-text);
  font-size: 17px;
  font-weight: 700;
}

.pc-control-sidebar__header p,
.pc-control-sidebar .form-group p {
  margin: 0;
  color: var(--pc-text-faint) !important;
  font-size: 12px;
  line-height: 1.65;
}

.pc-control-sidebar__section {
  padding: 18px 0;
  border-bottom: 1px solid var(--pc-border);
}

.pc-control-sidebar__section:last-child {
  border-bottom: 0;
}

.pc-control-sidebar__title,
.pc-control-sidebar .control-sidebar-subheading {
  color: var(--pc-text) !important;
  font-size: 13px;
  font-weight: 700;
}

.pc-theme-segmented {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 12px;
  padding: 5px;
  border: 1px solid var(--pc-border);
  border-radius: 8px;
  background: var(--pc-surface-soft);
}

.pc-theme-choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--pc-text-soft);
  font-size: 13px;
  font-weight: 600;
}

.pc-theme-choice.is-active {
  background: var(--pc-surface-raised);
  color: var(--pc-primary);
  box-shadow: var(--pc-shadow-soft);
}

.pc-control-sidebar .form-group {
  margin: 0;
  padding: 13px 0;
  border-bottom: 1px solid var(--pc-border);
}

.pc-control-sidebar .form-group:last-child {
  border-bottom: 0;
}

.pc-control-sidebar input[type="checkbox"] {
  accent-color: var(--pc-primary);
}

body.inside-header .panel-intro > .panel-heading,
body.inside-header .panel-nav .panel-heading,
body.inside-header .admin-subnav > .panel-heading,
body.inside-header .config-page-nav {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header .panel-intro > .panel-body,
body.inside-header .panel-nav > .panel-body,
body.inside-header .panel,
body.inside-header .panel-default,
body.inside-header .panel-footer,
body.inside-header .box,
body.inside-header .well,
body.inside-header .card,
body.inside-header .sm-st,
body.inside-header .sameheight-item,
body.inside-header .fixed-table-container,
body.inside-header .fixed-table-loading,
body.inside-header .modal-content,
body.inside-header .nav-tabs-custom,
body.inside-header .list-group-item,
body#tabs .saas-console-direct .config-card,
body#tabs .saas-console-direct .saas-console-list__item {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header .panel-heading,
body.inside-header .box-header,
body.inside-header .box-footer,
body.inside-header .modal-header,
body.inside-header .modal-footer,
body.inside-header .fixed-table-pagination,
body.inside-header .bootstrap-table .fixed-table-toolbar {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header .table > thead > tr > th,
body.inside-header .fixed-table-container thead th,
body.inside-header .el-table th.el-table__cell {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text-soft) !important;
}

body.inside-header .table > tbody > tr > td,
body.inside-header .table > tbody > tr > th,
body.inside-header .fixed-table-container tbody td,
body.inside-header .el-table td.el-table__cell {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header .table-striped > tbody > tr:nth-of-type(odd) > td,
body.inside-header .table-striped > tbody > tr:nth-of-type(odd) > th,
body.inside-header .fixed-columns,
body.inside-header .fixed-columns-right {
  background: var(--pc-surface-soft) !important;
}

body.inside-header .table-hover > tbody > tr:hover > td,
body.inside-header .fixed-table-container tbody tr:hover > td {
  background: var(--pc-hover) !important;
}

body.inside-header .form-control,
body.inside-header .selectpage,
body.inside-header .city-picker-span,
body.inside-header .input-group-addon,
body.inside-header .bootstrap-select > .dropdown-toggle,
body.inside-header .select2-container .select2-selection,
body.inside-header .el-input__wrapper,
body.inside-header .el-textarea__inner,
body.inside-header .el-select__wrapper {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border-strong) !important;
  color: var(--pc-text) !important;
}

body.inside-header .form-control:focus,
body.inside-header .selectpage:focus,
body.inside-header .bootstrap-select > .dropdown-toggle:focus,
body.inside-header .select2-container--focus .select2-selection,
body.inside-header .el-input__wrapper.is-focus,
body.inside-header .el-select__wrapper.is-focused {
  border-color: var(--pc-primary) !important;
  box-shadow: 0 0 0 3px var(--pc-primary-soft) !important;
}

body.inside-header input[type="checkbox"],
body.inside-header input[type="radio"] {
  accent-color: var(--pc-primary);
}

body.inside-header .form-control::placeholder,
body.inside-header textarea::placeholder,
body.inside-header input::placeholder {
  color: var(--pc-text-faint) !important;
}

body.inside-header .control-label,
body.inside-header label,
body.inside-header legend,
body.inside-header .box-title,
body.inside-header .panel-title {
  color: var(--pc-text) !important;
}

body.inside-header .modal-title,
body.inside-header .dropdown-menu > li > a,
body.inside-header .select2-results__option,
body.inside-header .bootstrap-select .dropdown-menu > li > a,
body.inside-header .el-dialog__title,
body.inside-header .el-form-item__label,
body.inside-header .el-descriptions__label,
body.inside-header .el-descriptions__content {
  color: var(--pc-text) !important;
}

body.inside-header .help-block,
body.inside-header .text-muted,
body.inside-header .form-group .tip,
body.inside-header .form-group .tips {
  color: var(--pc-text-faint) !important;
}

body.inside-header .btn-default,
body.inside-header .pagination > li > a,
body.inside-header .pagination > li > span {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text-soft) !important;
}

body.inside-header .btn-default:hover,
body.inside-header .btn-default:focus,
body.inside-header .pagination > li > a:hover {
  background: var(--pc-hover) !important;
  border-color: var(--pc-primary-border) !important;
  color: var(--pc-primary) !important;
}

body.inside-header .btn-primary,
body.inside-header .pagination > .active > a,
body.inside-header .pagination > .active > span,
body#tabs .saas-console-direct .config-tabs > li.active > a {
  background: var(--pc-primary) !important;
  border-color: var(--pc-primary) !important;
  color: #ffffff !important;
}

body.inside-header .dropdown-menu,
body.inside-header .popover,
body.inside-header .daterangepicker,
body.inside-header .datetimepicker,
body.inside-header .bootstrap-datetimepicker-widget,
body.inside-header .select2-dropdown,
body.inside-header .el-popper,
body.inside-header .el-dialog {
  background: var(--pc-surface-raised) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header .dropdown-menu > li > a:hover,
body.inside-header .dropdown-menu > li > a:focus,
body.inside-header .select2-results__option--highlighted,
body.inside-header .bootstrap-select .dropdown-menu > li > a:hover,
body.inside-header .el-select-dropdown__item.hover,
body.inside-header .el-select-dropdown__item:hover,
body.inside-header .el-dropdown-menu__item:hover,
body.inside-header .el-dropdown-menu__item:focus {
  background: var(--pc-hover) !important;
  color: var(--pc-primary) !important;
}

body.inside-header .el-card,
body.inside-header .el-table,
body.inside-header .el-table tr,
body.inside-header .el-dialog__body,
body.inside-header .el-dialog__footer,
body.inside-header .el-drawer,
body.inside-header .el-drawer__body,
body.inside-header .el-collapse-item__wrap,
body.inside-header .el-collapse-item__header,
body.inside-header .el-descriptions__body,
body.inside-header .el-descriptions__table {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header #app,
body.inside-header #template,
body.pc-standalone-page {
  background: var(--pc-page-bg) !important;
  color: var(--pc-text) !important;
}

body.pc-standalone-page .dc-hero,
body.pc-standalone-page .dc-card,
body.pc-standalone-page .dc-panel,
body.pc-standalone-page .dc-mini,
body.pc-standalone-page .dc-asset,
body.pc-standalone-page .dc-stat-row,
body.pc-standalone-page .dc-tag,
body.pc-standalone-page .dc-tabs,
body.pc-standalone-page .dc-meta span {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
  box-shadow: var(--pc-shadow-soft) !important;
}

body.pc-standalone-page .dc-title,
body.pc-standalone-page .dc-card-value strong,
body.pc-standalone-page .dc-panel-title,
body.pc-standalone-page .dc-stat-value,
body.pc-standalone-page .dc-mini-value,
body.pc-standalone-page .dc-asset-value strong {
  color: var(--pc-text) !important;
}

body.pc-standalone-page .dc-desc,
body.pc-standalone-page .dc-card-label,
body.pc-standalone-page .dc-card-tip,
body.pc-standalone-page .dc-panel-desc,
body.pc-standalone-page .dc-stat-name,
body.pc-standalone-page .dc-mini-label,
body.pc-standalone-page .dc-asset-label,
body.pc-standalone-page .dc-table td {
  color: var(--pc-text-soft) !important;
}

body.pc-standalone-page .dc-empty,
body.pc-standalone-page .dc-loading-mask {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text-faint) !important;
}

body.pc-poster-editor .config,
body.pc-poster-editor .content .lists,
body.pc-poster-editor .el-dialog,
body.pc-poster-editor .el-message-box {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.pc-poster-editor .config .title,
body.pc-poster-editor .config .name,
body.pc-poster-editor .el-form-item__label,
body.pc-poster-editor .el-dialog__title,
body.pc-poster-editor .el-message-box__title,
body.pc-poster-editor .el-message-box__content {
  color: var(--pc-text) !important;
}

body.pc-poster-editor .el-input__inner,
body.pc-poster-editor .el-textarea__inner,
body.pc-poster-editor .el-color-picker__trigger,
body.pc-poster-editor .el-select-dropdown,
body.pc-poster-editor .el-dialog__body,
body.pc-poster-editor .el-message-box__btns {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border-strong) !important;
  color: var(--pc-text) !important;
}

body.pc-layui-page .layui-card,
body.pc-layui-page .layui-card-header,
body.pc-layui-page .layui-card-body,
body.pc-layui-page .step-item,
body.pc-layui-page .step-desc .white {
  background: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.pc-layui-page .layui-input,
body.pc-layui-page .layui-select,
body.pc-layui-page .layui-textarea {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border-strong) !important;
  color: var(--pc-text) !important;
}

body.inside-header .el-card__header,
body.inside-header .el-dialog__header,
body.inside-header .el-drawer__header,
body.inside-header .el-table__header-wrapper,
body.inside-header .el-descriptions__label {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

body.inside-header .el-select-dropdown__item,
body.inside-header .el-dropdown-menu__item,
body.inside-header .el-pagination,
body.inside-header .el-pagination button,
body.inside-header .el-pager li {
  background: transparent !important;
  color: var(--pc-text-soft) !important;
}

body.inside-header .el-pager li.active,
body.inside-header .el-select-dropdown__item.selected,
body.inside-header .el-dropdown-menu__item:not(.is-disabled):hover {
  color: var(--pc-primary) !important;
}

body.inside-header .alert-info-light,
body.inside-header .alert-info {
  background: var(--pc-info-soft) !important;
  border-color: var(--pc-primary-border) !important;
  color: var(--pc-info) !important;
}

body.inside-header .alert-success {
  background: var(--pc-success-soft) !important;
  border-color: var(--pc-success) !important;
  color: var(--pc-success) !important;
}

body.inside-header .alert-warning,
body.inside-header .alert-warning-light {
  background: var(--pc-warning-soft) !important;
  border-color: var(--pc-warning) !important;
  color: var(--pc-warning) !important;
}

body.inside-header .alert-danger,
body.inside-header .alert-danger-light {
  background: var(--pc-danger-soft) !important;
  border-color: var(--pc-danger) !important;
  color: var(--pc-danger) !important;
}

.layui-layer,
.layui-layer .layui-layer-title,
.layui-layer .layui-layer-content,
.layui-layer .layui-layer-btn,
.layui-layer .layui-layer-footer {
  background: var(--pc-surface-raised) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text) !important;
}

.layui-layer-shade {
  background: var(--pc-overlay) !important;
}

.layui-layer .layui-layer-setwin > a,
.layui-layer .layui-layer-btn a {
  color: var(--pc-text-soft) !important;
}

.layui-layer .layui-layer-btn .layui-layer-btn1 {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text-soft) !important;
}

.layui-layer-iframe iframe {
  background: var(--pc-page-bg) !important;
}

#toast-container > div,
.toast,
.popover,
.tooltip-inner {
  border-color: var(--pc-border) !important;
  background: var(--pc-surface-raised) !important;
  color: var(--pc-text) !important;
}

/* The phone canvas must continue to represent the H5/mini-program design itself. */
body.inside-header .mobilediy .phone,
body.inside-header .mobilediy .phone *,
body.inside-header .diy-phone,
body.inside-header .diy-phone * {
  color-scheme: light;
}

.layui-layer .layui-layer-btn .layui-layer-btn0 {
  background: var(--pc-primary) !important;
  border-color: var(--pc-primary) !important;
  color: #ffffff !important;
}

body#tabs .saas-console-direct .config-tabs > li > a {
  background: var(--pc-surface-soft) !important;
  border-color: var(--pc-border) !important;
  color: var(--pc-text-soft) !important;
}

body#tabs .saas-console-direct .config-card__title,
body#tabs .saas-console-direct .saas-console-value,
body#tabs .saas-console-direct .saas-console-list__item strong {
  color: var(--pc-text) !important;
}

body#tabs .saas-console-direct .config-card__desc,
body#tabs .saas-console-direct .config-card__meta,
body#tabs .saas-console-direct .saas-console-list__item span,
body#tabs .saas-console-direct .saas-console-list__item em {
  color: var(--pc-text-soft) !important;
}

html[data-theme="light"] body#tabs .saas-console-direct .config-card__tag {
  color: var(--pc-text-soft);
}

@media (prefers-reduced-motion: no-preference) {
  body,
  body#tabs .main-header,
  body#tabs .main-sidebar,
  body#tabs .content-wrapper,
  .pc-control-sidebar,
  .panel,
  .box,
  .form-control,
  .table > tbody > tr > td {
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
  }
}

@media (max-width: 767px) {
  .pc-theme-nav-item {
    min-height: 50px;
  }

  .pc-theme-toggle {
    width: 34px;
    height: 34px;
  }
}