/* Algemene body stijlen die door thema's worden overschreven */
body {
    font-family: 'Inter', SamsungOne, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, Cantarell, 'Noto Sans', Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 0;
    line-height: 1.6;
    animation: bg-pulse 15s ease-in-out infinite alternate;
}

/* Standaard thema (licht modus) */
:root {
    --bg-color: #f8fafc;
    --text-color: #1e293b;
    --bg-image: radial-gradient(at 10% 20%, hsla(215, 98%, 87%, 0.7) 0px, transparent 50%),
                  radial-gradient(at 80% 10%, hsla(250, 100%, 90%, 0.6) 0px, transparent 50%),
                  radial-gradient(at 90% 80%, hsla(190, 100%, 88%, 0.6) 0px, transparent 50%),
                  radial-gradient(at 20% 90%, hsla(280, 100%, 92%, 0.6) 0px, transparent 50%);
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    background-image: var(--bg-image);
}

/* OneUI thema (basis) */
.theme-oneui {
    --bg-color: #f6f6f6; /* OneUI lichte modus achtergrond */
    --text-color: #1a1a1a; /* OneUI lichte modus tekst */
    --oneui-primary-color: #007bff;
    --oneui-secondary-bg: #ffffff;
    --oneui-border-color: #e0e0e0;
    --oneui-card-shadow: rgba(0, 0, 0, 0.08);
    --bg-image: none; /* OneUI heeft meestal geen achtergrondafbeelding */
}

/* OneUI Dark Mode */
.theme-oneui.theme-dark, .theme-oneui.dark-mode {
    --bg-color: #1e1e1e; /* OneUI donkere modus achtergrond */
    --text-color: #f6f6f6; /* OneUI donkere modus tekst */
    --oneui-primary-color: #007bff; /* Kan worden aangepast voor donkere modus */
    --oneui-secondary-bg: #2a2a2a;
    --oneui-border-color: #3a3a3a;
    --oneui-card-shadow: rgba(255, 255, 255, 0.05);
    --bg-image: none;
}

/* Bestaande thema's uit index.html, verplaatst voor consistentie */
body.theme-dark ::selection, 
body.theme-oled ::selection { background: rgba(130, 170, 255, 0.3); }
body.theme-synthwave ::selection { background: rgba(255, 0, 127, 0.4); }
body.theme-matrix ::selection { background: rgba(0, 255, 0, 0.3); color: #000; }

@keyframes bg-pulse {
    0%, 100% { background-color: var(--bg-color); }
    50% { background-color: var(--bg-color); }
}
:root {
    --oneui-bg-color-light: #f6f6f6;
    --oneui-text-color-light: #1a1a1a;
    --oneui-primary-color-light: #007bff;
    --oneui-secondary-bg-light: #ffffff;
    --oneui-border-color-light: #e0e0e0;
    --oneui-card-shadow-light: rgba(0, 0, 0, 0.08);
}

/* OneUI Dark Mode */
.theme-oneui.theme-dark {
    --oneui-bg-color-dark: #1e1e1e;
    --oneui-text-color-dark: #f6f6f6;
    --oneui-primary-color-dark: #007bff; /* Kan worden aangepast voor donkere modus */
    --oneui-secondary-bg-dark: #2a2a2a;
    --oneui-border-color-dark: #3a3a3a;
    --oneui-card-shadow-dark: rgba(255, 255, 255, 0.05);
}

/* Algemene OneUI styling */
.theme-oneui {
    font-family: 'SamsungOne', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, Cantarell, 'Noto Sans', Helvetica, Arial, sans-serif;
}

.theme-oneui.light-mode {
    background-color: var(--oneui-bg-color-light);
    color: var(--oneui-text-color-light);
}

.theme-oneui.dark-mode {
    background-color: var(--oneui-bg-color-dark);
    color: var(--oneui-text-color-dark);
}

/* Bestaande thema's uit index.html, verplaatst voor consistentie */
body.theme-dark ::selection, 
body.theme-oled ::selection { background: rgba(130, 170, 255, 0.3); }
body.theme-synthwave ::selection { background: rgba(255, 0, 127, 0.4); }
body.theme-matrix ::selection { background: rgba(0, 255, 0, 0.3); color: #000; }