@keyframes scaleUp {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.animate-scale-up {
    animation: scaleUp 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.tab-btn.active {
    background-color: rgb(30 41 59);
    color: rgb(251 191 36);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}

.tab-btn:hover:not(.active) {
    background-color: rgb(15 23 42 / 0.5);
    color: rgb(248 250 252);
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Strict mobile touch scrolling & viewport management */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    -webkit-overflow-scrolling: touch;
    touch-action: manipulation;
}

main {
    -webkit-overflow-scrolling: touch;
    touch-action: auto;
}

/* Strict visibility & pointer-events rules */
.hidden,
[hidden],
#login-overlay.hidden,
#modal-edit-customer.hidden,
#modal-edit-driver.hidden,
#document-modal.hidden,
#modal-add-captain.hidden,
#image-zoom-modal.hidden,
#mobile-sidebar-backdrop.hidden {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
}

/* Ensure active modals become visible and clickable */
#document-modal.active,
#modal-add-captain.active,
#image-zoom-modal.active,
#modal-edit-customer.active,
#modal-edit-driver.active {
    display: flex !important;
    pointer-events: auto !important;
    visibility: visible !important;
}

#mobile-sidebar-backdrop.active {
    display: block !important;
    pointer-events: auto !important;
    visibility: visible !important;
}

.tab-content.hidden {
    display: none !important;
}
.tab-content:not(.hidden) {
    display: block !important;
}