app.css

/* app.css */

/* Card Styling */
.card {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    padding: 10px;
    margin: 10px;
    border-radius: 5px;
}

.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

/* Dynamic Theme Styling */
@media (prefers-color-scheme: dark) {
    body {
        color: white;
        background-color: #121212;
    }
    .card {
        background-color: #1e1e1e;
    }
    a {
        color: #bb86fc;
    }
    h1, h2, h3, p, strong {
        color: inherit;
    }
}

@media (prefers-color-scheme: light) {
    body {
        color: black;
        background-color: white;
    }
    .card {
        background-color: #fff;
    }
    a {
        color: #1a0dab;
    }
    h1, h2, h3, p, strong {
        color: inherit;
    }
}