:root {
  --ayna-bg: #f4f1e8;
  --ayna-surface: #ffffff;
  --ayna-surface-soft: #f7faf9;
  --ayna-ink: #173a35;
  --ayna-muted: #657873;
  --ayna-green: #173f39;
  --ayna-border: #d6e1de;
  --ayna-gold: #e7c84f;
  --ayna-gold-hover: #d9b93f;
  --ayna-radius-control: 10px;
  --ayna-radius-panel: 12px;
  --ayna-shadow-panel: 0 8px 24px rgba(23, 58, 53, .06);
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  color: var(--ayna-ink);
  background: var(--ayna-bg);
}

* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font-family: inherit; }
.table-top-scroll { position: sticky; top: 0; z-index: 20; width: 100%; height: 14px; margin: 0 0 6px; overflow-x: auto; overflow-y: hidden; background: #fff; }
.table-top-scroll[hidden] { display: none; }
.table-top-scroll-track { height: 1px; }

.page-header-actions { justify-self: end; display: flex; align-items: center; gap: 10px; }
.admin-language-switcher { display: inline-flex; align-items: center; gap: 8px; color: #60756f; font-size: 13px; font-weight: 600; white-space: nowrap; }
.admin-language-switcher select { width: auto; min-width: 112px; height: 40px; margin: 0; padding: 0 32px 0 11px; border: 1px solid #c9d9d5; border-radius: 10px; background: #fff; color: #143f39; font: inherit; }

.table-page-header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  min-height: 78px;
  padding: 8px 24px;
  background: #fff;
  border-bottom: 1px solid #d9e2df;
}

.table-page-header img { width: 128px; height: 50px; object-fit: contain; }
.table-page-header button { justify-self: end; }
.back-link { color: #174a42; font-weight: 700; text-decoration: none; }

main { width: calc(100% - 32px); margin: 18px auto 28px; }
h1 { margin: 0; font-size: clamp(30px, 3vw, 38px); line-height: 1.15; font-weight: 650; letter-spacing: -.025em; }
#records-count { margin: 5px 0 0; color: #687873; }

button {
  min-height: 40px;
  padding: 9px 16px;
  border: 0;
  border-radius: var(--ayna-radius-control);
  background: var(--ayna-gold);
  color: #173a35;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(23, 58, 53, .10);
  transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}

button:hover { background: var(--ayna-gold-hover); transform: translateY(-1px); }
button:active { transform: translateY(0); }
button:focus-visible { outline: 2px solid #4d8379; outline-offset: 2px; }

button.secondary { background: #fff; border: 1px solid #bfd0cb; box-shadow: none; }
button.secondary:hover { background: #eef3f1; }

.filters {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto;
  align-items: end;
  gap: 10px;
  margin: 18px 0 12px;
  padding: 12px;
  border: 1px solid #d9e2df;
  border-radius: var(--ayna-radius-panel);
  background: #fff;
}

.all-filters { grid-column: 1 / -1; border-top: 1px solid #d9e2df; padding-top: 10px; }
.all-filters summary { cursor: pointer; color: #174a42; font-weight: 700; }
.column-filters { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }

.filters label { display: grid; min-width: 0; gap: 5px; font-size: 13px; font-weight: 700; }
.filters input, .filters select { width: 100%; min-width: 0; max-width: 100%; height: 42px; padding: 8px 11px; border: 1px solid #bfd0cb; border-radius: var(--ayna-radius-control); background: #fff; color: var(--ayna-ink); font: inherit; }
.filters input:focus, .filters select:focus { outline: none; border-color: #4d8379; box-shadow: 0 0 0 3px rgba(42, 105, 94, .12); }

.table-wrap { overflow: auto; max-height: calc(100vh - 230px); border: 1px solid #d9e2df; border-radius: var(--ayna-radius-panel); background: #fff; box-shadow: var(--ayna-shadow-panel); }
table { width: 100%; min-width: 1880px; border-collapse: collapse; font-size: 11px; }
th, td { padding: 8px 7px; border-right: 1px solid #e1e8e6; border-bottom: 1px solid #e1e8e6; text-align: left; vertical-align: top; }
th { position: sticky; top: 0; z-index: 2; background: #173f39; color: #fff; }
tbody tr:nth-child(even) { background: #f7f9f8; }

th:nth-child(1), td:nth-child(1) { position: sticky; left: 0; z-index: 3; width: 140px; min-width: 140px; background: #fff; }
th:nth-child(2), td:nth-child(2) { position: sticky; left: 140px; z-index: 3; width: 120px; min-width: 120px; background: #fff; box-shadow: 5px 0 8px rgba(23, 58, 53, 0.1); }
th:nth-child(1), th:nth-child(2) { z-index: 5; background: #173f39; }
tbody tr:nth-child(even) td:nth-child(1), tbody tr:nth-child(even) td:nth-child(2) { background: #f7f9f8; }

.sort-button { width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; text-align: left; box-shadow: none; transform: none; }
.sort-button:hover { background: transparent; box-shadow: none; transform: none; }
.sort-button:focus-visible { outline: 2px solid rgba(255, 255, 255, .75); outline-offset: 2px; }
td a { color: #176b5e; font-weight: 700; }

.row-actions { min-width: 125px; }
.row-actions button { width: 100%; padding: 7px 9px; font-size: 11px; }
.row-actions button + button { margin-top: 6px; }
.row-actions button.danger { border: 1px solid #d8b8b5; background: #fff4f2; color: #9a342d; }
.row-actions button.danger:hover { background: #fbe5e2; }
.row-actions button:disabled { cursor: wait; opacity: .65; }
.inline-edit-control { width: 100%; min-width: 82px; padding: 6px; border: 1px solid #8fa9a2; border-radius: 6px; font: inherit; background: #fff; }
.student-edit-control { min-width: 150px; }
.inline-edit-control[readonly] { background: #eef3f1; color: #52645f; }

@media (max-width: 900px) {
  .filters { grid-template-columns: repeat(2, 1fr); }
  .search-filter { grid-column: 1 / -1; }
  .column-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-page-header { grid-template-columns: 1fr auto; }
  .table-page-header img { display: none; }
}