/* Batch allotments: extends the shared directory design. */
.allotment-list-page .sl-hero {
  background: linear-gradient(118deg, #263b80 0%, #4f46b8 58%, #8b5bc5 125%);
  box-shadow: 0 17px 40px rgba(63, 55, 151, .21);
}
.allotment-list-page .sl-add-btn { color: #4c43ac; }
.allotment-list-page .sl-add-btn:hover { color: #332c84; }
.allotment-list-page .sl-record-count strong { color: #594fc0; }
.allotment-list-page .sl-search-wrap input:focus { border-color: #a79fe0; box-shadow: 0 0 0 3px rgba(89,79,192,.1); }
.allotment-list-page table.al-table { min-width: 1050px; }

.allotment-list-page .al-student,
.allotment-list-page .al-batch { display: flex; min-width: 205px; align-items: center; gap: 10px; }
.allotment-list-page .al-student > div,
.allotment-list-page .al-batch > div { min-width: 0; }
.allotment-list-page .al-student strong,
.allotment-list-page .al-batch strong { display: block; overflow: hidden; max-width: 195px; color: #24324c; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.allotment-list-page .al-student small,
.allotment-list-page .al-batch small { display: block; overflow: hidden; max-width: 195px; margin-top: 3px; color: #98a2b3; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.allotment-list-page .al-batch > span { display: grid; width: 37px; height: 37px; flex: 0 0 37px; place-items: center; border-radius: 11px; color: #5b50bd; background: #f0effc; font-size: 12px; }

.allotment-list-page .al-date { display: inline-flex; min-width: 110px; align-items: center; gap: 8px; }
.allotment-list-page .al-date i { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; color: #6c63c7; background: #f2f1fc; font-size: 9px; }
.allotment-list-page .al-date strong { color: #536178; font-size: 10px; font-weight: 700; white-space: nowrap; }
.allotment-list-page .al-fee { color: #33425b; font-size: 10.5px; font-weight: 700; white-space: nowrap; }

.allotment-list-page .al-status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 999px; font-size: 9px; font-weight: 700; text-transform: capitalize; white-space: nowrap; }
.allotment-list-page .al-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.allotment-list-page .al-status-active { color: #067647; background: #ecfdf3; }
.allotment-list-page .al-status-inactive { color: #b42318; background: #fef3f2; }

@media (max-width: 767px) {
  .allotment-list-page table.al-table { min-width: 990px; }
}