/* HOP — kiểu bổ sung cho Bootstrap 5 */

:root {
  --hop-radius: .5rem;
}

body {
  font-size: .94rem;
}

.card {
  border-radius: var(--hop-radius);
}

.page-title {
  font-size: 1.35rem;
  font-weight: 600;
  margin-bottom: 0;
}

/* Nhãn trạng thái phiên họp */
.status-badge {
  font-weight: 500;
  font-size: .78rem;
  padding: .32em .6em;
}
.status-DRAFT                    { background-color: #6c757d; color: #fff; }
.status-PENDING_APPROVAL         { background-color: #fd7e14; color: #fff; }
.status-APPROVED                 { background-color: #0d6efd; color: #fff; }
.status-IN_PROGRESS              { background-color: #6f42c1; color: #fff; }
.status-WAITING_FOR_MINUTES      { background-color: #20c997; color: #08312a; }
.status-MINUTES_PENDING_APPROVAL { background-color: #ffc107; color: #332701; }
.status-MINUTES_APPROVED         { background-color: #0dcaf0; color: #04333b; }
.status-REVISION_REQUIRED        { background-color: #dc3545; color: #fff; }
.status-CLOSED                   { background-color: #198754; color: #fff; }
.status-REOPENED                 { background-color: #d63384; color: #fff; }
.status-CANCELLED                { background-color: #adb5bd; color: #212529; }

/* Bảng dữ liệu */
.table-hop thead th {
  background-color: #f1f3f5;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .02em;
  white-space: nowrap;
}
.table-hop td {
  vertical-align: middle;
}

/* Vùng xem trước biên bản trên web */
.minutes-preview {
  background: #fff;
  padding: 2rem 2.4rem;
  border: 1px solid #dee2e6;
  border-radius: var(--hop-radius);
  max-width: 210mm;
  margin: 0 auto;
  overflow-x: auto;
}
.minutes-preview table.data {
  width: 100%;
}

/* Dòng thời gian lịch sử trạng thái */
.timeline {
  list-style: none;
  padding-left: 0;
  margin: 0;
  border-left: 2px solid #dee2e6;
}
.timeline > li {
  position: relative;
  padding: .3rem 0 .9rem 1.1rem;
}
.timeline > li::before {
  content: "";
  position: absolute;
  left: -.42rem;
  top: .65rem;
  width: .72rem;
  height: .72rem;
  border-radius: 50%;
  background: #0d6efd;
  border: 2px solid #fff;
}

/* Bảng điểm danh */
.attendance-row.is-absent {
  background-color: #fff5f5;
}
.attendance-row.is-present {
  background-color: #f3fbf6;
}

/* Ô chọn giáo viên */
.teacher-picker {
  max-height: 26rem;
  overflow-y: auto;
}

.required-mark::after {
  content: " *";
  color: #dc3545;
  font-weight: 700;
}

@media print {
  .navbar, footer, .no-print { display: none !important; }
  .minutes-preview { border: 0; padding: 0; }
}