Defined inside :root.light { ... } in /src/global-styles/variables.css.
Colors — Light mode (Warm Hedgehog Palette)
| Variable | Value | Preview | Description | Usage |
|---|
--color-bg | #F8EACD | | Soft cream (hedgehog belly) | Page background |
--color-primary | #6A3817 | | Warm brown (hedgehog fur) | Buttons, links, accents |
--color-primary-dark | #532E1A | | Darker brown | Hover states |
--color-secondary | #D7A47D | | Golden/tan accent | Secondary accents |
--color-accent | #FABFC0 | | Soft pink (hedgehog belly) | Tertiary accents |
--color-text | #2c1a1a | | Dark brown | Primary text |
--color-text-light | #69432E | | Medium brown | Secondary text |
--color-border | #EECEA4 | | Warm beige | Borders, dividers |
--color-error | #e94b4b | | Red for errors | Error messages, validation |
--color-success | #4bb543 | | Green for success | Success messages |
Glass effect — Light mode
| Variable | Value | Preview | Description |
|---|
--glass-bg | rgba(248, 234, 205, 0.25) | | Cream-tinted glass background |
--glass-border | rgba(106, 56, 23, 0.15) | | Brown-tinted glass border |
--glass-shadow | rgba(83, 46, 26, 0.1) | | Warm brown shadow |
--glass-table-border | rgba(215, 164, 125, 0.3) | | Table borders in glass cards |
--glass-table-row-odd | rgba(248, 234, 205, 0.5) | | Odd table row background |
--glass-table-row-hover | rgba(250, 191, 192, 0.3) | | Table row hover (pink tint) |
--glass-table-stacked | rgba(238, 206, 164, 0.7) | | Stacked table elements |