/*
 * PDS - Encabezado del sitio en el azul de la marca (mu-plugins/pds-curso.php).
 * Mismo encabezado que "Mi cuenta" (pds-cuenta-alumno) para que todo el campus se vea igual.
 * El tema fuerza el gris (#2d2d2d) con !important desde Theme Options.
 */

body.pds-marca #header:not(.transparent_header) .header_default {
	padding: 16px 0;
	background-color: #0a1733 !important;
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .07);
}

body.pds-marca #header .logo-unit a {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

body.pds-marca #header .logo-unit img {
	width: 32px !important;
	height: auto;
	padding: 7px;
	box-sizing: content-box;
	border-radius: 12px;
	background: #fff;
}

body.pds-marca #header .logo-unit a::after {
	content: "Online Educativa";
	font-family: Montserrat, system-ui, sans-serif;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -.01em;
	white-space: nowrap;
	color: #fff;
}

body.pds-marca #header .header-menu > li > a {
	color: rgba(255, 255, 255, .78);
	transition: color .2s;
}

body.pds-marca #header .header-menu > li > a:hover,
body.pds-marca #header .header-menu > li.current-menu-item > a {
	color: #fff;
}

@media (max-width: 575px) {
	body.pds-marca #header .logo-unit a::after {
		font-size: 16px;
	}
}

/* El otro encabezado del tema (#header-mobile .header_2: logo + buscador + cuenta). Lo usa la raíz
   de /cuenta-de-usuario/, que es adonde MasterStudy manda al alumno después de ingresar. */
body.pds-marca #header-mobile .header_2 {
	background-color: #0a1733 !important;
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .07);
}

body.pds-marca #header-mobile .header_2 .logo-unit a {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

body.pds-marca #header-mobile .header_2 .logo-unit img {
	width: 30px !important;
	height: auto;
	padding: 6px;
	box-sizing: content-box;
	border-radius: 11px;
	background: #fff;
}

/* "Ser docente": venía gris oscuro, sobre el azul no se leía. */
body.pds-marca #header-mobile .header_2 a.stm_lms_bi_link,
body.pds-marca #header-mobile .header_2 a.stm_lms_bi_link * {
	color: rgba(255, 255, 255, .75);
}

body.pds-marca #header-mobile .header_2 a.stm_lms_bi_link:hover,
body.pds-marca #header-mobile .header_2 a.stm_lms_bi_link:hover * {
	color: #fff;
}

body.pds-marca #header-mobile .header_2 .stm_lms_settings_button,
body.pds-marca #header-mobile .header_2 .stm_lms_settings_button i,
body.pds-marca #header-mobile .header_2 .stm_header_top_toggler {
	color: #fff;
}

/* Botón de menú del celular: venía gris oscuro con rayitas oscuras (no se veían, ya antes del rediseño).
   El tema fuerza esos colores desde Theme Options, de ahí el !important. */
body.pds-marca #header-mobile .navbar-toggle {
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 14px;
	background: rgba(255, 255, 255, .08) !important;
}

/* En el celular ese botón con forma de menú es el de búsqueda (button.stm_header_top_search). */
body.pds-marca #header-mobile .navbar-toggle .icon-bar,
body.pds-marca #header-mobile .header_mobile .header_top button.stm_header_top_search .icon-bar {
	background-color: #fff !important;
}

@media (min-width: 768px) {
	body.pds-marca #header-mobile .header_2 .logo-unit a::after {
		content: "Online Educativa";
		font-family: Montserrat, system-ui, sans-serif;
		font-size: 17px;
		font-weight: 700;
		letter-spacing: -.01em;
		white-space: nowrap;
		color: #fff;
	}
}