/**
 * Custom Header Styles
 * Modern header design matching the orange and blue theme
 */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;1,100;1,300;1,400;1,500;1,700&display=swap');

/* Top Bar */
.top-bar {
	background-color: #F8F9FA;
	border-bottom: 1px solid #E9ECEF;
	padding: 0.75rem 0;
	font-size: 0.9rem;
	transition: all 0.3s ease;
}

#wrapper-navbar.scrolled .top-bar {
	padding: 0.5rem 0;
}

.top-bar .social-links {
	display: flex;
	gap: 1rem;
	align-items: center;
	justify-content: center;
}

@media (min-width: 768px) {
	.top-bar .social-links {
		justify-content: flex-start;
	}
}

.top-bar .social-links a {
	color: #2C3E50;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: transparent;
}

.top-bar .social-links a:hover {
	color: #FFFFFF;
	background-color: #FF8C00;
	transform: translateY(-2px);
}

.top-bar .social-links a:nth-child(2):hover {
	background-color: #000000;
}

.top-bar .social-links a:nth-child(3):hover {
	background-color: #FF0000;
}

.top-bar .contact-info {
	display: flex;
	gap: 1.5rem;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}

@media (min-width: 768px) {
	.top-bar .contact-info {
		justify-content: flex-end;
	}
}

.top-bar .contact-info a {
	color: #2C3E50;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 500;
	transition: color 0.3s ease;
}

.top-bar .contact-info a:hover {
	color: #FF8C00;
}

.top-bar .contact-info svg {
	flex-shrink: 0;
}

.top-bar .phone-link {
	color: #2C3E50;
}

.top-bar .email-link {
	color: #FF8C00;
}

@media (max-width: 767.98px) {
	.top-bar {
		padding: 0.5rem 0;
		font-size: 0.85rem;
	}
	
	#wrapper-navbar.scrolled .top-bar {
		padding: 0.4rem 0;
	}
	
	.top-bar .contact-info {
		flex-direction: column;
		gap: 0.5rem;
	}
	
	.top-bar .social-links {
		margin-bottom: 0.5rem;
	}
}

/* Sticky Header Wrapper */
#wrapper-navbar {
	position: sticky;
	top: 0;
	z-index: 1000;
	transition: all 0.3s ease;
}

/* Main Navigation */
#main-nav {
	background: linear-gradient(135deg, #FFFFFF 0%, #F8F9FA 100%) !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	padding: 0.75rem 0;
	border-bottom: 3px solid #FF8C00;
	transition: all 0.3s ease;
}

#wrapper-navbar.scrolled #main-nav {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
	padding: 0.5rem 0;
}

/* Logo/Brand Styling */
.navbar-brand {
	padding: 0.5rem 0;
	transition: all 0.3s ease;
	width: 240px;
}

.navbar-brand:hover {
	transform: scale(1.05);
}

.custom-logo {
	max-height: 60px;
	width: auto;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
	transition: all 0.3s ease;
}

#wrapper-navbar.scrolled .custom-logo {
	max-height: 50px;
}

.navbar-brand:hover .custom-logo {
	filter: drop-shadow(0 4px 8px rgba(255, 140, 0, 0.3));
}

/* Homepage: Hide logo until scrolled */
.home .navbar-brand {
	opacity: 0;
	pointer-events: none;
}

.home #wrapper-navbar.scrolled .navbar-brand {
	opacity: 1;
	pointer-events: auto;
}

/* Navigation Links */
.navbar-nav .nav-link {
	color: #2C3E50 !important;
	font-weight: 500;
	padding: 0.75rem 1.25rem !important;
	margin: 0 0.25rem;
	border-radius: 8px;
	transition: all 0.3s ease;
	position: relative;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
	color: #FF8C00 !important;
	background-color: rgba(255, 140, 0, 0.05);
}

.navbar-nav .nav-link.active,
.navbar-nav .nav-link:active {
	color: #4A90E2 !important;
	background-color: rgba(74, 144, 226, 0.1);
}

/* Dropdown Arrow/Caret for Menu Items with Children */
.navbar-nav .menu-item-has-children > .nav-link::after,
.navbar-nav .dropdown > .nav-link::after {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 0.5rem;
	vertical-align: middle;
	border-top: 0.35em solid;
	border-right: 0.35em solid transparent;
	border-left: 0.35em solid transparent;
	transition: transform 0.3s ease;
}

.navbar-nav .menu-item-has-children > .nav-link:hover::after,
.navbar-nav .dropdown > .nav-link:hover::after {
	border-top-color: #FF8C00;
}

.navbar-nav .menu-item-has-children.show > .nav-link::after,
.navbar-nav .dropdown.show > .nav-link::after {
	transform: rotate(180deg);
}

/* Dropdown Menu Styling */
.navbar-nav .dropdown-menu {
	border: none;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	padding: 0.75rem 0;
	margin-top: 0.5rem;
	background-color: #FFFFFF;
}

.navbar-nav .dropdown-item {
	color: #2C3E50;
	padding: 0.625rem 1.5rem;
	font-weight: 500;
	transition: all 0.2s ease;
}

.navbar-nav .dropdown-item:hover,
.navbar-nav .dropdown-item:focus {
	background: linear-gradient(135deg, rgba(255, 140, 0, 0.1) 0%, rgba(74, 144, 226, 0.1) 100%);
	color: #FF8C00;
}

/* Mobile Menu Toggle */
.navbar-toggler {
	border: 2px solid #FF8C00;
	border-radius: 8px;
	padding: 0.5rem 0.75rem;
	transition: all 0.3s ease;
}

.navbar-toggler:hover,
.navbar-toggler:focus {
	background-color: rgba(255, 140, 0, 0.1);
	border-color: #4A90E2;
}

.navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23FF8C00' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}


/* Active page indicator - only for non-dropdown items */
.navbar-nav .nav-item.current-menu-item:not(.menu-item-has-children) .nav-link::after,
.navbar-nav .nav-item.current_page_item:not(.menu-item-has-children) .nav-link::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 60%;
	height: 3px;
	background: linear-gradient(135deg, #FF8C00 0%, #4A90E2 100%);
	border-radius: 2px;
}


/* Responsive Adjustments */
@media (max-width: 991.98px) {
	#main-nav {
		padding: 0.5rem 0;
	}
	
	#wrapper-navbar.scrolled #main-nav {
		padding: 0.4rem 0;
	}
	
	.custom-logo {
		max-height: 50px;
	}
	
	#wrapper-navbar.scrolled .custom-logo {
		max-height: 40px;
	}
	
	/* On mobile, always show logo (not just on scroll) */
	.home .navbar-brand {
		opacity: 1;
		pointer-events: auto;
	}
	
	.navbar-collapse {
		margin-top: 1rem;
		background-color: #FFFFFF;
		border-radius: 12px;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
		padding: 1rem;
	}
	
	.navbar-nav .nav-link {
		padding: 0.75rem 1rem !important;
		margin: 0.25rem 0;
	}
	
	/* Mobile: Parent menu items should be clickable */
	.navbar-nav .menu-item-has-children > .nav-link,
	.navbar-nav .dropdown > .nav-link {
		display: block;
		cursor: pointer;
	}
	
	.navbar-nav .dropdown-menu {
		box-shadow: none;
		background-color: rgba(248, 249, 250, 0.5);
		margin-left: 1rem;
		display: block !important;
		opacity: 1 !important;
		visibility: visible !important;
		position: static !important;
		transform: none !important;
	}
	
	/* Keep dropdowns always visible on mobile */
	.navbar-nav .menu-item-has-children .dropdown-menu,
	.navbar-nav .dropdown .dropdown-menu {
		display: block !important;
	}
	
	/* Improve dropdown item styling on mobile */
	.navbar-nav .dropdown-menu .dropdown-item {
		padding-left: 2rem;
		font-size: 0.9rem;
		border-left: 2px solid #FF8C00;
	}
	
	/* Hide the dropdown arrow on mobile since dropdown is always open */
	.navbar-nav .menu-item-has-children > .nav-link::after,
	.navbar-nav .dropdown > .nav-link::after {
		display: none;
	}
	
	.navbar-nav .nav-item.current-menu-item .nav-link::after,
	.navbar-nav .nav-item.current_page_item .nav-link::after {
		display: none;
	}
	

}

@media (max-width: 575.98px) {
	.custom-logo {
		max-height: 40px;
	}
	
	.navbar-brand {
		font-size: 1.25rem;
	}
}

/* Smooth Scroll Behavior */
html {
	scroll-behavior: smooth;
}

/* Header Spacing from Content */
#wrapper-navbar {
	margin-bottom: 0;
}