:root {
  /* Тёмная тема — чуть светлее базового «чистого» чёрного */
  --bg: #111820;
  --surface: #1a2332;
  --border: #334155;
  --text: #eef2f7;
  --muted: #94a3b8;
  --accent: #6eb8ff;
  --accent-dim: rgba(110, 184, 255, 0.14);
  --danger: #f87171;
  --warn: #fbbf24;
  --font: system-ui, "Segoe UI", Roboto, sans-serif;
  --login-glow: rgba(110, 184, 255, 0.42);
  --table-header-bg: #1e293b;
  --table-sticky-bg: #1c2738;
  --table-sticky-head-bg: #18212f;
  --badge-bg: #422006;
  --btn-primary: #335c8f;
  --btn-primary-border: #4a7ab8;
  --btn-primary-hover: #3d6aa3;
  --btn-danger-border: #6b3034;
  --hint-code: #c4d0dc;
  --weekday-pill-border: rgba(110, 184, 255, 0.28);
  --login-card-bg: linear-gradient(145deg, rgba(32, 42, 58, 0.95) 0%, rgba(22, 30, 44, 0.92) 100%);
  --login-card-border: rgba(255, 255, 255, 0.1);
  --login-card-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
  --login-tabs-bg: rgba(0, 0, 0, 0.22);
  --login-tabs-border: rgba(255, 255, 255, 0.08);
  --login-input-bg: rgba(0, 0, 0, 0.22);
  --login-input-border: rgba(255, 255, 255, 0.1);
  --login-input-border-hover: rgba(255, 255, 255, 0.16);
  --login-select-option-bg: #1e293b;
  --login-tab-active-text: #fff;
  --login-tab-active-bg: rgba(255, 255, 255, 0.12);
  --login-hint-border: rgba(255, 255, 255, 0.08);
  --login-hint-code-bg: rgba(255, 255, 255, 0.08);
  --login-hint-code: #c5d9f5;
  --shadow-sticky: 4px 0 10px rgba(0, 0, 0, 0.18);
  --class-pill-ok-bg: rgba(34, 197, 94, 0.2);
  --class-pill-ok-text: #bbf7d0;
  --class-pill-ok-border: rgba(34, 197, 94, 0.5);
  --class-pill-warn-bg: rgba(234, 179, 8, 0.22);
  --class-pill-warn-text: #fef9c3;
  --class-pill-warn-border: rgba(234, 179, 8, 0.55);
  /* Совмещение подгрупп: жёлтое выделение, красный шрифт */
  --merge-coverage-bg: rgba(250, 204, 21, 0.28);
  --merge-coverage-border: rgba(234, 179, 8, 0.65);
  --merge-coverage-text: #dc2626;
}

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

body {
  margin: 0;
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.45;
}

.hidden {
  display: none !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.login-wrap {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  padding: clamp(1rem, 4vw, 2rem);
  overflow: hidden;
}

.login-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(1200px 600px at 50% -20%, rgba(100, 160, 255, 0.18), transparent 55%),
    radial-gradient(800px 400px at 100% 50%, rgba(130, 100, 210, 0.1), transparent 50%),
    radial-gradient(600px 400px at 0% 80%, rgba(50, 190, 170, 0.07), transparent 45%),
    linear-gradient(165deg, #151d2a 0%, #111820 42%, #182232 100%);
  pointer-events: none;
}

.login-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  opacity: 0.6;
}

/* «Назад» над карточкой — та же ширина, что и у .login-card */
.login-wrap > .login-back {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 480px;
  margin: 0;
  padding: 0 0.15rem;
  box-sizing: border-box;
  text-align: left;
}

.login-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 480px;
  padding: clamp(1.5rem, 4vw, 2rem);
  border-radius: 20px;
  background: var(--login-card-bg);
  border: 1px solid var(--login-card-border);
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.35) inset,
    var(--login-card-shadow),
    0 0 80px rgba(80, 140, 255, 0.06);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.login-brand {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-bottom: 1.5rem;
}

.login-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  font-size: 1.35rem;
  font-weight: 650;
  color: #fff;
  background: linear-gradient(135deg, #4d8fff 0%, #6366f1 50%, #7c3aed 100%);
  box-shadow: 0 8px 24px rgba(91, 124, 255, 0.35);
}

.login-logo-image {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  object-fit: contain;
  box-shadow: 0 8px 24px rgba(91, 124, 255, 0.3);
}

.login-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.25;
  max-width: 22rem;
}

.login-subtitle {
  margin: 0.4rem 0 0;
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--muted);
  line-height: 1.35;
}

.login-subtitle-auth {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 650;
  color: var(--text);
  line-height: 1.25;
}

.login-lead {
  margin: 0.15rem 0 0;
  color: var(--muted);
  font-size: 0.875rem;
}

.login-tabs {
  display: flex;
  gap: 0.25rem;
  margin-bottom: 1.35rem;
  padding: 0.2rem;
  border-radius: 12px;
  background: var(--login-tabs-bg);
  border: 1px solid var(--login-tabs-border);
}

.login-tab {
  flex: 1;
  min-width: 0;
  padding: 0.55rem 0.4rem;
  border-radius: 9px;
  border: none;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.login-tab:hover {
  color: var(--text);
}

.login-tab.active {
  color: var(--login-tab-active-text);
  background: var(--login-tab-active-bg);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.login-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-bottom: 0.75rem;
}

.login-label {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.login-input {
  width: 100%;
  padding: 0.65rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--login-input-border);
  background: var(--login-input-bg);
  color: var(--text);
  font: inherit;
  font-size: 0.95rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.login-input:hover {
  border-color: var(--login-input-border-hover);
}

.login-input:focus {
  outline: none;
  border-color: var(--login-glow);
  box-shadow: 0 0 0 3px var(--accent-dim);
}

.login-input::placeholder {
  color: rgba(139, 152, 168, 0.55);
}

/* Выпадающие списки на экране входа: фон и option согласованы с карточкой */
select.login-input.login-select {
  cursor: pointer;
  color-scheme: dark;
  background-color: var(--login-input-bg);
  color: var(--text);
}

select.login-input.login-select option {
  background-color: var(--login-select-option-bg);
  color: var(--text);
  padding: 0.35rem 0.5rem;
}

.login-check.login-show-parallels {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: -0.35rem 0 0.85rem;
  font-size: 0.82rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}

.login-check.login-show-parallels input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
  cursor: pointer;
}

.login-submit {
  margin-top: 0.35rem;
  width: 100%;
  padding: 0.62rem 0.75rem;
  border: none;
  border-radius: 11px;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  background: linear-gradient(135deg, #3b82f6 0%, #6366f1 55%, #7c3aed 100%);
  box-shadow: 0 4px 16px rgba(79, 110, 255, 0.35);
  transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
}

.login-submit:hover {
  filter: brightness(1.06);
  box-shadow: 0 6px 22px rgba(79, 110, 255, 0.42);
}

.login-submit:active {
  transform: scale(0.99);
}

.login-sync-hint {
  color: var(--muted);
  font-size: 0.875rem;
  line-height: 1.4;
  margin: 0.65rem 0 0;
}

.login-error {
  min-height: 1.25rem;
  color: var(--danger);
  font-size: 0.875rem;
  margin: 0.65rem 0 0;
}

.login-hint {
  margin: 1.15rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--login-hint-border);
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.5;
}

.login-hint code {
  padding: 0.1rem 0.35rem;
  border-radius: 5px;
  background: var(--login-hint-code-bg);
  color: var(--login-hint-code);
  font-size: 0.88em;
}

.login-tabs--hidden {
  display: none;
}

.login-back {
  margin: 0 0 0.75rem;
  font-size: 0.88rem;
}

.login-back-link {
  color: var(--accent);
  text-decoration: none;
}

.login-back-link:hover {
  text-decoration: underline;
}

/* Публичная главная — index.html; вход учителя — иконка в шапке; служебный вход — zmn-panel-7f4b9k2.html (см. .htaccess). */
.portal-wrap {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 3vw, 1.25rem);
  overflow: hidden;
}

.portal-bg {
  position: absolute;
  inset: 0;
}

.portal-shell {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 28rem;
  padding: clamp(1rem, 2.8vw, 1.35rem) clamp(0.85rem, 2.5vw, 1.15rem);
  border-radius: 18px;
  background: linear-gradient(
    150deg,
    rgba(22, 30, 44, 0.78) 0%,
    rgba(14, 20, 32, 0.62) 100%
  );
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.4) inset,
    0 20px 48px rgba(0, 0, 0, 0.38),
    0 0 80px rgba(80, 140, 255, 0.06);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.portal-inner {
  width: 100%;
}

.portal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.portal-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-width: 0;
  flex: 1;
}

.portal-logo-mark,
.portal-logo-image {
  flex-shrink: 0;
  width: 2.35rem;
  height: 2.35rem;
}

.portal-logo-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 1.15rem;
  font-weight: 750;
  color: #fff;
  background: linear-gradient(135deg, #4d8fff 0%, #6366f1 50%, #7c3aed 100%);
  box-shadow:
    0 8px 22px rgba(91, 124, 255, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.1) inset;
  letter-spacing: -0.03em;
}

.portal-logo-image {
  object-fit: cover;
  border-radius: 10px;
  box-shadow:
    0 8px 22px rgba(91, 124, 255, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
}

.portal-title {
  margin: 0;
  font-size: clamp(1.05rem, 3vw, 1.28rem);
  font-weight: 750;
  letter-spacing: -0.035em;
  line-height: 1.2;
  text-align: center;
}

.portal-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.45rem;
}

@media (min-width: 520px) {
  .portal-cards {
    grid-template-columns: repeat(2, minmax(0, 10.2rem));
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    gap: 0.55rem;
  }
}

.portal-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.55rem;
  padding: 0.5rem 0.55rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(0, 0, 0, 0.2);
  text-decoration: none;
  color: inherit;
  text-align: left;
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

@media (min-width: 520px) {
  .portal-card {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    gap: 0.55rem;
    padding: 0.62rem 0.7rem;
    min-height: 3.5rem;
    border-radius: 12px;
    width: 100%;
    max-width: 10.2rem;
    box-sizing: border-box;
  }

  .portal-card-chevron {
    display: flex;
  }
}

.portal-card:hover {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
  transform: translateY(-1px);
}

.portal-card:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.portal-card-icon-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 10px;
  color: #fff;
}

@media (min-width: 520px) {
  .portal-card-icon-wrap {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 10px;
  }

  .portal-card-icon {
    width: 20px;
    height: 20px;
  }
}

.portal-card--admin .portal-card-icon-wrap {
  background: linear-gradient(145deg, rgba(110, 184, 255, 0.38), rgba(99, 102, 241, 0.26));
  box-shadow: 0 0 0 1px rgba(110, 184, 255, 0.22);
}

.portal-card--teacher .portal-card-icon-wrap {
  background: linear-gradient(145deg, rgba(34, 197, 94, 0.42), rgba(16, 185, 129, 0.24));
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.26);
}

.portal-card--student .portal-card-icon-wrap {
  background: linear-gradient(145deg, rgba(167, 139, 250, 0.48), rgba(139, 92, 246, 0.24));
  box-shadow: 0 0 0 1px rgba(167, 139, 250, 0.28);
}

.portal-card-title {
  flex: 1;
  min-width: 0;
  font-weight: 700;
  font-size: 0.92rem;
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.25;
}

@media (min-width: 520px) {
  .portal-card-title {
    flex: 1;
    font-size: 0.9rem;
    line-height: 1.2;
    word-wrap: normal;
  }
}

.portal-card-chevron {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  color: var(--muted);
  opacity: 0.5;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.portal-card:hover .portal-card-chevron {
  opacity: 0.95;
  transform: translateX(2px);
}

.portal-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.portal-logo-center-wrap {
  display: flex;
  justify-content: center;
  margin: 0.25rem 0 0.8rem;
}

.portal-logo-center-image {
  width: clamp(13.2rem, 60vw, 19.2rem);
  height: clamp(8.8rem, 40vw, 12.8rem);
  object-fit: contain;
  border-radius: 16px;
  box-shadow:
    0 12px 26px rgba(91, 124, 255, 0.3),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
}

.home-public-lead {
  margin: 0.85rem 0 0 0;
  text-align: center;
  font-size: 0.98rem;
  line-height: 1.55;
  color: var(--muted);
}

/* --- Главная index.html: «Старт» и блок «сейчас» --- */
.home-splash {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0.25rem 0 1rem;
}

.home-splash-logo {
  margin-top: 0.5rem;
  margin-bottom: 0.35rem;
}

.home-splash-title {
  margin: 0.35rem 0 0.65rem;
  max-width: 34rem;
  font-size: clamp(1.02rem, 2.8vw, 1.22rem);
  line-height: 1.35;
}

.home-splash-lead {
  margin: 0 0 1.35rem;
  max-width: 30rem;
}

.home-splash-actions {
  display: flex;
  justify-content: center;
}

.home-start-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-width: 11rem;
  padding: 0.72rem 1.45rem 0.72rem 1.15rem;
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.15s ease;
}

.home-start-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(110, 184, 255, 0.45);
  box-shadow: 0 0 0 1px rgba(110, 184, 255, 0.12), 0 8px 28px rgba(0, 0, 0, 0.2);
}

.home-start-btn:focus-visible {
  outline: 2px solid var(--accent, #6eb8ff);
  outline-offset: 3px;
}

.home-start-btn:active {
  transform: scale(0.98);
}

.home-start-btn__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: rgba(110, 184, 255, 0.14);
  color: var(--accent, #8ec8ff);
}

.home-start-btn:hover .home-start-btn__icon {
  background: rgba(110, 184, 255, 0.22);
  color: #b8dcff;
}

.home-start-btn__label {
  line-height: 1;
}

html.home-main-is-open body {
  overflow: hidden;
}

.home-main-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
}

.home-main-fs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.home-main-fs-layout {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.home-main-topbar {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: calc(0.55rem + env(safe-area-inset-top, 0px)) calc(0.65rem + env(safe-area-inset-right, 0px)) 0.55rem
    calc(0.65rem + env(safe-area-inset-left, 0px));
}

.home-main-topbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.home-main-topbar-actions .btn.portal-theme {
  min-width: 2.75rem;
  min-height: 2.75rem;
  border-radius: 10px;
  font-size: 1.12rem;
}

.home-main-topbar-actions .portal-header-auth-glyph--lock {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  line-height: 1;
}

.home-main-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding: 0.35rem clamp(1rem, 4vw, 2.5rem) calc(1.25rem + env(safe-area-inset-bottom, 0px));
}

.home-main-page-title {
  margin: 0.15rem 0 1rem;
  text-align: center;
  font-size: clamp(1.05rem, 3vw, 1.28rem);
  font-weight: 750;
  letter-spacing: -0.035em;
  line-height: 1.2;
}

.home-main-logo-wrap {
  display: flex;
  justify-content: center;
  margin: 0.2rem 0 0.75rem;
}

.home-main-logo-image {
  width: min(100%, 300px);
  height: auto;
  object-fit: contain;
}

.home-main-footnote {
  margin-top: 1.35rem;
  text-align: center;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

.home-live-section {
  margin-top: 0;
  padding: 1rem 1rem 1.1rem;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.18);
  text-align: left;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.home-live-heading {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}

.home-live-status {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.home-live-meta {
  margin: 0;
  font-size: 0.92rem;
  color: var(--muted);
  line-height: 1.45;
}

.home-live-lead {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.55;
  text-align: center;
}

.home-live-hint {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
}

.home-live-shift {
  margin-top: 0.4rem;
}

.home-live-shift-title {
  margin: 0.35rem 0 0.5rem;
  font-size: 1rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}

.home-live-columns {
  display: grid;
  gap: 0.6rem;
}

.home-live-columns--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-live-columns--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-live-columns--parallel {
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
}

.home-live-columns--first-shift-paired {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  width: 100%;
}

.home-live-col-stack {
  display: grid;
  gap: 0.6rem;
}

.home-live-col-card {
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  overflow: hidden;
}

.home-live-col-title {
  margin: 0;
  padding: 0.52rem 0.6rem;
  font-size: 0.9rem;
  font-weight: 700;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  background: color-mix(in srgb, var(--table-header-bg) 76%, transparent);
}

.home-live-col-wrap {
  max-height: 42vh;
  overflow: auto;
}

.home-live-col-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 0.84rem;
}

.home-live-col-table th,
.home-live-col-table td {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
  padding: 0.34rem 0.45rem;
  min-height: 3.4em;
  height: 3.4em;
  line-height: 1.35;
  text-align: center;
  vertical-align: middle;
}

.home-live-col-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: center;
  vertical-align: middle;
  background: color-mix(in srgb, var(--table-header-bg) 88%, transparent);
}

.home-live-col-table tr:last-child td {
  border-bottom: none;
}

.home-live-class-col {
  width: 22%;
  white-space: normal;
  font-weight: 700;
}

.home-live-col-table th:nth-child(2),
.home-live-col-table th:nth-child(3),
.home-live-col-table td:nth-child(2),
.home-live-col-table td:nth-child(3) {
  width: 39%;
}

.home-live-col-table tbody td:nth-child(2) {
  color: #16a34a;
  font-weight: 400;
}

@media (max-width: 1080px) {
  .home-live-columns--3 {
    grid-template-columns: 1fr;
  }
  .home-live-columns--2 {
    grid-template-columns: 1fr;
  }
  .home-live-columns--parallel {
    grid-template-columns: 1fr;
  }
  .home-live-columns--first-shift-paired {
    grid-template-columns: 1fr;
  }
}

.btn.portal-theme {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
  min-height: 3.5rem;
  padding: 0;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.22);
  font-size: 1.45rem;
  line-height: 1;
}

.btn.portal-theme:hover {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
}

a.portal-header-auth-link {
  text-decoration: none;
  color: inherit;
}

.portal-header-auth-glyph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.portal-header-auth-icon {
  display: block;
}

a.portal-header-auth-link--teacher {
  background: linear-gradient(145deg, rgba(34, 197, 94, 0.28), rgba(16, 185, 129, 0.12));
  border-color: rgba(34, 197, 94, 0.22);
}

a.portal-header-auth-link--teacher:hover {
  border-color: rgba(34, 197, 94, 0.35);
  background: linear-gradient(145deg, rgba(34, 197, 94, 0.38), rgba(16, 185, 129, 0.18));
}

.top-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
}

.top-row-left {
  grid-column: 1;
  justify-self: start;
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  min-width: 0;
  max-width: 100%;
}

.top-row .top-global-date-wrap.top-row-working-date {
  margin-left: 0;
  min-width: 0;
  max-width: 100%;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.45rem;
  text-align: left;
}

.top-row-working-date__label {
  flex-shrink: 0;
  white-space: nowrap;
  line-height: 1.2;
}

.top-row .top-global-date-wrap.top-row-working-date .toolbar-date-row {
  justify-content: flex-start;
  flex-wrap: nowrap;
  min-width: 0;
}

.top-row .top-global-date-wrap.top-row-working-date .top-global-weekday-wrap {
  align-items: center;
}

.top-row .app-top-logo-wrap {
  grid-column: 2;
  justify-self: center;
}

.top-row .userbar {
  grid-column: 3;
  justify-self: end;
  align-self: center;
}

.top-row-mode-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
}

.top-row-mode-buttons .top-row-archive-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.45rem;
}

.top-row-mode-buttons .top-row-archive-actions.hidden {
  display: none !important;
}

.top-row-mode-buttons .top-row-archive-day-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  padding-left: 0.45rem;
  margin-left: 0.15rem;
  border-left: 1px solid var(--border-2, rgba(255, 255, 255, 0.12));
}

.top-row-mode-buttons .top-row-mode-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.55rem;
  height: 2.55rem;
  min-width: 2.55rem;
  padding: 0;
  border-radius: 9px;
  line-height: 0;
}

.top-row-mode-buttons .top-row-mode-btn .btn-icon-square-glyph,
.top-row-mode-buttons .top-row-mode-btn .btn-journals-icon,
.top-row-mode-buttons .top-row-mode-btn .btn-settings-icon {
  display: block;
  font-size: 1.45rem;
  line-height: 1;
}

@media (hover: hover) and (pointer: fine) {
  .top-row-mode-buttons .top-row-mode-btn.btn-journals:hover,
  .top-row-mode-buttons .top-row-mode-btn.btn-settings:hover {
    color: var(--accent);
    border-color: rgba(110, 184, 255, 0.45);
    background: var(--accent-dim);
  }
}

.top-row-mode-buttons .top-row-mode-btn.is-active {
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: var(--accent-dim);
}

.top-row-mode-buttons .top-row-mode-btn.btn-journals.active,
.top-row-mode-buttons .top-row-mode-btn.btn-settings.active {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
  box-shadow: 0 0 0 1px rgba(110, 184, 255, 0.2);
}

.top-global-date-wrap {
  margin-left: 0.5rem;
  min-width: 16rem;
}

.top-global-date-wrap .toolbar-date-row {
  flex-wrap: nowrap;
  align-items: center;
}

.top-global-date-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: 0.25rem;
  flex-shrink: 0;
}

.top-global-date-actions .btn-icon-square {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  min-width: 2.15rem;
  padding: 0;
  border-radius: 8px;
  line-height: 0;
}

.top-global-date-actions .btn-icon-square-glyph {
  display: block;
  flex-shrink: 0;
}

.top-publish-progress {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.18rem;
  margin-left: 0.2rem;
  min-width: 8.6rem;
}

.top-publish-progress__label {
  font-size: 0.72rem;
  color: var(--muted);
  line-height: 1.1;
  white-space: nowrap;
}

.top-publish-progress__track {
  width: 100%;
  height: 0.33rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 75%, transparent);
  overflow: hidden;
}

.top-publish-progress__bar {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 65%, #a78bfa));
  transition: width 180ms ease;
}

.top-header-progress-row {
  display: flex;
  width: 100%;
  margin-top: 0.2rem;
  padding-left: 0.2rem;
}

.top-header-progress-row .top-publish-progress {
  margin-left: 0;
  min-width: 14rem;
}

.top-global-weekday-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
}

.top-global-weekday-title {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.1;
}

.userbar {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.35rem;
}

.userbar-top {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.userbar-top .btn-icon-square {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  min-width: 2.15rem;
  padding: 0;
  border-radius: 8px;
  line-height: 0;
}

.userbar-top .btn-icon-square.is-active {
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: var(--accent-dim);
}

.userbar-meta {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
}

.userbar-logout-row {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  margin-left: auto;
  flex-wrap: wrap;
  max-width: 100%;
}

.userbar-logout-row .user-badge {
  text-align: right;
  max-width: min(22rem, 56vw);
}

.userbar-meta--quicklinks {
  width: 100%;
  justify-content: flex-end;
}

.userbar-meta--quicklinks .top-row-mode-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.55rem;
  height: 2.55rem;
  min-width: 2.55rem;
  padding: 0;
  border-radius: 9px;
  line-height: 0;
}

.userbar-meta--quicklinks .top-row-mode-btn .btn-icon-square-glyph {
  display: block;
  font-size: 1.45rem;
  line-height: 1;
}

.userbar-public-parallels {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  margin-top: 0.15rem;
}

.userbar-public-parallels .userbar-parallel-btn {
  width: auto;
  min-width: 1.28rem;
  height: 1.28rem;
  padding: 0 0.18rem;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: -0.02em;
  line-height: 1;
  border-radius: 6px;
}

.userbar-logout-row .btn-logout.top-row-mode-btn {
  width: 2.55rem;
  height: 2.55rem;
  min-width: 2.55rem;
}

.userbar-logout-row .btn-logout .btn-logout-glyph {
  display: block;
  font-size: 1.45rem;
  line-height: 1;
}

.userbar-divider {
  width: 1px;
  height: 1.3rem;
  background: var(--line);
  opacity: 0.8;
}

.userbar-bell-wrap {
  position: relative;
}

.btn-bell {
  position: relative;
}

/* Учитель: показать/скрыть колонку «По основному расписанию» (рядом с колокольчиком) */
.btn-teacher-main-col-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  min-width: 2.15rem;
}

.btn-teacher-main-col-toggle .btn-teacher-main-col-icon {
  display: block;
  flex-shrink: 0;
}

.btn-teacher-main-col-toggle:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.btn-teacher-main-col-toggle.btn-teacher-main-col--active {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
  background: color-mix(in srgb, var(--accent-dim) 40%, var(--surface));
}

.teacher-subs-bell-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 4px;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1.1rem;
  text-align: center;
  background: var(--danger);
  color: #fff;
  box-shadow: 0 0 0 2px var(--bg);
}

.teacher-subs-bell-badge.hidden {
  display: none !important;
}

.teacher-subs-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 200;
  width: min(26rem, calc(100vw - 2rem));
  max-height: min(70vh, 28rem);
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}

.teacher-subs-popover-body {
  overflow: auto;
  padding: 0.65rem 0.75rem 0.85rem;
  font-size: 0.86rem;
}

.teacher-subs-popover-body .sheet {
  margin: 0;
  font-size: 0.82rem;
}

.teacher-subs-popover-body .sheet th,
.teacher-subs-popover-body .sheet td {
  padding: 0.35rem 0.5rem;
}

.teacher-subs-popover-row {
  cursor: pointer;
}

.teacher-subs-popover-row--unread {
  font-weight: 650;
  box-shadow: inset 3px 0 0 var(--accent);
}

.teacher-subs-popover-row:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.teacher-subs-popover-actions {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}

.user-badge {
  font-size: 0.88rem;
  color: var(--accent);
  max-width: 420px;
  text-align: right;
  line-height: 1.2;
}

.user-badge__inner--admin {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.user-badge__inner--admin .user-badge__text {
  line-height: 1.25;
}

.user-badge__inner--admin .user-badge__role-prefix {
  font-size: 1rem;
  line-height: 1;
}

.user-badge__mode-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.65rem;
  height: 2.65rem;
  min-width: 2.65rem;
  flex-shrink: 0;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--border));
  background: color-mix(in srgb, var(--accent-dim) 88%, var(--surface));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
  line-height: 0;
}

.user-badge__mode-glyph {
  display: block;
  font-size: 1.58rem;
  line-height: 1;
}

.small-block {
  margin: 0 0 0.75rem;
}

.admin-forms {
  margin-bottom: 1.5rem;
}

/* Настройки: боковое меню + секции */
.admin-layout {
  display: flex;
  gap: 1.75rem;
  align-items: flex-start;
}

.admin-sidebar {
  flex: 0 0 15.5rem;
  position: sticky;
  top: 0.75rem;
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
}

.admin-sidebar-title {
  margin: 0 0 0.2rem;
  font-size: 0.95rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--text);
}

.admin-sidebar-sub {
  margin: 0 0 0.85rem;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}

.admin-sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.admin-nav-link {
  display: block;
  padding: 0.55rem 0.75rem;
  border-radius: 10px;
  text-decoration: none;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.35;
  border: 1px solid transparent;
  transition:
    color 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease;
}

@media (hover: hover) and (pointer: fine) {
  .admin-nav-link:hover {
    color: var(--text);
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.06);
  }
}

.admin-nav-link.active {
  color: var(--accent);
  background: var(--accent-dim);
  border-color: rgba(110, 184, 255, 0.28);
}

.admin-nav-group-title {
  margin: 0.35rem 0 0.1rem;
  padding: 0.15rem 0.6rem;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.subject-directory-toolbar {
  align-items: flex-end;
  gap: 0.6rem 0.9rem;
}

.subject-directory-table th:last-child,
.subject-directory-table td:last-child {
  width: 8.5rem;
  text-align: center;
}

.admin-section-admins h3 {
  font-size: 1.05rem;
  font-weight: 650;
  margin: 1rem 0 0.5rem;
}

/* Две колонки: смена пароля | другие администраторы и таблица */
.admin-accounts-layout {
  display: grid;
  /* 1/3 — смена пароля, 2/3 — другие администраторы и таблица */
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 1.5rem 2.25rem;
  align-items: start;
  margin-top: 0.75rem;
}

.admin-accounts-layout__col {
  min-width: 0;
}

.admin-accounts-layout .admin-password-change > h3:first-child,
.admin-accounts-layout #adminPrimaryOnlyBlock > h3:first-child {
  margin-top: 0;
}

.admin-accounts-add-toolbar {
  margin-top: 0.75rem;
}

.admin-accounts-table-wrap {
  margin-top: 1rem;
}

.admin-accounts-layout:has(#adminPrimaryOnlyBlock.hidden) {
  grid-template-columns: 1fr;
}

.admin-accounts-layout__col--registry:has(#adminPrimaryOnlyBlock.hidden) {
  display: none;
}

@media (max-width: 56rem) {
  .admin-accounts-layout:not(:has(#adminPrimaryOnlyBlock.hidden)) {
    grid-template-columns: 1fr;
  }
}

.admin-accounts-actions {
  white-space: normal;
  vertical-align: middle;
  text-align: center;
}

.admin-accounts-actions .login-input {
  margin: 0 0.35rem 0.35rem 0;
  vertical-align: middle;
}

.admin-layout-main {
  flex: 1;
  min-width: 0;
}

/* В основном приложении вкладка «Журналы» вынесена в /journals/ */
body:not(.journals-panel-app) #panelJournals {
  display: none !important;
}

/* Настройки и журналы: узкая боковая «рейка» с иконками */
#panelAdmin .admin-layout,
#panelJournals .journals-layout {
  gap: 1.05rem;
}

#panelAdmin .admin-layout > .admin-sidebar--settings-icons,
#panelJournals:not(.journals-teacher-mode) .journals-layout > .admin-sidebar--journals-icons {
  flex: 0 0 3.45rem;
  width: 3.45rem;
}

#panelAdmin .admin-sidebar--settings-icons .settings-sidebar-nav,
#panelJournals .admin-sidebar--journals-icons .journals-sidebar-nav {
  gap: 0.32rem;
}

#panelAdmin .settings-sidebar-nav .admin-nav-link--icon,
#panelJournals .journals-sidebar-nav .admin-nav-link--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem;
  min-height: 2.55rem;
  width: 100%;
  box-sizing: border-box;
  line-height: 0;
}

#panelAdmin .settings-sidebar-nav .admin-nav-icon,
#panelJournals .journals-sidebar-nav .admin-nav-icon {
  display: block;
  width: 1.42rem;
  height: 1.42rem;
  flex-shrink: 0;
}

#panelJournals.journals-teacher-mode .journals-sidebar {
  display: none;
}

/* Учитель: журнал учёта — блоки друг за другом */
.teacher-worktime-period-toolbar {
  margin-bottom: 0.75rem;
}

.teacher-worktime-stack {
  display: flex;
  flex-direction: column;
  gap: 2.25rem;
}

.teacher-worktime-block {
  scroll-margin-top: 0.75rem;
}

.teacher-worktime-section-title {
  font-size: 1.05rem;
  margin: 0 0 0.75rem;
  font-weight: 600;
}

.admin-section {
  scroll-margin-top: 0.75rem;
  margin-bottom: 2.75rem;
  padding-bottom: 0.25rem;
}

.admin-section:last-child {
  margin-bottom: 0;
}

.admin-section h2 {
  margin-top: 0;
}

@media (max-width: 52rem) {
  .admin-layout {
    flex-direction: column;
    gap: 1rem;
  }

  .admin-sidebar {
    flex: none;
    width: 100%;
    max-height: none;
    position: relative;
    top: auto;
  }

  .admin-sidebar-nav {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .admin-nav-link {
    flex: 1 1 auto;
    min-width: min(100%, 12rem);
  }

  /* Настройки и журналы: иконки в переносимый ряд */
  #panelAdmin .admin-layout > .admin-sidebar--settings-icons,
  #panelJournals .journals-layout > .admin-sidebar--journals-icons {
    flex: none;
    width: 100%;
  }

  #panelAdmin .settings-sidebar-nav,
  #panelJournals .journals-sidebar-nav {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }

  #panelAdmin .settings-sidebar-nav .admin-nav-link--icon,
  #panelJournals .journals-sidebar-nav .admin-nav-link--icon {
    flex: 0 0 auto;
    width: auto;
    min-width: 2.65rem;
  }
}

.teacher-toolbar {
  align-items: stretch;
  flex-wrap: wrap;
  gap: 0.5rem 0.65rem;
}

.teacher-toolbar-telegram-day {
  flex: 1 1 14rem;
  min-width: min(12rem, 100%);
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  align-self: center;
}

.teacher-toolbar-telegram-day-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.2;
}

.teacher-toolbar-telegram-day-input {
  width: 100%;
  min-height: 2.5rem;
  max-height: 5rem;
  resize: vertical;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.82rem;
  line-height: 1.35;
}

.teacher-toolbar-telegram-day-input:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 45%, transparent);
  outline-offset: 1px;
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
}

#panelTeachers.teacher-edit-active .teacher-toolbar {
  align-items: flex-start;
}

.teacher-toolbar .btn-icon-square {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  min-width: 2.2rem;
  padding: 0;
  border-radius: 8px;
  line-height: 0;
}

.teacher-toolbar .btn-icon-square-glyph {
  display: block;
}

.teacher-toolbar .btn-icon-square.is-active {
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: var(--accent-dim);
}

/* «Составление замен»: классы с проблемами расписания — в одной строке с кнопками, справа */
.teacher-toolbar-schedule-issues {
  margin-left: auto;
  flex: 0 1 auto;
  align-self: center;
  max-width: min(48rem, 100%);
}

.teacher-toolbar-schedule-issues-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.35rem;
  text-align: right;
}

.teacher-toolbar-schedule-issues-inner:has(.parallel-pills--toolbar) {
  padding: 0.45rem 0.6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--class-pill-warn-border) 85%, var(--border));
  background: color-mix(in srgb, var(--class-pill-warn-bg) 72%, var(--surface));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text) 6%, transparent);
}

[data-theme='light'] .teacher-toolbar-schedule-issues-inner:has(.parallel-pills--toolbar) {
  background: color-mix(in srgb, var(--class-pill-warn-bg) 88%, var(--surface));
}

.teacher-toolbar-schedule-issues-msg {
  margin: 0;
  max-width: 28rem;
}

.teacher-toolbar-schedule-issues-msg--ok {
  color: var(--class-pill-ok-text);
}

.teacher-toolbar-parallel-block {
  margin-bottom: 0;
}

.parallel-pills--toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem;
  width: 100%;
  max-width: 100%;
  padding-bottom: 0;
}

#panelTeachers .parallel-pills--toolbar .class-pill.teacher-toolbar-class-pill {
  width: auto;
  flex: 0 1 auto;
  cursor: pointer;
  font: inherit;
  appearance: none;
  -webkit-appearance: none;
}

#panelTeachers .teacher-toolbar-class-pill:hover {
  filter: brightness(1.06);
}

#panelTeachers .teacher-toolbar-class-pill:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

#panelTeachers .teacher-toolbar-class-pill--active {
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 55%, var(--border)),
    inset 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent);
}

.teacher-sidebar-no-lessons-block {
  margin-top: 0.75rem;
  padding-top: 0.65rem;
  border-top: 1px solid var(--border);
}

.teacher-sidebar-no-lessons-label {
  display: block;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 0.4rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.teacher-class-sidebar .teacher-toolbar-class-pill--no-lessons {
  opacity: 0.92;
  cursor: pointer;
}

.teacher-class-sidebar .teacher-toolbar-class-pill--no-lessons.teacher-toolbar-class-pill--marked {
  font-weight: 600;
}

.teacher-class-sidebar .teacher-toolbar-class-pill--no-lessons:hover {
  filter: brightness(1.06);
}

.teacher-class-sidebar .teacher-toolbar-class-pill--no-lessons:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.teacher-class-day-preview-actions {
  margin: 0.35rem 0 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.teacher-class-day-preview-flag {
  margin: 0;
}

.toolbar-date-inline {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.toolbar-date-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.weekday-pill {
  display: inline-block;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  font-size: 0.85rem;
  color: var(--accent);
  background: var(--accent-dim);
  border: 1px solid var(--weekday-pill-border);
}

.teacher-hint {
  margin: 0 0 1rem;
  font-size: 0.88rem;
}

#panelTeachers.teacher-edit-active .teacher-cell--tap {
  cursor: pointer;
}

#panelTeachers.teacher-edit-active .teacher-cell--tap:hover {
  outline: 1px solid var(--accent);
  outline-offset: -1px;
  background: var(--accent-dim);
}

.teacher-sub-badge {
  color: var(--warn);
  font-size: 0.72rem;
  margin-right: 0.15rem;
  vertical-align: 0.05em;
}

.teacher-sub-badge--merge {
  color: #1f4e8c;
  font-weight: 700;
  display: inline-block;
  padding: 0 0.22rem;
  border-radius: 999px;
  border: 1px solid #8eb4e8;
  background: #e8f1ff;
}

.teacher-class-merge-mark {
  display: inline-block;
  margin-left: 0.2rem;
  color: #1f4e8c;
  font-weight: 700;
}

.teacher-name-btn {
  display: block;
  width: 100%;
  max-width: 100%;
  text-align: center;
  padding: 0.35rem 0.5rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.teacher-name-btn:hover {
  border-color: var(--accent);
  background: var(--accent-dim);
}

.teacher-name-btn.is-selected {
  box-shadow: 0 0 0 2px var(--accent);
  border-color: var(--accent);
}

.teacher-name-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.teacher-name-plain {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  max-width: 100%;
  font-weight: 600;
  padding: 0.35rem 0.5rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  box-sizing: border-box;
  cursor: context-menu;
}

.teacher-name-plain-text,
.teacher-name-absence-text {
  flex: 1;
  min-width: 0;
  align-self: center;
}

.teacher-name-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  max-width: 100%;
  font-weight: 600;
}

.teacher-name-inline-text {
  min-width: 0;
}

.teacher-absence-clear-btn {
  margin-left: 0.25rem;
  width: 1.25rem;
  height: 1.25rem;
  min-width: 1.25rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}

.teacher-absence-clear-btn:hover {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 60%, var(--border));
  background: color-mix(in srgb, var(--danger) 12%, var(--surface));
}

.teacher-name-absence-btn {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  max-width: 100%;
  text-align: center;
  padding: 0.35rem 0.5rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-weight: 600;
  cursor: context-menu;
  box-sizing: border-box;
}

.teacher-name-absence-btn:hover {
  border-color: var(--accent);
  background: var(--accent-dim);
}

.teacher-name-absence-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.teacher-absence-strip {
  width: 4px;
  flex-shrink: 0;
  border-radius: 2px;
  align-self: stretch;
  min-height: 1.1em;
}

.absence-reasons-editor {
  margin-bottom: 1.5rem;
}

.absence-reasons-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.absence-reasons-column__title {
  margin: 0 0 0.5rem;
  font-size: 0.98rem;
}

.abs-reason-icon-btn {
  width: 2.1rem;
  height: 2.1rem;
  min-width: 2.1rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.absence-reasons-toolbar-top {
  margin-top: 0;
  margin-bottom: 0.55rem;
}

.absence-reasons-table .abs-reason-color {
  width: 3rem;
  height: 2rem;
  padding: 0;
  border: 1px solid var(--border);
  cursor: pointer;
}

.absence-reasons-table .abs-reason-paid-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  font-size: 0.9rem;
  cursor: pointer;
}

.absence-reason-add-dialog {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #1f2430;
  color: var(--text);
  padding: 0;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32);
  width: min(380px, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  z-index: 10030;
}

[data-theme='light'] .absence-reason-add-dialog {
  background: #ffffff;
}

.absence-reason-add-dialog[open] {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
}

.absence-reason-add-dialog::backdrop {
  background: rgba(0, 0, 0, 0.42);
}

.absence-reason-add-form {
  padding: 1rem;
  display: grid;
  gap: 0.8rem;
  background: inherit;
}

.absence-reason-add-form h3 {
  margin: 0;
}

.absence-reason-add-form label {
  display: grid;
  gap: 0.35rem;
  font-size: 0.92rem;
}

.absence-reason-add-form input[type='text'],
.absence-reason-add-form input[type='color'] {
  width: 100%;
}

.absence-reason-add-form label.check {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.absence-reason-add-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.65rem;
}

.absence-reason-add-row label {
  margin: 0;
}

.absence-reason-add-row__label {
  font-size: 0.92rem;
  min-width: 2.4rem;
}

.absence-reason-add-actions {
  margin-top: 0.35rem;
  display: flex;
  justify-content: center;
  gap: 0.5rem;
}

.worktime-sick-extend-dialog {
  width: min(420px, calc(100vw - 28px));
}

.worktime-sick-extend-dialog .teacher-absence-dialog__hint {
  margin: 2px 0 4px;
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

@media (max-width: 980px) {
  .absence-reasons-columns {
    grid-template-columns: 1fr;
  }
}

.teacher-chip-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  align-items: center;
  justify-content: center;
  min-height: 1.2em;
}

.teacher-class-chip {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 0.35rem;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  font-size: 0.8rem;
  cursor: grab;
  max-width: 100%;
  position: relative;
}

.teacher-class-chip--base {
  color: var(--muted);
  border-color: var(--border);
  background: rgba(148, 163, 184, 0.1);
}

[data-theme="light"] .teacher-class-chip--base {
  color: var(--muted);
  background: rgba(90, 106, 125, 0.08);
}

.teacher-class-chip--moved {
  color: var(--class-pill-ok-text);
  border-color: var(--class-pill-ok-border);
  background: var(--class-pill-ok-bg);
}

.teacher-class-chip--dragging {
  opacity: 0.55;
  cursor: grabbing;
}

.teacher-class-chip--locked-move {
  outline: 2px dashed var(--accent);
  outline-offset: 1px;
}

.teacher-class-chip[data-drag-locked='1'] {
  cursor: not-allowed;
}

.teacher-class-chip-from {
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--accent);
  white-space: nowrap;
}

.teacher-class-sub {
  font-size: 0.72rem;
  color: var(--accent);
  white-space: normal;
}

.teacher-class-sub--duty {
  color: var(--muted);
  font-style: italic;
}

.teacher-class-chip--subst-duty {
  border-style: dashed;
}

.class-slot-cancelled {
  font-weight: 700;
  color: var(--danger);
}

.class-sheet--by-lesson .teacher-cell--cancelled-lesson {
  background: color-mix(in srgb, var(--danger) 10%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--danger) 35%, var(--border));
}

.teacher-class-chip--cancelled {
  border-color: color-mix(in srgb, var(--danger) 60%, var(--border));
  background: color-mix(in srgb, var(--danger) 14%, var(--surface));
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: color-mix(in srgb, var(--danger) 80%, transparent);
}

.teacher-class-chip-class {
  font-weight: 600;
}

/* Составление замен: класс на 2-й смене — синий акцент на номере класса */
.teacher-sheet--subs .teacher-class-chip--second-shift .teacher-class-chip-class {
  color: #93c5fd;
}
[data-theme='light'] .teacher-sheet--subs .teacher-class-chip--second-shift .teacher-class-chip-class {
  color: #1d4ed8;
}

.teacher-sheet--subs .teacher-plain-class-label--second-shift {
  color: #93c5fd;
}
[data-theme='light'] .teacher-sheet--subs .teacher-plain-class-label--second-shift {
  color: #1d4ed8;
}

.teacher-class-chip-subgroup {
  font-size: 0.58rem;
  font-weight: 500;
  color: var(--muted);
  white-space: nowrap;
  margin-left: 0.1em;
}

.teacher-plain-class-subgroup {
  font-size: 0.65em;
  font-weight: 500;
  color: var(--muted);
  margin-left: 0.1em;
}


.teacher-plain-class-pick {
  display: inline;
  margin: 0;
  padding: 0.05rem 0.1rem;
  border: none;
  background: transparent;
  border-radius: 4px;
  color: var(--accent);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: rgba(110, 184, 255, 0.45);
  text-underline-offset: 2px;
}

.teacher-plain-class-pick:hover {
  color: var(--text);
  background: var(--accent-dim);
}

.teacher-plain-class-sep {
  color: var(--muted);
  font-weight: 400;
}

.teacher-plain-class-label {
  color: var(--text);
  font-weight: 600;
}

.teacher-class-chip-room-corner {
  position: absolute;
  right: 0.28rem;
  bottom: 0.15rem;
  font-size: 0.6rem;
  line-height: 1;
  color: var(--muted);
  background: color-mix(in srgb, var(--surface) 78%, transparent);
  border-radius: 4px;
  padding: 0.03rem 0.2rem;
}

.teacher-class-chip--with-room {
  padding-right: 1.75rem;
  padding-bottom: 0.28rem;
}

.teacher-plain-class-label--with-room {
  position: relative;
  display: inline-block;
  padding-right: 1.7rem;
}

.teacher-plain-class-room-corner {
  position: absolute;
  right: 0;
  bottom: -0.05rem;
  font-size: 0.62rem;
  line-height: 1;
  color: var(--muted);
}

.class-sheet .teacher-cell--absent-slot {
  color: var(--muted);
}

/* «Работа с классами»: ширина липких колонок № / Время (только панель классов, не занятость кабинетов) */
#panelClassGrid .class-sheet--by-lesson {
  --class-col-num-w: 2.65rem;
  /* Интервалы вроде «10:30–11:15» — нужна ширина под nowrap ячеек таблицы */
  --class-col-time-w: 6.85rem;
}

#panelClassGrid .teacher-sheet.class-sheet--by-lesson .sticky-num {
  width: var(--class-col-num-w);
  min-width: var(--class-col-num-w);
  max-width: var(--class-col-num-w);
  text-align: center;
  vertical-align: middle;
}

#panelClassGrid .teacher-sheet.class-sheet--by-lesson .sticky-time {
  position: sticky;
  left: var(--class-col-num-w);
  z-index: 2;
  width: var(--class-col-time-w);
  min-width: var(--class-col-time-w);
  max-width: var(--class-col-time-w);
  text-align: center;
  vertical-align: middle;
  font-weight: 600;
  font-size: 0.72rem;
  line-height: 1.2;
  background: var(--table-sticky-bg);
  box-shadow: var(--shadow-sticky);
}

/* «Работа с классами»: таблица на всю ширину панели */
#panelClassGrid .teacher-grid-wrap {
  width: 100%;
  max-width: 100%;
}

#panelClassGrid .teacher-grid-wrap .class-sheet.class-sheet--by-lesson {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

#panelClassGrid .class-sheet--by-lesson .teacher-cell {
  max-width: none;
}

#panelClassGrid .class-sheet--by-lesson thead .sticky-class-head {
  max-width: none;
}

#panelClassGrid .class-sheet--by-lesson thead .sticky-class-head.class-head-with-homeroom {
  max-width: none;
}

#panelClassGrid .class-sheet--by-lesson td.teacher-cell--main-sched {
  max-width: none;
}

#panelClassGrid .class-sheet--by-lesson thead .sticky-class-head.class-head-main-sched-col {
  max-width: none;
}

#btnClassMainScheduleColumn.btn-class-main-sched--active {
  background: color-mix(in srgb, var(--accent-dim) 55%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
}

#panelClassGrid .toolbar #btnClassMainScheduleColumn {
  flex-shrink: 0;
}

/* «Работа с классами»: строки — уроки, столбцы — классы; в ячейках предмет (кабинет), несколько кабинетов — через / */
.class-sheet--by-lesson .teacher-cell {
  white-space: normal;
  max-width: 10rem;
  vertical-align: middle;
  text-align: center;
}

.class-sheet--by-lesson .teacher-chip-stack {
  justify-content: center;
}

/* Отличие от импорта / переносы / замена на дату — как на сетке учителей */
.class-sheet--by-lesson td.teacher-cell--altered-view {
  background: var(--class-pill-warn-bg);
  box-shadow: inset 0 0 0 1px var(--class-pill-warn-border);
  border-radius: 4px;
}

.class-sheet--by-lesson td.teacher-cell--absent-slot.teacher-cell--altered-view {
  color: var(--text);
  background: color-mix(in srgb, var(--class-pill-warn-bg) 85%, var(--surface));
}

.class-sheet--by-lesson td.teacher-cell--merge-coverage {
  background: var(--merge-coverage-bg);
  box-shadow: inset 0 0 0 1px var(--merge-coverage-border);
  border-radius: 4px;
  color: var(--merge-coverage-text);
}

.class-sheet--by-lesson td.teacher-cell--absent-slot.teacher-cell--merge-coverage {
  color: var(--merge-coverage-text);
  background: color-mix(in srgb, var(--merge-coverage-bg) 88%, var(--surface));
}

.class-sheet--by-lesson thead .sticky-class-head {
  max-width: 8rem;
  min-width: 4.5rem;
  white-space: normal;
  vertical-align: middle;
  font-weight: 600;
}

.class-sheet--by-lesson thead .sticky-class-head.class-head-with-homeroom {
  max-width: 11.5rem;
}

.class-head-inner {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 100%;
}

.class-sheet--by-lesson thead .sticky-class-head.class-head-main-sched-col {
  max-width: 6.25rem;
  min-width: 3.25rem;
  font-weight: 500;
  font-size: 0.72rem;
  color: var(--muted);
  vertical-align: middle;
}

.class-head-main-sched-label {
  display: block;
  line-height: 1.2;
}

.class-sheet--by-lesson td.teacher-cell--main-sched {
  max-width: 6.5rem;
  font-size: 0.72rem;
  color: color-mix(in srgb, var(--text) 88%, var(--muted));
  background: color-mix(in srgb, var(--surface) 92%, var(--muted));
  vertical-align: middle;
}

.class-sheet--by-lesson td.class-grid-day-comment-cell--main-pad {
  background: color-mix(in srgb, var(--surface) 92%, var(--muted));
}

.class-sheet--by-lesson thead .class-head-inner .class-head-class-title {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  text-align: center;
  font-weight: 600;
  font-size: inherit;
  color: var(--text);
  cursor: default;
}

.btn-homeroom-class-hour.btn-icon-book,
.btn-homeroom-class-hour.btn-class-day-comment {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0.22rem 0.32rem;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--surface);
  color: var(--accent);
  cursor: pointer;
  line-height: 0;
}

.btn-homeroom-class-hour.btn-icon-book:hover,
.btn-homeroom-class-hour.btn-class-day-comment:hover {
  background: var(--accent-dim);
}

.btn-homeroom-class-hour.btn-class-day-comment.btn-class-day-comment--has {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  background: color-mix(in srgb, var(--accent-dim) 50%, var(--surface));
}

.class-head-day-comment {
  display: block;
  width: 100%;
  margin-top: 0.2rem;
  font-size: 0.68rem;
  line-height: 1.25;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Строка «Комментарии» под уроками — вкладка «Работа с классами» */
.class-sheet--by-lesson tr.class-grid-comments-row td {
  vertical-align: middle;
  text-align: center;
  white-space: normal;
  line-height: 1.35;
}

/* Объединённые «№» + «Время»: ширина как у двух колонок уроков, липкая первая зона */
#panelClassGrid .class-sheet--by-lesson tbody tr.class-grid-comments-row td.class-grid-comments-row__merged {
  position: sticky;
  left: 0;
  z-index: 2;
  width: calc(var(--class-col-num-w) + var(--class-col-time-w));
  min-width: calc(var(--class-col-num-w) + var(--class-col-time-w));
  max-width: calc(var(--class-col-num-w) + var(--class-col-time-w));
  vertical-align: middle;
  text-align: center;
  font-weight: 650;
  font-size: 0.82rem;
  color: var(--muted);
  background: var(--table-sticky-bg);
  box-shadow: var(--shadow-sticky);
}

.class-grid-day-comment-cell {
  max-width: 10rem;
}

.class-grid-day-comment-open {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0.35rem 0.45rem;
  text-align: center;
  font: inherit;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--text);
  cursor: pointer;
  border: 1px dashed var(--border);
  border-radius: 6px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
}

.class-grid-day-comment-open:hover {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: var(--accent-dim);
}

.class-grid-day-comment-open--empty {
  color: var(--muted);
  font-style: italic;
}

.homeroom-class-hour-book-icon {
  display: block;
}

#panelClassGrid .class-sheet--by-lesson thead .sticky-time {
  z-index: 3;
  background: var(--table-sticky-head-bg);
}

.room-occupancy-table th,
.room-occupancy-table td {
  text-align: center;
  vertical-align: middle;
}

.room-occupancy-table td {
  white-space: normal;
}

/* Все 13 колонок (кабинет + уроки 1…12) одинаковой ширины */
.room-occupancy-table.room-occupancy-table--equal-cols {
  table-layout: fixed;
  width: 100%;
}
.room-occupancy-table.room-occupancy-table--equal-cols col.room-occupancy-col-cabinet,
.room-occupancy-table.room-occupancy-table--equal-cols col.room-occupancy-col-lesson {
  width: calc(100% / 13);
}

.room-occupancy-table.room-occupancy-table--equal-cols th,
.room-occupancy-table.room-occupancy-table--equal-cols td {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Разделитель смены после 6-го урока и конец дня — как в сетке «Составление замен» */
.room-occupancy-table th.room-occupancy-lesson-col--shift-gap,
.room-occupancy-table td.room-occupancy-lesson-col--shift-gap {
  border-left: 3px solid color-mix(in srgb, var(--border) 70%, var(--text) 30%);
}

.room-occupancy-table th.room-occupancy-lesson-col--day-end,
.room-occupancy-table td.room-occupancy-lesson-col--day-end {
  border-right: 3px solid color-mix(in srgb, var(--border) 70%, var(--text) 30%);
  box-shadow: none;
}

.room-occupancy-table thead th.teacher-lesson-col--shift1 {
  background: var(--table-sticky-head-bg);
}

:where(.room-occupancy-table tbody td.teacher-lesson-col--shift1) {
  background: var(--table-sticky-bg);
}

/* Категории кабинетов (справочник в настройках): спец — светло-зелёный, нач. школа — жёлтый, обычные — без заливки */
.room-occupancy-table tbody tr.room-occupancy-row--no-room > td.sticky-num {
  font-style: italic;
}

.room-occupancy-table tbody tr.room-occupancy-row--specialized > td {
  background: color-mix(in srgb, #bbf7d0 52%, var(--surface));
}

.room-occupancy-table tbody tr.room-occupancy-row--specialized > td.sticky-num {
  background: color-mix(in srgb, #bbf7d0 52%, var(--table-sticky-bg));
}

.room-occupancy-table tbody tr.room-occupancy-row--primary > td {
  background: color-mix(in srgb, #fef08a 48%, var(--surface));
}

.room-occupancy-table tbody tr.room-occupancy-row--primary > td.sticky-num {
  background: color-mix(in srgb, #fef08a 48%, var(--table-sticky-bg));
}

.room-occupancy-cell-chips {
  display: block;
  line-height: 1.35;
  text-align: center;
}

.room-occupancy-chip {
  cursor: grab;
  user-select: none;
  font-weight: 400;
  color: var(--text);
  border-bottom: 1px dashed color-mix(in srgb, var(--accent) 45%, transparent);
}

[data-theme="light"] .room-occupancy-chip:not(.room-occupancy-chip--subgroups) {
  color: #111827;
}

/* На этом уроке класс в расписании идёт двумя (и более) разными подгруппами */
.room-occupancy-chip.room-occupancy-chip--subgroups {
  font-weight: 700;
  color: #9ec5ff;
  border-bottom-color: color-mix(in srgb, #9ec5ff 55%, var(--accent));
}

[data-theme="light"] .room-occupancy-chip.room-occupancy-chip--subgroups {
  color: #082654;
  border-bottom-color: color-mix(in srgb, #082654 50%, var(--accent));
}

.room-occupancy-chip:active {
  cursor: grabbing;
}

.room-occupancy-table td.room-occupancy-slot--quarantine-cell {
  background: color-mix(in srgb, #fb923c 28%, var(--cell-bg, var(--bg)));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #ea580c 45%, transparent);
}

[data-theme='light'] .room-occupancy-table td.room-occupancy-slot--quarantine-cell {
  background: color-mix(in srgb, #fed7aa 72%, #fff);
  box-shadow: inset 0 0 0 1px #f97316;
}

.room-occupancy-table tbody tr.room-occupancy-row--specialized > td.room-occupancy-slot--quarantine-cell {
  background: color-mix(in srgb, #fb923c 32%, #bbf7d0);
}

.room-occupancy-table tbody tr.room-occupancy-row--primary > td.room-occupancy-slot--quarantine-cell {
  background: color-mix(in srgb, #fb923c 32%, #fef08a);
}

.room-occupancy-chip.room-occupancy-chip--quarantine {
  cursor: default;
  border-bottom: none;
  font-weight: 600;
  color: inherit;
  background: transparent;
  box-shadow: none;
}

[data-theme='light'] .room-occupancy-chip.room-occupancy-chip--quarantine {
  color: #9a3412;
}

.room-occupancy-slot--quarantine-cell .room-occupancy-chip.room-occupancy-chip--quarantine {
  border: none;
  background: transparent;
}

.room-occupancy-table td.room-occupancy-slot--freed {
  background: color-mix(in srgb, #93c5fd 35%, var(--cell-bg, var(--bg)));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #3b82f6 40%, transparent);
}

[data-theme='light'] .room-occupancy-table td.room-occupancy-slot--freed {
  background: color-mix(in srgb, #dbeafe 85%, #fff);
}

.room-occupancy-freed-mark {
  font-size: 0.72rem;
  font-style: italic;
  color: var(--muted-fg, #5c6570);
}

.room-occupancy-room-label {
  cursor: context-menu;
}

.room-occupancy-room-label--has-freed::after {
  content: ' ○';
  font-size: 0.65rem;
  color: #3b82f6;
  vertical-align: super;
}

.room-freed-lessons-grid {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin: 0.75rem 0 1rem;
}

.room-freed-lessons-row {
  display: grid;
  grid-template-columns: repeat(6, minmax(2.25rem, 1fr));
  gap: 0.35rem 0.5rem;
  justify-items: center;
}

.room-freed-lesson-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  cursor: pointer;
  user-select: none;
}

.room-freed-lesson-num {
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1;
}

.room-freed-lesson-check {
  width: 1rem;
  height: 1rem;
  margin: 0;
  cursor: pointer;
}

.room-occupancy-chip-sep {
  color: var(--muted);
  user-select: none;
}

.room-occupancy-cell-content {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.2;
  max-height: 2.4em;
  text-align: center;
}

.class-slot-cell {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
  align-items: center;
}

.class-grid-cell-wrap {
  position: relative;
  min-height: 1.2rem;
}

.class-post-year-lines {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-bottom: 0.25rem;
}

.class-post-year-line {
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  word-break: break-word;
}

.class-post-year-kind {
  font-weight: 600;
}

.class-slot-line {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0;
  line-height: 1.25;
  width: 100%;
}

.class-slot-text {
  display: inline;
}

.class-slot-subj {
  font-weight: 600;
}

.class-slot-sep {
  font-weight: 400;
  color: var(--muted);
}

.class-slot-room {
  font-size: 0.85em;
  color: var(--muted);
  font-weight: 500;
}

.teacher-class-chip .class-chip-line {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0;
  line-height: 1.2;
}

.teacher-class-chip .class-chip-sub {
  font-weight: 600;
}

.teacher-class-chip .class-chip-sep {
  font-size: 0.68rem;
  color: var(--muted);
  font-weight: 400;
}

.teacher-class-chip .class-chip-room {
  font-size: 0.68rem;
  color: var(--muted);
  font-weight: 500;
}

#panelTeachers.teacher-edit-active .teacher-cell--chips.teacher-cell--tap:hover {
  outline: 1px solid var(--accent);
  outline-offset: -1px;
  background: var(--accent-dim);
}

.teacher-cell--chips {
  position: relative;
}

.teacher-class-day-preview {
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border);
}

.teacher-class-day-preview-title {
  margin: 0 0 0.5rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
}

.teacher-class-day-preview-note {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
}

.teacher-class-day-preview-cell--empty {
  background: var(--class-pill-warn-bg);
  box-shadow: inset 0 0 0 1px var(--class-pill-warn-border);
}

.teacher-class-day-preview-scroll {
  overflow-x: visible;
  max-width: 100%;
}

/* Вся таблица в ширину сайдбара: без горизонтальной прокрутки, «Предмет» переносится. */
.teacher-class-day-preview-table.sheet {
  width: 100%;
  table-layout: fixed;
}

.teacher-class-day-preview-table {
  font-size: 0.78rem;
  margin: 0;
  min-width: 0;
}

.teacher-class-day-preview-table th,
.teacher-class-day-preview-table td {
  padding: 0.25rem 0.4rem;
  vertical-align: middle;
  text-align: center;
}

.teacher-class-day-preview-table th:nth-child(1),
.teacher-class-day-preview-table td:nth-child(1) {
  width: 2.1rem;
  max-width: 2.4rem;
  white-space: nowrap;
}

.teacher-class-day-preview-table th:nth-child(2),
.teacher-class-day-preview-table td:nth-child(2) {
  min-width: 0;
  max-width: none;
  white-space: normal;
  text-align: left;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: auto;
}

.teacher-class-day-preview-hint,
.teacher-class-day-preview-empty {
  margin: 0.25rem 0 0;
}

.teacher-chip-menu {
  position: fixed;
  z-index: 10000;
  min-width: 12rem;
  max-width: min(22rem, 92vw);
  max-height: min(70vh, 420px);
  overflow-y: auto;
  padding: 0.35rem 0;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.teacher-chip-menu-title {
  padding: 0.35rem 0.75rem 0.2rem;
  font-size: 0.75rem;
  color: var(--muted);
}

.teacher-chip-menu-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 0.45rem 0.75rem;
  border: none;
  background: transparent;
  color: var(--text);
  font: inherit;
  cursor: pointer;
}

.teacher-chip-menu-item:hover {
  background: var(--accent-dim);
}

.teacher-chip-menu-title--second {
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
  margin-top: 0.25rem;
}

.teacher-chip-menu-modes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding: 0.35rem 0.75rem 0.5rem;
}

.teacher-chip-menu-mode {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--table-sticky-bg);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  flex-shrink: 0;
}

.teacher-chip-menu-mode-icon {
  display: block;
  pointer-events: none;
}

.teacher-chip-menu-mode.is-active {
  border-color: var(--accent);
  background: var(--accent-dim);
  color: var(--accent);
}

.teacher-chip-menu-mode:hover:not(.is-active) {
  background: color-mix(in srgb, var(--accent) 12%, var(--table-sticky-bg));
}

.teacher-chip-menu-mode--danger {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 45%, var(--border));
}

.teacher-chip-menu-mode--danger:hover {
  background: color-mix(in srgb, var(--danger) 12%, var(--table-sticky-bg));
}

.teacher-chip-menu-merged-row {
  padding: 0.25rem 0.75rem 0.6rem;
  font-size: 0.75rem;
  color: var(--muted);
}

.teacher-chip-menu-merged-label {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  flex-wrap: wrap;
}

.teacher-chip-menu-merged-input {
  width: 3.25rem;
  padding: 0.2rem 0.35rem;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--login-input-bg);
  color: var(--text);
  font: inherit;
}

/* Список ФИО под «Кто заменяет» — отдельная прокрутка при длинном списке (режим wholeClass/merged). */
.teacher-chip-menu-sub-list {
  max-height: min(32vh, 220px);
  overflow-y: auto;
}
.teacher-class-sub-meta {
  font-size: 0.68rem;
  color: var(--merge-coverage-text);
  font-weight: 600;
}

.teacher-panel-layout {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1.6rem;
  flex-wrap: nowrap;
  width: 100%;
}

.teacher-main-col {
  order: 1;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.teacher-sub-move-hint {
  margin: 0;
  padding: 0.45rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.88rem;
  line-height: 1.35;
  color: var(--text);
}

.teacher-sub-move-hint[hidden] {
  display: none !important;
}

.teacher-panel-layout .teacher-main-col .teacher-grid-wrap {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
}

/* Панель параллелей — справа; таблица учителей — слева */
.teacher-class-sidebar {
  order: 2;
  flex: 0 1 21rem;
  min-width: min(18.9rem, 100%);
  max-width: min(25.2rem, 100%);
  margin-left: auto;
  margin-right: 0;
  position: sticky;
  top: 0.75rem;
  align-self: flex-start;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  max-height: min(85vh, 900px);
  overflow-y: auto;
  overflow-x: hidden;
}

.teacher-sidebar-heading {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 650;
}

.teacher-sidebar-parallel-filter {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
  line-height: 1.35;
  color: var(--muted);
  cursor: pointer;
}

.teacher-sidebar-parallel-filter input {
  margin-top: 0.12rem;
  flex-shrink: 0;
}

.teacher-sidebar-msg {
  margin: 0;
}

.teacher-sidebar-inner {
  min-height: 2rem;
}

.teacher-sidebar-class-select-label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin: 0 0 0.6rem;
  font-size: 0.8rem;
  color: var(--muted);
}

.teacher-sidebar-class-select {
  width: 100%;
}

.parallel-block {
  margin-bottom: 0.85rem;
}

.parallel-block:last-child {
  margin-bottom: 0;
}

.parallel-title {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 0.35rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.parallel-pills {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.35rem;
  max-width: 100%;
  padding-bottom: 0.2rem;
}

.class-pill {
  display: block;
  width: 100%;
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  font-size: 0.82rem;
  font-weight: 600;
  border: 1px solid var(--border);
  cursor: default;
  white-space: nowrap;
  text-align: center;
}

.class-pill--ok {
  background: var(--class-pill-ok-bg);
  color: var(--class-pill-ok-text);
  border-color: var(--class-pill-ok-border);
}

.class-pill--warn {
  background: var(--class-pill-warn-bg);
  color: var(--class-pill-warn-text);
  border-color: var(--class-pill-warn-border);
}

.class-pill-lessons {
  font-weight: 600;
  opacity: 0.92;
}

@media (max-width: 960px) {
  .teacher-panel-layout {
    flex-direction: column;
  }

  .teacher-class-sidebar {
    position: static;
    flex: 1 1 auto;
    width: 100%;
    margin-right: 0;
    max-height: none;
  }

  #panelTeachers {
    width: 100%;
  }
}

/* Таблица учителей: горизонтальная прокрутка внутри колонки */
.teacher-grid-wrap.grid-wrap {
  overflow-x: auto;
  overflow-y: visible;
  max-height: none;
}

.teacher-sheet {
  min-width: 960px;
}

.teacher-grid-wrap .teacher-sheet {
  min-width: auto;
  width: 100%;
}

/* Составление замен: одинаковая ширина столбцов уроков; линия между 6-м и 7-м уроком (смены) */
.teacher-grid-wrap .teacher-sheet.teacher-sheet--subs {
  table-layout: fixed;
  --teacher-sticky-num: 3rem;
  --teacher-sticky-name: 12rem;
}

.teacher-sheet.teacher-sheet--subs .sticky-num {
  width: var(--teacher-sticky-num);
  min-width: var(--teacher-sticky-num);
  max-width: var(--teacher-sticky-num);
}

.teacher-sheet.teacher-sheet--subs .sticky-name {
  width: var(--teacher-sticky-name);
  min-width: var(--teacher-sticky-name);
  max-width: var(--teacher-sticky-name);
  left: var(--teacher-sticky-num);
  /* линия после фамилий (ФИО) */
  border-right: 3px solid color-mix(in srgb, var(--border) 55%, var(--text) 45%);
  box-shadow:
    inset -1px 0 0 0 color-mix(in srgb, var(--text) 16%, transparent),
    2px 0 6px color-mix(in srgb, var(--accent) 18%, transparent);
}

.teacher-sheet.teacher-sheet--subs th.teacher-lesson-col,
.teacher-sheet.teacher-sheet--subs td.teacher-lesson-col {
  width: calc(
    (100% - var(--teacher-sticky-num) - var(--teacher-sticky-name)) /
      max(1, var(--teacher-lesson-count, 12))
  );
  min-width: 0;
  max-width: none;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.teacher-sheet.teacher-sheet--subs th.teacher-lesson-col--shift-gap,
.teacher-sheet.teacher-sheet--subs td.teacher-lesson-col--shift-gap {
  border-left: 3px solid color-mix(in srgb, var(--border) 70%, var(--text) 30%);
}

/* Конец дня (12-й урок): такая же линия, как после 6-го (граница смены), по всему столбцу — справа */
.teacher-sheet.teacher-sheet--subs th.teacher-lesson-col--day-end,
.teacher-sheet.teacher-sheet--subs td.teacher-lesson-col--day-end {
  border-right: 3px solid color-mix(in srgb, var(--border) 70%, var(--text) 30%);
  box-shadow: none;
}

/* Уроки 1–6: базовый фон как у колонки ФИО (до зелёных/жёлтых пометок; :where = 0, не перебивает пометки) */
.teacher-sheet.teacher-sheet--subs thead th.teacher-lesson-col--shift1 {
  background: var(--table-sticky-head-bg);
}

:where(.teacher-sheet.teacher-sheet--subs tbody td.teacher-lesson-col--shift1) {
  background: var(--table-sticky-bg);
}

.teacher-sheet.teacher-sheet--subs tbody tr.teacher-row--absent td.teacher-lesson-col--shift1 {
  background: color-mix(in srgb, var(--absence-tint) 28%, var(--table-sticky-bg));
}

.teacher-sheet.teacher-sheet--subs tbody tr.teacher-row--absent td.teacher-lesson-col--shift1.teacher-cell--has-sub {
  background: rgba(34, 197, 94, 0.16);
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.45);
  border-radius: 4px;
}

.teacher-sheet.teacher-sheet--subs tbody tr.teacher-row--absent td.teacher-lesson-col--shift1.teacher-cell--merge-coverage {
  background: color-mix(
    in srgb,
    var(--merge-coverage-bg) 55%,
    color-mix(in srgb, var(--absence-tint) 28%, var(--table-sticky-bg))
  );
  box-shadow: inset 0 0 0 1px var(--merge-coverage-border);
  color: var(--merge-coverage-text);
}

#panelTeachers.teacher-edit-active
  .teacher-sheet.teacher-sheet--subs
  tbody
  tr.teacher-row--absent
  td.teacher-cell--chips.teacher-lesson-col--shift1.teacher-cell--merge-coverage {
  background: color-mix(
    in srgb,
    color-mix(in srgb, var(--merge-coverage-bg) 85%, transparent) 50%,
    color-mix(in srgb, var(--absence-tint) 28%, var(--table-sticky-bg))
  );
  color: var(--merge-coverage-text);
}

.teacher-sheet.teacher-sheet--subs tbody tr.teacher-row--absent td.teacher-lesson-col--shift1.teacher-cell--altered-view {
  background: color-mix(
    in srgb,
    var(--class-pill-warn-bg) 55%,
    color-mix(in srgb, var(--absence-tint) 28%, var(--table-sticky-bg))
  );
  box-shadow: inset 0 0 0 1px var(--class-pill-warn-border);
}

#panelTeachers.teacher-edit-active
  .teacher-sheet.teacher-sheet--subs
  tbody
  tr.teacher-row--absent
  td.teacher-cell--chips.teacher-lesson-col--shift1.teacher-cell--altered-view {
  background: color-mix(
    in srgb,
    rgba(234, 179, 8, 0.28) 50%,
    color-mix(in srgb, var(--absence-tint) 28%, var(--table-sticky-bg))
  );
}

.registry-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.75rem;
}

#adminPrimaryOnlyBlock .registry-toolbar {
  align-items: flex-end;
}

/* Квадратные кнопки в разделе «Учётные записи администраторов» */
#admin-section-admins .admin-password-change > .btn.primary.registry-square-btn {
  margin-top: 0.25rem;
}

#admin-section-admins .admin-accounts-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-width: 7.5rem;
}

#admin-section-admins .admin-accounts-actions .registry-square-btn {
  width: 2.1rem;
  height: 2.1rem;
  min-width: 2.1rem;
  flex-shrink: 0;
}

#admin-section-admins .admin-accounts-actions .registry-square-btn .reg-icon {
  display: block;
}

#admin-section-admins .admin-accounts-actions .registry-square-btn.danger {
  color: var(--danger);
  border-color: var(--btn-danger-border);
}

.registry-square-btn {
  width: 2.35rem;
  height: 2.35rem;
  min-width: 2.35rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border-color: color-mix(in srgb, var(--border) 92%, transparent);
}

.registry-square-btn:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  color: var(--accent);
}

@media (hover: hover) and (pointer: fine) {
  .registry-square-btn:hover {
    border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
    color: var(--accent);
  }
}

.registry-editor {
  margin-bottom: 2rem;
  overflow-x: auto;
}

.registry-table {
  max-width: 720px;
}

/* Список кабинетов (настройки администратора) */
.rooms-directory-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  align-items: center;
  margin-bottom: 1rem;
}

.rooms-directory-toolbar .registry-square-btn .reg-icon {
  display: block;
}

.rooms-directory-toolbar .btn.primary.registry-square-btn .reg-icon {
  color: inherit;
}

.rooms-directory-kind-readonly {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 14rem;
  text-align: right;
  font-size: 0.875rem;
  color: color-mix(in srgb, var(--text) 78%, transparent);
  word-break: break-word;
}

/* Колонки и порядок заполнения задаются в JS: grid-auto-flow: column + число строк (сортировка сверху вниз в каждой колонке). */
.rooms-directory-grid {
  display: grid;
  gap: 0.75rem 1.25rem;
  max-width: none;
}

.rooms-directory-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1rem;
  flex-wrap: wrap;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 0.65rem;
  padding: 0.55rem 0.75rem;
  background: color-mix(in srgb, var(--surface) 92%, var(--text) 0%);
}

.rooms-directory-name {
  font-weight: 600;
  font-size: 0.95rem;
  margin: 0;
  word-break: break-word;
  flex: 0 1 auto;
  min-width: min(5rem, 100%);
}

.rooms-directory-name-input {
  flex: 0 1 auto;
  min-width: min(4.5rem, 38%);
  max-width: 8rem;
  margin: 0;
  padding: 0.35rem 0.5rem;
  font-weight: 600;
  font-size: 0.95rem;
  line-height: 1.35;
  color: var(--text);
  background: var(--surface);
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 0.45rem;
}

.rooms-directory-name-input:hover,
.rooms-directory-name-input:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  outline: none;
}

.rooms-directory-select-wrap {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  display: flex;
  justify-content: flex-end;
}

.rooms-directory-kind-select {
  width: 100%;
  max-width: 14rem;
  min-width: 10rem;
  padding: 0.4rem 2rem 0.4rem 0.55rem;
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--text);
  background: var(--surface);
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 0.45rem;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
}

.rooms-directory-kind-select:hover,
.rooms-directory-kind-select:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  outline: none;
}

.main-schedule-editor-table {
  max-width: none;
  width: 100%;
  table-layout: fixed;
}

.main-schedule-editor-table .sticky-num {
  width: 2.6rem;
  min-width: 2.6rem;
  max-width: 2.6rem;
  text-align: center;
}

.main-schedule-editor-table th:not(.sticky-num),
.main-schedule-editor-table td:not(.sticky-num) {
  width: calc((100% - 2.6rem) / 5);
  min-width: 0;
}

.main-schedule-editor-table th,
.main-schedule-editor-table td {
  vertical-align: middle !important;
  text-align: center !important;
}

.main-schedule-editor-table thead th {
  vertical-align: middle !important;
  text-align: center !important;
}

.main-schedule-editor-wd-head__inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  flex-wrap: wrap;
  max-width: 100%;
}

.main-schedule-editor-wd-name {
  font-weight: 600;
}

.main-schedule-add-lesson-btn {
  padding: 0.1rem 0.45rem;
  min-width: 1.75rem;
  line-height: 1.25;
  font-weight: 700;
  font-size: 0.95rem;
}

.main-schedule-cell-edit-lesson-row {
  margin-top: 0.5rem;
}

.main-schedule-cell-edit-lesson-label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: flex-start;
  max-width: 12rem;
}

.main-schedule-cell-edit-lesson-label .extra-lesson-dialog__select {
  width: 100%;
}

.main-schedule-editor-table .main-schedule-editor-raw {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.main-schedule-editor-table .main-schedule-editor-raw:disabled {
  opacity: 0.78;
  cursor: not-allowed;
}

.main-schedule-cell-view {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 3.2rem;
  padding: 0.35rem 0.45rem;
  border-radius: 6px;
  border: 1px dashed color-mix(in srgb, var(--border) 75%, transparent);
  cursor: grab;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.35;
  text-align: center;
}

.main-schedule-cell-view:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}

.main-schedule-cell-view--dragging {
  opacity: 0.6;
  cursor: grabbing;
}

.main-schedule-cell-view--drag-over {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  outline: 2px dashed color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 1px;
}

#dialogMainScheduleCellEdit {
  max-width: min(52rem, 98vw);
}

.main-schedule-cell-segments-editor {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  min-width: 0;
}

.main-schedule-cell-preset-toolbar {
  align-items: flex-end;
}

.main-schedule-cell-icon-btn {
  min-width: 2.5rem;
  min-height: 2.5rem;
  padding: 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.main-schedule-cell-add-toolbar {
  justify-content: flex-start;
}

.main-schedule-cell-preset-label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: min(280px, 100%);
}

.main-schedule-seg-row {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.7fr) minmax(0, 1.05fr) minmax(0, 0.75fr) auto;
  gap: 0.5rem 0.65rem;
  align-items: end;
}

/* Одна строка сегмента: без колонки «Подгруппа» — иначе сетка ломается при display:none у скрытого поля */
.main-schedule-cell-segments-editor:not(.main-schedule-segments--multi) .main-schedule-seg-row {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.05fr) minmax(0, 0.75fr) auto;
}

@media (max-width: 36rem) {
  .main-schedule-seg-row {
    grid-template-columns: 1fr;
  }
}

/* .main-schedule-seg-label { display: flex } перебивает поведение атрибута hidden у UA */
.main-schedule-seg-label--subgroup[hidden] {
  display: none !important;
}

.main-schedule-seg-label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
  font-size: 0.88rem;
}

.main-schedule-seg-lbl {
  color: var(--muted, #666);
  font-weight: 500;
}

.main-schedule-seg-remove {
  min-width: 2.25rem;
  padding: 0.35rem 0.5rem;
}

.main-schedule-seg-subgroup-select {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.main-schedule-times-table {
  max-width: 32rem;
}

.main-schedule-times-table .sticky-num {
  width: 2.6rem;
  min-width: 2.6rem;
  max-width: 2.6rem;
  text-align: center;
}

.main-schedule-times-table .main-schedule-editor-time {
  min-width: 12rem;
}

.main-schedule-times-grid .main-schedule-editor-time {
  min-width: 8rem;
}

.main-schedule-time-input {
  min-width: 5rem;
  width: 5.2rem;
}

.lesson-times-mini-input {
  width: 7rem;
  min-width: 6.5rem;
}

.lesson-times-mini-input--duration {
  width: 5.5rem;
  min-width: 5rem;
}

.main-schedule-times-table .main-schedule-time-input:disabled {
  opacity: 0.78;
  cursor: not-allowed;
}

.main-schedule-times-table .lesson-times-mini-input:disabled {
  opacity: 0.78;
  cursor: not-allowed;
}

.lesson-times-toolbar {
  align-items: flex-end;
}

.main-schedule-toolbar {
  align-items: flex-end;
}

.main-schedule-class-inline {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 0.5rem !important;
}

.main-schedule-class-inline select {
  min-width: 9rem;
}

.main-schedule-show-parallels {
  margin: 0;
}

.lesson-times-edit-btn,
.main-schedule-edit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  min-width: 2.2rem;
  padding: 0;
}
.lesson-times-edit-btn .btn-icon-square-glyph,
.main-schedule-edit-btn .btn-icon-square-glyph {
  display: block;
}

.icon-btn-plain {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.icon-btn-plain:hover,
.icon-btn-plain:focus-visible {
  background: transparent !important;
  border-color: var(--accent) !important;
  color: var(--accent);
}

.worktime-absence-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.worktime-absence-quick-btn {
  padding: 0.34rem 0.56rem;
  min-height: 2rem;
  border-radius: 999px;
  font-size: 0.8rem;
  line-height: 1.15;
  white-space: nowrap;
}

.registry-table--teachers {
  max-width: none;
}

.registry-table--teachers th,
.registry-table--teachers td {
  text-align: center !important;
  vertical-align: middle !important;
}

.teacher-registry-two-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem 1rem;
  align-items: start;
}

.teacher-registry-col-title {
  margin: 0 0 0.45rem;
  font-size: 0.95rem;
  font-weight: 650;
}

.teacher-registry-col .registry-table--teachers {
  width: 100%;
}

@media (max-width: 1200px) {
  .teacher-registry-two-cols {
    grid-template-columns: 1fr;
  }
}

.registry-table .reg-drag-col {
  width: 2rem;
}

.registry-table .reg-drag-handle {
  cursor: grab;
  user-select: none;
  text-align: center;
  color: var(--muted, #888);
  font-size: 1rem;
  line-height: 1.2;
}

.registry-table .reg-drag-handle:active {
  cursor: grabbing;
}

.registry-table tr.dragging {
  opacity: 0.55;
}

.registry-table .reg-num-cell {
  width: 3rem;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.registry-table--teachers .reg-kz-cell {
  width: 4.25rem;
  max-width: 5rem;
  font-variant-numeric: tabular-nums;
}

.registry-table .reg-order-label {
  display: inline-block;
  min-width: 2ch;
}

.registry-table .reg-cell-text {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.registry-table--teachers td:nth-child(2) .reg-cell-text {
  text-align: center;
}

.registry-table .btn-sm {
  font-size: 0.82rem;
  padding: 0.22rem 0.42rem;
}

/* Узкая колонка «Код доступа»: по ширине текста (код / «Сохранён» / «Не задан»). */
.registry-table--teachers th.teacher-access-col,
.registry-table--teachers td.teacher-access-col {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}

.registry-table--teachers .teacher-actions-cell {
  min-width: 7.5rem;
  width: 8.5rem;
  vertical-align: middle;
}

.registry-table--teachers .teacher-access-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
}

.registry-table--teachers .teacher-access-row .teacher-access-code {
  flex: 0 1 auto;
  text-align: center;
}

.registry-table--teachers .teacher-row-actions {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
}

.registry-table--teachers .registry-actions-cell {
  width: 3rem;
  text-align: center;
  vertical-align: middle;
}

.registry-table .btn.btn-icon {
  padding: 0.28rem;
  min-width: 2rem;
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.registry-table .btn.btn-icon .reg-icon {
  display: block;
}

.teacher-registry-dialog {
  max-width: min(34rem, 95vw);
}

.teacher-code-plain {
  font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.telegram-class-codes-toolbar {
  margin-bottom: 0.75rem;
}

.telegram-class-codes-generate-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0.75rem;
  border-radius: 8px;
}

.telegram-class-codes-generate-btn__icon {
  display: inline-flex;
  line-height: 0;
}

.telegram-class-codes-generate-btn__icon .reg-icon {
  display: block;
}

.telegram-class-codes-table .telegram-class-code-actions-cell {
  width: 5.5rem;
  text-align: right;
  vertical-align: middle;
}

.telegram-class-codes-table .telegram-class-code-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.28rem;
}

.telegram-class-codes-table .btn.btn-icon {
  padding: 0.28rem;
  min-width: 2rem;
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  border-radius: 8px;
}

.telegram-class-codes-table .btn.btn-icon:hover {
  background: rgba(25, 118, 210, 0.08);
}

.telegram-class-codes-table .btn.btn-icon .reg-icon {
  display: block;
}

.telegram-class-codes-table .telegram-class-code-cell code {
  font-size: 0.95rem;
}

.student-class-access-editor {
  margin-top: 0.75rem;
}

.student-codes-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
}

.student-codes-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem 1.5rem;
  align-items: start;
}

@media (max-width: 720px) {
  .student-codes-grid {
    grid-template-columns: 1fr;
  }
}

.student-codes-col-title {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 600;
}

.student-codes-table {
  max-width: none;
  width: 100%;
}

.student-codes-table .student-code-cell {
  min-width: 8rem;
}

.student-code-plain {
  font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.student-codes-other {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border, rgba(0, 0, 0, 0.12));
}

.class-subgroups-block {
  margin-top: 1.2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border, rgba(0, 0, 0, 0.12));
}

.class-subgroups-toolbar {
  align-items: flex-end;
  gap: 0.55rem 0.9rem;
  margin-bottom: 0.7rem;
}

.class-subgroups-table {
  width: 100%;
  max-width: none;
  table-layout: fixed;
}

.class-settings-class-head-row td {
  text-align: center;
  vertical-align: middle;
  font-weight: 600;
}

.class-settings-class-head-cell {
  padding: 0.45rem 0.35rem;
}

.class-settings-class-head-content {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.class-settings-subgroups-row td,
.class-settings-subgroup-cell {
  padding: 0.45rem 0.55rem 0.6rem;
  vertical-align: middle;
}

.class-settings-subgroups-inner {
  display: grid;
  gap: 0.45rem;
}

.class-settings-subgroups-toolbar {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.class-subgroup-summary-list {
  display: grid;
  gap: 0.35rem;
}

.class-subgroup-summary-item {
  display: block;
  min-width: 0;
}

.class-subgroup-summary-subject {
  font-weight: 600;
  text-align: center;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.class-subgroup-summary-detail {
  margin-top: 0.25rem;
  padding-left: 0;
  font-size: 0.94em;
  color: color-mix(in srgb, var(--text) 88%, transparent);
  text-align: center;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.class-subgroup-item {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) 5rem minmax(200px, 1fr) auto;
  gap: 0.45rem;
  align-items: center;
}

/* Без [open] не задавать display — иначе перебивается UA `dialog:not([open]) { display:none }`
   и форма видна в потоке под таблицей. Flex только для открытого модального окна. */
.class-subgroups-dialog {
  width: min(720px, 94vw);
  max-width: 96vw !important;
  max-height: min(92vh, 880px);
}

.class-subgroups-dialog[open] {
  display: flex;
  flex-direction: column;
}

.class-subgroups-dialog .extra-lesson-dialog__form {
  width: 100%;
  max-height: min(92vh, 880px);
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.class-subgroups-dialog .extra-lesson-dialog__head {
  flex-shrink: 0;
}

.class-subgroups-dialog__fields {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem !important;
  padding-top: 0.25rem !important;
}

.class-subgroups-dialog .extra-lesson-dialog__footer {
  flex-shrink: 0;
  margin-top: auto;
}

.class-subgroups-edit-toolbar {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-shrink: 0;
  gap: 0.5rem;
}

.class-subgroups-dialog .btn-class-subject-add {
  border-radius: 0.6rem;
  padding: 0.45rem 0.9rem;
  font-weight: 600;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--text);
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.class-subgroups-dialog .btn-class-subject-add:hover {
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  border-color: color-mix(in srgb, var(--accent) 65%, var(--border));
  box-shadow: 0 2px 8px color-mix(in srgb, var(--accent) 18%, transparent);
}

/* Прокрутка списка предметов; шапка и футер диалога остаются на месте */
.class-subgroups-scroll {
  flex: 1 1 auto;
  min-height: 0;
  max-height: min(56vh, 520px);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0.35rem 0.5rem 0.5rem 0;
  margin-right: -0.15rem;
  scrollbar-gutter: stable;
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--bg) 35%, transparent);
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.class-subgroups-scroll::-webkit-scrollbar {
  width: 9px;
}

.class-subgroups-scroll::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 6px;
}

.class-subgroups-scroll::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--muted) 45%, transparent);
  border-radius: 6px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

.class-subgroups-scroll::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--muted) 65%, transparent);
  background-clip: padding-box;
}

.class-subgroups-edit-rows {
  display: grid;
  gap: 0;
  min-width: 0;
}

/* Список предметов класса: карточки */
.class-subjects-list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.class-subject-card {
  padding: 0.85rem 1rem;
  border-radius: 0.65rem;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--surface);
  box-shadow:
    0 1px 2px color-mix(in srgb, var(--text) 0.04, transparent),
    0 4px 14px color-mix(in srgb, var(--text) 0.05, transparent);
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.class-subject-card:hover {
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
  box-shadow:
    0 1px 2px color-mix(in srgb, var(--text) 0.06, transparent),
    0 6px 18px color-mix(in srgb, var(--text) 0.07, transparent);
}

.class-subject-card:last-child {
  margin-bottom: 0.15rem;
}

/* Несколько подгрупп: название + «Подгрупп» + удалить — одна строка; строки подгрупп ниже */
.class-subject-card__main--multi {
  display: block;
}

.class-subject-card__row-one--multi {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  width: 100%;
  min-width: 0;
}

.class-subject-card__row-one--multi .class-subject-card__subject {
  flex: 1 1 auto;
  min-width: 0;
}

.class-subject-card__row-one--multi .class-subject-groupcount-label {
  flex-shrink: 0;
  white-space: nowrap;
  font-size: 0.82rem;
}

.class-subject-card__row-one--multi .subgroup-draft-remove {
  flex-shrink: 0;
}

/* Весь класс без деления: одна строка — предмет | подгруппы | учитель | удалить */
.class-subject-card__main--single {
  display: block;
}

.class-subject-card__row-one {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.45rem 0.6rem;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.class-subject-card__main--single .class-subject-card__subject {
  flex: 1 1 auto;
  min-width: 0;
}

.class-subject-card__row-one .class-subject-add-subgroups-btn {
  flex-shrink: 0;
}

.class-subject-card__row-one .class-subject-card__teacher-select {
  flex: 0 1 15rem;
  min-width: 9rem;
  max-width: 100%;
}

.class-subject-card__row-one .subgroup-draft-remove {
  flex-shrink: 0;
}

.class-subject-card__subject {
  font-weight: 600;
  font-size: 1.02rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: color-mix(in srgb, var(--bg) 40%, var(--surface));
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.class-subject-card__subject:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent);
}

.class-subject-card__subgroups {
  margin-top: 0.65rem;
  padding: 0.6rem 0.65rem 0.45rem;
  border-radius: 0.5rem;
  background: color-mix(in srgb, var(--bg) 55%, transparent);
  border: 1px dashed color-mix(in srgb, var(--border) 75%, transparent);
  display: grid;
  gap: 0.45rem;
}

.class-subject-card__row-one select,
.class-subject-card__subgroups select {
  min-height: 2.45rem;
  padding: 0.4rem 0.55rem;
  border-radius: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: color-mix(in srgb, var(--bg) 45%, var(--surface));
  font: inherit;
  font-size: 0.92rem;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.class-subject-card__row-one select:focus,
.class-subject-card__subgroups select:focus,
.class-subject-card__subgroups input[type='text']:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}

.class-subject-card__subgroups input[type='text'] {
  min-height: 2.45rem;
  padding: 0.4rem 0.55rem;
  border-radius: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--surface);
  font: inherit;
  font-size: 0.92rem;
}

.class-subject-groupcount-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.class-subject-groupcount-label .class-subject-groupcount {
  min-width: 5.5rem;
}

.class-subgroups-dialog .btn.btn-icon {
  padding: 0.28rem;
  min-width: 2rem;
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.class-subgroups-dialog .btn.btn-icon .reg-icon,
.class-subgroups-dialog .btn.btn-icon .btn-extra-lesson-delete-icon,
.class-subgroups-dialog .btn.btn-icon .class-subject-add-subgroups-btn__icon {
  display: block;
}

.class-subgroup-item-modal {
  grid-template-columns: minmax(120px, 1fr) 4.2rem auto;
  align-items: start;
}

.class-subgroup-people-grid {
  grid-column: 1 / -1;
  display: grid;
  gap: 0.38rem;
}

.class-subgroup-person-row {
  display: grid;
  grid-template-columns: 1.6rem minmax(72px, 1fr) minmax(140px, 1fr);
  gap: 0.35rem 0.45rem;
  align-items: center;
}

.class-subgroup-person-index {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--muted);
  width: 1.5rem;
  height: 1.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.35rem;
  background: color-mix(in srgb, var(--muted) 14%, transparent);
}

.class-subgroup-item-modal input,
.class-subgroup-item-modal select {
  width: 100%;
  min-width: 0;
}

.class-subgroup-empty {
  padding: 0.1rem 0.1rem 0.2rem;
}

.class-subgroups-scroll .class-subgroup-empty {
  padding: 1.5rem 1rem;
  margin: 0;
  text-align: center;
  border-radius: 0.5rem;
  background: color-mix(in srgb, var(--surface) 80%, transparent);
}

@media (max-height: 700px) {
  .class-subgroups-scroll {
    max-height: min(48vh, 420px);
  }
}

.class-settings-parallels-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0.9rem 1rem;
  align-items: start;
}

.class-settings-parallel-block .class-shift-table {
  width: 100%;
  max-width: none;
}

.class-shift-table th:nth-child(2),
.class-shift-table td:nth-child(2) {
  width: 8.25rem;
  text-align: center;
}

.class-shift-table th:nth-child(3),
.class-shift-table td:nth-child(3) {
  width: 9.5rem;
  text-align: center;
}

.student-codes-show-young {
  display: inline-flex;
  margin-top: 0.35rem;
}

.teacher-weekday-schedule {
  margin: 0.9rem 0 1.2rem;
}

.teacher-weekday-schedule h4 {
  margin: 0 0 0.45rem;
  font-size: 0.95rem;
}

.teacher-weekday-schedule-table {
  width: 100%;
}

.teacher-sheet th,
.teacher-sheet td {
  white-space: nowrap;
  max-width: 140px;
  font-size: 0.82rem;
}

/* Иначе nowrap с td перекрывает .teacher-cell и чипы накладываются друг на друга */
.teacher-sheet td.teacher-cell {
  white-space: normal;
}

.teacher-sheet thead th:not(.sticky-name) {
  text-align: center;
}

.teacher-sheet .sticky-num {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 3rem;
  min-width: 3rem;
  max-width: 3rem;
  text-align: center;
  background: var(--table-sticky-bg);
  box-shadow: var(--shadow-sticky);
  font-weight: 600;
}

.teacher-sheet .sticky-name {
  position: sticky;
  left: 3rem;
  z-index: 2;
  min-width: 11.5rem;
  max-width: 260px;
  white-space: normal;
  background: var(--table-sticky-bg);
  box-shadow: var(--shadow-sticky);
  font-weight: 600;
}

.teacher-sheet tbody .sticky-name {
  font-weight: 500;
}

.teacher-sheet thead .sticky-num,
.teacher-sheet thead .sticky-name {
  z-index: 3;
  background: var(--table-sticky-head-bg);
}

/* Строка учителя с отметкой отсутствия — общий оттенок по цвету причины */
.teacher-sheet tbody tr.teacher-row--absent td {
  background: color-mix(in srgb, var(--absence-tint) 28%, var(--surface));
}

.teacher-sheet tbody tr.teacher-row--absent .sticky-num,
.teacher-sheet tbody tr.teacher-row--absent .sticky-name {
  background: color-mix(in srgb, var(--absence-tint) 28%, var(--table-sticky-bg));
}

#panelTeachers.teacher-edit-active .teacher-sheet tbody tr.teacher-row--absent td.teacher-cell--tap:hover {
  background: color-mix(in srgb, var(--absence-tint) 38%, var(--accent-dim));
}

.teacher-cell {
  white-space: normal;
  vertical-align: middle;
  line-height: 1.35;
  max-width: 160px;
  text-align: center;
}

/* Урок с заменой: зелёная подсветка и акцент на классах */
.teacher-sheet tbody td.teacher-cell--has-sub {
  background: rgba(34, 197, 94, 0.16);
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.45);
  border-radius: 4px;
}

/* Последний столбец: без скругления справа — заливка не отрывается от края таблицы */
.teacher-sheet.teacher-sheet--subs tbody td.teacher-lesson-col--day-end.teacher-cell--has-sub {
  border-radius: 4px 0 0 4px;
}

.teacher-cell--has-sub .teacher-plain-class-label,
.teacher-cell--has-sub .teacher-class-chip {
  font-weight: 600;
}

/* Ячейки, где состав/порядок классов не совпадает с импортом (просмотр и редактирование — в реальном времени после каждого действия) */
.teacher-cell--altered-view {
  background: var(--class-pill-warn-bg);
  box-shadow: inset 0 0 0 1px var(--class-pill-warn-border);
  border-radius: 4px;
  transition:
    background 0.14s ease,
    box-shadow 0.14s ease;
}

.teacher-sheet.teacher-sheet--subs tbody td.teacher-lesson-col--day-end.teacher-cell--altered-view {
  border-radius: 4px 0 0 4px;
}

#panelTeachers.teacher-edit-active .teacher-cell--chips.teacher-cell--altered-view {
  background: rgba(234, 179, 8, 0.18);
}

.teacher-sheet tbody tr.teacher-row--absent td.teacher-cell--altered-view {
  background: color-mix(in srgb, var(--class-pill-warn-bg) 55%, color-mix(in srgb, var(--absence-tint) 28%, var(--surface)));
  box-shadow: inset 0 0 0 1px var(--class-pill-warn-border);
}

#panelTeachers.teacher-edit-active
  .teacher-sheet
  tbody
  tr.teacher-row--absent
  td.teacher-cell--chips.teacher-cell--altered-view {
  background: color-mix(in srgb, rgba(234, 179, 8, 0.28) 50%, color-mix(in srgb, var(--absence-tint) 28%, var(--surface)));
}

/* Совмещение подгрупп — жёлтый фон, красный текст (сетка учителя / класса) */
.teacher-cell--merge-coverage {
  background: var(--merge-coverage-bg);
  box-shadow: inset 0 0 0 1px var(--merge-coverage-border);
  border-radius: 4px;
  color: var(--merge-coverage-text);
  transition:
    background 0.14s ease,
    box-shadow 0.14s ease,
    color 0.14s ease;
}

.teacher-sheet.teacher-sheet--subs tbody td.teacher-lesson-col--day-end.teacher-cell--merge-coverage {
  border-radius: 4px 0 0 4px;
}

#panelTeachers.teacher-edit-active .teacher-cell--chips.teacher-cell--merge-coverage {
  background: color-mix(in srgb, var(--merge-coverage-bg) 92%, transparent);
  color: var(--merge-coverage-text);
}

.teacher-sheet tbody tr.teacher-row--absent td.teacher-cell--merge-coverage {
  background: color-mix(in srgb, var(--merge-coverage-bg) 55%, color-mix(in srgb, var(--absence-tint) 28%, var(--surface)));
  box-shadow: inset 0 0 0 1px var(--merge-coverage-border);
  color: var(--merge-coverage-text);
}

#panelTeachers.teacher-edit-active
  .teacher-sheet
  tbody
  tr.teacher-row--absent
  td.teacher-cell--chips.teacher-cell--merge-coverage {
  background: color-mix(
    in srgb,
    color-mix(in srgb, var(--merge-coverage-bg) 85%, transparent) 50%,
    color-mix(in srgb, var(--absence-tint) 28%, var(--surface))
  );
  color: var(--merge-coverage-text);
}

/* Кабинет/чипы задают muted — в совмещении весь текст красный */
.teacher-cell--merge-coverage .class-slot-sep,
.teacher-cell--merge-coverage .class-slot-room,
.teacher-cell--merge-coverage .class-chip-sep,
.teacher-cell--merge-coverage .class-chip-room,
.teacher-cell--merge-coverage .teacher-class-chip--base,
.teacher-cell--merge-coverage .teacher-class-sub--duty,
.teacher-cell--merge-coverage .teacher-plain-class-sep,
.teacher-cell--merge-coverage .teacher-plain-class-subgroup,
.teacher-cell--merge-coverage .teacher-class-chip-subgroup,
.teacher-cell--merge-coverage .muted {
  color: var(--merge-coverage-text);
}

.teacher-cell--merge-coverage .teacher-plain-class-pick {
  color: var(--merge-coverage-text);
  text-decoration-color: color-mix(in srgb, var(--merge-coverage-text) 45%, transparent);
}

.teacher-cell--merge-coverage .teacher-plain-class-pick:hover {
  color: var(--merge-coverage-text);
  background: color-mix(in srgb, var(--merge-coverage-bg) 55%, var(--surface));
}

/* Цель сброса во время перетаскивания */
.teacher-cell--chips.teacher-cell--drag-over {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
  border-radius: 4px;
}

.top {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.top h1,
.app-title {
  margin: 0 0 0.25rem;
  font-size: 1.1rem;
  font-weight: 650;
  line-height: 1.3;
  max-width: min(100%, 36rem);
}

.app-top-logo-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.2rem;
}

.app-top-logo-image {
  display: block;
  height: 6.6rem;
  width: auto;
  object-fit: contain;
}

@media (max-width: 900px) {
  .top-row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }

  .top-row-left {
    grid-column: auto;
    width: 100%;
    align-self: stretch;
  }

  .top-row .top-global-date-wrap.top-row-working-date {
    width: 100%;
    min-width: 0;
    margin-left: 0;
  }

  .top-row .top-global-date-wrap.top-row-working-date .toolbar-date-row {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .top-row .app-top-logo-wrap {
    grid-column: auto;
    justify-self: center;
    align-self: center;
  }

  .top-row .userbar {
    grid-column: auto;
    justify-self: stretch;
    width: 100%;
    min-width: 0;
  }

  .userbar {
    flex: 1 1 auto;
    min-width: 0;
  }
}

.tagline {
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
}

main {
  position: relative;
  padding: 1rem 1.5rem 2rem;
  max-width: 1100px;
}

.app-boot-splash {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: var(--bg);
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.app-boot-splash.is-visible {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

/* Initial boot: hide header chrome and published banner; keep logo + boot progress only */
body.app-booting .top-row-working-date,
body.app-booting .top-row-mode-buttons,
body.app-booting .top-header-progress-row.admin-only {
  display: none !important;
}

body.app-booting header.top .userbar {
  display: none !important;
}

body.app-booting #subsPublishedBanner {
  display: none !important;
}

.app-boot-splash__text {
  margin: 0;
  max-width: 28em;
  font-size: clamp(1rem, 0.9vw + 0.75rem, 1.25rem);
  font-weight: 500;
  font-style: italic;
  line-height: 1.35;
  text-align: center;
  color: #4ade80;
}

[data-theme='light'] .app-boot-splash__text {
  color: #15803d;
}

.app-boot-splash__inner {
  width: min(560px, 92vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.95rem;
}

.app-boot-progress {
  width: min(420px, 88vw);
}

.app-boot-progress--top {
  width: min(520px, 96vw);
}

.app-boot-progress--top .app-boot-progress__label {
  text-align: left;
  margin-bottom: 0.25rem;
}

.app-boot-progress__label {
  font-size: 0.86rem;
  color: var(--muted);
  text-align: center;
  margin-bottom: 0.35rem;
}

.app-boot-progress__track {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--line) 68%, transparent);
  overflow: hidden;
}

.app-boot-progress__bar {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #22c55e 0%, #3b82f6 100%);
  transition: width 0.22s ease;
}

body.wide-admin-layout main {
  max-width: none;
}

.panel {
  display: none;
}

.panel.active {
  display: block;
}

#panelTeachers {
  width: calc(100vw - 3rem);
  max-width: none;
}

/* Как у сетки учителей: ширина по окну, без «поля» справа от узкого main */
#panelClassGrid {
  width: calc(100vw - 3rem);
  max-width: none;
}

#panelRoomOccupancy {
  width: calc(100vw - 3rem);
  max-width: none;
}

.room-occupancy-layout {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

.room-occupancy-main {
  flex: 1 1 auto;
  min-width: 0;
  max-width: calc(100% - 13.5rem);
  overflow-x: auto;
}

.class-quarantine-sidebar {
  flex: 0 0 12.5rem;
  max-width: 12.5rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border, #c5c9d0);
  border-radius: 0.5rem;
  background: var(--surface-elevated, rgba(255, 255, 255, 0.04));
}

.class-quarantine-sidebar__title {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 600;
}

.class-quarantine-empty {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.35;
}

.class-quarantine-sidebar-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.class-quarantine-sidebar-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  padding: 0.35rem 0.4rem;
  border-radius: 0.35rem;
  background: var(--chip-bg, rgba(0, 0, 0, 0.04));
}

.class-quarantine-sidebar__label {
  font-weight: 600;
  font-size: 0.85rem;
  line-height: 1.25;
  min-width: 0;
}

.class-quarantine-sidebar-item .class-quarantine-del {
  flex-shrink: 0;
}

.class-quarantine-add-dialog__lead {
  margin: 0 0 0.75rem;
}

.class-quarantine-add-dialog label {
  display: block;
  margin-bottom: 0.65rem;
}

.class-quarantine-add-dialog select,
.class-quarantine-add-dialog input {
  display: block;
  width: 100%;
  margin-top: 0.25rem;
}

@media (max-width: 1100px) {
  .room-occupancy-layout {
    flex-direction: column;
  }

  .room-occupancy-main {
    max-width: 100%;
  }

  .class-quarantine-sidebar {
    flex: 1 1 auto;
    max-width: none;
    width: 100%;
  }
}

/* Расписание учителя / класса: шире, чем узкий main — используем ширину окна */
#panelSchedule {
  width: calc(100vw - 3rem);
  max-width: none;
}

/* Расписание класса (классный): та же ширина, что у вкладки «Расписание» */
#panelTeacherClassSchedule {
  width: calc(100vw - 3rem);
  max-width: none;
}

body.wide-admin-layout #panelAdmin {
  width: calc(100vw - 3rem);
  max-width: none;
}

.teacher-journal-toolbar {
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.teacher-class-schedule-toolbar {
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.45rem 1rem;
}

/* Диалог «Добавить урок / мероприятие» (вкладка «Работа с классами») */
.extra-lesson-dialog {
  max-width: min(26rem, 94vw);
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 1rem;
  background: var(--surface);
  color: var(--text);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--text) 0.06, transparent),
    0 24px 48px rgba(0, 0, 0, 0.35),
    0 8px 16px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}

.extra-lesson-dialog::backdrop {
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
}

.extra-lesson-dialog__form {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.extra-lesson-dialog__accent {
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--accent) 0%,
    color-mix(in srgb, var(--accent) 65%, #22d3ee) 100%
  );
}

.extra-lesson-dialog__head {
  padding: 1.15rem 1.5rem 0.85rem;
}

.extra-lesson-dialog__title {
  margin: 0 0 0.45rem;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.extra-lesson-dialog__subtitle {
  margin: -0.15rem 0 0.5rem;
  font-size: 0.88rem;
  font-weight: 500;
  line-height: 1.35;
}

textarea.extra-lesson-dialog__input.class-day-comment-textarea {
  min-height: 7.5rem;
  resize: vertical;
  line-height: 1.45;
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
}

.class-day-comment-dialog__footer {
  justify-content: flex-end;
}

.class-day-comment-dialog__footer .class-day-comment-dialog__clear {
  margin-right: auto;
}

.extra-lesson-dialog__fields {
  padding: 0.35rem 1.5rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.extra-lesson-dialog__grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.85rem 1rem;
}

@media (max-width: 520px) {
  .extra-lesson-dialog__grid2 {
    grid-template-columns: 1fr;
  }
}

.extra-lesson-dialog__field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}

.extra-lesson-dialog__label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.extra-lesson-dialog__input {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.65rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.55rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, var(--surface));
  color: var(--text);
  font: inherit;
  font-size: 0.95rem;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}

.extra-lesson-dialog__input:hover {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
}

.extra-lesson-dialog__input:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  box-shadow: 0 0 0 3px var(--accent-dim);
  background: var(--surface);
}

.extra-lesson-dialog__input::placeholder {
  color: var(--muted);
  opacity: 0.65;
}

.extra-lesson-dialog__select {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.65rem center;
  padding-right: 2.25rem;
}

[data-theme="light"] .extra-lesson-dialog__select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235a6a7d' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}

.extra-lesson-dialog__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  padding: 1rem 1.5rem 1.2rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}

/* Подвал диалогов: без заливки, иконка + подпись */
.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
  min-height: 2.5rem;
  padding: 0.45rem 0.85rem;
  margin: 0;
  font: inherit;
  font-weight: 600;
  font-size: 0.9rem;
  line-height: 1.2;
  cursor: pointer;
  border-radius: 0.55rem;
  border: 1px solid var(--border);
  background: transparent !important;
  color: var(--text);
  box-sizing: border-box;
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn:hover {
  background: color-mix(in srgb, var(--text) 0.07, transparent) !important;
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn--submit {
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
  color: var(--accent);
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn--submit:hover {
  background: color-mix(in srgb, var(--accent) 0.14, transparent) !important;
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn--muted {
  color: var(--muted);
  border-color: color-mix(in srgb, var(--border) 92%, var(--muted));
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn--muted:hover {
  color: var(--text);
  border-color: var(--border);
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn .dialog-footer-btn__icon {
  flex-shrink: 0;
  display: block;
  pointer-events: none;
}

.extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px var(--surface),
    0 0 0 4px color-mix(in srgb, var(--accent) 42%, transparent);
}

/* Диалог «Добавить отсутствующего» — более современная визуальная подача */
.teacher-absence-dialog {
  max-width: min(31rem, 94vw);
  border-radius: 1.15rem;
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 14%, transparent),
    0 30px 58px rgba(0, 0, 0, 0.36),
    0 12px 24px rgba(0, 0, 0, 0.16);
}

.teacher-absence-dialog .extra-lesson-dialog__head {
  padding-top: 1.25rem;
  padding-bottom: 0.95rem;
  background:
    radial-gradient(110% 140% at 100% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 55%),
    color-mix(in srgb, var(--surface) 88%, transparent);
}

.teacher-absence-dialog .extra-lesson-dialog__fields {
  gap: 1.1rem;
  padding-top: 0.7rem;
}

.teacher-absence-dialog .extra-lesson-dialog__field {
  padding: 0.55rem 0.6rem 0.7rem;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 0.75rem;
  background: color-mix(in srgb, var(--bg) 30%, var(--surface));
}

.teacher-absence-dialog .extra-lesson-dialog__label {
  letter-spacing: 0.045em;
}

.teacher-absence-dialog .extra-lesson-dialog__input {
  min-height: 2.75rem;
  border-radius: 0.68rem;
}

.teacher-absence-dialog .extra-lesson-dialog__select {
  appearance: auto;
  -webkit-appearance: menulist;
  background-image: none;
  padding-right: 0.75rem;
}

.teacher-absence-dialog .extra-lesson-dialog__footer {
  padding-top: 0.9rem;
}

.teacher-absence-dialog__hint {
  margin: 0;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.35;
}

@media (max-width: 380px) {
  .extra-lesson-dialog__footer {
    flex-direction: column;
    align-items: stretch;
  }
  .extra-lesson-dialog__footer .extra-lesson-dialog__footer-btn {
    width: 100%;
  }
}

.extra-lesson-dialog__subject-row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0.5rem;
  min-width: 0;
}

.extra-lesson-dialog__subject-row .extra-lesson-dialog__select {
  flex: 1 1 auto;
  min-width: 0;
}

/* Нативный select: иначе appearance:none + background-image даёт артефакты (Windows/Chromium), особенно в grid2. */
.extra-lesson-dialog__select.extra-lesson-dialog__select--subject-native,
#classExtraLessonSubject.extra-lesson-dialog__select--subject-native,
.extra-lesson-dialog__select.extra-lesson-dialog__select--teacher-native,
#classExtraLessonTeacher.extra-lesson-dialog__select--teacher-native,
.extra-lesson-dialog__select.extra-lesson-dialog__select--lesson-native,
#homeroomClassHourLesson.extra-lesson-dialog__select--lesson-native {
  appearance: auto;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  background-image: none !important;
  padding-right: 0.75rem;
  color: var(--text);
}

[data-theme='light'] .extra-lesson-dialog__select.extra-lesson-dialog__select--subject-native,
[data-theme='light'] #classExtraLessonSubject.extra-lesson-dialog__select--subject-native,
[data-theme='light'] .extra-lesson-dialog__select.extra-lesson-dialog__select--teacher-native,
[data-theme='light'] #classExtraLessonTeacher.extra-lesson-dialog__select--teacher-native,
[data-theme='light'] .extra-lesson-dialog__select.extra-lesson-dialog__select--lesson-native,
[data-theme='light'] #homeroomClassHourLesson.extra-lesson-dialog__select--lesson-native {
  background-image: none !important;
}

.extra-lesson-dialog__add-subject-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.65rem;
  padding: 0 0.55rem;
  box-sizing: border-box;
  color: var(--text);
}

.extra-lesson-dialog__add-subject-btn .reg-icon {
  display: block;
}

.extra-lesson-dialog__new-subject-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.5rem;
  margin-top: 0.55rem;
  width: 100%;
  min-width: 0;
}

.extra-lesson-dialog__new-subject-wrap[hidden] {
  display: none !important;
}

.extra-lesson-dialog__new-subject-input {
  flex: 1 1 auto;
  min-width: 0;
  width: 0;
}

.extra-lesson-dialog__new-subject-apply-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.65rem;
  padding: 0 0.55rem;
  box-sizing: border-box;
  color: var(--text);
}

.extra-lesson-dialog__new-subject-apply-btn .reg-icon {
  display: block;
}

/* Доп. урок: предмет и кнопка удаления в одну строку */
.class-slot-extra-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem;
  width: 100%;
  min-width: 0;
}

.class-slot-extra-row__lines {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.class-slot-extra-row__lines .class-slot-line {
  justify-content: center;
  text-align: center;
}

.btn-extra-lesson-delete {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 0.45rem;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition:
    color 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease;
}

.btn-extra-lesson-delete:hover {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 14%, transparent);
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
}

.btn-extra-lesson-delete:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px color-mix(in srgb, var(--accent) 45%, transparent);
}

.btn-extra-lesson-delete-icon {
  display: block;
  pointer-events: none;
}

.teacher-journal-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.88rem;
}

.teacher-journal-filter select {
  min-width: 11.5rem;
  max-width: 100%;
}

.teacher-journal-content {
  margin-top: 0.15rem;
  overflow-x: auto;
}

.teacher-journal-month-block {
  margin-bottom: 1.35rem;
}

.teacher-journal-month-block:last-child {
  margin-bottom: 0;
}

.teacher-journal-month-title {
  font-size: 1.02rem;
  font-weight: 650;
  margin: 0 0 0.45rem;
  letter-spacing: -0.02em;
  color: var(--text);
}

.teacher-journal-table {
  font-size: 0.86rem;
}

.teacher-journal-content > .teacher-journal-month-title:first-child {
  margin-top: 0;
}

.admin-journal-toolbar {
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.journals-global-toolbar {
  margin-bottom: 0.65rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.5rem;
  background: var(--surface-2, #f4f6f8);
  border: 1px solid var(--border, #d8dee6);
}

.journals-global-month-filter select {
  min-width: 10rem;
}

.journal-period-toolbar {
  align-items: flex-end;
  gap: 0.5rem 1rem;
}

.journal-week-filter.is-disabled select {
  opacity: 0.55;
}

.journal-period-nav {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  margin-bottom: 0.1rem;
}

.journal-period-nav-btn {
  min-width: 2rem;
  padding-left: 0.45rem;
  padding-right: 0.45rem;
  font-size: 1.1rem;
  line-height: 1;
}

.teacher-journal-week-block {
  margin: 0.85rem 0 1.1rem;
  padding-left: 0.35rem;
  border-left: 3px solid var(--border, #d8dee6);
}

.teacher-journal-week-title {
  font-size: 0.94rem;
  font-weight: 600;
  margin: 0 0 0.4rem;
  color: var(--muted, #5c6570);
}

.teacher-journal-week-badge {
  font-size: 0.92em;
  font-weight: 600;
  color: var(--muted, #5c6570);
}

/* Консультации/экзамены после окончания периода (в сетке «Составление замен») */
.teacher-post-year-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.1rem;
  padding: 0 0.35rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.02em;
  color: #7c2d12;
  background: #ffedd5;
  border: 1px solid #fed7aa;
}

[data-theme='dark'] .teacher-post-year-badge {
  color: #fdba74;
  background: rgba(234, 88, 12, 0.18);
  border-color: rgba(234, 88, 12, 0.38);
}

.teacher-post-year-stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.12rem;
  text-align: left;
}

.teacher-post-year-item {
  font-size: 0.78rem;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.teacher-post-year-timeonly {
  margin-top: 0.85rem;
  padding-top: 0.65rem;
  border-top: 1px dashed var(--border, #d0d7de);
}

.teacher-post-year-timeonly__title {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 650;
}

.substitution-timesheet-wrap {
  overflow-x: auto;
}

.substitution-timesheet-table {
  font-size: 0.86rem;
  border-collapse: collapse;
  min-width: 32rem;
}

.substitution-timesheet-table th,
.substitution-timesheet-table td {
  border: 1px solid var(--border, #d0d7de);
  padding: 0.28rem 0.45rem;
  text-align: center;
  vertical-align: middle;
}

.substitution-timesheet-table .substitution-timesheet-name-col,
.substitution-timesheet-table .substitution-timesheet-name {
  text-align: left;
  min-width: 11rem;
  max-width: 16rem;
  white-space: nowrap;
}

.substitution-timesheet-table .substitution-timesheet-fz-col,
.substitution-timesheet-table .substitution-timesheet-fz,
.substitution-timesheet-table .substitution-timesheet-ks-col,
.substitution-timesheet-table .substitution-timesheet-ks,
.substitution-timesheet-table .substitution-timesheet-kz-col,
.substitution-timesheet-table .substitution-timesheet-kz {
  font-weight: 650;
  min-width: 2.5rem;
}

.substitution-timesheet-table .substitution-timesheet-week-col {
  font-size: 0.78rem;
  white-space: nowrap;
  min-width: 4.5rem;
}

.substitution-timesheet-table .substitution-timesheet-total-col,
.substitution-timesheet-table .substitution-timesheet-total {
  font-weight: 650;
  min-width: 3rem;
}

.substitution-timesheet-table thead th {
  background: var(--surface-2, #eef1f4);
  font-weight: 650;
}

.substitution-timesheet-table .substitution-timesheet-num.substitution-timesheet-week--over {
  background: #fecaca;
  color: #b91c1c;
  font-weight: 700;
}

[data-theme='dark'] .substitution-timesheet-table .substitution-timesheet-num.substitution-timesheet-week--over {
  background: rgba(220, 38, 38, 0.28);
  color: #fca5a5;
}

.archive-journal-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem 1.25rem;
}

.archive-journal-toolbar-actions {
  margin-left: auto;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.substitution-archive-substitute-readonly {
  display: inline-block;
  min-width: 6rem;
  max-width: 100%;
  text-align: center;
}

.substitution-archive-journal-fio-readonly {
  display: inline-block;
  min-width: 4rem;
  max-width: 100%;
  text-align: left;
}

.substitution-archive-journal-fio-readonly.substitution-archive-journal-fio-over-kz,
.substitution-archive-journal-fio-readonly.substitution-archive-journal-fio-busy {
  color: var(--danger, #c62828);
  font-weight: 600;
}

.substitution-archive-journal-fio-stack {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.3rem 0.4rem;
  width: 100%;
  min-width: 0;
}

.substitution-archive-journal-fio-stack .substitution-archive-journal-fio-readonly {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.substitution-archive-journal-fio-stack .btn-archive-journal-fio-edit {
  flex-shrink: 0;
}

.substitution-archive-journal-fio-stack .btn-archive-journal-fio-edit .reg-icon {
  display: block;
}

.substitution-archive-journal-fio-editor {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.3rem;
  width: 100%;
  min-width: 0;
}

.substitution-archive-journal-fio-editor .substitution-archive-journal-fio-select,
.substitution-archive-journal-fio-editor .substitution-archive-journal-fio-select-inline {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  box-sizing: border-box;
  text-align: left;
  text-align-last: left;
}

.substitution-archive-journal-fio-editor-actions {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.3rem;
  margin-left: auto;
}

.substitution-archive-journal-fio-editor .btn-archive-journal-fio-save,
.substitution-archive-journal-fio-editor .btn-archive-journal-fio-cancel {
  flex-shrink: 0;
}

.substitution-archive-journal-fio-editor .reg-icon {
  display: block;
}

.substitution-archive-table .substitution-archive-journal-fio-cell {
  min-width: 8rem;
  max-width: 15rem;
  vertical-align: middle;
}

.substitution-archive-journal-fio-select:not(.substitution-archive-journal-fio-select-inline) {
  width: 100%;
  min-width: 0;
}

.substitution-archive-journal-fio-select-inline {
  min-width: 0;
}

.substitution-archive-journal-fio-select option {
  text-align: left;
}

.admin-journal-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.88rem;
}

.admin-journal-filter select {
  min-width: 11.5rem;
  max-width: 100%;
}

.admin-journal-content {
  margin-top: 0.15rem;
  overflow-x: auto;
}

.admin-journal-table {
  min-width: 52rem;
  font-size: 0.84rem;
}

.admin-journal-table.substitution-archive-table {
  min-width: 60rem;
}

.admin-journal-table th,
.admin-journal-table td {
  vertical-align: middle;
  text-align: center;
}

.admin-journal-table thead th.substitution-archive-col-head-wrap {
  white-space: normal;
  line-height: 1.22;
  font-weight: 600;
  vertical-align: middle;
  hyphens: auto;
  padding: 0.4rem 0.32rem;
  max-width: 6.75rem;
}

.substitution-archive-table thead th.substitution-archive-col-head-journal-fio {
  max-width: 5.85rem;
}

.substitution-archive-table thead th.substitution-archive-col-head-slot {
  max-width: 3.25rem;
  white-space: nowrap;
  font-weight: 600;
}

.substitution-archive-table .substitution-archive-slot-cell {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.substitution-archive-slot-readonly {
  display: inline-block;
}

.substitution-archive-slot-sep {
  margin: 0 0.12rem;
  opacity: 0.55;
}

.admin-journal-table .substitution-archive-could-select,
.admin-journal-table .substitution-archive-substitute-select {
  min-width: 11rem;
  max-width: 100%;
}

.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  align-items: flex-end;
  margin-bottom: 1rem;
}

.toolbar label,
.form-grid label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.85rem;
  color: var(--muted);
}

input[type="date"],
input[type="number"],
input[type="text"],
select,
textarea {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  padding: 0.45rem 0.55rem;
  font: inherit;
  min-width: 10rem;
}

textarea {
  width: 100%;
  min-width: 100%;
  resize: vertical;
}

.file input {
  max-width: 220px;
}

.btn {
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  padding: 0.38rem 0.52rem;
  font: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.btn.primary {
  background: var(--btn-primary);
  border-color: var(--btn-primary-border);
}

@media (hover: hover) and (pointer: fine) {
  .btn.primary:hover {
    background: var(--btn-primary-hover);
  }

  .btn.ghost:hover,
  .btn:hover {
    border-color: var(--muted);
  }
}

.btn.danger {
  color: var(--danger);
  border-color: var(--btn-danger-border);
  font-size: 0.85rem;
}

/* Квадратные кнопки-иконки: без заливки фона (только обводка). Перебивает .btn и .btn.primary. */
.btn.registry-square-btn {
  background: transparent;
}

.btn.primary.registry-square-btn {
  background: transparent;
  color: var(--btn-primary);
  border-color: var(--btn-primary-border);
}

@media (hover: hover) and (pointer: fine) {
  .btn.primary.registry-square-btn:hover {
    background: transparent;
    border-color: var(--btn-primary-hover);
    color: var(--btn-primary-hover);
  }
}

.btn.btn-icon-square {
  background: transparent;
}

.grid-wrap {
  overflow-x: auto;
}

.sheet {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.sheet th,
.sheet td {
  border: 1px solid var(--border);
  padding: 0.45rem 0.55rem;
  vertical-align: middle;
  text-align: center;
}

.sheet th {
  background: var(--table-header-bg);
  text-align: center;
  font-weight: 600;
}

.worktime-timesheet th,
.worktime-timesheet td {
  padding: 0.35rem 0.4rem;
  font-size: 0.82rem;
  white-space: nowrap;
}

.worktime-timesheet .worktime-teacher-head,
.worktime-timesheet .worktime-teacher-cell {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 180px;
  text-align: left;
  background: var(--surface);
}

.worktime-timesheet thead th {
  position: sticky;
  top: 0;
  z-index: 3;
}

.worktime-teacher-cell__inner {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.worktime-timesheet tr.worktime-row-selected td {
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
}

.worktime-timesheet tr.worktime-row-selected .worktime-teacher-cell {
  box-shadow: inset 3px 0 0 var(--accent);
  font-weight: 600;
}

.worktime-sick-extend-btn {
  width: 1.75rem;
  height: 1.75rem;
  min-width: 1.75rem;
  padding: 0;
}

.worktime-timesheet thead .worktime-teacher-head {
  z-index: 4;
  background: var(--table-header-bg);
}

.worktime-timesheet .worktime-day-head,
.worktime-timesheet .worktime-day-cell {
  min-width: 34px;
}

.worktime-timesheet .worktime-day-cell--absent {
  background: color-mix(in srgb, var(--class-pill-warn-bg) 40%, var(--surface));
  font-weight: 600;
}

.worktime-timesheet .worktime-day-cell--present {
  background: color-mix(in srgb, var(--class-pill-ok-bg) 28%, var(--surface));
}

.worktime-timesheet .worktime-day-cell--weekend {
  background: color-mix(in srgb, var(--surface-muted) 70%, var(--surface));
  color: var(--muted);
}

.worktime-timesheet .worktime-day-head--weekend {
  color: #b91c1c;
  font-weight: 700;
}

.worktime-timesheet .worktime-total-head,
.worktime-timesheet .worktime-total-cell {
  min-width: 56px;
  font-weight: 600;
}

#panelTelegramBot {
  max-width: 72rem;
}

.telegram-bot-panel {
  padding: 0 0.25rem 1.5rem;
}

.telegram-bot-lead {
  margin: 0 0 1rem;
}

.telegram-bot-block {
  margin-bottom: 1.35rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.telegram-bot-block-title {
  margin: 0 0 0.65rem;
  font-size: 1rem;
}

.telegram-bot-status-list {
  margin: 0 0 0.75rem;
  padding-left: 1.1rem;
}

.telegram-bot-status-actions {
  margin-top: 0.5rem;
}

.telegram-bot-status-ok {
  color: var(--ok, #0d7a4a);
  font-weight: 600;
}

.telegram-bot-status-warn {
  color: var(--warn, #b45309);
  font-weight: 600;
}

.telegram-bot-subscribers-table {
  margin-top: 0.5rem;
}

.telegram-bot-notify-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.65rem 1rem;
  margin-bottom: 0.65rem;
}

.telegram-bot-date-label {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  font-size: 0.82rem;
  color: var(--muted);
}

.telegram-bot-day-info-label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.82rem;
  color: var(--muted);
}

.telegram-bot-day-info-input {
  width: 100%;
  min-height: 4rem;
  resize: vertical;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font: inherit;
  font-size: 0.88rem;
  line-height: 1.4;
}

.telegram-bot-notify-hint {
  margin: 0.35rem 0 0.5rem;
  min-height: 1.2em;
}

.telegram-bot-help-list {
  margin: 0;
  padding-left: 1.1rem;
}

body.wide-admin-layout #panelTelegramBot {
  width: 100%;
}

#panelWorktimeJournal {
  position: relative;
}

#panelWorktimeJournal .worktime-month-corner {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: inline-flex;
  align-items: flex-end;
  gap: 0.5rem;
}

#panelWorktimeJournal .worktime-month-picker {
  display: inline-flex;
  flex-direction: column;
  gap: 0.24rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface) 88%, var(--surface-muted));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

#panelWorktimeJournal h2,
#panelWorktimeJournal .admin-journal-lead {
  padding-right: 330px;
}

#panelWorktimeJournal .worktime-month-picker__caption {
  font-size: 0.75rem;
  color: var(--muted);
  line-height: 1.1;
}

#panelWorktimeJournal .worktime-month-picker input[type='month'] {
  min-width: 170px;
  border-radius: 9px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 0.33rem 0.45rem;
}

#panelWorktimeJournal #btnWorktimeGenerateMonth {
  width: 46px;
  min-width: 46px;
  height: 46px;
  border-radius: 12px;
}

#panelWorktimeJournal #btnWorktimeGenerateMonth .btn-icon-square-glyph {
  font-size: 20px;
}

#worktimeJournalContent {
  max-height: calc(100vh - 250px);
  overflow: auto;
}

.cell-main {
  max-width: 420px;
}

.sub-cell {
  max-width: 280px;
}

.room-cell {
  max-width: 280px;
}

/** Строка с заменой по форме или переносом в сетке (вкладка «Расписание»). */
.schedule-class-sheet tr.schedule-row--sub td {
  background: color-mix(in srgb, var(--class-pill-warn-bg) 40%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--class-pill-warn-border) 45%, transparent);
}

/**
 * Учитель: на дату в «Уроки» пусто, а в импорте слот занят — урок снят/перенесён относительно основного.
 * Подсветка №, «Время», «Уроки»; «По основному расписанию» без фона.
 */
.schedule-class-sheet tr.schedule-row--eff-empty-main td:nth-child(1),
.schedule-class-sheet tr.schedule-row--eff-empty-main td:nth-child(2),
.schedule-class-sheet tr.schedule-row--eff-empty-main td:nth-child(3) {
  background: color-mix(in srgb, var(--class-pill-warn-bg) 48%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--class-pill-warn-border) 52%, transparent);
}

/** Запись на вкладке «Замены» — в расписании учителя (зелёный фон; в колонке №: «(з)» — замена, «(д)» — доп. урок, «(с)» — совмещение). */
.schedule-class-sheet tr.schedule-row--sub-repl td {
  background: color-mix(in srgb, var(--class-pill-ok-bg) 42%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--class-pill-ok-border) 45%, transparent);
}

/** Совмещение подгрупп — вкладка «Расписание», превью в сайдбаре */
.schedule-class-sheet tr.schedule-row--merge-coverage td {
  background: var(--merge-coverage-bg);
  box-shadow: inset 0 0 0 1px var(--merge-coverage-border);
  color: var(--merge-coverage-text);
}

/** Колонка «По основному расписанию» — без фона подсветки строки (замена / совмещение) */
#panelSchedule .schedule-week-day-table--teacher-week tr.schedule-row--sub td:nth-child(4),
#panelSchedule .schedule-week-day-table--teacher-week tr.schedule-row--sub-repl td:nth-child(4),
#panelSchedule .schedule-week-day-table--teacher-week tr.schedule-row--merge-coverage td:nth-child(4) {
  background: transparent;
  box-shadow: none;
  color: var(--text);
}

/** Учащийся («Расписание»): та же колонка «По основному» — без жёлтой/зелёной окраски ячеек */
#panelSchedule .schedule-week-day-table.schedule-class-sheet:not(.schedule-week-day-table--teacher-week) tr.schedule-row--sub td:nth-child(4),
#panelSchedule .schedule-week-day-table.schedule-class-sheet:not(.schedule-week-day-table--teacher-week) tr.schedule-row--sub-repl td:nth-child(4),
#panelSchedule .schedule-week-day-table.schedule-class-sheet:not(.schedule-week-day-table--teacher-week) tr.schedule-row--merge-coverage td:nth-child(4) {
  background: transparent;
  box-shadow: none;
  color: var(--text);
}

.teacher-class-day-preview-table tr.teacher-class-day-preview-row--merge td {
  background: var(--merge-coverage-bg);
  box-shadow: inset 0 0 0 1px var(--merge-coverage-border);
  color: var(--merge-coverage-text);
}

.teacher-class-day-preview-table tr.teacher-class-day-preview-row--changed td {
  background: color-mix(in srgb, var(--class-pill-warn-bg) 55%, var(--surface));
  box-shadow: inset 0 0 0 1px var(--class-pill-warn-border);
}

.schedule-lesson-repl-mark {
  font-weight: 600;
  color: var(--class-pill-ok-text);
  white-space: nowrap;
}

.schedule-lesson-repl-mark--merge {
  color: var(--merge-coverage-text);
}

.schedule-week-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem 1.5rem;
  align-items: start;
}

.schedule-week-grid--single-day {
  grid-template-columns: 1fr;
  max-width: min(52rem, 100%);
}

@media (max-width: 900px) {
  .schedule-week-grid {
    grid-template-columns: 1fr;
  }
}

.schedule-week-col {
  min-width: 0;
}

.schedule-week-day {
  margin-bottom: 1.25rem;
}

.schedule-week-day:last-child {
  margin-bottom: 0;
}

.schedule-week-day-title {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 600;
}

.schedule-week-day-table {
  width: 100%;
  font-size: 0.88rem;
}

/* Строка «Комментарии» под уроками — расписание класса (ученик / учитель, вкладка «Расписание класса») */
.schedule-class-sheet tr.schedule-class-comments-row td {
  vertical-align: middle;
  text-align: center;
  white-space: normal;
  line-height: 1.35;
}

.schedule-class-sheet tr.schedule-class-comments-row .schedule-class-comments-row__label {
  font-weight: 650;
  font-size: 0.82rem;
  color: var(--muted);
  background: color-mix(in srgb, var(--surface) 96%, var(--muted));
}

.schedule-class-sheet .schedule-class-day-comment {
  max-width: 24rem;
  margin: 0 auto;
}

.schedule-class-sheet .schedule-class-day-comment--empty {
  color: var(--muted);
}

/*
 * Четыре колонки: равная ширина «Уроки (дата)» и «По основному расписанию».
 * Только таблицы с четырьмя th (учитель / учащийся / классный при включённой колонке основного).
 */
:is(
  #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
  #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
  #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
) {
  table-layout: fixed;
  width: 100%;
  font-size: 0.92rem;
}

:is(
  #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
  #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
  #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
)
 th,
:is(
    #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
    #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
    #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
  )
  td {
  vertical-align: middle;
}

:is(
  #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
  #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
  #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
)
  th:nth-child(1),
:is(
    #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
    #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
    #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
  )
  td:nth-child(1) {
  width: 4%;
  text-align: center;
}

:is(
  #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
  #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
  #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
)
  th:nth-child(2),
:is(
    #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
    #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
    #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
  )
  td:nth-child(2) {
  width: 13%;
  min-width: 7.75rem;
  white-space: nowrap;
  text-align: center;
}

:is(
  #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
  #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
  #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
)
  th:nth-child(3),
:is(
    #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
    #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
    #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
  )
  td:nth-child(3),
:is(
    #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
    #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
    #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
  )
  th:nth-child(4),
:is(
    #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
    #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
    #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
  )
  td:nth-child(4) {
  width: 41.5%;
  word-break: break-word;
}

:is(
  #panelSchedule .schedule-week-day-table--teacher-week:has(thead th:nth-child(4)),
  #panelSchedule .schedule-week-day-table.schedule-class-sheet:has(thead th:nth-child(4)),
  #panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:has(thead th:nth-child(4))
)
  .cell-main {
  max-width: none;
}

/* Три колонки у учителя (колонка «Основное» скрыта): прежняя вёрстка. */
#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) {
  table-layout: auto;
  width: 100%;
  font-size: 0.92rem;
}

#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) th,
#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) td {
  vertical-align: middle;
}

#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) th:nth-child(1),
#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) td:nth-child(1) {
  width: 1%;
  text-align: center;
}

#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) th:nth-child(2),
#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) td:nth-child(2) {
  white-space: nowrap;
  min-width: 7.75rem;
  text-align: center;
}

#panelSchedule .schedule-week-day-table--teacher-week:not(:has(thead th:nth-child(4))) .cell-main {
  max-width: none;
}

/* Три колонки у классного (без «По основному»). */
#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) {
  table-layout: auto;
  width: 100%;
  font-size: 0.92rem;
}

#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) th,
#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) td {
  vertical-align: middle;
}

#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) th:nth-child(1),
#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) td:nth-child(1) {
  width: 1%;
  text-align: center;
}

#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) th:nth-child(2),
#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) td:nth-child(2) {
  white-space: nowrap;
  min-width: 7.75rem;
  text-align: center;
}

#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class:not(:has(thead th:nth-child(4))) .cell-main {
  max-width: none;
}

/* Учащийся, три колонки (без «По основному»): колонка «Время». */
#panelSchedule .schedule-week-day-table.schedule-class-sheet:not(.schedule-week-day-table--teacher-week):not(:has(thead th:nth-child(4)))
  th:nth-child(2),
#panelSchedule .schedule-week-day-table.schedule-class-sheet:not(.schedule-week-day-table--teacher-week):not(:has(thead th:nth-child(4)))
  td:nth-child(2) {
  white-space: nowrap;
  min-width: 7.75rem;
  text-align: center;
}

#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class tr.schedule-row--sub td:nth-child(4),
#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class tr.schedule-row--sub-repl td:nth-child(4),
#panelTeacherClassSchedule .schedule-week-day-table--homeroom-class tr.schedule-row--merge-coverage td:nth-child(4) {
  background: transparent;
  box-shadow: none;
  color: var(--text);
}

.schedule-week-day-empty {
  margin: 0;
}

.sub-line {
  margin-top: 0.35rem;
  color: var(--accent);
}

.muted {
  color: var(--muted);
}

.strike {
  text-decoration: line-through;
  opacity: 0.75;
}

.badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
  background: var(--badge-bg);
  color: var(--warn);
  font-size: 0.8rem;
}

.warn {
  color: var(--warn);
}

.small {
  font-size: 0.82rem;
  color: var(--muted);
  margin-top: 0.2rem;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem 1rem;
  margin-bottom: 1rem;
}

label.check {
  flex-direction: row !important;
  align-items: center;
  gap: 0.5rem !important;
}

label.block {
  display: block;
  margin-bottom: 0.75rem;
  font-size: 0.85rem;
  color: var(--muted);
}

.list-wrap {
  overflow-x: auto;
}

h2 {
  font-size: 1.05rem;
  margin: 1.5rem 0 0.75rem;
}

.foot {
  padding: 0 1.5rem 2rem;
  max-width: 1100px;
}

.status {
  margin: 0;
  min-height: 1.25rem;
  color: var(--accent);
  font-size: 0.9rem;
}

.tabs-status {
  padding: 0.4rem 1.5rem 0.25rem;
}

.tabs-status .status {
  text-align: left;
  max-width: none;
}

.admin-lock-notice {
  color: #d97706;
}

#appShell.admin-readonly-lock main {
  pointer-events: none;
  user-select: none;
  display: block !important;
}

#appShell.admin-readonly-lock main > section.panel:not(#panelWorktimeJournal):not(#panelTelegramBot):not(#panelAdmin) {
  display: none !important;
}

#appShell.admin-readonly-lock main > section#panelWorktimeJournal.panel.active,
#appShell.admin-readonly-lock main > section#panelTelegramBot.panel.active,
#appShell.admin-readonly-lock main > section#panelAdmin.panel.active {
  pointer-events: auto;
  user-select: auto;
}

#appShell.admin-readonly-lock .top-row-mode-buttons.admin-only #btnTopSubsTab,
#appShell.admin-readonly-lock .top-row-mode-buttons.admin-only #btnTopClassesTab,
#appShell.admin-readonly-lock .top-row-mode-buttons.admin-only #btnJournals {
  display: none !important;
}

/* Рабочая дата и кнопки публикации — только в режиме редактирования (есть блокировка редактора) */
#appShell.admin-readonly-lock .top-row-working-date {
  display: none !important;
}

#appShell.admin-readonly-lock .top-row-left,
#appShell.admin-readonly-lock .tabs-status,
#appShell.admin-readonly-lock .userbar {
  pointer-events: auto;
}

#appShell.admin-readonly-lock .tabs-status {
  padding-top: 0.7rem;
  padding-bottom: 0.4rem;
}

#appShell.admin-readonly-lock #adminLockNotice {
  display: block !important;
}

.hint {
  color: var(--muted);
  font-size: 0.82rem;
  margin-top: 0.5rem;
}

.hint code {
  display: block;
  margin-top: 0.35rem;
  color: var(--hint-code);
  font-size: 0.78rem;
}

.btn-theme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  min-width: 2.15rem;
}

.btn-theme .btn-theme-icon {
  display: block;
  flex-shrink: 0;
}

@media (hover: hover) and (pointer: fine) {
  .btn-theme:hover {
    color: var(--accent);
    border-color: var(--accent);
  }
}

.admin-presence-list {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.admin-audit-presence-row {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.admin-presence-chip {
  width: 2.3rem;
  height: 2.3rem;
  min-width: 2.3rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1;
  cursor: default;
}

.admin-presence-chip__icon {
  display: block;
  width: 18px;
  height: 18px;
}

.admin-presence-chip__icon.admin-presence-chip--editor {
  color: #16a34a;
}

.admin-presence-chip__icon.admin-presence-chip--waiting {
  color: #7c3aed;
}

.admin-presence-chip--self {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent);
}

/* Режим «неделя / один день» для расписания (учитель, ученик) */
.btn-schedule-scope {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  min-width: 2.15rem;
}

.btn-schedule-scope .btn-schedule-scope-icon {
  display: block;
  flex-shrink: 0;
}

@media (hover: hover) and (pointer: fine) {
  .btn-schedule-scope:hover {
    color: var(--accent);
    border-color: var(--accent);
  }
}

/* Скачать расписание на день (ученик, режим «один день») */
.btn-download-schedule-png {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  min-width: 2.15rem;
}

.btn-download-schedule-png .btn-download-schedule-png__icon {
  display: block;
  flex-shrink: 0;
}

@media (hover: hover) and (pointer: fine) {
  .btn-download-schedule-png:hover:not(:disabled) {
    color: var(--accent);
    border-color: var(--accent);
  }
}

.btn-settings,
.btn-journals,
.btn-logout {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  min-width: 2.15rem;
  border-radius: 9px;
}

.btn-settings .btn-settings-icon {
  display: block;
  flex-shrink: 0;
  line-height: 1;
  font-size: 1.05rem;
}

.btn-journals .btn-journals-icon {
  display: block;
  flex-shrink: 0;
  line-height: 1;
  font-size: 1.05rem;
}

@media (hover: hover) and (pointer: fine) {
  .btn-settings:hover,
  .btn-journals:hover {
    color: var(--accent);
    border-color: rgba(110, 184, 255, 0.45);
    background: var(--accent-dim);
  }
}

.btn-settings.active,
.btn-journals.active {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
  box-shadow: 0 0 0 1px rgba(110, 184, 255, 0.2);
}

@media (hover: hover) and (pointer: fine) {
  .btn-logout:hover {
    color: var(--danger);
    border-color: rgba(248, 113, 113, 0.45);
    background: rgba(248, 113, 113, 0.08);
  }
}

/* Оповещение: замены на дату опубликованы (для всех ролей) */
.subs-published-banner {
  margin: 0 0 10px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(110, 184, 255, 0.45);
  background: var(--accent-dim);
  color: var(--text);
  font-size: 0.95rem;
  line-height: 1.45;
}

.subs-published-banner-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.subs-published-banner-text {
  flex: 1;
  min-width: 0;
}

.subs-published-banner-close {
  flex-shrink: 0;
  min-width: 2rem;
  padding: 0 0.35rem;
  font-size: 1.25rem;
  line-height: 1;
}