body[data-theme="mezo-panel"] {
  color-scheme: dark;
  --color-bg: #101213;
  --color-panel: #181b1d;
  --color-panel-strong: #202833;
  --color-panel-subtle: #141719;
  --color-line: rgb(193 193 193 / 20%);
  --color-line-strong: rgb(193 193 193 / 38%);
  --color-text: #eef2f3;
  --color-muted: #a9b2b4;
  --color-title: #ffffff;
  --color-accent: #82c392;
  --color-accent-strong: #a7d7b1;
  --color-accent-soft: rgb(130 195 146 / 16%);
  --color-action: #2f4f9d;
  --color-action-strong: #4267be;
  --color-success: #82c392;
  --color-success-soft: rgb(130 195 146 / 14%);
  --color-warning: #f0c36d;
  --color-warning-soft: rgb(240 195 109 / 14%);
  --color-danger: #ee7772;
  --color-danger-soft: rgb(238 119 114 / 14%);
  --color-info: #c1c1c1;
  --color-info-soft: rgb(193 193 193 / 13%);
  --color-neutral-soft: rgb(255 255 255 / 7%);
  --shadow-1: 0 18px 50px rgb(0 0 0 / 24%);
  --shadow-2: 0 26px 70px rgb(0 0 0 / 38%);
}

body[data-theme="mezo-panel"] {
  background:
    linear-gradient(180deg, #161717 0, #101213 360px),
    var(--color-bg);
  font-family: "Montserrat", "Avenir Next", "Segoe UI", Arial, sans-serif;
}

body[data-theme="mezo-panel"] .sidebar,
body[data-theme="mezo-panel"] .topbar,
body[data-theme="mezo-panel"] .login-panel {
  background: #161717;
}

body[data-theme="mezo-panel"] .sidebar {
  border-right-color: #2e3437;
}

body[data-theme="mezo-panel"] .topbar {
  min-height: 70px;
  padding-bottom: var(--space-3);
  border-bottom: 4px solid #2f4f9d;
}

body[data-theme="mezo-panel"] .brand-logo[data-variant="full"] {
  width: 116px;
  height: 34px;
  object-position: left center;
}

body[data-theme="mezo-panel"] .login-brand .brand-logo[data-variant="full"] {
  width: 148px;
  height: 40px;
}

body[data-theme="mezo-panel"] .brand-label,
body[data-theme="mezo-panel"] .eyebrow,
body[data-theme="mezo-panel"] .section-heading h3,
body[data-theme="mezo-panel"] .compact-heading h3 {
  color: #82c392;
}

body[data-theme="mezo-panel"] .brand h1,
body[data-theme="mezo-panel"] .topbar h2 {
  color: #ffffff;
}

body[data-theme="mezo-panel"] .module-card,
body[data-theme="mezo-panel"] .metric,
body[data-theme="mezo-panel"] .management-panel,
body[data-theme="mezo-panel"] .grid-table,
body[data-theme="mezo-panel"] .compact-table,
body[data-theme="mezo-panel"] .escala-table,
body[data-theme="mezo-panel"] .imaging-detail,
body[data-theme="mezo-panel"] .imaging-case-list,
body[data-theme="mezo-panel"] .module-frame {
  border-color: #2e3437;
  box-shadow: var(--shadow-card);
}

body[data-theme="mezo-panel"] .data-row-head,
body[data-theme="mezo-panel"] .escala-head {
  background: #202833;
  color: #ffffff;
}

body[data-theme="mezo-panel"] .metric strong {
  color: #ffffff;
}

body[data-theme="mezo-panel"] .tag.ok,
body[data-theme="mezo-panel"] .tag.info {
  color: #82c392;
  background: rgb(130 195 146 / 14%);
}

body[data-theme="mezo-panel"] button {
  border-color: #2f4f9d;
  background: #2f4f9d;
}

body[data-theme="mezo-panel"] button:hover {
  border-color: #4267be;
  background: #4267be;
}

body[data-theme="mezo-panel"] .ghost-button {
  color: #eef2f3;
  background: rgb(255 255 255 / 6%);
  border-color: rgb(255 255 255 / 16%);
}

body[data-theme="mezo-panel"] .ghost-button:hover {
  color: #ffffff;
  background: rgb(130 195 146 / 14%);
  border-color: #82c392;
}

@media (max-width: 920px) {
  body[data-theme="mezo-panel"] .topbar {
    min-height: auto;
    border-bottom-width: 3px;
  }

  body[data-theme="mezo-panel"] .user-box {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-theme="mezo-panel"] .user-box > div {
    grid-column: 1 / -1;
  }

  body[data-theme="mezo-panel"] .user-box button {
    width: 100%;
  }
}