.col-lg-custom-5 {
    flex: 0 0 50%;
    max-width: 50%;
}

@media (min-width: 768px) {
    .col-lg-custom-5 {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

@media (min-width: 992px) {
    .col-lg-custom-5 {
        flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}

@media (max-width: 576px) {
    .info-boxes-row {
        margin-left: -5px;
        margin-right: -5px;
    }

    .info-boxes-row [class*="col-"] {
        padding-left: 5px;
        padding-right: 5px;
    }
}

.aggregate-hours-value {
    font-size: 1.1rem;
    font-weight: 800;
    color: #2c3e50;
    letter-spacing: 0.5px;
    font-family: "Courier New", Courier, monospace;
}

body.dark-mode .aggregate-hours-value {
    color: #ffffff;
}

@media (max-width: 576px) {
    .aggregate-hours-value {
        font-size: 0.9rem;
    }

    .aggregate-hours-container {
        padding-top: 2px !important;
        margin-top: 4px !important;
    }
}

/* Centered Modal Style for Mobile */
@media (max-width: 576px) {
    .modal-dialog {
        margin: 15px !important;
        display: flex !important;
        align-items: center !important;
        min-height: calc(100% - 30px) !important;
        justify-content: center !important;
    }

    .modal-content {
        border-radius: 15px !important;
        border: none !important;
        width: 100% !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
        overflow: hidden;
    }

    .modal.fade .modal-dialog {
        transform: scale(0.9) !important;
        transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
    }

    .modal.show .modal-dialog {
        transform: scale(1) !important;
    }

    .modal-header {
        border-radius: 15px 15px 0 0 !important;
    }

    .modal-body {
        max-height: 75vh;
        overflow-y: auto;
    }
}