/* ENA Opiniones de Cursos — bloque en línea: no flota ni tapa contenido. */
.ena-oc {
	--ena-oc-accent: #2e7d32;
	--ena-oc-accent-dark: #1b5e20;
	--ena-oc-border: #dfe5dc;
	--ena-oc-bg: #f7faf6;
	--ena-oc-text: #1f2a1f;
	--ena-oc-muted: #5b6b5b;

	position: static;
	clear: both;
	box-sizing: border-box;
	width: 100%;
	max-width: 760px;
	margin: 32px auto;
	padding: 20px 22px;
	border: 1px solid var(--ena-oc-border);
	border-left: 4px solid var(--ena-oc-accent);
	border-radius: 10px;
	background: var(--ena-oc-bg);
	color: var(--ena-oc-text);
	font-size: 15px;
	line-height: 1.5;
}
.ena-oc *, .ena-oc *::before, .ena-oc *::after { box-sizing: border-box; }

.ena-oc__title { margin: 0 0 4px; font-size: 1.25em; line-height: 1.3; color: var(--ena-oc-text); }
.ena-oc__rule { margin: 0 0 14px; font-size: .92em; color: var(--ena-oc-muted); }

.ena-oc__progress { position: relative; height: 8px; border-radius: 99px; background: #e3e9e1; overflow: visible; }
.ena-oc__bar { display: block; height: 100%; border-radius: 99px; background: var(--ena-oc-accent); transition: width .4s ease; }
.ena-oc__mark { position: absolute; top: -4px; width: 2px; height: 16px; background: var(--ena-oc-text); opacity: .45; transform: translateX(-1px); }
.ena-oc__progress-label { margin: 6px 0 12px; font-size: .9em; color: var(--ena-oc-muted); }

.ena-oc__msg { margin: 0; padding: 10px 14px; border-radius: 8px; font-size: .95em; }
.ena-oc__msg--info { background: #fff8e1; border: 1px solid #f3dd9b; }
.ena-oc__msg--ok { background: #e8f5e9; border: 1px solid #b9dfbb; }
.ena-oc__msg--error, .ena-oc__error { margin: 0 0 12px; padding: 10px 14px; border-radius: 8px; background: #fdecea; border: 1px solid #f5c2bd; color: #8a1c12; }

.ena-oc__toggle, .ena-oc__submit {
	display: inline-block;
	padding: 10px 20px;
	border: 0;
	border-radius: 6px;
	background: var(--ena-oc-accent);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
}
.ena-oc__toggle:hover, .ena-oc__submit:hover { background: var(--ena-oc-accent-dark); }
.ena-oc__submit[disabled] { opacity: .6; cursor: wait; }
.ena-oc__toggle[aria-expanded="true"] { display: none; }

.ena-oc__form { margin-top: 4px; }
.ena-oc__field { margin: 0 0 14px; padding: 0; border: 0; min-width: 0; }
.ena-oc__label { display: block; margin: 0 0 6px; padding: 0; font-weight: 600; font-size: .95em; }
.ena-oc textarea {
	display: block;
	width: 100%;
	min-height: 96px;
	padding: 10px 12px;
	border: 1px solid #c9d3c6;
	border-radius: 6px;
	background: #fff;
	color: inherit;
	font: inherit;
	resize: vertical;
}
.ena-oc textarea:focus { outline: 2px solid var(--ena-oc-accent); outline-offset: 1px; border-color: var(--ena-oc-accent); }

/* Estrellas: radios en orden inverso para poder pintar las anteriores con ~ */
.ena-oc__stars { display: inline-flex; flex-direction: row-reverse; gap: 2px; }
.ena-oc__stars input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ena-oc__stars label { font-size: 30px; line-height: 1; color: #c8cfc6; cursor: pointer; transition: color .15s; }
.ena-oc__stars label:hover,
.ena-oc__stars label:hover ~ label,
.ena-oc__stars input:checked ~ label { color: #f0a500; }
.ena-oc__stars input:focus-visible + label { outline: 2px solid var(--ena-oc-accent); outline-offset: 2px; border-radius: 4px; }

.ena-oc__note { margin: 0 0 12px; font-size: .85em; color: var(--ena-oc-muted); }

@media (max-width: 600px) {
	.ena-oc { margin: 24px 0; padding: 16px; }
	.ena-oc__submit, .ena-oc__toggle { width: 100%; }
}

/* Lista de opiniones en el producto */
.ena-oc-list__summary { margin: 0 0 16px; font-size: 1.05em; }
.ena-oc-list__stars { color: #f0a500; letter-spacing: 1px; margin-right: 6px; }
.ena-oc-list__items { list-style: none; margin: 0; padding: 0; }
.ena-oc-list__item { margin: 0 0 14px; padding: 14px 16px; border: 1px solid #e3e7e1; border-radius: 8px; background: #fff; }
.ena-oc-list__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 6px; font-size: .95em; }
.ena-oc-list__meta time { color: #6b766b; font-size: .9em; }
.ena-oc-list__badge { padding: 1px 8px; border-radius: 99px; background: #e8f5e9; color: #1b5e20; font-size: .8em; font-weight: 600; }
.ena-oc-list__text p { margin: 0 0 .5em; }
.ena-oc-list__text p:last-child { margin-bottom: 0; }
