:root {
  --blue: #1f5fa9;
  --blue-2: #2875c8;
  --blue-3: #0f4f97;
  --line: #b8c0ca;
  --soft: #eef3f8;
  --green-row: #d9f6d8;
  --text: #111827;
  --mong-sen-bg: url("/static/hinh-dep.webp");
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Segoe UI", Arial, sans-serif;
  color: var(--text);
  background:
    linear-gradient(rgba(244, 247, 251, .86), rgba(244, 247, 251, .9)),
    var(--mong-sen-bg) center / cover fixed no-repeat,
    #f4f7fb;
  font-size: 14px;
}

[hidden] { display: none !important; }

#appShell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.login-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background:
    linear-gradient(135deg, rgba(9, 34, 62, .42), rgba(244, 247, 251, .42)),
    var(--mong-sen-bg) center / cover no-repeat,
    #e8eef7;
}
.login-window {
  position: relative;
  width: 474px;
  border: 1px solid #7e8794;
  background: rgba(243, 243, 243, .96);
  box-shadow: 0 22px 60px rgba(15, 23, 42, .22);
}
.login-title {
  height: 38px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: #fff;
  border-bottom: 1px solid #d4d8de;
  font-size: 16px;
}
.login-system-name {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 16px);
  width: min(760px, calc(100vw - 32px));
  padding: 16px 26px;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 255, 255, .82);
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 16px 40px rgba(15, 23, 42, .2);
  color: transparent;
  font-size: 0;
  line-height: 1.25;
  text-align: center;
}
.login-system-name::before {
  content: "HỆ THỐNG NỘI BỘ";
  display: block;
  color: #0d4f86;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: .4px;
}
.login-system-name::after {
  content: "QUẢN LÝ ĐÀO TẠO LÁI XE TỈNH LÀO CAI";
  display: block;
  margin-top: 5px;
  color: #12395f;
  font-size: 19px;
  font-weight: 800;
  letter-spacing: .2px;
}
.login-banner {
  position: relative;
  height: 80px;
  background:
    radial-gradient(circle at 65% 50%, rgba(255,255,255,.2), transparent 28%),
    linear-gradient(90deg, #b8cbff, #2447e8 70%, #dce6ff);
  overflow: hidden;
}
.key-mark {
  position: absolute;
  left: 24px;
  top: 10px;
  color: #f3c12e;
  font-size: 58px;
  line-height: 1;
  text-shadow: 0 2px 0 #7b8595;
  transform: rotate(-28deg);
}
.key-mark.right {
  left: auto;
  right: 20px;
  transform: rotate(25deg);
}
.login-body {
  padding: 30px 56px 28px 40px;
}
.login-body label {
  grid-template-columns: 118px 12px 1fr;
  margin-bottom: 10px;
  font-size: 16px;
}
.login-body label span {
  color: #ff1b1b;
  font-weight: 700;
}
.login-body input {
  height: 28px;
  border-color: #7d8794;
  font-size: 16px;
}
.captcha-inline {
  display: grid;
  grid-template-columns: 72px 72px 1fr;
  gap: 6px;
  align-items: center;
}
.captcha-inline b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  border: 1px solid #8a96a5;
  background: #fff;
  color: #123b63;
  font-size: 14px;
}
.captcha-inline button {
  height: 28px;
  padding: 0 8px;
  font-size: 12px;
}
#loginError {
  min-height: 22px;
  color: #b91c1c;
  margin: 4px 0 8px 130px;
}
.login-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
}
.login-actions button {
  height: 38px;
  font-size: 16px;
}
.public-lookup-link {
  display: block;
  margin: 16px auto 0;
  color: #0d5795;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}
.public-lookup-link:hover { text-decoration: underline; }
.security-dialog {
  width: min(520px, calc(100vw - 32px));
  border: 1px solid #8a9bb0;
  padding: 0;
}
.security-body {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
}
.security-body p {
  margin: 0;
  color: #17324d;
  font-weight: 700;
}
.security-body ul {
  margin: 0 0 4px 18px;
  padding: 0;
  color: #475569;
}
.security-body label {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}
.security-body input {
  height: 32px;
  border: 1px solid #9aa9bb;
  padding: 0 8px;
}
.form-error {
  min-height: 20px;
  color: #b91c1c;
  font-weight: 600;
}
.account-hint {
  margin: -4px 0 4px;
  color: #5b6b7c;
  font-size: 12px;
  line-height: 1.35;
}

.topbar { display: none; }
.user-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #e6f1ff;
  font-weight: 600;
}
button {
  height: 36px;
  border: 1px solid #cbd5e1;
  background: #e9eef4;
  color: #17324d;
  font-weight: 600;
  padding: 0 18px;
  cursor: pointer;
}
button:hover { filter: brightness(.97); }
.primary {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}
.ghost {
  background: white;
  color: var(--blue-3);
  border-color: white;
}

.tabs {
  display: flex;
  background: var(--blue);
  border-top: 1px solid rgba(255,255,255,.35);
  align-items: center;
}
.tab {
  min-width: 190px;
  height: 44px;
  border: 1px solid #b8d8ff;
  border-bottom: none;
  background: var(--blue);
  color: white;
  font-size: 15px;
}
.tab.active {
  background: white;
  color: var(--blue);
}
.nav-user {
  margin-left: auto;
  height: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  color: #e6f1ff;
  font-weight: 600;
  white-space: nowrap;
  position: relative;
}
.nav-user .ghost {
  height: 30px;
  padding: 0 12px;
}

.admin-menu-trigger {
  border: 0;
  background: transparent;
  color: #e6f1ff;
  font: inherit;
  height: 32px;
  padding: 0 8px;
  cursor: default;
}
.admin-menu-trigger.has-menu {
  cursor: pointer;
}
.admin-menu-trigger.has-menu::after {
  content: " ▾";
}
.system-admin-menu {
  position: absolute;
  top: calc(100% - 2px);
  right: 92px;
  z-index: 20;
  display: grid;
  grid-auto-flow: row;
  gap: 2px;
  min-width: 240px;
  padding: 6px;
  background: #fff;
  border: 1px solid #b7c9dc;
  border-radius: 4px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .18);
}
.system-admin-menu button {
  display: block;
  width: 100%;
  height: 34px;
  border: 0;
  background: #fff;
  color: #12324f;
  text-align: left;
  padding: 0 10px;
  font-weight: 600;
}
.system-admin-menu button:hover {
  background: #eaf3ff;
  color: var(--blue);
}

main {
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
}
.app-page { display: none; }
.app-page.active-page {
  display: block;
  flex: 1;
}
.section-title {
  background: var(--blue-2);
  color: white;
  font-weight: 700;
  font-size: 18px;
  padding: 12px 20px;
}
.filters {
  padding: 12px 20px;
  background: var(--soft);
  border-bottom: 1px solid #d4dbe4;
}
.student-filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px 18px;
  align-items: end;
}
.student-filter-fields {
  display: grid;
  grid-template-columns: minmax(220px, 1.35fr) minmax(190px, 1fr) minmax(170px, .9fr) minmax(180px, .9fr) minmax(290px, 1.25fr);
  gap: 10px 14px;
  align-items: end;
  min-width: 0;
}
.student-filter-fields label {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  align-items: stretch;
  min-width: 0;
  color: #24445f;
  font-weight: 600;
}
.student-filter-fields input {
  width: 100%;
  height: 34px;
  box-sizing: border-box;
}
.student-birth-filter {
  display: grid;
  grid-template-columns: minmax(135px, 1fr) auto;
  gap: 5px 8px;
  align-items: end;
  min-width: 0;
}
.student-birth-filter button {
  height: 34px;
  min-width: 112px;
}
.student-filter-status:empty { display: none; }
.student-filter-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  padding-top: 10px;
  border-top: 1px solid #d5dee7;
}
.student-filter-actions button {
  height: 36px;
  min-width: 104px;
  padding-inline: 16px;
}
.age-status {
  min-height: 18px;
  display: flex;
  align-items: center;
  font-weight: 700;
  white-space: nowrap;
}
.age-status.ok { color: #047857; }
.age-status.error { color: #b91c1c; }
label { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: center; white-space: nowrap; }
input, select {
  height: 28px;
  border: 1px solid #8f9aa7;
  background: white;
  padding: 3px 7px;
  font: inherit;
  min-width: 0;
}

.toolbar {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: #f8fafc;
  border-bottom: 1px solid var(--line);
}
#status { margin-left: auto; color: #475569; }

.grid-wrap {
  height: calc(100vh - 274px);
  min-height: 360px;
  overflow: auto;
  background: #aaa;
  border-bottom: 1px solid var(--line);
}
table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  background: white;
}
th {
  position: sticky;
  top: 0;
  z-index: 1;
  height: 36px;
  background: linear-gradient(#d7ebff, #72a9e2);
  color: #081d32;
  border: 1px solid #6f8bab;
  padding: 0 8px;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}
td {
  height: 27px;
  border: 1px solid #8ca0b6;
  padding: 3px 7px;
  white-space: nowrap;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  vertical-align: middle;
}
#studentTable td:nth-child(8),
#studentTable td:nth-child(12) {
  text-align: left;
}
tbody tr:nth-child(even) { background: var(--green-row); }
tbody tr.selected { background: #0b82d8; color: white; }

.pager {
  height: 42px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: #edf3f9;
}
.pager #rangeInfo { flex: 1; color: #42627f; }
.pager input { width: 48px; text-align: center; }

.profile-wrap {
  min-height: calc(100vh - 174px);
  padding: 28px;
  background: #eef3f8;
}
.profile-card {
  max-width: 980px;
  background: white;
  border: 1px solid #cbd5e1;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
}
.profile-head {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 22px 26px;
  border-bottom: 1px solid #d9e0e8;
  background: linear-gradient(90deg, #f8fbff, #e8f1fb);
}
.avatar {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--blue);
  color: white;
  font-size: 28px;
  font-weight: 700;
}
.profile-head h1 {
  margin: 0 0 4px;
  font-size: 24px;
  letter-spacing: 0;
}
.profile-head p {
  margin: 0;
  color: #58708a;
}
.profile-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 22px;
  padding: 24px 26px 10px;
}
.profile-grid label {
  grid-template-columns: 120px minmax(0, 1fr);
}
.profile-grid .wide {
  grid-column: span 2;
}
.profile-grid .required {
  color: #b91c1c;
}
.profile-actions {
  height: 74px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 0 26px;
}
.account-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 430px;
  gap: 12px;
  padding: 12px;
  background: #f3f6fa;
}
.account-grid {
  height: 280px;
  min-height: 240px;
  border: 1px solid var(--line);
}
.account-form {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--line);
}
.account-form strong {
  margin-bottom: 4px;
}
.account-form label {
  grid-template-columns: 92px minmax(0, 1fr);
}
.account-permissions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  margin: 0;
  padding: 8px 10px 10px;
  border: 1px solid #c7d5e4;
}
.account-permissions legend {
  padding: 0 5px;
  color: #173a5e;
  font-weight: 600;
}
.account-permissions label {
  display: flex;
  gap: 7px;
  align-items: flex-start;
  min-width: 0;
  min-height: 32px;
  font-size: 12px;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
}
.account-permissions input {
  width: 16px;
  height: 16px;
  margin: 1px 0 0;
  flex: 0 0 16px;
}
.account-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}
#webUserStatus {
  min-height: 22px;
  color: #475569;
}
.login-history-panel {
  padding: 0 12px 12px;
  background: #f3f6fa;
}
.login-history-head {
  height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--line);
  border-bottom: 0;
  padding: 0 10px;
}
.login-history-head strong {
  color: #123b63;
}
.login-history-head button {
  height: 28px;
  padding: 0 10px;
}
#loginHistoryStatus {
  color: #475569;
}
.login-history-grid {
  height: calc(100vh - 548px);
  min-height: 220px;
  border: 1px solid var(--line);
}
#loginHistoryTable td:nth-child(7),
#loginHistoryTable td:nth-child(9) {
  text-align: left;
  max-width: 360px;
}
.login-success-row td:nth-child(6) {
  color: #047857;
  font-weight: 700;
}
.login-failed-row td:nth-child(6) {
  color: #b91c1c;
  font-weight: 700;
}
.locked-row {
  color: #64748b;
  background: #f8fafc;
}
.empty-page {
  min-height: calc(100vh - 174px);
  padding: 28px;
  color: #475569;
  background: #f8fafc;
}

.manager-filters {
  display: grid;
  grid-template-columns: 150px 180px 240px 190px 150px 230px 120px 110px;
  gap: 10px 12px;
  align-items: end;
  padding: 12px 20px;
  background: var(--soft);
  border-bottom: 1px solid #d4dbe4;
}
.manager-filters label {
  grid-template-columns: auto minmax(0, 1fr);
}
.vehicle-filters {
  grid-template-columns: minmax(360px, 1fr) 170px 190px 150px 218px 82px 76px;
}
.vehicle-filters label:first-child {
  grid-template-columns: 94px minmax(0, 1fr);
}
.vehicle-filters button {
  padding: 0 10px;
  min-width: 0;
}
.vehicle-filters #btnVehicleSearch,
.vehicle-filters #btnVehicleReset {
  width: 76px;
}
.gpxtl-filters {
  grid-template-columns: minmax(280px, 1fr) 150px 190px 170px 92px 82px auto;
}
.gpxtl-filters label:first-child {
  grid-template-columns: 70px minmax(0, 1fr);
}
.gpxtl-print-filters {
  grid-template-columns: 210px 250px 112px 142px 92px 92px minmax(220px, 1fr);
}
.teacher-certificate-filters {
  display: grid;
  grid-template-columns: 190px 190px minmax(250px, 1fr) 170px 190px;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid #c7d5e4;
  background: #f7fafc;
}
.teacher-certificate-filters label {
  grid-template-columns: auto minmax(0, 1fr);
}
#teachersPage > .toolbar {
  height: auto;
  min-height: 48px;
  flex-wrap: wrap;
}
#teacherTable td:nth-last-child(2) {
  min-width: 170px;
  white-space: normal;
}
#teacherTable td:nth-last-child(2) small {
  display: block;
  margin-top: 3px;
  color: #9a3412;
}
#teacherTable td:last-child {
  min-width: 112px;
}
.teacher-certificate-row-button {
  width: auto;
  min-width: 96px;
  height: 28px;
  padding: 0 9px;
}
.certificate-status {
  display: inline-block;
  padding: 2px 7px;
  border: 1px solid #9aa9b8;
  border-radius: 3px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}
.certificate-status.confirmed { border-color: #6fba8e; background: #e6f7ed; color: #166534; }
.certificate-status.pending { border-color: #dfb34f; background: #fff7dc; color: #854d0e; }
.certificate-status.invalid { border-color: #e08a8a; background: #feecec; color: #991b1b; }
.teacher-certificate-dialog {
  width: min(1420px, calc(100vw - 24px));
  max-width: none;
}
.teacher-certificate-teacher {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 1px;
  padding: 10px 12px;
  background: #cbd8e5;
}
.teacher-certificate-teacher > div {
  min-width: 0;
  padding: 7px 9px;
  background: #fff;
}
.teacher-certificate-teacher b,
.teacher-certificate-teacher span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.teacher-certificate-teacher b { margin-bottom: 3px; color: #52677c; font-size: 11px; }
.teacher-certificate-workspace {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  min-height: 600px;
  background: #eef3f7;
}
.teacher-certificate-list-panel {
  border-right: 1px solid #b8c9d9;
  background: #f8fafc;
}
.panel-head {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 10px;
  border-bottom: 1px solid #cbd5df;
}
.panel-head button { height: 28px; padding: 0 8px; }
.teacher-certificate-list {
  max-height: 550px;
  overflow: auto;
  padding: 8px;
}
.teacher-certificate-list > button {
  width: 100%;
  height: auto;
  min-height: 68px;
  display: grid;
  justify-items: start;
  gap: 4px;
  margin-bottom: 6px;
  padding: 8px;
  text-align: left;
  background: #fff;
}
.teacher-certificate-list > button.active { border-color: #1f67aa; box-shadow: inset 3px 0 #1f67aa; }
.teacher-certificate-list span { color: #52677c; font-weight: 400; }
.teacher-certificate-detail { min-width: 0; padding: 10px 12px; }
.teacher-certificate-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 9px 12px;
  padding: 10px;
  border: 1px solid #c5d2df;
  background: #fff;
}
.teacher-certificate-form label { grid-template-columns: 112px minmax(0, 1fr); white-space: normal; }
.teacher-certificate-form .wide { grid-column: span 2; }
.teacher-certificate-form textarea { width: 100%; resize: vertical; font: inherit; }
.teacher-certificate-compare {
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #c5d2df;
  border-top: 0;
  background: #f8fafc;
}
.teacher-certificate-files { margin-top: 10px; border: 1px solid #c5d2df; background: #fff; }
.teacher-certificate-file-upload { display: grid; grid-template-columns: minmax(280px, 1fr) 120px 120px; gap: 8px; padding: 8px 10px; }
.teacher-certificate-file-list { max-height: 170px; overflow: auto; padding: 0 10px 8px; }
.teacher-certificate-file-item {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(320px, 1fr) 90px;
  gap: 10px;
  align-items: center;
  padding: 7px;
  border-top: 1px solid #e1e8ef;
}
.teacher-certificate-file-item.current { background: #effaf3; }
.teacher-certificate-file-item div span { margin-left: 8px; }
.teacher-certificate-file-item button { height: 28px; padding: 0 8px; }
.teacher-certificate-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.teacher-certificate-actions button { height: 32px; padding: 0 11px; }
.teacher-certificate-report-dialog { width: min(1100px, calc(100vw - 24px)); max-width: none; }
.teacher-certificate-report-cards { display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); gap: 8px; padding: 12px; }
.teacher-certificate-report-cards div { padding: 10px; border: 1px solid #c6d5e3; background: #fff; }
.teacher-certificate-report-cards span { display: block; min-height: 32px; color: #52677c; font-size: 12px; }
.teacher-certificate-report-cards b { font-size: 20px; color: #145a96; }
.teacher-certificate-report-actions { display: flex; gap: 8px; padding: 0 12px 10px; }
.teacher-certificate-report-tables { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 0 12px 14px; }
.teacher-certificate-report-tables > div { max-height: 360px; overflow: auto; background: #fff; }
.teacher-certificate-bulk-dialog { width: min(900px, calc(100vw - 24px)); max-width: none; }
.teacher-certificate-bulk-body { padding: 14px; }
.teacher-certificate-bulk-body p { margin-top: 0; color: #52677c; }
.teacher-certificate-bulk-preview { max-height: 420px; overflow: auto; margin-top: 12px; border: 1px solid #cbd5df; background: #fff; }
.teacher-certificate-bulk-preview > div { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr); gap: 10px; padding: 8px 10px; border-top: 1px solid #e1e8ef; }
.teacher-certificate-bulk-preview > div:first-child { border-top: 0; }
.teacher-certificate-bulk-preview .matched b { color: #166534; }
.teacher-certificate-bulk-preview .unmatched b { color: #991b1b; }
.teacher-certificate-history-dialog { width: min(980px, calc(100vw - 24px)); max-width: none; }
.teacher-certificate-history-grid { height: 480px; min-height: 320px; }

.training-license-filters { display: grid; grid-template-columns: minmax(260px, 1.6fr) 130px 180px 190px 150px 110px 90px; gap: 8px; align-items: end; padding: 10px 12px; background: #eef4f9; border-bottom: 1px solid #c5d3df; }
.training-license-filters label { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px; align-items: center; white-space: nowrap; }
.training-license-filters input, .training-license-filters select { width: 100%; min-width: 0; height: 30px; }
.training-license-grid { height: calc(100vh - 225px); min-height: 380px; }
.training-license-grid table { min-width: 1780px; }
.training-license-grid td:nth-child(2), .training-license-grid td:nth-child(7) { text-align: left; }
.training-license-grid .status-cell { font-weight: 700; color: #145a96; }
.training-license-grid .expired { color: #b42318; }
.training-license-dialog { width: min(1500px, calc(100vw - 24px)); max-width: none; }
.training-license-dialog form { max-height: calc(100vh - 28px); overflow: auto; }
.training-license-center-info { display: grid; grid-template-columns: repeat(5, minmax(140px, 1fr)); border-bottom: 1px solid #c4d2df; background: #eaf2f9; }
.training-license-center-info > div { min-width: 0; padding: 8px 10px; border-right: 1px solid #c4d2df; }
.training-license-center-info b, .training-license-center-info span { display: block; overflow-wrap: anywhere; }
.training-license-center-info b { margin-bottom: 3px; color: #506579; font-size: 11px; }
.training-license-form { display: grid; grid-template-columns: repeat(3, minmax(250px, 1fr)); gap: 8px 14px; padding: 12px; }
.training-license-form label { display: grid; grid-template-columns: 125px minmax(0, 1fr); gap: 7px; align-items: center; }
.training-license-form label.wide { grid-column: span 2; }
.training-license-form input, .training-license-form select, .training-license-form textarea { width: 100%; min-width: 0; }
.training-license-compare { min-height: 34px; padding: 8px 12px; border-block: 1px solid #d1dce6; background: #f7f9fb; color: #52677c; }
.training-license-files { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 12px; background: #edf3f8; }
.training-license-files article { min-width: 0; border: 1px solid #bccbd8; background: #fff; }
.training-license-files article > header { display: flex; justify-content: space-between; gap: 8px; padding: 8px 10px; background: #dfeaf4; border-bottom: 1px solid #bccbd8; }
.training-license-upload { display: grid; grid-template-columns: minmax(260px, 1fr) 135px; gap: 8px; padding: 8px 10px; }
.training-license-file-list { max-height: 170px; overflow: auto; padding: 0 10px 8px; }
.training-license-file-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 7px 8px; border-top: 1px solid #e0e7ee; }
.training-license-file-item.current { background: #effaf3; }
.training-license-file-item small { display: block; color: #52677c; overflow-wrap: anywhere; }
.training-license-file-buttons { display: flex; gap: 5px; }
.training-license-file-buttons button { height: 28px; padding: 0 8px; }
.training-license-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 0 12px 12px; }
.training-license-report-dialog { width: min(1200px, calc(100vw - 24px)); max-width: none; }
.training-license-report-cards { display: grid; grid-template-columns: repeat(8, minmax(110px, 1fr)); gap: 8px; padding: 12px; }
.training-license-report-cards div { padding: 10px; border: 1px solid #c6d5e3; background: #fff; }
.training-license-report-cards span { display: block; min-height: 32px; color: #52677c; font-size: 12px; }
.training-license-report-cards b { font-size: 20px; color: #145a96; }
.training-license-report-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 12px 10px; }
.training-license-report-tables { display: grid; grid-template-columns: 1.5fr 0.8fr 1fr; gap: 12px; padding: 0 12px 14px; }
.training-license-report-tables > div { max-height: 340px; overflow: auto; background: #fff; }
.training-license-history-dialog { width: min(1000px, calc(100vw - 24px)); max-width: none; }
.training-license-history-grid { height: 480px; min-height: 320px; }
@media (max-width: 1100px) {
  .training-license-filters { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
  .training-license-form { grid-template-columns: 1fr 1fr; }
  .training-license-form label.wide { grid-column: span 2; }
  .training-license-center-info { grid-template-columns: repeat(2, 1fr); }
  .training-license-files, .training-license-report-tables { grid-template-columns: 1fr; }
  .training-license-report-cards { grid-template-columns: repeat(4, 1fr); }
}
.gpxtl-print-filters button {
  min-width: 0;
  width: 100%;
  padding: 0 10px;
}
.gpxtl-print-filters #gpxPrintStatus {
  min-width: 0;
}
.subtabs {
  display: flex;
  gap: 0;
  background: #dbe8f6;
  border-bottom: 1px solid #9fb7d0;
}
.subtab {
  border: 0;
  border-right: 1px solid #9fb7d0;
  background: #eaf2fb;
  min-width: 210px;
}
.subtab.active {
  background: #ffffff;
  color: var(--blue-3);
}
.gpxtl-view {
  display: none;
}
.gpxtl-view.active-gpxtl-view {
  display: block;
}
.validity-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 14px 16px;
  border-bottom: 1px solid #b8c9d9;
  background: #fff;
}
.validity-head div { display: grid; gap: 4px; }
.validity-head strong { color: #123f68; font-size: 18px; }
.validity-head span { color: #61768a; }
.validity-cards {
  display: grid;
  grid-template-columns: repeat(6, minmax(145px, 1fr));
  gap: 10px;
  padding: 12px 14px;
  background: #edf3f8;
}
.validity-cards button {
  display: grid;
  gap: 6px;
  min-height: 68px;
  padding: 10px 12px;
  border: 1px solid #c0d1e1;
  border-left: 4px solid #237db7;
  background: #fff;
  text-align: left;
}
.validity-cards button:hover { border-color: #237db7; background: #f7fbff; }
.validity-cards span { color: #5d7184; font-size: 12px; }
.validity-cards strong { color: #123f68; font-size: 22px; }
.validity-filters {
  display: grid;
  grid-template-columns: minmax(250px, 1.4fr) minmax(240px, 1.2fr) 180px 170px 170px auto auto auto;
  gap: 8px;
  align-items: end;
  padding: 12px 14px;
  border-top: 1px solid #d4e0eb;
  border-bottom: 1px solid #b8c9d9;
  background: #f8fbfe;
}
.validity-filters label { display: grid; gap: 5px; color: #294f70; font-weight: 600; }
.validity-filters input,
.validity-filters select { width: 100%; }
.validity-legend {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 38px;
  padding: 0 14px;
  background: #fff;
  color: #52677a;
  font-size: 12px;
}
.validity-legend span { display: inline-flex; align-items: center; gap: 6px; }
.validity-dot { width: 9px; height: 9px; border-radius: 50%; background: #4f9b70; }
.validity-dot.soon { background: #e3a008; }
.validity-dot.expired { background: #d64b40; }
.validity-dot.suspended { background: #d97706; }
.validity-dot.revoked { background: #6d6875; }
.validity-grid { height: calc(100vh - 400px); min-height: 320px; }
.validity-grid table { min-width: 1180px; }
.validity-grid th { position: sticky; top: 0; z-index: 2; }
.validity-grid td small { display: block; margin-top: 3px; color: #65798c; }
.validity-row.validity-soon td { background: #fff9e8; }
.validity-row.validity-expired td { background: #fff1f0; }
.validity-row.validity-suspended td { background: #fff7e6; }
.validity-row.validity-revoked td { background: #f1f1f3; color: #5e5964; }
.validity-row.validity-missing td,
.validity-row.validity-pending td { background: #f5f8fb; }
.validity-badge {
  display: inline-block;
  padding: 5px 9px;
  border-radius: 999px;
  background: #e8f6ee;
  color: #157044;
  font-weight: 700;
  white-space: nowrap;
}
.validity-badge.soon { background: #fff2c8; color: #8a5b00; }
.validity-badge.expired { background: #ffe1de; color: #ad2d23; }
.validity-badge.suspended { background: #ffedcc; color: #9a5700; }
.validity-badge.revoked { background: #e3e1e6; color: #514b59; }
.validity-badge.missing,
.validity-badge.pending { background: #e7eef5; color: #425d76; }
.validity-basis { min-width: 210px; white-space: normal; line-height: 1.35; }
.validity-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 9px 14px;
  border-top: 1px solid #b8c9d9;
  background: #fff;
  color: #5d7184;
}
.validity-footer strong { color: #1b496f; }
.validity-actions { display: flex; gap: 5px; justify-content: center; min-width: 150px; }
.validity-dialog { width: min(680px, calc(100vw - 32px)); border: 0; padding: 0; border-radius: 8px; box-shadow: 0 18px 55px rgba(17, 48, 76, .3); }
.validity-dialog::backdrop { background: rgba(21, 42, 61, .55); }
.validity-dialog form { display: grid; gap: 16px; padding: 0 20px 20px; }
.validity-dialog header { margin: 0 -20px; padding: 15px 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #d5e0ea; background: #f4f8fb; }
.validity-dialog header div { display: grid; gap: 3px; }
.validity-dialog header strong { color: #123f68; font-size: 17px; }
.validity-dialog header span { color: #5f7487; }
.validity-dialog header button { border: 0; background: transparent; font-size: 22px; padding: 2px 8px; }
.validity-dialog label { display: grid; gap: 6px; color: #254d6f; font-weight: 600; }
.validity-dialog-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding-top: 16px; }
.validity-dialog-summary div { display: grid; gap: 4px; padding: 11px; border: 1px solid #d9e4ed; background: #f8fbfd; }
.validity-dialog-summary span { color: #60778c; font-size: 12px; }
.validity-dialog-summary strong { color: #173f62; }
.validity-dialog-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.validity-dialog textarea { width: 100%; resize: vertical; }
.validity-audit-note { margin: 0; padding: 10px 12px; border-left: 3px solid #2f83bb; background: #edf6fc; color: #486579; }
.validity-dialog footer { display: flex; justify-content: flex-end; gap: 8px; border-top: 1px solid #d9e4ed; padding-top: 14px; }
@media (max-width: 1250px) {
  .validity-cards { grid-template-columns: repeat(3, 1fr); }
  .validity-filters { grid-template-columns: repeat(3, minmax(180px, 1fr)); }
}
.approval-toolbar {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) 92px 88px 160px 170px minmax(220px, auto);
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  background: #edf3f8;
  border-bottom: 1px solid #b8c9d9;
}
.approval-toolbar label {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}
.approval-toolbar button {
  min-width: 0;
  padding: 0 10px;
}
.approval-device {
  color: #475569;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.approval-device.ready {
  color: #166534;
}
.approval-device.error {
  color: #b91c1c;
}
.approval-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 38px;
  padding: 0 12px;
  border-bottom: 1px solid #b8c9d9;
  background: #ffffff;
}
.approval-grid {
  height: calc(100vh - 260px);
}
#gpxApprovalTable th:first-child,
#gpxApprovalTable td:first-child {
  width: 38px;
  min-width: 38px;
}
#gpxApprovalTable td:nth-child(6) {
  min-width: 300px;
  text-align: left;
}
#gpxApprovalTable tr.approval-incomplete td {
  background: #fff4e5;
  color: #92400e;
}
#gpxApprovalTable tr.selected td {
  background: #dceeff;
}
.gpxtl-grid {
  height: calc(100vh - 268px);
}
.license-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: #f8fafc;
  border-bottom: 1px solid #d4dbe4;
}
.license-actions span {
  color: #475569;
}
.vehicle-edit-panel {
  padding: 10px 14px;
  background: #f8fafc;
  border-bottom: 1px solid #d4dbe4;
}
.vehicle-edit-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}
.vehicle-edit-head span {
  color: #475569;
}
.vehicle-edit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(190px, 1fr));
  gap: 8px 10px;
  align-items: center;
}
.vehicle-edit-grid label {
  grid-template-columns: 98px minmax(0, 1fr);
}
.vehicle-edit-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.license-issue-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}
.license-issue-head span {
  color: #475569;
}
.license-issue-grid {
  display: grid;
  grid-template-columns: 230px 118px minmax(260px, 1fr) 150px 150px 150px;
  gap: 8px 10px;
  align-items: center;
}
.license-issue-grid label {
  grid-template-columns: 104px minmax(0, 1fr);
}
.license-issue-grid label:nth-child(3) {
  grid-column: span 2;
}
#gpxtlLicensesView .gpxtl-grid {
  height: calc(100vh - 420px);
}
.digital-sign-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) repeat(4, auto);
  gap: 8px;
  align-items: center;
  min-height: 48px;
  padding: 7px 12px;
  border-top: 1px solid #c7d5e4;
  border-bottom: 1px solid #b8c9da;
  background: #f4f7fa;
}
.digital-sign-toolbar button {
  width: auto;
  min-width: 112px;
  height: 34px;
  padding: 0 12px;
  white-space: nowrap;
}
.digital-sign-summary {
  display: flex;
  min-width: 0;
  gap: 14px;
  align-items: baseline;
}
.digital-sign-summary strong {
  color: #173a5e;
}
.digital-sign-summary span {
  min-width: 0;
  color: #475569;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.digital-sign-summary span.signed-ok {
  color: #166534;
  font-weight: 700;
}
.digital-sign-summary span.signing-error {
  color: #b91c1c;
  font-weight: 700;
}
@media (max-width: 1100px) {
  .digital-sign-toolbar {
    grid-template-columns: minmax(260px, 1fr) repeat(2, auto);
  }
  .digital-sign-summary {
    grid-column: 1 / -1;
  }
}
.license-report-panel {
  padding: 8px 12px;
  border-bottom: 1px solid #b8c8da;
  background: #eef5fc;
}
.license-report-head {
  display: grid;
  grid-template-columns: auto 170px 170px 92px 92px 82px 112px 1fr;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}
.license-report-head strong {
  color: #0f5591;
  white-space: nowrap;
}
.license-report-head label {
  grid-template-columns: 58px minmax(0, 1fr);
  white-space: nowrap;
}
.license-report-head button {
  min-width: 0;
  height: 30px;
  padding: 0 8px;
}
.license-report-cards {
  display: grid;
  grid-template-columns: repeat(6, minmax(110px, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}
.license-report-cards div {
  padding: 7px 10px;
  border: 1px solid #c3d4e6;
  background: #fff;
}
.license-report-cards span {
  display: block;
  color: #52657b;
  font-size: 12px;
}
.license-report-cards strong {
  display: block;
  margin-top: 2px;
  color: #0f5591;
  font-size: 20px;
}
.license-report-body {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 10px;
}
.license-report-body > div {
  min-width: 0;
  max-height: 138px;
  overflow: auto;
}
#gpxtlReportView .license-report-panel {
  min-height: calc(100vh - 180px);
  border-bottom: 0;
}
#gpxtlReportView .license-report-body > div {
  max-height: calc(100vh - 390px);
}
.license-report-body b {
  display: block;
  margin-bottom: 4px;
  color: #1f2937;
}
.license-report-body table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}
.license-report-body th,
.license-report-body td {
  border: 1px solid #b7c9dc;
  padding: 4px 6px;
  font-size: 13px;
}
.license-report-body th {
  background: linear-gradient(#cbe2f8, #7db2e2);
}
.license-report-body td:first-child,
.license-report-body td:last-child {
  width: 58px;
  text-align: center;
}
.license-report-body td:nth-child(2) {
  max-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.license-info-panel {
  padding: 10px 12px;
  border-bottom: 1px solid #b8c8da;
  background: #f6f9fc;
}
.license-info-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}
.license-info-head span {
  color: #475569;
}
.license-info-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 8px 10px;
  align-items: center;
}
.license-info-grid label {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.license-info-grid label.wide {
  grid-column: span 2;
  grid-template-columns: 118px minmax(0, 1fr);
}
.license-info-grid input[readonly] {
  background: #eef2f7;
  color: #334155;
}
#gpxtlVehiclesView .gpxtl-grid {
  height: calc(100vh - 320px);
}
.vehicle-toolbar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: stretch;
}
.vehicle-toolbar-search,
.vehicle-toolbar-import {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}
.vehicle-toolbar-search label:first-child {
  flex: 1 1 360px;
  min-width: 260px;
}
.vehicle-toolbar-search label:first-child input {
  width: 100%;
}
.vehicle-toolbar-search label:nth-child(2),
.vehicle-toolbar-search label:nth-child(3) {
  flex: 0 0 auto;
}
.vehicle-toolbar-search label:nth-child(2) input {
  width: 112px;
}
.vehicle-toolbar-search label:nth-child(3) select {
  width: 126px;
}
.vehicle-toolbar-search button {
  width: 86px;
  min-width: 86px;
}
.vehicle-toolbar-search #btnVehicleIssueOpen {
  width: 112px;
  min-width: 112px;
}
.vehicle-toolbar-import {
  justify-content: flex-start;
}
.vehicle-toolbar-import label {
  flex: 1 1 420px;
  min-width: 320px;
  max-width: 620px;
}
.vehicle-toolbar-import input[type="file"] {
  width: 100%;
  min-width: 0;
}
.vehicle-toolbar-import button {
  width: 112px;
  min-width: 112px;
}
.vehicle-toolbar-import #btnGpxVehicleDuplicateCheck {
  width: 96px;
  min-width: 96px;
  padding: 0 8px;
}
.vehicle-toolbar-import #gpxVehicleStatusText {
  flex: 1 1 120px;
  min-width: 110px;
  color: #334155;
  white-space: nowrap;
}
.vehicle-edit-status-row {
  padding: 8px 12px;
  border-bottom: 1px solid #b8c8da;
  background: #f8fafc;
  color: #334155;
}
.vehicle-edit-dialog {
  width: min(1120px, calc(100vw - 48px));
}
.vehicle-edit-dialog-form {
  min-width: min(1080px, calc(100vw - 72px));
}
.dialog-vehicle-edit-grid {
  padding: 14px;
  grid-template-columns: repeat(3, minmax(250px, 1fr));
}
.dialog-vehicle-edit-grid label.wide {
  grid-column: 1 / -1;
}
.dialog-status {
  margin-right: auto;
  color: #475569;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  white-space: normal;
  text-align: left;
}
#btnVehicleRegistryCheck,
#btnVehicleIssueRegistryCheck {
  min-width: 142px;
}
.gpxtl-filters input[type="file"] {
  padding: 4px;
  background: #ffffff;
}
.import-preview {
  padding: 8px 12px;
  border-bottom: 1px solid #b8c8da;
  background: #f6f9fc;
}
.import-preview-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 6px;
}
.import-preview-head span {
  color: #475569;
}
.import-preview-grid {
  max-height: 210px;
}
.import-preview-grid td:nth-child(3),
.import-preview-grid td:nth-child(6),
.import-preview-grid td:nth-child(7),
.import-preview-grid td:nth-child(8),
.import-preview-grid td:nth-child(9) {
  text-align: left;
}
#gpxtlVehicleTable td:nth-child(10),
#gpxtlVehicleTable td:nth-child(11),
#gpxtlVehicleTable td:nth-child(12),
#gpxtlVehicleTable td:nth-child(13),
#gpxtlVehicleTable td:nth-child(17),
#gpxtlVehicleTable td:nth-child(22),
#gpxtlTable td:nth-child(4),
#gpxtlTable td:nth-child(10),
#gpxtlTable td:nth-child(11),
#gpxtlTable td:nth-child(19),
#gpxtlTable td:nth-child(20) {
  text-align: left;
}
#gpxtlTable th:first-child,
#gpxtlTable td:first-child {
  width: 38px;
  min-width: 38px;
}
#gpxtlTable .gpxtl-submit-check {
  width: 16px;
  height: 16px;
}
#gpxtlTable tr.license-pending-signature td {
  background: #eef6ff;
}
#gpxtlTable tr.license-returned-for-correction td {
  background: #fff4d6;
}
.approval-return-row {
  min-width: 68px;
  padding: 5px 8px;
  white-space: nowrap;
}
#gpxtlTable tr.selected-for-submit td {
  box-shadow: inset 0 0 0 1px #4b91cf;
}
#gpxtlTable td.editable-cell {
  background: #fffdf2;
  color: #0f172a;
  cursor: text;
  outline: none;
}
#gpxtlTable tr.selected td.editable-cell {
  background: #ffffff;
  color: #0f172a;
  font-weight: 600;
}
#gpxtlTable td.editable-cell:focus {
  background: #ffffff;
  color: #0f172a;
  box-shadow: inset 0 0 0 2px #1d65a8;
}
#gpxtlVehicleTable td.duplicate-cell {
  background: #ffe4e6 !important;
  color: #9f1239;
  font-weight: 700;
  box-shadow: inset 0 0 0 2px #f43f5e;
}
#gpxtlTable tr.license-expired td {
  background: #fff1f1;
}
#gpxtlTable tr.license-expired td:nth-child(17) {
  color: #b91c1c;
  font-weight: 700;
}
#gpxtlVehicleTable tr.license-expired td {
  background: #fff1f1;
}
#gpxtlVehicleTable tr.license-expired td:nth-child(24) {
  color: #b91c1c;
  font-weight: 700;
}
#gpxtlTable tr.license-soon td:nth-child(17) {
  color: #92400e;
  font-weight: 700;
}
#gpxtlVehicleTable tr.license-soon td:nth-child(24) {
  color: #92400e;
  font-weight: 700;
}
.print-license-wrap {
  padding: 16px;
  background: #eef3f8;
  min-height: calc(100vh - 268px);
}
.print-license {
  width: fit-content;
  min-height: 0;
  margin: 0 auto;
  padding: 0;
  background: #fff;
  border: 0;
  color: #111827;
  font-family: "Times New Roman", Times, serif;
  font-size: 18px;
}
.print-page-switch {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-bottom: 12px;
  font-family: "Segoe UI", Arial, sans-serif;
}
.print-page-switch button {
  height: 32px;
  min-width: 86px;
  padding: 0 14px;
}
.print-page-switch button.active {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}
#gpxPrintPreview[data-page="1"] .excel-license-back,
#gpxPrintPreview[data-page="2"] .excel-license-front {
  display: none;
}
#gpxPrintPreview[data-page="2"] .excel-license-back {
  display: block;
}
.license-card {
  width: 190mm;
  height: 130mm;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #111;
  color: #111;
  font-family: "Times New Roman", Times, serif;
}
.nd94-front {
  padding: 9mm 11mm 7mm;
}
.nd94-back {
  margin-top: 12mm;
  display: grid;
  place-items: center;
}
.nd94-back div {
  width: 92mm;
  height: 24mm;
  display: grid;
  place-items: center;
  border: 1px solid #111;
  font-size: 46pt;
  font-weight: 700;
}
.license-top {
  display: grid;
  grid-template-columns: 1fr 1.55fr;
  gap: 24px;
  text-align: center;
  line-height: 1.35;
  font-size: 16px;
}
.license-top strong,
.license-top span {
  display: block;
}
.nd94-top {
  grid-template-columns: 1fr 1.6fr;
  gap: 12mm;
  font-size: 13pt;
  line-height: 1.35;
}
.nd94-top i {
  display: block;
  width: 31mm;
  height: 1px;
  margin: 3mm auto 0;
  border-top: 1px solid #111;
}
.print-license h2,
.print-license h3 {
  text-align: center;
  margin: 5mm 0 0;
}
.print-license h2 {
  font-size: 18pt;
  line-height: 1.1;
}
.print-license h3 {
  font-size: 16pt;
  font-weight: 700;
  margin-top: 1mm;
}
.print-license p {
  line-height: 1.55;
}
.license-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 8px;
  align-items: baseline;
  line-height: 1.7;
}
.license-row.two-cols {
  grid-template-columns: 170px minmax(150px, 1fr) 170px minmax(130px, 1fr);
}
.license-row strong,
.license-validity strong {
  font-weight: 700;
}
.license-route {
  margin: 2mm 0 0;
  text-align: justify;
  font-size: 14pt;
  line-height: 1.18;
}
.nd94-line {
  display: grid;
  grid-template-columns: 33mm minmax(0, 1fr);
  align-items: end;
  gap: 1mm;
  margin-top: 1mm;
  font-size: 15pt;
  line-height: 1.18;
}
.nd94-line.nd94-two {
  grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
  gap: 6mm;
}
.nd94-line div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
}
.nd94-line strong {
  min-height: 5mm;
  border-bottom: 1px dotted #111;
  padding-left: 1mm;
  font-weight: 400;
}
.nd94-line > strong {
  min-height: 5mm;
  border-bottom: 1px dotted #111;
  padding-left: 1mm;
  font-weight: 400;
}
.nd94-bottom {
  display: grid;
  grid-template-columns: 1fr 64mm;
  gap: 10mm;
  margin-top: 2mm;
  font-size: 13pt;
  line-height: 1.2;
}
.nd94-bottom p {
  margin: 1mm 0;
}
.nd94-bottom em {
  display: block;
  margin-top: 1mm;
  font-style: italic;
}
.license-validity {
  display: grid;
  grid-template-columns: 130px 190px 190px;
  gap: 14px;
  align-items: baseline;
  margin-top: 8px;
}
.license-validity div {
  display: grid;
  grid-template-columns: 78px 1fr;
  gap: 6px;
}
.license-sign {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 285px;
  gap: 28px;
  margin-top: 18px;
  align-items: start;
}
.license-note {
  font-size: 15px;
  font-style: italic;
  line-height: 1.35;
}
.license-sign-box {
  text-align: center;
  line-height: 1.18;
}
.license-sign-box strong {
  display: block;
  margin-top: 3mm;
  min-height: 15mm;
  white-space: pre-line;
}
.print-license-muted {
  height: 420px;
  display: grid;
  place-items: center;
  color: #64748b;
}
.excel-license {
  width: 190mm;
  min-height: 130mm;
  box-sizing: border-box;
  padding: 8mm 12mm 7mm;
  background: #fff;
  color: #111;
  font-family: "Times New Roman", Times, serif;
}
.excel-license-head {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 12mm;
  text-align: center;
  font-size: 13pt;
  line-height: 1.35;
}
.excel-license-head strong {
  display: block;
}
.excel-license h2 {
  margin: 8mm 0 0;
  text-align: center;
  font-size: 21pt;
  line-height: 1.1;
  font-weight: 700;
}
.excel-license h3 {
  margin: 2mm 0 5mm;
  text-align: center;
  font-size: 15pt;
  line-height: 1.1;
  font-weight: 700;
}
.excel-license-row {
  display: grid;
  align-items: center;
  margin-top: 2mm;
  font-size: 14pt;
  line-height: 1.25;
}
.excel-license-row.two {
  grid-template-columns: 38mm 42mm 36mm 1fr;
  gap: 1mm;
}
.excel-license-row.center-row {
  grid-template-columns: 35mm 1fr;
  min-height: 10mm;
}
.excel-license-row label {
  display: block;
  white-space: nowrap;
}
.excel-license-row strong {
  display: block;
  min-height: 6mm;
  font-size: 13.5pt;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.excel-license-route {
  margin: 3mm 0 2mm;
  font-size: 14pt;
  line-height: 1.28;
  text-align: justify;
  text-indent: 12mm;
}
.excel-license-valid {
  display: grid;
  grid-template-columns: 1fr 66mm;
  gap: 8mm;
  align-items: start;
  font-size: 13.5pt;
  line-height: 1.25;
}
.excel-license-valid p {
  margin: 1mm 0;
}
.excel-license-valid em {
  display: block;
  margin-top: 1mm;
  font-size: 13pt;
  font-style: italic;
  text-align: justify;
}
.excel-license-sign {
  text-align: center;
}
.excel-license-sign em {
  margin-bottom: 2mm;
  text-align: center;
}
.excel-license-sign strong {
  display: block;
  min-height: 18mm;
  font-size: 13pt;
  line-height: 1.3;
}
.excel-license-sign b {
  display: block;
  font-size: 14pt;
}
.excel-license {
  width: 190mm;
  height: 130mm;
  min-height: 130mm;
  padding: 0;
  background: transparent;
  break-after: avoid;
  page-break-after: avoid;
}
.excel-license-frame {
  width: 190mm;
  height: 130mm;
  box-sizing: border-box;
  border: 1px solid #111;
  background: #fff;
  padding: 8mm 12mm 7mm;
  overflow: hidden;
}
.excel-license-head {
  grid-template-columns: 1fr 1.42fr;
  gap: 12mm;
  font-size: 13pt;
  line-height: 1.26;
}
.excel-license-head i {
  display: block;
  width: 28mm;
  margin: 2mm auto 0;
  border-top: 1px solid #111;
}
.excel-license h2 {
  margin-top: 8mm;
  font-size: 21pt;
}
.excel-license h3 {
  margin: 2mm 0 5mm;
  font-size: 15pt;
}
.excel-license-row {
  margin-top: 2mm;
  font-size: 14pt;
  line-height: 1.25;
}
.excel-license-row.two {
  grid-template-columns: 38mm 42mm 36mm 1fr;
  gap: 1mm;
}
.excel-license-row.center-row {
  grid-template-columns: 35mm 1fr;
  min-height: 10mm;
}
.excel-license-row strong {
  min-height: 6mm;
  font-size: 13.5pt;
}
.excel-license-route {
  margin: 3mm 0 2mm;
  font-size: 14pt;
  line-height: 1.28;
  text-indent: 12mm;
}
.excel-license-valid {
  grid-template-columns: 1fr 66mm;
  gap: 8mm;
  font-size: 13.5pt;
  line-height: 1.25;
}
.excel-license-valid em {
  font-size: 13pt;
  line-height: 1.25;
}
.excel-license-sign em {
  line-height: 1.25;
}
.excel-license-sign strong {
  min-height: 24mm;
  padding-top: 4mm;
  font-size: 13pt;
  line-height: 1.3;
}
.excel-license-sign b {
  font-size: 14pt;
}
.excel-license-back .back-frame {
  display: grid;
  grid-template-rows: 54mm 42mm 1fr;
  align-items: center;
  justify-items: center;
  padding: 12mm 10mm 8mm;
}
.practice-text {
  font-family: "Times New Roman", Times, serif;
  font-size: 90pt;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.license-qr {
  width: 34mm;
  height: 34mm;
  object-fit: contain;
  justify-self: start;
  margin-left: 18mm;
}
.license-qr-caption {
  max-width: 94mm;
  color: #334155;
  font-family: Arial, sans-serif;
  font-size: 7pt;
  line-height: 1.25;
  text-align: center;
  overflow-wrap: anywhere;
}

@media screen {
  .print-license {
    transform: scale(1.12);
    transform-origin: top center;
    margin-bottom: 72px;
  }
}

.excel-license-frame {
  padding: 3.5mm 5mm 3.5mm;
}
.excel-license-head {
  grid-template-columns: 52mm 1fr;
  gap: 6mm;
  font-size: 12pt;
  line-height: 1.12;
}
.excel-license-head > div:last-child strong:first-child {
  white-space: nowrap;
  font-size: 11.5pt;
}
.excel-license-head i {
  width: 27mm;
  margin-top: .8mm;
}
.excel-license-head > div:last-child i {
  width: 47mm;
}
.excel-license h2 {
  margin-top: 4mm;
  font-size: 18.5pt;
}
.excel-license h3 {
  margin: 1mm 0 2.5mm;
  font-size: 13.5pt;
}
.excel-license-row {
  margin-top: .8mm;
  font-size: 12.4pt;
  line-height: 1.12;
}
.excel-license-row.two {
  grid-template-columns: 43mm 34mm 34mm 1fr;
  gap: 1.5mm;
}
.excel-license-row.center-row {
  grid-template-columns: 32mm 1fr;
  min-height: 7mm;
  align-items: start;
}
.excel-license-row.center-row label,
.excel-license-row.center-row strong {
  padding-top: 0;
  line-height: 1.15;
}
.excel-license-row strong {
  min-height: 5.3mm;
  font-size: 12.6pt;
}
.excel-license-route {
  margin: 1mm 0 .8mm;
  font-size: 10.8pt;
  line-height: 1.04;
  text-indent: 6mm;
}
.excel-license-route.long {
  font-size: 10.6pt;
  line-height: 1.05;
}
.excel-license-valid {
  grid-template-columns: 1fr 58mm;
  gap: 5mm;
  margin-top: 4mm;
  font-size: 11.5pt;
  line-height: 1;
}
.excel-license-valid p {
  margin: 0;
  line-height: 1;
}
.excel-license-valid > div:first-child > strong {
  display: block;
  margin: 0;
  line-height: 1;
}
.excel-license-valid em {
  margin-top: .5mm;
  font-size: 10.5pt;
  line-height: 1.08;
}

.excel-license {
  height: 130mm;
  min-height: 130mm;
}
.excel-license-frame {
  height: 130mm;
  border: 2px solid #111;
}
.excel-license-front {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 220mm;
  height: 160mm;
  min-height: 160mm;
}
.excel-license-front::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 220mm;
  height: 160mm;
  box-sizing: border-box;
  border: .35mm solid rgba(17, 24, 39, .28);
  pointer-events: none;
}
.excel-license-back .back-frame {
  grid-template-rows: 56mm 42mm 1fr;
  padding: 4mm 5mm;
}
.excel-license-sign em {
  margin-bottom: .4mm;
  line-height: 1.18;
}
.excel-license-sign strong {
  min-height: 31mm;
  padding-top: .5mm;
  font-size: 12.2pt;
  line-height: 1.16;
}
.excel-license-sign b {
  margin-top: 7mm;
  font-size: 13.2pt;
}

@media print {
  @page {
    size: A4 landscape;
    margin: 0;
  }
  html,
  body {
    width: 297mm !important;
    height: 210mm !important;
    min-width: 297mm !important;
    min-height: 210mm !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.printing-gpxtl-page > *:not(#appShell),
  body.printing-gpxtl-page #appShell > *:not(#gpxtlPage),
  body.printing-gpxtl-page #gpxtlPage > *:not(#gpxtlPrintView),
  body.printing-gpxtl-page #gpxtlPrintView > *:not(.print-license-wrap) {
    display: none !important;
  }
  body.printing-gpxtl-page #appShell,
  body.printing-gpxtl-page #gpxtlPage,
  body.printing-gpxtl-page #gpxtlPrintView,
  body.printing-gpxtl-page .print-license-wrap,
  body.printing-gpxtl-page #gpxPrintPreview {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    width: 297mm !important;
    height: 210mm !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
  }
  body.printing-gpxtl-page .print-page-switch {
    display: none !important;
  }
  body.printing-gpxtl-page #gpxPrintPreview .excel-license {
    display: none !important;
    align-items: center;
    justify-content: center;
    position: fixed !important;
    inset: 0 !important;
    width: 297mm !important;
    height: 210mm !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    break-before: avoid !important;
    break-after: avoid !important;
    page-break-before: avoid !important;
    page-break-after: avoid !important;
  }
  body.printing-gpxtl-page #gpxPrintPreview.print-page-1 .excel-license-front,
  body.printing-gpxtl-page #gpxPrintPreview.print-page-2 .excel-license-back {
    display: flex !important;
  }
  .excel-license-front::before {
    left: 38.5mm;
    top: 25mm;
    transform: none;
  }
  .excel-license-back::before {
    content: none;
  }
  .excel-license-frame {
    width: 190mm;
    height: 130mm;
    box-sizing: border-box;
    margin: 0;
    border: 2px solid #111;
  }
  .excel-license-front .excel-license-frame,
  .excel-license-back .excel-license-frame {
    transform: none;
  }
}
.center-filters {
  grid-template-columns: minmax(420px, 1fr) 120px 110px auto;
}
.center-filters label:first-child {
  grid-template-columns: 100px minmax(0, 1fr);
}
.center-grid {
  height: 365px;
  min-height: 365px;
  max-height: 365px;
  background: #fff;
  flex: 0 0 auto;
}
#centerTable {
  width: 2193px;
  min-width: 2193px;
  max-width: 2193px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}
#centerTable thead {
  display: table-header-group;
}
#centerTable tbody {
  display: table-row-group;
}
#centerTable tr {
  display: table-row;
}
#centerTable th,
#centerTable td {
  display: table-cell;
  box-sizing: border-box;
  max-width: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#centerTable thead th {
  box-sizing: border-box;
}
#centerTable col:nth-child(1),
#centerTable th:nth-child(1),
#centerTable td:nth-child(1) {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  padding-left: 2px;
  padding-right: 2px;
}
#centerTable col:nth-child(2),
#centerTable th:nth-child(2),
#centerTable td:nth-child(2) {
  width: 65px !important;
  min-width: 65px !important;
  max-width: 65px !important;
  padding-left: 3px;
  padding-right: 3px;
}
#centerTable col:nth-child(3),
#centerTable th:nth-child(3),
#centerTable td:nth-child(3) {
  width: 420px !important;
  min-width: 420px !important;
  max-width: 420px !important;
}
#trainingCentersPage.active-page {
  display: flex;
  flex-direction: column;
}
#centerTable td:nth-child(3),
#centerTable td:nth-child(13),
#centerTable td:nth-child(14) {
  text-align: left;
}
#centerTable tr.capacity-ok td:nth-child(7) {
  color: #047857;
  font-weight: 700;
}
#centerTable tr.capacity-warning td:nth-child(7) {
  color: #92400e;
  font-weight: 700;
}
#centerTable tr.capacity-danger td {
  background: #fff1f1;
}
#centerTable tr.capacity-danger td:nth-child(7) {
  color: #b91c1c;
  font-weight: 700;
}
#centerTable tbody tr:nth-child(n+8):nth-child(-n+10) td,
#centerTable tbody tr:nth-child(n+8):nth-child(-n+10) button {
  font-weight: 400;
}
.training-load-btn {
  min-width: 44px;
  height: 24px;
  padding: 0 8px;
  border: 1px solid #8fb4d8;
  background: #eef7ff;
  color: #0f4f85;
  font-weight: 700;
  cursor: pointer;
}
.training-load-btn:hover {
  background: #dceeff;
}
.training-load-popup {
  position: fixed;
  z-index: 1000;
  min-width: 220px;
  max-width: 320px;
  padding: 10px;
  background: #ffffff;
  border: 1px solid #8fb4d8;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
}
.training-load-popup-title {
  margin-bottom: 8px;
  color: #0f2f4a;
  font-weight: 700;
}
.training-load-popup table {
  width: 100%;
  border-collapse: collapse;
}
.center-dashboard {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
  gap: 12px;
  flex: 1;
  min-height: 230px;
  padding: 10px 8px 12px;
  background: #eaf1f8;
  border-top: 1px solid #b9c9d8;
}
.center-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid #aebfd0;
  background: #f8fbff;
}
.center-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
  background: #dbeaf8;
  border-bottom: 1px solid #aebfd0;
}
.center-panel h3 {
  margin: 0;
  font-size: 15px;
  color: #12395d;
}
.center-panel header span {
  font-size: 13px;
  color: #37566f;
  white-space: nowrap;
}
.mini-grid {
  flex: 1;
  min-height: 0;
  height: auto;
  overflow: auto;
}
.mini-grid table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}
.mini-grid th,
.mini-grid td {
  border: 1px solid #bfd0df;
  padding: 6px 7px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mini-grid th {
  position: sticky;
  top: 0;
  background: linear-gradient(#c8e4fb, #82b7e7);
  color: #0c2940;
}
.mini-grid td:nth-child(2) {
  text-align: left;
}
#centerDkkhStatsTable th:nth-child(1),
#centerDkkhStatsTable td:nth-child(1) {
  width: 42px;
  min-width: 42px;
  padding-left: 3px;
  padding-right: 3px;
}
#centerDkkhStatsTable th:nth-child(2),
#centerDkkhStatsTable td:nth-child(2) {
  width: 78px;
  min-width: 78px;
}
#centerDkkhStatsTable th:nth-child(3),
#centerDkkhStatsTable td:nth-child(3) {
  width: auto;
  text-align: left;
}
#centerDkkhStatsTable th:nth-child(4),
#centerDkkhStatsTable td:nth-child(4),
#centerDkkhStatsTable th:nth-child(5),
#centerDkkhStatsTable td:nth-child(5) {
  width: 86px;
  min-width: 86px;
  padding-left: 4px;
  padding-right: 4px;
}
#centerDkkhStatsTable th:nth-child(6),
#centerDkkhStatsTable td:nth-child(6) {
  width: 92px;
  min-width: 92px;
  padding-left: 4px;
  padding-right: 4px;
}
.directive-upload {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 132px;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid #d1dde8;
}
.directive-upload input {
  min-width: 0;
}
.directive-list {
  flex: 1;
  min-height: 0;
  height: auto;
  overflow: auto;
  padding: 8px 10px;
}
.directive-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px solid #e2ebf3;
}
.directive-item:last-child {
  border-bottom: 0;
}
.directive-main {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.directive-title {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.directive-main a {
  min-width: 0;
  color: #0f5591;
  font-weight: 700;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.directive-main a:hover {
  text-decoration: underline;
}
.new-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  min-width: 34px;
  padding: 0 6px;
  border-radius: 2px;
  background: #dc2626;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  animation: newBlink 0.9s infinite;
}
@keyframes newBlink {
  0%, 100% {
    opacity: 1;
    filter: brightness(1);
  }
  50% {
    opacity: 0.25;
    filter: brightness(1.35);
  }
}
.directive-main span,
.empty-note {
  color: #5b6f7f;
  font-size: 12px;
}
.directive-delete {
  width: 56px;
  height: 28px;
  padding: 0;
}
.training-load-popup th,
.training-load-popup td {
  padding: 6px 8px;
  border: 1px solid #d4dbe4;
  text-align: left;
}
.training-load-popup th {
  background: #dbeafe;
}
.training-load-popup td:last-child,
.training-load-popup th:last-child {
  width: 76px;
  text-align: center;
  font-weight: 700;
}
.verify-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 10px;
  padding: 10px;
  background: #f3f6fa;
}
.manager-grid {
  height: calc(100vh - 316px);
  min-height: 380px;
  border: 1px solid var(--line);
}
.manager-pager {
  border-top: 1px solid var(--line);
}
.manager-pager span:first-child {
  flex: 1;
  color: #42627f;
}
.verify-panel {
  background: white;
  border: 1px solid #cbd5e1;
  padding: 12px;
  overflow: auto;
  max-height: calc(100vh - 316px);
}
.verify-panel .manager-photo-card {
  margin: 0;
}
.verify-panel strong { color: #123b63; }
.verify-panel-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.verify-panel-head strong { flex: 1; }
.verify-panel-head button {
  height: 30px;
  padding: 0 10px;
  font-size: 13px;
}
.manager-photo-card {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin: 0 -4px 12px;
  padding: 10px 8px 12px;
  border: 1px solid #c7d7e5;
  background: #f7fafc;
}
.manager-photo-frame {
  width: 132px;
  height: 176px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #8fa7ba;
  background: #fff;
}
.manager-photo-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.manager-photo-frame span {
  padding: 12px;
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
}
.manager-photo-card b {
  min-height: 18px;
  color: #173a5e;
  font-size: 12px;
  text-align: center;
}
.manager-photo-card button {
  min-width: 86px;
  height: 30px;
}
.manager-photo-actions {
  display: flex;
  justify-content: center;
  gap: 7px;
  width: 100%;
}
.expiry-rule-note {
  margin: 0;
  padding: 7px 9px;
  border-left: 3px solid #2b6fae;
  background: #eef6fd;
  color: #244761;
  font-size: 12px;
  line-height: 1.4;
}
#teacherTable tbody tr.photo-active td,
#vehicleTable tbody tr.photo-active td {
  box-shadow: inset 0 2px #1f6eb7, inset 0 -2px #1f6eb7;
}
.verify-summary {
  padding: 10px;
  background: #eef6ff;
  border: 1px solid #bdd7f2;
  color: #123b63;
  line-height: 1.45;
}
.verify-list-title {
  margin: 12px 0 6px;
  font-weight: 700;
  color: #334155;
}
.verify-item {
  border-top: 1px solid #e2e8f0;
  padding: 7px 0;
  color: #475569;
  overflow-wrap: anywhere;
}
.verify-item:first-child {
  border-top: none;
}
.verify-ok {
  color: #166534;
  font-weight: 700;
}
.verify-missing {
  color: #b91c1c;
  font-weight: 700;
}
tbody tr.verified-found {
  background: #d9f6d8;
}
tbody tr.verified-missing {
  background: #ffe0e0;
}
tbody tr.verified-found.selected,
tbody tr.verified-missing.selected {
  background: #0b82d8;
}

.receive-file {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 130px 150px auto minmax(320px, 1.4fr);
  gap: 10px;
  align-items: center;
  padding: 12px 20px;
  background: #f8fafc;
  border-bottom: 1px solid #d4dbe4;
}
.receive-file label {
  grid-template-columns: 76px minmax(0, 1fr);
}
#dkkhStatus {
  color: #475569;
  white-space: nowrap;
}
.dkkh-report-date-status {
  display: none;
  min-height: 38px;
  padding: 9px 20px;
  border-bottom: 1px solid transparent;
  font-weight: 700;
  line-height: 1.35;
}
.dkkh-report-date-status.ok,
.dkkh-report-date-status.error {
  display: block;
}
.dkkh-report-date-status.ok {
  color: #166534;
  background: #f0fdf4;
  border-color: #bbf7d0;
}
.dkkh-report-date-status.error {
  color: #991b1b;
  background: #fef2f2;
  border-color: #fecaca;
}
.dkkh-xml-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 20px;
  border-bottom: 1px solid #cbd5e1;
  background: #eef6ff;
}
.dkkh-xml-tools[hidden] {
  display: none;
}
.dkkh-xml-tools p {
  margin: 0;
  color: #173a5e;
  line-height: 1.4;
}
.dkkh-xml-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}
.dkkh-xml-actions button {
  min-height: 36px;
  white-space: nowrap;
}
#btnDkkhWhiteBackground:not(:disabled) {
  border-color: #d18a00;
  background: #fff6dd;
  color: #765000;
  font-weight: 700;
}
.capacity-warning {
  min-height: 28px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid transparent;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.capacity-warning.ok {
  color: #047857;
  background: #e8fff3;
  border-color: #9de7c2;
}
.capacity-warning.warning {
  color: #92400e;
  background: #fff7df;
  border-color: #f5d58a;
}
.capacity-warning.danger {
  color: #b91c1c;
  background: #fff1f1;
  border-color: #f0a0a0;
}
.receive-info {
  padding: 0 12px;
  background: #f3f6fa;
}
.receive-info fieldset {
  margin: 8px 0;
}
.receive-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px 18px;
}
.receive-grid label {
  grid-template-columns: 122px minmax(0, 1fr);
}
.receive-work {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(260px, 19vw, 300px);
  gap: 12px;
  padding: 0 12px 12px;
  background: #f3f6fa;
}
.receive-table-wrap {
  height: calc(100vh - 360px);
  min-height: 360px;
  overflow: auto;
  background: #aaa;
  border: 1px solid var(--line);
}
#dkkhTable td:nth-child(3) { min-width: 220px; }
#dkkhTable td:nth-child(8) { min-width: 150px; }
#dkkhTable td:nth-child(10) { min-width: 150px; }
tbody tr.warning-row {
  background: #fff2cc;
}
tbody tr.auto-check-error-row {
  background: #ffe0e0;
}
tbody tr.warning-row.selected {
  background: #0b82d8;
}
.check-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 1px 7px;
  border-radius: 4px;
  font-weight: 700;
  white-space: nowrap;
}
.check-badge.ok {
  color: #047857;
  background: #e8fff3;
}
.check-badge.warning {
  color: #92400e;
  background: #fff7df;
}
.check-badge.danger {
  color: #b91c1c;
  background: #fff1f1;
}
.auto-check-panel {
  margin-bottom: 8px;
  padding: 8px;
  border: 1px solid #d4dbe4;
  background: #f8fafc;
}
.auto-check-panel strong {
  margin-bottom: 6px;
}
.auto-check-item {
  padding: 4px 0;
  line-height: 1.35;
}
.auto-check-item.ok { color: #047857; }
.auto-check-item.warning { color: #92400e; }
.auto-check-item.danger { color: #b91c1c; font-weight: 700; }
.receive-side {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 12px;
}
.receive-photo,
.duplicate-panel {
  background: white;
  border: 1px solid #cbd5e1;
  padding: 12px;
}
.receive-photo img {
  width: 150px;
  height: 190px;
  object-fit: cover;
  display: block;
  margin: 0 auto 8px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
}
#dkkhPhotoText {
  color: #475569;
  overflow-wrap: anywhere;
  line-height: 1.35;
  width: min(100%, 260px);
  margin: 0 auto;
  text-align: center;
}
.duplicate-panel {
  min-height: 130px;
  flex: 1 1 160px;
  overflow: auto;
}
.duplicate-panel strong {
  display: block;
  margin-bottom: 8px;
  color: #123b63;
}
.duplicate-item {
  border-top: 1px solid #e2e8f0;
  padding: 8px 0;
  line-height: 1.35;
}
.duplicate-item:first-child {
  border-top: none;
}
.duplicate-item span {
  display: block;
  color: #475569;
  overflow-wrap: anywhere;
}
.ok-text {
  color: #166534;
}

dialog {
  width: min(980px, calc(100vw - 28px));
  border: 1px solid #7d8794;
  padding: 0;
  box-shadow: 0 20px 55px rgba(15, 23, 42, .25);
}
dialog::backdrop { background: rgba(15, 23, 42, .35); }
.dialog-form { background: #f5f6f8; }
.dialog-head {
  height: 42px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: white;
  border-bottom: 1px solid #d3d7dd;
}
.dialog-head strong { flex: 1; }
.dialog-head button {
  width: 36px;
  padding: 0;
  background: white;
  border: none;
  font-size: 24px;
}
.detail-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  padding: 8px 12px 0;
}
fieldset {
  border: 1px solid #d6dae0;
  margin: 0 0 8px;
  padding: 10px 12px 12px;
  background: #f7f8fa;
}
legend { color: #334155; font-weight: 600; }
.form-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, .9fr) minmax(0, .9fr);
  gap: 10px 14px;
}
.form-grid label { grid-template-columns: 136px minmax(0, 1fr); }
.form-grid .wide { grid-column: span 2; }
.student-card {
  background: linear-gradient(180deg, #ffffff, #f6f9fc);
}
.student-view-grid {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.detail-photo {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.detail-photo img {
  width: 116px;
  height: 148px;
  object-fit: cover;
  background: white;
  border: 1px solid #cbd5e1;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .12);
}
.student-fields {
  display: grid;
  grid-template-columns: 300px 190px 150px;
  gap: 9px 12px;
  align-items: center;
}
.student-fields label {
  grid-template-columns: 76px minmax(0, 1fr);
}
.student-fields .name-field {
  grid-column: span 1;
}
.student-fields .name-field input {
  max-width: 210px;
}
.student-fields .id-field {
  grid-template-columns: 70px minmax(0, 1fr);
  min-width: 0;
}
.student-fields label:nth-child(3) {
  width: 200px;
}
.student-fields label:nth-child(4) {
  width: 178px;
}
.student-fields label:nth-child(5) {
  width: 150px;
}
.student-fields label:nth-child(6) {
  width: 200px;
}
.detail-address-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  max-width: 900px;
}
.detail-address-row fieldset {
  margin-bottom: 8px;
}
.address-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.address-grid label { grid-template-columns: 76px minmax(0, 1fr); }
.address-grid input {
  max-width: 360px;
}
.detail-main input[readonly],
.detail-main select:disabled {
  background: #f8fafc;
  color: #1f2937;
  opacity: 1;
}
#dHangDaoTao,
#dHangGPLXDaCo,
#dSoGPLX,
#dSoNamLX,
#dSoKmLXAnToan {
  max-width: 96px;
}
#dGhiChu {
  max-width: 430px;
}
.red { color: #ff2020; }
.check { display: flex; gap: 8px; align-items: center; }
.check input { width: 16px; height: 16px; }
.dialog-actions {
  height: 76px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
#toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 100000;
  min-width: 260px;
  max-width: 520px;
  padding: 12px 16px;
  background: #123b63;
  color: white;
  opacity: 0;
  transform: translateY(10px);
  transition: .2s;
  pointer-events: none;
}
#toast.show { opacity: 1; transform: translateY(0); }

.training-student-validation-dialog {
  width: min(1500px, calc(100vw - 24px));
  max-width: none;
  max-height: calc(100vh - 32px);
  padding: 0;
  border: 0;
}
.training-student-validation-dialog .dialog-form { max-height: calc(100vh - 32px); }
.training-student-validation-body { padding: 18px 20px 0; overflow: auto; }
.training-eligibility-legal {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 12px;
  padding: 13px 16px;
  border-left: 4px solid #1479b8;
  background: #f0f7fc;
  color: #173f62;
}
.training-eligibility-legal strong { white-space: nowrap; font-size: 15px; }
.training-student-validation-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid #bfd3e6;
  background: #eef7ff;
}
.training-student-validation-summary > div {
  min-width: 145px;
  padding-right: 18px;
  border-right: 1px solid #c8d9e8;
}
.training-student-validation-summary small { display: block; margin-bottom: 3px; color: #5c7185; }
.training-student-validation-summary strong { display: block; color: #153b5d; font-size: 19px; }
.training-student-validation-summary .summary-ready strong { color: #08783e; }
.training-student-validation-summary .summary-supplement strong { color: #b54708; }
.training-student-validation-summary .summary-source { min-width: 270px; border-right: 0; }
.training-student-validation-summary .summary-source strong { font-size: 15px; }
.training-student-validation-summary .summary-source span { display: block; margin-top: 3px; color: #5c7185; font-size: 12px; }
.training-student-validation-body .grid-wrap { max-height: 58vh; }
.training-student-validation-body table { min-width: 1360px; }
.training-student-validation-body th { position: sticky; top: 0; z-index: 2; }
.eligibility-person { min-width: 185px; text-align: left !important; }
.eligibility-person strong,
.eligibility-person small { display: block; }
.eligibility-person small { margin-top: 5px; color: #5c7185; }
.eligibility-criterion { min-width: 170px; text-align: left !important; vertical-align: top; }
.eligibility-criterion small,
.eligibility-criterion em,
.eligibility-conclusion small { display: block; margin-top: 7px; white-space: normal; line-height: 1.35; }
.eligibility-criterion em { color: #5c7185; font-size: 11px; font-style: normal; }
.eligibility-pill {
  display: inline-block;
  padding: 4px 8px;
  border: 1px solid #ccd6df;
  border-radius: 999px;
  background: #f3f5f7;
  color: #405466;
  font-size: 12px;
  font-weight: 700;
}
.eligibility-pass { border-color: #8bd4ad; background: #e8f8ef; color: #08783e; }
.eligibility-fail { border-color: #f0a49e; background: #fff0ef; color: #b42318; }
.eligibility-missing,
.eligibility-review { border-color: #efc66e; background: #fff7df; color: #985f00; }
.eligibility-in_progress { border-color: #98bde0; background: #edf6ff; color: #155b91; }
.eligibility-dossier .eligibility-pill { display: block; width: fit-content; margin-bottom: 6px; }
.eligibility-conclusion { min-width: 210px; text-align: left !important; vertical-align: top; }
.training-eligibility-note {
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px solid #ead89b;
  background: #fffbed;
  color: #5f4a13;
  line-height: 1.45;
}
.validation-ok { color: #08783e; font-weight: 700; }
.validation-error { color: #b42318; font-weight: 700; }
.validation-message { white-space: normal; line-height: 1.45; min-width: 360px; }
.validation-all-ok { padding: 24px !important; color: #08783e; font-weight: 700; text-align: center; }

.app-footer {
  min-height: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 6px 14px;
  border-top: 1px solid #b7cadf;
  background: #eaf2fb;
  color: #123b63;
  font-size: 13px;
  font-weight: 600;
}
.app-footer-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}
.app-footer-copy {
  color: #334155;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
}
.change-request-filters {
  display: grid;
  grid-template-columns: repeat(6, minmax(130px, 1fr)) auto auto;
  gap: 8px;
  align-items: end;
  padding: 10px 12px;
  background: #eef4f9;
  border-bottom: 1px solid #b8c9d8;
}
.change-request-filters label {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.change-request-filters input,
.change-request-filters select {
  width: 100%;
}
.change-request-operation-message {
  margin: 8px 12px;
  padding: 10px 14px;
  border: 1px solid #8eb9da;
  border-left: 4px solid #1976b9;
  border-radius: 4px;
  background: #eef7fd;
  color: #123b63;
  line-height: 1.45;
}
.change-request-operation-message[hidden] {
  display: none;
}
.change-request-operation-message.success {
  border-color: #82c59c;
  border-left-color: #168246;
  background: #eefaf2;
  color: #155d34;
}
.change-request-operation-message.warning {
  border-color: #e2bd67;
  border-left-color: #d18a00;
  background: #fff8e7;
  color: #765000;
}
.change-request-operation-message.error {
  border-color: #e1a0a0;
  border-left-color: #c62828;
  background: #fff1f1;
  color: #8c1d1d;
}
.change-request-operation-message ul {
  margin: 6px 0 0 20px;
  padding: 0;
}
.change-request-grid {
  height: calc(100vh - 235px);
  min-height: 420px;
}
.change-request-grid td:nth-child(7),
.change-request-grid td:nth-child(11) {
  text-align: left;
  min-width: 180px;
  white-space: normal;
}
.change-request-check {
  width: 38px;
  min-width: 38px;
  max-width: 38px;
  text-align: center;
}
.dkkh-ai-preview-actions {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #d8e2ec;
  text-align: center;
}
.dkkh-ai-preview-actions strong {
  display: block;
  margin-bottom: 8px;
  color: #0f5f9f;
}
.dkkh-ai-preview-actions > div {
  display: flex;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
}
.dkkh-ai-status {
  display: block;
  margin-top: 8px;
  color: #475569;
  line-height: 1.35;
  text-align: center;
}
.change-request-check input {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: #0b82d8;
}
#changeRequestTable tbody tr.selected,
#changeRequestTable tbody tr.selected:nth-child(even),
#changeRequestTable tbody tr.selected > td {
  background: #0b82d8 !important;
  color: #fff !important;
}
#changeRequestTable tbody tr.selected > td {
  border-color: #7fc1ef;
}
#gpxtlVehicleTable tbody tr.selected,
#gpxtlVehicleTable tbody tr.selected:nth-child(even),
#gpxtlVehicleTable tbody tr.selected > td {
  background: #0b82d8 !important;
  color: #fff !important;
}
#gpxtlVehicleTable tbody tr.selected > td {
  border-color: #7fc1ef;
}
.change-badge,
.change-status {
  display: inline-block;
  padding: 2px 6px;
  border: 1px solid #d5a72f;
  border-radius: 3px;
  background: #fff6d8;
  color: #6d4c00;
  font-weight: 600;
  white-space: nowrap;
}
.change-status.Approved { border-color: #55a878; background: #e4f5eb; color: #17643a; }
.change-status.Rejected { border-color: #d87373; background: #fde8e8; color: #9b1c1c; }
.change-status.Cancelled { border-color: #9ba8b4; background: #edf1f4; color: #48545f; }
.change-status.NeedsReview { border-color: #d97706; background: #fff0d5; color: #92400e; }
.change-dialog {
  width: min(1050px, calc(100vw - 32px));
  max-width: none;
  padding: 0;
  border: 1px solid #7f98ad;
}
.change-dialog.wide-dialog { width: min(1250px, calc(100vw - 24px)); }
.change-dialog::backdrop { background: rgba(15, 23, 42, .48); }
.change-dialog-context,
.change-review-meta {
  padding: 9px 14px;
  background: #edf4fa;
  border-bottom: 1px solid #c6d5e2;
  font-weight: 600;
}
.change-photo-panel {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 14px;
  padding: 12px 14px;
  border-bottom: 1px solid #cbd5df;
  background: #f8fafc;
}
.change-photo-panel[hidden] { display: none; }
.change-photo-preview {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 7px;
}
.change-photo-preview img {
  width: 96px;
  height: 128px;
  object-fit: cover;
  border: 1px solid #8fa5b8;
  background: #fff;
}
.change-photo-preview span { color: #64748b; padding-top: 45px; }
.change-photo-controls { display: grid; align-content: start; gap: 10px; }
.change-photo-controls label { display: grid; gap: 5px; white-space: normal; }
.change-photo-controls input[type="file"] { width: 100%; }
.change-photo-controls > div { display: flex; gap: 8px; flex-wrap: wrap; }
.change-photo-controls p { margin: 0; color: #52606d; line-height: 1.4; }
.portrait-processing-dialog {
  width: min(1040px, calc(100vw - 24px));
  max-width: none;
  padding: 0;
  border: 1px solid #7890a5;
}
.portrait-processing-dialog::backdrop { background: rgba(15, 23, 42, .56); }
.portrait-processing-body { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; padding: 14px; max-height: calc(100vh - 150px); overflow: auto; }
.portrait-drop-zone { min-height: 86px; display: grid; place-content: center; gap: 6px; text-align: center; border: 2px dashed #6f9fc5; border-radius: 6px; background: #f1f7fc; color: #174e78; cursor: pointer; }
.portrait-drop-zone.dragging { border-color: #0c75b8; background: #e1f1fc; }
.portrait-drop-zone span { color: #61758a; font-size: 12px; }
.portrait-guidance { padding: 10px 14px; border: 1px solid #cbd8e3; border-radius: 5px; background: #fff; }
.portrait-guidance ul { margin: 7px 0 0; padding-left: 19px; line-height: 1.5; }
.portrait-progress { grid-column: 1 / -1; padding: 10px 14px; border-left: 4px solid #2680b9; background: #eef6fb; }
.portrait-progress ol { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 8px 0; padding-left: 20px; color: #60758a; }
.portrait-progress li.active { color: #126ba4; font-weight: 700; }
.portrait-progress li.done { color: #157347; font-weight: 600; }
.portrait-progress.error { border-left-color: #c23b3b; background: #fff0f0; }
.portrait-progress.error strong, .portrait-progress.error p { color: #9f2424; }
.portrait-progress p { margin: 4px 0 0; }
.portrait-comparison { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.portrait-comparison[hidden], .portrait-manual-crop[hidden], .portrait-warnings[hidden] { display: none; }
.portrait-comparison figure { margin: 0; display: grid; justify-items: center; gap: 8px; }
.portrait-comparison figcaption { font-weight: 700; color: #164d75; }
.portrait-preview-frame { width: min(270px, 100%); aspect-ratio: 3 / 4; border: 1px solid #90a7ba; background: #e9eef2; overflow: hidden; }
.portrait-preview-frame img { width: 100%; height: 100%; object-fit: contain; display: block; }
.portrait-manual-crop { grid-column: 1 / -1; display: grid; justify-items: center; gap: 9px; padding: 12px; border: 1px solid #bdd0df; background: #f7fafc; }
.portrait-manual-crop canvas { width: min(600px, 100%); max-height: 500px; border: 1px solid #7f98ad; background: #263746; cursor: move; touch-action: none; }
.portrait-manual-crop label { width: min(600px, 100%); display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; }
.portrait-manual-crop p { margin: 0; color: #52687a; text-align: center; }
.portrait-warnings { grid-column: 1 / -1; margin: 0; padding: 9px 12px; border-left: 4px solid #d69e2e; background: #fff8df; color: #745400; }
.portrait-actions { flex-wrap: wrap; }
@media (max-width: 720px) {
  .portrait-processing-body { grid-template-columns: 1fr; }
  .portrait-comparison { grid-template-columns: 1fr; }
  .portrait-guidance { grid-column: 1; }
}
.change-review-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 12px 14px;
  border-bottom: 1px solid #cbd5df;
  background: #f8fafc;
}
.change-review-photos[hidden] { display: none; }
.change-review-photos figure { margin: 0; display: grid; justify-items: center; gap: 7px; }
.change-review-photos figcaption { font-weight: 700; }
.change-review-photos img {
  width: 120px;
  height: 160px;
  object-fit: cover;
  border: 1px solid #8fa5b8;
  background: #fff;
}
.change-review-photos span { color: #64748b; padding: 58px 0; }
.photo-viewer-dialog {
  width: min(520px, calc(100vw - 24px));
  padding: 0;
  border: 1px solid #7f98ad;
}
.photo-viewer-dialog::backdrop { background: rgba(15, 23, 42, .55); }
.photo-viewer-body {
  min-height: 420px;
  display: grid;
  place-items: center;
  padding: 18px;
  background: #eef3f7;
}
.photo-viewer-body img {
  display: block;
  max-width: 100%;
  max-height: 68vh;
  object-fit: contain;
  border: 1px solid #8fa5b8;
  background: #fff;
}
.photo-viewer-body span { color: #64748b; }
.change-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 10px 12px;
  max-height: 58vh;
  overflow: auto;
  padding: 14px;
}
.change-form-grid label,
.change-reason {
  display: grid;
  gap: 4px;
}
.change-form-grid input,
.change-form-grid select,
.change-reason textarea {
  width: 100%;
  box-sizing: border-box;
}
.change-form-grid input:disabled {
  background: #e9eef2;
  color: #334155;
}
.change-reason { padding: 0 14px 12px; }
.change-reason textarea { resize: vertical; min-height: 66px; }
.change-history-grid { max-height: 62vh; }
.change-compare-grid { max-height: 56vh; margin: 12px 14px; border: 1px solid #b8c9d8; }
.change-compare-grid td { text-align: left; white-space: normal; }
.change-compare-grid td:first-child { width: 220px; font-weight: 600; }
.change-compare-grid tr.changed-field td { background: #fff4cc; }
button.danger { background: #b42318; border-color: #8f1c13; color: #fff; }
.required-field-label { display: inline-flex; align-items: baseline; gap: 2px; white-space: nowrap; min-width: 0; }
.required-marker { color: #dc2626; font-weight: 700; line-height: 1; }
input.required-invalid { border-color: #dc2626 !important; box-shadow: 0 0 0 1px #dc2626 inset; background: #fff7f7; }
.internal-approval-warning {
  padding: 10px 14px;
  border-bottom: 1px solid #d8b04c;
  background: #fff6d8;
  color: #684900;
  font-weight: 700;
}
.internal-approval-records {
  max-height: 210px;
  overflow: auto;
  padding: 12px 14px;
  border-bottom: 1px solid #cbd5df;
}
.internal-approval-records > strong { display: block; margin-bottom: 7px; }
.internal-approval-records > div {
  display: grid;
  grid-template-columns: 180px 120px minmax(260px, 1fr);
  gap: 10px;
  padding: 5px 0;
  border-top: 1px solid #e2e8ef;
}
.internal-approval-records em { font-style: normal; }
.internal-approval-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  padding: 14px;
}
.internal-approval-form label { display: grid; gap: 4px; }
.internal-approval-form .wide { grid-column: 1 / -1; }
.internal-approval-form input,
.internal-approval-form select,
.internal-approval-form textarea { width: 100%; box-sizing: border-box; }
.license-internally-approved td { background: #e4f5eb; }
.digital-sign-summary span { display: block; }

.license-content-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 420px;
  gap: 12px;
  padding: 12px;
  min-height: calc(100vh - 230px);
  background: #eef3f7;
}
.license-content-list { min-width: 0; }
.license-content-list .toolbar { margin: 0 0 8px; }
.license-content-grid {
  height: calc(100vh - 300px);
  min-height: 360px;
  background: #fff;
}
#licenseContentConfigTable { min-width: 1180px; }
#licenseContentConfigTable th:nth-child(1) { width: 45px; }
#licenseContentConfigTable th:nth-child(2),
#licenseContentConfigTable th:nth-child(3) { width: 95px; }
#licenseContentConfigTable th:nth-child(5) { width: 105px; }
#licenseContentConfigTable th:nth-child(6) { width: 70px; }
#licenseContentConfigTable th:nth-child(7) { width: 105px; }
#licenseContentConfigTable th:nth-child(8) { width: 145px; }
#licenseContentConfigTable td { vertical-align: top; }
#licenseContentConfigTable .license-content-cell {
  min-width: 430px;
  white-space: normal;
  text-align: left;
  line-height: 1.35;
}
.license-content-form {
  align-self: start;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  padding: 14px;
  border: 1px solid #b8c8d6;
  background: #fff;
}
.license-content-form > strong,
.license-content-form .wide,
.license-content-form .license-content-note,
.license-content-form .account-actions { grid-column: 1 / -1; }
.license-content-form label { display: grid; gap: 4px; }
.license-content-form input,
.license-content-form select,
.license-content-form textarea { width: 100%; box-sizing: border-box; }
.license-content-form textarea { resize: vertical; line-height: 1.45; }
.license-content-form :disabled { background: #e9eef2; color: #4b5563; }
.license-content-note { color: #52606d; font-size: 12px; line-height: 1.4; }

@media (max-width: 1200px) {
  .student-filter-fields { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
  .student-birth-filter { grid-column: 1 / -1; grid-template-columns: minmax(180px, 1fr) auto; }
  .change-request-filters { grid-template-columns: repeat(4, minmax(140px, 1fr)); }
  .change-form-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
  .license-content-layout { grid-template-columns: 1fr; }
  .license-content-grid { height: 420px; }
}

@media (max-width: 1000px) {
  .topbar { height: auto; min-height: 72px; flex-wrap: wrap; padding: 14px; gap: 12px; }
  .tabs { overflow-x: auto; }
  .account-layout { grid-template-columns: 1fr; }
  .student-filter-fields { grid-template-columns: 1fr 1fr; }
  .grid-wrap { height: 52vh; }
  .form-grid, .address-grid, .student-view-grid, .student-fields, .detail-address-row { grid-template-columns: 1fr; }
  .form-grid .wide { grid-column: span 1; }
  .student-fields .name-field { grid-column: span 1; }
  .detail-photo { justify-content: flex-start; }
  .receive-file, .receive-grid, .receive-work { grid-template-columns: 1fr; }
  .dkkh-xml-tools { align-items: stretch; flex-direction: column; }
  .dkkh-xml-actions { flex-wrap: wrap; }
  .receive-table-wrap { height: 46vh; }
  .manager-filters, .verify-layout { grid-template-columns: 1fr; }
  .manager-grid, .verify-panel { height: auto; max-height: none; }
  .app-footer-main { flex-wrap: wrap; gap: 8px 18px; }
}

@media (max-width: 520px) {
  .student-filter-fields { grid-template-columns: 1fr; }
  .student-birth-filter { grid-column: auto; grid-template-columns: 1fr; }
  .student-filter-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .student-filter-actions button { width: 100%; min-width: 0; }
  .account-permissions { grid-template-columns: 1fr; }
  .change-photo-panel { grid-template-columns: 1fr; }
}

/* Modern administrative shell */
:root {
  --ui-primary: #1769aa;
  --ui-primary-dark: #0f4f85;
  --ui-bg: #f4f7fb;
  --ui-card: #ffffff;
  --ui-text: #1f2937;
  --ui-muted: #64748b;
  --ui-border: #d8e1eb;
  --ui-success: #16a34a;
  --ui-warning: #d97706;
  --ui-danger: #dc2626;
  --sidebar-width: 258px;
}
body { background: var(--ui-bg); color: var(--ui-text); font-size: 14px; }
#appShell:not([hidden]) {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  grid-template-rows: 68px minmax(0, 1fr);
  background: var(--ui-bg);
}
.tabs {
  grid-column: 1;
  grid-row: 1 / -1;
  position: sticky;
  top: 0;
  z-index: 30;
  width: var(--sidebar-width);
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow-y: hidden;
  padding: 0 10px 8px;
  box-sizing: border-box;
  background: #0f4f85;
  border: 0;
}
.sidebar-brand {
  min-height: 68px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 8px;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.14);
  margin-bottom: 10px;
}
.sidebar-brand span {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  flex: 0 0 36px;
  border: 1px solid rgba(255,255,255,.7);
  font-weight: 800;
}
.sidebar-brand strong {
  line-height: 1.25;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
}
.tabs .tab {
  width: 100%;
  min-height: 40px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 8px 12px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #dbeafe;
  text-align: left;
  white-space: normal;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
}
.tabs .tab:hover { background: rgba(255,255,255,.09); color: #fff; }
.tabs .tab.active { background: #fff; color: var(--ui-primary-dark); }
.tabs .dashboard-tab { margin-bottom: 2px; }
.sidebar-nav-group { width: 100%; }
.sidebar-nav-group-trigger {
  width: 100%;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #dbeafe;
  text-align: left;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
}
.sidebar-nav-group-trigger:hover,
.sidebar-nav-group.active > .sidebar-nav-group-trigger { background: rgba(255,255,255,.09); color: #fff; }
.sidebar-nav-chevron { font-size: 12px; transition: transform .18s ease; }
.sidebar-nav-group-trigger[aria-expanded="true"] .sidebar-nav-chevron { transform: rotate(180deg); }
.sidebar-nav-submenu { display: grid; gap: 2px; padding: 2px 0 4px 12px; }
.sidebar-nav-submenu[hidden] { display: none; }
.tabs .sidebar-subtab {
  min-height: 34px;
  padding: 6px 10px 6px 16px;
  font-size: 13px;
  position: relative;
}
.tabs .sidebar-subtab::before {
  content: "";
  position: absolute;
  left: 5px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: .7;
}
.nav-user {
  width: 100%;
  height: auto;
  min-height: 0;
  margin: auto 0 0;
  padding: 8px 0 0;
  display: grid;
  gap: 5px;
  flex: 0 0 auto;
  border-top: 1px solid rgba(255,255,255,.14);
}
.nav-user .admin-menu-trigger,
.nav-user .ghost { width: 100%; height: 34px; min-height: 34px; color: #fff; background: rgba(255,255,255,.08); border: 0; font-family: inherit; font-size: 14px; font-weight: 700; letter-spacing: 0; }
.system-admin-menu { position: static; width: 100%; box-shadow: none; border: 0; background: rgba(0,0,0,.12); }
.system-admin-menu button { color: #fff; background: transparent; border: 0; text-align: left; }
.workspace-header {
  grid-column: 2;
  grid-row: 1;
  position: sticky;
  top: 0;
  z-index: 25;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 20px;
  background: #fff;
  border-bottom: 1px solid var(--ui-border);
  box-shadow: 0 2px 8px rgba(15, 43, 73, .05);
}
.sidebar-toggle { width: 40px; min-width: 40px; height: 40px; padding: 0; font-size: 19px; }
.workspace-heading { display: grid; gap: 3px; min-width: 0; }
.workspace-heading span { color: var(--ui-muted); font-size: 12px; }
.workspace-heading strong { font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.workspace-account { margin-left: auto; display: flex; align-items: center; gap: 9px; }
.workspace-account > span:last-child { display: grid; gap: 2px; }
.workspace-account small { color: var(--ui-muted); }
.workspace-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: #e6f1fb; color: var(--ui-primary); font-weight: 800; }
.app-page,
.app-footer {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
}
.app-page { padding-bottom: 54px; }
.app-footer { position: fixed; left: var(--sidebar-width); right: 0; bottom: 0; z-index: 18; min-height: 42px; background: #fff; border-top: 1px solid var(--ui-border); }
.app-page.active-page { display: block; background: var(--ui-bg); }
.section-title { min-height: 52px; height: auto; padding: 15px 20px; background: transparent; color: var(--ui-text); font-size: 18px; text-transform: none; border: 0; }
.overview-head { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin: 20px 24px 4px; padding: 25px 28px; overflow: hidden; position: relative; color: #fff; border: 1px solid rgba(255,255,255,.25); border-radius: 18px; background: linear-gradient(118deg,#0c4f83 0%,#0875b7 58%,#1199b7 100%); box-shadow: 0 14px 30px rgba(13,79,128,.18); }
.overview-head::before { content: ""; position: absolute; width: 320px; height: 320px; right: -110px; top: -170px; border-radius: 50%; border: 55px solid rgba(255,255,255,.08); }
.overview-head::after { content: ""; position: absolute; width: 160px; height: 160px; right: 240px; bottom: -125px; border-radius: 50%; background: rgba(255,255,255,.07); }
.overview-head-copy,.overview-head-summary { position: relative; z-index: 1; }
.overview-eyebrow,.overview-panel-kicker { display: block; margin-bottom: 6px; color: #bfe9ff; font-size: 11px; font-weight: 800; letter-spacing: 1.15px; }
.overview-head h1 { margin: 0 0 8px; color: #fff; font-size: clamp(24px,2.2vw,32px); letter-spacing: -.35px; }
.overview-head p { max-width: 650px; margin: 0; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.5; }
.overview-head-summary { min-width: 300px; display: flex; align-items: center; justify-content: flex-end; gap: 16px; padding: 12px 16px; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; background: rgba(4,49,83,.23); backdrop-filter: blur(4px); }
.overview-head-summary > div:last-child { min-width: 142px; display: grid; gap: 3px; }
.overview-head-summary > div:last-child > span { color: rgba(255,255,255,.78); font-size: 12px; }
.overview-head-summary > div:last-child > strong { color: #fff; font-size: 28px; line-height: 1.1; }
.overview-updated { color: rgba(255,255,255,.72); font-size: 11px; white-space: nowrap; }
.overview-progress-ring { --overview-progress: 0deg; width: 76px; height: 76px; flex: 0 0 76px; display: grid; place-content: center; text-align: center; border-radius: 50%; background: radial-gradient(circle at center,#0b679d 0 57%,transparent 59%),conic-gradient(#79e1b1 0 var(--overview-progress),rgba(255,255,255,.18) var(--overview-progress) 360deg); }
.overview-progress-ring strong { color: #fff; font-size: 17px; line-height: 1; }
.overview-progress-ring span { margin-top: 4px; color: rgba(255,255,255,.72); font-size: 9px; }
.overview-cards { display: grid; grid-template-columns: repeat(4,minmax(160px,1fr)); gap: 14px; padding: 16px 24px 14px; }
.overview-cards article { --card-accent:#2679b9; display: flex; align-items: center; gap: 15px; min-height: 110px; padding: 18px; background: linear-gradient(145deg,#fff,#fbfdff); border: 1px solid #dce7ef; border-radius: 14px; box-shadow: 0 6px 18px rgba(15,43,73,.065); overflow: hidden; position: relative; transition: transform .18s ease,box-shadow .18s ease; }
.overview-cards article:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15,43,73,.11); }
.overview-cards article::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--card-accent); }
.overview-cards article::after { content: ""; position: absolute; width: 84px; height: 84px; right: -42px; top: -42px; border-radius: 50%; background: color-mix(in srgb,var(--card-accent) 9%,transparent); }
.overview-cards article.training { --card-accent:#1684cf; }
.overview-cards article.completed { --card-accent:#1d9a64; }
.overview-cards article.courses { --card-accent:#d88918; }
.overview-stat > i { width: 50px; height: 50px; flex: 0 0 50px; display: grid; place-items: center; border-radius: 15px; background: color-mix(in srgb,var(--card-accent) 11%,white); color: var(--card-accent); font-style: normal; font-weight: 850; box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--card-accent) 14%,transparent); }
.overview-stat > div { min-width: 0; display: grid; gap: 4px; align-items: end; }
.overview-cards article span { color: #516b80; font-weight: 700; }
.overview-cards article small { color: var(--ui-muted); font-size: 11px; }
.overview-cards article strong { font-size: 30px; line-height: 1; color: var(--card-accent); }
.overview-dashboard-grid { display: grid; grid-template-columns: minmax(540px,1.45fr) minmax(370px,1fr); gap: 14px; padding: 0 24px 12px; }
.overview-panel { min-width: 0; background: #fff; border: 1px solid #dce7ef; border-radius: 14px; box-shadow: 0 5px 18px rgba(15,43,73,.055); overflow: hidden; }
.overview-panel > header { min-height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 18px; border-bottom: 1px solid #e3edf5; background: linear-gradient(180deg,#fff,#f7fbfe); }
.overview-panel-kicker { margin-bottom: 4px; color: #1680bd; font-size: 10px; }
.overview-panel h2 { margin: 0 0 4px; font-size: 18px; color: #173d5d; }
.overview-panel header p { margin: 0; color: var(--ui-muted); font-size: 12px; }
.overview-legend { display: flex; gap: 12px; color: #5b7082; font-size: 11px; white-space: nowrap; }
.overview-legend span::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 3px; background: #1684cf; }
.overview-legend span.done::before { background: #21a06a; }
.overview-rank-list { max-height: 430px; overflow: auto; padding: 8px 18px 12px; }
.overview-rank-row { display: grid; grid-template-columns: 118px minmax(0,1fr); gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid #edf2f6; }
.overview-rank-row:last-child { border-bottom: 0; }
.overview-rank-name { display: grid; gap: 2px; }
.overview-rank-name b { color: #173d5d; }
.overview-rank-name small { color: var(--ui-muted); font-size: 11px; }
.overview-rank-visual { min-width: 0; display: grid; gap: 5px; }
.overview-rank-meter { width: 100%; height: 14px; display: block; overflow: hidden; border-radius: 9px; filter: drop-shadow(0 1px 1px rgba(15,43,73,.08)); }
.overview-rank-meter .track { fill: #edf3f7; }
.overview-rank-meter .active { fill: #218bc9; }
.overview-rank-meter .done { fill: #2faa74; }
.overview-rank-counts { display: flex; align-items: center; gap: 13px; color: #526a7d; font-size: 11px; }
.overview-rank-counts span { display: inline-flex; align-items: center; gap: 4px; }
.overview-rank-counts i { width: 7px; height: 7px; border-radius: 50%; background: #1684cf; }
.overview-rank-counts i.done { background: #21a06a; }
.overview-rank-counts em { margin-left: auto; color: #73879a; font-style: normal; }
.overview-loading { min-height: 90px; display: grid; place-items: center; color: var(--ui-muted); }
.overview-center-table-wrap { max-height: 430px; overflow: auto; padding: 0 8px 8px; }
#overviewCenterTable { width: 100%; table-layout: fixed; border: 0; }
#overviewCenterTable thead th { position: sticky; top: 0; z-index: 1; background: #eef5fa; }
#overviewCenterTable tbody tr { transition: background .15s ease; }
#overviewCenterTable tbody tr:hover { background: #eff8fe; }
#overviewCenterTable th:first-child { width: auto; text-align: left; }
#overviewCenterTable th:nth-child(2), #overviewCenterTable th:nth-child(3) { width: 88px; }
#overviewCenterTable td:first-child { text-align: left; overflow: hidden; }
#overviewCenterTable td b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #294861; font-weight: 600; }
#overviewCenterTable td small { display: block; margin-top: 2px; color: #8091a0; }
.overview-number { display: inline-grid; min-width: 46px; min-height: 28px; place-items: center; border-radius: 7px; background: #e7f4fd; color: #0874bd; font-weight: 750; }
.overview-number.done { background: #e7f7ef; color: #168657; }
.overview-welcome { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 2px 24px 12px; padding: 17px 18px; background: #fff; border: 1px solid #dce7ef; border-radius: 14px; box-shadow: 0 4px 14px rgba(15,43,73,.045); }
.overview-welcome h2 { margin: 0 0 3px; color: #173d5d; font-size: 17px; }
.overview-welcome p { margin: 0; color: var(--ui-muted); font-size: 12px; }
.overview-welcome nav { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.overview-welcome button { min-height: 45px; display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 6px; color: #244b68; background: #f7fafc; border-color: #d5e2ec; border-radius: 10px; font-weight: 700; }
.overview-welcome button:hover { color: #075f9c; background: #eef8fe; border-color: #9ccce8; }
.overview-welcome button i { width: 33px; height: 33px; display: grid; place-items: center; color: #0b6ea9; background: #dff1fc; border-radius: 8px; font-size: 10px; font-style: normal; font-weight: 850; }
button { min-height: 36px; border-radius: 5px; border-color: var(--ui-border); }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(23,105,170,.2); outline-offset: 1px; }
button:disabled { opacity: .55; cursor: not-allowed; }
button.primary { background: var(--ui-primary); border-color: var(--ui-primary); }
button.primary:hover { background: var(--ui-primary-dark); }
th { height: 42px; background: #e9f1f8; color: #243b53; border-color: var(--ui-border); }
td { height: 40px; border-color: #e2e8f0; }
tbody tr:nth-child(even) { background: #f8fbfd; }

/* Account management */
.account-page-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 24px 10px; }
.account-page-head h1 { margin: 0 0 5px; font-size: 24px; letter-spacing: 0; }
.account-page-head p { margin: 0; color: var(--ui-muted); }
.account-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(150px,1fr)); gap: 12px; padding: 12px 24px; }
.account-stat-grid article { min-height: 86px; display: grid; align-content: center; gap: 7px; padding: 14px 16px; background: #fff; border: 1px solid var(--ui-border); border-radius: 8px; box-shadow: 0 3px 12px rgba(15,43,73,.05); }
.account-stat-grid span { color: var(--ui-muted); }
.account-stat-grid strong { font-size: 25px; color: var(--ui-primary-dark); }
.account-toolbar-new { display: grid; grid-template-columns: minmax(240px,1fr) 190px 190px auto auto; gap: 10px; align-items: end; margin: 4px 24px 12px; padding: 12px; background: #fff; border: 1px solid var(--ui-border); border-radius: 8px; }
.account-toolbar-new label { display: grid; grid-template-columns: 1fr; gap: 5px; color: var(--ui-muted); white-space: normal; }
.account-toolbar-new input, .account-toolbar-new select { width: 100%; height: 36px; box-sizing: border-box; }
.account-layout { display: block; padding: 0 24px; background: transparent; }
.account-grid { height: auto; min-height: 200px; max-height: calc(100vh - 405px); overflow: auto; background: #fff; border: 1px solid var(--ui-border); border-radius: 8px; box-shadow: 0 3px 12px rgba(15,43,73,.05); }
#webUserTable { width: 100%; table-layout: fixed; }
#webUserTable th:nth-child(1) { width: 50px; }
#webUserTable th:nth-child(2) { width: 125px; }
#webUserTable th:nth-child(3) { width: 180px; }
#webUserTable th:nth-child(4) { width: 125px; }
#webUserTable th:nth-child(5) { width: 300px; }
#webUserTable th:nth-child(6) { width: 130px; }
#webUserTable th:nth-child(7) { width: 180px; }
#webUserTable th:nth-child(8) { width: 125px; }
#webUserTable td { height: 48px; max-width: none; }
.role-badge, .status-badge { display: inline-flex; align-items: center; gap: 6px; min-height: 25px; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.role-badge { color: #075985; background: #e0f2fe; }
.status-badge.active { color: #166534; background: #dcfce7; }
.status-badge.locked { color: #9a3412; background: #ffedd5; }
.status-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.permission-summary { display: flex; gap: 5px; align-items: center; overflow: hidden; }
.permission-chip { max-width: 120px; padding: 3px 7px; border-radius: 4px; background: #eef3f8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.permission-more { color: var(--ui-primary); font-weight: 700; cursor: help; white-space: nowrap; }
.account-row-actions { display: flex; justify-content: center; gap: 5px; }
.account-row-actions button { min-height: 30px; height: 30px; padding: 0 9px; }
.account-row-actions .account-delete-action { color: #a61b1b; border-color: #dda6a6; background: #fff3f3; }
.account-row-actions .account-delete-action:hover:not(:disabled) { color: #fff; border-color: #b42323; background: #c73535; }
.account-row-actions .account-delete-action:disabled { color: #9aa7b2; border-color: #d6dde3; background: #f1f3f5; cursor: not-allowed; }
.account-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 10px 24px 16px; color: var(--ui-muted); }
.account-pagination > span:first-child { margin-right: auto; }
.account-pagination label { display: flex; align-items: center; gap: 7px; }

.account-dialog { width: min(980px, calc(100vw - 32px)); max-width: 980px; max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: 10px; box-shadow: 0 24px 70px rgba(15,23,42,.28); }
.account-dialog::backdrop { background: rgba(15,23,42,.48); }
.account-dialog .account-form { width: 100%; max-height: calc(100vh - 32px); overflow: auto; box-sizing: border-box; border: 0; padding: 0; gap: 0; }
.account-dialog-head { position: sticky; top: 0; z-index: 3; display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; background: #fff; border-bottom: 1px solid var(--ui-border); }
.account-dialog-head > div { display: grid; gap: 3px; }
.account-dialog-head strong { font-size: 18px; }
.account-dialog-head span { color: var(--ui-muted); }
.account-dialog-head button { width: 36px; padding: 0; font-size: 22px; }
.account-general-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; padding: 18px 20px; }
.account-general-fields label, .account-form > label { grid-template-columns: 130px minmax(0,1fr); }
.permission-tools { display: flex; align-items: end; gap: 12px; padding: 12px 20px; background: #f8fafc; border-block: 1px solid var(--ui-border); }
.permission-tools label { display: grid; grid-template-columns: 90px minmax(220px,1fr); align-items: center; }
.permission-tools span { margin-left: auto; color: var(--ui-muted); }
.account-dialog .account-permissions { grid-template-columns: repeat(2,minmax(0,1fr)); margin: 16px 20px; max-height: 330px; overflow: auto; padding: 12px; }
.account-dialog .account-permissions legend { font-size: 15px; }
.permission-group-block { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px 14px; grid-column: 1 / -1; padding-bottom: 5px; }
.permission-group-title { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; margin: 7px -2px 2px; padding: 8px 10px; background: #eaf2f9; color: #173a5e; border-radius: 5px; font-weight: 700; }
.permission-group-title small { color: var(--ui-muted); font-weight: 600; }
.permission-group-title button { margin-left: auto; min-height: 28px; height: 28px; font-size: 12px; }
.account-dialog .account-form > label, .account-dialog .account-hint { margin-inline: 20px; }
.account-dialog .account-actions { position: sticky; bottom: 0; z-index: 3; margin: 16px 0 0; padding: 12px 20px; background: #fff; border-top: 1px solid var(--ui-border); }
.account-dialog #webUserStatus { padding: 0 20px 14px; color: var(--ui-muted); }
body.sidebar-collapsed { --sidebar-width: 76px; }
body.sidebar-collapsed .sidebar-brand strong,
body.sidebar-collapsed .tabs .tab { font-size: 0; }
body.sidebar-collapsed .sidebar-nav-group-trigger span:first-child { font-size: 0; }
body.sidebar-collapsed .sidebar-nav-group-trigger span:first-child::before { content: "•"; font-size: 22px; }
body.sidebar-collapsed .sidebar-nav-chevron,
body.sidebar-collapsed .sidebar-nav-submenu { display: none; }
body.sidebar-collapsed .tabs .tab::before { content: "•"; width: 100%; text-align: center; font-size: 22px; }
body.sidebar-collapsed .nav-user { overflow: hidden; }

@media (max-width: 1100px) {
  .overview-cards { grid-template-columns: repeat(2,1fr); }
  .overview-dashboard-grid { grid-template-columns: 1fr; }
  .overview-welcome { align-items: flex-start; flex-direction: column; }
  .overview-welcome nav { justify-content: flex-start; }
  .account-stat-grid { grid-template-columns: repeat(2,1fr); }
  .account-toolbar-new { grid-template-columns: 1fr 1fr; }
  .account-search { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  #appShell:not([hidden]) { grid-template-columns: 1fr; grid-template-rows: 62px minmax(0,1fr); }
  .workspace-header { grid-column: 1; padding: 8px 12px; }
  .workspace-account > span:last-child { display: none; }
  .tabs { position: fixed; left: 0; transform: translateX(-102%); width: min(290px,86vw); transition: transform .2s ease; box-shadow: 10px 0 30px rgba(15,23,42,.25); }
  .tabs { overflow-y: auto; }
  body.sidebar-mobile-open .tabs { transform: translateX(0); }
  .app-page, .app-footer { grid-column: 1; grid-row: 2; }
  .app-footer { left: 0; }
  .account-page-head { align-items: flex-start; padding: 18px 12px 8px; }
  .overview-head, .overview-cards { padding-inline: 12px; }
  .overview-head { align-items: flex-start; flex-direction: column; margin-inline: 12px; padding: 20px; }
  .overview-head-summary { width: 100%; min-width: 0; justify-content: flex-start; }
  .overview-cards { grid-template-columns: 1fr; }
  .overview-dashboard-grid { padding-inline: 12px; }
  .overview-panel > header { align-items: flex-start; flex-direction: column; }
  .overview-rank-row { grid-template-columns: 90px minmax(0,1fr); gap: 8px; }
  .overview-welcome { margin-inline: 12px; }
  .overview-welcome nav { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .overview-welcome button { width: 100%; }
  .account-page-head h1 { font-size: 21px; }
  .account-stat-grid { grid-template-columns: 1fr 1fr; padding: 10px 12px; }
  .account-toolbar-new { margin: 2px 12px 10px; grid-template-columns: 1fr; }
  .account-search { grid-column: auto; }
  .account-layout { padding: 0 12px; overflow-x: auto; }
  .account-grid { min-width: 920px; max-height: 48vh; }
  .account-pagination { padding-inline: 12px; flex-wrap: wrap; }
  .account-general-fields { grid-template-columns: 1fr; }
  .account-dialog .account-permissions { grid-template-columns: 1fr; }
  .permission-group-block { grid-template-columns: 1fr; }
  .permission-tools { align-items: stretch; flex-direction: column; }
  .permission-tools label { grid-template-columns: 1fr; }
  .permission-tools span { margin-left: 0; }
}
/* Teacher certificate issuance workspace */
.teacher-certificate-issue-dialog { width: min(1500px, 96vw); max-width: none; padding: 0; border: 1px solid #8ca7c2; }
.teacher-certificate-issue-shell { width: 100%; max-height: 92vh; display: grid; grid-template-rows: auto auto auto auto minmax(220px, 1fr) auto; overflow: hidden; }
.teacher-certificate-page.active-page { height: calc(100vh - 68px); padding-bottom: 42px; overflow: hidden; }
.teacher-certificate-issue-mount { height: 100%; min-height: 0; }
.teacher-certificate-page .teacher-certificate-issue-shell { height: 100%; max-height: none; background: #fff; }
.teacher-certificate-page .teacher-certificate-issue-shell > .dialog-head { border-radius: 0; }
.teacher-issue-summary { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: 10px; padding: 10px 12px; background: #eef5fb; border-bottom: 1px solid #c8d7e5; }
.teacher-issue-summary div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; background: #fff; border-left: 3px solid #1f67ad; }
.teacher-issue-summary span { color: #52677b; }
.teacher-issue-summary b { color: #0f4f85; font-size: 18px; }
.teacher-issue-filters { display: grid; grid-template-columns: minmax(260px, 2fr) 120px 95px 130px auto auto auto; align-items: end; gap: 8px; padding: 10px 12px; border-bottom: 1px solid #c8d7e5; }
.teacher-issue-filters label, .teacher-issue-form-grid label { display: grid; gap: 4px; font-weight: 600; }
.teacher-issue-filters input, .teacher-issue-filters select, .teacher-issue-form-grid input, .teacher-issue-form-grid select { width: 100%; min-width: 0; }
.teacher-issue-form-panel { padding: 10px 12px; background: #f7fafc; border-bottom: 1px solid #c8d7e5; }
.teacher-issue-form-panel[hidden] { display: none; }
.teacher-issue-form-head { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.teacher-issue-form-head span { color: #52677b; }
.teacher-issue-form-grid { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 8px 12px; }
.teacher-issue-form-grid label.wide { grid-column: span 2; }
.teacher-issue-form-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 10px; }
.teacher-issue-grid { min-height: 220px; overflow: auto; }
#teacherIssueTable { min-width: 1350px; }
#teacherIssueTable tbody tr { cursor: pointer; }
#teacherIssueTable tbody tr.selected td { background: #d9ebfb; }
.teacher-issue-footer { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-top: 1px solid #c8d7e5; background: #fff; }
@media (max-width: 1050px) {
  .teacher-issue-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teacher-issue-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teacher-issue-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.teacher-certificate-workflow-nav {
  display: flex;
  overflow-x: auto;
  border-bottom: 1px solid #a9bfd5;
  background: #e8f0f8;
}
.teacher-certificate-workflow-nav button {
  flex: 0 0 auto;
  min-height: 38px;
  border: 0;
  border-right: 1px solid #b7c9dc;
  background: transparent;
  color: #173b5f;
  font-weight: 600;
  padding: 0 14px;
}
.teacher-certificate-workflow-nav button.active { background: #fff; color: #07569a; box-shadow: inset 0 -3px #1478bd; }
.training-class-actions { white-space: nowrap; }
.training-class-actions .danger-action { color: #a61b1b; border-color: #dda6a6; background: #fff3f3; }
.training-class-actions .danger-action:hover:not(:disabled) { color: #fff; border-color: #b42323; background: #c73535; }
.training-class-actions .danger-action:disabled { color: #9aa7b2; border-color: #d6dde3; background: #f1f3f5; cursor: not-allowed; }
.teacher-certificate-workflow-dashboard { display: grid; grid-template-columns: repeat(6, minmax(130px, 1fr)); gap: 8px; padding: 10px 12px; }
.teacher-certificate-workflow-dashboard > div { border-left: 4px solid #1775b7; background: #fff; padding: 9px 11px; box-shadow: 0 1px 3px #193f6020; }
.teacher-certificate-workflow-dashboard span { display: block; color: #577087; font-size: 12px; }
.teacher-certificate-workflow-dashboard b { display: block; margin-top: 4px; color: #143b5d; font-size: 20px; }
.teacher-certificate-workflow-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) 130px 130px 160px auto auto; gap: 8px; padding: 8px 12px; border-top: 1px solid #c5d4e2; border-bottom: 1px solid #c5d4e2; }
.teacher-certificate-context-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 45px; padding: 6px 12px; border-bottom: 1px solid #c5d4e2; background: #f7fafc; }
.teacher-certificate-context-actions > span { margin-right: auto; color: #52677c; font-size: 12px; }
.teacher-certificate-context-actions button { min-width: 140px; }
.teacher-certificate-reissue-actions { display: grid; gap: 7px; padding: 9px 12px; border-bottom: 1px solid #c5d4e2; background: #f7fafc; }
.teacher-certificate-reissue-actions[hidden] { display: none !important; }
.teacher-certificate-reissue-actions-main { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.teacher-certificate-reissue-actions-main button { min-height: 34px; padding-inline: 13px; white-space: nowrap; }
.teacher-certificate-reissue-actions-main label { display: inline-grid; grid-template-columns: auto minmax(170px, 230px); align-items: center; gap: 7px; color: #315c79; font-size: 12px; font-weight: 700; }
.teacher-certificate-reissue-actions-main select { width: 100%; height: 34px; }
#tcwReissueActionHint { color: #60798d; font-size: 12px; }
.teacher-certificate-reissue-nav { display: grid; grid-template-columns: repeat(6, minmax(160px, 1fr)); overflow: visible; background: #dce9f5; }
.teacher-certificate-reissue-nav button { width: 100%; border: 1px solid #a9c2da; border-top: 0; border-radius: 0 0 5px 5px; }
.teacher-certificate-reissue-view-heading { display: flex; align-items: center; justify-content: space-between; min-height: 62px; padding: 10px 16px; border-bottom: 1px solid #c6d6e4; background: #fff; }
.teacher-certificate-reissue-view-heading[hidden] { display: none !important; }
.teacher-certificate-reissue-view-heading h2 { margin: 0; color: #174d72; font-size: 18px; }
.teacher-certificate-reissue-view-heading p { margin: 4px 0 0; color: #627b90; font-size: 12px; }
.tcw-effect-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 98px; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.tcw-effect-badge.effect-ACTIVE { color: #14713d; background: #e6f7ed; }
.tcw-effect-badge.effect-SUSPENDED { color: #93600a; background: #fff2c8; }
.tcw-effect-badge.effect-REVOKED { color: #aa2c24; background: #fde9e7; }
.teacher-certificate-reissue-statistics { padding: 10px 12px 18px; background: #eef4f9; }
.teacher-certificate-reissue-statistics[hidden] { display: none !important; }
.teacher-certificate-reissue-stat-tables { display: grid; grid-template-columns: 1.35fr 1fr; gap: 10px; }
.teacher-certificate-reissue-stat-tables article { border: 1px solid #bdd0df; background: #fff; }
.teacher-certificate-reissue-stat-tables h3 { margin: 0; padding: 9px 12px; color: #174d72; font-size: 14px; background: #e3f0f9; }
.teacher-certificate-reissue-stat-tables table { width: 100%; border-collapse: collapse; }
.teacher-certificate-reissue-stat-tables th,.teacher-certificate-reissue-stat-tables td { padding: 8px 9px; border: 1px solid #cbd9e4; text-align: center; }
.teacher-certificate-reissue-stat-tables td:nth-child(2) { text-align: left; }
@media(max-width:1000px){.teacher-certificate-reissue-nav{display:flex;overflow-x:auto}.teacher-certificate-reissue-nav button{min-width:180px}.teacher-certificate-reissue-stat-tables{grid-template-columns:1fr}}
.teacher-certificate-workflow-grid { min-height: 310px; max-height: calc(100vh - 390px); overflow: auto; }
.teacher-certificate-workflow-grid table { min-width: 1500px; }
.teacher-certificate-workflow-grid tbody tr { cursor: pointer; }
.teacher-certificate-workflow-footer { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 0 12px; border-top: 1px solid #c5d4e2; }
.teacher-certificate-workflow-footer div { display: flex; align-items: center; gap: 8px; }

.training-classes-screen { padding: 14px; overflow: auto; height: calc(100vh - 165px); background: #f4f7fa; }
.training-screen-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.training-screen-head h2 { margin: 0; color: #234f74; font-size: 22px; letter-spacing: 0; }
.training-screen-head p { margin: 4px 0 0; color: #64788a; }
.training-class-filters { display: grid; grid-template-columns: 150px minmax(220px, 1fr) 180px 180px auto auto; gap: 10px; align-items: end; padding: 13px; border: 1px solid #d1dce6; background: #fff; }
.training-class-filters label { display: grid; gap: 5px; color: #355b7b; font-weight: 600; }
.training-class-filters input { width: 100%; min-width: 0; }
.training-class-grid { margin-top: 12px; max-height: calc(100vh - 350px); border: 1px solid #c8d6e3; background: #fff; }
.training-class-grid table { min-width: 1180px; }
.training-class-grid tbody tr.training-row-ready,
.training-class-grid tbody tr.training-class-row-ready { background: #e4f7ee; }
.training-class-grid tbody tr.training-row-pending,
.training-class-grid tbody tr.training-class-row-pending { background: #fff1ee; }
.training-class-grid td:nth-child(3), .training-class-grid td:nth-child(5) { text-align: left; }
.training-row-actions { display: flex; justify-content: center; gap: 5px; }
.training-row-actions button { width: 34px; height: 30px; padding: 0; font-size: 15px; }
.training-row-actions .danger { background: #c93f35; color: #fff; border-color: #b43129; }
.training-class-legend { display: flex; align-items: center; gap: 18px; padding: 14px 10px; border: 1px solid #d1dce6; border-top: 0; background: #fff; color: #4e6578; }
.training-class-legend span { display: inline-flex; align-items: center; gap: 7px; }
.training-class-legend i { width: 14px; height: 14px; border-radius: 2px; }
.training-class-legend .legend-ok { background: #25ad82; }
.training-class-legend .legend-warn { background: #e95a49; }
.training-class-legend b { margin-left: auto; color: #234f74; }
.training-class-dialog { width: min(1180px, calc(100vw - 40px)); max-height: 92vh; padding: 0; border: 1px solid #9fb2c4; border-radius: 6px; box-shadow: 0 18px 48px rgba(22, 48, 71, .24); }
.training-class-dialog::backdrop { background: rgba(23, 38, 52, .48); }
.training-class-dialog .dialog-head { min-height: 48px; padding: 0 18px; background: #fff; border-bottom: 1px solid #d3dee8; }
.training-class-dialog .dialog-head strong { color: #173d5d; font-size: 16px; }
.training-class-dialog .dialog-head button { width: 34px; min-width: 34px; height: 34px; padding: 0; border: 0; background: transparent; color: #294a65; font-size: 22px; }
.training-class-form { background: #eef3f7; max-height: 92vh; overflow: auto; }
.training-class-panel { margin: 16px; padding: 20px 24px 18px; border: 1px solid #c7d4df; border-radius: 4px; background: #fff; }
.training-class-panel .panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 0 13px; margin-bottom: 20px; border-bottom: 1px solid #d6e0e8; }
.training-class-panel .panel-heading h3 { margin: 0; color: #24577d; font-size: 18px; letter-spacing: 0; }
.training-class-panel .panel-heading span { color: #657b8d; }
.training-class-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 42px; max-width: 1040px; margin: 0 auto; }
.training-class-form-grid label { position: relative; display: grid; grid-template-columns: 155px minmax(0, 1fr); align-items: center; min-height: 38px; gap: 12px; color: #355d7c; font-weight: 600; }
.training-class-form-grid label.wide { grid-column: 1 / -1; }
.training-class-form-grid label > .required { position: absolute; left: 142px; top: 50%; transform: translateY(-50%); line-height: 1; }
.training-class-form-grid input, .training-class-form-grid select, .training-class-form-grid textarea { grid-column: 2; width: 100%; min-width: 0; border: 1px solid #9eb2c4; border-radius: 3px; background: #fff; color: #1f3548; }
.training-class-form-grid input, .training-class-form-grid select { height: 38px; padding: 6px 10px; }
.training-class-form-grid textarea { min-height: 70px; padding: 8px 10px; resize: vertical; }
.training-class-form-grid input:focus, .training-class-form-grid select:focus, .training-class-form-grid textarea:focus { border-color: #2576b9; box-shadow: 0 0 0 2px rgba(37, 118, 185, .14); outline: 0; }
.training-class-form-grid input[readonly] { background: #eef1f4; color: #526474; }
.training-class-form-actions { display: flex; justify-content: flex-end; gap: 10px; max-width: 1040px; margin: 22px auto 0; padding-top: 16px; border-top: 1px solid #e0e7ed; }
.training-class-form-actions button { min-width: 108px; height: 38px; }
.required { color: #d52f2f; }
.panel-buttons { display: flex; gap: 8px; }
.training-student-search-bar {
  display: grid;
  grid-template-columns: auto minmax(260px, 520px) auto auto;
  align-items: center;
  gap: 8px;
  margin: -6px 0 14px;
  padding: 10px 12px;
  border: 1px solid #c8d8e5;
  background: #f5f9fc;
}
.training-student-search-bar label { color: #24577d; font-weight: 700; white-space: nowrap; }
.training-student-search-bar input { width: 100%; height: 36px; min-width: 0; }
.training-student-search-bar button { height: 36px; min-width: 92px; }
@media (max-width: 760px) {
  .training-student-search-bar { grid-template-columns: 1fr 1fr; }
  .training-student-search-bar label,
  .training-student-search-bar input { grid-column: 1 / -1; }
}
.training-students-panel .grid-wrap { max-height: 360px; }
.training-students-panel table { min-width: 1120px; }
.training-students-panel td:nth-child(2), .training-students-panel td:nth-child(7) { text-align: left; }
.training-student-row-actions { display: flex; justify-content: center; gap: 5px; white-space: nowrap; }
.training-student-row-actions button { min-width: 50px; padding: 7px 9px; }
.training-student-row-actions .student-edit { color: #075d9a; border-color: #83b5d8; background: #eef7fd; }
.training-student-detail-dialog { width: min(920px, 95vw); padding: 0; }
.training-student-detail-layout { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 20px; padding: 20px; }
.training-student-detail-layout aside { display: grid; align-content: start; justify-items: center; gap: 8px; min-height: 190px; padding: 10px; border: 1px solid #cad7e2; background: #f5f8fa; color: #718294; }
.training-student-detail-layout aside img { width: 120px; height: 160px; object-fit: cover; border: 1px solid #aebdcc; background: #fff; }
.training-student-detail-photo-picker { display: inline-flex; align-items: center; justify-content: center; min-width: 108px; height: 34px; padding: 0 12px; border-radius: 3px; background: #2474b5; color: #fff; font-weight: 700; cursor: pointer; }
.training-student-detail-photo-picker[hidden] { display: none; }
.training-student-detail-photo-picker input { display: none; }
#trainingStudentDetailPhotoStatus { color: #55758d; font-size: 11px; line-height: 1.35; text-align: center; }
.training-student-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
.training-student-detail-grid label { display: grid; gap: 5px; color: #315b7d; font-weight: 600; }
.training-student-detail-grid label.wide { grid-column: 1 / -1; }
.training-student-detail-grid input[readonly] { background: #edf1f4; color: #4a6175; }
.training-student-detail-grid select:disabled { background: #edf1f4; color: #4a6175; opacity: 1; }
.training-seniority-hint { min-height: 15px; color: #60798d; font-size: 11px; font-weight: 500; line-height: 1.3; }
@media (max-width: 720px) { .training-student-detail-layout { grid-template-columns: 1fr; } .training-student-detail-grid { grid-template-columns: 1fr; } .training-student-detail-grid label.wide { grid-column: auto; } }
.training-student-photo { width: 42px; height: 54px; object-fit: cover; border: 1px solid #c1ced9; background: #eef2f5; }
.training-student-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; padding: 18px; }
.training-student-form-grid label { display: grid; gap: 5px; color: #355b7b; font-weight: 600; }
.training-student-existing-panel { display: grid; gap: 12px; padding: 18px; background: #f7f9fb; }
.training-student-existing-panel[hidden] { display: none; }
.training-teacher-search-bar { display: grid; grid-template-columns: minmax(320px, 1fr) auto; align-items: end; gap: 10px; padding: 14px; border: 1px solid #b8cddd; background: #eef6fb; }
.training-teacher-search-bar label { display: grid; gap: 6px; color: #245578; font-weight: 700; }
.training-teacher-search-bar input { height: 38px; font-size: 15px; }
.training-teacher-search-bar button { height: 38px; min-width: 100px; }
.training-teacher-search-status { margin: 0; color: #5f7487; }
.training-teacher-search-results { max-height: 210px; overflow: auto; border: 1px solid #b9cbd9; background: #fff; box-shadow: 0 4px 12px rgba(35,69,96,.12); }
.training-teacher-search-result { width: 100%; display: grid; grid-template-columns: minmax(190px,1.5fr) 150px 110px 100px minmax(120px,1fr); gap: 10px; align-items: center; padding: 10px 12px; border: 0; border-bottom: 1px solid #d8e2ea; border-radius: 0; background: #fff; text-align: left; }
.training-teacher-search-result:hover, .training-teacher-search-result:focus { background: #e7f3fb; }
.training-teacher-search-result strong { color: #123f63; }
.training-teacher-search-result span { color: #4c6579; }
.training-student-existing-profile { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 18px; padding: 16px; border: 1px solid #b7cad8; background: #fff; }
.training-student-existing-profile[hidden] { display: none; }
.training-existing-photo { display: grid; align-content: start; justify-items: center; gap: 8px; padding: 10px; border: 1px solid #c4d2dd; background: #f3f6f8; color: #6c8091; }
.training-existing-photo img { width: 120px; height: 160px; object-fit: cover; border: 1px solid #a7b9c7; background: #fff; }
.training-existing-photo .photo-picker { display: inline-flex; align-items: center; justify-content: center; min-width: 104px; height: 34px; padding: 0 12px; border-radius: 3px; background: #2474b5; color: #fff; cursor: pointer; font-weight: 700; }
.training-existing-photo .photo-picker input { display: none; }
.training-existing-photo small { color: #607486; line-height: 1.35; text-align: center; }
.training-student-existing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
.training-student-existing-grid label { display: grid; grid-template-columns: 145px minmax(0,1fr); align-items: center; gap: 8px; color: #315b7d; font-weight: 600; }
.training-student-existing-grid label.wide { grid-column: 1 / -1; }
.training-student-existing-grid input[readonly] { background: #edf1f4; color: #354f64; }
.training-student-existing-grid .important-field { padding-top: 10px; border-top: 1px solid #d4e0e8; }
.training-student-existing-grid .important-field input { background: #fff9e9; border-color: #d5a438; }
@media (max-width: 780px) { .training-teacher-search-bar { grid-template-columns: 1fr; } .training-student-existing-profile { grid-template-columns: 1fr; } .training-student-existing-grid { grid-template-columns: 1fr; } .training-student-existing-grid label.wide { grid-column: auto; } .training-teacher-search-result { grid-template-columns: 1fr; gap: 3px; } }
.training-student-dialog { width: min(1080px, 96vw); max-height: 92vh; padding: 0; }
.training-student-dialog .dialog-form { display: flex; flex-direction: column; max-height: 92vh; overflow: hidden; }
.training-student-mode-bar { padding: 12px 18px; border-bottom: 1px solid #d4dee7; background: #eef4f8; }
.training-student-mode-bar label { display: flex; align-items: center; gap: 12px; color: #274f70; font-weight: 700; }
.training-student-mode-bar select { min-width: 300px; }
.training-student-scroll { min-height: 0; overflow: auto; background: #f7f9fb; }
.training-student-new-layout { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 20px; padding: 18px; }
.training-student-new-layout[hidden] { display: none; }
.training-student-photo-panel { display: grid; align-content: start; justify-items: center; gap: 10px; padding: 14px; border: 1px solid #c8d6e1; background: #fff; }
.training-student-photo-preview { width: 132px; height: 176px; display: grid; place-items: center; overflow: hidden; border: 1px solid #9db0c0; background: #edf1f4; }
.training-student-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.training-student-photo-preview span { padding: 12px; color: #718294; font-size: 12px; text-align: center; }
.training-student-photo-panel .photo-picker { display: inline-flex; align-items: center; justify-content: center; min-width: 104px; height: 34px; padding: 0 12px; border-radius: 3px; background: #2474b5; color: #fff; cursor: pointer; }
.training-student-photo-panel .photo-picker input { display: none; }
.training-student-photo-panel small { color: #607486; line-height: 1.4; text-align: center; }
.training-student-profile-fields { min-width: 0; }
.training-student-profile-fields h3 { margin: 0 0 12px; padding-bottom: 9px; border-bottom: 1px solid #cfdae4; color: #315f83; font-size: 16px; }
.training-student-profile-fields h3:not(:first-child) { margin-top: 20px; }
.training-student-profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 20px; }
.training-student-profile-grid label { display: grid; grid-template-columns: 150px minmax(0, 1fr); align-items: center; gap: 8px; color: #355b7b; font-weight: 600; }
.training-student-profile-grid label.wide { grid-column: 1 / -1; }
.training-student-profile-grid input, .training-student-profile-grid select { width: 100%; min-width: 0; }
.training-student-form-status {
  min-height: 22px;
  margin: 0;
  padding: 9px 20px;
  color: #315f7d;
  background: #f0f7fc;
  border-top: 1px solid #c9ddea;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
  text-align: center;
}
.training-student-form-status::before {
  content: "ⓘ";
  display: inline-block;
  margin-right: 7px;
  color: #1970ad;
  font-size: 14px;
  vertical-align: -1px;
}
.training-student-form-status:empty { display: none; }
.training-student-form-status:empty::before { display: none; }

.exam-decision-editor {
  display: grid;
  gap: 16px;
  padding: 18px;
  background: #f4f7fa;
  border: 1px solid #d3dee7;
}
.exam-decision-editor[hidden] { display: none; }
.exam-decision-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 2px;
}
.exam-decision-editor-head h2 { margin: 3px 0 5px; color: #244f70; font-size: 24px; font-weight: 700; }
.exam-decision-editor-head p { margin: 0; color: #607587; }
.exam-decision-eyebrow { color: #1d79b5; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.exam-decision-editor-head > button { flex: 0 0 auto; border-color: #a9bdcc; background: #fff; color: #315d7d; }
#examDecisionForm { display: grid; gap: 16px; }
.exam-decision-card { overflow: hidden; border: 1px solid #ccd9e3; border-radius: 5px; background: #fff; box-shadow: 0 2px 8px rgba(44, 75, 99, .06); }
.exam-decision-card-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 18px; border-bottom: 1px solid #d7e1e9; background: #f9fbfd; }
.exam-decision-card-head h3 { margin: 0 0 3px; color: #285878; font-size: 17px; }
.exam-decision-card-head p { margin: 0; color: #708392; font-size: 12px; }
.exam-decision-form-status { padding: 5px 11px; border: 1px solid #b9d7ea; border-radius: 999px; background: #ebf6fc; color: #176c9f; font-size: 12px; font-weight: 700; }
.exam-decision-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 24px; padding: 20px; }
.exam-decision-form-grid label { display: grid; grid-template-columns: 165px minmax(0, 1fr); align-items: center; gap: 10px; min-width: 0; color: #365d78; font-weight: 600; }
.exam-decision-form-grid label.wide { grid-column: 1 / -1; }
.exam-decision-form-grid input, .exam-decision-form-grid select, .exam-decision-form-grid textarea { width: 100%; min-width: 0; }
.exam-decision-form-grid textarea { resize: vertical; line-height: 1.45; }
.exam-decision-override { display: grid; grid-template-columns: auto minmax(260px, 1fr); align-items: center; gap: 16px; padding: 12px 20px; border-top: 1px dashed #d7e1e9; background: #fffaf0; }
.exam-decision-override label { display: inline-flex; align-items: center; gap: 8px; color: #805a18; font-weight: 600; }
.exam-decision-override input[type="checkbox"] { width: auto; }
.exam-decision-class-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; border-bottom: 1px solid #d7e1e9; background: #d7e1e9; }
.exam-decision-class-summary div { display: grid; gap: 5px; min-height: 62px; padding: 12px 14px; background: #fff; }
.exam-decision-class-summary span { color: #718493; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.exam-decision-class-summary b { overflow: hidden; color: #294f6b; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.exam-decision-card-head > strong { color: #176fa7; white-space: nowrap; }
.exam-decision-student-grid { max-height: 330px; border: 0; }
.exam-decision-student-grid table { min-width: 1120px; }
.exam-decision-student-grid td:nth-child(3) { text-align: left; }
.exam-decision-actions { position: sticky; bottom: 0; z-index: 2; display: flex; justify-content: center; gap: 10px; padding: 14px 18px; border: 1px solid #ccd9e3; border-radius: 5px; background: rgba(255, 255, 255, .97); box-shadow: 0 -2px 10px rgba(44, 75, 99, .07); }
.exam-decision-actions button { min-width: 120px; }

@media (max-width: 1050px) {
  .training-class-filters { grid-template-columns: 1fr 1fr; }
  .training-class-form-grid { grid-template-columns: 1fr; }
  .training-class-form-grid label.wide { grid-column: auto; }
  .training-student-new-layout { grid-template-columns: 1fr; }
  .training-student-photo-panel { grid-template-columns: auto 1fr; justify-items: start; }
  .training-student-photo-panel small { text-align: left; }
  .training-student-profile-grid { grid-template-columns: 1fr; }
  .training-student-profile-grid label.wide { grid-column: auto; }
  .exam-decision-form-grid { grid-template-columns: 1fr; }
  .exam-decision-form-grid label.wide { grid-column: auto; }
  .exam-decision-class-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .exam-decision-editor { padding: 10px; }
  .exam-decision-editor-head { align-items: flex-start; flex-direction: column; }
  .exam-decision-form-grid label { grid-template-columns: 1fr; gap: 5px; }
  .exam-decision-override { grid-template-columns: 1fr; }
  .exam-decision-class-summary { grid-template-columns: 1fr 1fr; }
}
.teacher-certificate-workflow-dialog { width: min(1180px, 96vw); max-height: 92vh; padding: 0; }
.teacher-certificate-workflow-dialog .dialog-form { min-width: 0; }
.tcw-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px 14px; padding: 14px; }
.tcw-form-grid label { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 8px; }
.tcw-form-grid label.wide { grid-column: 1 / -1; }
.tcw-form-grid .tcw-photo-field { align-self: start; }
.tcw-photo-preview { grid-row: span 2; margin: 0; min-height: 138px; display: grid; grid-template-rows: 110px auto; justify-items: center; align-items: center; border: 1px solid #c6d5e2; background: #f8fafc; }
.tcw-photo-preview img { display: none; max-width: 92px; max-height: 106px; object-fit: contain; }
.tcw-photo-preview img[src] { display: block; }
.tcw-photo-preview figcaption { padding: 4px 8px; color: #52677c; font-size: 11px; text-align: center; }
.tcw-validation { min-height: 32px; margin: 0 14px; padding: 7px 10px; border-left: 3px solid #d49a1d; background: #fff8e4; }
.tcw-dialog-actions { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px 14px; border-top: 1px solid #c6d5e2; }
.teacher-certificate-stage-dialog { width: min(780px, calc(100vw - 24px)); max-width: none; padding: 0; }
.tcw-stage-selection { margin: 0; padding: 10px 14px; color: #36546e; background: #eef5fb; border-bottom: 1px solid #c6d5e2; }
.tcw-stage-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; padding: 16px; }
.tcw-stage-fields[hidden] { display: none; }
.tcw-stage-fields label { display: grid; grid-template-columns: 155px minmax(0, 1fr); align-items: center; gap: 8px; }
.tcw-stage-fields label.wide { grid-column: 1 / -1; }
.tcw-stage-fields textarea { width: 100%; resize: vertical; }
.tcw-stage-photo-preview { grid-column: 1 / -1; margin: 0; display: flex; align-items: center; gap: 12px; min-height: 130px; padding: 10px; border: 1px solid #c6d5e2; background: #f8fafc; }
.tcw-stage-photo-preview img { display: none; width: 90px; height: 120px; object-fit: contain; border: 1px solid #b7c9d9; background: #fff; }
.tcw-stage-photo-preview img[src] { display: block; }
.tcw-history { max-height: 160px; overflow: auto; margin: 0 14px 14px; border: 1px solid #c6d5e2; }
.tcw-history div { display: grid; grid-template-columns: 150px 170px 150px 1fr; gap: 8px; padding: 6px 8px; border-bottom: 1px solid #d8e2eb; }
@media (max-width: 1100px) {
  .teacher-certificate-workflow-dashboard { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .teacher-certificate-workflow-toolbar { grid-template-columns: 1fr 1fr 1fr; }
  .tcw-form-grid { grid-template-columns: 1fr 1fr; }
}
.teacher-exam-score-button{white-space:nowrap}.teacher-exam-locked{color:#66788a;font-size:12px;white-space:nowrap}.teacher-exam-scoring-dialog{width:min(1480px,98vw);height:min(900px,96vh);padding:0;border:1px solid #aebdcc;border-radius:5px;color:#173f67}.teacher-exam-scoring-dialog>form{height:100%;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;background:#fff}.teacher-exam-scoring-summary{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:12px;padding:14px 18px;background:#f2f7fb;border-bottom:1px solid #d5e0e9}.teacher-exam-scoring-summary div{display:grid;gap:4px}.teacher-exam-scoring-summary span{font-size:12px;color:#667f97}.teacher-exam-scoring-summary strong{font-size:14px}.teacher-exam-scoring-content{min-height:0;padding:10px 12px;display:grid;grid-template-rows:auto minmax(0,1fr)}.teacher-exam-scoring-content h3{margin:4px 0 12px;font-size:18px;font-weight:600}.teacher-exam-scoring-grid{overflow:auto;border:1px solid #cfd9e2}.teacher-exam-scoring-grid table{width:100%;border-collapse:separate;border-spacing:0;min-width:1050px}.teacher-exam-scoring-grid th,.teacher-exam-scoring-grid td{padding:9px 8px;border-right:1px solid #d6dee5;border-bottom:1px solid #d6dee5;text-align:left;background:#fff}.teacher-exam-scoring-grid th{position:sticky;top:0;z-index:2;background:#edf3f8;text-align:center;color:#4d6d8c}.teacher-exam-scoring-grid thead tr:nth-child(2) th{top:38px}.teacher-exam-scoring-grid td:nth-last-child(-n+5){text-align:center}.teacher-exam-scoring-grid input[type=checkbox]{width:20px;height:20px;accent-color:#1e78b7}.teacher-exam-scoring-grid tr.absent td{background:#fff4f1;color:#876258}.teacher-exam-scoring-grid input:disabled{opacity:.4}.teacher-exam-scoring-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px;background:#f7f9fb;border-top:1px solid #d5e0e9;color:#617a92}.teacher-exam-scoring-footer>div:last-child{display:flex;gap:8px}.teacher-exam-scoring-footer button{min-width:110px}
@media(max-width:900px){.teacher-exam-scoring-summary{grid-template-columns:1fr 1fr}.teacher-exam-scoring-footer{align-items:flex-start;flex-direction:column}}
@media print{body:has(.teacher-exam-scoring-dialog[open])>*{visibility:hidden!important}.teacher-exam-scoring-dialog[open],.teacher-exam-scoring-dialog[open] *{visibility:visible!important}.teacher-exam-scoring-dialog[open]{position:absolute;inset:0;width:100%;height:auto;max-height:none;border:0}.teacher-exam-scoring-grid{overflow:visible}.teacher-exam-scoring-grid table{min-width:0;font-size:10px}.teacher-exam-scoring-footer>div:last-child,.teacher-exam-scoring-dialog .dialog-head button{display:none!important}}
.pass-decision-editor .exam-decision-editor-head{background:linear-gradient(135deg,#f2f8fb,#eef5f1)}.pass-decision-form-grid textarea{resize:vertical}.pass-decision-editor #passDecisionStudentTable td:last-child{text-align:center}.pass-decision-editor .status-approved{display:inline-block;padding:3px 10px;border-radius:999px;background:#e6f6ed;color:#157044;font-weight:700}
.teacher-certificate-branch-heading{padding:8px 16px;background:#f4f7fa}.teacher-certificate-branch-heading>div{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:38px;padding:8px 13px;border-left:4px solid #1c7bae;background:#fff;color:#547087;font-size:12px}.teacher-certificate-branch-heading strong{color:#244f70;font-size:14px;white-space:nowrap}.teacher-certificate-workflow-nav[hidden]{display:none!important}.teacher-certificate-nav-group{width:100%}.tabs .sidebar-subgroup-trigger{min-height:34px;padding:6px 10px 6px 16px;font-size:13px;font-weight:700}.teacher-certificate-nav-group.active>.sidebar-subgroup-trigger{background:rgba(255,255,255,.08);color:#fff}.sidebar-nav-submenu-level2{padding:2px 0 3px 15px}.tabs .sidebar-subtab-level2{min-height:30px;padding:5px 9px 5px 18px;font-size:12.5px;font-weight:600}.tabs .sidebar-subtab-level2::before{left:7px;width:3px;height:3px}@media(max-width:760px){.teacher-certificate-branch-heading>div{align-items:flex-start;flex-direction:column;gap:3px}}
.teacher-certificate-workflow-dialog{width:min(1080px,96vw)}.teacher-certificate-workflow-dialog .tcw-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;padding:16px}.tcw-form-grid>.wide{grid-column:1/-1}.tcw-reissue-lookup{grid-column:1/-1;display:grid;grid-template-columns:minmax(420px,1fr) auto;align-items:center;gap:8px 12px;padding:13px 15px;border:1px solid #b9d2e4;border-radius:6px;background:#f3f9fd}.tcw-form-grid .tcw-reissue-lookup label{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;gap:10px;font-weight:700;color:#285878}.tcw-reissue-lookup label span{white-space:nowrap}.tcw-reissue-lookup input{width:100%;min-width:0}.tcw-reissue-lookup button{height:36px;min-width:96px;background:#176fa7;color:#fff}.tcw-reissue-lookup>span{grid-column:1/-1;padding-left:160px;color:#58748b;font-size:12px;line-height:1.4}.teacher-certificate-workflow-dialog .tcw-form-grid>label{grid-template-columns:135px minmax(0,1fr)}.teacher-certificate-workflow-dialog .tcw-form-grid input[readonly]{background:#f3f5f7;color:#36536b}.teacher-certificate-workflow-dialog .tcw-reissue-reason{grid-template-columns:170px minmax(0,1fr)}.teacher-certificate-workflow-dialog #tcwReissueReason{width:100%;min-height:38px;color:#244f70}@media(max-width:800px){.teacher-certificate-workflow-dialog .tcw-form-grid{grid-template-columns:1fr}.tcw-reissue-lookup{grid-template-columns:1fr}.tcw-form-grid .tcw-reissue-lookup label{grid-template-columns:1fr}.tcw-reissue-lookup button{width:100%}.tcw-reissue-lookup>span{padding-left:0}.teacher-certificate-workflow-dialog .tcw-form-grid>label,.teacher-certificate-workflow-dialog .tcw-reissue-reason{grid-template-columns:1fr}}
.tcw-form-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px;padding:9px 12px;border-bottom:1px solid #c9d9e5;background:#eef5fa;color:#275777}.tcw-form-section-title strong{font-size:14px}.tcw-form-section-title span{font-size:11px;color:#6d8395}.teacher-certificate-workflow-dialog .tcw-form-grid textarea[readonly]{background:#f3f5f7;color:#36536b}.teacher-certificate-workflow-dialog .tcw-photo-preview{min-height:150px}@media(max-width:800px){.tcw-form-section-title{align-items:flex-start;flex-direction:column;gap:2px}}
.tcw-attachments{display:flex;flex-wrap:wrap;gap:8px;padding:9px 12px;border:1px dashed #a9bfd0;border-radius:5px;background:#f7fbfe;color:#58748b}.tcw-attachments a{display:inline-flex;padding:6px 9px;border:1px solid #bad2e2;border-radius:4px;background:#fff;color:#176fa7;text-decoration:none}.tcw-attachments a:hover{border-color:#176fa7;background:#eef8ff}
.teacher-certificate-workflow-dialog .tcw-form-grid>label.tcw-editable-field{grid-template-columns:135px minmax(0,1fr) 48px}.teacher-certificate-workflow-dialog .tcw-form-grid>label.tcw-editable-field.wide{grid-template-columns:170px minmax(0,1fr) 48px}.tcw-field-edit{height:30px;min-width:46px;padding:3px 7px;border:1px solid #91adc1;background:#edf3f7;color:#285878;font-size:12px;font-weight:700}.tcw-field-edit:hover,.tcw-field-edit.active{border-color:#1677ad;background:#1677ad;color:#fff}.tcw-editable-field.is-editing input,.tcw-editable-field.is-editing textarea{background:#fffbe4!important;border-color:#e2a51c!important;box-shadow:0 0 0 2px rgba(226,165,28,.18);color:#183f5d!important}.tcw-editable-field.was-edited:not(.is-editing) input,.tcw-editable-field.was-edited:not(.is-editing) textarea{background:#eaf7ee!important;border-color:#66aa7b!important}.tcw-editable-field.was-edited .tcw-field-edit:not(.active){border-color:#66aa7b;color:#24713e}@media(max-width:800px){.teacher-certificate-workflow-dialog .tcw-form-grid>label.tcw-editable-field,.teacher-certificate-workflow-dialog .tcw-form-grid>label.tcw-editable-field.wide{grid-template-columns:1fr auto}.tcw-editable-field>input,.tcw-editable-field>textarea{grid-column:1/2}.tcw-editable-field>.tcw-field-edit{grid-column:2/3;grid-row:2}}
.tcw-form-section-title[data-reissue-section]{display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr);align-items:center}.tcw-form-section-title[data-reissue-section]>span{justify-self:end}.tcw-section-edit-actions{display:flex;align-items:center;justify-content:center;gap:7px;min-width:120px}.tcw-section-edit-actions button{min-width:54px;height:30px;padding:4px 10px;font-size:12px;font-weight:700}.tcw-form-section-title.is-editing{background:#fff6d9;border-bottom-color:#dfab31}.tcw-section-field.is-editing input,.tcw-section-field.is-editing textarea{background:#fffbe4!important;border-color:#e2a51c!important;box-shadow:0 0 0 2px rgba(226,165,28,.18);color:#183f5d!important}.tcw-section-field.was-edited:not(.is-editing) input,.tcw-section-field.was-edited:not(.is-editing) textarea{background:#eaf7ee!important;border-color:#66aa7b!important}@media(max-width:800px){.tcw-form-section-title[data-reissue-section]{grid-template-columns:1fr auto}.tcw-form-section-title[data-reissue-section]>span{grid-column:1/-1;justify-self:start}.tcw-section-edit-actions{min-width:0}}

/* Kiểm tra, đối chiếu văn bản */
.document-check-head,.document-history-head,.document-check-form-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.document-check-head{padding:18px 20px 12px}.document-check-head h1,.document-history-head h2{margin:0;color:#173f5f}.document-check-head h1{font-size:23px}.document-check-head p,.document-history-head p{margin:5px 0 0;color:#60788d}.document-check-workspace,.document-check-result,.document-history{margin:0 14px 16px;border:1px solid #c8d8e5;background:#fff;box-shadow:0 2px 8px rgba(25,66,96,.05)}.document-check-form-head{min-height:52px;padding:10px 16px;border-bottom:1px solid #d7e2eb;background:#f6f9fc}.document-check-form-head>div{display:flex;flex-direction:column;gap:3px}.document-check-form-head strong{color:#184d73;font-size:16px}.document-check-form-head span{color:#71879a;font-size:12px}.document-check-meta{display:grid;grid-template-columns:minmax(280px,1fr) minmax(420px,2fr);gap:12px 20px;padding:14px 16px 4px}.document-check-meta label{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:9px;color:#284f6c;font-weight:600}.document-check-meta textarea{resize:vertical}.document-upload-grid{display:grid;grid-template-columns:repeat(3,minmax(240px,1fr));gap:13px;padding:14px 16px}.document-upload-card{min-width:0;padding:14px;border:1px dashed #9cb8cc;border-radius:7px;background:#f9fbfd}.document-upload-card.required{border-left:4px solid #1677ad}.document-upload-card>div{display:flex;align-items:center;gap:9px;color:#174d72}.document-upload-card p{min-height:34px;margin:9px 0;color:#718698;font-size:12px}.document-upload-card input{width:100%}.document-upload-card>span:last-child{display:block;margin-top:8px;color:#456980;font-size:12px;overflow-wrap:anywhere}.document-file-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:6px;color:#fff!important;background:#1978ad;font-weight:800}.document-check-progress{margin:0 16px 12px;padding:10px 13px;border:1px solid #c8dceb;background:#eef7fc}.document-check-progress>div{display:flex;justify-content:space-between;color:#245c82}.document-check-progress progress{width:100%;height:10px;margin:8px 0 4px;accent-color:#1480bb}.document-check-progress small{color:#637d90}.document-check-actions{display:flex;justify-content:center;gap:9px;padding:0 16px 16px}.dc-status,.dc-result,.dc-severity{display:inline-flex;align-items:center;justify-content:center;min-height:25px;padding:3px 9px;border:1px solid transparent;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}.dc-status.draft{color:#475569;background:#eef2f6}.dc-status.queued,.dc-status.processing{color:#0d5d91;background:#e1f2fc;border-color:#98c9e5}.dc-status.completed{color:#176536;background:#e4f6e9;border-color:#9bd1aa}.dc-status.failed{color:#a12720;background:#fde8e7;border-color:#e8aaa6}.document-result-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:14px 16px;background:#f4f8fb}.document-result-summary article{padding:11px 14px;border-left:4px solid #1c82b8;background:#fff;box-shadow:0 1px 4px rgba(30,69,96,.08)}.document-result-summary span{display:block;color:#637c90;font-size:12px}.document-result-summary strong{display:block;margin-top:4px;color:#174d72;font-size:22px}.document-conclusion{margin:14px 16px 0;padding:12px 14px;border-left:4px solid #238d64;background:#eef9f4}.document-conclusion p{margin:5px 0 0;color:#315f50}.document-result-tools{display:flex;align-items:center;flex-wrap:wrap;gap:11px 18px;padding:14px 16px 9px}.document-result-tools label{display:flex;align-items:center;gap:6px}.document-result-grid{margin:0 16px;max-height:520px}#documentResultTable{min-width:1450px;table-layout:fixed}#documentResultTable th:nth-child(1){width:42px}#documentResultTable th:nth-child(2),#documentResultTable th:nth-child(3){width:260px}#documentResultTable th:nth-child(4){width:135px}#documentResultTable th:nth-child(5){width:105px}#documentResultTable th:nth-child(6),#documentResultTable th:nth-child(7){width:235px}#documentResultTable td{vertical-align:top;line-height:1.42;cursor:pointer}#documentResultTable td small{display:block;margin-bottom:5px;color:#6b8295;font-style:italic}#documentResultTable tbody tr:hover td{background:#eaf5fc}.dc-result.đạt{color:#176536;background:#e4f6e9}.dc-result.cơ-bản-đạt{color:#26613a;background:#edf7df}.dc-result.chưa-đầy-đủ{color:#8a5b08;background:#fff2ca}.dc-result.không-phù-hợp{color:#a12720;background:#fde8e7}.dc-result.cần-kiểm-tra-thủ-công{color:#67408c;background:#f0e7f8}.dc-severity.nghiêm-trọng{color:#fff;background:#b42318}.dc-severity.quan-trọng{color:#8f2e22;background:#ffe7df;border-color:#efb5a6}.dc-severity.thông-thường{color:#77570a;background:#fff3c9}.dc-severity.gợi-ý{color:#245e83;background:#e6f3fb}.document-recommendations{margin:13px 16px 16px;padding:12px 14px;border:1px solid #d6e2eb;background:#fbfcfd}.document-recommendations ul{margin:8px 0 0;padding-left:21px}.document-history{padding-bottom:14px}.document-history-head{padding:14px 16px;border-bottom:1px solid #d7e2eb}.document-history-head h2{font-size:18px}.document-history-head>div:last-child{display:flex;gap:7px}.document-history-grid{margin:12px 14px 0;max-height:430px}#documentHistoryTable{min-width:1200px}.dc-history-actions{white-space:nowrap}.dc-history-actions button{margin-right:5px}.dc-history-actions .danger-action{color:#a12720;border-color:#dfa8a4;background:#fff5f4}.document-evidence-dialog{width:min(1160px,calc(100vw - 28px));max-width:none}.document-evidence-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:14px}.document-evidence-columns article{min-width:0;border:1px solid #cad9e5;background:#f8fafc}.document-evidence-columns h3{margin:0;padding:10px 12px;color:#174d72;background:#eaf3f9}.document-evidence-columns article>div{padding:8px 12px;color:#6a8193;font-size:12px}.document-evidence-columns pre{min-height:180px;max-height:45vh;margin:0;padding:12px;overflow:auto;white-space:pre-wrap;font:14px/1.55 "Times New Roman",serif;color:#263f52}.document-evidence-reason{margin:0 14px 14px;padding:11px 13px;border-left:4px solid #d29824;background:#fff8e7}.document-evidence-reason p{margin:4px 0 10px}@media(max-width:900px){.document-upload-grid,.document-result-summary,.document-evidence-columns{grid-template-columns:1fr}.document-check-meta{grid-template-columns:1fr}.document-history-head,.document-check-head{align-items:flex-start;flex-direction:column}.document-history-head>div:last-child{width:100%;flex-wrap:wrap}}
/* Giay phep dao tao / Danh gia san tap lai */
.training-license-nav-group{width:100%}
.license-function-switch{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:13px 16px;background:#edf4fa;border-bottom:1px solid #c3d5e3}
.license-function-switch button{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;gap:2px 10px;min-height:64px;padding:10px 14px;text-align:left;border:1px solid #aec7d9;border-radius:7px;background:#fff;color:#214e6d}
.license-function-switch button>span{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;margin-top:3px;border-radius:50%;background:#e5f1f8;color:#1776ad;font-size:17px}
.license-function-switch button b{font-size:14px}.license-function-switch button small{color:#6b8192;line-height:1.3}
.license-function-switch button.active{border-color:#197caf;background:linear-gradient(135deg,#1778ac,#2d94be);color:#fff;box-shadow:0 3px 9px rgba(25,109,157,.2)}
.license-function-switch button.active>span{background:rgba(255,255,255,.18);color:#fff}.license-function-switch button.active small{color:#e5f4fb}
.practice-yard-title{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 16px}.practice-yard-title>div{display:flex;flex-direction:column;gap:4px}.practice-yard-title small{color:#657f93;font-size:12px;font-weight:400}
.practice-yard-filters{display:grid;grid-template-columns:minmax(260px,1fr) 180px 190px auto auto minmax(160px,auto);gap:9px;align-items:end;padding:12px 14px;border-block:1px solid #c6d7e4;background:#f5f8fb}
.practice-yard-filters label{display:grid;gap:4px;color:#315c79;font-size:12px;font-weight:700}.practice-yard-filters input,.practice-yard-filters select{width:100%;height:32px}.practice-yard-filters>span{align-self:center;color:#5f798d}
.practice-yard-grid{height:calc(100vh - 290px);min-height:380px}.practice-yard-grid table{min-width:1450px}.practice-yard-grid td:nth-child(3),.practice-yard-grid td:nth-child(4){text-align:left}
.py-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.py-badge.status-Draft{color:#526678;background:#edf1f4}.py-badge.status-NeedCompletion,.py-badge.result-Incomplete{color:#8a5b08;background:#fff2c8}.py-badge.status-Assessed{color:#12618d;background:#e2f2fb}.py-badge.status-Locked,.py-badge.result-Pass{color:#19653a;background:#e5f6eb}.py-badge.result-Fail{color:#a32b23;background:#fde9e7}
.practice-yard-dialog{width:min(1420px,calc(100vw - 24px));height:min(920px,calc(100vh - 20px));max-width:none;padding:0}
.practice-yard-dialog>form{height:100%;display:grid;grid-template-rows:auto auto auto auto minmax(220px,1fr) auto auto;overflow:hidden;background:#f7f9fb}
.practice-yard-form-head{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:10px 18px;padding:14px 18px;background:#fff;border-bottom:1px solid #d0dde7}
.practice-yard-form-head label{display:grid;grid-template-columns:145px minmax(0,1fr);align-items:center;gap:8px;color:#285775;font-weight:700}.practice-yard-form-head label.wide{grid-column:span 2}.practice-yard-form-head input,.practice-yard-form-head select{width:100%;min-width:0}
.practice-yard-rank-select,.practice-yard-general,.practice-yard-calculation{padding:12px 18px;border-bottom:1px solid #d0dde7}.practice-yard-rank-select>strong{color:#184f73}.practice-yard-rank-select>div{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:9px}
.practice-yard-rank-select label{display:flex;align-items:center;gap:5px;padding:5px 9px;border:1px solid #bfd2df;border-radius:5px;background:#fff;font-weight:700}
.practice-yard-general{background:#f1f7fb}.practice-yard-general>header,.practice-yard-calculation>header{display:flex;justify-content:space-between;gap:15px;margin-bottom:9px;color:#204f6e}.practice-yard-general header small,.practice-yard-calculation header small{color:#688095}
.practice-yard-general>div{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}.practice-yard-criterion{display:grid;grid-template-columns:minmax(260px,1fr) 130px minmax(170px,.8fr);gap:8px;align-items:center;padding:8px 10px;border:1px solid #c8d9e5;background:#fff}
.practice-yard-criterion b,.practice-yard-criterion small{display:block}.practice-yard-criterion small{margin-top:2px;color:#6a8091}
.practice-yard-calculation{min-height:0;overflow:auto;background:#fff}.practice-yard-rank-card{margin-bottom:13px;border:1px solid #bcd0de;background:#fff}.practice-yard-rank-card>header{display:flex;justify-content:space-between;padding:9px 12px;background:#e6f1f8;color:#1c5073}
.practice-yard-vehicle-fields{display:grid;grid-template-columns:1.3fr repeat(5,1fr);gap:9px;padding:10px 12px}.practice-yard-vehicle-fields label{display:grid;gap:3px;color:#536f83;font-size:11px;font-weight:700}
.practice-yard-rank-card table{width:100%;min-width:850px}.practice-yard-rank-card th,.practice-yard-rank-card td{padding:7px 9px;border:1px solid #d2dee7}.practice-yard-rank-card th{background:#f2f6f9}.practice-yard-rank-card td input{width:120px}.practice-yard-rank-card td.pass{color:#1c713f;background:#edf8f1;font-weight:700}.practice-yard-rank-card td.fail{color:#a12c24;background:#fff0ef;font-weight:700}
.practice-yard-note{display:grid;grid-template-columns:190px 1fr;gap:9px;align-items:center;padding:10px 18px;background:#fff}.practice-yard-note textarea{resize:vertical}.practice-yard-actions{margin:0}.practice-yard-actions>span{margin-right:auto;color:#476b83}.empty-state{text-align:center;color:#6d8394;padding:18px}
@media(max-width:1050px){.practice-yard-form-head{grid-template-columns:1fr 1fr}.practice-yard-form-head label.wide{grid-column:1/-1}.practice-yard-general>div{grid-template-columns:1fr}.practice-yard-vehicle-fields{grid-template-columns:1fr 1fr 1fr}.practice-yard-filters{grid-template-columns:1fr 1fr 1fr}.practice-yard-filters>span{grid-column:1/-1}}
@media(max-width:720px){.license-function-switch{grid-template-columns:1fr;padding:8px}.practice-yard-title{align-items:flex-start;flex-direction:column}.practice-yard-title button{width:100%}.practice-yard-filters{grid-template-columns:1fr 1fr}.practice-yard-dialog{width:100vw;height:100vh;max-height:none}.practice-yard-dialog>form{grid-template-rows:auto auto auto auto minmax(240px,1fr) auto auto}.practice-yard-form-head{grid-template-columns:1fr;padding:10px}.practice-yard-form-head label,.practice-yard-note{grid-template-columns:1fr}.practice-yard-form-head label.wide{grid-column:auto}.practice-yard-criterion{grid-template-columns:1fr 120px}.practice-yard-criterion input{grid-column:1/-1}.practice-yard-vehicle-fields{grid-template-columns:1fr 1fr}.practice-yard-general,.practice-yard-calculation,.practice-yard-rank-select{padding:10px}.practice-yard-general>header,.practice-yard-calculation>header{flex-direction:column;gap:3px}}

/* Document-check AI status and readable history columns. */
.document-history-grid{max-height:480px}
#documentHistoryTable{min-width:2050px;table-layout:fixed}
#documentHistoryTable th:nth-child(1){width:50px}
#documentHistoryTable th:nth-child(2){width:220px}
#documentHistoryTable th:nth-child(3){width:260px}
#documentHistoryTable th:nth-child(4){width:80px}
#documentHistoryTable th:nth-child(5){width:170px}
#documentHistoryTable th:nth-child(6){width:155px}
#documentHistoryTable th:nth-child(7){width:125px}
#documentHistoryTable th:nth-child(8){width:80px}
#documentHistoryTable th:nth-child(9){width:520px}
#documentHistoryTable th:nth-child(10){width:210px}
#documentHistoryTable th:nth-child(11){width:220px}
#documentHistoryTable td{vertical-align:top}
.dc-history-detail{white-space:normal;overflow-wrap:anywhere;line-height:1.45;color:#294d67}
.dc-history-ai{white-space:normal}
.document-ai-review{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:9px;color:#456b82}
.document-ai-review small{flex-basis:100%;color:#6c8293}
.dc-ai-status{display:inline-flex;align-items:center;padding:3px 8px;border:1px solid #b8cedd;border-radius:999px;background:#edf5fa;color:#245b7c;font-size:11px;font-weight:700}
.dc-ai-status.applied,.dc-ai-status.not_needed{color:#176536;background:#e5f6eb;border-color:#9bd1aa}
.dc-ai-status.unavailable{color:#8a5b08;background:#fff2ca;border-color:#e6c36a}
.dc-ai-status.disabled,.dc-ai-status.legacy{color:#526678;background:#eef2f6}
.api-sharing-page { padding-bottom: 28px; }
.api-notice { display:flex; gap:16px; align-items:center; margin:10px 8px; padding:12px 16px; border:1px solid #8fc5e8; border-left:5px solid #1477b8; background:#eef8ff; color:#163a59; }
.api-notice span { line-height:1.45; }
.api-dashboard { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:12px; padding:8px; }
.api-dashboard article { border:1px solid #c7d8e6; background:#fff; padding:16px; box-shadow:0 1px 3px #102a4312; }
.api-dashboard span { display:block; color:#52677a; margin-bottom:8px; }
.api-dashboard strong { font-size:26px; color:#0b5f9d; }
.api-admin-grid { display:grid; grid-template-columns:minmax(420px,.85fr) minmax(620px,1.25fr); gap:12px; padding:8px; align-items:start; }
.api-sharing-page .panel { margin:8px; padding:14px; border:1px solid #cbd9e5; background:#fff; }
.api-admin-grid .panel { margin:0; }
.api-sharing-page .panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid #d7e2eb; padding-bottom:10px; margin-bottom:12px; }
.api-sharing-page .panel-head h2 { margin:0 0 3px; font-size:18px; color:#123c60; }
.api-sharing-page .panel-head small { color:#637789; }
.api-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; margin-bottom:14px; }
.api-form label { display:flex; flex-direction:column; gap:5px; font-weight:600; color:#173b5b; }
.api-form input,.api-form select,.api-form textarea { width:100%; min-height:36px; border:1px solid #9db2c5; padding:7px 9px; font:inherit; background:#fff; box-sizing:border-box; }
.api-form textarea,.api-form fieldset,.api-form .api-form-actions,.api-form .api-rate-row { grid-column:1/-1; }
.api-form .api-check { flex-direction:row; align-items:center; font-weight:500; }
.api-form .api-check input { width:auto; min-height:auto; }
.api-rate-row { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.api-form fieldset { border:1px solid #cad8e4; padding:10px; }
.api-checkbox-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.api-checkbox-list label,.api-field-policy label { flex-direction:row; align-items:center; font-weight:500; }
.api-checkbox-list input,.api-field-policy input { width:auto; min-height:auto; }
.api-field-policy { max-height:240px; overflow:auto; }
.api-field-policy details { border-bottom:1px solid #e1e8ef; padding:6px 0; }
.api-field-policy summary { cursor:pointer; font-weight:700; color:#175d90; }
.api-field-policy details div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:8px; }
.api-form-actions { display:flex; flex-wrap:wrap; gap:8px; }
.api-grid { max-height:310px; overflow:auto; border:1px solid #d2dee8; }
.api-grid table { width:100%; border-collapse:collapse; font-size:13px; }
.api-grid th { position:sticky; top:0; z-index:1; background:#eaf3fa; color:#153b5c; }
.api-grid th,.api-grid td { border:1px solid #d6e1ea; padding:8px; text-align:left; white-space:nowrap; }
.api-grid tbody tr { cursor:pointer; }
.api-grid tbody tr:hover { background:#edf7ff; }
.api-status { display:inline-block; border-radius:14px; padding:3px 8px; background:#e7eef5; }
.api-status.active,.api-status.approved { color:#087443; background:#e4f6ec; }
.api-status.pending { color:#8a5b00; background:#fff3cf; }
.api-status.suspended,.api-status.expired,.api-status.revoked { color:#a5231c; background:#fde8e7; }
.api-doc-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.api-doc-grid div { display:flex; flex-direction:column; gap:7px; padding:10px; background:#f5f8fb; border:1px solid #d8e2eb; }
.api-doc-grid code { white-space:normal; overflow-wrap:anywhere; color:#0b5f9d; }
#apiSecretDialog textarea { width:100%; box-sizing:border-box; }
@media (max-width:1100px) { .api-admin-grid { grid-template-columns:1fr; } .api-dashboard { grid-template-columns:repeat(2,1fr); } .api-doc-grid { grid-template-columns:1fr; } }
@media (max-width:700px) { .api-dashboard,.api-form,.api-checkbox-list,.api-field-policy details div { grid-template-columns:1fr; } }
