/* Charte Heitz System pour la console RustDesk */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap");

:root {
  --hz-primary: #3856BD;
  --hz-navy: #2A2D7D;
  --hz-sky: #71CBF4;
  --hz-text: #16253F;
  --hz-muted: #717680;
  --hz-bg: #F4F6FF;
  --hz-line: #E7E9F5;

  --primaryColor: var(--hz-primary);
  --el-color-primary: #3856BD;
  --el-color-primary-light-3: #7489d1;
  --el-color-primary-light-5: #9babde;
  --el-color-primary-light-7: #c3cceb;
  --el-color-primary-light-8: #d7ddf2;
  --el-color-primary-light-9: #ebeef8;
  --el-color-primary-dark-2: #2d4597;
  --el-border-radius-base: 8px;
  --el-font-family: "Montserrat", system-ui, sans-serif;
}

body,
button,
input,
textarea,
.el-button,
.el-input__inner {
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}

html:not(.dark) body { background: var(--hz-bg); color: var(--hz-text); }

/* ---------- Connexion ---------- */
.login-container,
.oauth {
  background: linear-gradient(135deg, var(--hz-navy) 0%, var(--hz-primary) 60%, var(--hz-sky) 140%) !important;
}
.login-card,
.oauth .card {
  background: #fff !important;
  color: var(--hz-text) !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 50px rgba(22, 37, 63, .25) !important;
}
.login-card h1 { color: var(--hz-navy) !important; font-weight: 700; font-size: 20px !important; }
.login-logo {
  content: url("/branding/logo-heitz-system.png");
  width: 250px !important;
  height: 50px !important;
  object-fit: contain;
}
.login-card .el-form-item__label,
.oauth .card .info .el-form-item__label { color: var(--hz-text) !important; }
.login-card .el-input__wrapper {
  background: #fff !important;
  border: 1px solid var(--hz-line) !important;
}
.login-card .el-input input { color: var(--hz-text) !important; }
.login-button { font-weight: 600; letter-spacing: .3px; }

/* ---------- Barre laterale ---------- */
.scroll-sidebar,
.app-left { background-color: var(--hz-navy) !important; }
.app-left .el-menu,
.scroll-sidebar .el-menu {
  --el-menu-bg-color: #2A2D7D !important;
  --el-menu-hover-bg-color: #33378f !important;
  --el-menu-text-color: #dfe3f6 !important;
  --el-menu-active-color: #71CBF4 !important;
  background-color: var(--hz-navy) !important;
  border-right: none !important;
}
.app-left .el-menu-item.is-active {
  background-color: rgba(113, 203, 244, .12) !important;
  box-shadow: inset 3px 0 0 var(--hz-sky);
}

/* ---------- En-tete ---------- */
.app-header {
  background-color: #fff !important;
  color: var(--hz-text) !important;
  border-bottom: 1px solid var(--hz-line);
  box-shadow: 0 2px 8px rgba(22, 37, 63, .06);
}
.app-header .setting .title,
.app-header .ex-icon { color: var(--hz-text) !important; }
.header-logo .logo {
  content: url("/branding/favicon.svg");
  width: 26px !important;
  height: 36px !important;
  object-fit: contain;
}
.header-logo .title { color: var(--hz-navy); font-weight: 700; }

/* ---------- Contenu ---------- */
.el-card { border-radius: 12px !important; border-color: var(--hz-line) !important; }
.el-table th.el-table__cell {
  background-color: var(--hz-bg) !important;
  color: var(--hz-navy) !important;
  font-weight: 600;
}
.el-tag { border-radius: 6px; }
.header-tags .tag.el-tag--dark,
.header-tags .el-tag--primary.el-tag--dark { background-color: var(--hz-primary); border-color: var(--hz-primary); }