/**
 * Bloque iplacex/malla-html-v2 (malla curricular v2). Paridad con
 * malla_html_v2.php de iplaweb. Tabs/selector de mallas → ficha de carrera →
 * acordeones año/bimestre/asignatura con badges de módulo → sidebar de módulos
 * con filtrado. Solo tokens de theme.json. Breakpoints 768/1024/1280.
 */

.ipx-mv2,
.ipx-mv2 *,
.ipx-mv2 *::before,
.ipx-mv2 *::after {
	box-sizing: border-box;
}

.ipx-mv2 {
	width: 100%;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ipla-black);
	font-family: var(--wp--preset--font-family--montserrat);
}
.ipx-mv2__inner {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 3rem 1.25rem;
}
@media (min-width: 768px) {
	.ipx-mv2__inner { padding: 4rem 2rem; }
}

.ipx-mv2 button {
	font-family: inherit;
	cursor: pointer;
}

/* ---------- Header ---------- */
.ipx-mv2__header { margin-bottom: 1.25rem; }
.ipx-mv2__title {
	margin: 0 0 1rem;
	font-size: 1.875rem;
	font-weight: 700;
	color: var(--wp--preset--color--ipla-blue);
}
@media (min-width: 768px) { .ipx-mv2__title { font-size: 2.25rem; } }
.ipx-mv2__desc {
	max-width: 48rem;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--wp--preset--color--ipla-black);
}
.ipx-mv2__desc > * { margin: 0 0 0.75rem; }
.ipx-mv2__desc ul { list-style: disc; margin-left: 1.5rem; }
.ipx-mv2__desc ol { list-style: decimal; margin-left: 1.5rem; }
@media (min-width: 768px) { .ipx-mv2__desc { font-size: 1.125rem; } }

/* ---------- Selector de mallas ---------- */
.ipx-mv2__selector { margin-bottom: 2rem; }
.ipx-mv2__selector-label {
	margin: 0 0 0.5rem;
	font-size: 1rem;
	font-weight: 600;
	color: var(--wp--preset--color--ipla-black);
}

.ipx-mv2__select-wrap { position: relative; }
.ipx-mv2__select {
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
	padding: 0.75rem 2.5rem 0.75rem 1rem;
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--ipla-blue);
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--ipla-textgray);
	border-radius: 0.5rem;
	cursor: pointer;
	transition: border-color 0.15s ease-in;
}
.ipx-mv2__select:focus { outline: none; border-color: var(--wp--preset--color--ipla-lightblue); }
.ipx-mv2__select-wrap .ipx-mv2__chevron {
	position: absolute;
	right: 0.75rem;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: var(--wp--preset--color--ipla-blue);
}
@media (min-width: 768px) { .ipx-mv2__select-wrap { display: none; } }

.ipx-mv2__tabs { display: none; }
@media (min-width: 768px) {
	.ipx-mv2__tabs {
		display: flex;
		flex-wrap: wrap;
		gap: 0.75rem;
	}
}
.ipx-mv2__tab {
	padding: 0.75rem 1.25rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--ipla-blue);
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--ipla-textgray);
	border-radius: 0.75rem;
	transition: background-color 0.2s ease-in, color 0.2s ease-in, border-color 0.2s ease-in, transform 0.2s ease-in;
}
.ipx-mv2__tab:hover {
	border-color: var(--wp--preset--color--ipla-lightblue);
	transform: translateY(-2px);
}
.ipx-mv2__tab.is-active {
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--ipla-lightblue);
	border-color: var(--wp--preset--color--ipla-lightblue);
}

/* ---------- Contenido por malla ---------- */
.ipx-mv2__content.is-hidden { display: none; }

/* ---------- Ficha de la carrera ---------- */
.ipx-mv2__ficha {
	margin-bottom: 2rem;
	padding: 1.5rem;
	background: var(--wp--preset--color--ipla-gray);
	border-radius: 1rem;
}
@media (min-width: 768px) { .ipx-mv2__ficha { padding: 2rem; } }
.ipx-mv2__ficha-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}
@media (min-width: 768px) {
	.ipx-mv2__ficha-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
}
@media (min-width: 1280px) {
	.ipx-mv2__ficha-grid { grid-template-columns: repeat(3, 1fr); }
}
.ipx-mv2__ficha-item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
}
.ipx-mv2__ficha-item--modalidad { grid-column: auto; }
.ipx-mv2__ficha-icon {
	flex-shrink: 0;
	margin-top: 0.125rem;
	color: var(--wp--preset--color--ipla-blue);
}
.ipx-mv2__ficha-label {
	margin-bottom: 0.25rem;
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--wp--preset--color--ipla-blue);
}
.ipx-mv2__ficha-value {
	font-size: 0.875rem;
	color: var(--wp--preset--color--ipla-black);
}

/* Modalidad + barras de porcentaje */
.ipx-mv2__modalidad { flex: 1; }
.ipx-mv2__modalidad-head {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}
.ipx-mv2__modalidad-head .ipx-mv2__ficha-label { margin-bottom: 0; }
.ipx-mv2__bars { display: flex; flex-direction: column; gap: 0.5rem; }
.ipx-mv2__bar-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 0.25rem;
}
.ipx-mv2__bar-label {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--wp--preset--color--ipla-black);
}
.ipx-mv2__bar-pct { font-size: 0.75rem; font-weight: 700; }
.ipx-mv2__bar-pct--online { color: var(--wp--preset--color--ipla-lightblue); }
.ipx-mv2__bar-pct--pres { color: var(--wp--preset--color--ipla-blue); }
.ipx-mv2__bar-track {
	position: relative;
	height: 0.375rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--ipla-textgray);
	border-radius: 9999px;
	overflow: hidden;
}
.ipx-mv2__bar-fill {
	position: absolute;
	inset: 0;
	border-radius: 9999px;
	transition: width 0.5s ease-out;
}
.ipx-mv2__bar-fill--online { background: var(--wp--preset--color--ipla-lightblue); }
.ipx-mv2__bar-fill--pres { background: var(--wp--preset--color--ipla-blue); }

/* CTA de descarga */
.ipx-mv2__ficha-cta {
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--ipla-textgray);
}
.ipx-mv2__dl-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.75rem 1.5rem;
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--ipla-lightblue);
	border: 0;
	border-radius: 9999px;
	transition: background-color 0.15s ease-in;
}
.ipx-mv2__dl-btn:hover { background: var(--wp--preset--color--ipla-blue); }

/* ---------- Layout (años + sidebar) ---------- */
.ipx-mv2__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	margin-bottom: 2rem;
}
@media (min-width: 768px) {
	.ipx-mv2__layout.has-modulos {
		grid-template-columns: 2fr 1fr;
		align-items: start;
	}
}

.ipx-mv2__years { display: flex; flex-direction: column; gap: 1rem; }
.ipx-mv2__years-title {
	margin: 0 0 0.5rem;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wp--preset--color--ipla-blue);
}
@media (min-width: 768px) { .ipx-mv2__years-title { font-size: 1.875rem; } }

/* ---------- Acordeones ---------- */
.ipx-mv2__accordion {
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--ipla-textgray);
	border-radius: 1rem;
	overflow: hidden;
}
.ipx-mv2__accordion--bim {
	border-width: 1px;
	border-radius: 0.75rem;
}
.ipx-mv2__acc-btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	width: 100%;
	padding: 1.25rem 1.5rem;
	text-align: left;
	background: none;
	border: 0;
	color: var(--wp--preset--color--ipla-black);
	transition: background-color 0.2s ease-in, color 0.2s ease-in;
}
.ipx-mv2__acc-btn--bim { padding: 1rem 1.25rem; }
.ipx-mv2__acc-btn:hover { background: var(--wp--preset--color--ipla-gray); }
.ipx-mv2__acc-btn[aria-expanded="true"].ipx-mv2__acc-btn--year {
	background: var(--wp--preset--color--ipla-blue);
	color: var(--wp--preset--color--white);
}
.ipx-mv2__acc-btn[aria-expanded="true"].ipx-mv2__acc-btn--bim {
	color: var(--wp--preset--color--ipla-blue);
}
.ipx-mv2__acc-head {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-width: 0;
}
.ipx-mv2__acc-titles { flex: 1; min-width: 0; }
.ipx-mv2__acc-title {
	display: block;
	font-size: 1.25rem;
	font-weight: 700;
	color: inherit;
}
@media (min-width: 768px) { .ipx-mv2__acc-title { font-size: 1.5rem; } }
.ipx-mv2__acc-title--bim { font-size: 1.125rem; }
@media (min-width: 768px) { .ipx-mv2__acc-title--bim { font-size: 1.25rem; } }
.ipx-mv2__acc-sub {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--ipla-lightblue);
}
.ipx-mv2__acc-btn[aria-expanded="true"].ipx-mv2__acc-btn--year .ipx-mv2__acc-sub { color: var(--wp--preset--color--white); }
.ipx-mv2__acc-sub--bim {
	font-size: 0.75rem;
	font-weight: 400;
	color: var(--wp--preset--color--ipla-black);
}
.ipx-mv2__acc-btn[aria-expanded="true"].ipx-mv2__acc-btn--bim .ipx-mv2__acc-sub--bim { color: var(--wp--preset--color--ipla-blue); }

.ipx-mv2__chevron { flex-shrink: 0; transition: transform 0.3s ease; color: inherit; }
.ipx-mv2__acc-btn .ipx-mv2__chevron { color: var(--wp--preset--color--ipla-black); }
.ipx-mv2__acc-btn[aria-expanded="true"].ipx-mv2__acc-btn--year .ipx-mv2__chevron { color: var(--wp--preset--color--white); }
.ipx-mv2__acc-btn[aria-expanded="true"].ipx-mv2__acc-btn--bim .ipx-mv2__chevron { color: var(--wp--preset--color--ipla-blue); }
.ipx-mv2__acc-btn[aria-expanded="true"] .ipx-mv2__chevron { transform: rotate(180deg); }

/* Badges de conteo (filtro de módulos) */
.ipx-mv2__badge-year,
.ipx-mv2__badge-bim {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--ipla-lightblue);
	border-radius: 9999px;
}
.ipx-mv2__badge-year { width: 2rem; height: 2rem; font-size: 0.875rem; }
.ipx-mv2__badge-bim { width: 1.75rem; height: 1.75rem; font-size: 0.75rem; }
.ipx-mv2__badge-year.is-hidden,
.ipx-mv2__badge-bim.is-hidden { display: none; }

.ipx-mv2__acc-panel.is-hidden { display: none; }
.ipx-mv2__acc-panel-inner {
	padding: 1rem;
	background: var(--wp--preset--color--ipla-gray);
	border-top: 1px solid var(--wp--preset--color--ipla-textgray);
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
@media (min-width: 768px) { .ipx-mv2__acc-panel--year > .ipx-mv2__acc-panel-inner { padding: 1.5rem; } }

/* ---------- Asignaturas ---------- */
.ipx-mv2__asig {
	padding: 1rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--ipla-textgray);
	border-radius: 0.75rem;
	transition: border-color 0.2s ease-in, box-shadow 0.2s ease-in;
}
.ipx-mv2__asig:hover { border-color: var(--wp--preset--color--ipla-lightblue); }
.ipx-mv2__asig.is-highlighted {
	border-color: var(--wp--preset--color--ipla-lightblue);
	box-shadow: 0 4px 12px rgba(6, 6, 49, 0.12);
}
.ipx-mv2__asig-code {
	margin-bottom: 0.25rem;
	font-family: monospace;
	font-size: 0.75rem;
	color: var(--wp--preset--color--ipla-blue);
}
.ipx-mv2__asig-name {
	margin: 0 0 0.5rem;
	font-size: 1rem;
	font-weight: 700;
	color: var(--wp--preset--color--ipla-black);
}
.ipx-mv2__asig-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin: 0.5rem 0 0.75rem;
	font-size: 0.875rem;
	color: var(--wp--preset--color--ipla-black);
}
.ipx-mv2__asig-meta-item { display: inline-flex; align-items: center; gap: 0.25rem; }

.ipx-mv2__asig-mods {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem;
	margin-bottom: 0.25rem;
}
.ipx-mv2__mod-indicator {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--ipla-lightblue);
	border-radius: 9999px;
}
.ipx-mv2__mod-indicator.is-hidden { display: none; }
.ipx-mv2__mod-tag {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.25rem 0.5rem;
	font-size: 0.6875rem;
	font-weight: 600;
	color: var(--wp--preset--color--ipla-blue);
	background: var(--wp--preset--color--ipla-gray);
	border-radius: 0.5rem;
}

.ipx-mv2__asig-expand {
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--wp--preset--color--ipla-textgray);
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.ipx-mv2__asig-desc {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--wp--preset--color--ipla-black);
}
.ipx-mv2__asig-flags { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.ipx-mv2__asig-flag {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.25rem 0.5rem;
	font-size: 0.6875rem;
	font-weight: 500;
	color: var(--wp--preset--color--ipla-black);
	background: var(--wp--preset--color--ipla-gray);
	border-radius: 0.25rem;
}

/* ---------- Sidebar de módulos ---------- */
.ipx-mv2__sidebar-inner {
	padding: 1.5rem 1.25rem;
	background: var(--wp--preset--color--ipla-blue);
	border-radius: 1.5rem;
	color: var(--wp--preset--color--white);
}
@media (min-width: 768px) {
	.ipx-mv2__sidebar-inner { position: sticky; top: 2rem; padding: 2.5rem 1.5rem; }
}
/* Panel azul oscuro → headings heredan blanco (theme.json los pintaría ipla-blue). */
.ipx-mv2__sidebar-inner :where(h1, h2, h3, h4, h5, h6) { color: var(--wp--preset--color--white); }
.ipx-mv2__sidebar-title {
	margin: 0 0 1.5rem;
	font-size: 1.5rem;
	font-weight: 700;
}
@media (min-width: 768px) { .ipx-mv2__sidebar-title { font-size: 1.875rem; } }
.ipx-mv2__sidebar-desc {
	margin-bottom: 1.5rem;
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--wp--preset--color--white);
}
.ipx-mv2__sidebar-desc p { margin: 0; }

.ipx-mv2__modulos {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
}
.ipx-mv2__modulo.is-hidden { display: none; }
.ipx-mv2__modulo-btn {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	width: 100%;
	padding: 0.875rem 1rem;
	text-align: left;
	color: var(--wp--preset--color--ipla-blue);
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--white);
	border-radius: 0.75rem;
	transition: border-color 0.2s ease-in, transform 0.2s ease-in, background-color 0.2s ease-in, color 0.2s ease-in;
}
.ipx-mv2__modulo-btn:hover {
	border-color: var(--wp--preset--color--ipla-lightblue);
	transform: translateY(-2px);
}
.ipx-mv2__modulo.is-active .ipx-mv2__modulo-btn {
	color: var(--wp--preset--color--white);
	background: var(--wp--preset--color--ipla-lightblue);
	border-color: var(--wp--preset--color--ipla-lightblue);
}
.ipx-mv2__modulo-name {
	flex: 1;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.25;
}
.ipx-mv2__modulo-arrow {
	flex-shrink: 0;
	opacity: 0;
	transition: opacity 0.2s ease-in;
}
.ipx-mv2__modulo-btn:hover .ipx-mv2__modulo-arrow,
.ipx-mv2__modulo.is-active .ipx-mv2__modulo-arrow { opacity: 1; }

.ipx-mv2__modulos-toggle,
.ipx-mv2__modulos-clear-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	width: 100%;
	padding: 0.75rem 1rem;
	font-size: 0.75rem;
	font-weight: 700;
	border-radius: 0.75rem;
	transition: background-color 0.2s ease-in, border-color 0.2s ease-in, transform 0.2s ease-in;
}
.ipx-mv2__modulos-toggle {
	margin-top: 1rem;
	color: var(--wp--preset--color--white);
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.3);
}
.ipx-mv2__modulos-toggle:hover { background: rgba(255, 255, 255, 0.2); }
.ipx-mv2__modulos-toggle-icon { transition: transform 0.3s ease; }
.ipx-mv2__modulos-toggle[data-expanded="true"] .ipx-mv2__modulos-toggle-icon { transform: rotate(180deg); }

.ipx-mv2__modulos-clear { margin-top: 1.25rem; }
.ipx-mv2__modulos-clear.is-hidden { display: none; }
.ipx-mv2__modulos-clear-btn {
	color: var(--wp--preset--color--ipla-blue);
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--white);
}
.ipx-mv2__modulos-clear-btn:hover { border-color: var(--wp--preset--color--ipla-lightblue); }

/* ---------- Form del gate (modal compartido) ---------- */
.ipx-mv2__form { width: 100%; }

/* Utilidad accesible */
.ipx-mv2 .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (prefers-reduced-motion: reduce) {
	.ipx-mv2 *,
	.ipx-mv2 *::before,
	.ipx-mv2 *::after { transition: none !important; }
}
