.gallery-card {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .gallery-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 20px rgba(0,0,0,0.1);
        }
        .date-filter-btn {
            transition: all 0.2s ease;
        }
        .date-filter-btn.active {
            background-color: #3b82f6;
            color: white;
            transform: scale(1.05);
        }
        
        /* Skeleton loading animation */
        @keyframes pulse {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.5; }
        }
        .skeleton {
            animation: pulse 1.5s ease-in-out infinite;
            background-color: #e2e8f0;
        }
        .skeleton-img {
            width: 100%;
            height: 192px;
            background-color: #cbd5e1;
        }
        .skeleton-text {
            height: 20px;
            background-color: #e2e8f0;
            margin-bottom: 8px;
            border-radius: 4px;
        }
        .skeleton-text.short {
            width: 60%;
        }

        footer{
            position: absolute;
            color: grey;
            size: 6px;
            bottom: 3px;
            right: 3px;
        }