nav, #loginStatus, #filters { background-color: #3cc471; color: #111 } #content.full-height { /*height: calc(100vh - 413px);*/ flex: 1 0 auto; } .main { display: flex; flex-direction: column; min-height: 100vh; } .facilityContent { overflow-y: auto; } #title { margin-top: 12px; background-color: #fff; color: #000; } #menu { border-top: solid 6px #000; background-color: #fff; color: #fff; height: 400px; } #menu a { /*background-color: #f00;*/ color: #fff; text-decoration: none; display: block; } #menu a:hover { /*background-color: #f00;*/ color: #ddd; text-decoration:underline; display: block; } #content { background-color: #fff; /*border-top: solid 6px #f00;*/ } #footer { margin-top: 20px; text-align: center; background-color: #bbb; color: #111; } .modal { z-index: 1055 } .modal-backdrop { z-index: 1040; } .site-footer { flex: 0 0 auto; } td { white-space:pre-line } /* Enhanced Facility Table Styles */ #facilityTable { border-collapse: separate; border-spacing: 0; font-size: 0.9rem; table-layout: fixed; width: 100%; } #facilityTable thead th { border-bottom: 1px solid #dee2e6; font-weight: 600; color: #495057; font-size: 0.85rem; padding: 0.5rem; position: relative; overflow: hidden; } #facilityTable tbody tr { transition: all 0.2s ease; } #facilityTable tbody tr:hover { background-color: rgba(60, 196, 113, 0.05); } #facilityTable tbody td { vertical-align: middle; border-bottom: 1px solid #f0f0f0; line-height: 1.3; word-wrap: break-word; overflow-wrap: break-word; hyphens: auto; padding: 0.5rem; position: relative; } /* Prevent content overflow */ #facilityTable th, #facilityTable td { box-sizing: border-box; overflow: hidden; } .facility-icon { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); flex-shrink: 0; } .description-container { position: relative; max-width: 100%; } .description-container p { line-height: 1.4; color: #495057; margin-bottom: 0; word-wrap: break-word; overflow-wrap: break-word; } .description-container p.expanded { white-space: normal; word-wrap: break-word; overflow-wrap: break-word; } .show-more-btn { color: #3cc471; font-size: 0.75rem; } .show-more-btn:hover { color: #2a9d55; } /* Badge styling */ .badge.bg-opacity-10 { font-weight: 500; letter-spacing: 0.3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); font-size: 0.75rem; display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; } /* Action buttons */ .btn.rounded-circle { width: 28px; height: 28px; padding: 0; display: flex; align-items: center; justify-content: center; transition: all 0.2s; flex-shrink: 0; } .btn.rounded-circle:hover { transform: translateY(-1px); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } /* Ensure action buttons are properly aligned */ .d-flex.justify-content-center.gap-1 { flex-wrap: nowrap; } /* Toggle button styling */ .toggle-content-btn { display: block; margin-top: 0.25rem; font-size: 0.75rem; color: #3cc471; } .toggle-content-btn:hover { color: #2a9d55; } /* Pagination styling */ .pagination .page-link { color: #3cc471; border-color: #e9ecef; } .pagination .page-item.active .page-link { background-color: #3cc471; border-color: #3cc471; color: white; } .pagination .page-link:hover { background-color: #f8f9fa; border-color: #e9ecef; color: #2a9d55; } /* Card styling */ .card.shadow { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important; } /* Text truncation with ellipsis */ .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; } /* Cell content wrapping */ .cell-content { word-wrap: break-word; overflow-wrap: break-word; white-space: normal; max-height: 3.9em; /* Approximately 3 lines of text */ overflow: hidden; position: relative; width: 100%; } .address-content { word-wrap: break-word; overflow-wrap: break-word; white-space: normal; max-height: 2.6em; /* Approximately 2 lines of text */ overflow: hidden; width: 100%; } /* Ensure title column has proper alignment */ .fw-medium .d-flex { align-items: center; width: 100%; } /* Fix for coordinates column */ .text-nowrap { white-space: nowrap !important; } .navbar-brand img { transition: transform 0.3s ease; } .navbar-brand:hover img { transform: scale(1.05); } .search-controls { max-width: 800px; } .form-control:focus, .form-select:focus { border-color: #198754; box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.25); } .user-avatar { width: 32px; height: 32px; background-color: #e9ecef; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 8px; } .user-menu { display: flex; align-items: center; } @media (max-width: 992px) { .search-controls { margin-top: 1rem; margin-bottom: 1rem; } }