there trapped every Bootstrap modal (z-index 1050+) behind the modal backdrop, which is a sibling of at z-index 1040 and sits outside that stacking context, making dialogs like Add Room render but be completely unclickable. */ body.home-page .container, body.home-page .container-fluid { max-width: 1380px; } body.home-page h1, body.home-page h2, body.home-page h3, body.home-page h4, body.home-page h5, body.home-page h6 { color: var(--icaisf-navy); } body.home-page .dashboard-shell-header { position: sticky; top: 0; z-index: 1030; background: #143a52; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.12); box-shadow: 0 12px 30px rgba(8, 27, 44, 0.18); } body.home-page .dashboard-shell-footer { background: #0f2230; color: #d7e3ea; margin-top: 40px; border-top: 1px solid rgba(255, 255, 255, 0.08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05); } body.home-page .dashboard-shell-header-inner, body.home-page .dashboard-shell-footer-inner { max-width: 1400px; padding: 14px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; } body.home-page .dashboard-shell-brand { display: flex; align-items: center; gap: 14px; color: #fff; text-decoration: none; } body.home-page .dashboard-shell-logo { height: 52px; width: auto; display: block; } body.home-page .dashboard-shell-kicker { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.78; } body.home-page .dashboard-shell-title { font-size: 1.1rem; font-weight: 700; line-height: 1.2; } body.home-page .dashboard-shell-nav, body.home-page .dashboard-shell-footer-links { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; } body.home-page .dashboard-shell-nav a, body.home-page .dashboard-shell-footer-links a { color: inherit; text-decoration: none; font-weight: 600; } body.home-page .dashboard-shell-footer-copy { font-size: 0.92rem; } body.home-page .dashboard-shell-footer-copy span { opacity: 0.82; } body.home-page .card, body.home-page .auth-card, body.home-page .admin-surface-card, body.home-page .admin-side-menu, body.home-page .participant-directory-card, body.home-page .program-summary-card, body.home-page .metric-card { border: 1px solid var(--icaisf-border); border-radius: 18px; background: rgba(255, 255, 255, 0.96); box-shadow: var(--icaisf-shadow-sm); } body.home-page .card-header, body.home-page .auth-card .card-header, body.home-page .admin-surface-card .card-header { background: linear-gradient(135deg, var(--icaisf-navy) 0%, #173a5f 100%); border-color: transparent; color: #fff; font-weight: 700; border-radius: 18px 18px 0 0 !important; } body.home-page .alert { border-radius: 14px; border-width: 1px; } body.home-page .alert-info { background: #edf6fb; border-color: #c6deed; color: #1e4a67; } body.home-page .alert-success { background: #edf8f2; border-color: #cce8d7; color: #195738; } body.home-page .alert-warning { background: #fff8e9; border-color: #efd8a9; color: #805617; } body.home-page .alert-danger { background: #fff0ef; border-color: #efc0bc; color: #8f2d27; } body.home-page .btn-primary, body.home-page .btn-brand, body.home-page .btn-auth, body.home-page .header-get-a-quote .btn-primary, body.home-page .participant-page-btn.btn-primary, body.home-page .participant-page-btn.btn-outline-primary:hover { background: linear-gradient(135deg, var(--icaisf-blue) 0%, #174f79 100%); border-color: #174f79; color: #fff; box-shadow: 0 10px 18px rgba(31, 95, 139, 0.18); } body.home-page .btn-primary:hover, body.home-page .btn-primary:focus, body.home-page .btn-brand:hover, body.home-page .btn-auth:hover, body.home-page .btn-auth:focus, body.home-page .header-get-a-quote .btn-primary:hover, body.home-page .participant-page-btn.btn-primary:hover { background: linear-gradient(135deg, #184c73 0%, var(--icaisf-navy) 100%); border-color: var(--icaisf-navy); color: #fff; } body.home-page .btn-outline-primary, body.home-page .participant-page-btn.btn-outline-primary, body.home-page .btn-outline-secondary { border-radius: 12px; border-color: #b6cad8; color: var(--icaisf-blue); background: #fff; } body.home-page .btn-outline-primary:hover, body.home-page .btn-outline-primary:focus, body.home-page .btn-outline-secondary:hover, body.home-page .btn-outline-secondary:focus { border-color: var(--icaisf-blue); background: #eef5fa; color: var(--icaisf-navy); } body.home-page .form-control, body.home-page .custom-select, body.home-page select.form-control, body.home-page .form-select, body.home-page textarea.form-control { min-height: 44px; border-color: #c9d8e4; border-radius: 12px; /* background-color, not the "background" shorthand: the shorthand resets background-image too, which silently deletes the dropdown-arrow icon that .form-select relies on (see dashboard-inline.css), leaving a