/* OzunIA 智控台 — Mercedes-AMG CLA 45 C117 atelier chrome
   Canonical live overlay. Keep in sync with
   main/manager-web/src/styles/ozunia-theme.css
   Accent is AMG performance red; chrome is charcoal / silver.
   Red is reserved for CTA, active, and focus. */

:root {
  --oz-bg: #0a0a0b;
  --oz-bg-raised: #111214;
  --oz-surface: #16181b;
  --oz-surface-2: #1c1f24;
  --oz-border: #2a2d32;
  --oz-accent: #c4001a;
  --oz-accent-hot: #e10600;
  --oz-accent-dim: #8a0012;
  --oz-accent-soft: rgba(196, 0, 26, 0.16);
  --oz-text: #f2f2f3;
  --oz-text-secondary: #a8adb4;
  --oz-text-muted: #7a8088;
  --oz-silver: #c8ccd0;
  --oz-silver-dim: #8b9098;
  --oz-focus: #e10600;
  --oz-radius: 6px;
  --oz-radius-lg: 8px;
  --oz-shadow: 0 18px 48px rgba(0, 0, 0, 0.55);
  --oz-type: Inter, "SF Pro Text", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --el-color-primary: #c4001a;
  --el-color-primary-light-3: #e10600;
  --el-color-primary-light-5: #8a0012;
  --el-color-primary-light-7: rgba(196, 0, 26, 0.22);
  --el-color-primary-light-8: rgba(196, 0, 26, 0.14);
  --el-color-primary-light-9: rgba(196, 0, 26, 0.08);
}

html.ozunia-amg,
html,
body {
  background: var(--oz-bg);
  color: var(--oz-text);
}

#app {
  background: var(--oz-bg);
  color: var(--oz-text) !important;
  font-family: var(--oz-type);
  font-size: 13px;
  line-height: 1.45;
  letter-spacing: 0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--oz-accent);
  z-index: 10000;
  pointer-events: none;
}

::selection {
  background: var(--oz-accent);
  color: #fff;
}

:focus-visible {
  outline: 1px solid var(--oz-focus);
  outline-offset: 2px;
}

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

::-webkit-scrollbar-thumb {
  background: #3a3e45;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--oz-accent-dim);
}

::-webkit-scrollbar-track {
  background: var(--oz-bg-raised);
}

/* ---------- Page chrome ---------- */
.welcome {
  background: var(--oz-bg) !important;
  background-image: none !important;
}

.welcome:has(.add-device) {
  background: var(--oz-bg) !important;
}

/* ---------- Auth atelier (transforms stock login markup) ---------- */
.welcome:has(.login-box) {
  background-color: var(--oz-bg) !important;
  background-image:
    radial-gradient(ellipse 70% 42% at 50% -8%, rgba(196, 0, 26, 0.07), transparent 58%),
    linear-gradient(90deg, var(--oz-bg-raised) 0, var(--oz-bg-raised) 72px, transparent 73px) !important;
  background-size: cover;
}

.welcome:has(.login-box) > .el-container > .el-header {
  background: transparent !important;
  border-bottom: 1px solid var(--oz-border);
}

.welcome:has(.login-box) > .el-container > .el-header img:first-child {
  width: 36px !important;
  height: 36px !important;
  filter: brightness(0) invert(0.92);
}

.welcome:has(.login-box) > .el-container > .el-header img:nth-of-type(2) {
  display: none !important;
}

.welcome:has(.login-box) > .el-container > .el-header > div:not(.auth-brand)::after {
  content: "OzunIA  ·  CLA 45";
  margin-left: 2px;
  padding-left: 14px;
  border-left: 1px solid var(--oz-border);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--oz-silver);
}

.login-person {
  display: none !important;
}

.welcome .login-box {
  left: 50% !important;
  right: auto !important;
  top: 48% !important;
  transform: translate(-50%, -50%) !important;
  width: 420px !important;
  padding: 36px 0 28px !important;
  background: var(--oz-surface) !important;
  border: 1px solid var(--oz-border) !important;
  border-radius: var(--oz-radius-lg) !important;
  box-shadow: var(--oz-shadow) !important;
  overflow: hidden;
}

.welcome .login-box::before {
  content: "Private atelier console";
  display: block;
  padding: 0 32px 10px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--oz-silver-dim);
}

.welcome .login-box::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--oz-accent);
}

.welcome .login-box > div:first-child {
  gap: 10px 16px !important;
  margin-bottom: 8px !important;
  align-items: baseline !important;
}

.welcome .login-box > div:first-child > img {
  display: none !important;
}

.login-text,
.current-language-text {
  color: var(--oz-text) !important;
}

.login-text {
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}

.login-welcome,
.el-dropdown-link,
.welcome .el-dropdown-link {
  color: var(--oz-text-secondary) !important;
}

.login-welcome {
  font-size: 12px !important;
  letter-spacing: 0.02em !important;
  margin-bottom: 0 !important;
  align-self: center !important;
}

.input-box {
  background: var(--oz-bg-raised) !important;
  border: 1px solid var(--oz-border) !important;
  border-radius: var(--oz-radius) !important;
  height: 42px !important;
}

.input-icon {
  filter: brightness(0) invert(0.62);
  opacity: 0.85;
}

.login-btn {
  background: var(--oz-accent) !important;
  border-radius: var(--oz-radius) !important;
  color: #fff !important;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 12px !important;
  height: 40px !important;
  line-height: 40px !important;
  margin: 22px 32px 16px !important;
}

.login-btn:hover {
  background: var(--oz-accent-hot) !important;
}

.auth-link {
  color: var(--oz-silver) !important;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.auth-link:hover {
  color: var(--oz-accent-hot) !important;
}

.welcome .login-box img[alt="验证码"],
.welcome .login-box img[src^="blob:"] {
  border: 1px solid var(--oz-border);
  border-radius: var(--oz-radius);
  background: var(--oz-bg-raised);
}

.welcome .el-tabs__item {
  color: var(--oz-text-secondary) !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
}

.welcome .el-tabs__item.is-active {
  color: var(--oz-text) !important;
}

.welcome .el-tabs__active-bar {
  background-color: var(--oz-accent) !important;
}

.welcome .el-tabs__nav-wrap::after,
.welcome .el-tabs__nav-wrap::before {
  background-color: var(--oz-border) !important;
}

.send-captcha-btn,
.send-captcha-btn.el-button--primary {
  background: var(--oz-accent) !important;
  border-color: var(--oz-accent) !important;
  color: #fff !important;
  border-radius: var(--oz-radius) !important;
}

.send-captcha-btn:hover,
.send-captcha-btn.el-button--primary:hover {
  background: var(--oz-accent-hot) !important;
  border-color: var(--oz-accent-hot) !important;
}

.send-captcha-btn.is-disabled,
.send-captcha-btn:disabled {
  background: var(--oz-surface-2) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text-muted) !important;
}

.header.el-header,
.el-header.header,
.header {
  background: var(--oz-bg-raised) !important;
  border-bottom: 1px solid var(--oz-border);
  height: 56px !important;
  box-shadow: none !important;
}

.header-center {
  background: var(--oz-bg) !important;
  border: 1px solid var(--oz-border) !important;
  border-radius: var(--oz-radius-lg) !important;
  box-shadow: none !important;
  gap: 2px !important;
  padding: 3px !important;
}

.equipment-management {
  color: var(--oz-text-secondary) !important;
  border-radius: var(--oz-radius) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  padding: 7px 13px !important;
}

.equipment-management:hover {
  color: var(--oz-text) !important;
  background: var(--oz-surface-2) !important;
}

.equipment-management.active-tab,
.equipment-management.active-tab:hover {
  color: #fff !important;
  background: var(--oz-surface-2) !important;
  box-shadow: inset 0 -2px 0 var(--oz-accent) !important;
}

.equipment-management.active-tab::before {
  display: none !important;
}

.equipment-management img {
  filter: brightness(0) invert(0.72) !important;
}

.equipment-management.active-tab img {
  filter: brightness(0) invert(1) !important;
}

.header-left .brand-img,
.welcome > .el-container > .el-header img:last-child {
  filter: brightness(0) invert(0.92);
}

.header-left .logo-img {
  filter: brightness(0) invert(0.92);
}

.el-user-dropdown,
.header-right,
.nav-text {
  color: var(--oz-text-secondary);
  font-size: 12px;
  letter-spacing: 0.02em;
}

.header-right .el-user-dropdown:hover,
.header-right .avatar-img:hover + .el-user-dropdown {
  color: var(--oz-text);
}

.copyright,
.copyright .beian-text,
.footer,
.footer-content {
  color: var(--oz-text-muted) !important;
  letter-spacing: 0.04em;
}

/* ---------- Home / agents ---------- */
.add-device {
  background: var(--oz-surface) !important;
  border: 1px solid var(--oz-border);
  border-radius: var(--oz-radius-lg) !important;
  overflow: hidden;
  min-height: 156px;
  height: auto !important;
}

.add-device::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--oz-accent);
}

.add-device-bg {
  background-image: none !important;
  padding-bottom: 22px;
}

.add-device-bg .hellow-text,
.hellow-text {
  color: var(--oz-text) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.25 !important;
}

.hi-hint {
  color: var(--oz-silver-dim) !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-size: 10px !important;
  margin-top: 8px !important;
}

.add-device-btn {
  background: var(--oz-accent) !important;
  border-color: var(--oz-accent) !important;
  color: #fff !important;
  border-radius: var(--oz-radius) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  height: 36px !important;
  padding: 0 16px !important;
}

.add-device-btn:hover {
  background: var(--oz-accent-hot) !important;
  border-color: var(--oz-accent-hot) !important;
  color: #fff !important;
}

.custom-search-input .el-input__inner {
  background: var(--oz-bg-raised) !important;
  border: 1px solid var(--oz-border) !important;
  color: var(--oz-text) !important;
  box-shadow: none !important;
  border-radius: var(--oz-radius) !important;
  height: 36px !important;
}

.search-history-dropdown {
  background: var(--oz-surface) !important;
  border-color: var(--oz-border) !important;
  border-radius: var(--oz-radius) !important;
}

.search-history-header,
.search-history-item,
.clear-history-btn {
  color: var(--oz-text-secondary) !important;
}

.search-history-item:hover {
  background: var(--oz-surface-2) !important;
}

.device-list-container {
  gap: 20px !important;
  padding: 24px 0 !important;
}

.device-item,
.skeleton-item {
  background: var(--oz-surface) !important;
  border: 1px solid var(--oz-border);
  border-radius: var(--oz-radius-lg) !important;
  box-shadow: none;
  padding: 20px 20px 16px !important;
}

.device-item {
  transition: border-color 0.18s ease;
}

.device-item:hover {
  border-color: #3a3e45;
}

.device-item-title {
  color: var(--oz-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

.device-name,
.version-info {
  color: var(--oz-text-secondary) !important;
  font-size: 12px !important;
}

.settings-btn {
  color: var(--oz-silver) !important;
  background: transparent !important;
  border: 1px solid var(--oz-border) !important;
  border-radius: var(--oz-radius) !important;
  height: 24px !important;
  line-height: 22px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
  padding: 0 10px !important;
}

.settings-btn:hover {
  background: var(--oz-accent-soft) !important;
  border-color: var(--oz-accent) !important;
  color: #fff !important;
}

.device-item .settings-btn:first-child {
  color: #fff !important;
  background: var(--oz-accent-soft) !important;
  border-color: rgba(196, 0, 26, 0.4) !important;
}

.disabled-btn {
  background: var(--oz-surface-2) !important;
  color: var(--oz-text-muted) !important;
  border-color: var(--oz-border) !important;
}

.skeleton-image,
.skeleton-line,
.skeleton-line-short {
  background: var(--oz-surface-2) !important;
}

/* ---------- Admin content panels ---------- */
.main-wrapper,
.content-panel,
.content-area,
.params-card,
.el-card,
.el-card__body,
.el-card__header {
  background: var(--oz-surface) !important;
  color: var(--oz-text) !important;
  border-color: var(--oz-border) !important;
}

.content-panel,
.el-card {
  border: 1px solid var(--oz-border) !important;
  border-radius: var(--oz-radius-lg) !important;
  box-shadow: none !important;
}

.page-title,
.operation-header,
h1, h2, h3, h4 {
  color: var(--oz-text);
  letter-spacing: -0.015em;
}

.page-title {
  font-size: 18px !important;
  font-weight: 600 !important;
}

/* ---------- Element UI: buttons ---------- */
.el-button {
  background: var(--oz-surface-2);
  border-color: var(--oz-border);
  color: var(--oz-text);
  border-radius: var(--oz-radius);
  font-weight: 600;
  letter-spacing: 0.03em;
}

.el-button:hover,
.el-button:focus {
  background: #22262c;
  border-color: var(--oz-silver-dim);
  color: var(--oz-text);
}

.el-button:focus-visible {
  outline: 1px solid var(--oz-focus);
  outline-offset: 2px;
}

.el-button--primary,
.el-button--primary:focus,
.custom-button--default,
.custom-button--confirm {
  background: var(--oz-accent) !important;
  border-color: var(--oz-accent) !important;
  color: #fff !important;
}

.el-button--primary:hover,
.el-button--primary:focus:hover,
.custom-button--default:hover,
.custom-button--confirm:hover {
  background: var(--oz-accent-hot) !important;
  border-color: var(--oz-accent-hot) !important;
  color: #fff !important;
  box-shadow: none;
}

.el-button--primary.is-disabled,
.el-button--primary.is-disabled:hover,
.custom-button--default.is-disabled,
.custom-button--confirm.is-disabled {
  background: var(--oz-accent-dim) !important;
  border-color: var(--oz-accent-dim) !important;
  color: rgba(255, 255, 255, 0.55) !important;
}

.custom-button--add {
  background: var(--oz-surface-2) !important;
  border: 1px solid var(--oz-silver-dim) !important;
  color: var(--oz-text) !important;
}

.custom-button--add:hover {
  border-color: var(--oz-silver) !important;
  color: #fff !important;
}

.custom-button--delete,
.el-button--danger {
  background: var(--oz-accent-dim) !important;
  border-color: var(--oz-accent-dim) !important;
  color: #fff !important;
}

.el-button--success {
  background: #2a3a32 !important;
  border-color: #3d5a4a !important;
  color: var(--oz-text) !important;
}

.el-button--warning {
  background: #3a2e16 !important;
  border-color: #8a6a2a !important;
  color: #f3e6c0 !important;
}

.el-button--info {
  background: var(--oz-surface-2) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text-secondary) !important;
}

.el-button--text,
.el-button--text:focus {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--oz-silver) !important;
}

.el-button--text:hover {
  color: var(--oz-accent-hot) !important;
}

.el-button.is-plain {
  background: transparent !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
}

.el-button.is-plain:hover,
.el-button.is-plain.el-button--primary:hover {
  background: var(--oz-accent-soft) !important;
  border-color: var(--oz-accent) !important;
  color: #fff !important;
}

.el-button.is-circle {
  background: var(--oz-surface-2);
  border-color: var(--oz-border);
  color: var(--oz-text);
}

/* ---------- Inputs / forms ---------- */
.el-input__inner,
.el-textarea__inner,
.el-range-editor,
.el-select .el-input__inner {
  background-color: var(--oz-bg-raised) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
  border-radius: var(--oz-radius);
}

.el-input__inner::placeholder,
.el-textarea__inner::placeholder {
  color: var(--oz-text-muted) !important;
}

.el-input__inner:focus,
.el-textarea__inner:focus,
.el-select .el-input.is-focus .el-input__inner,
.el-range-editor.is-active {
  border-color: var(--oz-accent) !important;
}

.el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
  background-color: #0e0f11 !important;
  color: var(--oz-text-muted) !important;
  border-color: var(--oz-border) !important;
}

.el-input__prefix,
.el-input__suffix,
.el-input__icon,
.el-select .el-input .el-select__caret {
  color: var(--oz-silver-dim);
}

.el-form-item__label,
.el-radio,
.el-checkbox {
  color: var(--oz-text-secondary);
  font-size: 12px;
  letter-spacing: 0.02em;
}

.el-checkbox__inner,
.el-radio__inner {
  background-color: var(--oz-bg-raised) !important;
  border-color: var(--oz-silver-dim) !important;
}

.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner,
.el-radio__input.is-checked .el-radio__inner {
  background-color: var(--oz-accent) !important;
  border-color: var(--oz-accent) !important;
}

.el-checkbox__label,
.el-radio__label {
  color: var(--oz-text-secondary) !important;
}

.el-checkbox__input.is-checked + .el-checkbox__label,
.el-radio__input.is-checked + .el-radio__label {
  color: var(--oz-text) !important;
}

.el-switch__core {
  background: #3a3e45 !important;
  border-color: #3a3e45 !important;
}

.el-switch.is-checked .el-switch__core {
  background-color: var(--oz-accent) !important;
  border-color: var(--oz-accent) !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: var(--oz-text);
  -webkit-box-shadow: 0 0 0 1000px var(--oz-bg-raised) inset;
  caret-color: var(--oz-text);
  transition: background-color 9999s ease-in-out 0s;
}

/* ---------- Selects / dropdowns / menus ---------- */
.el-select-dropdown,
.el-dropdown-menu,
.el-picker-panel,
.el-cascader__dropdown,
.el-cascader-menu,
.el-cascader-panel,
.el-autocomplete-suggestion,
.el-popper,
.el-popover,
.el-tooltip__popper,
.el-tooltip__popper.is-dark,
.el-tooltip__popper.is-light,
.is-light,
.el-message-box,
.el-notification {
  background: var(--oz-surface-2) !important;
  border: 1px solid var(--oz-border) !important;
  color: var(--oz-text) !important;
  border-radius: var(--oz-radius) !important;
}

.el-select-dropdown__item,
.el-dropdown-menu__item,
.el-cascader-node,
.el-picker-panel,
.el-date-table th,
.el-date-table td,
.el-year-table td,
.el-month-table td {
  color: var(--oz-text-secondary) !important;
  background: transparent !important;
}

.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover,
.el-dropdown-menu__item:hover,
.el-dropdown-menu__item:focus,
.el-cascader-node:hover,
.el-cascader-node.is-selectable:hover {
  background: var(--oz-surface) !important;
  color: var(--oz-text) !important;
}

.el-select-dropdown__item.selected,
.el-cascader-node.is-active {
  color: #fff !important;
  background: var(--oz-accent-soft) !important;
  font-weight: 600;
}

.el-popper[x-placement^="bottom"] .popper__arrow,
.el-popper[x-placement^="bottom"] .popper__arrow::after,
.el-tooltip__popper .popper__arrow,
.el-tooltip__popper.is-light .popper__arrow,
.is-light .popper__arrow {
  border-top-color: var(--oz-border) !important;
  border-bottom-color: var(--oz-border) !important;
}

.el-picker-panel__icon-btn,
.el-date-picker__header-label {
  color: var(--oz-text) !important;
}

.el-date-table td.today span,
.el-date-table td.available:hover {
  color: var(--oz-accent-hot) !important;
}

.el-date-table td.current:not(.disabled) span {
  background-color: var(--oz-accent) !important;
  color: #fff !important;
}

/* ---------- Tables / pagination ---------- */
.el-table,
.el-table__expanded-cell,
.el-table th,
.el-table tr,
.el-table td,
.custom-table,
.custom-table-wrapper .table-container,
.el-table__header,
.el-table__body,
.el-table__footer,
.el-table__fixed,
.el-table__fixed-right,
.el-table--enable-row-hover .el-table__body tr:hover > td,
.el-table__body tr.hover-row > td,
.el-table--striped .el-table__body tr.el-table__row--striped td {
  background-color: var(--oz-surface) !important;
  background: var(--oz-surface) !important;
  color: var(--oz-text) !important;
  border-color: var(--oz-border) !important;
}

.el-table th,
.el-table thead,
.custom-table .el-table__header th,
.el-table__header-wrapper th {
  background: var(--oz-surface-2) !important;
  color: var(--oz-silver) !important;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.el-table--enable-row-hover .el-table__body tr:hover > td,
.el-table__body tr.hover-row > td {
  background: #22262c !important;
}

.el-table td,
.el-table th.is-leaf,
.el-table--border,
.el-table--group,
.el-table--border td,
.el-table--border th,
.el-table__fixed-right::before,
.el-table__fixed::before {
  border-color: var(--oz-border) !important;
}

.el-table::before,
.el-table::after,
.el-table--border::after,
.el-table--group::after {
  background-color: var(--oz-border) !important;
}

.el-table__empty-text,
.el-table__empty-block {
  color: var(--oz-text-muted) !important;
  background: transparent !important;
}

.table-container {
  box-shadow: none !important;
  border: 1px solid var(--oz-border);
  border-radius: var(--oz-radius);
}

.el-pagination,
.el-pagination span,
.el-pagination button,
.el-pager li,
.el-pagination__jump,
.el-pagination__total {
  background: transparent !important;
  color: var(--oz-text-secondary) !important;
}

.el-pagination button,
.el-pager li,
.el-pagination .el-select .el-input .el-input__inner {
  background: var(--oz-surface-2) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
}

.el-pager li.active,
.el-pager li.active:hover {
  background: var(--oz-accent) !important;
  color: #fff !important;
}

.el-pagination button:hover,
.el-pager li:hover {
  color: #fff !important;
}

.el-pagination button:disabled {
  color: var(--oz-text-muted) !important;
}

/* ---------- Dialogs / drawers / messages ---------- */
.el-dialog,
.el-message-box,
.delete-agent-dialog .el-dialog {
  background: var(--oz-surface) !important;
  border: 1px solid var(--oz-border);
  border-radius: var(--oz-radius-lg) !important;
  box-shadow: var(--oz-shadow);
}

.el-dialog__header,
.el-message-box__header,
.delete-agent-dialog .el-dialog__header {
  border-bottom: 1px solid var(--oz-border);
  background: var(--oz-surface-2) !important;
}

.el-dialog__title,
.el-dialog__body,
.el-message-box__title,
.el-message-box__content,
.delete-agent-title,
.delete-agent-message,
.delete-agent-target {
  color: var(--oz-text) !important;
}

.delete-agent-target {
  background: var(--oz-bg-raised) !important;
  border-color: var(--oz-border) !important;
}

.el-dialog__headerbtn .el-dialog__close,
.el-message-box__headerbtn .el-message-box__close {
  color: var(--oz-silver);
}

.el-dialog__headerbtn:hover .el-dialog__close {
  color: var(--oz-accent-hot);
}

.delete-agent-dialog .el-dialog__headerbtn {
  background: var(--oz-surface) !important;
  box-shadow: none !important;
  border: 1px solid var(--oz-border) !important;
}

.el-overlay,
.v-modal {
  background-color: rgba(0, 0, 0, 0.72) !important;
}

.el-message {
  background: var(--oz-surface-2) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
}

.el-message--success {
  background: #1a2a22 !important;
  border-color: #2f6b4f !important;
}

.el-message--error,
.el-message--warning {
  background: #2a1618 !important;
  border-color: var(--oz-accent-dim) !important;
}

.el-notification {
  background: var(--oz-surface-2) !important;
  color: var(--oz-text) !important;
}

.el-loading-mask {
  background-color: rgba(10, 10, 11, 0.62) !important;
}

.el-loading-spinner .path {
  stroke: var(--oz-accent) !important;
}

.el-loading-text {
  color: var(--oz-silver) !important;
}

/* ---------- Tabs / tags / links ---------- */
.el-tabs__item {
  color: var(--oz-text-secondary) !important;
  font-weight: 600;
  letter-spacing: 0.03em;
}

.el-tabs__item.is-active,
.el-tabs__item:hover {
  color: var(--oz-text) !important;
}

.el-tabs__active-bar {
  background-color: var(--oz-accent) !important;
}

.el-tabs__nav-wrap::after {
  background-color: var(--oz-border) !important;
}

.el-tag {
  background-color: var(--oz-surface-2) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
  border-radius: var(--oz-radius);
}

.el-tag--success {
  background-color: #1a2a22 !important;
  border-color: #2f6b4f !important;
  color: #c8e6d4 !important;
}

.el-tag--danger,
.el-tag--warning {
  background-color: var(--oz-accent-soft) !important;
  border-color: var(--oz-accent-dim) !important;
  color: #ffd4d8 !important;
}

.el-tag--info {
  background-color: var(--oz-surface-2) !important;
  color: var(--oz-text-secondary) !important;
}

.el-link.el-link--primary,
.el-link {
  color: var(--oz-silver) !important;
}

.el-link.el-link--primary:hover,
.el-link:hover {
  color: var(--oz-accent-hot) !important;
}

.el-badge__content {
  background-color: var(--oz-accent) !important;
  border-color: var(--oz-bg);
}

/* ---------- Collapse / steps / alerts / upload / slider ---------- */
.el-collapse,
.el-collapse-item__header,
.el-collapse-item__wrap,
.el-collapse-item__content {
  background-color: var(--oz-surface) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
}

.el-step__title,
.el-step__description {
  color: var(--oz-text-secondary) !important;
}

.el-step__title.is-process,
.el-step__head.is-process {
  color: var(--oz-text) !important;
  border-color: var(--oz-accent);
}

.el-step__head.is-finish,
.el-step__title.is-finish {
  color: var(--oz-silver) !important;
  border-color: var(--oz-silver-dim);
}

.el-alert {
  background: var(--oz-surface-2) !important;
  color: var(--oz-text) !important;
}

.el-upload,
.el-upload-dragger {
  background: var(--oz-bg-raised) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text-secondary) !important;
}

.el-slider__runway {
  background-color: var(--oz-border) !important;
}

.el-slider__bar {
  background-color: var(--oz-accent) !important;
}

.el-slider__button {
  border-color: var(--oz-accent) !important;
}

.el-progress-bar__outer {
  background-color: var(--oz-border) !important;
}

.el-progress-bar__inner {
  background-color: var(--oz-accent) !important;
}

.el-tree {
  background: transparent;
  color: var(--oz-text);
}

.el-tree-node__content:hover,
.el-tree-node:focus > .el-tree-node__content {
  background: var(--oz-surface-2) !important;
}

.el-menu {
  background: var(--oz-bg-raised) !important;
  border-color: var(--oz-border) !important;
}

.el-menu-item,
.el-submenu__title {
  color: var(--oz-text-secondary) !important;
}

.el-menu-item.is-active {
  color: #fff !important;
  background: var(--oz-accent-soft) !important;
}

.el-breadcrumb__inner,
.el-breadcrumb__item,
.el-page-header__content,
.el-empty__description {
  color: var(--oz-text-secondary) !important;
}

/* ---------- Role / model leftover blues ---------- */
.delete-agent-confirm,
.btn-search {
  background: var(--oz-accent) !important;
  border-color: var(--oz-accent) !important;
  color: #fff !important;
}

.delete-agent-cancel {
  background: var(--oz-surface-2) !important;
  border-color: var(--oz-border) !important;
  color: var(--oz-text) !important;
}

[style*="color: #5778ff"],
[style*="color:#5778ff"],
[style*="color: #5778FF"],
[style*="color:#5778FF"],
[style*="color: #409EFF"],
[style*="color:#409EFF"] {
  color: var(--oz-accent-hot) !important;
}

[style*="background: #5778ff"],
[style*="background:#5778ff"],
[style*="background-color: #5778ff"],
[style*="background-color:#5778ff"],
[style*="background: #409EFF"],
[style*="background:#409EFF"] {
  background: var(--oz-accent) !important;
  background-color: var(--oz-accent) !important;
  color: #fff !important;
}

[style*="color: #3d4566"],
[style*="color:#3d4566"] {
  color: var(--oz-text) !important;
}

[style*="color: #979db1"],
[style*="color:#979db1"] {
  color: var(--oz-text-secondary) !important;
}

.content-area,
.params-card,
.model-card,
.dict-card,
.user-card,
.ota-card,
.config-card {
  background: var(--oz-surface) !important;
}

.el-divider,
.el-divider--horizontal {
  background-color: var(--oz-border) !important;
}

.el-footer {
  background: transparent !important;
  color: var(--oz-text-muted) !important;
}