:root {
    /* Day Mode (Default) */
    --tone-1: #b057cf;
    /* Light Purple (Secondary) */
    --tone-2: #6d0cb4;
    /* Deep Purple (Primary) */
    --primary-color: #6d0cb4;
    --primary-dark: #4a007a;
    --secondary-color: #b057cf;
    --accent-color: #6d0cb4;

    --bg-color: #f4f6fb;
    --card-bg: #ffffff;
    --text-color: #222222;
    --text-muted: #666666;
    --border-color: #e0e0e0;

    --button-bg: #6d0cb4;
    --button-text: #ffffff;
    --button-hover-bg: #4a007a;

    --card-header-bg: #6d0cb4;
    --card-header-text: #ffffff;

    --gradient-start: #b057cf;
    --gradient-end: #6d0cb4;

    --input-bg: #f4f6fb;
    --input-border: #e0e0e0;
    --input-focus: #b057cf;

    --white: #ffffff;
    --shadow: rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] {
    /* Night Mode */
    --tone-1: #b057cf;
    --tone-2: #8b53fe;
    /* Slightly lighter for dark mode contrast */
    --primary-color: #b057cf;
    /* Use lighter purple for primary text/icons in dark mode */
    --primary-dark: #6d0cb4;
    --secondary-color: #8b53fe;
    --accent-color: #b057cf;

    --bg-color: #121212;
    --card-bg: #1e1e1e;
    --text-color: #e0e0e0;
    --text-muted: #a0a0a0;
    --border-color: #333333;

    --button-bg: #6d0cb4;
    --button-text: #ffffff;
    --button-hover-bg: #b057cf;

    --card-header-bg: #4a007a;
    --card-header-text: #ffffff;

    --gradient-start: #6d0cb4;
    --gradient-end: #35005b;

    --input-bg: #2d2d2d;
    --input-border: #444444;
    --input-focus: #b057cf;

    --white: #ffffff;
    --shadow: rgba(0, 0, 0, 0.5);
}