:root {
  --aero-navy: #102b4e;
  --aero-blue: #2774ae;
  --aero-red: #c81e2b;
  --aero-ink: #172033;
  --aero-muted: #667085;
  --aero-line: #dbe3ee;
  --aero-surface: #ffffff;
  --aero-soft: #f4f7fb;
}

.admin-workspace-page {
  max-width: 1320px;
  color: var(--aero-ink);
}

.admin-workspace-hero {
  position: relative;
  isolation: isolate;
  min-height: 184px;
  padding: 32px 36px;
  overflow: hidden;
  border: 1px solid #183b62;
  border-radius: 20px;
  background: var(--aero-navy);
  box-shadow: 0 18px 40px #102b4e24;
}

.admin-workspace-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 360px;
  height: 360px;
  right: -100px;
  top: -150px;
  border: 1px solid #ffffff1c;
  border-radius: 50%;
  box-shadow: 0 0 0 28px #ffffff08, 0 0 0 56px #ffffff05;
}

.admin-workspace-hero h1 {
  max-width: 680px;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.08;
  letter-spacing: -0.04em;
}

.admin-workspace-hero p {
  max-width: 640px;
  color: #d8e7f6;
  font-size: 15px;
  line-height: 1.6;
}

.admin-kpis {
  gap: 14px;
  margin-bottom: 32px;
}

.admin-kpis .MuiCard-root {
  min-height: 118px;
  border: 1px solid var(--aero-line);
  border-radius: 16px;
  background: var(--aero-surface);
  box-shadow: 0 4px 14px #102b4e0b;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.admin-kpis .MuiCard-root:hover {
  transform: translateY(-2px);
  border-color: #9bb9d5;
  box-shadow: 0 10px 24px #102b4e18;
}

.admin-kpis .MuiCardContent {
  min-height: 118px;
  padding: 20px !important;
}

.admin-kpis strong {
  font-variant-numeric: tabular-nums;
  font-size: 32px;
  letter-spacing: -0.035em;
}

.admin-quick-actions {
  margin-top: 4px;
}

.admin-quick-actions h2 {
  margin-bottom: 16px;
  color: var(--aero-navy);
  font-size: 20px;
  letter-spacing: -0.02em;
}

.admin-quick-actions > div {
  gap: 14px;
}

.admin-quick-actions button {
  position: relative;
  min-height: 82px;
  padding: 16px 18px;
  border: 1px solid var(--aero-line);
  border-radius: 14px;
  color: var(--aero-navy);
  background: var(--aero-soft);
  font-weight: 750;
  text-align: left;
  transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.admin-quick-actions button:hover {
  transform: translateY(-2px);
  border-color: #9bb9d5;
  background: #edf5fc;
  box-shadow: 0 8px 18px #102b4e12;
}

.admin-quick-actions button:focus-visible,
.admin-kpis .MuiCard-root:focus-visible {
  outline: 3px solid #2774ae66;
  outline-offset: 3px;
}

.admin-state {
  min-height: 240px;
  color: var(--aero-muted);
  border: 1px dashed #b7c9dc;
  border-radius: 16px;
  background: #f8fbfe;
}

@media (max-width: 800px) {
  .admin-workspace-hero {
    min-height: 0;
    padding: 26px 24px;
  }
}

@media (max-width: 520px) {
  .admin-workspace-hero {
    border-radius: 16px;
    padding: 22px 20px;
  }

  .admin-workspace-hero h1 {
    font-size: 30px;
  }

  .admin-kpis .MuiCardContent {
    min-height: 104px;
    padding: 16px !important;
  }

  .admin-quick-actions button {
    min-height: 72px;
  }
}

/* Full admin workspace redesign */
.admin-redesign {
  max-width: 1320px;
  margin: 0 auto;
  color: var(--aero-ink);
}

.admin-redesign__hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  min-height: 220px;
  margin-bottom: 18px;
  padding: 34px 38px;
  border: 1px solid #183b62;
  border-radius: 22px;
  color: #fff;
  background: #102b4e;
  box-shadow: 0 18px 40px #102b4e24;
}

.admin-redesign__eyebrow,
.admin-redesign__section-label {
  display: block;
  color: #6b7d91;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.admin-redesign__eyebrow { color: #b9d6ee; }

.admin-redesign h1,
.admin-redesign h2,
.admin-redesign p { margin-top: 0; }

.admin-redesign h1 {
  max-width: 720px;
  margin-bottom: 12px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.04;
  letter-spacing: -.045em;
}

.admin-redesign__hero p {
  max-width: 670px;
  margin-bottom: 0;
  color: #d8e7f6;
  font-size: 15px;
  line-height: 1.65;
}

.admin-redesign__status {
  display: flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
}

.admin-redesign__status .MuiChip-root {
  color: #e8fff2;
  border: 1px solid #76c99566;
  background: #1f7a4d44;
}

.admin-redesign__status-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #54d38a;
  box-shadow: 0 0 0 5px #54d38a24;
}

.admin-redesign__summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin: 30px 2px 16px;
}

.admin-redesign__summary h2,
.admin-redesign__section-heading h2,
.admin-redesign__footer-panel h2 {
  margin: 6px 0 5px;
  color: var(--aero-navy);
  font-size: 21px;
  letter-spacing: -.025em;
}

.admin-redesign__summary p,
.admin-redesign__footer-panel p {
  margin-bottom: 0;
  color: var(--aero-muted);
  font-size: 13px;
  line-height: 1.55;
}

.admin-redesign__summary-mark {
  color: #c9d7e4;
  font-size: 34px;
  font-weight: 850;
  letter-spacing: .12em;
}

.admin-redesign__kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 34px;
}

.admin-redesign__kpi {
  min-height: 152px;
  border: 1px solid var(--aero-line) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 5px 16px #102b4e0d !important;
}

.admin-redesign__kpi .MuiCardContent-root { padding: 20px !important; }

.admin-redesign__kpi .MuiCardContent-root > div {
  display: grid;
  grid-template-columns: 38px 1fr;
  grid-template-areas: "icon label" "icon value" "icon caption";
  align-items: center;
  column-gap: 12px;
}

.admin-redesign__kpi-icon {
  grid-area: icon;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  color: #255ca8;
  background: #eaf2fb;
}

.admin-redesign__kpi-label { grid-area: label; color: #475467; font-size: 13px; font-weight: 700; }
.admin-redesign__kpi strong { grid-area: value; color: var(--aero-navy); font-size: 32px; line-height: 1.05; }
.admin-redesign__kpi small { grid-area: caption; color: #98a2b3; font-size: 11px; }
.admin-redesign__kpi--blue .admin-redesign__kpi-icon { color: #2774ae; background: #e7f3fc; }
.admin-redesign__kpi--navy .admin-redesign__kpi-icon { color: #102b4e; background: #e8eef5; }
.admin-redesign__kpi--alert { border-color: #edc7c9 !important; background: #fffafa !important; }
.admin-redesign__kpi--alert .admin-redesign__kpi-icon { color: var(--aero-red); background: #fff0f0; }
.admin-redesign__kpi--alert strong { color: var(--aero-red); }

.admin-redesign__section-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  margin: 0 2px 14px;
}

.admin-redesign__hint { color: #98a2b3; font-size: 12px; }

.admin-redesign__action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-redesign__action {
  display: grid !important;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 14px;
  min-height: 96px !important;
  padding: 16px 18px !important;
  border: 1px solid var(--aero-line) !important;
  border-radius: 15px !important;
  color: var(--aero-navy) !important;
  background: #f8fafc !important;
  text-align: left !important;
}

.admin-redesign__action:hover { border-color: #8caecc !important; background: #edf5fc !important; }
.admin-redesign__action-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; color: #255ca8; background: #e6f0fa; }
.admin-redesign__action-copy { display: grid; gap: 4px; }
.admin-redesign__action-copy strong { font-size: 14px; }
.admin-redesign__action-copy small { color: #667085; font-size: 12px; line-height: 1.4; }

.admin-redesign__footer-panel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: 30px;
  padding: 22px 24px;
  border: 1px solid #c9dced;
  border-radius: 16px;
  background: #f1f7fc;
}

.admin-redesign__footer-panel .MuiButton-root { min-height: 46px; white-space: nowrap; }
.admin-redesign__loading { min-height: 220px; display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--aero-muted); }

@media (max-width: 900px) {
  .admin-redesign__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .admin-redesign__hero, .admin-redesign__summary, .admin-redesign__footer-panel { display: block; }
  .admin-redesign__hero { padding: 26px 22px; }
  .admin-redesign__status { margin-top: 22px; }
  .admin-redesign__summary-mark { display: none; }
  .admin-redesign__action-grid, .admin-redesign__kpis { grid-template-columns: 1fr; }
  .admin-redesign__footer-panel .MuiButton-root { width: 100%; margin-top: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-kpis .MuiCard-root,
  .admin-quick-actions button {
    transition: none;
  }
}

/* Information hierarchy for the operations overview. */
.admin-workspace-hero p::after {
  content: "  •  Пользователи  •  Наряды  •  КИП  •  База знаний";
  display: inline;
  color: #b9d6ee;
}

.admin-kpis .MuiCardContent > span {
  display: block;
  min-height: 34px;
  color: #475467;
  font-size: 13px;
  line-height: 1.35;
}

.admin-kpis .MuiCardContent > span::after {
  display: block;
  margin-top: 3px;
  color: #98a2b3;
  font-size: 11px;
  font-weight: 500;
}

.admin-kpis .MuiCardContent > span:nth-of-type(1)::after {
  content: "Всего в системе";
}

.admin-kpis .MuiCardContent > span:nth-of-type(2)::after {
  content: "На выбранную дату";
}

.admin-kpis .MuiCardContent > span:nth-of-type(3)::after {
  content: "За текущий период";
}

.admin-kpis .MuiCardContent > span:nth-of-type(4)::after {
  content: "Нужна проверка";
}

.admin-kpis .MuiCard-root:nth-child(4) {
  border-color: #edc7c9;
  background: #fffafa;
}

.admin-kpis .MuiCard-root:nth-child(4) strong {
  color: var(--aero-red);
}

.admin-quick-actions::after {
  content: "Выберите раздел, чтобы перейти к управлению данными";
  display: block;
  margin-top: 12px;
  color: #98a2b3;
  font-size: 12px;
}

@media (max-width: 520px) {
  .admin-workspace-hero p::after {
    display: block;
    margin-top: 5px;
  }
}
