/* Modern Table Pagination Styles */

/* Bottom controls container */
.dataTables_wrapper .bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    padding: 12px 0;
}

/* All pagination buttons base styles */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
    color: #A0AEC0 !important;
    border: none !important;
    background: #FFFFFF !important;
    margin: 0 5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    gap: 10px !important;
    text-decoration: none !important;
    outline: none !important;
}

/* Hover state for all buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #F7FAFC !important;
    color: #4A5568 !important;
}

/* Active/current page button */
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
    padding: 8px !important;
    background: #FF6500 !important;
    color: white !important;
    opacity: 1 !important;
    gap: 10px !important;
}

/* Previous/Next buttons - transparent style */
.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.next {
    background: transparent !important;
    border: none !important;
    color: #A0AEC0 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover {
    background: transparent !important;
    color: #4A5568 !important;
}

/* Disabled buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    color: #CBD5E0 !important;
    background: #F7FAFC !important;
    cursor: not-allowed !important;
}

/* Focus states - remove outlines */
.dataTables_wrapper .dataTables_paginate .paginate_button:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Bootstrap pagination compatibility */
.pagination>.active>a {
    width: 40px !important;
    height: 40px !important;
    gap: 10px !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important; 
    opacity: 1 !important;
    border-radius: 12px !important;
    padding: 8px !important;
    background: #FF6500 !important;
    color: white !important;
}

.pagination>li>a {
    border: none !important;
    background: transparent !important;
}

/* Responsive design for mobile */
@media (max-width: 768px) {
    .dataTables_wrapper .bottom {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }
}