/* =========================================================
   CHEF CHAPÍN — HEADER
   Estilos exclusivos de la cabecera Astra
   ========================================================= */


/* =========================================================
   1. FONDO DEL HEADER
   ========================================================= */

.ast-primary-header-bar,
.main-header-bar {
	background-color: #8BAF00 !important;
	border-bottom: 0 !important;
}


/* =========================================================
   2. MENÚ PRINCIPAL — DESKTOP
   ========================================================= */

@media (min-width: 768px) {

	.site-header .main-header-menu > .menu-item > .menu-link,
	.ast-primary-header-bar .main-header-menu > .menu-item > .menu-link {
		color: #FFFFFF !important;
		font-size: 16px;
		font-weight: 600;
		text-decoration: none;

		padding-left: 0;
		padding-right: 0;

		transition: color 0.2s ease, opacity 0.2s ease;
	}


	/* Separación entre elementos del menú */

	.site-header .main-header-menu > .menu-item {
		margin-left: 16px;
		margin-right: 16px;
	}


	/* Hover */

	.site-header .main-header-menu > .menu-item > .menu-link:hover,
	.ast-primary-header-bar .main-header-menu > .menu-item > .menu-link:hover {
		color: #EEF4D8 !important;
		opacity: 1;
	}


	/* Elemento activo */

	.site-header .main-header-menu > .menu-item.current-menu-item > .menu-link,
	.ast-primary-header-bar .main-header-menu > .menu-item.current-menu-item > .menu-link {
		color: #EEF4D8 !important;
	}

}


/* =========================================================
   3. MÁRGENES DEL CONTENIDO DEL HEADER
   Logo y menú no quedan pegados a los bordes.
   ========================================================= */

.site-header .ast-builder-grid-row {
	box-sizing: border-box;

	padding-left: 100px;
	padding-right: 100px;
}


/* =========================================================
   4. ICONOS DEL HEADER
   ========================================================= */

.ast-primary-header-bar .ast-header-search,
.ast-primary-header-bar .ast-header-search .ast-search-menu-icon,
.ast-primary-header-bar .ast-button-wrap .menu-toggle {
	color: #FFFFFF !important;
}


/* SVG */

.ast-primary-header-bar svg {
	fill: currentColor;
}


/* =========================================================
   5. MENÚ HAMBURGUESA — BOTÓN
   ========================================================= */

.ast-primary-header-bar .menu-toggle,
.ast-primary-header-bar .ast-mobile-menu-trigger-minimal {
	color: #FFFFFF !important;

	background: transparent !important;
	border: 0 !important;
}


/* =========================================================
   6. HEADER EN TABLET / MÓVIL
   ========================================================= */

@media (max-width: 921px) {

	.ast-primary-header-bar,
	.main-header-bar {
		background-color: #8BAF00 !important;
	}

}


/* =========================================================
   7. MÓVIL — MÁRGENES
   Astra utiliza menú hamburguesa.
   ========================================================= */

@media (max-width: 767px) {

	.site-header .ast-builder-grid-row {
		padding-left: 16px;
		padding-right: 16px;
	}

}