/* Custom styles for Edudash Admin Panel */
:root {
  --panel-bg: #f4efe7;
  --panel-surface: rgba(255, 255, 255, 0.88);
  --panel-surface-strong: #ffffff;
  --panel-line: rgba(42, 72, 82, 0.12);
  --panel-text: #1d2a2f;
  --panel-muted: #66767c;
  --panel-primary: #1f7a6d;
  --panel-primary-deep: #17584f;
  --panel-accent: #d97c54;
  --panel-blue: #2e6fd8;
  --panel-shadow: 0 20px 60px rgba(31, 48, 56, 0.1);
  --panel-radius: 16px;
  --panel-gap: 16px;
}

body[data-theme='dark'] {
  --panel-bg: #0d1418;
  --panel-surface: rgba(18, 27, 31, 0.88);
  --panel-surface-strong: #101a1f;
  --panel-line: rgba(153, 196, 184, 0.14);
  --panel-text: #e8f1ed;
  --panel-muted: #9fb4b0;
  --panel-primary: #62c4af;
  --panel-primary-deep: #a8f0de;
  --panel-accent: #f2a275;
  --panel-blue: #6e9cff;
  --panel-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
  --panel-radius: 16px;
  --panel-gap: 16px;
}

body {
  font-family: 'Manrope', 'Trebuchet MS', sans-serif;
  background:
    radial-gradient(circle at top left, rgba(217, 124, 84, 0.18), transparent 24%),
    radial-gradient(circle at 85% 12%, rgba(31, 122, 109, 0.14), transparent 22%),
    linear-gradient(180deg, #fcfaf6 0%, var(--panel-bg) 100%);
  color: var(--panel-text);
  transition: background 0.25s ease, color 0.25s ease;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.app-back-to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 990;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 44px;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid rgba(31, 122, 109, .18);
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, #1f7a6d, #347fd1);
  box-shadow: 0 10px 24px rgba(31, 79, 93, .2);
  font: inherit;
  font-size: 20px;
  font-weight: 800;
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
  cursor: pointer;
}
.app-back-to-top span { font-size: 11px; }
.app-back-to-top.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.app-back-to-top:hover { box-shadow: 0 13px 28px rgba(31, 79, 93, .28); }
body[data-theme='dark'] .app-back-to-top { border-color: rgba(185, 228, 220, .18); }

.sidebar {
  width: 290px;
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 243, 236, 0.96) 100%);
  border-right: 1px solid var(--panel-line);
  box-shadow: 0 24px 80px rgba(31, 48, 56, 0.08);
  z-index: 1000;
  overflow-y: auto;
}

.dashboard-main {
  margin-left: 290px;
  padding: 28px 28px 42px;
}

.card {
  border: none;
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
}

.body-overlay {
  display: none !important;
}

.sidebar-logo {
  padding: 24px 20px 12px;
}

.sidebar-brand {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: var(--panel-text);
}

.sidebar-brand__mark {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 100%);
  color: #fff;
  font-size: 30px;
  font-weight: 800;
  box-shadow: 0 16px 32px rgba(31, 122, 109, 0.24);
}

.sidebar-brand__image {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  object-fit: contain;
  padding: 6px;
  background: #fff;
  box-shadow: 0 16px 32px rgba(31, 122, 109, 0.24);
}

.sidebar-brand__text {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.sidebar-logo a img.light-logo,
.sidebar-logo a img.dark-logo {
  max-width: 180px;
  height: auto;
}

.sidebar-toggle,
.sidebar-close-btn,
.sidebar-mobile-toggle {
  border: 0;
  background: rgba(31, 122, 109, 0.1);
  color: var(--panel-primary-deep);
  width: 42px;
  height: 42px;
  border-radius: 14px;
  font-size: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.account-panel {
  padding: 18px;
  border-radius: 26px;
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.14), transparent 34%),
    linear-gradient(135deg, var(--panel-primary) 0%, #2c9887 50%, #29659f 100%);
  color: #fff;
  box-shadow: 0 22px 52px rgba(31, 122, 109, 0.28);
}

.account-panel__avatar {
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 14px;
}

.account-panel__meta strong {
  display: block;
  font-size: 18px;
  line-height: 1.2;
}

.account-panel__meta span {
  display: block;
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 14px;
}

.account-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.account-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 108px;
  padding: 10px 14px;
  border-radius: 12px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
}

.account-link--ghost {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.account-link--danger {
  background: #fff;
  color: #9b3b2d;
}

.sidebar-menu-area {
  padding: 8px 14px 28px;
}

.sidebar-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar-menu > li {
  margin-bottom: 10px;
}

.sidebar-menu > li > a,
.sidebar-submenu li a {
  display: flex;
  align-items: center;
  border-radius: 14px;
  text-decoration: none;
  color: #1e293b;
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.sidebar-menu > li > a {
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(42, 72, 82, 0.08);
  font-weight: 700;
}

.sidebar-submenu {
  list-style: none;
  margin: 10px 0 0;
  padding: 0 0 0 10px;
}

.sidebar-submenu li {
  margin-bottom: 8px;
}

.sidebar-submenu li a {
  padding: 10px 14px;
  background: transparent;
  color: #475569;
  font-weight: 600;
}

.sidebar-menu > li > a:hover,
.sidebar-submenu li a:hover {
  background: linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 100%);
  color: #fff;
  transform: translateX(2px);
}

.navbar-header {
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(42, 72, 82, 0.08);
  border-radius: 28px;
  padding: 22px 24px;
  box-shadow: var(--panel-shadow);
  backdrop-filter: blur(16px);
}

.navbar-search {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 320px;
  padding: 12px 16px;
  border-radius: 16px;
  background: #f8fafc;
  border: 1px solid #dbe4f0;
}

.navbar-search input {
  border: 0;
  outline: none;
  width: 100%;
  background: transparent;
}

.top-action-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 146px;
  padding: 12px 18px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: 0.01em;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.top-action-link--soft {
  background: rgba(31, 122, 109, 0.1);
  color: var(--panel-primary-deep);
}

.top-action-link--neutral {
  background: rgba(255, 255, 255, 0.64);
  color: var(--panel-text);
  border: 1px solid rgba(42, 72, 82, 0.08);
}

.top-action-link--theme {
  background: rgba(217, 124, 84, 0.14);
  color: #8f4f29;
}

.top-action-link--danger {
  background: linear-gradient(135deg, #c85d4c 0%, #aa4132 100%);
  color: #fff;
  box-shadow: 0 12px 24px rgba(170, 65, 50, 0.24);
}

.top-action-link:hover {
  transform: translateY(-1px);
}

.dashboard-main-body {
  padding-top: 22px;
}

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.login-card {
  width: min(100%, 460px);
  padding: 34px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(42, 72, 82, 0.1);
  box-shadow: var(--panel-shadow);
}

.login-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #ccfbf1;
  color: #115e59;
  font-weight: 800;
  font-size: 13px;
}

.login-card h2 {
  margin: 18px 0 8px;
  font-size: 36px;
  line-height: 1.05;
}

.login-subtitle {
  margin: 0 0 24px;
  color: #64748b;
}

.login-form .form-label {
  font-weight: 700;
  color: #334155;
}

.login-form .form-control {
  border-radius: 16px;
  border: 1px solid #cbd5e1;
  padding: 14px 16px;
}

.login-submit {
  width: 100%;
  padding: 14px 18px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #0f766e 0%, #155e75 100%);
  color: #fff;
  font-weight: 800;
  box-shadow: 0 18px 36px rgba(15, 118, 110, 0.22);
}

.login-links {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
}

.login-links a {
  color: #0f766e;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
}

.auth-floating-tools {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 20;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.auth-tool-button {
  min-height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(42, 72, 82, 0.1);
  background: rgba(255, 255, 255, 0.76);
  color: var(--panel-text);
  font-weight: 800;
  box-shadow: 0 10px 24px rgba(31, 48, 56, 0.08);
}

.placeholder-shell {
  min-height: 100vh;
  padding: 48px 20px;
  background:
    radial-gradient(circle at top left, rgba(15, 118, 110, 0.12), transparent 28%),
    linear-gradient(180deg, #f8fafc 0%, #eef6ff 100%);
}

.placeholder-card {
  max-width: 960px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(42, 72, 82, 0.12);
  border-radius: 24px;
  padding: 32px;
  box-shadow: var(--panel-shadow);
}

.placeholder-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #ccfbf1;
  color: #115e59;
  font-size: 14px;
  font-weight: 700;
}

.placeholder-title {
  margin: 18px 0 10px;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.1;
}

.placeholder-text {
  max-width: 680px;
  color: #475569;
  font-size: 16px;
}

.placeholder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin: 28px 0;
}

.placeholder-panel {
  padding: 20px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(42, 72, 82, 0.08);
}

.placeholder-panel h3 {
  margin: 0 0 8px;
  font-size: 18px;
}

.placeholder-panel p {
  margin: 0;
  color: #64748b;
  font-size: 14px;
}

.placeholder-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.placeholder-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;
  padding: 12px 18px;
  border-radius: 14px;
  text-decoration: none;
  font-weight: 700;
}

.placeholder-actions .primary-link {
  background: #0f766e;
  color: #fff;
}

.placeholder-actions .secondary-link {
  background: #e2e8f0;
  color: #0f172a;
}

.module-shell {
  max-width: 1180px;
  margin: 0 auto;
  padding: 28px 4px 48px;
}

.module-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 24px;
  padding: 28px;
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.16), transparent 34%),
    linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 46%, var(--panel-blue) 100%);
  color: #fff;
  box-shadow: 0 24px 70px rgba(34, 92, 120, 0.18);
}

.module-header h1 {
  margin: 0 0 8px;
  font-size: clamp(28px, 4vw, 40px);
  letter-spacing: -0.04em;
}

.module-header p {
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
  max-width: 720px;
}

.module-card {
  min-width: 0;
  max-width: 100%;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(42, 72, 82, 0.08);
  border-radius: 28px;
  padding: 26px;
  box-shadow: var(--panel-shadow);
  backdrop-filter: blur(16px);
}

.module-card + .module-card {
  margin-top: 20px;
}

.module-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.module-toolbar h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -0.03em;
}

.module-toolbar__actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.module-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}

.module-table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
}

.module-table th,
.module-table td {
  padding: 14px 12px;
  border-bottom: 1px solid rgba(42, 72, 82, 0.08);
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.module-table th {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--panel-primary-deep);
  background: rgba(31, 122, 109, 0.08);
}

.module-table tr:hover td {
  background: rgba(31, 122, 109, 0.04);
}

.class-room-table {
  table-layout: fixed;
}

.class-room-table th:nth-child(1),
.class-room-table td:nth-child(1) {
  width: 18%;
}

.class-room-table th:nth-child(2),
.class-room-table td:nth-child(2) {
  width: 17%;
}

.class-room-names {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 16px;
  max-height: 360px;
  overflow-y: auto;
  padding: 2px 4px 2px 0;
}

.class-room-name {
  position: relative;
  display: block;
  max-width: 100%;
  padding: 8px 4px 8px 16px;
  border-bottom: 1px solid rgba(42, 72, 82, 0.1);
  color: var(--panel-text);
  text-decoration: none;
  font-size: 12px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.class-room-name:hover {
  color: var(--panel-primary-deep);
  background: rgba(31, 122, 109, 0.06);
}

.class-room-name::before {
  position: absolute;
  top: 13px;
  left: 2px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--panel-primary);
  content: '';
}

body[data-theme='dark'] .class-room-name {
  border-color: rgba(153, 196, 184, 0.14);
}

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

@media (max-width: 560px) {
  .class-room-table {
    table-layout: auto;
  }

  .class-room-table th:nth-child(1),
  .class-room-table td:nth-child(1),
  .class-room-table th:nth-child(2),
  .class-room-table td:nth-child(2) {
    width: auto;
  }

  .class-room-names {
    grid-template-columns: 1fr;
    max-height: none;
  }
}

.module-empty {
  padding: 24px;
  border-radius: 20px;
  background: rgba(31, 122, 109, 0.08);
  color: var(--panel-primary-deep);
}

.student-attendance-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.student-attendance-summary span {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(31, 122, 109, 0.07);
  color: var(--panel-muted);
  font-size: 13px;
}

.student-attendance-summary strong {
  display: block;
  margin-bottom: 3px;
  color: var(--panel-text);
  font-size: 20px;
}

.student-notes-list {
  display: grid;
  gap: 12px;
  margin-top: 22px;
}

.student-detail-insights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.student-detail-insights .module-card:last-child {
  grid-column: 1 / -1;
}

.student-detail-list {
  display: grid;
  gap: 0;
}

.student-detail-list__item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 0;
  border-bottom: 1px solid rgba(42, 72, 82, 0.08);
}

.student-detail-list__item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.student-detail-list__item strong,
.student-detail-list__item small {
  display: block;
}

.student-detail-list__item strong {
  color: var(--panel-text);
}

.student-detail-list__item small {
  max-width: 360px;
  margin-top: 4px;
  color: var(--panel-muted);
  overflow-wrap: anywhere;
}

.student-detail-list__item > span {
  flex: 0 0 auto;
  color: var(--panel-primary-deep);
  font-size: 12px;
  font-weight: 800;
  text-align: right;
}

.student-calendar {
  margin-bottom: 12px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(31, 122, 109, 0.06);
}

.student-calendar__month {
  margin-bottom: 10px;
  color: var(--panel-primary-deep);
  font-weight: 800;
  text-align: center;
}

.student-calendar__weekdays,
.student-calendar__days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
  text-align: center;
}

.student-calendar__weekdays {
  margin-bottom: 5px;
  color: var(--panel-muted);
  font-size: 10px;
  font-weight: 800;
}

.student-calendar__days span {
  display: grid;
  min-height: 29px;
  place-items: center;
  border-radius: 8px;
  color: var(--panel-text);
  font-size: 12px;
}

.student-calendar__days span.has-event {
  color: #fff;
  background: var(--panel-primary);
  font-weight: 800;
}

.student-calendar__days span.student-calendar__empty {
  background: transparent;
}

.student-note-item {
  padding: 16px 18px;
  border: 1px solid rgba(42, 72, 82, 0.1);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.62);
}

.student-note-item__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.student-note-item__meta time {
  margin-left: auto;
  color: var(--panel-muted);
  font-size: 12px;
}

.student-note-item p {
  margin: 10px 0 0;
  color: var(--panel-text);
  line-height: 1.6;
  white-space: normal;
}

body[data-theme='dark'] .student-note-item {
  background: rgba(22, 33, 38, 0.86);
  border-color: rgba(153, 196, 184, 0.12);
}

@media (max-width: 700px) {
  .student-attendance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .student-note-item__meta time {
    width: 100%;
    margin-left: 0;
  }
}

/* Professional visual refinement */
:root {
  --panel-bg: #f5f7fb;
  --panel-surface: #ffffff;
  --panel-surface-strong: #ffffff;
  --panel-line: #e6ebf1;
  --panel-text: #17212b;
  --panel-muted: #718096;
  --panel-primary: #16877a;
  --panel-primary-deep: #11695f;
  --panel-accent: #d97852;
  --panel-blue: #3974d8;
  --panel-shadow: 0 10px 28px rgba(30, 47, 66, .06);
}

body {
  background: #f5f7fb;
  color: var(--panel-text);
}

.sidebar {
  width: 270px;
  background: #fff;
  border-right: 1px solid #e7ecf2;
  box-shadow: 8px 0 24px rgba(24, 39, 55, .035);
}

.dashboard-main {
  margin-left: 270px;
  padding: 24px 32px 40px;
}

.sidebar-logo {
  padding: 18px 20px 14px;
  border-bottom: 1px solid #eef1f5;
}

.sidebar-brand__image {
  width: 42px;
  height: 42px;
  padding: 4px;
  border-radius: 12px;
  box-shadow: none;
}

.sidebar-brand__text {
  font-size: 17px;
}

.account-panel {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin: 16px 16px 18px !important;
  padding: 14px;
  border-radius: 16px;
  background: linear-gradient(145deg, #edf8f5 0%, #eef4ff 100%);
  color: var(--panel-text);
  box-shadow: none;
  border: 1px solid #e2eee9;
}

.account-panel__avatar {
  width: 46px;
  height: 46px;
  margin: 0;
  border-radius: 13px;
  background: var(--panel-primary);
  color: #fff;
  font-size: 19px;
}

.account-panel__meta strong {
  font-size: 14px;
}

.account-panel__meta span {
  margin-top: 3px;
  color: var(--panel-muted);
  font-size: 12px;
}

.account-panel__actions {
  grid-column: 1 / -1;
  margin-top: 4px;
  gap: 7px;
}

.account-link {
  min-width: 0;
  padding: 8px 11px;
  border-radius: 9px;
  font-size: 11px;
}

.account-link--ghost {
  background: #d9eee9;
  color: var(--panel-primary-deep);
}

.account-link--danger {
  background: #fff;
  color: #a34b3a;
  border: 1px solid #f0d8d1;
}

.sidebar-menu-area {
  padding: 0 14px 26px;
}

.sidebar-section-title {
  margin: 18px 8px 7px;
  color: #8996a5;
  font-size: 10px;
  letter-spacing: .12em;
}

.sidebar-section-toggle {
  width: calc(100% - 16px);
  padding: 0;
}

.sidebar-menu > li {
  margin-bottom: 2px;
}

.sidebar-menu > li > a,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle {
  min-height: 40px;
  padding: 9px 11px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #3d4b59;
  font-size: 13px;
  font-weight: 650;
  box-shadow: none;
}

.sidebar-menu > li > a::before,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle::before {
  content: '';
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  margin-right: 10px;
  border-radius: 50%;
  background: #c4ced8;
}

.sidebar-menu > li > a:hover,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle:hover {
  background: #f0f7f5;
  color: var(--panel-primary-deep);
  transform: none;
}

.sidebar-menu__link--active,
.sidebar-menu__link--active:hover {
  background: #e2f3ef !important;
  color: var(--panel-primary-deep) !important;
}

.sidebar-menu__link--active::before {
  background: var(--panel-primary) !important;
}

.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle {
  justify-content: flex-start;
}

.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle .sidebar-menu__chevron {
  margin-left: auto;
}

.sidebar-menu__item--accordion > .sidebar-submenu {
  margin: 3px 0 6px 16px;
  padding-left: 10px;
  border-left: 1px solid #dce8e5;
}

.sidebar-menu__item--accordion > .sidebar-submenu li a {
  padding: 8px 10px;
  border-radius: 7px;
  color: #718096;
  font-size: 12px;
}

.sidebar-menu__item--accordion > .sidebar-submenu li a:hover {
  background: #f3f8f7;
  color: var(--panel-primary-deep);
}

.navbar-header {
  padding: 18px 22px;
  border: 1px solid #e7ecf2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(30, 47, 66, .04);
}

.dashboard-header__row {
  gap: 20px;
}

.dashboard-header__left {
  align-items: center;
  gap: 14px;
}

.dashboard-title {
  font-size: clamp(25px, 3vw, 36px);
  letter-spacing: -.035em;
}

.dashboard-subtitle {
  margin-top: 7px;
  font-size: 14px;
}

.navbar-search {
  min-width: 220px;
  padding: 10px 13px;
  border-radius: 10px;
  background: #f8fafc;
  border-color: #e1e8ef;
}

.top-action-link {
  min-width: auto;
  padding: 10px 13px;
  border-radius: 10px;
  font-size: 12px;
}

/* Unified SaaS-style detail pages */
.module-header {
  position: relative;
  overflow: hidden;
  margin-bottom: 16px;
  padding: 22px 26px 22px 30px;
  border: 1px solid #dfe8eb;
  border-radius: 18px;
  background: #fff;
  color: var(--panel-text);
  box-shadow: 0 8px 24px rgba(30, 47, 66, .05);
}

.module-header::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--panel-primary), var(--panel-blue));
}

.module-header h1 {
  margin-bottom: 6px;
  color: #17212b;
  font-size: clamp(26px, 3vw, 34px);
  letter-spacing: -.04em;
}

.module-header p {
  color: #718096;
  font-size: 14px;
}

.module-header .module-button,
.module-header .top-action-link {
  border-radius: 9px;
  box-shadow: none;
}

.module-card {
  padding: 20px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid #e3e9ef;
  box-shadow: 0 6px 18px rgba(30, 47, 66, .04);
}

.profile-stat-grid {
  gap: 12px;
}

.profile-stat-grid .edudash-stat-card {
  position: relative;
  min-height: 106px;
  padding: 17px 18px;
  border: 1px solid #e3e9ef;
  border-top: 3px solid #9bcfc5;
  border-radius: 13px;
  background: #fff;
  box-shadow: none;
}

.profile-stat-grid .edudash-stat-card:nth-child(2) {
  border-top-color: #bda4dd;
}

.profile-stat-grid .edudash-stat-card:nth-child(3) {
  border-top-color: #8fbaca;
}

.profile-stat-grid .edudash-stat-card:nth-child(4) {
  border-top-color: #e4aa9a;
}

.profile-stat-grid .edudash-stat-card span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.profile-stat-grid .edudash-stat-card strong {
  margin-top: 7px;
  color: #17212b;
  font-size: 25px;
}

.profile-stat-grid .edudash-stat-card small {
  margin-top: 5px;
  color: #8793a1;
  font-size: 12px;
}

.profile-stat-grid .edudash-stat-card--violet,
.profile-stat-grid .edudash-stat-card--green,
.profile-stat-grid .edudash-stat-card--blue,
.profile-stat-grid .edudash-stat-card--orange {
  background: #fff;
}

.module-grid .placeholder-panel {
  min-height: 84px;
  background: #f8fafc;
}

.module-grid .placeholder-panel h3 {
  color: #25313d;
  font-size: 15px;
}

.module-grid .placeholder-panel p {
  color: #718096;
}

.module-toolbar h2 {
  color: #25313d;
  font-size: 20px;
}

.module-button {
  border-radius: 9px;
  box-shadow: none;
}

.module-shell {
  padding-top: 24px;
}

.module-header {
  margin-bottom: 18px;
  padding: 24px 26px;
  border-radius: 20px;
  box-shadow: 0 14px 32px rgba(34, 92, 120, .13);
}

.module-header h1 {
  font-size: clamp(26px, 3vw, 36px);
}

.module-card {
  padding: 22px;
  border-radius: 18px;
  background: #fff;
  border-color: #e7ecf2;
  box-shadow: 0 7px 22px rgba(30, 47, 66, .045);
}

.module-card + .module-card {
  margin-top: 16px;
}

.placeholder-panel {
  padding: 18px;
  border-radius: 13px;
  background: #f8fafc;
  border-color: #e7ecf2;
}

.edudash-stat-card {
  min-height: 104px;
  padding: 18px;
  border-radius: 14px;
}

/* Grouped sidebar navigation: every module stays collapsed until selected. */
.sidebar-section-toggle {
  width: calc(100% - 20px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.sidebar-section-toggle .sidebar-menu__chevron {
  font-size: 18px;
  line-height: 1;
  transition: transform .2s ease;
}

.sidebar-section-toggle.is-open .sidebar-menu__chevron {
  transform: rotate(180deg);
}

.sidebar-menu-area > .sidebar-menu {
  display: none;
}

.sidebar-menu-area > .sidebar-menu.is-open {
  display: block;
}

.sidebar-menu__item--accordion > .sidebar-submenu {
  display: none;
}

.sidebar-menu__item--accordion.is-open > .sidebar-submenu {
  display: block;
}

.sidebar-section-toggle:focus-visible {
  outline: 3px solid rgba(59, 130, 246, .35);
  outline-offset: 2px;
}

.attendance-selector-form__actions {
  align-items: flex-end;
  margin-top: 0;
}

.attendance-roster-toolbar {
  align-items: flex-start;
}

.attendance-roster-toolbar h2 {
  margin-bottom: 5px;
}

.attendance-roster-toolbar span {
  color: var(--panel-muted);
  font-size: 13px;
}

.attendance-bulk-actions,
.attendance-live-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.attendance-bulk-button {
  min-width: auto;
  padding: 9px 13px;
  font-size: 12px;
}

.attendance-roster-tools {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid rgba(31, 122, 109, 0.1);
  border-radius: 18px;
  background: rgba(31, 122, 109, 0.04);
}

.attendance-search-field {
  flex: 1 1 260px;
  margin-bottom: 0;
}

.attendance-live-summary {
  justify-content: flex-end;
  padding-bottom: 4px;
  color: var(--panel-muted);
  font-size: 13px;
}

.attendance-live-summary span {
  white-space: nowrap;
}

.attendance-live-summary strong {
  color: var(--panel-primary-deep);
  font-size: 16px;
}

.attendance-roster-table-wrap {
  max-height: 68vh;
  overflow: auto;
  border: 1px solid var(--panel-border);
  border-radius: 14px;
}

.attendance-roster-table-wrap .attendance-roster-table {
  margin: 0;
}

.attendance-roster-table-wrap .attendance-roster-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--panel-surface-muted, #f3f7fa);
  box-shadow: 0 1px 0 var(--panel-border);
}

.attendance-student-meta {
  display: block;
  margin-top: 4px;
  color: var(--panel-muted);
  font-size: 11px;
  font-weight: 600;
}

.advisor-assignment-table-wrap {
  max-height: 430px;
  overflow-y: auto;
}

.advisor-student-card .module-toolbar {
  align-items: flex-start;
}

tr[hidden] {
  display: none;
}

@media (max-width: 1100px) {
  .module-shell,
  .module-card,
  .module-table-wrap {
    min-width: 0;
    max-width: 100%;
  }

  .module-table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
  }

  .module-table th,
  .module-table td {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .attendance-roster-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .attendance-live-summary {
    justify-content: flex-start;
  }

  .student-detail-insights {
    grid-template-columns: 1fr;
  }

  .student-detail-insights .module-card:last-child {
    grid-column: auto;
  }

  .subject-list-table,
  .subject-list-table tbody,
  .subject-list-table tr,
  .subject-list-table td,
  .teacher-list-table,
  .teacher-list-table tbody,
  .teacher-list-table tr,
  .teacher-list-table td {
    display: block;
    width: 100%;
  }

  .advisor-student-table,
  .advisor-student-table tbody,
  .advisor-student-table tr,
  .advisor-student-table td,
  .advisor-assignment-table,
  .advisor-assignment-table tbody,
  .advisor-assignment-table tr,
  .advisor-assignment-table td {
    display: block;
    width: 100%;
  }

  .advisor-student-table thead,
  .advisor-assignment-table thead {
    display: none;
  }

  .advisor-student-table tr,
  .advisor-assignment-table tr {
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(42, 72, 82, 0.08);
    border-radius: 14px;
  }

  .advisor-student-table td,
  .advisor-assignment-table td {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 0;
  }

  .advisor-student-table td::before,
  .advisor-assignment-table td::before {
    content: attr(data-label);
    flex: 0 0 42%;
    color: var(--panel-muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
  }

  .subject-list-table thead,
  .teacher-list-table thead {
    display: none;
  }

  .subject-list-table tr,
  .teacher-list-table tr {
    margin-bottom: 14px;
    padding: 10px 14px;
    border: 1px solid rgba(42, 72, 82, 0.1);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.62);
  }

  .subject-list-table td,
  .teacher-list-table td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(42, 72, 82, 0.08);
    text-align: right;
    overflow-wrap: anywhere;
  }

  .subject-list-table td::before,
  .teacher-list-table td::before {
    flex: 0 0 auto;
    color: var(--panel-muted);
    content: attr(data-label);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-align: left;
    text-transform: uppercase;
  }

  .subject-list-table td:last-child {
    justify-content: flex-end;
    border-bottom: 0;
  }

  .teacher-list-table td:last-child {
    display: block;
    border-bottom: 0;
  }

  .subject-list-table td:last-child::before,
  .teacher-list-table td:last-child::before {
    display: none;
  }

  .subject-list-table td form,
  .teacher-list-table td form {
    margin-left: auto;
  }

  .subject-list-table .module-button,
  .teacher-list-table .module-button {
    min-width: 100px;
  }

  .teacher-list-table td:nth-child(2) {
    overflow-wrap: anywhere;
  }

  .teacher-list-table .module-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: 4px;
  }
}

.program-class-filter {
  align-items: end;
}

/* Keep the autocomplete above the following weekly schedule card. The cards
   use backdrop-filter, so each card forms its own stacking context. */
.program-class-filter-card {
  position: relative;
  z-index: 4;
}

.teacher-list-filter {
  align-items: end;
}

.teacher-list-filter__actions {
  align-items: flex-end;
  margin-top: 0;
}

.teacher-filter-toolbar {
  margin-bottom: 14px;
}

.program-class-filter__actions {
  align-items: flex-end;
  margin-top: 0;
}

.class-autocomplete {
  position: relative;
}

.class-autocomplete__results {
  position: absolute;
  z-index: 20;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--panel-border);
  border-radius: 14px;
  background: var(--panel-surface, #fff);
  box-shadow: 0 14px 30px rgba(31, 41, 55, .14);
}

.class-autocomplete__group {
  padding: 7px 10px 5px;
  color: var(--panel-primary, #167e73);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.class-autocomplete__option {
  display: flex;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--panel-text);
  text-align: left;
  font: inherit;
}

.class-autocomplete__select {
  display: grid;
  flex: 1;
  gap: 2px;
  min-width: 0;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.class-autocomplete__select strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.class-autocomplete__select small {
  color: var(--panel-muted, #71878b);
  font-size: 11px;
}

.class-autocomplete__favorite {
  flex: 0 0 38px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #d09b20;
  font-size: 19px;
  cursor: pointer;
}

.class-autocomplete__option:hover,
.class-autocomplete__option:focus-within {
  background: rgba(31, 122, 109, .1);
  outline: none;
}

.schedule-grid-mobile {
  display: none;
}

.program-empty-state {
  min-height: 110px;
  display: grid;
  place-items: center;
  text-align: center;
}

@media (max-width: 700px) {
  .schedule-grid-day-picker,
  .schedule-grid-scroll {
    display: none;
  }

  .schedule-grid-mobile {
    display: grid;
    gap: 12px;
  }

  .schedule-grid-mobile__day {
    padding: 14px;
    border: 1px solid var(--panel-border, #dfe9e7);
    border-radius: 16px;
    background: var(--panel-surface, #fff);
  }

  .schedule-grid-mobile__day h3 {
    margin: 0 0 10px;
    color: var(--panel-text, #263442);
    font-size: 15px;
  }

  .schedule-grid-mobile__entry {
    display: grid;
    gap: 4px;
    padding: 12px;
    margin-top: 8px;
    border: 1px solid var(--panel-border, #dfe9e7);
    border-left: 3px solid var(--panel-primary, #167e73);
    border-radius: 12px;
    background: #f7fbfb;
  }

  .schedule-grid-mobile__time {
    color: var(--panel-primary, #167e73);
    font-size: 11px;
    font-weight: 800;
  }

  .schedule-grid-mobile__entry strong { font-size: 14px; }
  .schedule-grid-mobile__entry span,
  .schedule-grid-mobile__entry small { color: var(--panel-muted, #71878b); font-size: 11px; }
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}

.module-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}

.module-field label {
  font-weight: 700;
  color: var(--panel-text);
}

.module-field input,
.module-field textarea,
.module-field select {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(42, 72, 82, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.9);
}

.module-field input:focus,
.module-field textarea:focus,
.module-field select:focus {
  outline: none;
  border-color: rgba(31, 122, 109, 0.4);
  box-shadow: 0 0 0 4px rgba(31, 122, 109, 0.12);
}

.module-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}

.module-actions form {
  margin: 0;
}

.module-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 140px;
  padding: 12px 18px;
  border-radius: 999px;
  border: 0;
  text-decoration: none;
  font-weight: 700;
  cursor: pointer;
}

.module-button.primary {
  background: linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 100%);
  color: #fff;
  box-shadow: 0 14px 28px rgba(31, 122, 109, 0.18);
}

.module-button.secondary {
  background: rgba(31, 122, 109, 0.08);
  color: var(--panel-primary-deep);
}

.module-button.danger {
  background: linear-gradient(135deg, #c85d4c, #aa4132);
  color: #fff;
  box-shadow: 0 12px 24px rgba(170, 65, 50, 0.18);
}

.module-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(31, 122, 109, 0.1);
  color: var(--panel-primary-deep);
  font-size: 12px;
  font-weight: 700;
}

.student-missing-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(200, 93, 76, 0.10);
  color: #a34a3c;
  font-size: 11px;
  font-weight: 700;
}

.student-empty-action {
  margin-top: 12px;
}

.student-schedule-card-details {
  cursor: pointer;
}

.student-schedule-card-details > summary {
  display: flex;
  flex-direction: column;
  gap: 3px;
  list-style: none;
}

.student-schedule-card-details > summary::-webkit-details-marker {
  display: none;
}

.student-schedule-card-details > summary::after {
  content: 'Detay';
  margin-top: 5px;
  color: var(--panel-primary-deep);
  font-size: 10px;
  font-weight: 800;
}

.student-schedule-card-details[open] > summary::after {
  content: 'Detayı kapat';
}

.student-schedule-card-details__body {
  display: grid;
  gap: 3px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid rgba(31, 122, 109, 0.16);
  color: var(--panel-text-muted);
  font-size: 11px;
}

.student-schedule-card-details__body span {
  margin-top: 3px;
  color: var(--panel-primary-deep);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.student-schedule-card-details__body strong {
  color: var(--panel-text);
}

.student-schedule-card-details__body p {
  margin: 0;
  line-height: 1.4;
}

.module-alert {
  padding: 14px 16px;
  border-radius: 14px;
  margin-bottom: 18px;
}

.module-alert.success {
  background: rgba(31, 122, 109, 0.12);
  color: var(--panel-primary-deep);
}

.module-alert.error {
  background: rgba(200, 93, 76, 0.12);
  color: #9b3b2d;
}

body[data-theme='dark'] .sidebar {
  background: linear-gradient(180deg, rgba(14, 21, 24, 0.98) 0%, rgba(17, 25, 29, 0.96) 100%);
}

body[data-theme='dark'] .navbar-header,
body[data-theme='dark'] .dashboard-panel,
body[data-theme='dark'] .module-card,
body[data-theme='dark'] .login-card,
body[data-theme='dark'] .placeholder-card,
body[data-theme='dark'] .stat-card {
  background: rgba(16, 25, 29, 0.9);
  border-color: rgba(153, 196, 184, 0.12);
}

body[data-theme='dark'] .sidebar-menu > li > a,
body[data-theme='dark'] .dashboard-list__item,
body[data-theme='dark'] .fee-table__row,
body[data-theme='dark'] .finance-item,
body[data-theme='dark'] .attendance-item,
body[data-theme='dark'] .notice-card,
body[data-theme='dark'] .quick-link-card,
body[data-theme='dark'] .module-directory__group,
body[data-theme='dark'] .placeholder-panel,
body[data-theme='dark'] .hero-highlight,
body[data-theme='dark'] .module-empty,
body[data-theme='dark'] .auth-tool-button,
body[data-theme='dark'] .top-action-link--neutral {
  background: rgba(22, 33, 38, 0.86);
  color: var(--panel-text);
  border-color: rgba(153, 196, 184, 0.12);
}

body[data-theme='dark'] .module-table th,
body[data-theme='dark'] .module-table tr:hover td,
body[data-theme='dark'] .top-action-link--soft,
body[data-theme='dark'] .module-button.secondary,
body[data-theme='dark'] .module-badge,
body[data-theme='dark'] .module-directory__link {
  background: rgba(98, 196, 175, 0.12);
  color: var(--panel-primary-deep);
}

body[data-theme='dark'] .form-control,
body[data-theme='dark'] .module-field input,
body[data-theme='dark'] .module-field textarea,
body[data-theme='dark'] .module-field select {
  background: rgba(13, 20, 24, 0.92);
  color: var(--panel-text);
  border-color: rgba(153, 196, 184, 0.12);
}

body[data-theme='dark'] .login-links a,
body[data-theme='dark'] .dashboard-kicker,
body[data-theme='dark'] .dashboard-panel__eyebrow,
body[data-theme='dark'] .sidebar-section-title {
  color: var(--panel-primary-deep);
}

body[data-theme='dark'] .top-action-link--theme {
  background: rgba(242, 162, 117, 0.14);
  color: #ffd5bc;
}

body[data-theme='dark'] .placeholder-actions .secondary-link {
  background: rgba(22, 33, 38, 0.86);
  color: var(--panel-text);
}

/* Responsive */
@media (max-width: 768px) {
  body.sidebar-is-open {
    overflow: hidden;
  }

  .body-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;
    background: rgba(15, 23, 42, .42);
  }

  body.sidebar-is-open .body-overlay {
    display: block !important;
  }

  .sidebar {
    width: min(88vw, 320px);
    position: fixed;
    height: 100vh;
    transform: translateX(-105%);
    transition: transform 0.25s ease;
    top: 0;
    left: 0;
  }

  .sidebar.sidebar--open {
    transform: translateX(0);
  }
  .dashboard-main {
    margin-left: 0;
    padding: 16px;
  }

  .dashboard-header__row {
    align-items: stretch;
    flex-direction: column;
    gap: 16px;
  }

  .dashboard-header__left {
    gap: 12px;
  }

  .dashboard-subtitle {
    font-size: 14px;
  }

  .dashboard-header__actions {
    justify-content: flex-start;
  }

  .placeholder-card {
    padding: 24px;
  }

  .navbar-search {
    min-width: 100%;
    flex: 1 1 100%;
  }

  .dashboard-header__actions .top-action-link {
    min-width: 0;
    padding: 10px 12px;
    font-size: 12px;
  }

  .module-header,
  .login-links {
    flex-direction: column;
  }

  .module-shell {
    padding-top: 20px;
  }

  .auth-floating-tools {
    left: 12px;
    right: 12px;
    top: 12px;
    justify-content: flex-end;
  }
}

/* Modern mobile menu control */
.sidebar-mobile-toggle {
  position: relative;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid #dce7f0;
  border-radius: 13px;
  background: linear-gradient(145deg, #f1f8f7, #eef3ff);
  color: #247d76;
  font-size: 0;
  box-shadow: 0 7px 16px rgba(55, 91, 126, .10);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.sidebar-mobile-toggle::before,
.sidebar-mobile-toggle::after,
.sidebar-mobile-toggle {
  --menu-line: #247d76;
}

.sidebar-mobile-toggle::before {
  content: '';
  position: absolute;
  width: 17px;
  height: 2px;
  border-radius: 99px;
  background: var(--menu-line);
  box-shadow: 0 -6px 0 var(--menu-line), 0 6px 0 var(--menu-line);
  transition: transform .18s ease, box-shadow .18s ease;
}

.sidebar-mobile-toggle:hover {
  transform: translateY(-1px);
  background: linear-gradient(145deg, #e2f5ef, #e5ecff);
  box-shadow: 0 10px 20px rgba(55, 91, 126, .16);
}

.sidebar-mobile-toggle[aria-expanded='true'] {
  background: linear-gradient(145deg, #6940d6, #4f80df);
  border-color: transparent;
  --menu-line: #fff;
}

.sidebar-mobile-toggle[aria-expanded='true']::before {
  transform: rotate(45deg);
  box-shadow: none;
}

.sidebar-mobile-toggle[aria-expanded='true']::after {
  content: '';
  position: absolute;
  width: 17px;
  height: 2px;
  border-radius: 99px;
  background: var(--menu-line);
  transform: rotate(-45deg);
}

/* Payment summary is a full-width, single-column responsive section. */
.dashboard-panel--finance {
  grid-column: 1 / -1;
}

.dashboard-panel--finance .finance-stack {
  grid-template-columns: 1fr;
}

.dashboard-panel--finance .finance-item {
  min-height: 58px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  padding: 10px 14px;
  border-radius: 12px;
}

.dashboard-panel--finance .finance-item strong {
  margin-top: 0;
  font-size: 20px;
  line-height: 1.1;
  white-space: nowrap;
}

.dashboard-panel--finance .progress-track {
  margin-top: 12px;
}

@media (max-width: 600px) {
  .dashboard-panel--finance .finance-item {
    min-height: 56px;
  }

  .dashboard-panel--finance .finance-item strong {
    font-size: 20px;
  }
}

/* Recent students are compact, fully clickable detail links. */
.dashboard-list__item--link {
  color: inherit;
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.dashboard-list__item--link:hover,
.dashboard-list__item--link:focus-visible {
  color: inherit;
  background: #f8fbff;
  border-color: #b7cfee;
  box-shadow: 0 8px 18px rgba(63, 116, 216, .10);
  transform: translateY(-1px);
}

.dashboard-list__item--link .dashboard-list__avatar {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  font-size: 14px;
}

.dashboard-list__item--link .dashboard-list__content strong {
  font-size: 13px;
}

.dashboard-list__item--link .dashboard-list__content span,
.dashboard-list__item--link time {
  font-size: 11px;
}

@media (max-width: 600px) {
  .dashboard-list__item--link {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .dashboard-list__item--link time {
    grid-column: 2;
  }
}

/* Compact overview statistics: four across when there is room, then responsive. */
.dashboard-overview .stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-overview .stat-card {
  min-height: 116px;
  padding: 15px;
  border-radius: 15px;
}

.dashboard-overview .stat-card__label {
  margin-bottom: 7px;
  font-size: 10px;
}

.dashboard-overview .stat-card strong {
  font-size: 27px;
}

.dashboard-overview .stat-card p {
  margin-top: 6px;
  font-size: 11px;
  line-height: 1.35;
}

@media (max-width: 700px) {
  .dashboard-overview .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 460px) {
  .dashboard-overview .stats-grid {
    grid-template-columns: 1fr;
  }
}

/* Class list: compact filters and a safe responsive table surface. */
.class-list-page .class-filter-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
}

.class-list-page .class-filter-grid .module-actions {
  align-self: end;
  margin-bottom: 0;
}

.class-list-page .class-filter-grid .module-actions .module-button,
.class-list-page .module-toolbar__actions .module-button {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 8px;
  font-size: 11px;
}

.class-list-page .module-toolbar__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.class-table-wrap {
  overflow-x: auto;
  border: 1px solid #e7ecf2;
  border-radius: 12px;
  background: #fff;
}

.class-table {
  min-width: 760px;
  margin: 0;
}

.class-table th,
.class-table td {
  padding: 10px 12px;
  vertical-align: middle;
}

.class-table th:first-child,
.class-table td:first-child {
  width: 42px;
  text-align: center;
}

.class-table td:last-child {
  width: 130px;
  text-align: right;
}

.class-table td:last-child .module-button {
  min-width: 76px;
}

.class-list-page .module-card > h2 {
  margin-bottom: 6px;
}

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

@media (max-width: 560px) {
  .class-list-page .class-filter-grid {
    grid-template-columns: 1fr;
  }

  .class-list-page .module-toolbar__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .class-list-page .module-toolbar__actions .module-button {
    width: 100%;
  }

  .class-list-page .module-toolbar__actions .module-muted {
    font-size: 11px;
  }
}

@media (max-width: 1200px) {
  .dashboard-header__left {
    display: flex;
    min-width: 0;
    align-items: flex-start;
  }

  .sidebar-mobile-toggle {
    display: inline-flex;
    flex: 0 0 42px;
    align-self: flex-start;
    margin: 0;
  }
}

/* Compact attendance distribution with responsive columns. */
.dashboard-panel--attendance {
  grid-column: 1 / -1;
}

.dashboard-panel--attendance .attendance-stack {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-panel--attendance .attendance-item {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 15px;
  border-radius: 12px;
}

.dashboard-panel--attendance .attendance-item strong {
  margin-top: 0;
  font-size: 22px;
}

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

@media (max-width: 600px) {
  .dashboard-panel--attendance .attendance-stack {
    grid-template-columns: 1fr;
  }

  .dashboard-panel--attendance .attendance-item {
    min-height: 62px;
  }
}

/* Mockup-style off-canvas navigation for tablet and mobile widths. */
@media (max-width: 1200px) {
  body.sidebar-is-open {
    overflow: hidden;
  }

  .body-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;
    background: rgba(15, 23, 42, .58);
  }

  body.sidebar-is-open .body-overlay {
    display: block !important;
  }

  .sidebar {
    width: min(304px, 88vw);
    transform: translateX(-105%);
    transition: transform .25s ease;
    box-shadow: 12px 0 30px rgba(20, 35, 43, .12);
  }

  .sidebar.sidebar--open {
    transform: translateX(0);
  }

  .dashboard-main {
    margin-left: 0;
  }

  .sidebar-logo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 18px 12px;
    border-bottom: 1px solid #edf0f2;
  }

  .sidebar-brand {
    gap: 8px;
  }

  .sidebar-brand__image {
    width: 42px;
    height: 42px;
    padding: 4px;
    border-radius: 12px;
    box-shadow: none;
  }

  .sidebar-brand__text {
    font-size: 16px;
  }

  .sidebar-close-btn {
    display: inline-flex !important;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #edf3f1;
    color: #1d2a2f;
    font-size: 21px;
  }

  .account-panel {
    margin: 12px 18px 16px !important;
    padding: 14px;
    border-radius: 18px;
    background: linear-gradient(135deg, #2f9d8c 0%, #2b69cf 100%);
    box-shadow: 0 16px 28px rgba(31, 122, 109, .2);
  }

  .account-panel__avatar {
    width: 48px;
    height: 48px;
    margin-bottom: 8px;
    border-radius: 15px;
    font-size: 20px;
  }

  .account-panel__meta strong {
    font-size: 16px;
  }

  .account-panel__actions {
    margin-top: 10px;
    gap: 8px;
  }

  .account-link {
    min-width: 0;
    padding: 9px 12px;
    font-size: 12px;
  }

  .sidebar-menu-area {
    padding: 0 18px 24px;
  }

  .sidebar-section-title {
    margin: 18px 6px 7px;
    font-size: 10px;
    letter-spacing: .14em;
  }

  .sidebar-menu > li {
    margin-bottom: 4px;
  }

  .sidebar-menu > li > a {
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 10px;
    background: transparent;
    border: 1px solid transparent;
    font-size: 13px;
  }

  .sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    font: inherit;
    font-size: 14px;
    justify-content: space-between;
    cursor: pointer;
    color: #1e293b;
  }

  .sidebar-menu__accordion-toggle .sidebar-menu__chevron {
    font-size: 18px;
    line-height: 1;
    transition: transform .2s ease;
  }

  .sidebar-menu__item--accordion.is-open > .sidebar-menu__accordion-toggle .sidebar-menu__chevron {
    transform: rotate(180deg);
  }

  .sidebar-menu__item--accordion > .sidebar-submenu {
    display: none;
    margin: 4px 0 8px;
    padding-left: 12px;
    border-left: 2px solid rgba(31, 122, 109, .22);
  }

  .sidebar-menu__item--accordion.is-open > .sidebar-submenu {
    display: block;
  }

  .sidebar-menu__item--accordion > .sidebar-submenu li {
    margin-bottom: 4px;
  }

  .sidebar-menu__item--accordion > .sidebar-submenu li a {
    padding: 9px 12px;
    border-radius: 8px;
    font-size: 13px;
  }
}

/* Edudash role dashboards */
.edudash-dashboard { color: #1f2937; }
.edudash-welcome-grid { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(360px, 1.8fr); gap: 16px; margin-bottom: 16px; }
.edudash-profile-card { display: block; min-height: 265px; padding: 26px 24px; border-radius: 16px; color: #fff; text-align: center; text-decoration: none; background: radial-gradient(circle at 8% 18%, rgba(255,255,255,.18), transparent 24%), radial-gradient(circle at 100% 80%, rgba(255,255,255,.12), transparent 28%), linear-gradient(145deg, #5b20d6, #8d48e7); box-shadow: 0 14px 30px rgba(91,32,214,.2); transition: transform .18s ease, box-shadow .18s ease; }
.edudash-profile-card:hover, .edudash-profile-card:focus-visible { color: #fff; text-decoration: none; transform: translateY(-2px); box-shadow: 0 18px 34px rgba(91,32,214,.26); }
.edudash-avatar { width: 74px; height: 74px; margin: 0 auto 14px; display: grid; place-items: center; border: 5px solid rgba(255,255,255,.75); border-radius: 50%; background: rgba(255,255,255,.22); font-size: 30px; font-weight: 800; }
.edudash-profile-card h2 { margin: 0 0 7px; font-size: 24px; color: #fff; }.edudash-profile-card p { margin: 0 0 20px; color: rgba(255,255,255,.9); }.edudash-profile-button { display: inline-flex; padding: 11px 17px; border-radius: 8px; color: #fff; background: rgba(255,255,255,.18); font-weight: 800; text-decoration: none; }
.edudash-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }.edudash-stat-card { min-height: 124px; padding: 20px; border-radius: 14px; display:flex; flex-direction:column; justify-content:center; }.edudash-stat-card span { font-weight: 700; color: #596273; }.edudash-stat-card strong { margin-top: 4px; font-size: 30px; line-height: 1.1; color: #17202a; }.edudash-stat-card small { margin-top: 7px; color:#6b7280; }.edudash-stat-card--violet{background:#efd9fb}.edudash-stat-card--green{background:#d8f6df}.edudash-stat-card--blue{background:#d7eeee}.edudash-stat-card--orange{background:#ffe0d9}
.edudash-stat-card[href] { color: inherit; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; }.edudash-stat-card[href]:hover, .edudash-stat-card[href]:focus-visible { color: inherit; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(23, 32, 42, .12); }.edudash-stat-card[href]:focus-visible { outline: 3px solid rgba(31, 122, 109, .35); outline-offset: 3px; }
.edudash-content-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:16px; }.edudash-panel { min-width:0; padding: 20px; border: 1px solid #e8ebef; border-radius: 14px; background:#fff; box-shadow:0 7px 20px rgba(31,41,55,.05); }.edudash-panel--attendance { grid-column: span 1; }.edudash-panel--wide { grid-column: span 2; }.edudash-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:14px; margin-bottom: 7px; border-bottom:1px solid #edf0f3; }.edudash-panel-heading h2 { margin:0; font-size:18px; color:#202936; }.edudash-panel-heading span,.edudash-panel-heading a { color:#77808d; font-size:12px; text-decoration:none; }.edudash-row { display:flex; justify-content:space-between; gap:15px; padding:14px 0; border-bottom:1px solid #edf0f3; }.edudash-row:last-child{border-bottom:0}.edudash-row strong,.edudash-row small{display:block}.edudash-row strong{font-size:14px}.edudash-row small{margin-top:5px;color:#7a8492;font-size:12px}.edudash-row em{align-self:center; padding:6px 9px; border-radius:5px; color:#4a9b65; background:#e2f8e8; font-size:11px; font-style:normal; white-space:nowrap}.leave-pending{color:#b67523!important;background:#fff1d7!important}.leave-approved{color:#398a58!important;background:#def7e5!important}.leave-rejected{color:#bd4a4a!important;background:#ffe2e2!important}.edudash-empty{color:#77808d;font-size:13px}.attendance-layout{display:flex;align-items:center;justify-content:center;gap:20px;min-height:205px}.attendance-ring{width:130px;height:130px;border-radius:50%;display:grid;place-items:center;align-content:center;background:conic-gradient(#4ca96c var(--attendance),#e7edf2 0);position:relative}.attendance-ring:after{content:"";position:absolute;inset:14px;border-radius:50%;background:#fff}.attendance-ring b,.attendance-ring small{z-index:1}.attendance-ring b{font-size:22px}.attendance-ring small{color:#7a8492}.attendance-legend{display:grid;gap:10px}.attendance-legend div{display:grid;grid-template-columns:10px 34px auto;align-items:center;gap:6px}.attendance-legend i{width:8px;height:8px;border-radius:50%}.attendance-legend strong{font-size:16px}.attendance-legend span{color:#77808d;font-size:12px}.edudash-table-wrap{overflow:auto}.edudash-table{width:100%;border-collapse:collapse;font-size:13px}.edudash-table th,.edudash-table td{padding:12px 10px;text-align:left;border-bottom:1px solid #edf0f3;white-space:nowrap}.edudash-table th{color:#687382;font-size:11px;text-transform:uppercase}.edudash-status{padding:5px 9px;border-radius:5px;font-size:11px}.edudash-status--pass{color:#398a58;background:#def7e5}.edudash-status--fail{color:#bd4a4a;background:#ffe2e2}.edudash-calendar-weekdays,.edudash-calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;text-align:center}.edudash-calendar-weekdays{margin:12px 0 8px;color:#77808d;font-size:11px}.edudash-calendar-days span{display:grid;place-items:center;min-height:31px;border-radius:7px;font-size:12px}.edudash-calendar-days span.today{color:#fff;background:#3f9b8b;font-weight:800}.edudash-dashboard--student .edudash-content-grid,.edudash-dashboard--teacher .edudash-content-grid{align-items:start}
/* Student dashboard tabs mirror the Edudash student-details navigation. */
.student-dashboard-tabs{display:flex;align-items:center;gap:4px;margin:22px 0 16px;padding:0 8px;border-bottom:1px solid #dfe8eb;overflow-x:auto}.student-dashboard-tabs a{flex:0 0 auto;padding:12px 15px 11px;border-bottom:2px solid transparent;color:#718096;font-size:13px;font-weight:800;text-decoration:none;white-space:nowrap}.student-dashboard-tabs a:hover,.student-dashboard-tabs a.is-active{border-bottom-color:var(--panel-primary);color:var(--panel-primary)}
.edudash-dashboard--student .edudash-content-grid>[data-student-dashboard-panel]{display:none}.edudash-dashboard--student .edudash-content-grid>[data-student-dashboard-panel].is-active{display:block;grid-column:1/-1}.edudash-dashboard--student .student-dashboard-extra{grid-column:1/-1}
@media (max-width: 1100px){.edudash-welcome-grid{grid-template-columns:1fr}.edudash-content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.edudash-panel--wide{grid-column:span 2}}
@media (max-width: 700px){.edudash-content-grid{grid-template-columns:1fr}.edudash-panel--wide{grid-column:auto}.edudash-stat-grid{grid-template-columns:1fr}.attendance-layout{justify-content:flex-start}.edudash-profile-card{min-height:220px}.edudash-table{min-width:620px}}

@media (max-width: 420px) {
  .dashboard-main {
    padding: 12px;
  }

  .dashboard-header__actions .top-action-link {
    flex: 1 1 calc(50% - 6px);
    text-align: center;
  }

  .edudash-panel,
  .edudash-profile-card,
  .edudash-stat-card {
    padding: 16px;
  }

  .attendance-layout {
    align-items: flex-start;
    flex-direction: column;
  }

  .attendance-ring {
    margin-inline: auto;
  }
}

.edudash-dashboard--student .edudash-welcome-grid{grid-template-columns:minmax(360px,1.12fr) minmax(280px,1fr)}
.edudash-dashboard--student .edudash-stat-grid{grid-template-columns:1fr}
.edudash-dashboard--student .edudash-content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.edudash-dashboard--student .edudash-panel--analytics,.edudash-dashboard--student .edudash-panel--wide{grid-column:span 2}
.edudash-dashboard--student .edudash-panel--attendance{order:1}
.edudash-dashboard--student .edudash-panel--today{order:2}
.edudash-dashboard--student .edudash-panel--analytics{order:3}
.edudash-dashboard--student .edudash-panel--trend{order:4}
.edudash-dashboard--student .edudash-panel--calendar{order:5}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(1){order:1}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(4){order:2}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(3){order:3}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(2){order:4}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(6){order:5}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(7){order:6}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(5){order:7}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(8){order:8}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(9){order:9}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(10){order:10}
.edudash-dashboard--student .edudash-content-grid > .edudash-panel:nth-child(11){order:11}
.statistics-filter-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;align-items:end}.statistics-filter-grid label{display:grid;gap:7px;color:#627084;font-size:12px;font-weight:800}.statistics-filter-grid select,.statistics-search input{width:100%;min-height:42px;padding:10px 12px;border:1px solid #dbe5e8;border-radius:10px;background:#fff;color:#263442}.statistics-filter-grid .module-button{min-height:42px}.statistics-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.statistics-bar-row{display:grid;grid-template-columns:minmax(110px,1fr) minmax(100px,2fr) 42px;gap:12px;align-items:center;padding:10px 0;color:#354456;text-decoration:none;border-bottom:1px solid #edf0f3;font-size:13px}.statistics-bar-row:last-child{border-bottom:0}.statistics-bar-row:hover{color:#0e827c}.statistics-bar-row b{height:9px;overflow:hidden;border-radius:99px;background:#edf2f3}.statistics-bar-row i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7c4bf0,#139387)}.statistics-bar-row strong{text-align:right}.statistics-search{display:flex;gap:10px;margin-bottom:14px}.statistics-search input{max-width:360px}.statistics-students td a{display:block;color:#147f78;font-weight:800;text-decoration:none}.statistics-students td small{display:block;margin-top:3px;color:#8290a0;font-size:11px}.statistics-pagination{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:16px;color:#738195;font-size:13px}.statistics-pagination a{padding:8px 12px;border:1px solid #dce7e9;border-radius:9px;color:#147f78;font-weight:800;text-decoration:none}.statistics-pagination a:hover{background:#eaf7f5}@media (max-width:900px){.statistics-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:640px){.statistics-filter-grid,.statistics-chart-grid{grid-template-columns:1fr}.statistics-search{align-items:stretch;flex-direction:column}.statistics-search input{max-width:none}.statistics-bar-row{grid-template-columns:minmax(100px,1fr) minmax(70px,1.3fr) 34px}}
.statistics-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.statistics-inline-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.statistics-inline-metrics span{display:grid;gap:5px;padding:10px;border-radius:10px;background:#f5f8f9;color:#718096;font-size:11px}.statistics-inline-metrics b{color:#1f2d3d;font-size:16px}.statistics-quality-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.statistics-quality-grid a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px;border:1px solid #e5edef;border-radius:10px;color:#4c6072;text-decoration:none}.statistics-quality-grid a:hover{border-color:#159185;color:#147f78}.statistics-quality-grid b{color:#c05b4f;font-size:18px}@media (max-width:900px){.statistics-inline-metrics,.statistics-quality-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.statistics-metric-grid{grid-template-columns:1fr}}
.statistics-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;border:1px solid #dce9e9;border-radius:14px;background:#f1faf8;color:#206b67}.statistics-toolbar strong,.statistics-toolbar small{display:block}.statistics-toolbar small{margin-top:4px;color:#70858f;font-size:11px}.statistics-alert-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.statistics-alert{display:grid;gap:5px;padding:14px 16px;border-left:4px solid #e1a33c;border-radius:10px;background:#fff8e9;color:#4b5e6b;text-decoration:none}.statistics-alert strong{color:#273844}.statistics-alert span{font-size:12px}.statistics-alert b{font-size:12px;color:#147f78}.statistics-alert--danger{border-color:#d7675e;background:#fff0ef}.statistics-history-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.statistics-history-grid>div{padding:14px;border:1px solid #e5edef;border-radius:10px}.statistics-history-grid span,.statistics-history-grid strong,.statistics-history-grid small{display:block}.statistics-history-grid span{color:#718096;font-size:12px}.statistics-history-grid strong{margin-top:7px;color:#213341;font-size:20px}.statistics-history-grid small{margin-top:4px;color:#778895;font-size:11px}@media (max-width:900px){.statistics-history-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.statistics-toolbar,.statistics-alert-grid,.statistics-history-grid{grid-template-columns:1fr;display:grid}.statistics-toolbar{justify-content:stretch}}
.edudash-dashboard--teacher .edudash-content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.edudash-dashboard--teacher .edudash-panel--attendance{grid-column:span 2;order:1}
.edudash-dashboard--teacher .edudash-panel--wide{grid-column:span 2}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(4){order:2}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(8){order:3}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(5){order:4}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(6){order:5}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(7){order:6}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(2){order:7}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(3){order:8}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(9){order:9}
.edudash-dashboard--teacher .edudash-content-grid > .edudash-panel:nth-child(10){order:10}
.profile-stat-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:0}.profile-stat-grid .edudash-stat-card{min-height:110px}.profile-stat-grid strong{font-size:24px}

@media (max-width: 700px) {
  .edudash-dashboard--student .edudash-welcome-grid,
  .edudash-dashboard--student .edudash-content-grid {
    grid-template-columns: 1fr;
  }

  .edudash-dashboard--student .edudash-panel--analytics,
  .edudash-dashboard--student .edudash-panel--wide {
    grid-column: auto;
  }

  .edudash-dashboard--teacher .edudash-content-grid {
    grid-template-columns: 1fr;
  }

  .edudash-dashboard--teacher .edudash-panel--attendance,
  .edudash-dashboard--teacher .edudash-panel--wide {
    grid-column: auto;
  }
}

@media print {
  body {
    background: #fff !important;
    color: #000 !important;
  }

  .sidebar,
  .navbar-header,
  .dashboard-header,
  .dashboard-header__actions,
  .module-header,
  .auth-floating-tools,
  .admin-topbar,
  .admin-footer {
    display: none !important;
  }

  .dashboard-main,
  .module-shell,
  .module-card {
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    background: #fff !important;
    max-width: 100% !important;
  }

  .module-table th,
  .module-table td {
    border-color: #d9d9d9 !important;
    color: #000 !important;
    background: #fff !important;
  }

  .module-badge {
    border: 1px solid #bbb !important;
    background: #fff !important;
    color: #000 !important;
  }
}

.mx-16 {
  margin-left: 16px;
  margin-right: 16px;
}

.my-16 {
  margin-top: 16px;
  margin-bottom: 16px;
}

.dashboard-header__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.dashboard-header__left {
  display: flex;
  align-items: flex-start;
  gap: 18px;
}

.dashboard-kicker {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--panel-primary);
}

.dashboard-title {
  margin: 0;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.05;
  max-width: 720px;
  letter-spacing: -0.04em;
}

.dashboard-subtitle {
  margin: 12px 0 0;
  max-width: 720px;
  color: var(--panel-muted);
  font-size: 16px;
}

.dashboard-header__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
}

.dashboard-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr);
  gap: 20px;
  margin-bottom: 20px;
}

.hero-card {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  padding: 32px;
  border-radius: 32px;
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.18), transparent 34%),
    radial-gradient(circle at 20% 120%, rgba(255, 255, 255, 0.12), transparent 26%),
    linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 45%, var(--panel-blue) 100%);
  color: #fff;
  box-shadow: 0 28px 80px rgba(34, 92, 120, 0.24);
}

.hero-card__content h2 {
  margin: 0 0 10px;
  font-size: clamp(28px, 4vw, 40px);
}

.hero-card__content p {
  margin: 0;
  max-width: 560px;
  color: rgba(255, 255, 255, 0.82);
}

.hero-card__highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.hero-highlight {
  min-width: 150px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
}

.hero-highlight span {
  display: block;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.74);
}

.hero-highlight strong {
  display: block;
  margin-top: 6px;
  font-size: 18px;
}

.hero-card__badge {
  display: inline-flex;
  align-items: center;
  margin-bottom: 16px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hero-card__metrics {
  display: grid;
  gap: 14px;
  min-width: 210px;
}

.hero-card__metrics div {
  padding: 18px 20px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
}

.hero-card__metrics strong {
  display: block;
  font-size: 28px;
  line-height: 1;
}

.hero-card__metrics span {
  display: block;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
}

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

.stat-card {
  padding: 24px;
  border-radius: 26px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(247, 243, 237, 0.94) 100%);
  border: 1px solid rgba(42, 72, 82, 0.08);
  box-shadow: 0 18px 44px rgba(31, 48, 56, 0.07);
}

.stat-card__label {
  display: block;
  margin-bottom: 12px;
  color: var(--panel-muted);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.stat-card strong {
  display: block;
  font-size: 34px;
  line-height: 1;
}

.stat-card p {
  margin: 10px 0 0;
  color: var(--panel-muted);
  font-size: 14px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.dashboard-panel {
  padding: 26px;
  border-radius: 28px;
  background: var(--panel-surface);
  border: 1px solid rgba(42, 72, 82, 0.08);
  box-shadow: var(--panel-shadow);
  backdrop-filter: blur(14px);
}

.dashboard-panel--wide {
  grid-column: span 2;
}

.dashboard-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.dashboard-panel__header h2 {
  margin: 4px 0 0;
  font-size: 22px;
  letter-spacing: -0.03em;
}

.dashboard-panel__eyebrow {
  margin: 0;
  color: var(--panel-primary);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.dashboard-panel__badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(31, 122, 109, 0.1);
  color: var(--panel-primary-deep);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.quick-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}

.module-directory {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.module-directory__group {
  padding: 20px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(42, 72, 82, 0.08);
}

.module-directory__group h3 {
  margin: 0 0 14px;
  font-size: 18px;
  letter-spacing: -0.02em;
}

.module-directory__links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.module-directory__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 14px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  color: var(--panel-primary-deep);
  background: rgba(31, 122, 109, 0.08);
  border: 1px solid rgba(31, 122, 109, 0.12);
}

.quick-link-card {
  display: block;
  padding: 20px;
  border-radius: 22px;
  text-decoration: none;
  color: var(--panel-text);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(244, 239, 231, 0.92) 100%);
  border: 1px solid rgba(42, 72, 82, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.quick-link-card:hover {
  transform: translateY(-2px);
  border-color: rgba(31, 122, 109, 0.26);
  box-shadow: 0 18px 30px rgba(31, 122, 109, 0.12);
}

.quick-link-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
}

.quick-link-card span {
  color: var(--panel-muted);
  font-size: 14px;
}

.finance-stack,
.attendance-stack,
.notice-stack {
  display: grid;
  gap: 14px;
}

.finance-item,
.attendance-item,
.notice-card {
  padding: 18px 20px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(42, 72, 82, 0.08);
}

.finance-item--accent {
  background: linear-gradient(135deg, rgba(31, 122, 109, 0.12) 0%, rgba(47, 157, 140, 0.16) 100%);
  border-color: rgba(31, 122, 109, 0.18);
}

.finance-item span,
.attendance-item span,
.notice-card span {
  display: block;
  color: var(--panel-muted);
  font-size: 13px;
}

.finance-item strong,
.attendance-item strong,
.notice-card strong {
  display: block;
  margin-top: 6px;
  font-size: 24px;
}

.notice-card p {
  margin: 8px 0 0;
  color: var(--panel-muted);
  font-size: 14px;
}

.dashboard-list {
  display: grid;
  gap: 12px;
}

.dashboard-list__item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(42, 72, 82, 0.08);
}

.dashboard-list__avatar {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 100%);
  color: #fff;
  font-weight: 800;
}

.dashboard-list__content strong {
  display: block;
  font-size: 16px;
}

.dashboard-list__content span,
.dashboard-list__item time {
  color: var(--panel-muted);
  font-size: 13px;
}

.fee-table {
  display: grid;
  gap: 12px;
}

.fee-table__row {
  display: grid;
  grid-template-columns: 1.4fr 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(42, 72, 82, 0.08);
}

.fee-table__row strong {
  display: block;
  font-size: 15px;
}

.fee-table__row span {
  color: var(--panel-muted);
  font-size: 13px;
}

.progress-track {
  margin-top: 16px;
  width: 100%;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(31, 122, 109, 0.1);
}

.progress-track__bar {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--panel-accent) 0%, var(--panel-primary) 100%);
}

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.status-pill--paid {
  background: #dcfce7;
  color: #166534;
}

.status-pill--partial {
  background: #fef3c7;
  color: #92400e;
}

.status-pill--unpaid {
  background: #fee2e2;
  color: #991b1b;
}

.sidebar-section-title {
  margin: 18px 10px 10px;
  color: var(--panel-muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.sidebar-menu__link {
  width: 100%;
}

.sidebar-menu__link--active,
.sidebar-menu__link:hover {
  background: linear-gradient(135deg, var(--panel-primary) 0%, #2f9d8c 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(59, 130, 246, .55);
  outline-offset: 2px;
}

@media (max-width: 1200px) {
  .dashboard-overview,
  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-panel--wide {
    grid-column: auto;
  }
}

@media (max-width: 768px) {
  .dashboard-header__row,
  .dashboard-header__left,
  .hero-card,
  .fee-table__row,
  .dashboard-list__item {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: flex-start;
  }

  .dashboard-header__actions {
    width: 100%;
    justify-content: stretch;
  }

  .dashboard-header__actions .top-action-link {
    flex: 1 1 180px;
  }

  .stats-grid {
    grid-template-columns: 1fr;
  }

}
.edudash-panel--trend {
  background: linear-gradient(145deg, #ffffff 0%, #f7f5ff 100%);
}

.module-table-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 10px;
}

.module-table-count {
  color: #77808d;
  font-size: 12px;
  font-weight: 700;
}

.module-table-page-size__label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #77808d;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.module-table-page-size {
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid #dbe4f0;
  border-radius: 8px;
  background: #fff;
  color: var(--panel-text);
  font-size: 11px;
  font-weight: 700;
}

.module-table-search {
  width: min(100%, 280px);
  padding: 10px 13px;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  outline: none;
  background: #f8fafc;
  color: var(--panel-text);
}

.module-table-search:focus {
  border-color: var(--panel-primary);
  box-shadow: 0 0 0 3px rgba(31, 122, 109, .12);
}

.module-table-filter {
  min-width: 145px;
  padding: 10px 13px;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  background: #f8fafc;
  color: var(--panel-text);
  font: inherit;
  font-size: 13px;
}

.module-table-filter:focus {
  border-color: var(--panel-primary);
  outline: none;
  box-shadow: 0 0 0 3px rgba(31, 122, 109, .12);
}

.module-table-pager {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 10px;
}

.module-table-pager__button {
  padding: 8px 12px;
  border: 1px solid #dbe4f0;
  border-radius: 9px;
  background: #fff;
  color: var(--panel-text);
  font-size: 12px;
  font-weight: 700;
}

.module-table-pager__button:disabled {
  cursor: not-allowed;
  opacity: .45;
}

.module-table-pager__label {
  color: #77808d;
  font-size: 12px;
  font-weight: 700;
}

@media (max-width: 700px) {
  .module-table-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .module-table-page-size__label {
    justify-content: space-between;
  }

  .module-table-page-size {
    flex: 1;
  }

  .module-table-search {
    width: 100%;
  }

  .module-table-filter {
    width: 100%;
  }
}

.edudash-panel--analytics {
  grid-column: span 2;
  background: linear-gradient(145deg, #ffffff 0%, #f2fbfa 100%);
}

.edudash-subject-analytics {
  display: grid;
  gap: 16px;
  padding-top: 8px;
}

.edudash-subject-analytics__label {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 7px;
}

.edudash-subject-analytics__label strong {
  font-size: 13px;
}

.edudash-subject-analytics__label span {
  color: #77808d;
  font-size: 11px;
}

.edudash-subject-analytics__track {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: #e5f0ef;
}

.edudash-subject-analytics__track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #3f9b8b, #5b2bd6);
}

.edudash-trend {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  min-height: 205px;
  padding: 12px 2px 0;
}

.edudash-trend__item {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.edudash-trend__bar {
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 130px;
  padding: 0 7px;
  border-radius: 10px 10px 5px 5px;
  background: linear-gradient(180deg, #f0ebff 0%, #f8f9fb 100%);
}

.edudash-trend__bar span {
  display: block;
  width: 100%;
  min-height: 8px;
  border-radius: 7px 7px 3px 3px;
  background: linear-gradient(180deg, #7652e8 0%, #5930c7 100%);
  box-shadow: 0 7px 14px rgba(89, 48, 199, .2);
}

.edudash-trend__item strong {
  color: #3f2b86;
  font-size: 12px;
}

.edudash-trend__item small {
  color: #7a8492;
  font-size: 11px;
}

/* Final detail-page polish, kept last to override legacy component defaults. */
.module-header {
  position: relative;
  overflow: hidden;
  padding: 22px 26px 22px 30px;
  border: 1px solid #dfe8eb;
  border-radius: 18px;
  background: #fff;
  color: var(--panel-text);
  box-shadow: 0 8px 24px rgba(30, 47, 66, .05);
}

.module-header::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--panel-primary), var(--panel-blue));
}

.module-header h1 { color: #17212b; font-size: clamp(26px, 3vw, 34px); }
.module-header p { color: #718096; font-size: 14px; }

.module-card {
  padding: 20px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid #e3e9ef;
  box-shadow: 0 6px 18px rgba(30, 47, 66, .04);
}

.profile-stat-grid { gap: 12px; }
.profile-stat-grid .edudash-stat-card {
  min-height: 106px;
  padding: 17px 18px;
  border: 1px solid #e3e9ef;
  border-top: 3px solid #9bcfc5;
  border-radius: 13px;
  background: #fff;
  box-shadow: none;
}
.profile-stat-grid .edudash-stat-card:nth-child(2) { border-top-color: #bda4dd; }
.profile-stat-grid .edudash-stat-card:nth-child(3) { border-top-color: #8fbaca; }
.profile-stat-grid .edudash-stat-card:nth-child(4) { border-top-color: #e4aa9a; }
.profile-stat-grid .edudash-stat-card--violet,
.profile-stat-grid .edudash-stat-card--green,
.profile-stat-grid .edudash-stat-card--blue,
.profile-stat-grid .edudash-stat-card--orange { background: #fff; }
.profile-stat-grid .edudash-stat-card span { color: #64748b; font-size: 12px; }
.profile-stat-grid .edudash-stat-card strong { margin-top: 7px; color: #17212b; font-size: 25px; }
.profile-stat-grid .edudash-stat-card small { margin-top: 5px; color: #8793a1; font-size: 12px; }
.module-grid .placeholder-panel { min-height: 84px; background: #f8fafc; }
.module-toolbar h2 { color: #25313d; font-size: 20px; }

/* Keep the refined header scale after the legacy dashboard rules. */
.navbar-header {
  padding: 18px 22px;
  border: 1px solid #e7ecf2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(30, 47, 66, .04);
}

.dashboard-header__row {
  gap: 20px;
}

.dashboard-header__left {
  align-items: center;
  gap: 14px;
}

.dashboard-title {
  font-size: clamp(25px, 3vw, 36px);
  letter-spacing: -.035em;
}

.dashboard-subtitle {
  margin-top: 7px;
  font-size: 14px;
}

.navbar-search {
  min-width: 220px;
  padding: 10px 13px;
  border-radius: 10px;
  background: #f8fafc;
  border-color: #e1e8ef;
}

.top-action-link {
  min-width: auto;
  padding: 10px 13px;
  border-radius: 10px;
  font-size: 12px;
}

@media (max-width: 700px) {
  .edudash-panel--analytics {
    grid-column: auto;
  }

  .edudash-trend {
    gap: 6px;
  }

  .edudash-trend__bar {
    padding: 0 4px;
  }
}

/* Student detail: Edudash-inspired profile header and section navigation */
.student-details-page > .module-header {
  display: none;
}

.student-profile-card {
  display: grid;
  grid-template-columns: minmax(230px, .72fr) minmax(0, 1.45fr);
  gap: 28px;
  padding: 24px;
  margin-top: 18px;
  border-radius: 18px;
}

.student-profile-card__identity {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 8px 24px 8px 8px;
  border-right: 1px solid #e7edf1;
  text-align: center;
}

.student-profile-card__identity > img {
  width: 112px;
  height: 112px;
  margin-bottom: 13px;
  padding: 10px;
  border-radius: 50%;
  background: #e8f2ef;
}

.student-profile-card__eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #6f8d8f;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.student-profile-card h2 {
  margin: 0 0 8px;
  color: #1d2b36;
  font-size: 24px;
}

.student-profile-card__identity p {
  margin: 2px 0;
  color: #788694;
  font-size: 13px;
}

.student-profile-card__identity p strong {
  color: var(--panel-primary);
}

.student-profile-card__actions {
  display: flex;
  gap: 8px;
  margin-top: 18px;
}

.student-profile-card__info {
  min-width: 0;
  padding: 4px 0;
}

.student-profile-card__info .module-toolbar {
  align-items: flex-start;
  padding-bottom: 13px;
  border-bottom: 1px solid #e7edf1;
}

.student-profile-card__info .module-toolbar h2 {
  margin: 0;
  font-size: 20px;
}

.student-profile-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 28px;
  margin: 12px 0 0;
}

.student-profile-facts > div {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid #f0f3f5;
}

.student-profile-facts dt,
.student-profile-facts dd {
  margin: 0;
  font-size: 13px;
}

.student-profile-facts dt {
  color: #263442;
  font-weight: 800;
}

.student-profile-facts dd {
  overflow-wrap: anywhere;
  color: #718096;
}

.student-profile-facts__wide {
  grid-column: 1 / -1;
}

.student-profile-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.student-profile-metrics > div {
  padding: 12px 13px;
  border: 1px solid #e7edf1;
  border-radius: 12px;
  background: #f8fbfb;
}

.student-profile-metrics span,
.student-profile-metrics small,
.student-profile-metrics strong {
  display: block;
}

.student-profile-metrics span {
  color: #718096;
  font-size: 11px;
  font-weight: 700;
}

.student-profile-metrics strong {
  margin-top: 3px;
  color: #263442;
  font-size: 20px;
}

.student-profile-metrics small {
  margin-top: 2px;
  color: #8a98a5;
  font-size: 10px;
}

.student-detail-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 18px 0 14px;
  padding: 0 8px;
  border-bottom: 1px solid #dfe8eb;
  overflow-x: auto;
}

.student-detail-tabs a {
  flex: 0 0 auto;
  padding: 12px 15px 11px;
  border-bottom: 2px solid transparent;
  color: #718096;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.student-detail-tabs a:hover,
.student-detail-tabs a.is-active {
  border-bottom-color: var(--panel-primary);
  color: var(--panel-primary);
}

.student-detail-tabs a.is-active {
  border-radius: 10px 10px 0 0;
  background: linear-gradient(135deg, #0f766e, #2563a8);
  color: #fff;
  box-shadow: 0 -2px 10px rgba(37, 99, 168, .12);
}

/* Keep the selected tab's content directly below the tab bar, like the reference demo. */
.student-detail-panels {
  display: grid;
  gap: 16px;
}

.student-detail-insights {
  display: contents;
}

.student-detail-panel {
  display: none;
  min-width: 0;
  margin: 0;
}

.student-detail-panel.is-active {
  display: block;
}

.student-schedule-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 12px;
}

.student-schedule-day {
  overflow: hidden;
  border: 1px solid #dbe9e6;
  border-radius: 14px;
  background: #f7fbfa;
  box-shadow: 0 8px 18px rgba(31, 78, 73, .06);
}

.student-schedule-day__header {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px 14px;
  border-bottom: 1px solid #dbe9e6;
  background: #fff;
}

.student-schedule-day__index {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, var(--panel-primary), #318f81);
  font-size: 11px;
  font-weight: 800;
}

.student-schedule-day__header strong,
.student-schedule-day__header small,
.student-schedule-entry__body strong,
.student-schedule-entry__body span,
.student-schedule-entry__body small {
  display: block;
}

.student-schedule-day__header strong {
  color: #20343a;
  font-size: 14px;
}

.student-schedule-day__header small {
  margin-top: 3px;
  color: #819095;
  font-size: 11px;
}

.student-schedule-day__items {
  display: grid;
  gap: 7px;
  padding: 10px;
}

.student-schedule-entry {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 1px solid #e1eeeb;
  border-radius: 10px;
  background: #fff;
}

.student-schedule-entry__time {
  padding-right: 10px;
  border-right: 1px solid #e7eeee;
}

.student-schedule-entry__time strong,
.student-schedule-entry__time span {
  display: block;
  white-space: nowrap;
}

.student-schedule-entry__time strong {
  color: var(--panel-primary-deep);
  font-size: 13px;
}

.student-schedule-entry__time span {
  margin-top: 3px;
  color: #91a0a5;
  font-size: 11px;
}

.student-schedule-entry__body {
  min-width: 0;
}

.student-schedule-entry__body strong {
  overflow: hidden;
  color: #24343a;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.student-schedule-entry__body span {
  margin-top: 5px;
  overflow: hidden;
  color: #71858a;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.student-schedule-entry__body small {
  margin-top: 7px;
  color: #8b9a9f;
  font-size: 10px;
  line-height: 1.4;
}

.student-schedule-matrix-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  padding: 4px 2px 8px;
}

.student-schedule-matrix {
  min-width: 760px;
  overflow: hidden;
  border: 1px solid #dce9e6;
  border-radius: 18px;
  background: #f8fbfb;
  box-shadow: 0 14px 32px rgba(31, 78, 73, .08);
}

.student-schedule-matrix__row {
  display: grid;
  grid-template-columns: 148px repeat(var(--schedule-slot-count), minmax(180px, 1fr));
  min-height: 58px;
  background: #fff;
}

.student-schedule-matrix__row--header {
  min-height: 66px;
  color: #fff;
  background: linear-gradient(135deg, #17584f 0%, #278978 100%);
}

.student-schedule-matrix__cell {
  min-width: 0;
  padding: 11px 13px;
  border-right: 1px solid #e5efed;
  border-bottom: 1px solid #e5efed;
  font-size: 11px;
}

.student-schedule-matrix__cell:last-child {
  border-right: 0;
}

.student-schedule-matrix__row:last-child .student-schedule-matrix__cell {
  border-bottom: 0;
}

.student-schedule-matrix__cell--day {
  display: flex;
  align-items: center;
  color: #30484b;
  background: linear-gradient(90deg, #f1f8f6 0%, #f8fbfb 100%);
  font-weight: 800;
}

.student-schedule-matrix__row--header .student-schedule-matrix__cell {
  display: flex;
  align-items: center;
  gap: 3px;
  color: rgba(255, 255, 255, .94);
  font-weight: 800;
}

.student-schedule-matrix__row--header .student-schedule-matrix__cell:not(.student-schedule-matrix__cell--day) {
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.student-schedule-matrix__cell small {
  display: block;
  color: rgba(255, 255, 255, .7);
  font-size: 10px;
}

.student-schedule-matrix__cell--lesson {
  min-height: 76px;
  vertical-align: top;
}

.student-schedule-matrix__cell--lesson:empty {
  background: #fbfdfd;
}

.student-schedule-matrix__lesson + .student-schedule-matrix__lesson {
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px dashed #d5dfdc;
}

.student-schedule-matrix__lesson {
  padding: 8px 9px;
  border: 1px solid #e1eeeb;
  border-radius: 10px;
  background: linear-gradient(135deg, #f8fcfb 0%, #eef8f5 100%);
}

.student-schedule-matrix__lesson strong,
.student-schedule-matrix__lesson small {
  display: block;
  line-height: 1.25;
}

.student-schedule-matrix__lesson strong {
  color: #17584f;
  font-size: 11px;
}

.student-schedule-matrix__lesson small {
  margin-top: 2px;
  color: #71868a;
  font-size: 10px;
}

@media (max-width: 700px) {
  #student-schedule {
    padding: 14px;
  }

  #student-schedule .module-toolbar {
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
  }

  #student-schedule .module-toolbar__actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  #student-schedule .module-toolbar__actions .module-button {
    min-width: 0;
    width: 100%;
    padding: 9px 7px;
    font-size: 10px;
    text-align: center;
  }

  #student-schedule .module-toolbar__actions .module-badge {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .student-schedule-matrix-wrap {
    overflow-x: hidden;
    padding: 0 0 4px;
  }

  .student-schedule-matrix {
    min-width: 0;
    border-radius: 14px;
  }

  .student-schedule-matrix__row {
    grid-template-columns: minmax(62px, .62fr) repeat(var(--schedule-slot-count), minmax(0, 1fr));
    min-height: 52px;
  }

  .student-schedule-matrix__cell {
    padding: 8px 6px;
    font-size: 9px;
  }

  .student-schedule-matrix__row--header {
    min-height: 58px;
  }

  .student-schedule-matrix__cell small {
    font-size: 9px;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

  .student-schedule-matrix__cell--lesson {
    min-height: 62px;
  }

  .student-schedule-matrix__lesson {
    padding: 6px 5px;
    border-radius: 8px;
  }

  .student-schedule-matrix__lesson + .student-schedule-matrix__lesson {
    margin-top: 6px;
    padding-top: 6px;
  }

  .student-schedule-matrix__lesson strong,
  .student-schedule-matrix__lesson small {
    font-size: 9px;
    overflow-wrap: anywhere;
  }
}


.student-guardians-card {
  margin-top: 16px;
}

.student-guardians-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.student-guardian-item {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  padding: 14px;
  border: 1px solid #e7edf1;
  border-radius: 12px;
  background: #fbfcfd;
}

.student-guardian-item img {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  padding: 4px;
  border-radius: 50%;
  background: #e8f2ef;
}

.student-guardian-item strong,
.student-guardian-item small,
.student-guardian-item span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.student-guardian-item strong { color: #263442; font-size: 13px; }
.student-guardian-item small { margin-top: 2px; color: var(--panel-primary); font-size: 11px; font-weight: 700; }
.student-guardian-item span { margin-top: 4px; color: #7b8794; font-size: 11px; }

@media (max-width: 900px) {
  .student-profile-card { grid-template-columns: 1fr; }
  .student-profile-card__identity { padding: 8px 8px 22px; border-right: 0; border-bottom: 1px solid #e7edf1; }
  .student-guardians-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .student-profile-card { padding: 16px; }
  .student-profile-facts { grid-template-columns: 1fr; }
  .student-profile-facts__wide { grid-column: auto; }
  .student-profile-card__actions { width: 100%; }
  .student-profile-card__actions .module-button { flex: 1; justify-content: center; }
  .student-profile-metrics { grid-template-columns: 1fr; }
}

/* Student profile refinement: keep every field, reduce visual weight, and
   follow the compact information-card layout used in the reference screen. */
.student-details-page .student-profile-card {
  grid-template-columns: minmax(250px, .72fr) minmax(0, 1.65fr);
  gap: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e4ebef;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(30, 47, 66, .05);
}

.student-details-page .student-profile-card__identity {
  min-height: 100%;
  padding: 30px 24px;
  border-right: 1px solid #e5ecef;
  background: linear-gradient(180deg, #fbfdfd 0%, #f2f8f7 100%);
}

.student-details-page .student-profile-card__identity > img {
  width: 94px;
  height: 94px;
  margin-bottom: 12px;
  padding: 8px;
  border: 7px solid #e5f0ee;
  background: #dcd7ff;
  box-shadow: 0 5px 16px rgba(40, 69, 84, .08);
}

.student-details-page .student-profile-card__eyebrow {
  color: #16796e;
  font-size: 10px;
  letter-spacing: .12em;
}

.student-details-page .student-profile-card h2 {
  margin-bottom: 6px;
  font-size: clamp(20px, 2vw, 25px);
  letter-spacing: -.025em;
}

.student-details-page .student-profile-card__identity p {
  font-size: 12px;
}

.student-details-page .student-profile-card__actions {
  width: 100%;
  margin-top: 16px;
}

.student-details-page .student-profile-card__actions .module-button {
  flex: 1;
  justify-content: center;
  min-width: 0;
  padding: 9px 10px;
  font-size: 11px;
}

.student-details-page .student-profile-card__info {
  padding: 24px 26px 20px;
}

.student-details-page .student-profile-card__info .module-toolbar {
  padding-bottom: 11px;
}

.student-details-page .student-profile-card__info .module-toolbar h2 {
  font-size: 19px;
}

.student-details-page .student-profile-facts {
  gap: 0 24px;
  margin-top: 8px;
}

.student-details-page .student-profile-facts > div {
  grid-template-columns: minmax(92px, .8fr) minmax(0, 1.2fr);
  gap: 10px;
  min-height: 42px;
  padding: 9px 0;
}

.student-details-page .student-profile-facts dt,
.student-details-page .student-profile-facts dd {
  font-size: 12px;
  line-height: 1.35;
}

.student-details-page .student-profile-facts dt {
  color: #31404b;
}

.student-details-page .student-profile-facts dd {
  color: #687b86;
}

.student-details-page .student-profile-metrics {
  gap: 9px;
  margin-top: 13px;
}

.student-details-page .student-profile-metrics > div {
  padding: 10px 12px;
  border-radius: 11px;
  background: #f3f8fa;
}

.student-details-page .student-profile-metrics strong {
  font-size: 19px;
}

.student-details-page .teacher-profile-subsection {
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid #edf1f3;
}

.student-details-page .teacher-profile-subsection h3 {
  margin-bottom: 8px;
  font-size: 13px;
}

.student-details-page .teacher-chip-list {
  gap: 7px;
}

.student-details-page .teacher-chip-list > span {
  padding: 8px 10px;
  border-radius: 9px;
}

.student-details-page .student-detail-tabs {
  margin-top: 14px;
  margin-bottom: 12px;
  padding: 0 6px;
}

.student-details-page .student-detail-tabs a {
  padding: 11px 13px 10px;
  font-size: 12px;
}

@media (max-width: 900px) {
  .student-details-page .student-profile-card {
    grid-template-columns: 1fr;
  }

  .student-details-page .student-profile-card__identity {
    min-height: 0;
    padding: 24px 20px;
    border-right: 0;
    border-bottom: 1px solid #e5ecef;
  }

  .student-details-page .student-profile-card__info {
    padding: 20px;
  }
}

@media (max-width: 600px) {
  .student-details-page .student-profile-card {
    border-radius: 14px;
  }

  .student-details-page .student-profile-card__identity {
    padding: 22px 16px 20px;
  }

  .student-details-page .student-profile-card__info {
    padding: 18px 16px 16px;
    width: 100%;
  }

  .student-details-page .student-profile-facts {
    grid-template-columns: 1fr;
  }

  .student-details-page .student-profile-facts > div {
    grid-template-columns: minmax(98px, .72fr) minmax(0, 1.28fr);
    min-height: 40px;
  }

  .student-details-page .student-profile-card__actions {
    flex-wrap: wrap;
  }

  .student-details-page .student-profile-card__actions .module-button {
    min-width: 132px;
  }
}

.student-details-page .student-privacy-card {
  margin-top: 12px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #ead3d1;
  border-radius: 13px;
  background: #fff;
}

.student-details-page .student-privacy-card__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 18px 10px;
  background: #fff4f3;
}

.student-details-page .student-privacy-card__heading .student-profile-card__eyebrow {
  margin-bottom: 2px;
  color: #ae5a53;
}

.student-details-page .student-privacy-card__heading h2 {
  margin: 0;
  color: #493b3b;
  font-size: 16px;
}

.student-details-page .student-privacy-card__badge {
  flex: 0 0 auto;
  padding: 6px 9px;
  border-radius: 999px;
  background: #f2d8d6;
  color: #9a514d;
  font-size: 10px;
  font-weight: 800;
}

.student-details-page .student-privacy-card__notice {
  margin: 0;
  padding: 10px 18px;
  color: #5f646b;
  font-size: 12px;
  line-height: 1.45;
}

.student-details-page .student-privacy-details {
  border-top: 1px solid #f0e3e2;
}

.student-details-page .student-privacy-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 18px;
  color: #9a514d;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  list-style: none;
}

.student-details-page .student-privacy-details summary::-webkit-details-marker {
  display: none;
}

.student-details-page .student-privacy-details summary::after {
  content: '+';
  font-size: 18px;
  line-height: 1;
}

.student-details-page .student-privacy-details[open] summary::after {
  content: '−';
}

.student-details-page .student-privacy-details__facts {
  margin: 0;
  padding: 0 18px 12px;
}

@media (max-width: 600px) {
  .student-details-page .student-privacy-card__heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .student-details-page .student-privacy-card__notice,
  .student-details-page .student-privacy-details summary {
    padding-right: 14px;
    padding-left: 14px;
  }

  .student-details-page .student-privacy-details__facts {
    padding-right: 14px;
    padding-left: 14px;
  }
}

/* Student list: compact Edudash-inspired data table */
.student-list-page .student-import-card {
  padding: 18px 20px;
  margin-top: 18px;
}

.student-list-page .student-import-card__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.student-list-page .student-import-card__eyebrow {
  display: inline-flex;
  margin-bottom: 6px;
  color: #16796e;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.student-list-page .student-import-card__heading p {
  margin-bottom: 0;
  color: #718096;
  font-size: 12px;
}

.student-list-page .student-import-card__identity-link {
  flex: 0 0 auto;
  margin-top: 2px;
}

.student-list-page .student-import-card__details {
  margin: 12px 0 14px;
  padding: 9px 12px;
  border: 1px solid #e2ebee;
  border-radius: 10px;
  background: #f7fbfb;
  color: #61798a;
  font-size: 11px;
  line-height: 1.5;
}

.student-list-page .student-import-card__details summary {
  cursor: pointer;
  color: #16796e;
  font-weight: 800;
  list-style-position: inside;
}

.student-list-page .student-import-card__details p {
  margin: 8px 0 0;
  font-size: 11px;
}

.student-list-page > .module-header {
  display: none;
}

.student-list-page > .profile-stat-grid {
  margin-top: 18px;
}

.student-list-page .student-import-card h2 {
  margin-bottom: 5px;
  font-size: 18px;
}

.student-list-page .student-import-card p {
  margin-bottom: 14px;
  color: #718096;
  font-size: 13px;
}

.student-list-page .student-quality-summary {
  margin-top: 18px;
  padding: 18px 20px;
  border-color: #d8e9e7;
  background: linear-gradient(135deg, #fbffff, #f5fbfa);
}

.student-list-page .student-quality-summary .module-toolbar {
  align-items: flex-start;
}

.student-list-page .student-quality-summary h2 {
  margin: 0 0 5px;
  font-size: 18px;
}

.student-list-page .student-quality-summary p {
  max-width: 720px;
  margin: 0;
  color: #657585;
  font-size: 13px;
}

.student-quality-summary__items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.student-quality-summary__items > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 14px;
  border: 1px solid #e1ecec;
  border-radius: 12px;
  background: #fff;
}

.student-quality-summary__items strong {
  color: #173b43;
  font-size: 20px;
}

.student-quality-summary__items span,
.student-quality-reason {
  color: #5f7380;
  font-size: 12px;
  font-weight: 700;
}

.student-quality-reason {
  display: inline-flex;
  max-width: 190px;
  padding: 6px 8px;
  border-radius: 8px;
  background: #fff5e8;
  color: #9a641f;
  line-height: 1.35;
}

.student-list-page .student-table-card {
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  margin-top: 18px;
}

.student-list-page .student-table-card > form {
  padding: 18px 20px 10px;
  margin-bottom: 0 !important;
  border-bottom: 1px solid #edf1f4;
}

.student-list-page .student-table {
  min-width: 840px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.student-list-page .student-table th {
  padding: 13px 14px;
  background: #f2f6f7;
  color: #657585;
  border-bottom: 1px solid #e2e9ed;
  font-size: 11px;
  letter-spacing: .08em;
}

.student-list-page .student-table td {
  padding: 14px;
  height: 70px;
  border-bottom: 1px solid #edf1f4;
  color: #536273;
  font-size: 13px;
  vertical-align: middle;
}

.student-list-page .student-table td:nth-child(4),
.student-list-page .student-table td:nth-child(5),
.student-list-page .student-table td:nth-child(7) {
  white-space: nowrap;
}

.student-list-page .student-table tbody tr:hover td {
  background: #fbfdfd;
}

.student-table__check {
  width: 46px;
  text-align: center !important;
}

.student-table__check input {
  width: 17px;
  height: 17px;
  accent-color: var(--panel-primary);
}

.student-admission {
  color: var(--panel-primary);
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.student-table__person {
  display: flex;
  align-items: center;
  min-width: 165px;
  gap: 10px;
}

.student-table__person img {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
  background: #e8f2ef;
  object-fit: cover;
}

.student-table__person strong,
.student-table__person small {
  display: block;
}

.student-table__person strong {
  color: #263442;
  font-size: 13px;
}

.student-table__person small {
  margin-top: 3px;
  color: #8a96a4;
  font-size: 11px;
}

.student-list-page .module-badge--active {
  padding: 6px 10px;
  border-radius: 999px;
  background: #e3f3ed;
  color: #27816a;
  font-size: 11px;
}

.student-list-page .module-badge--success,
.student-list-page .module-badge--warning {
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
}

.student-list-page .module-badge--success {
  background: #e9e4fb;
  color: #6848c7;
}

.student-list-page .module-badge--warning {
  background: #fff1df;
  color: #a5631b;
}

.student-list-page .student-table .module-actions {
  flex-wrap: nowrap;
  align-items: center;
  gap: 5px;
}

.student-list-page .student-table th:last-child,
.student-list-page .student-table td:last-child {
  width: 184px;
  min-width: 184px;
  white-space: nowrap;
}

.student-list-page .student-table .module-button {
  min-width: auto;
  flex: 0 0 auto;
  padding: 7px 9px;
  border-radius: 7px;
  font-size: 11px;
  white-space: nowrap;
  overflow-wrap: normal;
}

/* Keep management-table actions readable across people lists. */
.teacher-list-table th:last-child,
.teacher-list-table td:last-child {
  min-width: 330px;
  white-space: nowrap;
}

.employee-list-table,
.guardian-list-table {
  min-width: 760px;
}

.employee-list-table th:last-child,
.employee-list-table td:last-child,
.guardian-list-table th:last-child,
.guardian-list-table td:last-child {
  width: 190px;
  min-width: 190px;
  white-space: nowrap;
}

.teacher-list-table .module-actions,
.employee-list-table .module-actions,
.guardian-list-table .module-actions {
  align-items: center;
  gap: 5px;
  margin-top: 0;
}

.teacher-list-table .module-actions {
  flex-wrap: wrap;
}

.teacher-list-table .module-button,
.employee-list-table .module-button,
.guardian-list-table .module-button {
  min-width: auto;
  flex: 0 0 auto;
  padding: 7px 9px;
  border-radius: 7px;
  font-size: 11px;
  white-space: nowrap;
  overflow-wrap: normal;
}

/* Teacher directory: denser desktop table with a card-like mobile fallback. */
.teacher-list-page { --teacher-border: #e4ecee; }
.teacher-list-page .module-header { align-items: flex-end; gap: 12px; }
.teacher-list-page .module-header > div { min-width: 0; flex: 1; }
.teacher-list-page .module-header .module-button { flex: 0 0 auto; }
.teacher-list-filter-card { padding-bottom: 16px; }
.teacher-list-filter-card .module-toolbar { margin-bottom: 14px; }
.teacher-list-filter-card .module-toolbar h2 { margin-bottom: 4px; }
.teacher-list-filter-card .module-toolbar p { margin: 0; color: #839197; font-size: 12px; }
.teacher-list-filter { align-items: end; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, .9fr) auto; }
.teacher-list-filter__actions { align-self: end; flex-wrap: nowrap; }
.teacher-list-filter__actions .module-button { white-space: nowrap; }
.teacher-list-results-card { padding: 0; overflow: hidden; }
.teacher-table-wrap { width: 100%; overflow-x: auto; }
.teacher-list-table { min-width: 1060px; margin: 0; }
.teacher-list-table th { padding-top: 13px; padding-bottom: 13px; background: #f7fafb; }
.teacher-list-table td { padding-top: 12px; padding-bottom: 12px; vertical-align: middle; }
.teacher-list-table tbody tr { transition: background-color .16s ease; }
.teacher-list-table tbody tr:hover { background: #fbfefd; }
.teacher-list-person { display: flex; align-items: center; gap: 9px; min-width: 190px; }
.teacher-list-person > span:last-child { min-width: 0; }
.teacher-list-person__avatar { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 11px; color: #24796e; background: #e5f5f0; font-size: 12px; font-weight: 800; }
.teacher-list-person small { display: block; margin-top: 3px; color: #93a0a5; font-size: 10px; }
.teacher-list-email { display: block; max-width: 210px; overflow: hidden; color: #5e7d82; text-overflow: ellipsis; white-space: nowrap; }
.teacher-list-email:hover, .teacher-list-email:focus-visible, .teacher-list-program:hover, .teacher-list-program:focus-visible { color: #1f7a6d; }
.teacher-list-count { color: #253b42; font-weight: 800; }
.teacher-list-student-count { color: #62777c; white-space: nowrap; }
.teacher-list-student-count strong { color: #253b42; font-weight: 800; }
.teacher-list-program { color: #337e74; font-weight: 700; text-decoration: none; }
.teacher-list-table time { color: #7d8e93; font-size: 11px; white-space: nowrap; }
body[data-theme='dark'] .teacher-list-page { --teacher-border: #2d454b; }
body[data-theme='dark'] .teacher-list-person__avatar { color: #caffef; background: #21483f; }
body[data-theme='dark'] .teacher-list-person small,
body[data-theme='dark'] .teacher-list-email,
body[data-theme='dark'] .teacher-list-table time { color: #a7c4bd; }
body[data-theme='dark'] .teacher-list-table th { background: #16252b; }
body[data-theme='dark'] .teacher-list-table tbody tr:hover { background: #172f2d; }
@media (max-width: 980px) {
  .teacher-list-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teacher-list-filter__actions { grid-column: 1 / -1; justify-content: flex-end; }
}
@media (max-width: 700px) {
  .teacher-list-page .module-header { align-items: stretch; flex-direction: column; }
  .teacher-list-page .module-header .module-button { width: 100%; }
  .teacher-list-filter { grid-template-columns: 1fr; }
  .teacher-list-filter__actions { grid-column: auto; display: grid; grid-template-columns: 1fr 1fr; }
  .teacher-list-filter__actions .module-button { width: 100%; text-align: center; }
  .teacher-list-results-card { overflow: visible; background: transparent; border: 0; box-shadow: none; }
  .teacher-table-wrap { overflow: visible; }
  .teacher-list-table { display: block; min-width: 0; }
  .teacher-list-table thead { display: none; }
  .teacher-list-table tbody, .teacher-list-table tr, .teacher-list-table td { display: block; width: auto; }
  .teacher-list-table tr { margin-bottom: 10px; padding: 12px 14px; border: 1px solid var(--teacher-border); border-radius: 15px; background: #fff; box-shadow: 0 7px 18px rgba(30,47,66,.05); }
  .teacher-list-table td { display: grid; grid-template-columns: 94px minmax(0, 1fr); gap: 9px; align-items: center; min-width: 0; padding: 8px 0; border-bottom: 1px solid #edf2f2; }
  .teacher-list-table td:last-child { min-width: 0; border-bottom: 0; }
  .teacher-list-table td::before { color: #839197; font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
  .teacher-list-table td:nth-child(1)::before { content: 'Öğretmen'; }
  .teacher-list-table td:nth-child(2)::before { content: 'E-posta'; }
  .teacher-list-table td:nth-child(3)::before { content: 'Ders'; }
  .teacher-list-table td:nth-child(4)::before { content: 'Öğrenci'; }
  .teacher-list-table td:nth-child(5)::before { content: 'Program'; }
  .teacher-list-table td:nth-child(6)::before { content: 'Atölye'; }
  .teacher-list-table td:nth-child(7)::before { content: 'Kayıt'; }
  .teacher-list-table td:nth-child(8)::before { content: 'İşlemler'; align-self: start; }
  .teacher-list-person { min-width: 0; }
  .teacher-list-email { max-width: 100%; }
  .teacher-list-table td:last-child { align-items: start; }
  .teacher-list-table td:last-child .module-actions { flex-wrap: wrap; gap: 5px; }
  .teacher-list-table td:last-child .module-button { padding: 7px 8px; font-size: 10px; }
  body[data-theme='dark'] .teacher-list-table tr { background: #16252b; }
}

/* Teacher list cards: remove the wide-table pressure at every viewport. */
.teacher-list-results-card .teacher-table-wrap { overflow: visible; }
.teacher-list-results-card .teacher-list-table { display: block; min-width: 0; }
.teacher-list-results-card .teacher-list-table thead { display: none; }
.teacher-list-results-card .teacher-list-table tbody { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 16px; }
.teacher-list-results-card .teacher-list-table tr { display: flex; min-width: 0; flex-direction: column; padding: 14px; border: 1px solid #e3ecee; border-radius: 15px; background: #fff; box-shadow: 0 7px 18px rgba(30, 47, 66, .05); transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.teacher-list-results-card .teacher-list-table tr:hover { border-color: #b9ddd5; box-shadow: 0 11px 24px rgba(31, 122, 109, .1); transform: translateY(-2px); }
.teacher-list-results-card .teacher-list-table td { display: grid; grid-template-columns: 94px minmax(0, 1fr); gap: 8px; align-items: center; min-width: 0; padding: 9px 0; border-bottom: 1px solid #edf2f2; vertical-align: middle; }
.teacher-list-results-card .teacher-list-table td:first-child { display: block; padding-top: 0; }
.teacher-list-results-card .teacher-list-table td:last-child { display: block; min-width: 0; padding-bottom: 0; border-bottom: 0; }
.teacher-list-results-card .teacher-list-table td::before { color: #8a999e; font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.teacher-list-results-card .teacher-list-table td:nth-child(1)::before { display: none; }
.teacher-list-results-card .teacher-list-table td:nth-child(2)::before { content: 'E-posta'; }
.teacher-list-results-card .teacher-list-table td:nth-child(3)::before { content: 'Ders'; }
.teacher-list-results-card .teacher-list-table td:nth-child(4)::before { content: 'Öğrenci'; }
.teacher-list-results-card .teacher-list-table td:nth-child(5)::before { content: 'Program'; }
.teacher-list-results-card .teacher-list-table td:nth-child(6)::before { content: 'Atölye'; }
.teacher-list-results-card .teacher-list-table td:nth-child(7)::before { content: 'Kayıt'; }
.teacher-list-results-card .teacher-list-table td:nth-child(8)::before { content: 'İşlemler'; display: block; margin-bottom: 7px; }
.teacher-list-results-card .teacher-list-table .teacher-list-person { padding-bottom: 2px; }
.teacher-list-results-card .teacher-list-table .teacher-list-person__avatar { width: 38px; height: 38px; flex-basis: 38px; border-radius: 12px; }
.teacher-list-results-card .teacher-list-table .module-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.teacher-list-results-card .teacher-list-table .module-button { padding: 7px 8px; font-size: 10px; }
body[data-theme='dark'] .teacher-list-results-card .teacher-list-table tr { border-color: #2d454b; background: #16252b; }
body[data-theme='dark'] .teacher-list-results-card .teacher-list-table tr:hover { border-color: #4b9a8a; background: #17322e; }
body[data-theme='dark'] .teacher-list-results-card .teacher-list-table td { border-color: #2c454b; }
@media (max-width: 1100px) {
  .teacher-list-results-card .teacher-list-table tbody { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .teacher-list-results-card .teacher-list-table tbody { grid-template-columns: 1fr; padding: 10px; }
  .teacher-list-results-card .teacher-list-table tr { padding: 13px; }
}

/* Section list: compact Edudash-inspired management table */
.section-list-page > .module-header {
  display: none;
}

.section-create-card {
  margin-top: 18px;
  padding: 0;
}

.section-create-card summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 17px 20px;
  cursor: pointer;
  list-style: none;
}

.section-create-card summary::-webkit-details-marker {
  display: none;
}

.section-create-card summary strong,
.section-create-card summary small {
  display: block;
}

.section-create-card summary strong {
  color: #263442;
  font-size: 15px;
}

.section-create-card summary small {
  margin-top: 4px;
  color: #7b8794;
  font-size: 12px;
}

.section-create-card summary b {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 50%;
  background: #e8f2ef;
  color: var(--panel-primary);
  font-size: 20px;
  line-height: 1;
}

.section-create-card[open] summary {
  border-bottom: 1px solid #e7edf1;
}

.section-create-card[open] summary b {
  transform: rotate(45deg);
}

.section-create-card form {
  padding: 18px 20px 20px;
}

.section-table-card {
  padding: 0;
  margin-top: 18px;
  overflow: hidden;
}

.section-list-page .module-table-tools {
  display: none;
}

.section-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid #e7edf1;
}

.section-table-toolbar__actions,
.section-search-form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.section-search-form input {
  width: min(260px, 34vw);
  min-height: 39px;
  padding: 9px 12px;
  border: 1px solid #dfe7ec;
  border-radius: 9px;
  background: #fbfcfd;
  color: #263442;
}

.section-table-count,
.section-table-footer {
  color: #7b8794;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.section-table {
  min-width: 700px;
  margin: 0;
}

.section-table th {
  padding: 13px 14px;
  background: #f2f6f7;
  color: #657585;
  border-bottom: 1px solid #e2e9ed;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.section-table td {
  padding: 15px 14px;
  height: 67px;
  border-bottom: 1px solid #edf1f4;
  color: #536273;
  font-size: 13px;
  vertical-align: middle;
}

.section-table tbody tr:hover td {
  background: #fbfdfd;
}

.section-table td strong,
.section-table td small {
  display: block;
}

.section-table td strong {
  color: #263442;
  font-size: 14px;
}

.section-table td small {
  margin-top: 3px;
  color: #8a96a4;
  font-size: 11px;
}

.section-table__check {
  width: 58px;
  text-align: center !important;
}

.section-table__check input {
  width: 17px;
  height: 17px;
  accent-color: var(--panel-primary);
}

.section-table .module-badge--active {
  padding: 6px 12px;
  border-radius: 999px;
  background: #e3f3ed;
  color: #27816a;
  font-size: 11px;
}

.section-table .module-button {
  min-width: auto;
  padding: 7px 11px;
  border-radius: 7px;
  font-size: 11px;
}

.section-table-footer {
  padding: 14px 20px;
}

@media (max-width: 760px) {
  .section-table-card {
    overflow-x: auto;
  }

  .section-table-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .section-table-toolbar__actions,
  .section-search-form {
    width: 100%;
  }

  .section-search-form input {
    width: 100%;
    flex: 1;
  }
}

@media (max-width: 760px) {
  .student-list-page .student-table-card {
    overflow-x: auto;
  }

  .student-list-page .module-header {
    padding: 20px;
  }
}

/* Öğrenci listesi dar içerik alanlarında yatay tablo yerine okunabilir kartlara geçer. */
@media (max-width: 1500px) {
  .student-list-page .student-import-card {
    padding: 14px 16px;
  }

  .student-list-page .student-import-card h2 {
    margin-bottom: 3px;
    font-size: 16px;
  }

  .student-list-page .student-import-card p {
    margin-bottom: 8px;
    font-size: 11px;
    line-height: 1.4;
  }

  .student-list-page .student-import-card__heading {
    gap: 12px;
  }

  .student-list-page .student-import-card__heading h2 {
    margin-bottom: 2px;
  }

  .student-list-page .student-import-card__details {
    margin: 9px 0 10px;
  }

  .student-list-page .student-import-card form {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto;
    align-items: end;
    gap: 10px;
  }

  .student-list-page .student-import-card form .module-field,
  .student-list-page .student-import-card form .module-actions {
    margin: 0;
  }

  .student-list-page .student-import-card form .module-actions {
    gap: 7px;
  }

  .student-list-page .student-table-card {
    overflow: hidden;
  }

  .student-list-page .student-table-card > form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 12px;
    padding: 14px 16px 10px;
    background: #fbfcfe;
  }

  .student-list-page .student-table-card > form .module-field {
    min-width: 0;
  }

  .student-list-page .student-table-card > form .module-field label {
    margin-bottom: 5px;
    font-size: 11px;
  }

  .student-list-page .student-table-card > form .module-actions {
    align-self: end;
    gap: 8px;
    margin: 0;
  }

  .student-list-page .student-table-card > form .module-actions .module-button {
    flex: 1 1 0;
    min-width: 0;
    padding-right: 9px;
    padding-left: 9px;
  }

  .student-list-page .student-table {
    width: 100%;
    min-width: 0;
    table-layout: auto;
  }

  .student-list-page .student-table thead {
    display: none;
  }

  .student-list-page .student-table tbody,
  .student-list-page .student-table tbody tr,
  .student-list-page .student-table tbody td {
    display: block;
  }

  .student-list-page .student-table {
    display: block;
  }

  .student-list-page .student-table tbody {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    padding: 14px;
  }

  .student-list-page .student-table tbody tr {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    margin: 0;
    padding: 10px 14px;
    border: 1px solid #e5ebef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(30, 47, 66, .045);
  }

  .student-list-page .student-table tbody td {
    display: grid;
    grid-template-columns: minmax(92px, 30%) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: auto !important;
    min-width: 0 !important;
    height: auto;
    min-height: 42px;
    padding: 9px 0;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  .student-list-page .student-table tbody td::before {
    content: attr(data-label);
    color: #718096;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .student-list-page .student-table tbody td.student-table__check {
    display: flex;
    justify-content: flex-end;
    min-height: 24px;
    padding: 0 0 4px;
    border-bottom: 0;
  }

  .student-list-page .student-table tbody td.student-table__check::before {
    display: none;
  }

  .student-list-page .student-table tbody td:last-child {
    min-width: 0;
    margin-top: auto;
  }

  .student-list-page .student-table tbody td[data-label="Durum"] .module-badge--active {
    width: max-content;
    max-width: 100%;
    justify-self: start;
  }

  .student-list-page .student-table .module-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .student-list-page .student-table__person {
    min-width: 0;
  }

  .student-list-page .student-table__person strong,
  .student-list-page .student-table__person small {
    overflow-wrap: anywhere;
  }
}

@media (max-width: 1100px) {
  .student-list-page .student-table tbody {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .student-list-page .student-table tbody {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px;
  }

  .student-list-page .student-table-card > form {
    grid-template-columns: 1fr;
  }

  .student-list-page .student-table-card > form .module-actions {
    width: 100%;
  }

  .student-list-page .student-import-card form {
    grid-template-columns: 1fr;
  }

  .student-list-page .student-import-card form .module-actions {
    justify-content: flex-start;
  }

  .student-list-page .student-import-card__heading {
    flex-direction: column;
  }

  .student-list-page .student-import-card__identity-link {
    margin-top: 0;
  }
}

/* Global page finish: keep every module dense, readable and visually consistent. */
.app-shell__content,
.module-shell {
  max-width: 1480px;
  margin-right: auto;
  margin-left: auto;
}

.module-shell {
  padding-top: 18px;
}

.module-header {
  margin-bottom: 14px;
  padding: 18px 22px 18px 26px;
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(30, 47, 66, .045);
}

.module-header h1 {
  font-size: clamp(23px, 2.7vw, 31px);
}

.module-header p {
  font-size: 13px;
}

.module-card {
  padding: 18px;
  border-radius: 15px;
  box-shadow: 0 7px 20px rgba(30, 47, 66, .04);
}

.module-card + .module-card {
  margin-top: 14px;
}

.module-button,
.module-button.primary,
.module-button.secondary,
.module-button.danger {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 800;
}

.module-button.primary {
  color: #fff;
  background: linear-gradient(135deg, #6940d6, #8758ef);
}

.module-button.secondary {
  color: #18735e;
  background: #eaf7f3;
  border-color: #d3eee4;
}

.module-button.danger {
  color: #b34450;
  background: #fff0f0;
  border-color: #f5d4d4;
}

/* Ödev oluşturma alanı: daha kısa, odaklı ve mobil uyumlu form düzeni. */
.homework-create-card {
  position: relative;
  overflow: hidden;
  padding: 20px;
  border: 1px solid rgba(105, 64, 214, .12);
  background:
    radial-gradient(circle at 100% 0%, rgba(135, 88, 239, .08), transparent 30%),
    #fff;
}

.homework-create-card::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, #6940d6, #2f9d8c);
}

.homework-create-card > h2 {
  position: relative;
  margin: 0 0 15px;
  font-size: 20px;
}

.homework-edit-context {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px 12px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid #e5e0fb;
  border-radius: 11px;
  background: #faf9ff;
  color: #4e3a9f;
  font-size: 12px;
}

.homework-edit-context__label,
.homework-edit-context small {
  color: #7b6dab;
  font-size: 11px;
}

.homework-edit-context small {
  margin-left: auto;
}

.homework-detail-row > td {
  padding: 0 12px 10px;
  border-top: 0;
  background: #fbfcff;
}

.homework-details {
  overflow: hidden;
  border: 1px solid #e7ecf2;
  border-radius: 11px;
  background: #fff;
}

.homework-details summary {
  padding: 9px 12px;
  color: #52647a;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
  list-style: none;
}

.homework-details summary::-webkit-details-marker {
  display: none;
}

.homework-details summary::before {
  content: '＋';
  margin-right: 5px;
  color: #6940d6;
}

.homework-details[open] summary::before {
  content: '−';
}

.homework-details__grid {
  display: grid;
  grid-template-columns: 1.6fr repeat(3, 1fr);
  gap: 10px;
  padding: 11px 12px 13px;
  border-top: 1px solid #edf0f5;
}

.homework-details__grid div {
  min-width: 0;
  padding: 9px 10px;
  border-radius: 9px;
  background: #f8fafc;
}

.homework-details__grid span,
.homework-details__grid strong {
  display: block;
}

.homework-details__grid span {
  margin-bottom: 4px;
  color: #8793a1;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.homework-details__grid strong {
  color: #283548;
  font-size: 11px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.module-table td .module-button.secondary {
  display: inline-flex;
  margin-top: 5px;
  text-decoration: none;
}

.homework-create-form--admin {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0 14px;
}

.homework-create-form--admin > .module-grid {
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 2px;
}

.homework-create-form--admin > .homework-field--title,
.homework-create-form--admin > .homework-field--description {
  grid-column: 1 / -1;
}

.homework-create-form--admin > .homework-field--due-date,
.homework-create-form--admin > .homework-field--file {
  grid-column: span 6;
}

.homework-create-form .module-field {
  gap: 6px;
  margin-bottom: 11px;
}

.homework-create-form .module-field label {
  font-size: 12px;
  letter-spacing: .01em;
}

.homework-create-form .module-field input,
.homework-create-form .module-field textarea,
.homework-create-form .module-field select {
  padding: 11px 13px;
  border-radius: 13px;
  font-size: 13px;
}

.homework-create-form .homework-field--description textarea {
  min-height: 96px;
  resize: vertical;
}

.homework-create-form .homework-field--file input[type='file'] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.file-dropzone {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 10px;
  min-height: 78px;
  padding: 13px 15px;
  border: 1px dashed rgba(105, 64, 214, .35);
  border-radius: 14px;
  background: linear-gradient(135deg, #fbfaff, #f5fbfa);
  color: #283548;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.file-dropzone:hover,
.file-dropzone:focus-visible,
.file-dropzone.is-dragover {
  border-color: #6940d6;
  background: linear-gradient(135deg, #f4efff, #edf9f6);
  outline: none;
}

.file-dropzone.is-dragover {
  transform: translateY(-1px);
}

.file-dropzone__icon {
  grid-row: span 3;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  color: #6940d6;
  background: #ece5ff;
  font-size: 20px;
  font-weight: 800;
}

.file-dropzone strong,
.file-dropzone__action,
.file-dropzone__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-dropzone strong {
  font-size: 12px;
}

.file-dropzone__action,
.file-dropzone__name,
.file-upload-hint {
  color: #718096;
  font-size: 11px;
}

.file-dropzone__action {
  color: #6940d6;
  font-weight: 700;
}

.file-dropzone__name {
  color: #18735e;
}

.file-upload-hint {
  display: block;
  margin-top: 6px;
  line-height: 1.5;
}

.file-upload-error {
  min-height: 0;
  margin-top: 5px;
  color: #b34450;
  font-size: 11px;
  font-weight: 700;
}

.homework-create-form .module-actions {
  grid-column: 1 / -1;
  justify-content: flex-start;
  margin-top: 1px;
}

.homework-create-form .module-actions .module-button.primary {
  margin-left: 0;
  min-width: 150px;
}

.homework-target-meta {
  display: block;
  margin-top: 4px;
  color: #718096;
  font-size: 11px;
}

.homework-results-row > td {
  padding: 0 12px 12px;
  background: #fbfcff;
  border-top: 0;
}

.homework-results {
  overflow: hidden;
  border: 1px solid #e7e4f8;
  border-radius: 12px;
  background: #fff;
}

.homework-results summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 13px;
  color: #5940b8;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  list-style: none;
}

.homework-results summary::-webkit-details-marker {
  display: none;
}

.homework-results summary::after {
  content: '+';
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 7px;
  background: #f0ebff;
  color: #6940d6;
  font-size: 16px;
}

.homework-results[open] summary::after {
  content: '−';
}

.homework-results summary strong {
  margin-left: auto;
  color: #718096;
  font-size: 11px;
  font-weight: 700;
}

.homework-results-table-wrap {
  overflow-x: auto;
  border-top: 1px solid #edf0f5;
}

.homework-results-table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-size: 12px;
}

.homework-results-table th,
.homework-results-table td {
  padding: 9px 11px;
  border-bottom: 1px solid #edf0f5;
  text-align: left;
  vertical-align: middle;
}

.homework-results-table th {
  color: #718096;
  background: #f8fafc;
  font-size: 10px;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.homework-results-table tr:last-child td {
  border-bottom: 0;
}

.homework-results-table td:first-child {
  min-width: 170px;
}

.homework-results-table td:first-child small {
  display: block;
  margin-top: 3px;
  color: #8793a1;
  overflow-wrap: anywhere;
}

.homework-result-form {
  display: grid;
  grid-template-columns: 150px minmax(160px, 1fr) auto;
  gap: 7px;
  align-items: center;
}

.homework-result-form select,
.homework-result-form input {
  width: 100%;
  min-height: 32px;
  padding: 6px 9px;
  border: 1px solid #e0e6ee;
  border-radius: 8px;
  background: #fff;
  color: #283548;
  font-size: 11px;
}

.homework-result-form .module-button {
  min-width: 70px;
}

.homework-status-tabs {
  display: flex;
  align-items: stretch;
  gap: 6px;
  margin: 18px 0 14px;
  padding: 5px;
  border: 1px solid #e2e9ed;
  border-radius: 14px;
  background: #f7fafb;
  overflow-x: auto;
}

.homework-status-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 150px;
  padding: 11px 14px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #718096;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.homework-status-tabs a:hover,
.homework-status-tabs a.is-active {
  border-color: rgba(31, 122, 109, .18);
  background: #fff;
  color: var(--panel-primary-deep);
  box-shadow: 0 4px 12px rgba(37, 72, 77, .08);
}

.homework-status-tabs strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  background: #e8f2ef;
  color: var(--panel-primary-deep);
  font-size: 11px;
}

.homework-display-tabs {
  display: inline-flex;
  gap: 4px;
  margin: 0 0 14px;
  padding: 4px;
  border: 1px solid #e2e9ed;
  border-radius: 10px;
  background: #f7fafb;
}

.homework-display-tabs a {
  padding: 7px 12px;
  border-radius: 7px;
  color: #718096;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
}

.homework-display-tabs a:hover,
.homework-display-tabs a.is-active {
  background: #fff;
  color: var(--panel-primary-deep);
  box-shadow: 0 2px 8px rgba(37, 72, 77, .08);
}

.homework-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.homework-card-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 16px;
  border: 1px solid #e5ebee;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(37, 72, 77, .05);
}

.homework-card-item.is-overdue { border-color: #f3c4c8; }
.homework-card-item__top,
.homework-card-item__actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.homework-card-item h3 { margin: 14px 0 7px; color: #263442; font-size: 16px; }
.homework-card-item p { min-height: 42px; margin: 0; color: #718096; font-size: 12px; line-height: 1.55; }
.homework-card-item dl { display: grid; gap: 7px; margin: 14px 0; }
.homework-card-item dl div { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid #f0f3f5; padding-top: 7px; }
.homework-card-item dt { color: #8a98a5; font-size: 10px; font-weight: 800; }
.homework-card-item dd { margin: 0; color: #465565; font-size: 11px; text-align: right; }
.homework-card-item__actions { margin-top: auto; justify-content: flex-start; }
.homework-card-item__actions .module-button { padding: 8px 10px; font-size: 11px; }

.homework-progress-list { display: grid; gap: 14px; }
.homework-progress-item { display: grid; grid-template-columns: minmax(160px, .7fr) minmax(160px, 2fr) 55px; align-items: center; gap: 14px; padding: 14px; border: 1px solid #e5ebee; border-radius: 12px; }
.homework-progress-item div:first-child { display: grid; gap: 3px; }
.homework-progress-item span { color: #8a98a5; font-size: 11px; }
.homework-progress-item > strong { color: var(--panel-primary-deep); text-align: right; }
.homework-progress-track { height: 10px; overflow: hidden; border-radius: 999px; background: #edf2f3; }
.homework-progress-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--panel-primary), #55b89b); }
.homework-student-history { margin-top: 6px; font-size: 11px; }
.homework-student-history summary { cursor: pointer; color: var(--panel-primary-deep); font-weight: 700; }
.homework-student-history ul { margin: 6px 0 0; padding-left: 16px; color: var(--panel-muted); }
.homework-student-history li { margin-bottom: 3px; }

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

@media (max-width: 600px) {
  .homework-card-grid { grid-template-columns: 1fr; }
  .homework-display-tabs { width: 100%; }
  .homework-display-tabs a { flex: 1; text-align: center; }
  .homework-progress-item { grid-template-columns: 1fr 45px; }
  .homework-progress-track { grid-column: 1 / -1; grid-row: 2; }
}

.homework-result-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.homework-result-badge--pending {
  color: #856b1c;
  background: #fff7d8;
}

.homework-result-badge--done {
  color: #18735e;
  background: #e8f7f1;
}

.homework-result-badge--not_done {
  color: #b34450;
  background: #fff0f0;
}

.homework-result-badge--incomplete {
  color: #9a5a1a;
  background: #fff1df;
}

.student-homework-cell {
  min-width: 220px;
}

.student-homework-list {
  display: grid;
  gap: 5px;
  max-width: 270px;
}

.student-homework-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 7px;
  padding: 7px 8px;
  border: 1px solid #e6e1fb;
  border-radius: 9px;
  background: #fbfaff;
  color: #283548;
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.student-homework-link:hover {
  border-color: #6940d6;
  background: #f4efff;
  transform: translateY(-1px);
}

.student-homework-link strong,
.student-homework-link small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.student-homework-link strong {
  font-size: 11px;
}

.student-homework-link small {
  grid-column: 1 / 2;
  color: #718096;
  font-size: 10px;
}

.student-homework-status {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  padding: 3px 6px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}

.student-homework-status--pending {
  color: #856b1c;
  background: #fff7d8;
}

.student-homework-status--done {
  color: #18735e;
  background: #e8f7f1;
}

.student-homework-status--not_done {
  color: #b34450;
  background: #fff0f0;
}

.student-homework-status--incomplete {
  color: #9a5a1a;
  background: #fff1df;
}

.student-homework-empty {
  color: #9aa5b1;
  font-size: 11px;
}

.homework-teacher-note {
  display: block;
  margin-top: 6px;
  color: #6f5aa8;
  font-size: 11px;
}

@media (max-width: 720px) {
  .homework-status-tabs {
    margin-top: 14px;
  }

  .homework-status-tabs a {
    min-width: 132px;
    padding: 10px 11px;
  }

  .homework-create-card {
    padding: 16px;
  }

  .homework-create-form--admin {
    display: block;
  }

  .homework-create-form--admin > .module-grid {
    display: block;
    margin-bottom: 0;
  }

  .homework-create-form .module-field {
    margin-bottom: 10px;
  }

  .homework-create-form .module-actions .module-button.primary {
    width: 100%;
  }

  .homework-results summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .homework-edit-context {
    align-items: flex-start;
    flex-direction: column;
  }

  .homework-edit-context small {
    margin-left: 0;
  }

  .homework-details__grid {
    grid-template-columns: 1fr;
  }

  .homework-results summary strong {
    width: 100%;
    margin-left: 0;
  }
}

.module-toolbar,
.module-actions,
.module-table-tools {
  gap: 8px;
}

.module-toolbar h2,
.module-card h2 {
  font-size: 18px;
  letter-spacing: -.02em;
}

.profile-stat-grid {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.module-table-wrap {
  overflow-x: auto;
  border: 1px solid #e7ecf2;
  border-radius: 13px;
  background: #fff;
}

.module-table {
  margin: 0;
  font-size: 12px;
}

.module-table th,
.module-table td {
  padding: 11px 13px;
}

.module-table th {
  background: #f4f7f9;
  color: #627284;
  font-size: 10px;
  letter-spacing: .08em;
}

.module-table tbody tr:hover td {
  background: #fbfcfe;
}

.library-books-page {
  max-width: 1280px;
}

.library-books-page .module-card {
  padding: 20px;
}

.library-books-page .module-grid {
  gap: 12px;
}

.library-catalog-toolbar {
  align-items: flex-end;
}

.library-catalog-search {
  flex: 0 1 280px;
  margin: 0;
}

.library-catalog-search label {
  margin-bottom: 5px;
  color: var(--panel-muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.library-catalog-search input {
  width: 100%;
}

.library-books-page .module-table {
  min-width: 940px;
}

.library-books-page .module-help-text {
  margin: 12px 0 0;
  color: var(--panel-muted);
  font-size: 12px;
}

.library-books-page .module-help-text code {
  color: var(--panel-primary-deep);
  font-size: 11px;
}

.library-book-link {
  color: var(--panel-primary-deep);
  text-decoration: none;
}

.library-book-link:hover,
.library-book-link:focus-visible {
  text-decoration: underline;
}

.library-book-detail {
  max-width: 1180px;
}

.library-book-detail .module-card {
  padding: 20px;
}

.library-book-detail .module-table {
  min-width: 680px;
}

.library-book-cover {
  display: block;
  width: 132px;
  height: 176px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(31, 122, 109, .16);
  background: #f1f5f8;
  box-shadow: 0 8px 20px rgba(20, 42, 56, .1);
}

.library-book-cover--small {
  width: 56px;
  height: 74px;
  margin-left: auto;
}

.library-loan-filters {
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid rgba(31, 122, 109, .12);
  border-radius: 12px;
  background: rgba(31, 122, 109, .035);
}

@media (max-width: 700px) {
  .library-books-page .module-card {
    padding: 16px;
  }

  .library-book-detail .module-card {
    padding: 16px;
  }

  .library-book-detail .module-header {
    align-items: flex-start;
  }

  .library-book-cover--small {
    margin-left: 0;
  }

  .library-catalog-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .library-catalog-search {
    flex-basis: auto;
    width: 100%;
  }

  .library-books-page .module-table-wrap {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .library-books-page .module-table,
  .library-books-page .module-table tbody,
  .library-books-page .module-table tr,
  .library-books-page .module-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .library-books-page .module-table thead {
    display: none;
  }

  .library-books-page .module-table tr {
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(42, 72, 82, 0.1);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.72);
  }

  .library-books-page .module-table td {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(42, 72, 82, 0.08);
    text-align: right;
  }

  .library-books-page .module-table td::before {
    content: attr(data-label);
    flex: 0 0 34%;
    color: var(--panel-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
    text-align: left;
    text-transform: uppercase;
  }

  .library-books-page .module-table td:last-child {
    border-bottom: 0;
  }
}

.module-table-search,
.module-table-filter,
.module-actions select,
.module-actions input,
.module-toolbar input,
.module-toolbar select {
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid #dfe6ed;
  border-radius: 9px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
}

.module-alert,
.module-empty {
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 12px;
}

.module-empty {
  background: #f7f9fb;
  color: #778597;
}

.module-badge,
.status-pill {
  min-width: auto;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
}

.status-pill--paid {
  background: #e5f7ee;
  color: #18735e;
}

.status-pill--partial {
  background: #fff4df;
  color: #b26b14;
}

.status-pill--unpaid {
  background: #fff0f0;
  color: #b34450;
}

.form-control,
.form-select,
input.form-control,
select.form-select,
textarea.form-control {
  min-height: 38px;
  border-color: #dfe6ed;
  border-radius: 9px;
  font-size: 12px;
  box-shadow: none;
}

textarea.form-control {
  min-height: 92px;
}

@media (max-width: 768px) {
  .dashboard-main {
    padding: 16px 14px 28px;
  }

  .module-header,
  .module-card,
  .dashboard-panel {
    padding: 16px;
    border-radius: 14px;
  }

  .module-header {
    padding-left: 20px;
  }
}

/* Dashboard refresh: compact Edudash-inspired controls, denser cards and clearer color hierarchy. */
.dashboard-main-body {
  max-width: 1480px;
  margin: 0 auto;
}

.dashboard-header {
  border-color: rgba(91, 43, 214, .10);
  box-shadow: 0 12px 32px rgba(48, 39, 84, .06);
}

.dashboard-kicker,
.dashboard-panel__eyebrow {
  color: #6c43d9;
}

.dashboard-title {
  max-width: 620px;
  font-size: clamp(24px, 3vw, 34px);
}

.dashboard-subtitle {
  max-width: 620px;
  font-size: 13px;
}

.dashboard-header__actions {
  gap: 7px;
}

.navbar-search {
  min-width: 190px;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 12px;
}

.top-action-link,
.module-button,
.module-directory__link {
  min-height: 36px;
  padding: 0 11px;
  border-radius: 10px;
  font-size: 11px;
  letter-spacing: .01em;
}

/* Colored application header */
.navbar-header.dashboard-header {
  position: relative;
  isolation: isolate;
  min-height: 142px;
  overflow: hidden;
  border-color: transparent;
  background: linear-gradient(118deg, #34486d 0%, #263b64 50%, #182c53 100%);
  box-shadow: 0 16px 34px rgba(23, 43, 78, .2);
}

.navbar-header.dashboard-header::before,
.navbar-header.dashboard-header::after {
  position: absolute;
  z-index: -1;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 50%;
  content: '';
  pointer-events: none;
}

.navbar-header.dashboard-header::before {
  top: -86px;
  right: 14%;
  width: 220px;
  height: 220px;
  background: rgba(111, 151, 221, .12);
  box-shadow: 0 0 0 34px rgba(111, 151, 221, .04), 0 0 0 68px rgba(111, 151, 221, .025);
}

.navbar-header.dashboard-header::after {
  right: -36px;
  bottom: -124px;
  width: 270px;
  height: 270px;
  background: rgba(107, 129, 187, .1);
}

.navbar-header.dashboard-header .dashboard-kicker,
.navbar-header.dashboard-header .dashboard-title,
.navbar-header.dashboard-header .dashboard-subtitle {
  color: #fff;
}

.navbar-header.dashboard-header .dashboard-kicker {
  color: #b9c8e5;
  letter-spacing: .12em;
}

.navbar-header.dashboard-header .dashboard-subtitle {
  color: rgba(238, 244, 255, .78);
}

.navbar-header.dashboard-header .navbar-search {
  background: rgba(255, 255, 255, .95);
  border-color: rgba(255, 255, 255, .55);
}

.navbar-header.dashboard-header .top-action-link {
  color: #fff;
  border-color: rgba(255, 255, 255, .55);
  background: rgba(8, 47, 73, .28);
}

.navbar-header.dashboard-header .top-action-link:hover {
  background: rgba(8, 47, 73, .48);
}

.navbar-header.dashboard-header .top-action-link--danger {
  background: #8f2635;
  border-color: #ffb6c0;
}

/* The shared colored header is the single page heading on these directories. */
.members-list-page > .module-header,
.student-details-page > .module-header {
  display: none;
}

.navbar-header.dashboard-header .top-action-link:focus-visible,
.navbar-header.dashboard-header .navbar-search input:focus-visible,
.student-detail-tabs a:focus-visible {
  outline: 3px solid #fef08a;
  outline-offset: 2px;
}

.top-action-link--neutral {
  background: #f5f3fb;
  border-color: #e9e4f8;
  color: #55477c;
}

.top-action-link--soft {
  background: #e9f8f2;
  border-color: #d3eee3;
  color: #18735e;
}

.top-action-link--theme {
  background: #fff4ec;
  border-color: #f7dfcf;
  color: #b35e2d;
}

.top-action-link--danger {
  background: #fff0f0;
  border-color: #f5d4d4;
  color: #b34450;
}

.dashboard-overview {
  gap: 16px;
  margin-bottom: 16px;
}

.hero-card {
  min-height: 300px;
  padding: 28px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 90% 12%, rgba(255,255,255,.22), transparent 28%),
    linear-gradient(135deg, #5b2bd6 0%, #754be5 52%, #376ed8 100%);
  box-shadow: 0 20px 48px rgba(91, 43, 214, .20);
}

.hero-card__content h2 {
  font-size: clamp(25px, 3vw, 36px);
}

.hero-card__highlights {
  gap: 8px;
  margin-top: 18px;
}

.hero-highlight {
  min-width: 128px;
  padding: 11px 13px;
  border-radius: 14px;
}

.hero-card__metrics {
  min-width: 180px;
  gap: 10px;
}

.hero-card__metrics div {
  padding: 14px 16px;
  border-radius: 15px;
}

.hero-card__metrics strong {
  font-size: 24px;
}

.stats-grid {
  gap: 12px;
}

.stat-card {
  min-height: 138px;
  padding: 18px;
  border-radius: 18px;
  box-shadow: 0 10px 26px rgba(31, 48, 56, .06);
}

.stat-card:nth-child(1) { border-top: 3px solid #8b5cf6; }
.stat-card:nth-child(2) { border-top: 3px solid #36b37e; }
.stat-card:nth-child(3) { border-top: 3px solid #4f8ee8; }
.stat-card:nth-child(4) { border-top: 3px solid #f09a5b; }

.stat-card__label {
  margin-bottom: 9px;
  font-size: 11px;
}

.stat-card strong {
  font-size: 30px;
}

.stat-card p {
  margin-top: 7px;
  font-size: 12px;
}

.dashboard-grid {
  gap: 16px;
}

.dashboard-panel {
  padding: 20px;
  border-radius: 20px;
  box-shadow: 0 10px 28px rgba(31, 48, 56, .065);
}

.dashboard-panel__header {
  margin-bottom: 14px;
}

.dashboard-panel__header h2 {
  font-size: 19px;
}

.quick-links-grid,
.module-directory {
  gap: 10px;
}

.quick-link-card {
  position: relative;
  min-height: 108px;
  padding: 15px;
  border-radius: 14px;
  background: #fbfaff;
  border-color: #ece8f7;
}

.quick-link-card:nth-child(4n + 1) { border-top: 3px solid #8b5cf6; }
.quick-link-card:nth-child(4n + 2) { border-top: 3px solid #36b37e; }
.quick-link-card:nth-child(4n + 3) { border-top: 3px solid #4f8ee8; }
.quick-link-card:nth-child(4n + 4) { border-top: 3px solid #f09a5b; }

.quick-link-card strong {
  margin-bottom: 6px;
  font-size: 14px;
}

.quick-link-card span {
  font-size: 12px;
  line-height: 1.55;
}

.module-directory__group {
  padding: 15px;
  border-radius: 15px;
  background: #fbfcfe;
}

.module-directory__group h3 {
  margin-bottom: 10px;
  font-size: 15px;
}

.module-directory__links {
  gap: 6px;
}

.module-directory__link {
  min-height: 31px;
  padding: 0 9px;
  border-radius: 8px;
  background: #f1edff;
  border-color: #e5dcff;
  color: #6241bb;
}

.module-button.primary {
  background: linear-gradient(135deg, #6c43d9, #8b5cf6);
  border-color: transparent;
  box-shadow: 0 7px 16px rgba(108, 67, 217, .18);
}

.module-button.secondary {
  background: #eef8f5;
  border-color: #d6eee6;
  color: #18735e;
}

.module-button.danger {
  background: #fff0f0;
  border-color: #f5d4d4;
  color: #b34450;
}

.finance-stack,
.attendance-stack,
.notice-stack,
.fee-table {
  gap: 9px;
}

.finance-item,
.attendance-item,
.notice-card,
.fee-table__row,
.dashboard-list__item {
  padding: 13px 15px;
  border-radius: 13px;
}

.finance-item strong,
.attendance-item strong {
  font-size: 21px;
}

.attendance-item--link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.attendance-item--link::after {
  content: '→';
  margin-left: auto;
  color: #167e73;
  font-weight: 800;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.attendance-item--link:hover,
.attendance-item--link:focus-visible {
  border-color: #8bcfc3;
  box-shadow: 0 8px 18px rgba(22, 126, 115, 0.12);
  transform: translateY(-1px);
  outline: none;
}

.attendance-item--link:hover::after,
.attendance-item--link:focus-visible::after {
  opacity: 1;
  transform: translateX(0);
}

.dashboard-list__avatar {
  width: 40px;
  height: 40px;
  border-radius: 12px;
}

.dashboard-list__item {
  gap: 11px;
}

.dashboard-list__content strong {
  font-size: 14px;
}

.dashboard-list__content span,
.dashboard-list__item time,
.notice-card p,
.notice-card span,
.finance-item span,
.attendance-item span {
  font-size: 12px;
}

@media (max-width: 900px) {
  .dashboard-header__actions {
    justify-content: flex-start;
  }

  .navbar-search {
    flex: 1 1 100%;
  }
}

@media (max-width: 700px) {
  .hero-card {
    min-height: 0;
    padding: 22px;
  }

  .hero-card__metrics {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hero-card__metrics div {
    padding: 12px;
  }

  .hero-card__metrics span {
    font-size: 11px;
  }
}

/* Dashboard layout polish: tighter hierarchy for the admin home screen. */
.dashboard-overview {
  grid-template-columns: 1fr;
  gap: 14px;
  margin-bottom: 16px;
}

.dashboard-overview .hero-card {
  min-height: 0;
  align-items: stretch;
  padding: 24px 26px;
}

.dashboard-overview .hero-card__metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-content: center;
  min-width: min(52%, 560px);
}

.dashboard-overview .hero-card__metrics div {
  display: flex;
  min-height: 84px;
  flex-direction: column;
  justify-content: center;
  padding: 14px 16px;
}

.dashboard-overview .stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-overview .stat-card {
  min-height: 112px;
  padding: 15px 16px;
}

.dashboard-grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .9fr);
  gap: 14px;
  align-items: start;
}

.dashboard-grid > .dashboard-panel--wide,
.dashboard-grid > .dashboard-panel--finance,
.dashboard-grid > .dashboard-panel--attendance {
  grid-column: auto;
}

.dashboard-grid > .dashboard-panel--finance,
.dashboard-grid > .dashboard-panel--attendance {
  grid-column: 1 / -1;
}

.dashboard-grid > .dashboard-panel:nth-child(1),
.dashboard-grid > .dashboard-panel:nth-child(2) {
  min-height: 0;
}

.dashboard-panel {
  padding: 18px;
  border-radius: 17px;
}

.dashboard-panel__header {
  margin-bottom: 12px;
}

.dashboard-panel__header h2 {
  font-size: 18px;
}

.quick-links-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.quick-link-card {
  min-height: 92px;
  padding: 13px 14px;
}

.module-directory {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.module-directory__group {
  padding: 12px;
  border-radius: 12px;
}

.module-directory__group h3 {
  margin-bottom: 8px;
  font-size: 13px;
}

.module-directory__links {
  gap: 5px;
}

.module-directory__link {
  min-height: 29px;
  padding: 0 8px;
  font-size: 10px;
}

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

  .dashboard-overview .hero-card__metrics {
    min-width: 0;
  }
}

@media (max-width: 700px) {
  .dashboard-overview .hero-card {
    flex-direction: column;
    padding: 20px;
  }

  .dashboard-overview .hero-card__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }

  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-grid > .dashboard-panel--finance,
  .dashboard-grid > .dashboard-panel--attendance {
    grid-column: auto;
  }
}

@media (max-width: 460px) {
  .dashboard-overview .stats-grid,
  .dashboard-overview .hero-card__metrics,
  .quick-links-grid,
  .module-directory {
    grid-template-columns: 1fr;
  }
}

.dashboard-grid .module-empty {
  min-height: 0;
  padding: 14px 12px;
  border-radius: 11px;
  background: #f8fafc;
  font-size: 12px;
}

/* Final dark-mode contrast pass: these rules intentionally come last so
   legacy light-theme component rules cannot wash out dark-mode content. */
body[data-theme='dark'] .module-header h1,
body[data-theme='dark'] .module-header p,
body[data-theme='dark'] .module-card h2,
body[data-theme='dark'] .module-toolbar__hint,
body[data-theme='dark'] .profile-stat-grid .edudash-stat-card span,
body[data-theme='dark'] .profile-stat-grid .edudash-stat-card strong,
body[data-theme='dark'] .profile-stat-grid .edudash-stat-card small {
  color: var(--panel-text);
}

/* The page intro card remains light in dark mode, so its text must stay dark. */
body[data-theme='dark'] .module-header h1 {
  color: #17212b !important;
}

body[data-theme='dark'] .module-header p {
  color: #637386 !important;
}

body[data-theme='dark'] .module-grid .placeholder-panel h3,
body[data-theme='dark'] .module-toolbar h2,
body[data-theme='dark'] .module-card h2 {
  color: #f4fffb !important;
}

body[data-theme='dark'] .module-grid .placeholder-panel p,
body[data-theme='dark'] .module-toolbar p,
body[data-theme='dark'] .module-toolbar > div > span,
body[data-theme='dark'] .module-toolbar > span {
  color: #b8cbc6 !important;
}

body[data-theme='dark'] .profile-stat-grid .edudash-stat-card {
  background: #16252b;
  border-color: #2c454b;
}

body[data-theme='dark'] .module-table-wrap {
  background: #101a1f;
  border-color: #2c454b;
}

body[data-theme='dark'] .module-table th {
  background: #20343a;
  color: #d8fff3;
  border-bottom-color: #3d5d62;
}

body[data-theme='dark'] .module-table td {
  color: #e8f1ed;
  border-bottom-color: #2c454b;
}

body[data-theme='dark'] .module-table tbody tr:hover td {
  background: #1d3439;
}

body[data-theme='dark'] .module-table .module-button.secondary,
body[data-theme='dark'] .module-table .module-badge {
  background: #21483f;
  color: #caffef;
  border-color: #3c7567;
}

body[data-theme='dark'] .module-table-search,
body[data-theme='dark'] .module-table-filter,
body[data-theme='dark'] .module-toolbar input,
body[data-theme='dark'] .module-toolbar select {
  background: #101a1f;
  color: #e8f1ed;
  border-color: #3b5960;
}

body[data-theme='dark'] .account-panel {
  background: #16252b;
  color: #e8f1ed;
  border-color: #2c454b;
}

body[data-theme='dark'] .account-panel__meta strong {
  color: #f4fffb;
}

body[data-theme='dark'] .account-panel__meta span {
  color: #b8cbc6;
}

body[data-theme='dark'] .account-link--ghost {
  background: #21483f;
  color: #caffef;
  border: 1px solid #3c7567;
}

body[data-theme='dark'] .account-link--danger {
  background: #3a2525;
  color: #ffd1c7;
  border-color: #76504a;
}

/* Öğrenci detayındaki ödev merkezi */
.student-homework-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0;
  color: #718096;
  font-size: 11px;
}

.student-homework-summary > span {
  padding: 5px 8px;
  border-radius: 999px;
  background: #f4f6f9;
  font-weight: 700;
}

.student-homework-filter {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
}

.student-homework-filter select {
  min-height: 32px;
  padding: 6px 9px;
  border: 1px solid #e0e6ee;
  border-radius: 8px;
  background: #fff;
  color: #283548;
  font-size: 11px;
}

.student-homework-filter .module-button {
  min-width: auto;
}

.student-homework-detail {
  overflow: hidden;
  margin-bottom: 8px;
  border: 1px solid #e7ecf2;
  border-radius: 12px;
  background: #fff;
}

.student-homework-detail.is-unread {
  border-color: #cfc2fb;
  box-shadow: 0 6px 16px rgba(105, 64, 214, .07);
}

.student-homework-detail summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 13px;
  cursor: pointer;
  list-style: none;
}

.student-homework-detail summary::-webkit-details-marker {
  display: none;
}

.student-homework-detail summary::before {
  content: '＋';
  flex: 0 0 auto;
  color: #6940d6;
  font-weight: 800;
}

.student-homework-detail[open] summary::before {
  content: '−';
}

.student-homework-detail__title {
  display: grid;
  min-width: 0;
  flex: 1;
  gap: 3px;
}

.student-homework-detail__title strong,
.student-homework-detail__title small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.student-homework-detail__title strong {
  color: #283548;
  font-size: 13px;
}

.student-homework-detail__title small {
  color: #718096;
  font-size: 11px;
}

.student-homework-detail__meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #718096;
  font-size: 11px;
  white-space: nowrap;
}

.student-homework-read-badge {
  padding: 4px 7px;
  border-radius: 999px;
  color: #856b1c;
  background: #fff7d8;
  font-size: 10px;
  font-weight: 800;
}

.is-read .student-homework-read-badge {
  color: #18735e;
  background: #e8f7f1;
}

.student-homework-detail__body {
  padding: 0 13px 13px;
  border-top: 1px solid #edf0f5;
}

.student-homework-detail__facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 12px 0;
}

.student-homework-detail__facts div {
  padding: 8px 9px;
  border-radius: 9px;
  background: #f8fafc;
}

.student-homework-detail__facts span,
.student-homework-detail__facts strong,
.student-homework-detail__description span {
  display: block;
}

.student-homework-detail__facts span,
.student-homework-detail__description span {
  margin-bottom: 4px;
  color: #8793a1;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.student-homework-detail__facts strong {
  color: #283548;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.student-homework-detail__description {
  padding: 10px 0;
}

.student-homework-detail__description p {
  margin: 0;
  color: #52647a;
  font-size: 12px;
  line-height: 1.55;
}

.student-homework-detail__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 5px;
}

.student-homework-no-file,
.student-homework-note {
  color: #718096;
  font-size: 11px;
}

.student-homework-note {
  padding: 7px 9px;
  border-radius: 8px;
  background: #faf9ff;
  color: #6f5aa8;
}

@media (max-width: 700px) {
  .student-homework-summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .student-homework-filter {
    width: 100%;
    margin-left: 0;
  }

  .student-homework-filter select,
  .student-homework-filter .module-button {
    flex: 1;
  }

  .student-homework-detail summary {
    align-items: flex-start;
  }

  .student-homework-detail__meta {
    align-items: flex-end;
    flex-direction: column;
  }

  .student-homework-detail__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.attendance-lesson-details {
  min-width: 190px;
}

.attendance-lesson-details summary {
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 8px;
  background: #f4efff;
  color: #6940d6;
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
  list-style: none;
}

.attendance-lesson-details summary::-webkit-details-marker {
  display: none;
}

.attendance-lesson-details summary::before {
  content: '＋';
  margin-right: 4px;
}

.attendance-lesson-details[open] summary::before {
  content: '−';
}

.attendance-lesson-list {
  display: grid;
  gap: 5px;
  margin-top: 6px;
}

.attendance-lesson-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 7px;
  padding: 6px 8px;
  border: 1px solid #e7ecf2;
  border-radius: 8px;
  background: #fbfcff;
}

.attendance-lesson-item strong,
.attendance-lesson-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.attendance-lesson-item strong {
  color: #283548;
  font-size: 11px;
}

.attendance-lesson-item span,
.attendance-lesson-item small {
  color: #718096;
  font-size: 10px;
}

.attendance-lesson-item small {
  grid-column: 1 / -1;
}

.attendance-lesson-empty {
  color: #9aa5b1;
  font-size: 11px;
}

/* Corporate navigation layer */
.sidebar-brand__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.sidebar-brand__copy small {
  color: #8a98a6;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.account-panel__status {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  margin-top: 7px !important;
  color: var(--panel-muted) !important;
  font-size: 10px !important;
  font-weight: 700;
  letter-spacing: .02em;
}

.account-panel__status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #baf4bf;
  box-shadow: 0 0 0 3px rgba(186, 244, 191, .14);
}

.sidebar-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 16px 14px;
  padding: 9px 10px;
  border: 1px solid #e5ebef;
  border-radius: 11px;
  background: #f8fafb;
  color: #93a0aa;
}

.sidebar-search > span {
  font-size: 18px;
  line-height: 1;
}

.sidebar-search input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--panel-text);
  font: inherit;
  font-size: 11px;
}

.sidebar-search input::placeholder {
  color: #9aa7b0;
}

.sidebar-search kbd {
  padding: 2px 5px;
  border: 1px solid #e0e6ea;
  border-radius: 5px;
  background: #fff;
  color: #9aa7b0;
  font-size: 9px;
}

.sidebar-section-title {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 30px;
  color: #788796;
  font-weight: 800;
}

.sidebar-section-title::before {
  content: attr(data-section-code);
  display: inline-grid;
  flex: 0 0 27px;
  width: 27px;
  height: 22px;
  place-items: center;
  border: 1px solid #dce9e6;
  border-radius: 7px;
  background: linear-gradient(145deg, #f4fbf9, #eef4ff);
  color: var(--panel-primary-deep);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .03em;
}

.sidebar-section-title > span:first-child {
  flex: 1;
}

.sidebar-section-toggle.is-open::before,
.sidebar-section-toggle:hover::before {
  border-color: rgba(31, 122, 109, .28);
  background: linear-gradient(145deg, #e1f5ef, #e8efff);
}

.sidebar-section-toggle.is-open {
  color: var(--panel-primary-deep);
}

.sidebar-menu > li > a,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle {
  position: relative;
  transition: background .18s ease, color .18s ease, padding .18s ease, box-shadow .18s ease;
}

.sidebar-menu > li > a::before,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle::before {
  display: none;
}

.sidebar-menu__icon {
  display: inline-grid;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  place-items: center;
  margin-right: 2px;
  border: 1px solid #e1e9ed;
  border-radius: 8px;
  background: linear-gradient(145deg, #ffffff, #f1f6f8);
  color: #7b8b98;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.sidebar-menu__icon svg {
  width: 15px;
  height: 15px;
}

.sidebar-menu > li > a:hover,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle:hover {
  padding-left: 14px;
}

.sidebar-menu__link--active,
.sidebar-menu__link--active:hover {
  box-shadow: inset 3px 0 0 var(--panel-primary), 0 6px 14px rgba(31, 122, 109, .08);
  font-weight: 800 !important;
}

.sidebar-menu > li > a:hover .sidebar-menu__icon,
.sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle:hover .sidebar-menu__icon,
.sidebar-menu__link--active .sidebar-menu__icon {
  border-color: rgba(31, 122, 109, .22);
  background: linear-gradient(145deg, #e0f5ef, #e9efff);
  color: var(--panel-primary-deep);
  transform: translateY(-1px);
}

.sidebar-menu__link--has-unread {
  color: var(--panel-primary-deep) !important;
  background: linear-gradient(90deg, rgba(31, 122, 109, .14), rgba(31, 122, 109, .04)) !important;
  box-shadow: inset 3px 0 0 var(--panel-primary), 0 7px 16px rgba(31, 122, 109, .08);
  font-weight: 800 !important;
}
.sidebar-menu__link--has-unread::before {
  border-color: rgba(31, 122, 109, .3) !important;
  background: #dff5ef !important;
}
.top-action-link--has-unread {
  color: var(--panel-primary-deep) !important;
  border-color: rgba(31, 122, 109, .24) !important;
  background: #e8f7f3 !important;
  box-shadow: 0 5px 13px rgba(31, 122, 109, .1);
  font-weight: 800;
}
.top-action-link__unread-badge {
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  margin-left: 5px;
  padding: 0 4px;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: var(--panel-primary);
  font-size: 9px;
  line-height: 1;
  vertical-align: middle;
}
.sidebar-menu__link--has-unread > span:first-child { min-width: 0; }
.sidebar-menu__unread-badge {
  display: inline-grid;
  min-width: 20px;
  height: 20px;
  margin-left: auto;
  padding: 0 5px;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: var(--panel-primary);
  box-shadow: 0 4px 10px rgba(31, 122, 109, .22);
  font-size: 10px;
  line-height: 1;
}
body[data-theme='dark'] .sidebar-menu__link--has-unread {
  color: #caffef !important;
  background: linear-gradient(90deg, rgba(98, 196, 175, .2), rgba(98, 196, 175, .06)) !important;
  box-shadow: inset 3px 0 0 #62c4af, 0 7px 16px rgba(98, 196, 175, .1);
}
body[data-theme='dark'] .sidebar-menu__link--has-unread::before {
  border-color: rgba(168, 240, 222, .3) !important;
  background: rgba(98, 196, 175, .16) !important;
}
body[data-theme='dark'] .top-action-link--has-unread {
  color: #caffef !important;
  border-color: rgba(98, 196, 175, .35) !important;
  background: #21483f !important;
}
.dashboard-message-alert {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding: 13px 15px;
  border: 1px solid rgba(31, 122, 109, .22);
  border-radius: 14px;
  color: var(--panel-primary-deep);
  background: linear-gradient(100deg, #e8f7f3, #f7fcfb);
  box-shadow: 0 8px 18px rgba(31, 122, 109, .08);
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.dashboard-message-alert:hover,
.dashboard-message-alert:focus-visible {
  border-color: rgba(31, 122, 109, .42);
  color: var(--panel-primary-deep);
  box-shadow: 0 11px 23px rgba(31, 122, 109, .13);
  text-decoration: none;
  transform: translateY(-1px);
}
.dashboard-message-alert__icon {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border-radius: 11px;
  color: #fff;
  background: var(--panel-primary);
  font-size: 16px;
}
.dashboard-message-alert__copy { display: grid; gap: 2px; min-width: 0; }
.dashboard-message-alert__copy strong { font-size: 13px; }
.dashboard-message-alert__copy small { color: #66817d; font-size: 11px; }
.dashboard-message-alert__action { margin-left: auto; color: var(--panel-primary); font-size: 11px; font-weight: 800; white-space: nowrap; }
body[data-theme='dark'] .dashboard-message-alert { border-color: rgba(98, 196, 175, .35); color: #caffef; background: linear-gradient(100deg, #173b35, #1b2d30); }
body[data-theme='dark'] .dashboard-message-alert:hover,
body[data-theme='dark'] .dashboard-message-alert:focus-visible { color: #d8fff3; }
body[data-theme='dark'] .dashboard-message-alert__copy small { color: #a7c4bd; }
@media (max-width: 560px) {
  .dashboard-message-alert { align-items: flex-start; }
  .dashboard-message-alert__action { margin-top: 3px; font-size: 10px; }
}

@media (max-width: 1200px) {
  .sidebar-search {
    margin: 0 18px 13px;
  }

  .account-panel__status {
    color: rgba(255, 255, 255, .76) !important;
  }

  .sidebar-brand__copy small {
    font-size: 9px;
  }

  .sidebar-section-title {
    min-height: 34px;
    margin-right: 2px;
    margin-left: 2px;
  }

  .sidebar-section-title::before {
    flex-basis: 29px;
    width: 29px;
    height: 24px;
  }

  .sidebar-menu__icon {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
    border-radius: 8px;
  }

  .sidebar-menu__link--active,
  .sidebar-menu__link--active:hover {
    box-shadow: inset 3px 0 0 var(--panel-primary), 0 7px 16px rgba(31, 122, 109, .1);
  }
}

body[data-theme='dark'] .sidebar-section-title::before {
  border-color: rgba(168, 240, 222, .18);
  background: rgba(98, 196, 175, .1);
}

body[data-theme='dark'] .sidebar-menu > li > a::before,
body[data-theme='dark'] .sidebar-menu__item--accordion > .sidebar-menu__accordion-toggle::before {
  border-color: rgba(168, 240, 222, .16);
  background: rgba(98, 196, 175, .08);
  color: var(--panel-primary-deep);
}

body[data-theme='dark'] .sidebar-menu__icon {
  border-color: rgba(168, 240, 222, .16);
  background: rgba(98, 196, 175, .08);
  color: var(--panel-primary-deep);
}

.access-denied-card {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  max-width: 760px;
  margin: 24px auto;
  padding: 30px;
}

.access-denied-card__icon {
  display: grid;
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  place-items: center;
  border-radius: 16px;
  background: #fff2e8;
  color: #c76936;
  font-size: 25px;
  font-weight: 800;
}

.access-denied-card h1 {
  margin: 5px 0 8px;
  font-size: clamp(24px, 3vw, 34px);
}

.access-denied-card p {
  max-width: 590px;
  color: #687985;
  line-height: 1.7;
}

@media (max-width: 640px) {
  .access-denied-card { flex-direction: column; padding: 22px; }
}
/* Event rows expose a clear, keyboard-accessible detail target. */
.event-title-link {
  display: inline-flex;
  flex-direction: column;
  gap: 0.18rem;
  color: var(--ink, #172033);
  text-decoration: none;
}

.event-title-link:hover,
.event-title-link:focus-visible {
  color: var(--primary, #6d36d9);
  text-decoration: underline;
}

.event-title-link small {
  color: var(--muted, #6b7280);
  font-size: 0.75rem;
  font-weight: 600;
}

.event-detail-card h1 {
  margin: 0.25rem 0 0;
}

.event-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  margin-top: 1.25rem;
}

.event-detail-grid div {
  display: grid;
  gap: 0.25rem;
  padding: 0.85rem;
  border: 1px solid var(--border, #e4e8ef);
  border-radius: 0.85rem;
  background: var(--surface-muted, #f7f9fc);
}

.event-detail-grid span,
.event-detail-description > span {
  color: var(--muted, #6b7280);
  font-size: 0.78rem;
  font-weight: 700;
}

.event-detail-description {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border, #e4e8ef);
}

.event-detail-description p {
  margin: 0.45rem 0 0;
  line-height: 1.65;
  white-space: normal;
}

/* Teacher detail: compact profile header and section navigation. */
.teacher-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  padding: 24px;
  margin-bottom: 16px;
  border: 1px solid #dfe8ee;
  border-radius: 20px;
  background: linear-gradient(135deg, #ffffff 0%, #f3faf8 100%);
  box-shadow: 0 12px 28px rgba(30, 47, 66, .06);
}

.teacher-detail-hero__main {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.teacher-detail-avatar {
  display: grid;
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  place-items: center;
  border-radius: 22px;
  color: #fff;
  background: linear-gradient(135deg, #1f7a6d 0%, #347fd1 100%);
  box-shadow: 0 12px 24px rgba(31, 122, 109, .2);
  font-size: 24px;
  font-weight: 800;
}

.teacher-detail-eyebrow {
  margin: 0 0 5px;
  color: var(--panel-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.teacher-detail-hero h1 {
  margin: 0;
  color: #17212b;
  font-size: clamp(25px, 3vw, 36px);
  letter-spacing: -.04em;
}

.teacher-detail-hero__main p:last-child {
  margin: 7px 0 0;
  color: #66767c;
  font-size: 13px;
}

.teacher-detail-meta {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding-top: 16px;
  border-top: 1px solid #e5edf0;
}

.teacher-detail-meta div {
  min-width: 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .74);
}

.teacher-detail-meta span,
.teacher-detail-meta strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.teacher-detail-meta span {
  margin-bottom: 5px;
  color: #718096;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.teacher-detail-meta strong {
  color: #25313d;
  font-size: 13px;
}

.teacher-detail-tabs {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}

.teacher-routine-scroll {
  overflow-x: hidden;
  margin-top: 16px;
  border: 1px solid #e3ebee;
  border-radius: 14px;
}

.teacher-routine-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.teacher-routine-filter select,
.teacher-routine-day-picker select {
  min-height: 38px;
  padding: 8px 30px 8px 10px;
  border: 1px solid #dce7e9;
  border-radius: 8px;
  color: #30414b;
  background: #fff;
  font-size: 12px;
}

.teacher-routine-filter__clear {
  color: #1f7a6d;
  font-size: 12px;
  font-weight: 700;
}

.teacher-routine-day-picker {
  display: none;
  margin: 14px 0;
}

.teacher-routine-day-picker label {
  display: block;
  margin-bottom: 6px;
  color: #687882;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.teacher-routine-table {
  width: 100%;
  min-width: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.teacher-routine-table th,
.teacher-routine-table td {
  min-width: 0;
  padding: 12px;
  border-right: 1px solid #edf1f3;
  border-bottom: 1px solid #edf1f3;
  vertical-align: top;
  background: #fff;
}

.teacher-routine-table thead th {
  color: #687882;
  background: #f7fafb;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.teacher-routine-table tr:last-child th,
.teacher-routine-table tr:last-child td {
  border-bottom: 0;
}

.teacher-routine-table th:last-child,
.teacher-routine-table td:last-child {
  border-right: 0;
}

.teacher-routine-time {
  width: 132px;
  color: #25313d !important;
  background: #fbfcfd !important;
}

.teacher-routine-time strong,
.teacher-routine-time small {
  display: block;
}

.teacher-routine-time strong {
  font-size: 13px;
}

.teacher-routine-time small {
  margin-top: 4px;
  color: #87939e;
  font-size: 11px;
  font-weight: 600;
}

.teacher-routine-card {
  display: block;
  min-width: 0;
  margin: -2px 0 6px;
  padding: 9px 10px;
  border-left: 3px solid #258c7c;
  border-radius: 8px;
  color: #25313d;
  background: #edf8f5;
  text-decoration: none;
}

.schedule-grid-card {
  border-left-width: 3px;
}

.schedule-grid-card small {
  display: block;
  margin-top: 4px;
  color: #657680;
  font-size: 10px;
}

.schedule-color--teal { border-left-color: #158f82; background: #e8f7f3; }
.schedule-color--violet { border-left-color: #7956c8; background: #f0ebff; }
.schedule-color--blue { border-left-color: #3c82c4; background: #eaf3ff; }
.schedule-color--orange { border-left-color: #d7832f; background: #fff2df; }
.schedule-color--rose { border-left-color: #c45170; background: #ffedf2; }
.schedule-color--lime { border-left-color: #6d9c3d; background: #f0f8e7; }
.schedule-color--indigo { border-left-color: #5264b8; background: #edf0ff; }
.schedule-color--amber { border-left-color: #b18a22; background: #fff8d9; }

.schedule-grid-card.schedule-color--teal:hover,
.schedule-grid-card.schedule-color--violet:hover,
.schedule-grid-card.schedule-color--blue:hover,
.schedule-grid-card.schedule-color--orange:hover,
.schedule-grid-card.schedule-color--rose:hover,
.schedule-grid-card.schedule-color--lime:hover,
.schedule-grid-card.schedule-color--indigo:hover,
.schedule-grid-card.schedule-color--amber:hover {
  filter: saturate(1.08) brightness(.98);
}

.teacher-routine-card:hover,
.teacher-routine-card:focus-visible {
  color: #1f7a6d;
  background: #e2f3ef;
}

.teacher-routine-card strong,
.teacher-routine-card span {
  display: block;
}

.teacher-routine-card strong {
  font-size: 12px;
}

.schedule-card__kind {
  display: block;
  margin-top: 3px;
  color: #8a5b18 !important;
  font-size: 10px !important;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.schedule-card__room {
  color: #1f7a6d !important;
  font-size: 10px !important;
  font-weight: 700;
}

.teacher-routine-card--project-subgroup,
.schedule-grid-card--project-subgroup {
  border-left-style: dashed;
  box-shadow: inset 0 0 0 1px rgba(177, 138, 34, .14);
}

.teacher-routine-card strong:hover,
.teacher-routine-card strong:focus-visible {
  text-decoration: underline;
}

.teacher-routine-card span {
  margin-top: 3px;
  overflow-wrap: anywhere;
  color: #657680;
  font-size: 11px;
}

.teacher-routine-card__links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 7px;
}

.teacher-routine-card__links a {
  overflow-wrap: anywhere;
  color: #1f7a6d;
  font-size: 10px;
  font-weight: 800;
  text-decoration: underline;
}

.teacher-routine-empty {
  display: block;
  color: #b1bbc1;
  text-align: center;
}

.teacher-routine-details {
  margin-top: 16px;
  border-top: 1px solid #edf1f3;
}

.teacher-routine-details summary {
  padding: 14px 0 4px;
  color: #1f7a6d;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

body[data-theme='dark'] .teacher-routine-scroll,
body[data-theme='dark'] .teacher-routine-details {
  border-color: #2c454b;
}

body[data-theme='dark'] .teacher-routine-table th,
body[data-theme='dark'] .teacher-routine-table td {
  border-color: #2c454b;
  background: #16252b;
}

body[data-theme='dark'] .teacher-routine-table thead th,
body[data-theme='dark'] .teacher-routine-time {
  background: #1b3436 !important;
}

body[data-theme='dark'] .teacher-routine-time,
body[data-theme='dark'] .teacher-routine-card strong {
  color: #f4fffb !important;
}

body[data-theme='dark'] .teacher-routine-card {
  background: #193d3b;
}

body[data-theme='dark'] .schedule-card__kind {
  color: #f2cf7b !important;
}

body[data-theme='dark'] .schedule-card__room {
  color: #8de0cb !important;
}

body[data-theme='dark'] .teacher-routine-filter select,
body[data-theme='dark'] .teacher-routine-day-picker select {
  border-color: #2c454b;
  color: #e8f1ed;
  background: #16252b;
}

body[data-theme='dark'] .teacher-routine-day-picker label {
  color: #b8cbc6;
}

/* Teacher detail responsive layout. */
.teacher-details-page { min-width: 0; }
.teacher-detail-hero__main > div:last-child,
.teacher-detail-tabs a,
.teacher-detail-panel,
.teacher-detail-panel .module-toolbar > div { min-width: 0; }
.teacher-detail-hero h1 { overflow-wrap: anywhere; }
.teacher-detail-meta strong { overflow-wrap: anywhere; white-space: normal; }
.teacher-detail-panel .module-toolbar { flex-wrap: wrap; }
.teacher-details-page .module-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 1100px) {
  .teacher-detail-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .teacher-detail-overview .edudash-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.teacher-detail-tabs a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #e0e8ed;
  border-radius: 12px;
  color: #30414b;
  background: #fff;
  text-decoration: none;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.teacher-detail-tabs a:hover,
.teacher-detail-tabs a:focus-visible {
  border-color: #91c9be;
  box-shadow: 0 8px 18px rgba(31, 122, 109, .1);
  transform: translateY(-1px);
}

.teacher-detail-tabs a.is-active {
  color: #fff;
  border-color: #258c7c;
  background: linear-gradient(135deg, #258c7c 0%, #347fd1 100%);
  box-shadow: 0 10px 22px rgba(31, 122, 109, .18);
}

.teacher-detail-tabs a.is-active span,
.teacher-detail-tabs a.is-active strong {
  color: #fff;
}

.teacher-detail-panels {
  min-width: 0;
}

.teacher-detail-panel {
  display: none;
  margin-top: 0;
}

.teacher-detail-panel.is-active {
  display: block;
  animation: teacher-detail-panel-in .18s ease-out;
}

@keyframes teacher-detail-panel-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.teacher-profile-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  border-top: 1px solid #edf0f3;
  border-left: 1px solid #edf0f3;
}

.teacher-profile-facts > div {
  min-width: 0;
  padding: 16px;
  border-right: 1px solid #edf0f3;
  border-bottom: 1px solid #edf0f3;
}

.teacher-profile-facts dt {
  margin-bottom: 6px;
  color: #788493;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.teacher-profile-facts dd {
  margin: 0;
  color: #25313d;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.teacher-profile-facts__wide {
  grid-column: 1 / -1;
}

.teacher-profile-subsection {
  margin-top: 22px;
}

.teacher-profile-subsection h3 {
  margin: 0 0 12px;
  color: #25313d;
  font-size: 16px;
}

.teacher-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.teacher-chip-list span {
  display: inline-flex;
  flex-direction: column;
  gap: 3px;
  min-width: 150px;
  padding: 10px 12px;
  border: 1px solid #dfe8ed;
  border-radius: 10px;
  color: #647382;
  background: #f8fbfc;
  font-size: 12px;
}

.student-theme-badge {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding: 0.35rem 0.55rem;
  border-radius: 0.55rem;
  background: #eef8f6;
  color: #176d67;
  font-size: 0.86rem;
}

.student-theme-badge small {
  color: #5d7775;
  flex-basis: 100%;
}

.student-theme-inline {
  color: #16766e;
}

.schedule-grid-card__theme {
  display: block;
  margin-top: 0.3rem;
  color: #176d67;
  line-height: 1.35;
}

.teacher-chip-list strong {
  color: #25313d;
  font-size: 13px;
}

.teacher-detail-tabs span {
  overflow: hidden;
  color: #687882;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.teacher-detail-tabs strong {
  color: #1f7a6d;
  font-size: 18px;
}

.teacher-student-link {
  color: inherit;
  text-decoration: none;
}

.teacher-student-link:hover,
.teacher-student-link:focus-visible {
  color: var(--panel-primary);
  text-decoration: underline;
}

body[data-theme='dark'] .teacher-detail-hero {
  border-color: #2c454b;
  background: linear-gradient(135deg, #16252b 0%, #1b3436 100%);
}

body[data-theme='dark'] .teacher-detail-hero h1,
body[data-theme='dark'] .teacher-detail-meta strong {
  color: #f4fffb;
}

body[data-theme='dark'] .teacher-detail-hero__main p:last-child,
body[data-theme='dark'] .teacher-detail-meta span {
  color: #b8cbc6;
}

body[data-theme='dark'] .teacher-detail-meta {
  border-top-color: #2c454b;
}

body[data-theme='dark'] .teacher-detail-meta div,
body[data-theme='dark'] .teacher-detail-tabs a {
  border-color: #2c454b;
  color: #e8f1ed;
  background: #16252b;
}

body[data-theme='dark'] .teacher-detail-tabs span {
  color: #b8cbc6;
}

body[data-theme='dark'] .teacher-detail-tabs strong {
  color: #a8f0de;
}

body[data-theme='dark'] .teacher-detail-tabs a.is-active,
body[data-theme='dark'] .teacher-detail-tabs a.is-active span,
body[data-theme='dark'] .teacher-detail-tabs a.is-active strong {
  color: #fff;
}

body[data-theme='dark'] .teacher-profile-facts {
  border-color: #2c454b;
}

body[data-theme='dark'] .teacher-profile-facts > div {
  border-color: #2c454b;
}

body[data-theme='dark'] .teacher-profile-facts dd,
body[data-theme='dark'] .teacher-profile-subsection h3,
body[data-theme='dark'] .teacher-chip-list strong {
  color: #f4fffb;
}

body[data-theme='dark'] .teacher-profile-facts dt {
  color: #b8cbc6;
}

body[data-theme='dark'] .teacher-chip-list span {
  border-color: #2c454b;
  color: #b8cbc6;
  background: #16252b;
}

@media (max-width: 700px) {
  .teacher-detail-hero {
    grid-template-columns: 1fr;
  }

  .teacher-detail-hero > .module-button {
    justify-self: start;
  }

  .teacher-detail-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .teacher-detail-overview .edudash-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .teacher-routine-day-picker {
    display: block;
  }

  .teacher-routine-filter {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .teacher-routine-filter select {
    flex: 1 1 190px;
  }

  .teacher-routine-table {
    min-width: 0;
  }

  .teacher-routine-scroll {
    overflow-x: hidden;
  }

  .teacher-routine-table th[data-routine-day],
  .teacher-routine-table td[data-routine-day] {
    min-width: 0;
  }
}

@media (max-width: 480px) {
  .teacher-detail-hero {
    padding: 18px;
  }

  .teacher-detail-hero__main {
    align-items: flex-start;
  }

  .teacher-detail-avatar {
    flex-basis: 56px;
    width: 56px;
    height: 56px;
    border-radius: 17px;
    font-size: 20px;
  }

  .teacher-detail-meta {
    grid-template-columns: 1fr;
  }

  .teacher-detail-tabs {
    grid-template-columns: 1fr;
  }

  .teacher-detail-overview .edudash-stat-grid { grid-template-columns: 1fr; }

  .teacher-profile-facts {
    grid-template-columns: 1fr;
  }

  .teacher-profile-facts__wide {
    grid-column: auto;
  }
}

@media (max-width: 760px) {
  .event-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .event-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* Dashboard list items that lead to an existing record detail. */
.edudash-row-link {
  color: inherit;
  text-decoration: none;
  border-radius: 8px;
  transition: background .18s ease, padding-left .18s ease, padding-right .18s ease;
}

.edudash-row-link:hover,
.edudash-row-link:focus-visible {
  color: inherit;
  background: #f4faf8;
  padding-left: 10px;
  padding-right: 10px;
  outline: none;
}

.edudash-row-link:focus-visible {
  box-shadow: 0 0 0 3px rgba(31, 122, 109, .18);
}

body[data-theme='dark'] .edudash-row-link:hover,
body[data-theme='dark'] .edudash-row-link:focus-visible {
  background: #162f31;
}
/* General settings: grouped, preview-first admin workflow. */
.general-settings-form { min-width: 0; }
.general-settings-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 18px; align-items: start; }
.general-settings-tabs { position: sticky; top: 18px; display: grid; gap: 7px; padding: 8px; border: 1px solid #e1e9ed; border-radius: 16px; background: rgba(255, 255, 255, .84); box-shadow: 0 8px 24px rgba(30, 47, 66, .04); }
.general-settings-tabs a { display: grid; gap: 3px; padding: 13px 14px; border: 1px solid transparent; border-radius: 11px; color: #718096; text-decoration: none; transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease; }
.general-settings-tabs a strong { color: #273642; font-size: 12px; }
.general-settings-tabs a small { color: #8a98a5; font-size: 10px; }
.general-settings-tabs a:hover { transform: translateX(2px); border-color: #dbe9e5; background: #f5faf8; }
.general-settings-tabs a.is-active { border-color: rgba(31, 122, 109, .18); background: linear-gradient(135deg, #edf8f5, #f8fbfb); box-shadow: 0 6px 16px rgba(31, 122, 109, .08); }
.general-settings-tabs a.is-active strong { color: var(--panel-primary-deep); }
.general-settings-tabs a.is-active small { color: #5e8580; }
.general-settings-content { min-width: 0; padding: 22px; border: 1px solid #e1e9ed; border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(30, 47, 66, .05); }
.general-settings-panel { display: none; }
.general-settings-panel.is-active { display: block; }
.general-settings-panel__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid #edf1f3; }
.general-settings-panel__heading h2 { margin: 4px 0 5px; color: #24343d; font-size: 22px; letter-spacing: -.03em; }
.general-settings-panel__heading p { margin: 0; color: #7b8b93; font-size: 12px; }
.settings-kicker { color: var(--panel-primary); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.settings-status-dot, .settings-security-badge { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 999px; color: #397e69; background: #eaf7f1; font-size: 10px; font-weight: 800; white-space: nowrap; }
.settings-status-dot i { width: 7px; height: 7px; border-radius: 50%; background: #36a36f; box-shadow: 0 0 0 4px rgba(54, 163, 111, .12); }
.settings-security-badge { color: #526c91; background: #eef4fc; }
.general-settings-panel .module-grid { margin-bottom: 18px; }
.general-settings-panel .module-field small { display: block; margin-top: 5px; color: #8b99a1; font-size: 10px; line-height: 1.45; }
.general-settings-panel input[type='color'] { width: 100%; min-height: 42px; padding: 4px; cursor: pointer; }
.settings-asset-preview { display: flex; align-items: center; gap: 9px; min-height: 42px; padding: 7px 9px; margin-top: 8px; border: 1px dashed #d6e5e1; border-radius: 9px; color: #819096; background: #f8fcfb; font-size: 10px; }
.settings-asset-preview img { display: block; width: 76px; height: 28px; object-fit: contain; }
.settings-asset-preview--favicon img { width: 28px; height: 28px; }
.settings-asset-preview.is-new { border-style: solid; border-color: rgba(31, 122, 109, .35); color: #397e69; background: #eef9f5; }
.general-settings-subsection { padding-top: 18px; border-top: 1px solid #edf1f3; }
.general-settings-subsection__heading { margin-bottom: 14px; }
.general-settings-subsection__heading h3 { margin: 0 0 4px; color: #344850; font-size: 14px; }
.general-settings-subsection__heading p { margin: 0; color: #87959c; font-size: 11px; }
.theme-live-preview { overflow: hidden; margin: 3px 0 22px; border: 1px solid color-mix(in srgb, var(--panel-primary) 18%, #dfe9e7); border-radius: 15px; background: var(--panel-bg); box-shadow: 0 10px 24px rgba(31, 78, 73, .07); }
.theme-live-preview__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 15px; color: #fff; background: linear-gradient(135deg, var(--panel-primary-deep), var(--panel-primary)); }
.theme-live-preview__top div { display: grid; gap: 3px; }
.theme-live-preview__top span { color: rgba(255,255,255,.7); font-size: 9px; font-weight: 700; }
.theme-live-preview__top strong { font-size: 14px; }
.theme-live-preview__badge { padding: 5px 8px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; font-size: 9px!important; }
.theme-live-preview__body { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 13px; }
.theme-live-preview__sidebar { display: grid; align-content: start; gap: 7px; padding: 9px 8px; border-radius: 9px; background: var(--panel-primary-deep); }
.theme-live-preview__sidebar i { display: block; height: 6px; border-radius: 4px; background: rgba(255,255,255,.62); }
.theme-live-preview__sidebar i:first-child { background: var(--panel-accent); }
.theme-live-preview__main { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.theme-live-preview__card { display: grid; gap: 4px; padding: 12px; border: 1px solid #e5efec; border-radius: 10px; background: #fff; }
.theme-live-preview__card--accent { border-color: color-mix(in srgb, var(--panel-accent) 28%, #e5efec); background: color-mix(in srgb, var(--panel-accent) 8%, #fff); }
.theme-live-preview__card small { color: #7d8d92; font-size: 9px; }
.theme-live-preview__card strong { color: var(--panel-primary-deep); font-size: 20px; }
.theme-live-preview__card span { color: #94a0a4; font-size: 9px; }
.smtp-status-card { display: flex; align-items: center; gap: 11px; padding: 12px 14px; margin-bottom: 17px; border: 1px solid #dfece7; border-radius: 12px; background: #f6fbf9; }
.smtp-status-card__icon { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 9px; color: #fff; background: var(--panel-primary); font-size: 15px; }
.smtp-status-card div:last-child { display: grid; gap: 3px; }
.smtp-status-card strong { color: #2d5b51; font-size: 12px; }
.smtp-status-card span { color: #78908c; font-size: 10px; }
.general-settings-panel[data-settings-panel='mail'] .module-grid.is-disabled { opacity: .58; }
.general-settings-panel[data-settings-panel='mail'] .module-grid.is-disabled input,
.general-settings-panel[data-settings-panel='mail'] .module-grid.is-disabled select { cursor: not-allowed; }
.settings-password-field { display: flex; gap: 6px; }
.settings-password-field input { min-width: 0; flex: 1; }
.settings-password-toggle { flex: 0 0 auto; padding: 0 10px; border: 1px solid #dbe8e5; border-radius: 9px; color: #47766e; background: #f3faf7; font-size: 10px; font-weight: 800; cursor: pointer; }
.smtp-test-actions { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.smtp-test-help { color: #819096; font-size: 10px; }
.smtp-test-result { padding: 10px 12px; margin-top: 12px; border-radius: 9px; font-size: 11px; }
.smtp-test-result.is-success { color: #2f755f; background: #eef9f3; border: 1px solid #cce9dc; }
.smtp-test-result.is-error { color: #9a4b3e; background: #fff3ef; border: 1px solid #f0d4ca; }
.smtp-test-note { padding: 11px 13px; border-left: 3px solid var(--panel-accent); border-radius: 7px; color: #77868c; background: #fff8f3; font-size: 11px; }
.smtp-test-note strong { color: #a4613e; }
.general-settings-savebar { position: sticky; bottom: 14px; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; margin-top: 14px; border: 1px solid #dce9e6; border-radius: 13px; background: rgba(255,255,255,.94); box-shadow: 0 12px 26px rgba(30, 47, 66, .11); backdrop-filter: blur(12px); }
.general-settings-savebar div { display: grid; gap: 3px; }
.general-settings-savebar strong { color: #294047; font-size: 12px; }
.general-settings-savebar span { color: #819096; font-size: 10px; }
@media (max-width: 800px) { .general-settings-layout { grid-template-columns: 1fr; } .general-settings-tabs { position: static; display: flex; overflow-x: auto; padding: 5px; } .general-settings-tabs a { min-width: 145px; } .general-settings-tabs a:hover { transform: none; } .general-settings-content { padding: 16px; border-radius: 14px; } }
@media (max-width: 520px) { .general-settings-panel__heading { flex-direction: column; gap: 10px; } .theme-live-preview__main { grid-template-columns: 1fr; } .general-settings-savebar { align-items: stretch; flex-direction: column; } .general-settings-savebar .module-button { width: 100%; } .smtp-test-actions { align-items: stretch; flex-direction: column; } .smtp-test-actions .module-button { width: 100%; } }

/* School messaging: formal conversation workspace, not a social chat clone. */
.message-page__header { align-items: center; }
.message-page__header p { max-width: 620px; }
.message-stats { margin-bottom: 18px; }
.message-mail-status { display: flex; align-items: center; gap: 10px; padding: 10px 13px; margin: -6px 0 16px; border: 1px solid #e2eaea; border-radius: 10px; background: #f8fbfb; }
.message-mail-status > span { color: #9da9a9; font-size: 14px; }
.message-mail-status.is-ready > span { color: #35a477; }
.message-mail-status div { display: grid; flex: 1; gap: 2px; }
.message-mail-status strong { color: #48605e; font-size: 11px; }
.message-mail-status small { color: #879596; font-size: 10px; }
.message-mail-status a { color: #347d72; font-size: 10px; font-weight: 800; text-decoration: none; }
.message-workspace { display: grid; grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); min-height: 620px; overflow: hidden; border: 1px solid #dfe9e8; border-radius: 18px; background: #fff; box-shadow: 0 14px 32px rgba(30, 47, 66, .07); }
.message-inbox { display: flex; min-width: 0; flex-direction: column; border-right: 1px solid #e6eeee; background: #fbfdfd; }
.message-inbox__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 16px 12px; }
.message-inbox__top div { display: grid; gap: 3px; }
.message-inbox__top strong { color: #263b42; font-size: 16px; }
.message-inbox__top span { color: #87959a; font-size: 10px; }
.message-icon-link { display: inline-grid; width: 32px; height: 32px; place-items: center; border: 1px solid #d8e8e4; border-radius: 10px; color: #247a6d; background: #eef8f5; font-size: 18px; font-weight: 800; text-decoration: none; }
.message-search { display: flex; align-items: center; gap: 7px; margin: 0 12px 10px; padding: 0 10px; border: 1px solid #dce8e7; border-radius: 10px; background: #fff; }
.message-search span { color: #6e8c89; font-size: 18px; }
.message-search input { width: 100%; min-width: 0; padding: 10px 0; border: 0; outline: 0; color: #34484d; background: transparent; font-size: 11px; }
.message-recipient-picker { position: relative; }
.message-recipient-picker + select.is-search-enhanced { display: none; }
.message-recipient-picker > input, .message-bulk-search { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1px solid #dce9e7; border-radius: 9px; outline: 0; color: #34484d; background: #fff; font-size: 11px; }
.message-recipient-picker > input:focus, .message-bulk-search:focus { border-color: #60a99b; box-shadow: 0 0 0 3px rgba(31, 122, 109, .1); }
.message-recipient-results { position: absolute; z-index: 8; top: calc(100% + 5px); right: 0; left: 0; max-height: 230px; overflow-y: auto; padding: 5px; border: 1px solid #dce9e7; border-radius: 10px; background: #fff; box-shadow: 0 12px 25px rgba(30, 47, 66, .14); }
.message-recipient-results button { display: grid; width: 100%; gap: 2px; padding: 8px 9px; border: 0; border-radius: 7px; color: #34484d; background: transparent; text-align: left; cursor: pointer; }
.message-recipient-results button:hover { background: #eef8f5; }
.message-recipient-results button.is-keyboard-active { background: #e6f5f0; }
.message-recipient-results__empty { padding: 12px 10px; color: #819096; font-size: 10px; text-align: center; }
.message-recipient-results button { grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 8px; }
.message-recipient-avatar { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; color: #26796e; background: #d9eee9; font-size: 11px; font-weight: 800; }
.message-recipient-copy { display: grid; min-width: 0; gap: 2px; }
.message-recipient-copy strong, .message-recipient-copy small, .message-recipient-copy em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-recipient-copy strong { color: #34484d; font-size: 11px; }
.message-recipient-copy small { color: #6d8784; font-size: 9px; }
.message-recipient-copy em { color: #94a1a4; font-size: 9px; font-style: normal; }
.message-recipient-results strong { font-size: 11px; }
.message-recipient-results small { color: #819096; font-size: 9px; }
.message-filters { display: flex; gap: 4px; padding: 0 12px 9px; }
.message-filters button { flex: 1; padding: 7px 4px; border: 0; border-radius: 7px; color: #819096; background: transparent; font-size: 10px; font-weight: 800; cursor: pointer; }
.message-filters button.is-active { color: #26796e; background: #e9f7f3; }
.message-thread-list { overflow: auto; min-height: 0; }
.message-thread-item { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 12px 13px; border-top: 1px solid #edf2f2; color: inherit; text-decoration: none; }
.message-thread-item:hover, .message-thread-item.is-active { background: #eef8f5; }
.message-thread-item.is-unread { background: #f7fbfa; }
.message-avatar { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #28786d; background: #d9eee9; font-size: 12px; font-weight: 800; }
.message-avatar--large { width: 42px; height: 42px; font-size: 15px; }
.message-thread-item__body { display: grid; min-width: 0; gap: 3px; }
.message-thread-item__body strong, .message-thread-item__body small, .message-thread-item__body > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-thread-item__body strong { color: #32464b; font-size: 11px; }
.message-thread-item__body small { color: #5d7e79; font-size: 10px; font-weight: 800; }
.message-thread-item__body > span { color: #8a989c; font-size: 10px; }
.message-thread-item__meta { display: grid; justify-items: end; gap: 5px; color: #94a1a4; font-size: 9px; white-space: nowrap; }
.message-thread-item__meta b { display: grid; width: 16px; height: 16px; place-items: center; border-radius: 50%; color: #fff; background: #e88a3d; font-size: 9px; }
.message-conversation { display: flex; min-width: 0; min-height: 620px; flex-direction: column; background: #fff; }
.message-conversation__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 19px; border-bottom: 1px solid #e8efee; }
.message-conversation__identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.message-conversation__identity div { display: grid; min-width: 0; gap: 3px; }
.message-conversation__identity h2 { overflow: hidden; margin: 0; color: #293d42; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.message-conversation__identity p { overflow: hidden; margin: 0; color: #819096; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.message-mobile-back { display: none; }
.message-stream { display: flex; flex: 1; min-height: 300px; flex-direction: column; gap: 8px; overflow: auto; padding: 20px 22px; background: linear-gradient(180deg, #fbfdfd 0%, #f7fbfa 100%); }
.message-date-divider { display: flex; align-items: center; gap: 8px; margin: 5px 0 9px; color: #8a999c; font-size: 9px; font-weight: 800; }
.message-date-divider::before, .message-date-divider::after { flex: 1; height: 1px; background: #e1ebea; content: ''; }
.message-bubble-row { display: flex; justify-content: flex-start; }
.message-bubble-row.is-own { justify-content: flex-end; }
.message-bubble { max-width: min(74%, 520px); padding: 10px 12px; border: 1px solid #e0ecea; border-radius: 14px 14px 14px 4px; background: #fff; box-shadow: 0 4px 12px rgba(31, 78, 73, .04); }
.message-bubble-row.is-own .message-bubble { border-color: #c9e9df; border-radius: 14px 14px 4px 14px; background: #eaf8f4; }
.message-bubble.is-deleted { color: #909b9e; background: #f0f4f4; box-shadow: none; }
.message-bubble__meta { display: flex; align-items: center; gap: 7px; margin-bottom: 5px; }
.message-bubble__meta strong { color: #49726b; font-size: 10px; }
.message-bubble__meta time { color: #93a0a3; font-size: 9px; }
.message-bubble__meta em { color: #8a9a9b; font-size: 9px; font-style: italic; }
.message-bubble p { margin: 0; color: #405156; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.message-bubble__actions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 8px; padding-top: 7px; border-top: 1px dashed #d3e5e0; }
.message-bubble__actions button { padding: 0; border: 0; color: #4f8580; background: transparent; font-size: 9px; font-weight: 800; cursor: pointer; }
.message-bubble__actions form { margin: 0; }
.message-bubble__actions form button { color: #b36a61; }
.message-attachment { display: flex; align-items: center; gap: 6px; margin-top: 9px; padding: 8px 9px; border: 1px solid #d5e7e2; border-radius: 8px; color: #347d72; background: #f7fcfb; text-decoration: none; font-size: 10px; }
.message-attachment:hover { border-color: #9acdc1; background: #eef9f5; }
.message-attachment span { overflow: hidden; flex: 1; text-overflow: ellipsis; white-space: nowrap; }
.message-attachment small { color: #8b9a9e; white-space: nowrap; }
.message-attachment span { overflow: hidden; flex: 1; text-overflow: ellipsis; white-space: nowrap; }
.message-attachment small { color: #8b9a9e; white-space: nowrap; }
.message-composer { padding: 12px 15px; border-top: 1px solid #e5eeee; background: #fff; }
.message-composer--new { margin: 0 auto 22px; width: min(760px, calc(100% - 36px)); border: 1px solid #e0ecea; border-radius: 14px; box-shadow: 0 8px 22px rgba(31, 78, 73, .05); }
.message-compose-switch { display: inline-flex; gap: 4px; margin-bottom: 12px; padding: 4px; border-radius: 9px; background: #f0f7f5; }
.message-compose-switch button { padding: 7px 10px; border: 0; border-radius: 7px; color: #7c8f91; background: transparent; font-size: 10px; font-weight: 800; cursor: pointer; }
.message-compose-switch button.is-active { color: #24796e; background: #fff; box-shadow: 0 2px 7px rgba(31, 78, 73, .08); }
.message-composer select[multiple] { min-height: 118px; }
.message-bulk-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-bottom: 6px; }
.message-bulk-filters select { min-width: 0; padding: 8px; border: 1px solid #dce9e7; border-radius: 8px; color: #526c70; background: #fff; font-size: 10px; }
.message-bulk-search { margin-bottom: 6px; padding: 8px 9px; font-size: 10px; }
.message-composer textarea { display: block; width: 100%; min-height: 42px; resize: vertical; padding: 11px 0; border: 0; outline: 0; color: #34484d; background: transparent; font: inherit; font-size: 12px; }
.message-composer__footer { display: flex; align-items: center; gap: 10px; }
.message-composer__footer small { overflow: hidden; flex: 1; color: #8a999d; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.message-attach { display: inline-flex; align-items: center; gap: 5px; color: #4a7f78; font-size: 10px; font-weight: 800; cursor: pointer; }
.message-attach input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.message-compose-empty { display: grid; flex: 1; place-items: center; align-content: center; gap: 8px; padding: 40px; text-align: center; }
.message-compose-empty__icon { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 18px; color: #fff; background: linear-gradient(135deg, #267c70, #55ad9b); font-size: 25px; box-shadow: 0 10px 22px rgba(31, 122, 109, .2); }
.message-compose-empty h2 { margin: 7px 0 0; color: #2d4248; font-size: 20px; }
.message-compose-empty p { max-width: 340px; margin: 0 0 8px; color: #819096; font-size: 11px; line-height: 1.5; }
.message-edit-modal { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(23, 45, 48, .35); }
.message-edit-modal[hidden] { display: none; }
.message-edit-modal__card { width: min(520px, 100%); padding: 18px; border: 1px solid #e0ecea; border-radius: 15px; background: #fff; box-shadow: 0 18px 45px rgba(20, 43, 45, .2); }
.message-edit-modal__card textarea { display: block; width: 100%; box-sizing: border-box; margin: 10px 0; padding: 11px; border: 1px solid #dce9e7; border-radius: 9px; resize: vertical; }
.message-audit-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.message-audit-filters .module-button { padding: 7px 9px; font-size: 10px; }
@media (max-width: 800px) { .message-workspace { grid-template-columns: 1fr; min-height: 570px; } .message-inbox { min-height: 570px; border-right: 0; } .message-workspace.has-thread .message-inbox { display: none; } .message-workspace.has-thread .message-conversation { min-height: 570px; } .message-mobile-back { display: inline-grid; } .message-bubble { max-width: 88%; } }
@media (max-width: 520px) { .message-page__header { align-items: stretch; flex-direction: column; } .message-page__header .module-button { align-self: flex-start; } .message-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .message-stream { padding: 15px 11px; } .message-composer { padding: 10px; } .message-composer__footer { flex-wrap: wrap; } .message-composer__footer small { flex-basis: 100%; order: 3; } .message-composer__footer .module-button { margin-left: auto; } }

/* Messaging polish: tighter composition, stronger focus states, predictable mobile flow. */
.message-workspace:has(.message-composer--new) { min-height: 570px; }
.message-workspace:has(.message-composer--new) .message-conversation { min-height: 570px; }
.message-page .module-button:focus-visible,
.message-page button:focus-visible,
.message-page input:focus-visible,
.message-page select:focus-visible,
.message-page textarea:focus-visible,
.message-page a:focus-visible {
  outline: 3px solid rgba(61, 150, 133, .25);
  outline-offset: 2px;
}
.message-recipient-results button:focus-visible { background: #eef8f5; outline-offset: -2px; }
.message-compose-switch button,
.message-icon-link,
.message-recipient-results button,
.message-filters button { transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease; }
.message-icon-link:hover { border-color: #a7d4ca; background: #e5f5f0; transform: translateY(-1px); }
.message-recipient-results { scrollbar-width: thin; scrollbar-color: #b9dcd4 transparent; }
.message-recipient-results::-webkit-scrollbar { width: 6px; }
.message-recipient-results::-webkit-scrollbar-thumb { border-radius: 99px; background: #b9dcd4; }
.message-composer--new .module-field { margin-bottom: 10px; }
.message-composer--new .module-field input,
.message-composer--new .module-field select { border-radius: 12px; padding: 11px 12px; }
.message-composer--new .module-grid { gap: 12px; }
.message-composer--new textarea { min-height: 84px; }
body[data-theme='dark'] .message-recipient-avatar { color: #b7f1df; background: #1d4b45; }
body[data-theme='dark'] .message-recipient-copy strong { color: #e7f7f3; }
body[data-theme='dark'] .message-recipient-copy small { color: #a7c4bd; }
body[data-theme='dark'] .message-recipient-copy em { color: #9aaead; }
@media (max-width: 800px) {
  .message-workspace:has(.message-composer--new),
  .message-workspace:has(.message-composer--new) .message-conversation { min-height: 540px; }
  .message-compose-empty { min-height: 210px; padding: 26px 18px; }
}
@media (max-width: 520px) {
  .message-composer--new { width: calc(100% - 20px); margin-bottom: 12px; }
  .message-composer--new .module-grid { grid-template-columns: 1fr; gap: 0; }
  .message-composer--new .module-field { margin-bottom: 8px; }
  .message-composer--new textarea { min-height: 96px; }
  .message-compose-switch { width: 100%; }
  .message-compose-switch button { flex: 1; }
  .message-mail-status { align-items: flex-start; }
  .message-mail-status a { margin-left: auto; white-space: nowrap; }
}

/* Phase 3: student surfaces keep dense data readable instead of squeezing columns. */
.homework-list-view {
  width: 100%;
  overflow-x: auto;
  border: 1px solid #e7eef0;
  border-radius: 12px;
  scrollbar-width: thin;
  scrollbar-color: #b9dcd4 transparent;
}
.homework-list-view .module-table {
  min-width: 1080px;
  margin: 0;
  table-layout: auto;
}
.homework-list-view .module-table th,
.homework-list-view .module-table td { padding: 12px 11px; }
.homework-list-view .module-table th { white-space: nowrap; }
.homework-list-view .module-table td:nth-child(3) { min-width: 150px; }
.homework-list-view .module-table td:nth-child(4) { min-width: 220px; max-width: 300px; }
.homework-list-view .module-table td:last-child { min-width: 220px; }
.homework-list-view::-webkit-scrollbar { height: 7px; }
.homework-list-view::-webkit-scrollbar-thumb { border-radius: 99px; background: #b9dcd4; }
.student-schedule-grid-scroll {
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #b9dcd4 transparent;
}
.student-schedule-grid-scroll::-webkit-scrollbar { height: 7px; }
.student-schedule-grid-scroll::-webkit-scrollbar-thumb { border-radius: 99px; background: #b9dcd4; }
.student-schedule-grid-scroll .schedule-grid-table { min-width: 760px; }
.attendance-selector-form .module-actions { align-self: end; }
.attendance-selector-form .module-actions .module-button { min-height: 48px; }
body[data-theme='dark'] .homework-list-view,
body[data-theme='dark'] .student-schedule-grid-scroll { border-color: #2c454b; }
body[data-theme='dark'] .homework-list-view::-webkit-scrollbar-thumb,
body[data-theme='dark'] .student-schedule-grid-scroll::-webkit-scrollbar-thumb { background: #47766d; }
body[data-theme='dark'] .module-header .module-actions label { color: #40545b; }
body[data-theme='dark'] .module-header .module-actions select { color: #263a40; background: #fff; border-color: #dbe8e6; }
body[data-theme='dark'] .homework-status-tabs,
body[data-theme='dark'] .homework-display-tabs { border-color: #2c454b; background: #16252b; }
body[data-theme='dark'] .homework-status-tabs a,
body[data-theme='dark'] .homework-display-tabs a { color: #a7c4bd; }
body[data-theme='dark'] .homework-status-tabs a:hover,
body[data-theme='dark'] .homework-status-tabs a.is-active,
body[data-theme='dark'] .homework-display-tabs a:hover,
body[data-theme='dark'] .homework-display-tabs a.is-active { border-color: #3c7567; color: #d8fff3; background: #21483f; }
@media (max-width: 700px) {
  .homework-list-view .module-table { min-width: 980px; }
  .homework-list-view .module-table th,
  .homework-list-view .module-table td { padding: 10px 9px; }
  .student-schedule-grid-scroll .schedule-grid-table { min-width: 700px; }
  .attendance-selector-form .module-actions { width: 100%; }
  .attendance-selector-form .module-actions .module-button { width: 100%; }
}

/* Phase 4: mobile-first cards for dense student data. */
@media (max-width: 700px) {
  .homework-list-view {
    overflow: visible;
    border: 0;
    border-radius: 0;
  }
  .homework-list-view .module-table {
    display: block;
    min-width: 0;
  }
  .homework-list-view .module-table thead { display: none; }
  .homework-list-view .module-table tbody,
  .homework-list-view .module-table tr,
  .homework-list-view .module-table td { display: block; width: auto; }
  .homework-list-view .module-table tr[id^='homework-'] {
    margin-bottom: 10px;
    padding: 9px 12px;
    border: 1px solid #e2ecea;
    border-radius: var(--panel-radius);
    background: #fff;
    box-shadow: 0 6px 16px rgba(30, 47, 66, .05);
  }
  .homework-list-view .module-table tr[id^='homework-']:hover td { background: transparent; }
  .homework-list-view .module-table tr[id^='homework-'] td {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    min-width: 0;
    max-width: none;
    padding: 8px 0;
    border-bottom: 1px solid #edf3f2;
  }
  .homework-list-view .module-table tr[id^='homework-'] td:last-child { border-bottom: 0; }
  .homework-list-view .module-table tr[id^='homework-'] td::before {
    color: #819096;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(1)::before { content: 'Ders'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(2)::before { content: 'Hedef'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(3)::before { content: 'Başlık'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(4)::before { content: 'Açıklama'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(5)::before { content: 'Verilme'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(6)::before { content: 'Teslim'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(7)::before { content: 'Kalan'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(8)::before { content: 'Dosya'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(9)::before { content: 'Veren'; }
  .homework-list-view .module-table tr[id^='homework-'] td:nth-child(10)::before { content: 'Gönderim'; }
  .homework-list-view .module-table tr.homework-submission-row {
    margin: -4px 0 12px;
    padding: 12px;
    border: 1px solid #dcebe7;
    border-radius: 12px;
    background: #f7fcfa;
  }
  .homework-list-view .module-table tr.homework-submission-row td { padding: 0; border: 0; }
  .homework-list-view .module-table tr.homework-submission-row td::before { display: none; }
  #student-schedule .schedule-grid-day-picker { display: block; }
  #student-schedule .schedule-grid-day-picker select { width: 100%; }
  #student-schedule .student-schedule-grid-scroll { overflow-x: hidden; }
  #student-schedule .schedule-grid-table { min-width: 0; }
  #student-schedule .schedule-grid-table th[data-routine-day],
  #student-schedule .schedule-grid-table td[data-routine-day] { min-width: 0; }
  body[data-theme='dark'] .homework-list-view .module-table tr[id^='homework-'] { border-color: #2c454b; background: #16252b; }
  body[data-theme='dark'] .homework-list-view .module-table tr[id^='homework-'] td { border-bottom-color: #2c454b; }
body[data-theme='dark'] .homework-list-view .module-table tr.homework-submission-row { border-color: #2c5a50; background: #17322e; }
}

/* Ödev listesi: tüm roller için aynı responsive kayıt grubu davranışı. */
.homework-list-view {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

.homework-list-view .module-table {
  min-width: 1080px;
}

.homework-list-view .homework-detail-row > td,
.homework-list-view .homework-results-row > td {
  min-width: 0;
}

@media (max-width: 700px) {
  .homework-list-view {
    overflow-x: visible;
  }

  .homework-list-view .module-table {
    min-width: 0;
  }

  .homework-list-view .module-table tr.homework-detail-row,
  .homework-list-view .module-table tr.homework-results-row {
    display: block;
    margin: -4px 0 10px;
    padding: 0 10px 10px;
    border: 1px solid #e6eaf3;
    border-top: 0;
    border-radius: 0 0 12px 12px;
    background: #fbfcff;
  }

  .homework-list-view .module-table tr.homework-detail-row > td,
  .homework-list-view .module-table tr.homework-results-row > td {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
  }

  .homework-list-view .homework-details__grid {
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 8px 0 2px;
  }

  .homework-list-view .homework-details summary {
    padding: 9px 0 7px;
  }

  .homework-list-view .homework-results {
    border: 0;
    background: transparent;
  }

  .homework-list-view .homework-results summary {
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 9px 0 7px;
  }

  .homework-list-view .homework-results summary strong {
    width: 100%;
    margin-left: 24px;
  }

  .homework-list-view .homework-results-table-wrap {
    margin-top: 4px;
    border: 1px solid #e7edf2;
    border-radius: 10px;
  }

  .homework-list-view .homework-result-form {
    grid-template-columns: 1fr;
    gap: 7px;
  }
}

@media (max-width: 420px) {
  .homework-list-view .module-table tr[id^='homework-'] {
    padding-right: 10px;
    padding-left: 10px;
  }

  .homework-list-view .module-table tr[id^='homework-'] td {
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 7px;
    font-size: 12px;
  }

  .homework-list-view .module-table tr[id^='homework-'] td::before {
    font-size: 8px;
  }
}

/* Program yönetimi: modern admin tema katmanı. */
.schedule-management-page {
  padding-top: 26px;
  padding-bottom: 56px;
}

.schedule-management-page .admin-hero {
  position: relative;
  overflow: hidden;
  margin-bottom: 16px;
  padding: 26px 30px;
  border: 1px solid rgba(42, 141, 130, .18);
  border-radius: 22px;
  background: linear-gradient(120deg, #eef9f7 0%, #f8fbff 58%, #f4efff 100%);
  box-shadow: 0 14px 34px rgba(31, 61, 74, .08);
}

.schedule-management-page .admin-hero::after {
  position: absolute;
  right: -70px;
  bottom: -100px;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  background: rgba(124, 77, 232, .08);
  content: '';
}

.schedule-management-page .admin-hero h2,
.schedule-management-page .admin-hero p,
.schedule-management-page .admin-hero .admin-kicker { position: relative; z-index: 1; }
.schedule-management-page .admin-hero .admin-kicker { color: #168377; }
.schedule-management-page .admin-hero h2 { margin: 5px 0 8px; color: #1d2c3c; font-size: clamp(23px, 2.5vw, 32px); letter-spacing: -.03em; }
.schedule-management-page .admin-hero p { max-width: 720px; margin: 0; color: #60758b; }

.schedule-management-page .admin-section-tabs {
  display: flex;
  gap: 8px;
  margin: 0 0 18px;
  padding: 6px;
  overflow-x: auto;
  border: 1px solid #dce9e9;
  border-radius: 15px;
  background: rgba(255, 255, 255, .82);
  scrollbar-width: thin;
}
.schedule-management-page .admin-section-tabs a {
  flex: 0 0 auto;
  padding: 9px 13px;
  border-radius: 10px;
  color: #61758b;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.schedule-management-page .admin-section-tabs a:hover,
.schedule-management-page .admin-section-tabs a:focus-visible { color: #137d72; background: #eaf7f4; }

.schedule-management-page .schedule-day-summary {
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid #dce9e9;
  border-radius: 18px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 9px 22px rgba(31, 61, 74, .05);
}
.schedule-management-page .schedule-day-summary__header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.schedule-management-page .schedule-day-summary__header .admin-kicker { color: #168377; font-size: 10px; }
.schedule-management-page .schedule-day-summary__header h3 { margin: 3px 0 0; color: #1d2c3c; font-size: 17px; letter-spacing: -.02em; }
.schedule-management-page .schedule-day-summary__header > span { color: #6c8190; font-size: 11px; font-weight: 800; }
.schedule-management-page .schedule-day-summary__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.schedule-management-page .schedule-day-summary__item { display: grid; gap: 4px; min-width: 0; padding: 12px; border: 1px solid #e0ebed; border-radius: 12px; background: #f8fbfc; color: #5e7585; text-decoration: none; transition: 160ms ease; }
.schedule-management-page .schedule-day-summary__item:hover,
.schedule-management-page .schedule-day-summary__item:focus-visible { border-color: #8bcfc3; background: #eaf7f4; color: #16796e; transform: translateY(-1px); }
.schedule-management-page .schedule-day-summary__item strong { color: #1d2c3c; font-size: 21px; line-height: 1; }
.schedule-management-page .schedule-day-summary__item span { overflow: hidden; font-size: 10px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }

.schedule-management-page .admin-card {
  margin-bottom: 18px !important;
  padding: 22px;
  border: 1px solid #dce8eb;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(31, 61, 74, .065);
}
.schedule-management-page .admin-section-card { scroll-margin-top: 20px; }
.schedule-management-page .admin-card__header { gap: 16px; margin-bottom: 16px; }
.schedule-management-page .admin-card__title { color: #1d2c3c; font-size: 19px; letter-spacing: -.02em; }
.schedule-management-page .admin-card__text { color: #718399; line-height: 1.55; }
.schedule-management-page .admin-label { color: #4b6177; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.schedule-management-page .admin-form-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 15px; align-items: end; }
.schedule-management-page .admin-form-grid > div { min-width: 0; }
.schedule-management-page .schedule-choice { position: relative; }
.schedule-management-page .schedule-choice[hidden] { display: none; }
.schedule-management-page .schedule-choice__hint { display: block; margin-top: 6px; color: #78909d; font-size: 10px; line-height: 1.35; }
.schedule-management-page .schedule-choice__option { display: grid; gap: 3px; }
.schedule-management-page .schedule-choice__option strong { color: #263746; font-size: 12px; }
.schedule-management-page .schedule-choice__option small { color: #718596; font-size: 10px; }
.schedule-management-page .form-control,
.schedule-management-page .admin-form-grid select,
.schedule-management-page .admin-form-grid input,
.schedule-management-page .admin-form-grid textarea {
  min-height: 44px;
  border: 1px solid #d6e3e7;
  border-radius: 12px;
  background: #f8fbfc;
  color: #263746;
  box-shadow: none;
}
.schedule-management-page .form-control:focus,
.schedule-management-page .admin-form-grid select:focus,
.schedule-management-page .admin-form-grid input:focus,
.schedule-management-page .admin-form-grid textarea:focus { border-color: #279689; box-shadow: 0 0 0 3px rgba(39, 150, 137, .12); outline: 0; }
.schedule-management-page .admin-button { min-height: 42px; border-radius: 11px; box-shadow: 0 7px 16px rgba(117, 72, 225, .16); }
.schedule-management-page .admin-button--secondary { display: inline-flex; align-items: center; margin-left: 8px; background: #eaf7f4; color: #187a70; box-shadow: none; }
.schedule-management-page .admin-chip { border-radius: 999px; }
.schedule-management-page .admin-review-card { border-left: 4px solid #d89b32; }
.schedule-management-page .schedule-records-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 180px auto;
  gap: 12px;
  align-items: end;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid #e0ebed;
  border-radius: 14px;
  background: #f7fbfb;
}
.schedule-management-page .schedule-records-toolbar label { display: grid; gap: 6px; min-width: 0; }
.schedule-management-page .schedule-records-toolbar label span { color: #61798a; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.schedule-management-page .schedule-records-toolbar input,
.schedule-management-page .schedule-records-toolbar select { width: 100%; min-height: 40px; padding: 0 12px; border: 1px solid #d6e3e7; border-radius: 10px; background: #fff; color: #263746; }
.schedule-management-page .schedule-records-count { align-self: center; color: #16796e; font-size: 12px; font-weight: 800; white-space: nowrap; }
.schedule-management-page .schedule-record-empty { margin-top: 12px; }
.schedule-management-page .schedule-conflicts-card { border-top: 4px solid #d97957; }
.schedule-management-page .schedule-conflict-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin: 0 0 14px; }
.schedule-management-page .schedule-conflict-summary__item { display: grid; gap: 4px; min-width: 0; padding: 12px; border: 1px solid #e0ebed; border-radius: 12px; background: #f8fbfc; color: #647b89; text-align: left; cursor: pointer; transition: 160ms ease; }
.schedule-management-page .schedule-conflict-summary__item:hover,
.schedule-management-page .schedule-conflict-summary__item.is-active { border-color: #e2a080; background: #fff4ee; color: #ad563b; }
.schedule-management-page .schedule-conflict-summary__item strong { color: #243746; font-size: 20px; line-height: 1; }
.schedule-management-page .schedule-conflict-summary__item span { font-size: 10px; font-weight: 800; }
.schedule-management-page .schedule-conflicts-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 12px; align-items: end; margin: 0 0 12px; padding: 12px; border: 1px solid #e4edef; border-radius: 12px; background: #fbfdfd; }
.schedule-management-page .schedule-conflicts-toolbar label { display: grid; gap: 6px; }
.schedule-management-page .schedule-conflicts-toolbar label span { color: #61798a; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.schedule-management-page .schedule-conflicts-toolbar input { width: 100%; min-height: 40px; padding: 0 12px; border: 1px solid #d6e3e7; border-radius: 10px; background: #fff; color: #263746; }
.schedule-management-page .schedule-conflict-link { color: #18796d; font-weight: 700; text-decoration: none; }
.schedule-management-page .schedule-conflict-link:hover,
.schedule-management-page .schedule-conflict-link:focus-visible { color: #a94f35; text-decoration: underline; }
.schedule-management-page .schedule-conflict-link--record { display: block; margin: 2px 0; }
.schedule-management-page .schedule-conflicts-table small { color: #78909d; font-size: 10px; }
.schedule-management-page [data-schedule-conflict][hidden] { display: none; }
.schedule-management-page .schedule-conflict-badge { display: inline-flex; padding: 5px 8px; border-radius: 999px; background: #fff0e9; color: #b55235; font-size: 10px; font-weight: 800; white-space: nowrap; }
.schedule-management-page .schedule-conflicts-success { border-color: #bfe7d9; background: #effaf6; color: #18796d; }
.schedule-management-page .schedule-conflicts-note { margin: 12px 0 0; }

.schedule-management-page .admin-table-wrap,
.schedule-management-page .teacher-routine-scroll {
  overflow: auto;
  max-height: 650px;
  border: 1px solid #dce8eb;
  border-radius: 15px;
  background: #fbfdfe;
}
.schedule-management-page .admin-table,
.schedule-management-page .teacher-routine-table { min-width: 760px; }
.schedule-management-page .admin-table thead th,
.schedule-management-page .teacher-routine-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #edf6f6;
  color: #5e7585;
  box-shadow: 0 1px 0 #dce8eb;
}
.schedule-management-page .teacher-routine-table .teacher-routine-time { left: 0; z-index: 4; background: #f7fbfc; }
.schedule-management-page .teacher-routine-table td { vertical-align: top; }
.schedule-management-page .teacher-routine-card { border-radius: 12px; box-shadow: 0 5px 12px rgba(31, 61, 74, .06); }
.schedule-management-page .schedule-routine-toolbar { display: grid; grid-template-columns: auto minmax(220px, 1fr) auto; gap: 10px; align-items: center; margin: 0 0 12px; }
.schedule-management-page .schedule-routine-toolbar label { color: #61798a; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.schedule-management-page .schedule-routine-toolbar input { min-height: 40px; width: 100%; padding: 0 12px; border: 1px solid #d6e3e7; border-radius: 10px; background: #f8fbfc; color: #263746; }
.schedule-management-page .schedule-routine-toolbar span { color: #16796e; font-size: 12px; font-weight: 800; white-space: nowrap; }

@media (max-width: 700px) {
  .schedule-management-page { padding-top: 14px; }
  .schedule-management-page .admin-hero { padding: 21px 18px; border-radius: 17px; }
  .schedule-management-page .admin-card { padding: 16px; border-radius: 16px; }
  .schedule-management-page .admin-card__header { align-items: flex-start; flex-direction: column; }
  .schedule-management-page .admin-form-grid { grid-template-columns: 1fr; }
  .schedule-management-page .schedule-day-summary__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .schedule-management-page .schedule-day-summary__header { align-items: flex-start; flex-direction: column; }
  .schedule-management-page .schedule-routine-toolbar { grid-template-columns: 1fr; align-items: stretch; }
  .schedule-management-page .schedule-routine-toolbar span { justify-self: start; }
  .schedule-management-page .admin-form-grid .admin-button { width: 100%; }
  .schedule-management-page .admin-button--secondary { display: flex; margin: 8px 0 0; justify-content: center; }
  .schedule-management-page .schedule-records-toolbar { grid-template-columns: 1fr; align-items: stretch; }
  .schedule-management-page .schedule-conflict-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .schedule-management-page .schedule-conflicts-toolbar { grid-template-columns: 1fr; align-items: stretch; }
  .schedule-management-page .schedule-records-count { justify-self: start; }
  .schedule-management-page .admin-table-wrap,
  .schedule-management-page .teacher-routine-scroll { max-height: 540px; }
  .schedule-management-page .admin-table,
  .schedule-management-page .teacher-routine-table { min-width: 700px; }
}

body[data-theme='dark'] .schedule-management-page .admin-section-tabs,
body[data-theme='dark'] .schedule-management-page .admin-card { border-color: #29434a; background: #15252b; }
body[data-theme='dark'] .schedule-management-page .admin-hero { border-color: #285b57; background: linear-gradient(120deg, #173732, #182c38 58%, #28203b); }
body[data-theme='dark'] .schedule-management-page .admin-hero h2 { color: #edf7f8; }
body[data-theme='dark'] .schedule-management-page .admin-hero .admin-kicker { color: #7ed9ca; }
body[data-theme='dark'] .schedule-management-page .schedule-day-summary { border-color: #29434a; background: #15252b; }
body[data-theme='dark'] .schedule-management-page .schedule-day-summary__header h3,
body[data-theme='dark'] .schedule-management-page .schedule-day-summary__item strong { color: #e1edf0; }
body[data-theme='dark'] .schedule-management-page .schedule-day-summary__header > span,
body[data-theme='dark'] .schedule-management-page .schedule-day-summary__item { color: #9db4bc; }
body[data-theme='dark'] .schedule-management-page .schedule-day-summary__item { border-color: #31515a; background: #102025; }
body[data-theme='dark'] .schedule-management-page .schedule-routine-toolbar input { border-color: #31515a; background: #102025; color: #e3eef0; }
body[data-theme='dark'] .schedule-management-page .admin-card__title,
body[data-theme='dark'] .schedule-management-page .admin-label { color: #e1edf0; }
body[data-theme='dark'] .schedule-management-page .admin-card__text,
body[data-theme='dark'] .schedule-management-page .admin-hero p,
body[data-theme='dark'] .schedule-management-page .admin-section-tabs a { color: #9db4bc; }
body[data-theme='dark'] .schedule-management-page .form-control,
body[data-theme='dark'] .schedule-management-page .admin-form-grid select,
body[data-theme='dark'] .schedule-management-page .admin-form-grid input,
body[data-theme='dark'] .schedule-management-page .admin-form-grid textarea { border-color: #31515a; background: #102025; color: #e3eef0; }
body[data-theme='dark'] .schedule-management-page .schedule-choice__hint,
body[data-theme='dark'] .schedule-management-page .schedule-choice__option small { color: #9db4bc; }
body[data-theme='dark'] .schedule-management-page .schedule-choice__option strong { color: #e3eef0; }
body[data-theme='dark'] .schedule-management-page .admin-table-wrap,
body[data-theme='dark'] .schedule-management-page .teacher-routine-scroll { border-color: #29434a; background: #102025; }
body[data-theme='dark'] .schedule-management-page .admin-table thead th,
body[data-theme='dark'] .schedule-management-page .teacher-routine-table thead th { background: #1b343b; }
body[data-theme='dark'] .schedule-management-page .schedule-records-toolbar { border-color: #29434a; background: #102025; }
body[data-theme='dark'] .schedule-management-page .schedule-records-toolbar input,
body[data-theme='dark'] .schedule-management-page .schedule-records-toolbar select { border-color: #31515a; background: #15252b; color: #e3eef0; }
body[data-theme='dark'] .schedule-management-page .schedule-conflicts-card { border-top-color: #e39a78; }
body[data-theme='dark'] .schedule-management-page .schedule-conflict-badge { background: #3a2925; color: #f1b29b; }
body[data-theme='dark'] .schedule-management-page .schedule-conflict-summary__item,
body[data-theme='dark'] .schedule-management-page .schedule-conflicts-toolbar { border-color: #29434a; background: #102025; color: #9db4bc; }
body[data-theme='dark'] .schedule-management-page .schedule-conflict-summary__item:hover,
body[data-theme='dark'] .schedule-management-page .schedule-conflict-summary__item.is-active { border-color: #87513f; background: #332622; color: #f1b29b; }
body[data-theme='dark'] .schedule-management-page .schedule-conflict-summary__item strong { color: #e3eef0; }
body[data-theme='dark'] .schedule-management-page .schedule-conflicts-toolbar input { border-color: #31515a; background: #15252b; color: #e3eef0; }
body[data-theme='dark'] .schedule-management-page .schedule-conflict-link { color: #86d8c3; }
body[data-theme='dark'] .schedule-management-page .schedule-conflicts-success { border-color: #2c5a50; background: #17322e; color: #86d8c3; }

/* Public authentication screens: calm two-column welcome and secure form. */
.login-shell {
  position: relative;
  min-height: 100vh;
  padding: 84px 24px 38px;
  background:
    radial-gradient(circle at 12% 18%, rgba(102, 191, 174, .18), transparent 32%),
    radial-gradient(circle at 88% 82%, rgba(93, 128, 225, .14), transparent 34%),
    #f4f8f8;
}

.auth-layout {
  display: grid;
  grid-template-columns: minmax(280px, .86fr) minmax(420px, 520px);
  align-items: center;
  gap: clamp(28px, 6vw, 86px);
  width: min(100%, 1050px);
  margin: 0 auto;
}

.auth-showcase {
  max-width: 470px;
  padding: 28px 0;
  color: #18333a;
}

.auth-showcase__eyebrow {
  display: inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  background: #d9f3ed;
  color: #16796e;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.auth-showcase h1 {
  margin: 22px 0 14px;
  color: #173039;
  font-size: clamp(34px, 4.6vw, 58px);
  line-height: 1.02;
  letter-spacing: -.055em;
}

.auth-showcase h1 span { color: #197d72; }

.auth-showcase > p {
  max-width: 420px;
  margin: 0;
  color: #657d83;
  font-size: 15px;
  line-height: 1.65;
}

.auth-showcase__points {
  display: grid;
  gap: 10px;
  margin-top: 30px;
}

.auth-showcase__points span {
  display: flex;
  align-items: center;
  gap: 11px;
  color: #45636a;
  font-size: 12px;
  font-weight: 700;
}

.auth-showcase__points strong {
  display: inline-grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border: 1px solid #bfe5dd;
  border-radius: 9px;
  background: #effaf7;
  color: #16796e;
  font-size: 10px;
}

.auth-showcase--register .auth-showcase__eyebrow {
  background: #fff0e7;
  color: #ad5b3d;
}

.auth-showcase--register h1 span { color: #c26c4d; }

.auth-showcase--register .auth-showcase__points strong {
  border-color: #f0cdbd;
  background: #fff7f2;
  color: #ad5b3d;
}

.auth-layout .login-card {
  width: 100%;
  padding: 36px;
  border: 1px solid rgba(181, 207, 208, .68);
  border-radius: 26px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 24px 70px rgba(41, 82, 89, .13);
  backdrop-filter: blur(12px);
}

.auth-layout .login-card > img {
  display: block;
  width: 52px !important;
  height: 52px !important;
  margin-top: 12px !important;
  padding: 5px;
  border: 1px solid #dcebea;
  border-radius: 15px !important;
  object-fit: contain !important;
  background: #fff;
}

.auth-layout .login-card h2 {
  margin-top: 18px;
  font-size: 32px;
  letter-spacing: -.04em;
}

.auth-layout .login-subtitle {
  max-width: 390px;
  margin-bottom: 24px;
  line-height: 1.55;
}

.auth-layout .login-form .mb-3 { margin-bottom: 16px !important; }

.auth-layout .login-form .form-label {
  margin-bottom: 7px;
  color: #304b53;
  font-size: 12px;
}

.auth-layout .login-form .form-control,
.auth-layout .login-form .form-select {
  min-height: 48px;
  border: 1px solid #d3e2e2;
  border-radius: 13px;
  background: #fbfdfd;
  color: #20383f;
  box-shadow: none;
}

.auth-layout .login-form textarea.form-control { min-height: 90px; }

.auth-layout .login-form .form-control:focus,
.auth-layout .login-form .form-select:focus {
  border-color: #64b9ac;
  box-shadow: 0 0 0 4px rgba(100, 185, 172, .14);
}

.auth-layout .login-submit {
  min-height: 49px;
  border-radius: 13px;
  background: linear-gradient(135deg, #147e73 0%, #176b86 100%);
}

.auth-layout .login-links {
  flex-wrap: wrap;
  row-gap: 8px;
  margin-top: 20px;
}

.auth-layout .login-links a { font-size: 12px; }

.auth-layout .text-muted,
.auth-layout #identity-suggestion {
  display: block;
  margin-top: 6px;
  color: #789096 !important;
  font-size: 11px;
  line-height: 1.45;
}

body[data-theme='dark'] .login-shell {
  background: radial-gradient(circle at 12% 18%, rgba(46, 120, 106, .22), transparent 32%), #0e1a1e;
}

body[data-theme='dark'] .auth-showcase h1,
body[data-theme='dark'] .auth-showcase { color: #e4f0ee; }
body[data-theme='dark'] .auth-showcase > p,
body[data-theme='dark'] .auth-showcase__points span { color: #a5c0c0; }
body[data-theme='dark'] .auth-layout .login-card { background: rgba(16, 29, 33, .94); border-color: rgba(135, 194, 181, .2); }
body[data-theme='dark'] .auth-layout .login-form .form-label { color: #c9dedd; }
body[data-theme='dark'] .auth-layout .login-form .form-control,
body[data-theme='dark'] .auth-layout .login-form .form-select { background: #122328; border-color: #31515a; color: #e6f1ef; }

@media (max-width: 820px) {
  .login-shell { padding: 78px 16px 24px; }
  .auth-layout { grid-template-columns: 1fr; gap: 12px; width: min(100%, 560px); }
  .auth-showcase { padding: 8px 8px 16px; }
  .auth-showcase h1 { margin-top: 15px; font-size: clamp(32px, 9vw, 46px); }
  .auth-showcase > p { font-size: 13px; }
  .auth-showcase__points { grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 18px; }
  .auth-showcase__points span { align-items: flex-start; flex-direction: column; gap: 5px; font-size: 10px; }
  .auth-layout .login-card { padding: 26px 22px; }
}

@media (max-width: 480px) {
  .auth-floating-tools { top: 10px; right: 10px; }
  .auth-tool-button { min-height: 38px; padding: 0 12px; font-size: 11px; }
  .auth-showcase { padding-right: 0; padding-left: 0; }
  .auth-showcase__points { grid-template-columns: 1fr; }
  .auth-showcase__points span { align-items: center; flex-direction: row; }
  .auth-layout .login-card { padding: 24px 18px; border-radius: 20px; }
}

/* Guardian registration follows the supplied public mockup. */
.guardian-shell {
  padding: 84px 24px 34px;
  background:
    radial-gradient(circle at 10% 10%, rgba(37, 169, 158, .10), transparent 30%),
    radial-gradient(circle at 92% 88%, rgba(61, 118, 180, .10), transparent 32%),
    linear-gradient(145deg, #f3f8f7, #eaf5f3);
}
.guardian-shell .auth-layout {
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
  gap: 42px;
  width: min(1050px, 100%);
}
.guardian-shell .auth-showcase { max-width: 580px; padding: 28px 18px; }
.guardian-shell .auth-showcase h1 { font-size: clamp(42px, 5vw, 68px); line-height: .96; }
.guardian-shell .auth-showcase--register .auth-showcase__eyebrow { background: #e0f4f1; color: #0d817a; }
.guardian-shell .auth-showcase--register h1 span { color: #0d817a; }
.guardian-shell .auth-showcase--register .auth-showcase__points strong { border-color: #c1e7e2; background: #f1fbf9; color: #0d817a; }
.guardian-shell .auth-layout .login-card { padding: 30px; border-radius: 26px; box-shadow: 0 28px 80px rgba(19, 52, 58, .12); }
.guardian-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.guardian-logo { display: grid; width: 44px; height: 44px; place-items: center; flex: 0 0 auto; border-radius: 14px; background: linear-gradient(135deg, #0d817a, #116f86); box-shadow: 0 10px 22px rgba(13, 129, 122, .18); }
.guardian-logo img { width: 28px !important; height: 28px !important; margin: 0 !important; padding: 3px; border: 0 !important; border-radius: 8px !important; object-fit: contain !important; background: #fff; }
.guardian-card-head strong, .guardian-card-head small { display: block; }
.guardian-card-head strong { color: #17343a; font-size: 14px; line-height: 1.1; }
.guardian-card-head small { margin-top: 4px; color: #6d8186; font-size: 12px; }
.guardian-theme-button { min-width: 44px; padding: 0 13px; font-size: 17px; }
.guardian-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 5px; margin: 24px 0; border: 1px solid #dbe8e6; border-radius: 14px; background: #eaf5f3; }
.guardian-tabs > * { display: flex; align-items: center; justify-content: center; min-height: 39px; border-radius: 10px; color: #6d8186; font-size: 12px; font-weight: 800; text-decoration: none; }
.guardian-tabs .is-active { background: #fff; color: #17343a; box-shadow: 0 4px 14px rgba(20, 61, 65, .08); }
body[data-theme='dark'] .guardian-shell { background: radial-gradient(circle at 10% 10%, rgba(67, 191, 182, .14), transparent 30%), linear-gradient(145deg, #0c1719, #112225); }
body[data-theme='dark'] .guardian-tabs { background: #112225; border-color: #294044; }
body[data-theme='dark'] .guardian-tabs .is-active { background: #122225; color: #eef8f7; }
body[data-theme='dark'] .guardian-card-head strong { color: #eef8f7; }
body[data-theme='dark'] .guardian-card-head small { color: #9db1b5; }
@media (max-width: 860px) {
  .guardian-shell .auth-layout { grid-template-columns: 1fr; gap: 18px; max-width: 520px; }
  .guardian-shell .auth-showcase { display: none; }
}
@media (max-width: 520px) {
  .guardian-home-text { display: none; }
}

/* Direct shell from the supplied mockup, with the existing guardian workflow inside. */
.guardian-mockup {
  --mock-bg: #f3f8f7;
  --mock-bg-2: #eaf5f3;
  --mock-surface: rgba(255,255,255,.92);
  --mock-text: #17343a;
  --mock-muted: #6d8186;
  --mock-line: #dbe8e6;
  --mock-primary: #0d817a;
  --mock-primary-2: #116f86;
  --mock-soft: #e0f4f1;
  min-height: 100vh;
  margin: 0;
  color: var(--mock-text);
  background: radial-gradient(circle at 10% 10%, rgba(37,169,158,.10), transparent 30%), radial-gradient(circle at 92% 88%, rgba(61,118,180,.10), transparent 32%), linear-gradient(145deg, var(--mock-bg), var(--mock-bg-2));
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.guardian-mockup .topbar { position: fixed; inset: 18px 22px auto 22px; display: flex; justify-content: space-between; align-items: center; z-index: 10; pointer-events: none; }
.guardian-mockup .topbar .actions { display: flex; gap: 10px; pointer-events: auto; }
.guardian-mockup .ghost { height: 42px; border: 1px solid var(--mock-line); background: var(--mock-surface); color: var(--mock-text); border-radius: 14px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 8px 24px rgba(16,58,62,.06); backdrop-filter: blur(12px); font-weight: 700; }
.guardian-mockup .page { min-height: 100vh; display: grid; place-items: center; padding: 84px 24px 34px; }
.guardian-mockup .shell { width: min(1050px, 100%); display: grid; grid-template-columns: minmax(0,.9fr) minmax(420px,1.1fr); gap: 42px; align-items: center; }
.guardian-mockup .brand { padding: 28px 18px; }
.guardian-mockup .eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; background: var(--mock-soft); color: var(--mock-primary); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.guardian-mockup .brand h1 { margin: 18px 0 14px; max-width: 580px; color: var(--mock-text); font-size: clamp(42px,5vw,68px); line-height: .96; letter-spacing: -.055em; font-weight: 780; }
.guardian-mockup .brand h1 span { color: var(--mock-primary); }
.guardian-mockup .brand p { max-width: 520px; margin: 0; color: var(--mock-muted); font-size: 16px; line-height: 1.65; }
.guardian-mockup .trust { display: grid; gap: 10px; margin-top: 28px; }
.guardian-mockup .trust span { display: flex; align-items: center; gap: 10px; color: var(--mock-text); font-size: 14px; font-weight: 650; }
.guardian-mockup .trust strong { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--mock-line); border-radius: 9px; background: #fff; color: var(--mock-primary); font-weight: 900; }
.guardian-mockup .card { width: 100%; padding: 30px; border: 1px solid var(--mock-line); border-radius: 26px; background: var(--mock-surface); box-shadow: 0 28px 80px rgba(19,52,58,.12); backdrop-filter: blur(18px); }
.guardian-mockup .card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.guardian-mockup .logo { width: 44px; height: 44px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 14px; background: linear-gradient(135deg,var(--mock-primary),var(--mock-primary-2)); box-shadow: 0 10px 22px rgba(13,129,122,.18); color: #fff; }
.guardian-mockup .logo img { width: 28px !important; height: 28px !important; margin: 0 !important; padding: 3px; border: 0 !important; border-radius: 8px !important; object-fit: contain !important; background: #fff; }
.guardian-mockup .school-name { color: var(--mock-text); font-size: 14px; font-weight: 800; line-height: 1.1; }
.guardian-mockup .school-sub { margin-top: 4px; color: var(--mock-muted); font-size: 12px; }
.guardian-mockup .tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 5px; margin-bottom: 24px; border: 1px solid var(--mock-line); border-radius: 14px; background: var(--mock-bg-2); }
.guardian-mockup .tab { display: flex; align-items: center; justify-content: center; min-height: 39px; border: 0; border-radius: 10px; padding: 10px 12px; background: transparent; color: var(--mock-muted); font-weight: 750; text-decoration: none; }
.guardian-mockup .tab.active { background: #fff; color: var(--mock-text); box-shadow: 0 4px 14px rgba(20,61,65,.08); }
.guardian-mockup .auth-step-title { color: var(--mock-text); font-size: 30px; }
.guardian-mockup .auth-step-subtitle { color: var(--mock-muted); font-size: 14px; }
.guardian-mockup .mb-3 { display: block; margin-bottom: 14px !important; }
.guardian-mockup .form-label { display: block; margin: 0 0 7px; color: var(--mock-text); font-size: 12px; font-weight: 780; }
.guardian-mockup .login-form .form-control, .guardian-mockup .login-form .form-select { min-height: 50px; border: 1px solid var(--mock-line); border-radius: 13px; background: rgba(255,255,255,.56); color: var(--mock-text); }
.guardian-mockup .login-form .form-control, .guardian-mockup .login-form .form-select { display: block; width: 100%; padding: 0 14px; }
.guardian-mockup .login-form .form-control:focus, .guardian-mockup .login-form .form-select:focus { border-color: var(--mock-primary); box-shadow: 0 0 0 4px rgba(13,129,122,.11); }
.guardian-mockup .login-submit { min-height: 50px; border-radius: 14px; background: linear-gradient(135deg,var(--mock-primary),var(--mock-primary-2)); box-shadow: 0 14px 26px rgba(13,129,122,.18); }
.guardian-mockup .auth-progress { gap: 8px; margin-bottom: 20px; }
.guardian-mockup .auth-progress span { height: 7px; background: var(--mock-line); }
.guardian-mockup .auth-progress span.is-active { background: var(--mock-primary); }
@media (max-width: 860px) {
  .guardian-mockup .page { padding: 72px 16px 24px; }
  .guardian-mockup .shell { grid-template-columns: 1fr; max-width: 520px; gap: 18px; }
  .guardian-mockup .brand { display: none; }
  .guardian-mockup .card { padding: 24px; }
  .guardian-mockup .topbar { inset: 12px 12px auto 12px; }
}
@media (max-width: 520px) {
  .guardian-mockup .card { padding: 20px; border-radius: 20px; }
  .guardian-mockup .topbar .home-text { display: none; }
  .guardian-mockup .auth-two-col { grid-template-columns: 1fr; }
}
body[data-theme='dark'].guardian-mockup { --mock-bg: #0c1719; --mock-bg-2: #112225; --mock-surface: rgba(18,34,37,.90); --mock-text: #eef8f7; --mock-muted: #9db1b5; --mock-line: #294044; --mock-primary: #43bfb6; --mock-primary-2: #4ba9c0; --mock-soft: #173937; }
body[data-theme='dark'].guardian-mockup .card, body[data-theme='dark'].guardian-mockup .guardian-mockup .card { background: var(--mock-surface); }
body[data-theme='dark'].guardian-mockup .tab.active { background: #122225; color: var(--mock-text); }
body[data-theme='dark'].guardian-mockup .login-form .form-control, body[data-theme='dark'].guardian-mockup .login-form .form-select { background: rgba(255,255,255,.03); color: var(--mock-text); }

/* Mockup-aligned public auth controls. */
.auth-form-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: -2px 0 17px;
  color: #71878b;
  font-size: 12px;
}
.auth-form-meta label { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.auth-form-meta input { width: 15px; height: 15px; accent-color: #167e73; }
.auth-input-wrap { position: relative; }
.auth-input-wrap .form-control { padding-right: 48px; }
.auth-password-toggle {
  position: absolute; top: 50%; right: 7px; width: 36px; height: 36px;
  transform: translateY(-50%); border: 0; border-radius: 10px; background: transparent;
  color: #71878b; cursor: pointer;
}
.auth-password-toggle:hover { background: #edf6f4; color: #167e73; }
.auth-divider { display: flex; align-items: center; gap: 11px; margin: 16px 0 12px; color: #8b9ca0; font-size: 11px; }
.auth-divider::before, .auth-divider::after { content: ''; height: 1px; flex: 1; background: #dce9e7; }
.auth-divider span { white-space: nowrap; }
.auth-note { padding: 11px 12px; border: 1px solid #d7ebe7; border-radius: 12px; background: #eff9f6; color: #456b6a; font-size: 11px; line-height: 1.5; }
.auth-register-form { position: relative; }
.auth-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-bottom: 7px; }
.auth-progress span { height: 6px; border-radius: 999px; background: #dce8e6; transition: background .2s ease; }
.auth-progress span.is-active { background: #167e73; }
.auth-step-labels { display: flex; justify-content: space-between; margin-bottom: 22px; color: #84979a; font-size: 10px; }
.auth-step-title { margin: 0 0 6px; color: #17343a; font-size: 28px; letter-spacing: -.04em; }
.auth-step-subtitle { margin: 0 0 20px; color: #71878b; font-size: 13px; line-height: 1.55; }
.auth-role-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 14px; }
.auth-role-card { min-height: 108px; padding: 13px; border: 1px solid #d9e7e5; border-radius: 14px; background: #fff; color: #17343a; text-align: left; transition: .2s ease; }
.auth-role-card:hover, .auth-role-card.is-selected { border-color: #2b9c8d; box-shadow: 0 0 0 3px rgba(43,156,141,.11); background: #eff9f6; transform: translateY(-1px); }
.auth-role-card span { font-size: 20px; }
.auth-role-card strong, .auth-role-card small { display: block; }
.auth-role-card strong { margin-top: 7px; font-size: 13px; }
.auth-role-card small { margin-top: 3px; color: #74898d; font-size: 10px; line-height: 1.35; }
.auth-register-step .auth-note { margin: 0 0 16px; }
.auth-next { width: 100%; margin-top: 2px; }
.auth-step-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; }
.auth-step-actions .login-submit { width: auto; min-width: 145px; padding: 0 20px; }
.auth-secondary { min-height: 46px; padding: 0 16px; border: 1px solid #d9e7e5; border-radius: 13px; background: #f2f8f7; color: #28756e; font-size: 12px; font-weight: 800; }
.auth-optional { color: #829396; font-weight: 500; }
.auth-consent { display: flex; align-items: flex-start; gap: 9px; margin-top: 10px; color: #667e82; font-size: 11px; line-height: 1.5; }
.auth-consent input { width: 16px; height: 16px; flex: 0 0 auto; margin-top: 1px; accent-color: #167e73; }
.auth-consent a { color: #167e73; font-weight: 800; }
.auth-two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.auth-layout #identity-suggestion.is-match { color: #167e73 !important; }
body[data-theme='dark'] .auth-step-title { color: #e4f0ee; }
body[data-theme='dark'] .auth-role-card { background: #122328; border-color: #31515a; color: #e6f1ef; }
body[data-theme='dark'] .auth-role-card:hover, body[data-theme='dark'] .auth-role-card.is-selected { background: #173937; border-color: #43bfb6; }
body[data-theme='dark'] .auth-note, body[data-theme='dark'] .auth-secondary { background: #17322e; border-color: #2d5953; color: #b9dbd2; }
body[data-theme='dark'] .auth-divider::before, body[data-theme='dark'] .auth-divider::after { background: #294044; }
@media (max-width: 480px) {
  .auth-role-grid { grid-template-columns: 1fr; }
  .auth-two-col { grid-template-columns: 1fr; gap: 0; }
  .auth-form-meta { font-size: 11px; }
  .auth-step-actions { align-items: stretch; flex-direction: column-reverse; }
  .auth-step-actions .login-submit, .auth-secondary { width: 100%; }
}

/* Public KVKK notice page. */
.legal-page { min-height: 100vh; padding: 44px 20px; background: linear-gradient(145deg, #f3f8f7, #eaf5f3); }
.legal-card { width: min(820px, 100%); margin: 0 auto; padding: clamp(24px, 5vw, 48px); border: 1px solid #dbe8e6; border-radius: 26px; background: rgba(255,255,255,.94); box-shadow: 0 24px 70px rgba(41,82,89,.12); }
.legal-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 30px; color: #17343a; }
.legal-brand img { width: 46px; height: 46px; padding: 5px; border: 1px solid #dcebea; border-radius: 14px; object-fit: contain; }
.legal-brand strong, .legal-brand small { display: block; }
.legal-brand strong { font-size: 14px; }
.legal-brand small { margin-top: 3px; color: #71878b; font-size: 11px; }
.legal-eyebrow { display: inline-flex; padding: 7px 11px; border-radius: 999px; background: #d9f3ed; color: #16796e; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.legal-card h1 { margin: 18px 0 8px; color: #17343a; font-size: clamp(30px, 5vw, 44px); letter-spacing: -.05em; }
.legal-lead { margin: 0 0 30px; color: #657d83; font-size: 15px; line-height: 1.65; }
.legal-card section { padding: 18px 0; border-top: 1px solid #e5efed; }
.legal-card h2 { margin: 0 0 7px; color: #24545a; font-size: 17px; }
.legal-card section p { margin: 0; color: #60777b; font-size: 13px; line-height: 1.7; }
.legal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.legal-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 12px; text-decoration: none; font-size: 12px; font-weight: 800; }
.legal-actions .login-submit { color: #fff; }
@media (max-width: 520px) { .legal-page { padding: 18px 12px; } .legal-actions { flex-direction: column; } .legal-actions a { width: 100%; } }

/* Dashboard daily schedule. */
.dashboard-schedule-panel { grid-column: 1 / -1; }
.dashboard-alert-center { grid-column: 1 / -1; padding: 18px 20px; border: 1px solid #dce8e7; border-left: 4px solid #167e73; border-radius: 16px; background: #fff; }
.dashboard-alert-center__heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.dashboard-alert-center__heading h2 { margin: 3px 0 0; color: #19353c; font-size: 18px; }
.dashboard-alert-center__heading > span { padding: 6px 10px; border-radius: 999px; background: #edf6f5; color: #167e73; font-size: 11px; font-weight: 800; }
.dashboard-alert-center__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.dashboard-alert-center__item { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 10px 12px; border-radius: 10px; color: #29484f; text-decoration: none; font-size: 12px; }
.dashboard-alert-center__item--warning { background: #fff6df; color: #89681c; }
.dashboard-alert-center__item--danger { background: #fff0ef; color: #a05752; }
.dashboard-alert-center__item--info { background: #edf3ff; color: #42649a; }
.dashboard-collapsible-panel { width: 100%; }
.dashboard-collapsible-panel summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; }
.dashboard-collapsible-panel summary::-webkit-details-marker { display: none; }
.dashboard-collapsible-panel summary strong { display: block; margin-top: 3px; color: #19353c; font-size: 18px; }
.dashboard-collapsible-panel__hint { padding: 7px 10px; border-radius: 9px; background: #edf6f5; color: #167e73; font-size: 11px; font-weight: 800; }
.dashboard-collapsible-panel[open] .dashboard-collapsible-panel__hint { background: #167e73; color: #fff; }
.dashboard-collapsible-panel .module-directory { margin-top: 18px; }
.dashboard-schedule-panel__header { align-items: flex-start; }
.dashboard-schedule-panel__date { margin: 4px 0 0; color: #71878b; font-size: 12px; }
.dashboard-schedule-toolbar, .dashboard-schedule-date-form { display: flex; align-items: center; gap: 8px; }
.dashboard-schedule-calendar { display: flex; gap: 4px; padding: 3px; border: 1px solid #dce8ea; border-radius: 10px; background: #f5f9f9; }
.dashboard-schedule-calendar__day { display: grid; min-width: 38px; padding: 5px 6px; border-radius: 7px; color: #557278; text-align: center; text-decoration: none; }
.dashboard-schedule-calendar__day span { font-size: 9px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.dashboard-schedule-calendar__day strong { margin-top: 2px; font-size: 14px; line-height: 1; }
.dashboard-schedule-calendar__day:hover, .dashboard-schedule-calendar__day.is-selected { background: #167e73; color: #fff; }
.dashboard-schedule-calendar__day.is-today:not(.is-selected) { box-shadow: inset 0 0 0 1px #167e73; color: #167e73; }
.dashboard-schedule-quick-dates { display: flex; gap: 4px; padding: 3px; border: 1px solid #dce8ea; border-radius: 10px; background: #f5f9f9; }
.dashboard-schedule-quick-dates a { padding: 7px 9px; border-radius: 7px; color: #557278; font-size: 11px; font-weight: 800; text-decoration: none; }
.dashboard-schedule-quick-dates a:hover, .dashboard-schedule-quick-dates a.is-active { background: #d9f1eb; color: #167e73; }
.dashboard-schedule-date-form label { color: #61777d; font-size: 11px; font-weight: 800; }
.dashboard-schedule-date-form input { min-height: 38px; padding: 0 10px; border: 1px solid #dce8ea; border-radius: 10px; color: #18353c; background: #fbfdfd; }
.dashboard-schedule-list { display: grid; gap: 12px; }
.dashboard-schedule-card { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 18px; padding: 16px; border: 1px solid #e0e9eb; border-left: 4px solid #197d75; border-radius: 16px; background: linear-gradient(135deg, #fff, #f8fbfb); }
.dashboard-schedule-card__time { display: flex; flex-direction: column; justify-content: center; gap: 2px; color: #167e73; }
.dashboard-schedule-card__time strong { font-size: 22px; letter-spacing: -.04em; }
.dashboard-schedule-card__time span { color: #789095; font-size: 12px; }
.dashboard-schedule-card__title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.dashboard-schedule-card__type { color: #167e73; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.dashboard-schedule-card h3 { margin: 4px 0 0; color: #19353c; font-size: 18px; }
.dashboard-schedule-card__status { padding: 6px 9px; border-radius: 999px; background: #e6f4f1; color: #176e65; font-size: 11px; font-weight: 800; white-space: nowrap; }
.dashboard-schedule-card__meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; color: #71878b; font-size: 12px; }
.dashboard-schedule-card__meta strong { color: #36565d; }
.dashboard-schedule-card__attendance { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.dashboard-schedule-card__attendance span { padding: 7px 10px; border-radius: 9px; background: #f2f6f7; color: #657d82; font-size: 11px; }
.dashboard-schedule-card__attendance strong { margin-left: 5px; color: #1d353b; }
.dashboard-schedule-card__attendance .is-present { background: #e8f6f0; color: #23795e; }
.dashboard-schedule-card__attendance .is-late { background: #fff5dc; color: #987020; }
.dashboard-schedule-card__attendance .is-absent { background: #fff0ef; color: #aa5d59; }
.dashboard-schedule-card__attendance .is-excused { background: #edf1fb; color: #5d6f9a; }
.dashboard-schedule-card__students { margin-top: 12px; border-top: 1px solid #e7eeee; padding-top: 10px; }
.dashboard-schedule-card__students summary { cursor: pointer; color: #167e73; font-size: 12px; font-weight: 800; }
.dashboard-schedule-card__students ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px 18px; margin: 10px 0 0; padding-left: 18px; color: #587177; font-size: 12px; }
.dashboard-schedule-card__students a { color: inherit; }
body[data-theme='dark'] .dashboard-schedule-card { border-color: #2d4b51; background: #172a30; }
body[data-theme='dark'] .dashboard-schedule-card h3, body[data-theme='dark'] .dashboard-schedule-card__meta strong { color: #e4f0ee; }
body[data-theme='dark'] .dashboard-schedule-date-form input { border-color: #315159; color: #e4f0ee; background: #172a30; }
@media (max-width: 720px) {
  .dashboard-alert-center__items { grid-template-columns: 1fr; }
  .dashboard-schedule-panel__header { gap: 14px; }
  .dashboard-schedule-toolbar, .dashboard-schedule-date-form { align-items: stretch; flex-wrap: wrap; }
  .dashboard-schedule-calendar { width: 100%; justify-content: space-between; }
  .dashboard-schedule-calendar__day { flex: 1; min-width: 0; }
  .dashboard-schedule-quick-dates { width: 100%; justify-content: center; }
  .dashboard-schedule-quick-dates a { flex: 1; text-align: center; }
  .dashboard-schedule-date-form { width: 100%; }
  .dashboard-schedule-date-form input { flex: 1; min-width: 140px; }
  .dashboard-schedule-toolbar > .module-button { width: 100%; }
  .dashboard-schedule-card { grid-template-columns: 1fr; gap: 10px; }
  .dashboard-schedule-card__time { flex-direction: row; align-items: baseline; gap: 8px; }
  .dashboard-schedule-card__students ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 430px) { .dashboard-schedule-card__title-row { flex-direction: column; } .dashboard-schedule-card__students ul { grid-template-columns: 1fr; } }
.dashboard-schedule-table-wrap { overflow-x: auto; border: 1px solid #dfeaec; border-radius: 14px; }
.dashboard-schedule-table { width: 100%; min-width: 900px; border-collapse: separate; border-spacing: 0; background: #fff; table-layout: fixed; }
.dashboard-schedule-table th, .dashboard-schedule-table td { padding: 7px; border-right: 1px solid #e5edef; border-bottom: 1px solid #e5edef; vertical-align: top; text-align: left; }
.dashboard-schedule-table thead th { position: sticky; top: 0; z-index: 1; background: #edf6f5; color: #176f68; font-size: 11px; font-weight: 800; white-space: nowrap; }
.dashboard-schedule-table tbody tr:last-child th, .dashboard-schedule-table tbody tr:last-child td { border-bottom: 0; }
.dashboard-schedule-table th:last-child, .dashboard-schedule-table td:last-child { border-right: 0; }
.dashboard-schedule-table__class { position: sticky; left: 0; z-index: 2; width: 145px; min-width: 145px; background: #f8fbfb; color: #1c3e45; font-size: 11px; font-weight: 800; }
.dashboard-schedule-row__toggle { display: flex; align-items: center; gap: 5px; width: 100%; padding: 0; border: 0; color: inherit; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.dashboard-schedule-row__toggle span { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 5px; background: #dcefeb; color: #167e73; font-size: 15px; line-height: 1; }
.dashboard-schedule-class-link { color: inherit; text-decoration: none; }
.dashboard-schedule-class-link:hover, .dashboard-schedule-class-link:focus-visible { color: #167e73; text-decoration: underline; }
.dashboard-schedule-row.is-collapsed .dashboard-schedule-row__details { display: none; }
.dashboard-schedule-row.is-collapsed .dashboard-schedule-table__class { border-bottom: 0; }
.dashboard-schedule-row.is-expanded .dashboard-schedule-table__class { background: #eef7f5; }
.dashboard-schedule-table thead .dashboard-schedule-table__class { z-index: 3; background: #e6f2f0; }
.dashboard-schedule-cell { min-width: 0; padding: 7px; border-left: 3px solid #178178; border-radius: 9px; background: #f6fbfa; box-shadow: 0 3px 10px rgba(27, 90, 88, .06); }
.dashboard-schedule-cell + .dashboard-schedule-cell { margin-top: 8px; }
.dashboard-schedule-cell > strong, .dashboard-schedule-cell__teacher, .dashboard-schedule-cell > .dashboard-schedule-card__status { display: block; }
.dashboard-schedule-cell > strong { margin-top: 4px; color: #193b42; font-size: 13px; }
.dashboard-schedule-cell__teacher { margin-top: 5px; color: #647e83; font-size: 11px; line-height: 1.35; }
.dashboard-schedule-cell__teacher a { color: inherit; text-decoration: none; }
.dashboard-schedule-cell__teacher a:hover, .dashboard-schedule-cell__teacher a:focus-visible { color: #167e73; text-decoration: underline; }
.dashboard-schedule-cell > .dashboard-schedule-card__status { width: fit-content; margin-top: 8px; padding: 4px 7px; font-size: 10px; }
.dashboard-schedule-cell__attendance { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.dashboard-schedule-cell__attendance span { padding: 3px 5px; border-radius: 6px; font-size: 10px; font-weight: 800; }
.dashboard-schedule-cell__attendance .is-present { background: #e3f5ee; color: #287861; }
.dashboard-schedule-cell__attendance .is-late { background: #fff2d5; color: #987020; }
.dashboard-schedule-cell__attendance .is-absent { background: #ffeded; color: #a35f5c; }
.dashboard-schedule-cell__attendance .is-excused { background: #e9eefb; color: #5d6f9a; }
.dashboard-schedule-table .dashboard-schedule-card__students { margin-top: 8px; padding-top: 7px; }
.dashboard-schedule-table .dashboard-schedule-card__students summary { font-size: 10px; }
.dashboard-schedule-table .dashboard-schedule-card__students ul { display: block; margin-top: 6px; padding-left: 14px; font-size: 10px; }
.dashboard-schedule-table .dashboard-schedule-card__students p { margin: 6px 0 0; color: #71878b; font-size: 10px; }
.dashboard-schedule-table__empty { display: block; padding: 26px 10px; color: #a4b4b6; text-align: center; }
body[data-theme='dark'] .dashboard-schedule-table-wrap, body[data-theme='dark'] .dashboard-schedule-table { border-color: #2c4a50; background: #172a30; }
body[data-theme='dark'] .dashboard-schedule-table th, body[data-theme='dark'] .dashboard-schedule-table td { border-color: #2c4a50; }
body[data-theme='dark'] .dashboard-schedule-table thead th, body[data-theme='dark'] .dashboard-schedule-table thead .dashboard-schedule-table__class { background: #1d3a3d; color: #b9e4dc; }
body[data-theme='dark'] .dashboard-schedule-table__class { background: #192f35; color: #e4f0ee; }
body[data-theme='dark'] .dashboard-schedule-row__toggle span { background: #28504e; color: #b9e4dc; }
body[data-theme='dark'] .dashboard-schedule-row.is-expanded .dashboard-schedule-table__class { background: #203e40; }
body[data-theme='dark'] .dashboard-schedule-cell { background: #1c3538; }
body[data-theme='dark'] .dashboard-schedule-cell > strong { color: #e4f0ee; }

/* Mobile usability guardrails: content may scroll inside its own data surface, never the page. */
@media (max-width: 600px) {
  .dashboard-main,
  .app-shell__content,
  .dashboard-main-body,
  .module-shell,
  .module-header,
  .module-card,
  .dashboard-panel,
  .dashboard-overview,
  .dashboard-grid,
  .module-grid,
  .module-toolbar,
  .module-actions,
  .dashboard-header__row,
  .dashboard-header__left,
  .dashboard-header__actions {
    min-width: 0;
    max-width: 100%;
  }

  .dashboard-main { padding: 10px 9px 22px; }
  .navbar-header { padding: 13px 12px; border-radius: 14px; }
  .dashboard-header__row { gap: 12px; }
  .dashboard-header__left { gap: 9px; }
  .sidebar-mobile-toggle { position: relative; flex: 0 0 42px; align-self: flex-start; }
  .dashboard-title { font-size: 24px; line-height: 1.08; }
  .dashboard-subtitle { max-width: 100%; font-size: 11px; line-height: 1.45; }
  .dashboard-header__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .dashboard-header__actions .navbar-search { grid-column: 1 / -1; width: 100%; min-width: 0; }
  .dashboard-header__actions .top-action-link { width: 100%; min-width: 0; min-height: 36px; padding: 8px 6px; text-align: center; white-space: normal; }
  .dashboard-header__actions .top-action-link--danger { grid-column: 1 / -1; }
  .dashboard-academic-filter { padding: 12px; }
  .dashboard-academic-filter > div:last-child { align-items: stretch; flex-direction: column; }
  .dashboard-academic-filter select,
  .dashboard-academic-filter .module-button { width: 100%; min-width: 0; }
  .hero-card { padding: 18px; border-radius: 18px; }
  .hero-card__content p { font-size: 12px; line-height: 1.5; }
  .dashboard-overview .hero-card__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; gap: 6px; }
  .dashboard-overview .hero-card__metrics div { min-height: 70px; padding: 9px 6px; }
  .dashboard-overview .hero-card__metrics strong { font-size: 18px; }
  .dashboard-overview .hero-card__metrics span { font-size: 9px; line-height: 1.25; }
  .stats-grid { gap: 8px; }
  .stat-card { min-height: 96px; padding: 13px; }
  .dashboard-panel { padding: 13px; }
  .dashboard-panel__header { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dashboard-panel__header > .module-button { width: 100%; }
  .dashboard-alert-center { padding: 14px; }
  .dashboard-alert-center__heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dashboard-alert-center__items { margin-top: 10px; }
  .quick-links-grid { grid-template-columns: 1fr; }
  .quick-link-card { min-height: 72px; }
  .module-directory { grid-template-columns: 1fr; }
  .module-actions { align-items: stretch; flex-direction: column; }
  .module-actions .module-button { width: 100%; min-width: 0; }
  .student-quality-summary .module-toolbar { gap: 10px; }
  .student-quality-summary__items { grid-template-columns: 1fr; }
  .student-quality-summary__items > div { min-width: 0; }
  .student-quality-reason { max-width: 100%; }
  .module-table-wrap,
  .homework-list-view,
  .student-schedule-grid-scroll,
  .dashboard-schedule-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .dashboard-schedule-toolbar { width: 100%; align-items: stretch; flex-direction: column; }
  .dashboard-schedule-toolbar > * { max-width: 100%; }
  .dashboard-schedule-date-form { width: 100%; }
  .dashboard-schedule-date-form input { min-width: 0; width: 100%; }
  .dashboard-schedule-toolbar > .module-button { width: 100%; }
  .app-back-to-top { right: 12px; bottom: 14px; min-height: 42px; padding: 0 11px; border-radius: 12px; }
  .app-back-to-top span { display: none; }
}

@media (max-width: 390px) {
  .dashboard-overview .hero-card__metrics { grid-template-columns: 1fr; }
  .dashboard-overview .hero-card__metrics div { min-height: 54px; align-items: flex-start; }
  .dashboard-schedule-calendar__day span { font-size: 8px; }
  .dashboard-schedule-calendar__day strong { font-size: 13px; }
}

/* Dashboard daily schedule: keep expanded rows compact without hiding details. */
@media (min-width: 721px) {
  .dashboard-schedule-table { min-width: 780px; }
  .dashboard-schedule-table th,
  .dashboard-schedule-table td { padding: 5px; }
  .dashboard-schedule-table__class { width: 128px; min-width: 128px; font-size: 10px; }
  .dashboard-schedule-cell { padding: 6px; border-radius: 8px; }
  .dashboard-schedule-cell + .dashboard-schedule-cell { margin-top: 5px; }
  .dashboard-schedule-cell > strong { margin-top: 3px; font-size: 12px; }
  .dashboard-schedule-cell__teacher { margin-top: 3px; font-size: 10px; }
  .dashboard-schedule-cell > .dashboard-schedule-card__status { margin-top: 5px; padding: 3px 6px; font-size: 9px; }
  .dashboard-schedule-cell__attendance { gap: 3px; margin-top: 5px; }
  .dashboard-schedule-cell__attendance span { padding: 2px 4px; font-size: 9px; }
  .dashboard-schedule-table .dashboard-schedule-card__students { margin-top: 5px; padding-top: 5px; }
  .dashboard-schedule-row.is-collapsed { height: 26px; }
  .dashboard-schedule-row.is-collapsed .dashboard-schedule-table__class { padding-top: 2px; padding-bottom: 2px; }
  .dashboard-schedule-row.is-collapsed .dashboard-schedule-row__toggle { gap: 4px; font-size: 9px; line-height: 1.15; }
  .dashboard-schedule-row.is-collapsed .dashboard-schedule-row__toggle span { width: 15px; height: 15px; font-size: 13px; }
}

/* Payment summary: keep the three amounts on one compact desktop row. */
@media (min-width: 601px) {
  .dashboard-panel--finance .finance-stack { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .dashboard-panel--finance .finance-item { min-height: 54px; flex-direction: row; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; }
  .dashboard-panel--finance .finance-item span { font-size: 11px; }
  .dashboard-panel--finance .finance-item strong { font-size: 18px; }
  .dashboard-panel--finance .progress-track { margin-top: 9px; }
}

/* Program page mobile view: show daily cards instead of the wide matrix. */
@media (max-width: 700px) {
  .program-schedule-card .schedule-grid-day-picker,
  .program-schedule-card .schedule-grid-scroll {
    display: none;
  }

  .program-schedule-card .schedule-grid-mobile {
    display: grid;
  }
}