.table-responsive-wrapper {
        width: 100%;
        overflow-x: auto;
    }

    .table-responsive-wrapper table {
        min-width: 1000px; /* Adjust based on your actual content */
        width: 100%;
        border-collapse: collapse;
    }

    .pagination-container {
        display: flex;
        justify-content: space-between; 
    }

    .entries-wrapper {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .entries-wrapper label {
        margin-bottom: 0px;
    }

    th.center-content {
        white-space: nowrap;
    }
    td.center-content {
        white-space: nowrap;
    }

    td:first-child,
    th:first-child {
        position: sticky;
        left: 0;
        z-index: 2;
        box-shadow: 2px 0 5px rgba(0,0,0,0.05);
    }

    td:last-child {
        white-space: nowrap;
        width: 1%;
        text-align: right;
        padding: 12px 16px;
    }

    td:last-child,
    th:last-child {
        position: sticky;
        right: 0;
        z-index: 2;
        box-shadow: -2px 0 5px rgba(0,0,0,0.05);
    }

    .md-center {
        padding: 0.5rem;
        font-family: 'Courier New', Courier, monospace;
        font-size: large;
        border: 1px solid #ffffff;
        border-radius: 0.5rem;
    }

    /* ================================================================== */

    .btn {
        display: inline-block;
        border: 1px solid transparent;
        padding: 0.3em 0.6em;
        line-height: 1.4;
        border-radius: 0.5em;
        margin: 0.1em;
        font-size: clamp(0.8rem, 1vw, 0.5rem);
        box-shadow: 0.4em 0.4em 0.9em rgba(0, 0, 0, 0.4);
        cursor: pointer;
        transition: all 0.2s ease-in-out;
        text-align: center;
        white-space: nowrap;
    }

    .btn.save, 
    .btn.update {
        color: #fff;
        background-color: #339933;
        border-color: #267326;
    }

    .btn.view {
        color: #fff;
        background-color: #1439a6;
        border-color: #143996;
    }

    .btn.delete {
        color: #fff;
        background-color: #990000;
        border-color: #730000;
    }

    .btn.caution {
        color: #fff;
        background-color: #FE9900;
        border-color: #b36b00;
    }

    .btn.disapprove {
        color: #fff;
        background-color: #fbbf0a; 
        border-color: #f9bb00; 
    }

    @media (max-width: 600px) {
        .btn {
            padding: 0.1em 0.5em;
            font-size: clamp(0.8rem, 4vw, 0.95rem);
            border-radius: 0.5em;
            box-shadow: 0.2em 0.2em 0.6em rgba(0, 0, 0, 0.3);
        }
    }

    .btn:hover,
    .btn:focus {
        opacity: 0.9;
        transform: translateY(-2px);
        box-shadow: 0.4em 0.6em 1em rgba(0, 0, 0, 0.5);
    }

    /* ================================================================== */

    .btn-group .btn {
        border-radius: 8px;
        margin: 0 3px;
        padding: 8px 12px;
        background: #f8f9fa;
        color: #000000;
        border: 1px solid #ddd;
        transition: all 0.2s ease;
    }

    .btn-group .btn:hover {
        background: #4a90e2;
        color: #fff;
        border-color: #4a90e2;
    }

    .btn-group .btn:focus {
        outline: none;
        box-shadow: 0 0 6px rgba(74,144,226,0.5);
    }

    .btn-group .dropdown-toggle {
        border-radius: 8px;
        background: #fff;
    }

    .btn-group .dropdown-menu {
        border-radius: 8px;
        box-shadow: 0 6px 16px rgba(0,0,0,0.1);
        padding: 6px 0;
    }

    .btn-group .dropdown-menu li a {
        padding: 8px 16px;
        transition: background 0.2s ease;
    }

    .btn-group .dropdown-menu li a:hover {
        background: #f0f6ff;
        color: #4a90e2;
    }

    .btn-group {
        display: inline-flex;
        align-items: center;
        gap: 6px; 
    }

    .btn-group i {
        font-size: 14px; 
    }

    .modern-dropdown {
        max-height: 220px;
        overflow-y: auto;
        border-radius: 10px;
        padding: 6px 0;
        border: 1px solid #eee;
        box-shadow: 0 6px 16px rgba(0,0,0,0.1);
    }

    .modern-dropdown li a {
        display: block;
        padding: 10px 16px;
        color: #333;
        text-decoration: none;
        font-size: 14px;
        transition: background 0.2s ease, color 0.2s ease;
        border-radius: 6px;
        margin: 2px 8px;
    }

    .modern-dropdown li a:hover {
        background: #eef5ff;
        color: #4a90e2;
    }

    .modern-dropdown li a.active {
        background: #4a90e2;
        color: #fff;
        font-weight: 600;
    }