.lm-cab {
  --lm-cab-accent: #d10024;
  --lm-cab-dark: #15161d;
  --lm-cab-side: #1c1d24;
  --lm-cab-side-2: #22232c;
  --lm-cab-bar: #15161d;
  --lm-cab-bg: #eceff4;
  --lm-cab-surface: #fff;
  --lm-cab-surface-2: #f7f8fa;
  --lm-cab-text: #2b2d42;
  --lm-cab-text-soft: #555;
  --lm-cab-muted: #8d8fa3;
  --lm-cab-line: #e4e7ed;
  --lm-cab-accent-soft: #fff3f5;
  --lm-cab-ok: #00a65a;
  --lm-cab-info: #0e6dd6;
  --lm-cab-warn: #f39c12;
  min-height: 100vh;
  background: var(--lm-cab-bg);
  color: var(--lm-cab-text);
  font-family: Arial, sans-serif;
  font-size: 13px;
}

.lm-cab *,
.lm-cab *::before,
.lm-cab *::after {
  box-sizing: border-box;
}

.lm-cab-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 40;
  height: 50px;
  display: flex;
  align-items: stretch;
  background: var(--lm-cab-bar);
  color: #fff;
}

.lm-cab-brand {
  width: 230px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  background: #101118;
  flex-shrink: 0;
}

.lm-cab-brand span {
  color: var(--lm-cab-accent);
}

.lm-cab-bar-btn {
  position: relative;
  width: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.lm-cab-bar-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}

.lm-cab-bar-right {
  margin-left: auto;
  display: flex;
  align-items: stretch;
}

.lm-cab-drop {
  position: relative;
  display: flex;
  align-items: stretch;
}

.lm-cab-drop-panel {
  display: none;
  position: absolute;
  right: 0;
  top: 50px;
  width: 280px;
  background: var(--lm-cab-surface);
  color: var(--lm-cab-text);
  border: 1px solid var(--lm-cab-line);
  box-shadow: 0 8px 24px rgba(21, 22, 29, 0.12);
  z-index: 50;
}

.lm-cab-drop.open .lm-cab-drop-panel {
  display: block;
}

.lm-cab-drop-head {
  padding: 10px 12px;
  background: var(--lm-cab-surface-2);
  border-bottom: 1px solid var(--lm-cab-line);
  font-weight: 600;
}

.lm-cab-drop-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid var(--lm-cab-line);
  background: var(--lm-cab-surface);
  color: var(--lm-cab-text);
  text-decoration: none;
  cursor: pointer;
}

.lm-cab-drop-item:hover {
  background: var(--lm-cab-surface-2);
}

.lm-cab-user-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.lm-cab-user-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}

.lm-cab-ava {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--lm-cab-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
}

.lm-cab-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--lm-cab-accent);
  color: #fff;
  font-size: 10px;
  line-height: 16px;
  text-align: center;
}

.lm-cab-badge.info {
  background: var(--lm-cab-info);
}

.lm-cab-badge.ok {
  background: var(--lm-cab-ok);
}

.lm-cab-badge.warn {
  background: var(--lm-cab-warn);
}

.lm-cab-side {
  position: fixed;
  top: 50px;
  left: 0;
  bottom: 0;
  width: 230px;
  background: var(--lm-cab-side);
  color: #b8bac8;
  overflow: auto;
  z-index: 30;
  transition: width 0.2s ease, transform 0.2s ease;
}

.lm-cab-user {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  background: var(--lm-cab-side-2);
}

.lm-cab-user .lm-cab-ava {
  width: 40px;
  height: 40px;
  font-size: 16px;
}

.lm-cab-user strong {
  display: block;
  color: #fff;
  font-size: 13px;
}

.lm-cab-user small {
  color: var(--lm-cab-ok);
}

.lm-cab-search {
  display: flex;
  margin: 10px;
  border: 1px solid #2d2f3a;
  background: #14151c;
}

.lm-cab-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: #fff;
  padding: 7px 8px;
  outline: none;
}

.lm-cab-search button {
  width: 34px;
  border: 0;
  background: transparent;
  color: #b8bac8;
  cursor: pointer;
}

.lm-cab-nav-label {
  padding: 8px 12px 4px;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #6b6d7c;
}

.lm-cab-nav a,
.lm-cab-nav button.lm-cab-nav-parent {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  color: #d5d6de;
  text-decoration: none;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  font-size: 13px;
}

.lm-cab-nav a:hover,
.lm-cab-nav button.lm-cab-nav-parent:hover,
.lm-cab-nav a.on {
  background: #14151c;
  color: #fff;
}

.lm-cab-nav a.on {
  border-left: 3px solid var(--lm-cab-accent);
  padding-left: 9px;
}

.lm-cab-nav i {
  width: 18px;
  text-align: center;
}

.lm-cab-nav .lm-cab-tag {
  margin-left: auto;
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 8px;
  background: var(--lm-cab-accent);
  color: #fff;
}

.lm-cab-nav .lm-cab-tag.ok {
  background: var(--lm-cab-ok);
}

.lm-cab-nav .lm-cab-tag.warn {
  background: var(--lm-cab-warn);
}

.lm-cab-nav-sub a {
  padding-left: 40px;
  font-size: 12px;
}

.lm-cab-main {
  margin-left: 230px;
  margin-top: 50px;
  padding: 16px;
  min-height: calc(100vh - 50px);
  transition: margin-left 0.2s ease;
}

.lm-cab-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.lm-cab-title h1 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
}

.lm-cab-crumbs {
  color: var(--lm-cab-muted);
}

.lm-cab-crumbs a {
  color: var(--lm-cab-info);
  text-decoration: none;
}

.lm-cab-box {
  background: var(--lm-cab-surface);
  border: 1px solid var(--lm-cab-line);
  margin-bottom: 16px;
}

.lm-cab-box-h {
  padding: 10px 12px;
  border-bottom: 1px solid var(--lm-cab-line);
  font-weight: 700;
}

.lm-cab-box-b {
  padding: 12px;
}

.lm-cab-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}

.lm-cab-stat {
  flex: 1 1 180px;
  display: flex;
  min-height: 80px;
  color: #fff;
  overflow: hidden;
}

.lm-cab-stat i {
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  background: rgba(0, 0, 0, 0.12);
}

.lm-cab-stat div {
  padding: 12px;
}

.lm-cab-stat strong {
  display: block;
  font-size: 22px;
}

.lm-cab-stat.blue {
  background: var(--lm-cab-info);
}
.lm-cab-stat.red {
  background: var(--lm-cab-accent);
}
.lm-cab-stat.green {
  background: var(--lm-cab-ok);
}
.lm-cab-stat.yellow {
  background: var(--lm-cab-warn);
}

.lm-cab-grid-2 {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.lm-cab-grid-2 > * {
  flex: 1 1 320px;
  min-width: 0;
}

.lm-cab-field {
  display: block;
  margin-bottom: 12px;
}

.lm-cab-field span {
  display: block;
  margin-bottom: 4px;
  color: var(--lm-cab-text-soft);
}

.lm-cab-field input,
.lm-cab-field select,
.lm-cab-field textarea {
  width: 100%;
  border: 1px solid var(--lm-cab-line);
  padding: 8px 10px;
  color: var(--lm-cab-text);
  background: var(--lm-cab-surface);
  outline: none;
}

.lm-cab-field input:focus,
.lm-cab-field select:focus,
.lm-cab-field textarea:focus {
  border-color: var(--lm-cab-accent);
}

.lm-cab-btn {
  border: 0;
  background: var(--lm-cab-accent);
  color: #fff;
  padding: 8px 14px;
  cursor: pointer;
}

.lm-cab-btn.ghost {
  background: var(--lm-cab-surface);
  color: var(--lm-cab-text);
  border: 1px solid var(--lm-cab-line);
}

.lm-cab-muted {
  margin: 0 0 12px;
  color: var(--lm-cab-text-soft);
}

.lm-cab-grid-2 + .lm-cab-box {
  margin-top: 16px;
}

.lm-cab-oauth {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.lm-cab-oauth-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid var(--lm-cab-line);
  background: var(--lm-cab-surface);
  color: var(--lm-cab-text);
  cursor: pointer;
}

.lm-cab-oauth-btn.on,
.lm-cab-oauth-btn:disabled {
  cursor: default;
  opacity: 0.85;
}

.lm-cab-oauth-btn.yandex {
  border-color: #fc3f1d;
  background: #fc3f1d;
  color: #fff;
}

.lm-cab-oauth-btn.google {
  border-color: #ea4335;
  background: #ea4335;
  color: #fff;
}

.lm-cab-oauth-btn.facebook {
  border-color: #1877f2;
  background: #1877f2;
  color: #fff;
}

.lm-cab-oauth-btn.vk {
  border-color: #0077ff;
  background: #0077ff;
  color: #fff;
}

.lm-cab-progress {
  height: 8px;
  background: var(--lm-cab-surface-2);
  overflow: hidden;
}

.lm-cab-progress > span {
  display: block;
  height: 100%;
  background: var(--lm-cab-info);
}

.lm-cab-progress.red > span {
  background: var(--lm-cab-accent);
}
.lm-cab-progress.green > span {
  background: var(--lm-cab-ok);
}
.lm-cab-progress.yellow > span {
  background: var(--lm-cab-warn);
}

.lm-cab-rows {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--lm-cab-line);
}

.lm-cab-row {
  display: flex;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--lm-cab-line);
}

.lm-cab-row:last-child {
  border-bottom: 0;
}

.lm-cab-row.head {
  background: var(--lm-cab-surface-2);
  font-weight: 700;
}

.lm-cab-row > span {
  flex: 1;
  min-width: 0;
  word-break: break-word;
}

.lm-cab-cal {
  display: flex;
  flex-wrap: wrap;
}

.lm-cab-cal > span {
  width: 14.28%;
  padding: 10px 4px;
  text-align: center;
  border: 1px solid var(--lm-cab-line);
  margin: -1px 0 0 -1px;
}

.lm-cab-cal > span.head {
  background: var(--lm-cab-surface-2);
  font-weight: 700;
}

.lm-cab-cal > span.on {
  background: var(--lm-cab-accent-soft);
  color: var(--lm-cab-accent);
  font-weight: 700;
}

.lm-cab-alert {
  padding: 10px 12px;
  margin-bottom: 10px;
  border: 1px solid var(--lm-cab-line);
}

.lm-cab-alert.ok {
  background: #e8f7ee;
  border-color: #b7e4c7;
}
.lm-cab-alert.warn {
  background: #fff6e5;
  border-color: #f5d48a;
}
.lm-cab-alert.bad {
  background: #fdecee;
  border-color: #f5b5bd;
}
.lm-cab-alert.info {
  background: #e8f1fb;
  border-color: #b7d3f3;
}

.lm-cab-ctrl {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  width: 280px;
  background: #22232c;
  color: #d5d6de;
  z-index: 45;
  transform: translateX(100%);
  transition: transform 0.2s ease;
  overflow: auto;
}

.lm-cab-ctrl.open {
  transform: translateX(0);
}

.lm-cab-ctrl-h {
  display: flex;
  border-bottom: 1px solid #2d2f3a;
}

.lm-cab-ctrl-h button {
  flex: 1;
  border: 0;
  background: transparent;
  color: #d5d6de;
  padding: 12px;
  cursor: pointer;
}

.lm-cab-ctrl-h button.on {
  background: #15161d;
  color: #fff;
}

.lm-cab-ctrl-b {
  padding: 12px;
}

.lm-cab-ctrl label {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin-bottom: 10px;
}

/* --- Настройки интерфейса: выбор темы --- */

.lm-cab-set-label {
  margin: 0 0 8px;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #6b6d7c;
}

.lm-cab-theme {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
}

.lm-cab-set-sep {
  height: 1px;
  margin: 0 0 18px;
  background: #2d2f3a;
}

.lm-cab-theme button {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 8px;
  border: 1px solid #2d2f3a;
  background: #1c1d24;
  color: #d5d6de;
  cursor: pointer;
  font-size: 12px;
}

.lm-cab-theme button.on {
  border-color: var(--lm-cab-accent);
  background: #15161d;
  color: #fff;
}

/* --- Журнал входов --- */

.lm-cab-logins {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lm-cab-login {
  border: 1px solid #2d2f3a;
  background: #1c1d24;
  padding: 8px 10px;
}

.lm-cab-login-top {
  display: flex;
  align-items: center;
  gap: 6px;
}

.lm-cab-login-top i {
  width: 14px;
  text-align: center;
  color: var(--lm-cab-muted);
}

.lm-cab-login-top strong {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.lm-cab-login-now {
  margin-left: auto;
  flex-shrink: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--lm-cab-ok);
  animation: lm-cab-pulse 1.8s ease-out infinite;
}

@keyframes lm-cab-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 166, 90, 0.55);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(0, 166, 90, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(0, 166, 90, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lm-cab-login-now {
    animation: none;
  }
}

.lm-cab-login-meta {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  color: var(--lm-cab-muted);
}

.lm-cab.is-side-min .lm-cab-side {
  width: 50px;
}

.lm-cab.is-side-min .lm-cab-main {
  margin-left: 50px;
}

.lm-cab.is-side-min .lm-cab-brand {
  width: 50px;
  overflow: hidden;
}

.lm-cab.is-side-min .lm-cab-brand em,
.lm-cab.is-side-min .lm-cab-user strong,
.lm-cab.is-side-min .lm-cab-user small,
.lm-cab.is-side-min .lm-cab-search,
.lm-cab.is-side-min .lm-cab-nav-label,
.lm-cab.is-side-min .lm-cab-nav span,
.lm-cab.is-side-min .lm-cab-nav .lm-cab-tag,
.lm-cab.is-side-min .lm-cab-user-name {
  display: none;
}

.lm-cab-mask {
  display: none;
}

/* --- Тёмная тема кабинета (шапка и меню тёмные в обеих темах) --- */

.lm-cab[data-theme='dark'] {
  --lm-cab-bg: #1a1b22;
  --lm-cab-surface: #21222b;
  --lm-cab-surface-2: #282a35;
  --lm-cab-text: #e4e6ee;
  --lm-cab-text-soft: #a9abbb;
  --lm-cab-muted: #9294a6;
  --lm-cab-line: #333541;
  --lm-cab-accent-soft: #3a222a;
  --lm-cab-info: #4d9bf0;
}

.lm-cab[data-theme='dark'] .lm-cab-alert.ok {
  background: #14291d;
  border-color: #2c5a3d;
}

.lm-cab[data-theme='dark'] .lm-cab-alert.warn {
  background: #2e2617;
  border-color: #5f4c22;
}

.lm-cab[data-theme='dark'] .lm-cab-alert.bad {
  background: #2e1a1d;
  border-color: #61323a;
}

.lm-cab[data-theme='dark'] .lm-cab-alert.info {
  background: #172532;
  border-color: #2c4a66;
}

@media (max-width: 900px) {
  .lm-cab-brand {
    width: 50px;
  }
  .lm-cab-brand em {
    display: none;
  }
  .lm-cab-side {
    transform: translateX(-100%);
  }
  .lm-cab.is-side-open .lm-cab-side {
    transform: translateX(0);
    width: 230px;
  }
  .lm-cab-main {
    margin-left: 0;
  }
  .lm-cab.is-side-min .lm-cab-main {
    margin-left: 0;
  }
  .lm-cab-mask {
    display: none;
    position: fixed;
    inset: 50px 0 0 0;
    background: rgba(21, 22, 29, 0.45);
    z-index: 25;
  }
  .lm-cab.is-side-open .lm-cab-mask {
    display: block;
  }
  .lm-cab-user-btn span.name {
    display: none;
  }
}