/* OSRS League Tracker — Custom Styles */

/* Fonts */
.font-cinzel { font-family: 'Cinzel', serif; }
.font-sans { font-family: 'Source Sans 3', system-ui, sans-serif; }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #1a1a1a; }
::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #3a3a3a; }

/* Nav links */
.nav-link {
    @apply px-3 py-1.5 text-sm text-gray-400 hover:text-gray-200 rounded-md transition-colors;
}
.nav-link:hover {
    background: rgba(255, 255, 255, 0.05);
}

/* Task row transitions */
.task-row {
    transition: opacity 0.2s ease, background-color 0.15s ease;
}
.task-card {
    transition: opacity 0.2s ease, border-color 0.15s ease, transform 0.15s ease;
}
.task-card:hover {
    transform: translateY(-1px);
}

/* Checkbox styling */
input[type="checkbox"].accent-osrs-gold {
    accent-color: #c8aa6e;
}
input[type="radio"].accent-osrs-gold {
    accent-color: #c8aa6e;
}

/* Flash messages auto-fade */
.flash-msg {
    animation: flashFade 4s ease-in-out forwards;
}
@keyframes flashFade {
    0%, 70% { opacity: 1; }
    100% { opacity: 0; pointer-events: none; }
}

/* View transition */
#view-table, #view-cards {
    animation: fadeIn 0.15s ease-in;
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Progress bars */
.bg-osrs-gold { background-color: #c8aa6e; }

/* Line clamp utility (for card descriptions) */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Filter panel mobile collapse */
@media (max-width: 639px) {
    #filter-body.collapsed {
        display: none;
    }
}

/* Disable state for buttons */
button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Table striping subtle */
#task-tbody tr:nth-child(even) {
    background-color: rgba(26, 26, 26, 0.3);
}