/* BoyShop theme tokens. app.js will set data-theme on . */ :root, :root[data-theme="midnight"] { color-scheme: dark; --bg: #04080F; --surface: #04080F; --surface-raised: #507DBC; --accent: #507DBC; --accent-soft: #A1C6EA; --text: #BBD1EA; --text-muted: #A1C6EA; --border: #507DBC; --focus: #A1C6EA; --on-accent: #04080F; --shadow-subtle: 0 5px 16px rgb(0 0 0 / .1); --shadow-hover: 0 8px 20px rgb(0 0 0 / .14); --status-success: #2F8B57; --status-warning: #A66A00; --status-danger: #B33434; --status-info: var(--accent); --scrollbar-track: transparent; --scrollbar-thumb: var(--border); --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A1C6EA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5 5 5-5'/%3E%3C/svg%3E"); } :root[data-theme="linen"] { color-scheme: light; --bg: #FEF1E1; --surface: #FEF1E1; --surface-raised: #EBD4C4; --accent: #483436; --accent-soft: #EBD4C4; --text: #483436; --text-muted: #483436; --border: #E0E0D8; --focus: #483436; --on-accent: #FEF1E1; --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2308090A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5 5 5-5'/%3E%3C/svg%3E"); } :root[data-theme="monochrome"] { color-scheme: light; --bg: #F4F7F5; --surface: #F4F7F5; --surface-raised: #0100001a; --accent: #08090A; --accent-soft: #A7A2A9; --text: #08090A; --text-muted: #575A5E; --border: #CECECE; --focus: #575A5E; --on-accent: #F4F7F5; --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2308090A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5 5 5-5'/%3E%3C/svg%3E"); } :root[data-theme="pumpkin"] { color-scheme: light; --bg: #FFFFFC; --surface: #FFFFFC; --surface-raised: #BEB7A4; --accent: #FF7F11; --accent-soft: #BEB7A4; --text: #000000; --text-muted: #000000; --border: #BEB7A4; --focus: #FF7F11; --on-accent: #000000; --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2308090A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5 5 5-5'/%3E%3C/svg%3E"); }