/* V25.111 UI hardening pass: prevents staff/student page overlap, clipped controls, and horizontal blowouts. */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
main, .container, .container-fluid, .row, [class*="col-"] { min-width: 0; }
.card, .alert, .list-group-item, .dropdown-menu, .modal-content, .staff-page-header, .staff-content, .staff-app-main, .staff-main-content { min-width: 0; overflow-wrap: anywhere; }
.card-body, .modal-body, .accordion-body { min-width: 0; }
img, svg, video, canvas, iframe { max-width: 100%; }
pre, code, .commerce-json, .text-break, .staff-content pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.btn, .badge, .nav-link, .dropdown-item, .input-group-text { white-space: normal; }
.input-group { flex-wrap: nowrap; min-width: 0; }
.input-group > .form-control, .input-group > .form-select { min-width: 0; }
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table { vertical-align: middle; }
.table th, .table td { overflow-wrap: anywhere; }
.staff-app-shell { min-width: 0; }
.staff-sidebar { z-index: 1040; }
.staff-topbar { z-index: 1050; }
.staff-content, .staff-app-main, .staff-main-content { overflow-x: clip; }
.staff-page-header { align-items: flex-start !important; gap: 1rem; }
.staff-page-header .btn, .staff-page-header .d-flex { flex-wrap: wrap; }
.card .d-flex, .alert .d-flex, td .d-flex, .staff-topbar-actions { min-width: 0; flex-wrap: wrap; }
.card .justify-content-between, .alert .justify-content-between { gap: .75rem; }
.form-control, .form-select, textarea { max-width: 100%; }
@media (max-width: 991.98px) {
  .staff-page-header, .page-header, .hero-actions, .t24-hero-actions { flex-direction: column; align-items: stretch !important; }
  .staff-page-header .btn, .page-header .btn, .hero-actions .btn, .t24-hero-actions .btn { width: 100%; }
  .table:not(.no-mobile-scroll-table) { display: block; width: 100%; overflow-x: auto; white-space: nowrap; }
  .table:not(.no-mobile-scroll-table) th, .table:not(.no-mobile-scroll-table) td { white-space: normal; min-width: 9rem; }
  .input-group { flex-wrap: wrap; }
  .input-group > .form-control, .input-group > .form-select, .input-group > .input-group-text { flex: 1 1 auto; }
}
@media (max-width: 575.98px) {
  .container, .container-fluid { padding-left: 1rem; padding-right: 1rem; }
  .card-body { padding: 1rem !important; }
  .display-1, .display-2, .display-3, .display-4, .display-5, .display-6 { font-size: clamp(1.6rem, 8vw, 2.4rem); }
  .h1, h1 { font-size: clamp(1.55rem, 7vw, 2.1rem); }
  .h2, h2 { font-size: clamp(1.35rem, 6vw, 1.8rem); }
}