@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
}

:root {
    --accent-color: #47d19e;
    --dark-accent-color: #3cb88a;
}

.bg-accent-color {
    background-color: var(--accent-color);
}

.bg-dark-accent-color {
    background-color: var(--dark-accent-color);
}

.text-accent-color {
    color: var(--accent-color);
}

.font-poppins-bold {
    font-weight: 600;
}

.font-poppins-semibold {
    font-weight: 500;
}

#fullscreen-overlay {
    display: none; /* Start hidden */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8); /* Darken the background */
    z-index: 9999; /* Ensure it's above other content */
    align-items: center;
    justify-content: center;
}

#fullscreen-content {
    display: flex;
    justify-content: center;
    align-items: center;
}

#fullscreen-image {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
}

.fade-in {
    animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}