:root { --primary: hsl(187.98, 77.58%, 43.73%); --primary-5: hsla(188, 78%, 44%, 0.05); --primary-10: hsla(188, 78%, 44%, 0.1); --primary-20: hsla(188, 78%, 44%, 0.2); --primary-30: hsla(188, 78%, 44%, 0.3); --primary-40: hsla(188, 78%, 44%, 0.4); --primary-50: hsla(188, 78%, 44%, 0.5); --primary-60: hsla(188, 78%, 44%, 0.6); --primary-70: hsla(188, 78%, 44%, 0.7); --primary-80: hsla(188, 78%, 44%, 0.8); --primary-90: hsla(188, 78%, 44%, 0.9); --primary-d-1: hsl(189, 65%, 37%); --primary-d-2: hsl(189, 56%, 29%); --primary-d-3: hsl(190, 46%, 20%); --primary-d-4: hsl(192, 32%, 12%); --primary-l-1: hsl(190, 55%, 60%); --primary-l-2: hsl(190, 53%, 71%); --primary-l-3: hsl(191, 52%, 81%); --primary-l-4: hsl(191, 52%, 91%); --secondary: hsla(173.41, 68.91%, 53.33%, 1); --secondary-5: hsla(173, 69%, 53%, 0.05); --secondary-10: hsla(173, 69%, 53%, 0.1); --secondary-20: hsla(173, 69%, 53%, 0.2); --secondary-30: hsla(173, 69%, 53%, 0.3); --secondary-40: hsla(173, 69%, 53%, 0.4); --secondary-50: hsla(173, 69%, 53%, 0.5); --secondary-60: hsla(173, 69%, 53%, 0.6); --secondary-70: hsla(173, 69%, 53%, 0.7); --secondary-80: hsla(173, 69%, 53%, 0.8); --secondary-90: hsla(173, 69%, 53%, 0.9); --secondary-d-1: hsla(173, 55%, 43%, 1); --secondary-d-2: hsla(173, 48%, 33%, 1); --secondary-d-3: hsla(172, 41%, 23%, 1); --secondary-d-4: hsla(171, 30%, 13%, 1); --secondary-l-1: hsla(172, 66%, 67%, 1); --secondary-l-2: hsla(171, 65%, 76%, 1); --secondary-l-3: hsla(170, 65%, 85%, 1); --secondary-l-4: hsla(169, 65%, 92%, 1); --accent: hsla(89.34, 72.49%, 62.94%, 1); --accent-5: hsla(89, 72%, 63%, 0.05); --accent-10: hsla(89, 72%, 63%, 0.1); --accent-20: hsla(89, 72%, 63%, 0.2); --accent-30: hsla(89, 72%, 63%, 0.3); --accent-40: hsla(89, 72%, 63%, 0.4); --accent-50: hsla(89, 72%, 63%, 0.5); --accent-60: hsla(89, 72%, 63%, 0.6); --accent-70: hsla(89, 72%, 63%, 0.7); --accent-80: hsla(89, 72%, 63%, 0.8); --accent-90: hsla(89, 72%, 63%, 0.9); --accent-d-1: hsla(89, 41%, 50%, 1); --accent-d-2: hsla(89, 39%, 37%, 1); --accent-d-3: hsla(89, 36%, 25%, 1); --accent-d-4: hsla(89, 30%, 14%, 1); --accent-l-1: hsla(89, 73%, 71%, 1); --accent-l-2: hsla(88, 73%, 78%, 1); --accent-l-3: hsla(87, 73%, 86%, 1); --accent-l-4: hsla(87, 74%, 93%, 1); --tertiary: hsla(188, 7%, 59%, 1); --bg-body: hsla(0, 0%, 94%, 1); --bg-body-d-1: hsla(0, 0%, 82%, 1); --bg-body-d-2: hsla(0, 0%, 71%, 1); --bg-body-d-3: hsla(0, 0%, 60%, 1); --bg-body-d-4: hsla(0, 0%, 49%, 1); --bg-body-d-5: hsla(0, 0%, 39%, 1); --bg-body-d-6: hsla(0, 0%, 29%, 1); --bg-body-d-7: hsla(0, 0%, 20%, 1); --bg-body-d-8: hsla(0, 0%, 11%, 1); --bg-surface: hsla(0, 0%, 100%, 1); --text-body: hsla(200, 4%, 31%, 1); --text-title: hsla(200, 4%, 31%, 1); --border-primary: rgba(76, 80, 82, 0.25); --shadow-primary: rgba(0, 0, 0, 0.15); --light: hsla(0, 0%, 100%, 1); --light-5: hsla(0, 0%, 100%, 0.05); --light-10: hsla(0, 0%, 100%, 0.1); --light-20: hsla(0, 0%, 100%, 0.2); --light-30: hsla(0, 0%, 100%, 0.3); --light-40: hsla(0, 0%, 100%, 0.4); --light-50: hsla(0, 0%, 100%, 0.5); --light-60: hsla(0, 0%, 100%, 0.6); --light-70: hsla(0, 0%, 100%, 0.7); --light-80: hsla(0, 0%, 100%, 0.8); --light-90: hsla(0, 0%, 100%, 0.9); --dark: hsla(195, 8%, 20%, 1); --dark-5: hsla(195, 8%, 20%, 0.05); --dark-10: hsla(195, 8%, 20%, 0.1); --dark-20: hsla(195, 8%, 20%, 0.2); --dark-30: hsla(195, 8%, 20%, 0.3); --dark-40: hsla(195, 8%, 20%, 0.4); --dark-50: hsla(195, 8%, 20%, 0.5); --dark-60: hsla(195, 8%, 20%, 0.6); --dark-70: hsla(195, 8%, 20%, 0.7); --dark-80: hsla(195, 8%, 20%, 0.8); --dark-90: hsla(195, 8%, 20%, 0.9); --white: hsla(0, 0%, 100%, 1); --dark-grey: #4C5052; --mid-grey: hsla(188, 7%, 59%, 1); --success: hsla(136, 95%, 56%, 1); --success-5: hsla(136, 95%, 56%, 0.05); --success-10: hsla(136, 95%, 56%, 0.1); --success-20: hsla(136, 95%, 56%, 0.2); --success-30: hsla(136, 95%, 56%, 0.3); --success-40: hsla(136, 95%, 56%, 0.4); --success-50: hsla(136, 95%, 56%, 0.5); --success-60: hsla(136, 95%, 56%, 0.6); --success-70: hsla(136, 95%, 56%, 0.7); --success-80: hsla(136, 95%, 56%, 0.8); --success-90: hsla(136, 95%, 56%, 0.9); --error: hsla(351, 95%, 56%, 1); --error-5: hsla(351, 95%, 56%, 0.05); --error-10: hsla(351, 95%, 56%, 0.1); --error-20: hsla(351, 95%, 56%, 0.2); --error-30: hsla(351, 95%, 56%, 0.3); --error-40: hsla(351, 95%, 56%, 0.4); --error-50: hsla(351, 95%, 56%, 0.5); --error-60: hsla(351, 95%, 56%, 0.6); --error-70: hsla(351, 95%, 56%, 0.7); --error-80: hsla(351, 95%, 56%, 0.8); --error-90: hsla(351, 95%, 56%, 0.9); --warning: hsla(31, 100%, 46%, 1); } :root[data-brx-theme="dark"] { --primary: hsl(187.98, 77.58%, 43.73%); --primary-5: hsla(188, 78%, 44%, 0.05); --primary-10: hsla(188, 78%, 44%, 0.1); --primary-20: hsla(188, 78%, 44%, 0.2); --primary-30: hsla(188, 78%, 44%, 0.3); --primary-40: hsla(188, 78%, 44%, 0.4); --primary-50: hsla(188, 78%, 44%, 0.5); --primary-60: hsla(188, 78%, 44%, 0.6); --primary-70: hsla(188, 78%, 44%, 0.7); --primary-80: hsla(188, 78%, 44%, 0.8); --primary-90: hsla(188, 78%, 44%, 0.9); --primary-d-1: hsl(189, 65%, 37%); --primary-d-2: hsl(189, 56%, 29%); --primary-d-3: hsl(190, 46%, 20%); --primary-d-4: hsl(192, 32%, 12%); --primary-l-1: hsl(190, 55%, 60%); --primary-l-2: hsl(190, 53%, 71%); --primary-l-3: hsl(191, 52%, 81%); --primary-l-4: hsl(191, 52%, 91%); --secondary: hsla(173.41, 68.91%, 53.33%, 1); --secondary-5: hsla(173, 69%, 53%, 0.05); --secondary-10: hsla(173, 69%, 53%, 0.1); --secondary-20: hsla(173, 69%, 53%, 0.2); --secondary-30: hsla(173, 69%, 53%, 0.3); --secondary-40: hsla(173, 69%, 53%, 0.4); --secondary-50: hsla(173, 69%, 53%, 0.5); --secondary-60: hsla(173, 69%, 53%, 0.6); --secondary-70: hsla(173, 69%, 53%, 0.7); --secondary-80: hsla(173, 69%, 53%, 0.8); --secondary-90: hsla(173, 69%, 53%, 0.9); --secondary-d-1: hsla(173, 55%, 43%, 1); --secondary-d-2: hsla(173, 48%, 33%, 1); --secondary-d-3: hsla(172, 41%, 23%, 1); --secondary-d-4: hsla(171, 30%, 13%, 1); --secondary-l-1: hsla(172, 66%, 67%, 1); --secondary-l-2: hsla(171, 65%, 76%, 1); --secondary-l-3: hsla(170, 65%, 85%, 1); --secondary-l-4: hsla(169, 65%, 92%, 1); --accent: hsla(89.34, 72.49%, 62.94%, 1); --accent-5: hsla(89, 72%, 63%, 0.05); --accent-10: hsla(89, 72%, 63%, 0.1); --accent-20: hsla(89, 72%, 63%, 0.2); --accent-30: hsla(89, 72%, 63%, 0.3); --accent-40: hsla(89, 72%, 63%, 0.4); --accent-50: hsla(89, 72%, 63%, 0.5); --accent-60: hsla(89, 72%, 63%, 0.6); --accent-70: hsla(89, 72%, 63%, 0.7); --accent-80: hsla(89, 72%, 63%, 0.8); --accent-90: hsla(89, 72%, 63%, 0.9); --accent-d-1: hsla(89, 41%, 50%, 1); --accent-d-2: hsla(89, 39%, 37%, 1); --accent-d-3: hsla(89, 36%, 25%, 1); --accent-d-4: hsla(89, 30%, 14%, 1); --accent-l-1: hsla(89, 73%, 71%, 1); --accent-l-2: hsla(88, 73%, 78%, 1); --accent-l-3: hsla(87, 73%, 86%, 1); --accent-l-4: hsla(87, 74%, 93%, 1); --tertiary: hsla(188, 7%, 59%, 1); --bg-body: hsla(0, 0%, 94%, 1); --bg-body-d-1: hsla(0, 0%, 82%, 1); --bg-body-d-2: hsla(0, 0%, 71%, 1); --bg-body-d-3: hsla(0, 0%, 60%, 1); --bg-body-d-4: hsla(0, 0%, 49%, 1); --bg-body-d-5: hsla(0, 0%, 39%, 1); --bg-body-d-6: hsla(0, 0%, 29%, 1); --bg-body-d-7: hsla(0, 0%, 20%, 1); --bg-body-d-8: hsla(0, 0%, 11%, 1); --bg-surface: hsla(0, 0%, 100%, 1); --text-body: hsla(200, 4%, 31%, 1); --text-title: hsla(200, 4%, 31%, 1); --border-primary: rgba(76, 80, 82, 0.25); --shadow-primary: rgba(0, 0, 0, 0.15); --light: hsla(0, 0%, 100%, 1); --light-5: hsla(0, 0%, 100%, 0.05); --light-10: hsla(0, 0%, 100%, 0.1); --light-20: hsla(0, 0%, 100%, 0.2); --light-30: hsla(0, 0%, 100%, 0.3); --light-40: hsla(0, 0%, 100%, 0.4); --light-50: hsla(0, 0%, 100%, 0.5); --light-60: hsla(0, 0%, 100%, 0.6); --light-70: hsla(0, 0%, 100%, 0.7); --light-80: hsla(0, 0%, 100%, 0.8); --light-90: hsla(0, 0%, 100%, 0.9); --dark: hsla(195, 8%, 20%, 1); --dark-5: hsla(195, 8%, 20%, 0.05); --dark-10: hsla(195, 8%, 20%, 0.1); --dark-20: hsla(195, 8%, 20%, 0.2); --dark-30: hsla(195, 8%, 20%, 0.3); --dark-40: hsla(195, 8%, 20%, 0.4); --dark-50: hsla(195, 8%, 20%, 0.5); --dark-60: hsla(195, 8%, 20%, 0.6); --dark-70: hsla(195, 8%, 20%, 0.7); --dark-80: hsla(195, 8%, 20%, 0.8); --dark-90: hsla(195, 8%, 20%, 0.9); --white: hsla(0, 0%, 100%, 1); --dark-grey: #4C5052; --mid-grey: hsla(188, 7%, 59%, 1); --success: hsla(136, 95%, 56%, 1); --success-5: hsla(136, 95%, 56%, 0.05); --success-10: hsla(136, 95%, 56%, 0.1); --success-20: hsla(136, 95%, 56%, 0.2); --success-30: hsla(136, 95%, 56%, 0.3); --success-40: hsla(136, 95%, 56%, 0.4); --success-50: hsla(136, 95%, 56%, 0.5); --success-60: hsla(136, 95%, 56%, 0.6); --success-70: hsla(136, 95%, 56%, 0.7); --success-80: hsla(136, 95%, 56%, 0.8); --success-90: hsla(136, 95%, 56%, 0.9); --error: hsla(351, 95%, 56%, 1); --error-5: hsla(351, 95%, 56%, 0.05); --error-10: hsla(351, 95%, 56%, 0.1); --error-20: hsla(351, 95%, 56%, 0.2); --error-30: hsla(351, 95%, 56%, 0.3); --error-40: hsla(351, 95%, 56%, 0.4); --error-50: hsla(351, 95%, 56%, 0.5); --error-60: hsla(351, 95%, 56%, 0.6); --error-70: hsla(351, 95%, 56%, 0.7); --error-80: hsla(351, 95%, 56%, 0.8); --error-90: hsla(351, 95%, 56%, 0.9); --warning: hsla(31, 100%, 46%, 1); }