/* ================================

	# Colors

	@related: _vars-colors, _colors-dark-light

================================ */

:root {

	/* ------------------------------------------

		### Official [Colors]

	------------------------------------------ */
	--gh-color-black:    #000000;
	--gh-color-white:    #ffffff;
	--gh-color-offwhite: #CCCCCC;
	--gh-color-gray:     #FAF7F7;

	--gh-color-blue:     #22358b;
	--gh-color-blue-rgb: rgb(34, 53, 139);
	--gh-color-orange:   #F95738;
	--gh-color-gray-2:   #3a3a3a;
	--gh-color-green:    #198754;


	--gh-color-pink: #ff214f;
	--gh-color-yellow: #FFCB36;
	/* --gh-color-gray2: #3a3a3a; */
	--gh-color-gray2: #505050;
	--gh-color-gray3: #555555;

	/* --gh-color-primary: #ff471f;
	--gh-color-secondary: #FE5912; */

	/* https://coolors.co/0d3b66-faf0ca-f4d35e-ee964b-f95738 */
	--gh-color-primary: #F95738;
	--gh-color-secondary: #EE964B;

	/* --gh-color-dark: #060815; */
	--gh-color-optional: #f9f9f9;
	/* --gh-color-bg1: #F7F7F7;
	--gh-color-bg2: #F6F1EC; */
	/* --gh-color-title1: #223588; */
	/* --gh-color-title2: #21348b; */
	--gh-color-footer: #000A2D;

	--bs-link-color: var(--gh-color-blue);
	--bs-link-color-rgb: var(--gh-color-blue-rgb);

	--bs-link-opacity: 1;

	--link-color: var(--gh-color-blue);
	--link-hover-color: var(--gh-color-orange);

	--gh-color-accent1: var(--gh-color-blue, darkblue);
	--gh-color-accent2: var(--gh-color-primary, orangered);


	/* ------------------------------------------

		### Unofficial [Colors]

	------------------------------------------ */


}

/* .dark-area .light-area,
:root {
	--color-bg-default: var(--gh-color-white);
	--color-fg-default: var(--gh-color-black);
	--cta-color-bg: var(--color-tbd);
	--cta-color-fg: var(--gh-color-black);
	--cta-color-bg-hover: var(--gh-color-black);
	--cta-color-fg-hover: var(--gh-color-white);
	--cta-color-wire: var(--gh-color-black);
	--cta-color-wire-hover: var(--gh-color-black);
	--field-bg-color: transparent;
	--field-fg-color: currentColor;
	--field-border-color: currentColor;
} */

/* .dark-area:root {
	--color-bg-default: var(--gh-color-black);
	--color-fg-default: var(--gh-color-white);
} */

.dark-area .light-area .dark-area,
.dark-area {

	--gh-color-accent1: var(--white);
	--gh-color-accent2: var(--gh-color-primary, orangered);

	--gh-color-title1: currentColor;
	--link-color: currentColor;
	/* --link-color: var(--gh-color-blue); */
	--link-hover-color: var(--gh-color-orange);

}

.btn-secondary {
	--bs-btn-hover-bg:           var(--gh-color-blue);
	--bs-btn-hover-border-color: var(--gh-color-blue);
}