/**
 * SCOPE: Apexus Common
 * Only include styles intended for all areas of the application.
 */

/* ===== GENERAL COVEO STYLING ===== */
/* Search Box */
atomic-search-box::part(wrapper) {
    border-radius: unset;
}
atomic-search-box::part(wrapper):focus-within {
    box-shadow: none;
	border-color: var(--atomic-neutral);
}
atomic-search-box::part(submit-button) {
    background-color: var(--apexus-color-white);
    border-left: none;
}
atomic-search-box::part(submit-icon) {
    color: var(--apexus-color-blue);
}
atomic-search-box::part(suggestions-wrapper) {
    border-top-left-radius: unset;
    border-top-right-radius: unset;
    width: calc(100% + 2px);
    margin-left: -1px;
}
atomic-search-box::part(suggestion) {
	border-bottom-left-radius: var(--atomic-border-radius-md);
	border-bottom-right-radius: var(--atomic-border-radius-md);
}

/**
 * ========== HEADER STYLING ==========
 **/
/* Coveo Global Search Section */
header {
  overflow-y: unset;
  max-height: unset;
}
header .search-container {
    width: 100%;
    max-width: 100rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-left: 8px;
    padding-right: 45px;
    align-items: start;
    height: 6rem;
}
header .search-container > div:has(atomic-search-box) {
    width: 100%;
}
header .search-container > div {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
header .search-container apexus-login-radio::part(radio),
header .search-container atomic-search-box::part(wrapper) {
    border-width: 1px;
    border-color: var(--atomic-neutral);
    height: 50px;
}
header .search-container atomic-search-box::part(wrapper) {
    height: 52px;
}
header .search-container atomic-search-box::part(submit-button-wrapper) {
	margin-right: 0rem;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	background-color: var(--apexus-color-blue);
}
header .search-container atomic-search-box::part(submit-button), 
header .search-container atomic-search-box::part(submit-icon) {
	background-color: var(--apexus-color-blue);
	color: var(--apexus-color-white) !important;
}

header .dropdown-profile-content {
	top: 40px;
	right: 30px;
}

header .main-nav .navbar-collapse {
	margin-top: 30px !important;
}
header .primary-nav .navbar-collapse {
	margin-top: 20px !important;
}
header .top-nav {
	margin-left: auto;
	margin-right: 0;
	padding: 0;
	font-size: var(--apexus-font-size-small, 14px);
	width: unset;
}
header .navbar {
	padding-top: 0;
	padding-left: 30px;
	padding-right: 30px;
}
header .navbar-nav {
	padding-top: 0px !important;
	padding-right: 24px;
}
header .navbar-brand {
	padding-top: 10px;
	min-width: 100px;
	max-width: 100px;
	margin-right: 0;
}
header .navbar-brand img {
	height: unset;
	max-width: 100%;
	margin-top: -10px;
}
header .primary-nav {
	margin-top: -18px !important;
	margin-bottom: 0;
}
header .main-nav {
	padding: 0;
	margin-top: -18px !important;
}
header .navbar-toggler {
	margin-left: auto;
	margin-right: 5px;
	margin-top: -100px;
}
header .top-row-container {
	display: flex;
	padding-top: 32px;
	padding-left: 24px;
	align-items: start;
	min-height: 128px;
}
header .secondary-nav {
	padding-left: 0;
	margin-top: 0;
}
header .main-nav .navbar,
header .primary-nav .navbar,
header .secondary-nav .navbar {
	margin-left: 30px;
	padding: 0;
}
header .main-nav .navbar,
header .primary-nav .navbar {
	padding-bottom: 18px;
}
header .primary-nav .alert {
	padding-top: 0;
}



@media only screen and (min-width: 768px) {
    header .search-container {
		width: 50%;
    }
	header .navbar-toggler {
		margin-top: 0;
	}
	header .top-nav .navbar {
		padding: 0;
	}
	header .primary-nav,
	header .main-nav {
		margin-top: -36px !important;
	}
}

@media only screen and (min-width: 992px) {
	header .main-nav .navbar-collapse,
	header .primary-nav .navbar-collapse {
		margin-top: 0px !important;
	}
	header .main-nav .navbar {
		margin-left: 125px;
	}
	header .primary-nav .navbar {
		margin-left: 110px;
	}
	header .secondary-nav .navbar {
		margin-left: 130px;
	}
}

@media only screen and (min-width: 1024px) {
	header .primary-nav .navbar {
		margin-left: 115px;
	}
	header .search-container {
		flex-direction: row;
	}
}

@media only screen and (min-width: 1024px) and (max-width: 1280px) {
	header .main-nav .navbar {
		margin-left: 130px;
	}
}

@media only screen and (min-width: 1281px) {
	header .primary-nav .navbar {
		margin-left: 110px;
	}
	header .main-nav .navbar,
	header .secondary-nav .navbar {
		margin-left: 125px;
	}
}