/* ==========================================================================
   Portal Docente — contenido de artículos y estilos de bloque
   (se carga en el sitio y en el editor)
   ========================================================================== */

:root {
	--pd-navy: #0E3350;
	--pd-blue: #174A6E;
	--pd-yellow: #FFD24C;
	--pd-line: #E3E8EE;
	--pd-sky: #EEF4F9;
	--pd-sky-2: #E3EEF7;
	--pd-sky-line: #C8D6E3;
	--pd-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
}

/* ---------- Texto del artículo ---------- */
.pd-prose { font-size: 18px; line-height: 1.7; color: #2A3744; }
.pd-prose > * { margin-top: 0; margin-bottom: 1.25em; }
.pd-prose > *:last-child { margin-bottom: 0; }
.pd-prose > p:first-child { font-size: 20px; color: #2A3744; }
.pd-prose h2 {
	font-family: var(--pd-display); font-weight: 800; font-size: clamp(26px, 3.4vw, 32px); line-height: 1.15;
	color: var(--pd-navy); margin: 2em 0 .6em; letter-spacing: -.01em;
}
.pd-prose h3 { font-weight: 700; font-size: 22px; line-height: 1.25; color: var(--pd-navy); margin: 1.6em 0 .5em; }
.pd-prose h4 { font-weight: 700; font-size: 19px; color: var(--pd-navy); margin: 1.4em 0 .4em; }
.pd-prose h2:first-child, .pd-prose h3:first-child { margin-top: 0; }
.pd-prose strong { color: #18232E; }
.pd-prose a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.pd-prose ul, .pd-prose ol { padding-left: 1.3em; }
.pd-prose li { margin-bottom: .4em; }
.pd-prose blockquote {
	margin-left: 0; margin-right: 0; padding: 4px 0 4px 20px; border-left: 4px solid var(--pd-yellow);
	font-size: 20px; color: var(--pd-navy);
}
.pd-prose img { border-radius: 14px; }
.pd-prose figure { margin-left: 0; margin-right: 0; }
.pd-prose hr { border: 0; border-top: 1px solid var(--pd-line); margin: 2.5em 0; }
.pd-prose code { background: #F1F4F7; padding: .1em .35em; border-radius: 6px; font-size: .9em; }

/* Tablas comunes dentro del artículo */
.pd-prose .wp-block-table { overflow-x: auto; }
.pd-prose table { width: 100%; border-collapse: collapse; font-size: 16px; }
.pd-prose th, .pd-prose td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--pd-line); }
.pd-prose th { color: var(--pd-navy); }

/* ---------- Estilos de bloque: Grupo ---------- */
.is-style-pd-aviso,
.is-style-pd-info,
.is-style-pd-peligro {
	border-radius: 16px; padding: 20px 22px 20px 58px !important; position: relative; font-size: 17px; line-height: 1.6;
}
.is-style-pd-aviso > *, .is-style-pd-info > *, .is-style-pd-peligro > * { margin-top: 0; margin-bottom: .6em; }
.is-style-pd-aviso > *:last-child, .is-style-pd-info > *:last-child, .is-style-pd-peligro > *:last-child { margin-bottom: 0; }
.is-style-pd-aviso::before,
.is-style-pd-info::before,
.is-style-pd-peligro::before {
	content: ""; position: absolute; left: 20px; top: 21px; width: 24px; height: 24px;
	background-color: currentColor;
	-webkit-mask: var(--pd-mask) center / contain no-repeat; mask: var(--pd-mask) center / contain no-repeat;
}
.is-style-pd-aviso {
	background: #FFF8E1; border: 1px solid #F2D27A; color: #3D2E00;
	--pd-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v4M12 16h.01'/%3E%3C/svg%3E");
}
.is-style-pd-aviso::before { color: #8A5A00; }
.is-style-pd-aviso strong { color: #2A1F00; }
.is-style-pd-info {
	background: var(--pd-sky); border: 1px solid var(--pd-sky-line); color: #18232E;
	--pd-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E");
}
.is-style-pd-info::before { color: var(--pd-blue); }
.is-style-pd-peligro {
	background: #FBEDEA; border: 1px solid #EFC6BC; color: #4A2018;
	--pd-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9L1.8 18a2 2 0 001.7 3h17a2 2 0 001.7-3L13.7 3.9a2 2 0 00-3.4 0z'/%3E%3Cpath d='M12 9v4M12 17h.01'/%3E%3C/svg%3E");
}
.is-style-pd-peligro::before { color: #8A2A14; }
.is-style-pd-peligro strong { color: #7A2414; }

.is-style-pd-tarjeta {
	border: 1px solid var(--pd-line); border-radius: 18px; padding: 22px !important; height: 100%; background: #FFFFFF;
}
.is-style-pd-tarjeta > * { margin-top: 0; margin-bottom: .5em; }
.is-style-pd-tarjeta > *:last-child { margin-bottom: 0; }
.is-style-pd-tarjeta h3, .is-style-pd-tarjeta h4 { font-size: 19px; margin-top: 0 !important; color: var(--pd-navy); }
.is-style-pd-tarjeta p { font-size: 16px; color: #3A4756; }
.wp-block-column > .is-style-pd-tarjeta { height: 100%; }

.is-style-pd-oscuro {
	background: var(--pd-navy); color: #DCE8F2; border-radius: 22px; padding: 28px !important;
}
.is-style-pd-oscuro > * { margin-top: 0; margin-bottom: .75em; }
.is-style-pd-oscuro > *:last-child { margin-bottom: 0; }
.is-style-pd-oscuro h2, .is-style-pd-oscuro h3, .is-style-pd-oscuro h4, .is-style-pd-oscuro strong { color: #FFFFFF; margin-top: 0 !important; }
.is-style-pd-oscuro h2, .is-style-pd-oscuro h3 { font-family: var(--pd-display); font-weight: 800; font-size: 26px; line-height: 1.15; }
.is-style-pd-oscuro a:not(.wp-block-button__link) { color: var(--pd-yellow); }

/* ---------- Estilos de bloque: Lista ---------- */
ol.is-style-pd-pasos {
	list-style: none; padding: 0 !important; margin-left: 0; counter-reset: pdpaso; display: flex; flex-direction: column; gap: 12px;
}
ol.is-style-pd-pasos > li {
	counter-increment: pdpaso; position: relative; padding: 20px 22px 20px 82px; margin: 0;
	border: 1px solid var(--pd-line); border-radius: 18px; min-height: 84px; line-height: 1.55;
}
ol.is-style-pd-pasos > li::before {
	content: counter(pdpaso); position: absolute; left: 22px; top: 20px; width: 44px; height: 44px; border-radius: 12px;
	background: var(--pd-accent, #1D5F8C); color: #FFFFFF; display: flex; align-items: center; justify-content: center;
	font-family: var(--pd-display); font-weight: 800; font-size: 20px;
}
ol.is-style-pd-pasos > li > strong:first-child { display: block; color: var(--pd-navy); font-size: 19px; margin-bottom: 2px; }
ol.is-style-pd-pasos > li img { display: block; margin-top: 12px; border-radius: 12px; border: 1px solid var(--pd-line); }
ul.is-style-pd-pasos { list-style: disc; }

.is-style-pd-check { list-style: none; padding: 0 !important; margin-left: 0; border: 1px solid var(--pd-line); border-radius: 18px; overflow: hidden; }
.is-style-pd-check > li {
	position: relative; padding: 16px 22px 16px 56px; margin: 0; border-top: 1px solid var(--pd-line); line-height: 1.55;
}
.is-style-pd-check > li:first-child { border-top: 0; }
.is-style-pd-check > li::before {
	content: ""; position: absolute; left: 22px; top: 19px; width: 20px; height: 20px; background: #1D7A4A;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.is-style-pd-oscuro .is-style-pd-check { border: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 10px 24px; overflow: visible; }
.is-style-pd-oscuro .is-style-pd-check > li { border: 0; padding: 0 0 0 32px; color: #DCE8F2; }
.is-style-pd-oscuro .is-style-pd-check > li::before { left: 0; top: 3px; background: var(--pd-yellow); }

/* ---------- Estilos de bloque: Tabla ---------- */
.wp-block-table.is-style-pd-tabla { border: 1px solid var(--pd-line); border-radius: 16px; overflow-x: auto; }
.wp-block-table.is-style-pd-tabla table { border-collapse: collapse; width: 100%; min-width: 480px; font-size: 16px; border: 0; }
.wp-block-table.is-style-pd-tabla thead { border: 0; background: #F6F8FA; }
.wp-block-table.is-style-pd-tabla th,
.wp-block-table.is-style-pd-tabla td { border: 0; border-top: 1px solid var(--pd-line); padding: 13px 18px; text-align: left; }
.wp-block-table.is-style-pd-tabla thead th { border-top: 0; color: var(--pd-navy); font-weight: 700; }
.wp-block-table.is-style-pd-tabla td:first-child { font-weight: 700; color: #18232E; }
.wp-block-table.is-style-pd-tabla figcaption { padding: 10px 18px; margin: 0; }

/* ---------- Estilos de bloque: Botón ---------- */
.wp-block-button__link { border-radius: 12px; font-weight: 700; padding: 12px 24px; }
.is-style-pd-amarillo .wp-block-button__link { background: var(--pd-yellow); color: #2A1F00; }
.is-style-pd-amarillo .wp-block-button__link:hover { background: #FFC61A; color: #2A1F00; }

/* ---------- Detalles (preguntas frecuentes) ---------- */
.wp-block-details.is-style-pd-faq,
.pd-prose .wp-block-details {
	border: 1px solid var(--pd-line); border-radius: 16px; padding: 0; margin-bottom: 12px; background: #FFFFFF;
}
.wp-block-details.is-style-pd-faq summary,
.pd-prose .wp-block-details summary {
	cursor: pointer; list-style: none; padding: 18px 56px 18px 22px; font-weight: 700; font-size: 18px; color: var(--pd-navy);
	position: relative; line-height: 1.35;
}
.wp-block-details.is-style-pd-faq summary::-webkit-details-marker,
.pd-prose .wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details.is-style-pd-faq summary::after,
.pd-prose .wp-block-details summary::after {
	content: ""; position: absolute; right: 22px; top: 50%; width: 10px; height: 10px; margin-top: -7px;
	border-right: 2.5px solid var(--pd-blue); border-bottom: 2.5px solid var(--pd-blue); transform: rotate(45deg); transition: transform .15s;
}
.wp-block-details.is-style-pd-faq[open] summary::after,
.pd-prose .wp-block-details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.wp-block-details.is-style-pd-faq > :not(summary),
.pd-prose .wp-block-details > :not(summary) { margin: 0; padding: 0 22px 18px; font-size: 17px; color: #3A4756; }

/* ---------- Columnas ---------- */
.pd-prose .wp-block-columns { gap: 14px; }