/* Aligned with asakiri-creator/frontend/src/index.css design tokens */
:root {
    /* Core brand colors (light) */
    --color-primary: #38B000;
    --color-secondary: #F7C40F;
    --color-primary-alt: #329404;

    /* Surfaces and content (light) */
    --color-background: #FFFFFF; /* page background */
    --color-surface: #FCFBFC; /* cards, inputs, panels */
    --color-on-surface: #272727; /* primary text */
    --color-on-surface-variant: #BEBEBE; /* secondary text */
    --color-surface-container: #FFFFFF;
    --color-on-secondary: #151515; /* text on secondary */
    --color-on-primary: #FFFFFF; /* text on primary */
    --color-secondary-container: #FCFBFC;
    --color-on-secondary-container: #272727;
    --color-primary-container: #FCFBFC;
    --color-on-primary-container: #272727;

    /* Borders and states (light) */
    --color-outline: #EEEEEE;
    --color-outline-variant: #EEEEEE;
    --color-error: #dc2626;
    --color-error-container: #dc2626;
    --color-on-error-container: #ffffff;

    /* Misc tokens (light) */
    --color-text: var(--color-on-surface);
    --color-tint: var(--color-primary);
    --color-icon: #D4D4D4;
    --color-tab-icon-default: #D4D4D4;
    --color-tab-icon-selected: var(--color-primary);
    --color-logo-text-alt: #FFFFFF;
}

[data-theme="dark"] {
    /* Core brand colors (dark) */
    --color-primary: #38B000;
    --color-secondary: #F7C40F;
    --color-primary-alt: #329404;

    /* Surfaces and content (dark) */
    --color-background: #151515; /* page background */
    --color-surface: #0A0A0A; /* cards, inputs, panels */
    --color-on-surface: #E5E7E7; /* primary text */
    --color-on-surface-variant: #C4C4C4; /* secondary text */
    --color-surface-container: #151515;
    --color-on-secondary: #151515; /* text on secondary */
    --color-on-primary: #FFFFFF; /* text on primary */
    --color-secondary-container: #0A0A0A;
    --color-on-secondary-container: #E5E7E7;
    --color-primary-container: #151515;
    --color-on-primary-container: #38B000;

    /* Borders and states (dark) */
    --color-outline: #292929;
    --color-outline-variant: #292929;
    --color-error: #dc2626;
    --color-error-container: #dc2626;
    --color-on-error-container: #151515;

    /* Misc tokens (dark) */
    --color-text: var(--color-on-surface);
    --color-tint: var(--color-primary);
    --color-icon: #B7B7B7;
    --color-tab-icon-default: #B7B7B7;
    --color-tab-icon-selected: var(--color-primary);
    --color-logo-text-alt: #151515;
}