/* v248 — Student attendance modal: date-wise details and responsive layout */
.attendance-modal, .student-attendance-modal, .attendance-detail-modal {
  color:#16304d !important;
  font-family:Inter,"Segoe UI",Arial,sans-serif !important;
}
.attendance-modal .modal-content,
.student-attendance-modal .modal-content,
.attendance-detail-modal .modal-content {
  width:min(1180px,calc(100vw - 32px)) !important;
  max-width:1180px !important;
  max-height:calc(100dvh - 32px) !important;
  overflow:auto !important;
  border:1px solid #dce6f2 !important;
  border-radius:24px !important;
  background:#fff !important;
  box-shadow:0 24px 70px rgba(8,28,52,.28) !important;
}
.attendance-modal .modal-header,
.student-attendance-modal .modal-header,
.attendance-detail-modal .modal-header {
  padding:24px 28px !important;
  border-bottom:1px solid #e7edf5 !important;
  background:linear-gradient(135deg,#fff 0%,#f7faff 100%) !important;
}
.attendance-modal .modal-header h2,
.student-attendance-modal .modal-header h2,
.attendance-detail-modal .modal-header h2 {
  color:#102b49 !important;
  font-size:clamp(23px,2vw,30px) !important;
  font-weight:850 !important;
  line-height:1.25 !important;
  margin:6px 0 8px !important;
}
.attendance-modal .modal-header .eyebrow,
.student-attendance-modal .modal-header .eyebrow,
.attendance-detail-modal .modal-header .eyebrow {
  color:#b88a17 !important;
  font-size:12px !important;
  font-weight:850 !important;
  letter-spacing:.15em !important;
}
.attendance-modal .modal-body,
.student-attendance-modal .modal-body,
.attendance-detail-modal .modal-body {
  padding:24px 28px 28px !important;
}
.attendance-modal .attendance-toolbar,
.student-attendance-modal .attendance-toolbar,
.attendance-detail-modal .attendance-toolbar {
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  flex-wrap:wrap !important;
  gap:14px !important;
  padding:16px !important;
  margin:0 0 20px !important;
  border:1px solid #e1e9f3 !important;
  border-radius:16px !important;
  background:#f7faff !important;
}
.attendance-modal label,
.student-attendance-modal label,
.attendance-detail-modal label {
  color:#38536f !important;
  font-size:13px !important;
  font-weight:750 !important;
}
.attendance-modal select,
.student-attendance-modal select,
.attendance-detail-modal select {
  min-height:44px !important;
  border:1px solid #cad8e8 !important;
  border-radius:11px !important;
  padding:9px 13px !important;
  color:#183452 !important;
  background:#fff !important;
  font-size:14px !important;
}
.attendance-modal .btn-primary,
.student-attendance-modal .btn-primary,
.attendance-detail-modal .btn-primary {
  min-height:44px !important;
  padding:11px 18px !important;
  border:1px solid #d5a51d !important;
  border-radius:12px !important;
  background:linear-gradient(135deg,#f3cc57,#dcae27) !important;
  color:#122b47 !important;
  font-size:14px !important;
  font-weight:850 !important;
}
.attendance-modal .attendance-stats,
.student-attendance-modal .attendance-stats,
.attendance-detail-modal .attendance-stats {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:13px !important;
  margin:0 0 22px !important;
}
.attendance-modal .attendance-stat,
.student-attendance-modal .attendance-stat,
.attendance-detail-modal .attendance-stat {
  min-width:0 !important;
  padding:18px !important;
  border:1px solid #dfe8f3 !important;
  border-radius:17px !important;
  background:#fff !important;
  box-shadow:0 7px 18px rgba(19,48,79,.05) !important;
}
.attendance-modal .attendance-stat strong,
.student-attendance-modal .attendance-stat strong,
.attendance-detail-modal .attendance-stat strong {
  display:block !important;
  color:#103568 !important;
  font-size:clamp(25px,2.4vw,34px) !important;
  font-weight:900 !important;
  line-height:1.15 !important;
  margin:0 0 8px !important;
}
.attendance-modal .attendance-stat span,
.student-attendance-modal .attendance-stat span,
.attendance-detail-modal .attendance-stat span {
  color:#657b95 !important;
  font-size:13px !important;
  line-height:1.45 !important;
}
.attendance-modal .attendance-table-wrap,
.student-attendance-modal .attendance-table-wrap,
.attendance-detail-modal .attendance-table-wrap {
  width:100% !important;
  overflow:auto !important;
  border:1px solid #e1e9f3 !important;
  border-radius:15px !important;
}
.attendance-modal table,
.student-attendance-modal table,
.attendance-detail-modal table {
  width:100% !important;
  min-width:680px !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
}
.attendance-modal thead th,
.student-attendance-modal thead th,
.attendance-detail-modal thead th {
  padding:14px 16px !important;
  background:#f0f5fb !important;
  color:#415e7e !important;
  font-size:11px !important;
  font-weight:850 !important;
  letter-spacing:.07em !important;
  text-align:left !important;
  border-bottom:1px solid #dbe5f0 !important;
}
.attendance-modal tbody td,
.student-attendance-modal tbody td,
.attendance-detail-modal tbody td {
  padding:14px 16px !important;
  color:#2e4864 !important;
  font-size:13px !important;
  line-height:1.5 !important;
  border-bottom:1px solid #edf1f6 !important;
  vertical-align:middle !important;
}
.attendance-modal tbody tr:nth-child(even),
.student-attendance-modal tbody tr:nth-child(even),
.attendance-detail-modal tbody tr:nth-child(even) {
  background:#fbfdff !important;
}
.attendance-modal .status-present,
.student-attendance-modal .status-present,
.attendance-detail-modal .status-present {
  display:inline-flex !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#e8f8ef !important;
  color:#137447 !important;
  font-size:12px !important;
  font-weight:800 !important;
}
.attendance-modal .status-absent,
.student-attendance-modal .status-absent,
.attendance-detail-modal .status-absent {
  display:inline-flex !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff0ef !important;
  color:#b42318 !important;
  font-size:12px !important;
  font-weight:800 !important;
}
.attendance-modal .status-leave,
.student-attendance-modal .status-leave,
.attendance-detail-modal .status-leave {
  display:inline-flex !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  background:#fff7df !important;
  color:#8a6410 !important;
  font-size:12px !important;
  font-weight:800 !important;
}
@media(max-width:700px) {
  .attendance-modal .modal-content,
  .student-attendance-modal .modal-content,
  .attendance-detail-modal .modal-content {
    width:calc(100vw - 16px) !important;
    max-height:calc(100dvh - 16px) !important;
    border-radius:18px !important;
  }
  .attendance-modal .modal-header,
  .student-attendance-modal .modal-header,
  .attendance-detail-modal .modal-header,
  .attendance-modal .modal-body,
  .student-attendance-modal .modal-body,
  .attendance-detail-modal .modal-body { padding:16px !important; }
  .attendance-modal .attendance-stats,
  .student-attendance-modal .attendance-stats,
  .attendance-detail-modal .attendance-stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:9px !important; }
  .attendance-modal .attendance-stat,
  .student-attendance-modal .attendance-stat,
  .attendance-detail-modal .attendance-stat { padding:14px !important; }
}