.gray-flat { background-color: #C4C8D4 }
.gray-flat .secondary-bg { background-color: #E7E8E9 }
.gray-flat .accent-bg { background-color: #443B55 }
.gray-flat .primary-color { color: #000000 }
.gray-flat .secondary-color { color: #72747B }
.gray-flat .svg-fill { fill: #FFFFFF }

.gray-gradient { background: linear-gradient(#E7E8E9, #C4C8D4) }
.gray-gradient .secondary-bg { background-color: #E7E8E9 }
.gray-gradient .accent-bg { background-color: #443B55 }
.gray-gradient .primary-color { color: #000000 }
.gray-gradient .secondary-color { color: #72747B }
.gray-gradient .svg-fill { fill: #FFFFFF }

.gray-accent { background-color: #443B55 }
.gray-accent .secondary-bg { background-color: #b6bac7 }
.gray-accent .accent-bg { background-color: #C4C8D4 }
.gray-accent .primary-color { color: #FFFFFF }
.gray-accent .secondary-color { color: #E8E7EA }
.gray-accent .svg-fill { fill: #FFFFFF }

.gray-black { background-color: #E7E8E9 }
.gray-black .secondary-bg { background-color: #C4C8D4 }
.gray-black .accent-bg { background-color: #443B55 }
.gray-black .primary-color { color: #000000 }
.gray-black .secondary-color { color: #5b5d5d }
.gray-black .svg-fill { fill: #5b5d5d }

.gray-white { background-color: #ffffff }
.gray-white .secondary-bg { background-color: #F8F9FA }
.gray-white .accent-bg { background-color: #443B55 }
.gray-white .primary-color { color: #000000 }
.gray-white .secondary-color { color: #8F8F8F }
.gray-white .svg-fill { fill: #b6bac7 }