/*
 * GrowSiteX Element UI theme refresh
 * Version: v20260926-183153-element-theme-refresh
 * Reference: Element UI theme preview / theme-chalk visual language.
 * Scope: enterprise console and total administration console; presentation only.
 */

:root {
  --el-color-primary: #409eff;
  --el-color-primary-light-3: #79bbff;
  --el-color-primary-light-5: #a0cfff;
  --el-color-primary-light-7: #c6e2ff;
  --el-color-primary-light-8: #d9ecff;
  --el-color-primary-light-9: #ecf5ff;
  --el-color-primary-dark-2: #337ecc;
  --el-color-success: #67c23a;
  --el-color-warning: #e6a23c;
  --el-color-danger: #f56c6c;
  --el-color-info: #909399;
  --el-text-color-primary: #303133;
  --el-text-color-regular: #606266;
  --el-text-color-secondary: #909399;
  --el-text-color-placeholder: #a8abb2;
  --el-text-color-disabled: #c0c4cc;
  --el-border-color: #dcdfe6;
  --el-border-color-light: #e4e7ed;
  --el-border-color-lighter: #ebeef5;
  --el-border-color-extra-light: #f2f6fc;
  --el-fill-color: #f0f2f5;
  --el-fill-color-light: #f5f7fa;
  --el-fill-color-lighter: #fafafa;
  --el-bg-color: #ffffff;
  --el-bg-color-page: #f5f7fa;
  --el-border-radius-base: 4px;
  --el-border-radius-small: 2px;
  --el-box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.08);
  --el-box-shadow-lighter: 0 1px 6px 0 rgba(0, 0, 0, 0.06);
  --el-transition-duration: 0.2s;

  /* Existing GrowSiteX aliases, kept for unchanged feature styles. */
  --bg: var(--el-bg-color-page);
  --panel: var(--el-bg-color);
  --panel-soft: var(--el-fill-color-light);
  --text: var(--el-text-color-primary);
  --muted: var(--el-text-color-secondary);
  --line: var(--el-border-color-lighter);
  --primary: var(--el-color-primary);
  --primary-weak: var(--el-color-primary-light-9);
  --teal: #00a6a6;
  --green: var(--el-color-success);
  --amber: var(--el-color-warning);
  --red: var(--el-color-danger);
  --sidebar: #1f2d3d;
  --shadow: var(--el-box-shadow-lighter);
}

* {
  scrollbar-color: #c0c4cc transparent;
  scrollbar-width: thin;
}

*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 8px;
  background: #c0c4cc;
  background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
  background: #a8abb2;
  background-clip: padding-box;
}

::selection {
  background: var(--el-color-primary-light-7);
  color: var(--el-text-color-primary);
}

body {
  background: var(--el-bg-color-page);
  color: var(--el-text-color-primary);
  font-family: Inter, "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid rgba(64, 158, 255, 0.34);
  outline-offset: 2px;
}

/* Enterprise console shell */
.element-ui-enabled .app-shell {
  background: var(--el-bg-color-page);
  color: var(--el-text-color-primary);
}

.element-ui-enabled .sidebar {
  background: #1f2d3d;
  border-right: 1px solid #172431;
  color: #dfe8f1;
}

.element-ui-enabled .brand {
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.element-ui-enabled .brand-copy strong,
.element-ui-enabled .brand-copy span {
  color: #ffffff;
}

.element-ui-enabled .brand-copy span {
  opacity: 0.72;
}

.element-ui-enabled .sidebar .nav > button,
.element-ui-enabled .sidebar .nav .nav-parent,
.element-ui-enabled .sidebar .subnav button {
  border-radius: var(--el-border-radius-base);
  color: #cfd8e3;
  font-weight: 500;
  transition: color var(--el-transition-duration), background-color var(--el-transition-duration);
}

.element-ui-enabled .sidebar .nav > button:hover,
.element-ui-enabled .sidebar .nav .nav-parent:hover,
.element-ui-enabled .sidebar .subnav button:hover {
  background: #26384a;
  color: #ffffff;
}

.element-ui-enabled .sidebar .nav > button.active,
.element-ui-enabled .sidebar .nav .nav-parent.active,
.element-ui-enabled .sidebar .subnav button.active {
  background: var(--el-color-primary);
  color: #ffffff;
  box-shadow: none;
}

.element-ui-enabled .collapse-menu {
  border-color: rgba(255, 255, 255, 0.18);
  border-radius: var(--el-border-radius-base);
  background: rgba(255, 255, 255, 0.06);
  color: #dfe8f1;
}

.element-ui-enabled .collapse-menu:hover {
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

.element-ui-enabled .main {
  min-width: 0;
  background: var(--el-bg-color-page);
}

.element-ui-enabled .topbar {
  min-height: 68px;
  padding: 12px 28px;
  border-bottom: 1px solid var(--el-border-color-lighter);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 1px 0 rgba(31, 45, 61, 0.02);
}

.element-ui-enabled .topbar h2 {
  color: var(--el-text-color-primary);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0;
}

.element-ui-enabled .topbar p {
  color: var(--el-text-color-secondary);
}

.element-ui-enabled .enterprise-switcher,
.element-ui-enabled .profile-trigger,
.element-ui-enabled .admin-console-link {
  min-height: 40px;
  border: 1px solid var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
  box-shadow: none;
}

.element-ui-enabled .enterprise-switcher:hover,
.element-ui-enabled .profile-trigger:hover,
.element-ui-enabled .admin-console-link:hover {
  border-color: var(--el-color-primary-light-5);
  background: var(--el-color-primary-light-9);
  color: var(--el-color-primary);
}

.element-ui-enabled .enterprise-switcher select {
  color: var(--el-text-color-primary);
}

.element-ui-enabled .enterprise-create-btn {
  background: var(--el-color-primary);
  box-shadow: none;
}

.element-ui-enabled .profile-trigger > .avatar,
.element-ui-enabled .profile-trigger > span:first-child {
  background: #00a6a6;
  color: #ffffff;
}

.element-ui-enabled .profile-dropdown {
  border: 1px solid var(--el-border-color-light);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  box-shadow: var(--el-box-shadow-light);
}

.element-ui-enabled .profile-menu-item:hover {
  background: var(--el-color-primary-light-9);
  color: var(--el-color-primary);
}

.element-ui-enabled .content {
  padding: 22px 28px 32px;
}

/* Cards and dashboard surfaces */
.element-ui-enabled .panel,
.element-ui-enabled .home-panel,
.element-ui-enabled .home-metric-card,
.element-ui-enabled .home-summary-card,
.element-ui-enabled .home-effect-card,
.element-ui-enabled .seo-table-panel,
.element-ui-enabled .seo-filter-panel,
.element-ui-enabled .growth-next,
.element-ui-enabled .growth-logic,
.element-ui-enabled .home-package-panel,
.element-ui-enabled .home-token-panel,
.element-ui-enabled .mp-panel,
.element-ui-enabled .mp-package-card {
  border: 1px solid var(--el-border-color-lighter);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  box-shadow: var(--el-box-shadow-lighter);
}

.element-ui-enabled .home-metric-card:hover,
.element-ui-enabled .home-summary-card:hover,
.element-ui-enabled .mp-package-card:hover {
  border-color: var(--el-color-primary-light-7);
  box-shadow: var(--el-box-shadow-light);
}

.element-ui-enabled .panel-head,
.element-ui-enabled .home-panel-head,
.element-ui-enabled .seo-table-panel .panel-head {
  min-height: 54px;
  border-bottom: 1px solid var(--el-border-color-lighter);
}

.element-ui-enabled .panel-head h2,
.element-ui-enabled .panel-head h3,
.element-ui-enabled .home-panel-head h3 {
  color: var(--el-text-color-primary);
  font-weight: 600;
}

.element-ui-enabled .home-metric-note,
.element-ui-enabled .home-panel-head p,
.element-ui-enabled .panel-head p,
.element-ui-enabled .muted {
  color: var(--el-text-color-secondary);
}

/* Buttons */
.element-ui-enabled .btn,
.element-ui-enabled .confirm-btn,
.element-ui-enabled .seo-action-btn,
.element-ui-enabled .home-action,
.element-ui-enabled .home-more-btn,
.element-ui-enabled .pager-btn,
.element-ui-enabled .mp-btn {
  min-height: 32px;
  border: 1px solid var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
  box-shadow: none;
  font-weight: 500;
  transform: none;
  transition:
    color var(--el-transition-duration),
    border-color var(--el-transition-duration),
    background-color var(--el-transition-duration),
    box-shadow var(--el-transition-duration);
}

.element-ui-enabled .btn:hover,
.element-ui-enabled .confirm-btn:hover,
.element-ui-enabled .seo-action-btn:hover,
.element-ui-enabled .home-action:hover,
.element-ui-enabled .home-more-btn:hover,
.element-ui-enabled .pager-btn:hover,
.element-ui-enabled .mp-btn:hover {
  border-color: var(--el-color-primary-light-5);
  background: var(--el-color-primary-light-9);
  color: var(--el-color-primary);
  box-shadow: none;
  transform: none;
}

.element-ui-enabled .btn.primary,
.element-ui-enabled .confirm-btn.primary,
.element-ui-enabled .seo-action-btn.enable,
.element-ui-enabled .auth-submit,
.element-ui-enabled .mp-btn.primary {
  border-color: var(--el-color-primary);
  background: var(--el-color-primary);
  color: #ffffff;
}

.element-ui-enabled .btn.primary:hover,
.element-ui-enabled .confirm-btn.primary:hover,
.element-ui-enabled .seo-action-btn.enable:hover,
.element-ui-enabled .auth-submit:hover,
.element-ui-enabled .mp-btn.primary:hover {
  border-color: var(--el-color-primary-light-3);
  background: var(--el-color-primary-light-3);
  color: #ffffff;
}

.element-ui-enabled .btn.danger,
.element-ui-enabled .confirm-btn.danger,
.element-ui-enabled .seo-action-btn.delete,
.element-ui-enabled .publish-link-btn.danger,
.element-ui-enabled .publish-account-link.danger,
.element-ui-enabled .materials-action.delete {
  border-color: #fab6b6;
  background: #fef0f0;
  color: var(--el-color-danger);
}

.element-ui-enabled .btn.danger:hover,
.element-ui-enabled .confirm-btn.danger:hover,
.element-ui-enabled .seo-action-btn.delete:hover,
.element-ui-enabled .publish-link-btn.danger:hover,
.element-ui-enabled .publish-account-link.danger:hover,
.element-ui-enabled .materials-action.delete:hover {
  border-color: var(--el-color-danger);
  background: var(--el-color-danger);
  color: #ffffff;
}

.element-ui-enabled button:disabled,
.element-ui-enabled .btn:disabled,
.element-ui-enabled .confirm-btn:disabled,
.element-ui-enabled .seo-action-btn:disabled,
.element-ui-enabled .mp-btn:disabled {
  border-color: var(--el-border-color-light);
  background: var(--el-fill-color-light);
  color: var(--el-text-color-disabled);
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

/* Forms */
.element-ui-enabled .input,
.element-ui-enabled .select,
.element-ui-enabled .textarea,
.element-ui-enabled input:not([type="checkbox"]):not([type="radio"]),
.element-ui-enabled select,
.element-ui-enabled textarea,
.element-ui-enabled .auth-input {
  border-color: var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
  box-shadow: none;
}

.element-ui-enabled .input:hover,
.element-ui-enabled .select:hover,
.element-ui-enabled .textarea:hover,
.element-ui-enabled input:not([type="checkbox"]):not([type="radio"]):hover,
.element-ui-enabled select:hover,
.element-ui-enabled textarea:hover,
.element-ui-enabled .auth-input:hover {
  border-color: #c0c4cc;
}

.element-ui-enabled .input:focus,
.element-ui-enabled .select:focus,
.element-ui-enabled .textarea:focus,
.element-ui-enabled input:not([type="checkbox"]):not([type="radio"]):focus,
.element-ui-enabled select:focus,
.element-ui-enabled textarea:focus,
.element-ui-enabled .auth-input:focus-within {
  border-color: var(--el-color-primary);
  box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.12);
  outline: none;
}

.element-ui-enabled input::placeholder,
.element-ui-enabled textarea::placeholder {
  color: var(--el-text-color-placeholder);
}

.element-ui-enabled input[type="checkbox"],
.element-ui-enabled input[type="radio"] {
  accent-color: var(--el-color-primary);
}

/* Tables and data density */
.element-ui-enabled .table-wrap,
.element-ui-enabled .seo-table-wrap,
.element-ui-enabled .mp-table-wrap {
  border: 1px solid var(--el-border-color-lighter);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
}

.element-ui-enabled table {
  color: var(--el-text-color-regular);
}

.element-ui-enabled table th,
.element-ui-enabled .mp th {
  border-bottom: 1px solid var(--el-border-color-lighter);
  background: var(--el-fill-color-light);
  color: var(--el-text-color-regular);
  font-weight: 600;
}

.element-ui-enabled table td,
.element-ui-enabled .mp td {
  border-bottom: 1px solid var(--el-border-color-lighter);
  color: var(--el-text-color-regular);
}

.element-ui-enabled table tbody tr:hover td,
.element-ui-enabled .mp tbody tr:hover {
  background: var(--el-fill-color-lighter);
}

/* Tags, alerts, dialogs and empty states */
.element-ui-enabled .tag,
.element-ui-enabled .status,
.element-ui-enabled .pill,
.element-ui-enabled .seo-pill,
.element-ui-enabled .seo-status,
.element-ui-enabled .seo-gen-tag,
.element-ui-enabled .seo-article-status,
.element-ui-enabled .home-status,
.element-ui-enabled .mp-badge {
  border-radius: var(--el-border-radius-base);
  font-weight: 500;
}

.element-ui-enabled .modal,
.element-ui-enabled .confirm-modal,
.element-ui-enabled .mp-dialog,
.element-ui-enabled dialog {
  border: 1px solid var(--el-border-color-lighter);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  box-shadow: 0 10px 30px rgba(31, 45, 61, 0.16);
}

.element-ui-enabled .modal-backdrop,
.element-ui-enabled .mp-dialog-backdrop {
  background: rgba(0, 0, 0, 0.45);
}

.element-ui-enabled .empty,
.element-ui-enabled .empty-state,
.element-ui-enabled .mp-empty {
  color: var(--el-text-color-secondary);
}

.element-ui-enabled .alert,
.element-ui-enabled .mp-alert {
  border: 1px solid #faecd8;
  border-radius: var(--el-border-radius-base);
  background: #fdf6ec;
  color: #b88230;
}

/* Authentication page */
.element-ui-enabled .auth-page {
  background:
    radial-gradient(circle at 18% 18%, rgba(64, 158, 255, 0.08), transparent 32%),
    var(--el-bg-color-page);
}

.element-ui-enabled .auth-card,
.element-ui-enabled .auth-card-login,
.element-ui-enabled .auth-card-register {
  border: 1px solid var(--el-border-color-light);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  box-shadow: var(--el-box-shadow-light);
}

.element-ui-enabled .auth-side {
  background: linear-gradient(145deg, var(--el-color-primary-dark-2), var(--el-color-primary));
}

.element-ui-enabled .auth-tabs {
  border-bottom-color: var(--el-border-color-light);
}

.element-ui-enabled .auth-tabs button,
.element-ui-enabled .auth-methods button {
  color: var(--el-text-color-regular);
}

.element-ui-enabled .auth-tabs button.active,
.element-ui-enabled .auth-methods button.active {
  border-color: var(--el-color-primary);
  color: var(--el-color-primary);
}

.element-ui-enabled .auth-secondary {
  border-color: var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
}

.element-ui-enabled .auth-secondary:hover {
  border-color: var(--el-color-primary-light-5);
  background: var(--el-color-primary-light-9);
  color: var(--el-color-primary);
}

/* Media module uses its own variables; align them with the same palette. */
.element-ui-enabled .mp,
.admin-shell .mp {
  --mp-blue: var(--el-color-primary);
  --mp-line: var(--el-border-color-lighter);
  --mp-muted: var(--el-text-color-secondary);
  color: var(--el-text-color-primary);
}

/* Total administration console */
.admin-shell {
  background: var(--el-bg-color-page);
  color: var(--el-text-color-primary);
}

.admin-sidebar {
  background: #1f2d3d;
  border-right: 1px solid #172431;
}

.admin-brand {
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.admin-nav button,
.admin-link {
  border-radius: var(--el-border-radius-base);
  color: #cfd8e3;
  font-weight: 500;
}

.admin-nav button:hover,
.admin-link:hover {
  background: #26384a;
  color: #ffffff;
}

.admin-nav button.active {
  background: var(--el-color-primary);
  color: #ffffff;
  box-shadow: none;
}

.admin-main {
  background: var(--el-bg-color-page);
}

.admin-topbar {
  min-height: 68px;
  padding: 12px 28px;
  border-bottom: 1px solid var(--el-border-color-lighter);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 1px 0 rgba(31, 45, 61, 0.02);
}

.admin-title h1 {
  color: var(--el-text-color-primary);
  font-size: 22px;
  font-weight: 600;
}

.admin-title p {
  color: var(--el-text-color-secondary);
}

.admin-user {
  min-height: 40px;
  border: 1px solid var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
}

.admin-user:hover {
  border-color: var(--el-color-primary-light-5);
  background: var(--el-color-primary-light-9);
}

.admin-content {
  padding: 22px 28px 32px;
}

.admin-shell .panel,
.admin-shell .kpi-card,
.admin-shell .filter-panel,
.admin-login-card {
  border: 1px solid var(--el-border-color-lighter);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  box-shadow: var(--el-box-shadow-lighter);
}

.admin-shell .panel-head {
  min-height: 54px;
  border-bottom-color: var(--el-border-color-lighter);
}

.admin-shell .panel-head h2,
.admin-shell .panel-head h3 {
  color: var(--el-text-color-primary);
  font-weight: 600;
}

.admin-shell .field span {
  color: var(--el-text-color-regular);
  font-weight: 500;
}

.admin-shell .input,
.admin-shell .select,
.admin-shell .textarea,
.admin-shell input,
.admin-shell select,
.admin-shell textarea,
.admin-login-card .input {
  min-height: 36px;
  border: 1px solid var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
  box-shadow: none;
}

.admin-shell .input:hover,
.admin-shell .select:hover,
.admin-shell .textarea:hover,
.admin-shell input:hover,
.admin-shell select:hover,
.admin-shell textarea:hover,
.admin-login-card .input:hover {
  border-color: #c0c4cc;
}

.admin-shell .input:focus,
.admin-shell .select:focus,
.admin-shell .textarea:focus,
.admin-shell input:focus,
.admin-shell select:focus,
.admin-shell textarea:focus,
.admin-login-card .input:focus {
  border-color: var(--el-color-primary);
  box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.12);
  outline: none;
}

.admin-shell .btn,
.admin-login-card .btn {
  min-height: 36px;
  border: 1px solid var(--el-border-color);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
  color: var(--el-text-color-regular);
  box-shadow: none;
  font-weight: 500;
}

.admin-shell .btn:hover,
.admin-login-card .btn:hover {
  border-color: var(--el-color-primary-light-5);
  background: var(--el-color-primary-light-9);
  color: var(--el-color-primary);
}

.admin-shell .btn.primary,
.admin-shell .btn.teal,
.admin-login-card .btn.primary {
  border-color: var(--el-color-primary);
  background: var(--el-color-primary);
  color: #ffffff;
}

.admin-shell .btn.primary:hover,
.admin-shell .btn.teal:hover,
.admin-login-card .btn.primary:hover {
  border-color: var(--el-color-primary-light-3);
  background: var(--el-color-primary-light-3);
  color: #ffffff;
}

.admin-shell .btn.warning {
  border-color: var(--el-color-warning);
  background: var(--el-color-warning);
  color: #ffffff;
}

.admin-shell .btn.danger {
  border-color: var(--el-color-danger);
  background: var(--el-color-danger);
  color: #ffffff;
}

.admin-shell .table-wrap {
  border-color: var(--el-border-color-lighter);
  border-radius: var(--el-border-radius-base);
  background: var(--el-bg-color);
}

.admin-shell thead th {
  border-bottom-color: var(--el-border-color-lighter);
  background: var(--el-fill-color-light);
  color: var(--el-text-color-regular);
  font-weight: 600;
}

.admin-shell tbody td {
  border-bottom-color: var(--el-border-color-lighter);
  color: var(--el-text-color-regular);
}

.admin-shell tbody tr:hover td {
  background: var(--el-fill-color-lighter);
}

.admin-shell .tag,
.admin-shell .status,
.admin-shell .pill {
  border-radius: var(--el-border-radius-base);
  font-weight: 500;
}

.admin-login-page {
  background:
    radial-gradient(circle at 18% 18%, rgba(64, 158, 255, 0.08), transparent 32%),
    var(--el-bg-color-page);
}

.admin-login-brand img {
  background: var(--el-color-primary);
}

@media (min-width: 961px) {
  .element-ui-enabled .topbar,
  .admin-topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    backdrop-filter: blur(10px);
  }
}

@media (max-width: 960px) {
  .element-ui-enabled .content,
  .admin-content {
    padding: 18px;
  }

  .admin-sidebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 10px 12px;
  }

  .admin-brand {
    padding: 2px 2px 10px;
  }

  .admin-nav,
  .admin-sidebar-foot {
    display: flex;
    grid-template-columns: none;
    gap: 6px;
    min-width: 0;
    margin: 0;
    padding: 0 0 2px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
  }

  .admin-nav button,
  .admin-sidebar-foot .admin-link {
    flex: 0 0 auto;
    width: auto;
    min-height: 38px;
    padding: 0 12px;
    white-space: nowrap;
  }
}

@media (max-width: 720px) {
  .element-ui-enabled .sidebar,
  .admin-sidebar {
    padding: 12px;
  }

  .element-ui-enabled .brand,
  .admin-brand {
    padding-bottom: 10px;
  }

  .element-ui-enabled .sidebar .nav,
  .admin-nav {
    gap: 4px;
    margin-top: 8px;
  }

  .element-ui-enabled .sidebar .nav > button,
  .element-ui-enabled .sidebar .nav .nav-parent,
  .element-ui-enabled .sidebar .subnav button,
  .admin-nav button,
  .admin-link {
    min-height: 36px;
  }

  .element-ui-enabled .topbar,
  .admin-topbar {
    min-height: 0;
    padding: 14px;
  }

  .element-ui-enabled .content,
  .admin-content {
    padding: 14px;
  }

  .element-ui-enabled .home-page,
  .element-ui-enabled .seo-page {
    gap: 12px;
  }

  .element-ui-enabled .auth-page {
    padding: 0;
    align-items: flex-start;
  }

  .element-ui-enabled .auth-card,
  .element-ui-enabled .auth-card-login,
  .element-ui-enabled .auth-card-register {
    width: 100%;
    min-height: 100vh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}