/* Remove the Google Fonts import since it's now in theme.css */
/* Font families are now defined in theme.css */
/* Color variables are now defined in theme.css */

/* All CSS variables moved to theme.css */

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    color-scheme: light dark;
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    /* Font-family now handled in theme.css */
    color: var(--text-color, CanvasText);
    background-color: var(--background-color, Canvas);
    line-height: 1.6;
    transition: background-color 0.3s ease, color 0.3s ease;
}

body {
    min-height: 100vh;
    /* Subtle gradient background for visual depth */
    background: linear-gradient(135deg, var(--background-color) 0%, var(--color-light-grey) 100%);
    background-attachment: fixed; /* Keep gradient fixed during scroll */
}

a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: underline;
}

h1, h2, h3 {
    /* Font-family now handled in theme.css */
    margin: 0;
}

h1 {
    font-size: 3rem;
    color: var(--text-color);
}

.container {
    margin: 0 auto;
    padding: 0px;
}

/* Icons */
.icon {
    width: 16px;
    height: 16px;
    margin-right: 2px;
    flex-shrink: 0;
}

/* Basic Transitions */
.fade-in {
    opacity: 1;
    transition: opacity 0.5s ease-in;
}

.fade-out {
    opacity: 0;
    transition: opacity 0.5s ease-out;
}