:root {
    --bg-color: #eef2f3;
    --container-bg: #ffffff;
    --text-color: #333333;
    --button-bg: #4CAF50;
    --button-hover-bg: #45a049;
    --button-text: #ffffff;
}

[data-theme="dark"] {
    --bg-color: #121212;
    --container-bg: #1e1e1e;
    --text-color: #f1f1f1;
    --button-bg: #4CAF50;
    --button-hover-bg: #66bb6a;
    --button-text: #ffffff;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-color: var(--bg-color);
    margin: 0;
    transition: background-color 0.3s ease;
}