/**
 * Skygate Consultants – Global Colour Scheme
 * File path: /assets/css/color.schemes.css
 *
 * Primary Navy:   #03244E
 * Dark Navy:      #021D3F
 * Secondary Gold: #A46C1F
 * Accent Gold:    #B77F2F
 * Light Gold:     #D6A85C
 * Paragraph:      #666666
 */

/* ==========================================================
   1. GLOBAL THEME, BOOTSTRAP AND ELEMENTOR VARIABLES
========================================================== */
:root {
	/* Theme fonts */
	--font-default: "Manrope", sans-serif !important;
	--font-heading: "Manrope", sans-serif !important;
	--fontawesome: "Font Awesome 5 Pro" !important;

	/* Base colours */
	--black: #000000 !important;
	--white: #FFFFFF !important;
	--white-secondary: #E6E9ED !important;

	/* Skygate navy shades */
	--dark: #03244E !important;
	--dark-secondary: #021D3F !important;
	--dark-optional: #03244E !important;

	/* Skygate brand colours */
	--color-primary: #03244E !important;
	--color-secondary: #A46C1F !important;
	--color-style-two: #B77F2F !important;
	--color-style-three: #D6A85C !important;
	--color-style-four: #A46C1F !important;

	/* Content colours */
	--color-heading: #03244E !important;
	--color-paragraph: #666666 !important;

	/* Background colours */
	--bg-gray: #F4F5F7 !important;
	--bg-gray-secondary: #E6E9ED !important;

	/* Shadows */
	--box-shadow-primary: -1px 3px 10px 0 rgba(3, 36, 78, 0.35) !important;
	--box-shadow-secondary: 0 10px 30px 0 rgba(164, 108, 31, 0.30) !important;
	--box-shadow-regular: 0 2px 12px 0 rgba(3, 36, 78, 0.12) !important;

	/* Gradients */
	--bg-gradient: linear-gradient(
		135deg,
		#03244E 0%,
		#A46C1F 65%,
		#B77F2F 100%
	) !important;

	--gradient-bg: linear-gradient(
		135deg,
		#03244E 0%,
		#A46C1F 65%,
		#B77F2F 100%
	) !important;

	--bg-gradient-secondary: linear-gradient(
		90deg,
		#A46C1F 0%,
		#B77F2F 50%,
		#D6A85C 100%
	) !important;

	--bg-gradient-reverse: linear-gradient(
		90deg,
		#B77F2F 0%,
		#A46C1F 50%,
		#03244E 100%
	) !important;

	--bg-gradient-minimal: linear-gradient(
		180deg,
		#E6E9ED 40%,
		#FFFBF5 60%
	) !important;

	/* Bootstrap colours */
	--bs-blue: #03244E !important;
	--bs-orange: #B77F2F !important;
	--bs-yellow: #A46C1F !important;
	--bs-primary: #03244E !important;
	--bs-secondary: #A46C1F !important;
	--bs-warning: #B77F2F !important;
	--bs-dark: #03244E !important;

	--bs-primary-rgb: 3, 36, 78 !important;
	--bs-secondary-rgb: 164, 108, 31 !important;
	--bs-warning-rgb: 183, 127, 47 !important;
	--bs-dark-rgb: 3, 36, 78 !important;

	/* Elementor system colours */
	--e-global-color-primary: #03244E !important;
	--e-global-color-secondary: #A46C1F !important;
	--e-global-color-text: #666666 !important;
	--e-global-color-accent: #B77F2F !important;
}


/* ==========================================================
   2. GLOBAL TEXT AND LINKS
========================================================== */
body {
	background-color: #FFFFFF;
	color: var(--color-paragraph) !important;
}

body,
p,
li,
td,
th,
label,
input,
textarea,
select {
	color: var(--color-paragraph);
}

h1,
h2,
h3,
h4,
h5,
h6,
.heading,
.title {
	color: var(--color-heading);
}

a {
	color: var(--color-heading);
}

a:hover,
a:focus,
a:active {
	color: var(--color-primary);
}

.color-secondary a:hover,
.theme-color-two a:hover {
	color: var(--color-secondary);
}

.sub-heading,
.text-theme,
.text-primary,
.color-primary {
	color: var(--color-primary) !important;
}

.text-secondary,
.color-secondary {
	color: var(--color-secondary) !important;
}

.text-accent,
.color-style-two {
	color: var(--color-style-two) !important;
}


/* ==========================================================
   3. BACKGROUND HELPERS
========================================================== */
.bg-theme,
.bg-primary {
	background-color: var(--color-primary) !important;
}

.bg-theme-secondary,
.bg-secondary {
	background-color: var(--color-secondary) !important;
}

.bg-dark {
	background-color: var(--dark) !important;
}

.bg-dark-secondary {
	background-color: var(--dark-secondary) !important;
}

.bg-gray {
	background-color: var(--bg-gray) !important;
}

.bg-gray-secondary {
	background-color: var(--bg-gray-secondary) !important;
}

.bg-gradient,
.gradient-bg {
	background-color: var(--color-primary) !important;
	background-image: var(--bg-gradient) !important;
}

.bg-gradient-secondary {
	background-color: var(--color-secondary) !important;
	background-image: var(--bg-gradient-secondary) !important;
}

.bg-gradient-minimal {
	background-image: var(--bg-gradient-minimal) !important;
}


/* ==========================================================
   4. THEME BUTTONS
========================================================== */
.btn-style-one,
.btn-theme,
.btn-primary,
button[type="submit"],
input[type="submit"],
.wp-element-button {
	background-color: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
	color: var(--white) !important;
}

.btn-style-one:hover,
.btn-theme:hover,
.btn-primary:hover,
.btn-primary:focus,
button[type="submit"]:hover,
input[type="submit"]:hover,
.wp-element-button:hover {
	background-color: var(--color-secondary) !important;
	border-color: var(--color-secondary) !important;
	color: var(--white) !important;
}

.btn-secondary {
	background-color: var(--color-secondary) !important;
	border-color: var(--color-secondary) !important;
	color: var(--white) !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
	background-color: var(--color-style-two) !important;
	border-color: var(--color-style-two) !important;
	color: var(--white) !important;
}

.btn-outline-primary,
.btn-style-one.border-theme {
	background-color: transparent !important;
	border-color: var(--color-primary) !important;
	color: var(--color-primary) !important;
}

.btn-outline-primary:hover,
.btn-style-one.border-theme:hover {
	background-color: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
	color: var(--white) !important;
}

.btn-outline-secondary {
	background-color: transparent !important;
	border-color: var(--color-secondary) !important;
	color: var(--color-secondary) !important;
}

.btn-outline-secondary:hover {
	background-color: var(--color-secondary) !important;
	border-color: var(--color-secondary) !important;
	color: var(--white) !important;
}


/* ==========================================================
   5. ICONS, DECORATIONS AND ACTIVE ELEMENTS
========================================================== */
.site-heading .devider,
.site-heading .devider::before,
.video-play-button,
.progress-bar,
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link,
.page-item.active .page-link,
.list-group-item.active,
.dropdown-item.active,
.dropdown-item:active {
	background-color: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
}

.color-secondary .video-play-button,
.color-secondary .site-heading .devider,
.color-secondary .site-heading .devider::before {
	background-color: var(--color-secondary) !important;
}

i.text-theme,
.icon-theme,
.feature-icon,
.service-icon {
	color: var(--color-primary) !important;
}

i.text-secondary,
.icon-secondary {
	color: var(--color-secondary) !important;
}


/* ==========================================================
   6. FORMS AND FOCUS COLOURS
========================================================== */
input:focus,
textarea:focus,
select:focus,
.form-control:focus,
.form-select:focus,
.nice-select:active,
.nice-select.open,
.nice-select:focus {
	border-color: var(--color-primary) !important;
	box-shadow: 0 0 0 0.2rem rgba(3, 36, 78, 0.18) !important;
	outline: none !important;
}

.form-check-input:checked {
	background-color: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
}


/* ==========================================================
   7. BOOTSTRAP COLOUR UTILITIES
========================================================== */
.text-primary {
	color: #03244E !important;
}

.text-secondary {
	color: #A46C1F !important;
}

.text-warning {
	color: #B77F2F !important;
}

.text-dark {
	color: #03244E !important;
}

.bg-primary {
	background-color: #03244E !important;
}

.bg-secondary {
	background-color: #A46C1F !important;
}

.bg-warning {
	background-color: #B77F2F !important;
}

.border-primary {
	border-color: #03244E !important;
}

.border-secondary {
	border-color: #A46C1F !important;
}

.border-warning {
	border-color: #B77F2F !important;
}

.link-primary {
	color: #03244E !important;
}

.link-primary:hover,
.link-primary:focus {
	color: #A46C1F !important;
}

.link-secondary {
	color: #A46C1F !important;
}

.link-secondary:hover,
.link-secondary:focus {
	color: #B77F2F !important;
}


/* ==========================================================
   8. ELEMENTOR GLOBAL COLOUR FALLBACKS
========================================================== */
.elementor-kit-5,
.elementor-kit-6,
.elementor-kit-7,
.elementor-kit-8,
.elementor-kit-9,
.elementor-kit-10,
.elementor-kit-11,
.elementor-kit-12,
.elementor-kit-13,
.elementor-kit-14,
.elementor-kit-15,
.elementor-kit-16,
.elementor-kit-17,
.elementor-kit-18,
.elementor-kit-19,
.elementor-kit-20 {
	--e-global-color-primary: #03244E !important;
	--e-global-color-secondary: #A46C1F !important;
	--e-global-color-text: #666666 !important;
	--e-global-color-accent: #B77F2F !important;
}


/* ==========================================================
   9. SELECTION AND SCROLLBAR
========================================================== */
::selection {
	background-color: var(--color-primary);
	color: var(--white);
}

::-moz-selection {
	background-color: var(--color-primary);
	color: var(--white);
}

::-webkit-scrollbar-thumb {
	background-color: var(--color-primary);
}

::-webkit-scrollbar-thumb:hover {
	background-color: var(--color-secondary);
}