/* Custom styles for Synaps Dashboard */

/* Smooth transitions for HTMX swaps */
.htmx-swapping {
    opacity: 0;
    transition: opacity 200ms ease-out;
}

.htmx-settling {
    opacity: 1;
    transition: opacity 200ms ease-in;
}

/* Badge styles */
.badge {
    display: inline-flex;
    padding: 0.125rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 9999px;
}

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

::-webkit-scrollbar-track {
    background: #f1f5f9;
}

::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

/* Mobile top bar spacing — push main content below fixed header */
@media (max-width: 1023px) {
    main {
        padding-top: 4.5rem !important;
    }
}

/* Prevent body scroll when sidebar overlay is open */
body.sidebar-open {
    overflow: hidden;
}

/* Line clamp utility for article headlines on mobile */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Better touch targets and readability on mobile */
@media (max-width: 640px) {
    /* Tables: tighter spacing on mobile */
    table th, table td {
        white-space: nowrap;
    }

    /* Prevent iOS zoom on select focus */
    select {
        font-size: 16px;
    }
}