.container-fluid {
            width: 100%;
            padding: 120px;
            text-align: center;
        }
 .container-fluid h2 {
            color: orange;
            text-align: center;
            padding: 30px;
            font-size: 2.5rem;
        }
        /* Scrollable Table */
        .table-container {
            width: 100%;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            max-width: 100%;
        }
 .container-fluid table {
            width: 100%;
            table-layout: fixed; /* Ensures equal column spacing */
            border-collapse: collapse;
            margin-top: 20px;
        }
.container-fluid th, td {
            padding: 12px;
            font-size: 18px;
            border: 1px solid #ddd;
            color: #003366; /* Dark Blue Font */
            word-break: break-word; /* Forces text to wrap */
            white-space: normal; /* Ensures text wraps */
            max-width: 1px; /* Prevents columns from stretching too much */
            overflow-wrap: break-word; /* Ensures long words wrap */
            text-align: left;
            
        }
.container-fluid th {
            background-color: #2C3E50;
            color: white;
            text-align: center;
        }
        /* Column widths */
        th:nth-child(1), td:nth-child(1) {
            width: 10%;
            text-align: center;
        }
        th:nth-child(2), td:nth-child(2) {
            width: 45%;
        }
        th:nth-child(3), td:nth-child(3) {
            width: 45%;
        }
        /* Alternating row colors */
        tbody tr:nth-child(even) {
            background-color: #f4f4f4;
        }
        tbody tr:nth-child(odd) {
            background-color: #e8f6ff;
        }
        /* Mobile View Enhancements */
        @media screen and (max-width: 768px) {
            .container-fluid {
                padding: 120px;
            }
          .container-fluid  h2 {
                font-size: 1.5rem;
                padding: 20px;
            }
          .container-fluid  th, td {
                padding: 10px;
                font-size: 14px;
                text-align: center;
            }
             /* Column widths */
        th:nth-child(1), td:nth-child(1) {
            width: 15%;
            text-align: center;
        }
        th:nth-child(2), td:nth-child(2) {
            width: 52%;
        }
        th:nth-child(3), td:nth-child(3) {
            width: 32%;
        }
            
        }