/* Default Light Mode */
body {
    background: linear-gradient(to bottom, #f8fafc, #eef2ff);
    font-family: 'Inter', sans-serif;
    color: #1f2937;
    transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
}

/* Dark Mode */
body.dark {
    background: #121212;
    color: #e5e7eb;
}

.dark #gallery img {
    box-shadow: 0 4px 15px rgba(255, 255, 255, 0.1);
}

.dark #modal {
    background: rgba(0, 0, 0, 0.8);
}

.dark button {
    background: #1e293b;
    color: white;
}

.dark #dark-mode-toggle {
    background: #1e293b;
    color: white;
}

/* Image Styles */
#gallery img {
    transition: transform 0.3s ease-in-out, box-shadow 0.3s;
}

#gallery img:hover {
    transform: scale(1.05);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

/* Pagination Styling */
#pagination {
    display: flex;
    gap: 8px;
}