:root {
	--main-bg-color: brown;
	--primary-btn-color: #007BFF;
	--primary-btn-color-semi-transparent: #007BFF50;
	--secondary-btn-color: #17A2B8;
	--success-btn-color: #28a745;
	--danger-btn-color: #dc3545;
	--warning-btn-color: #ffc107;

	--bg-dark-1: #010101;
	--bg-dark-2: #11151A;
	--bg-dark-3: #171D24;
	--bg-dark-3b: #161a20;
	--bg-dark-4: #1B2229;
	--bg-dark-5: #1E262E;
	--bg-dark-6: #232C36;


	--text-normal: #cdcdcd;
	--text-faded: #aaa;
	--text-active: white;
	--text-danger: #dc3545;
	--text-success: #28a745;

	--text-dark: #212529;

	--grey-line: #707070;

	/* --logo-dark-blue: #004080; */
	--logo-dark-blue: #003367;
	--logo-light-blue: #0099ff;
	/* --logo-light-blue: #007fff; */
}


.btn-primary,
.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {
	color: #fff;
	background-color: #007bff;
	/* if the browser doesn't support CSS var (looking at you, IE...) */
	border-color: #007bff;
	/* if the browser doesn't support CSS var (looking at you, IE...) */
	background-color: var(--primary-btn-color);
	border-color: var(--primary-btn-color);
}

.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem var(--primary-btn-color-semi-transparent);
}

a,
a.active,
a.focus,
a.visited {
	color: #007bff;
	/* if the browser doesn't support CSS var (looking at you, IE...) */
	color: var(--primary-btn-color);
}

.btn-primary:hover {
	filter: brightness(1.1) !important;

	background-color: #007bff;
	/* if the browser doesn't support CSS var (looking at you, IE...) */
	border-color: #007bff;
	/* if the browser doesn't support CSS var (looking at you, IE...) */
	background-color: var(--primary-btn-color);
	border-color: var(--primary-btn-color);
}

.btn-info:hover {
	background-color: #1ab8d1 !important;
}

.btn-secondary:hover {
	background-color: #79838b !important;
}

.btn-danger:hover {
	background-color: #df4958 !important;
}

.input-group-text {
	white-space: normal !important;
}



/* review links */
body.black,
.color-swatch.black,
.dot.black {
	background-image: linear-gradient(135deg, rgb(34, 34, 34), rgb(10, 10, 10));
	color: white;
}

body.black .modal {
	color: #212529;
	;
}

body.grey,
.color-swatch.grey,
.dot.grey {
	background-image: linear-gradient(135deg, rgba(225, 225, 225, 1), rgba(140, 140, 140, 1));
}

body.white,
.color-swatch.white,
.dot.white {
	background-image: linear-gradient(135deg, rgba(255, 255, 255, 1), rgba(225, 225, 225, 1));
}

body.green,
.color-swatch.green,
.dot.green {
	background-image: linear-gradient(135deg, rgb(89, 141, 105), rgb(36, 83, 42));
}

body.blue,
.color-swatch.blue,
.dot.blue {
	background-image: linear-gradient(135deg, rgb(71, 91, 146), rgb(31, 46, 87));
}

body.lightblue,
.color-swatch.lightblue,
.dot.lightblue {
	background-image: linear-gradient(135deg, rgb(131, 196, 233), rgb(63, 132, 189));
}

body.yellow,
.color-swatch.yellow,
.dot.yellow {
	background-image: linear-gradient(135deg, rgb(241, 229, 159), rgb(216, 209, 106));
}

body.orange,
.color-swatch.orange,
.dot.orange {
	background-image: linear-gradient(135deg, rgb(247, 185, 115), rgb(240, 139, 57));
}

body.red,
.color-swatch.red,
.dot.red {
	background-image: linear-gradient(135deg, rgb(255, 126, 126), rgb(199, 64, 64));
}

body.pink,
.color-swatch.pink,
.dot.pink {
	background-image: linear-gradient(135deg, rgb(252, 142, 188), rgb(238, 80, 172));
}

body.purple,
.color-swatch.purple,
.dot.purple {
	background-image: linear-gradient(135deg, rgb(202, 142, 252), rgb(162, 80, 238));
}

button:disabled {
	cursor: not-allowed;
}