/* Batch management: extends the shared directory design. */
.batch-list-page .sl-hero {
  background: linear-gradient(118deg, #104d68 0%, #0f7690 58%, #17a99b 125%);
  box-shadow: 0 17px 40px rgba(15, 103, 126, .2);
}
.batch-list-page .sl-add-btn { color: #0d7180; }
.batch-list-page .sl-add-btn:hover { color: #075465; }
.batch-list-page .sl-record-count strong { color: #0d8791; }
.batch-list-page .sl-search-wrap input:focus { border-color: #76bdc4; box-shadow: 0 0 0 3px rgba(13, 135, 145, .1); }
.batch-list-page table.bl-table { min-width: 1180px; }

.batch-list-page .bl-name-cell { display: flex; min-width: 210px; align-items: center; gap: 11px; }
.batch-list-page .bl-name-cell > div { min-width: 0; }
.batch-list-page .bl-icon { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 11px; font-size: 13px; }
.batch-list-page .bl-icon-1 { color: #087a91; background: #e9fafd; }
.batch-list-page .bl-icon-2 { color: #3157d5; background: #eef2ff; }
.batch-list-page .bl-icon-3 { color: #067647; background: #ecfdf3; }
.batch-list-page .bl-icon-4 { color: #6941c6; background: #f4f0ff; }
.batch-list-page .bl-name-cell strong { display: block; overflow: hidden; max-width: 205px; color: #24324c; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.batch-list-page .bl-name-cell small { display: block; overflow: hidden; max-width: 205px; margin-top: 3px; color: #98a2b3; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }

.batch-list-page .bl-schedule { min-width: 135px; }
.batch-list-page .bl-schedule strong { display: block; color: #4d5b72; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.batch-list-page .bl-schedule span { display: block; margin-top: 4px; color: #929dad; font-size: 9.5px; white-space: nowrap; }
.batch-list-page .bl-schedule i { margin-right: 3px; color: #63a7b2; }

.batch-list-page .bl-timing { min-width: 150px; }
.batch-list-page .bl-timing strong { display: flex; align-items: center; gap: 6px; color: #536178; font-size: 10px; font-weight: 600; white-space: nowrap; }
.batch-list-page .bl-timing strong i { color: #7991a8; }
.batch-list-page .bl-mode { display: inline-flex; margin-top: 5px; padding: 3px 7px; border-radius: 6px; color: #52627a; background: #eef1f5; font-size: 8.5px; font-weight: 700; }
.batch-list-page .bl-mode-online { color: #3157d5; background: #eef2ff; }
.batch-list-page .bl-mode-hybrid { color: #6941c6; background: #f4f0ff; }
.batch-list-page .bl-mode-offline { color: #087a91; background: #e9fafd; }

.batch-list-page .bl-capacity { display: inline-flex; min-width: 76px; align-items: center; gap: 7px; color: #7d899c; }
.batch-list-page .bl-capacity i { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 8px; color: #0d8791; background: #eaf8f8; font-size: 9px; }
.batch-list-page .bl-capacity strong { color: #4d5b72; font-size: 10px; font-weight: 700; white-space: nowrap; }
.batch-list-page .bl-fee { color: #33425b; font-size: 10.5px; font-weight: 700; white-space: nowrap; }

.batch-list-page .bl-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; }
.batch-list-page .bl-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.batch-list-page .bl-status-active { color: #067647; background: #ecfdf3; }
.batch-list-page .bl-status-upcoming { color: #b54708; background: #fff4e5; }
.batch-list-page .bl-status-completed { color: #475467; background: #f2f4f7; }

@media (max-width: 767px) {
  .batch-list-page table.bl-table { min-width: 1100px; }
}