@import url('./u-and-i.css');

:root {
	--light-secondary-text-color: #282c3f;
	--bg-color-primary: #fcfcfc;
	--bg-color-primary-3: #3f3947;
}

.tertiary-text-color {
	color: var(--light-secondary-text-color);
}

.overlay-text .text-container {
	background-color: var(--secondary-color);
}
.card-horizontal {
	color: var(--light-secondary-text-color);
}

.nav-bar {
	background-color: var(--bg-color-primary);
	color: var(--light-secondary-text-color);
}

.burger .line1,
.burger .line2,
.burger .line3 {
	background-color: var(--secondary-text-color);
}
.nav-icon-link .nav-icon {
	color: var(--secondary-text-color);
}
.nav-bar .nav-icon:hover i {
	color: var(--primary-color);
}

.avatar-in-nav-links {
	background-color: var(--bg-color-primary-3);
}

.active .nav-bar-links {
	background-color: var(--bg-color-primary);
}
.list-container {
	background-color: var(--bg-color-primary);
}

.modal-content {
	background-color: var(--bg-color-primary-2);
}
.form-field-plain-text:read-only {
	color: var(--light-secondary-text-color);
}
.form-field-error,
.form-label-required-field:after {
	color: var(--primary-color);
}
.rating-star-icon {
	color: var(--dark-secondary-color);
}
label.slider-track[for='range']:after {
	background-color: var(--dark-secondary-color);
}