[data-theme="warm"] {
    --color-primary: #c4704b;
    --color-primary-hover: #a85d3e;
    --color-primary-light: #fdf6f0;
    --color-primary-light-border: #f5ddd0;

    --bg-primary: #faf7f4;
    --bg-secondary: #ffffff;

    --border-color: #e8e0d8;
    --border-light: #f0ebe5;

    --shadow-focus: 0 0 0 3px rgba(196, 112, 75, 0.1);

    --color-info-light: var(--color-primary-light);
    --color-info-light-text: var(--color-primary);
    --color-info-light-border: var(--color-primary-light-border);
}

[data-theme="playful"] {
    --color-primary: #7c3aed;
    --color-primary-hover: #6d28d9;
    --color-primary-light: #f5f3ff;
    --color-primary-light-border: #ddd6fe;

    --bg-primary: #f8f7fc;
    --bg-secondary: #ffffff;

    --border-color: #e2dff0;
    --border-light: #f0eef5;

    --shadow-focus: 0 0 0 3px rgba(124, 58, 237, 0.1);

    --color-info-light: var(--color-primary-light);
    --color-info-light-text: var(--color-primary);
    --color-info-light-border: var(--color-primary-light-border);
}