/* Curso teórico — vista del instructor */
.curso-tabs { display: flex; gap: 6px; margin: 18px 0 14px; flex-wrap: wrap; }
.curso-tab {
    background: var(--surface); border: 1px solid var(--border); color: var(--ink-2);
    font: 600 11px/1 var(--font-display, system-ui); letter-spacing: .1em;
    padding: 10px 16px; border-radius: 8px; cursor: pointer;
}
.curso-tab.is-active { color: var(--ink-0); border-color: var(--accent, #1ab3c6); }

.curso-sesiones { display: flex; flex-direction: column; }
.curso-sesion {
    display: flex; gap: 14px; align-items: flex-start;
    padding: 14px 16px; border-top: 1px solid var(--border);
}
.curso-sesion:first-child { border-top: 0; }
.curso-sesion.is-publicada { background: rgba(26, 179, 198, .04); }
.cs-num {
    flex: 0 0 34px; height: 34px; border-radius: 50%;
    display: grid; place-items: center;
    background: var(--surface); border: 1px solid var(--border);
    font: 700 14px/1 var(--font-mono, monospace); color: var(--ink-2);
}
.curso-sesion.is-publicada .cs-num { border-color: var(--accent, #1ab3c6); color: var(--ink-0); }
.cs-info { flex: 1 1 auto; min-width: 0; }
.cs-info b { display: block; font-size: 14px; margin-bottom: 3px; }
.cs-info > span { display: block; font-size: 12px; color: var(--ink-2); line-height: 1.5; }
.cs-meta { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 7px; }
.cs-min { font: 11px var(--font-mono, monospace); color: var(--ink-2); }
.cs-acciones { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; flex: 0 0 auto; }

.curso-fuentes {
    font: 11px/1.6 var(--font-mono, monospace); color: var(--ink-2);
    margin: -6px 0 12px; word-break: break-word;
}

/* Quiz */
.curso-preg { border: 1px solid var(--border); border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; }
.cp-cab { display: flex; gap: 10px; justify-content: space-between; align-items: flex-start; }
.cp-cab b { font-size: 13px; line-height: 1.5; }
.cp-ops { margin: 8px 0 0; padding-left: 20px; font-size: 12.5px; line-height: 1.9; }
.cp-ops li.is-ok { color: var(--success, #17b26a); font-weight: 600; }
.cp-exp { font-size: 12px; color: var(--ink-2); margin: 8px 0 0; font-style: italic; }

/* Elegir cómo redactar */
.redactar-op {
    border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px;
    margin-bottom: 8px; cursor: pointer;
}
.redactar-op:hover { border-color: var(--accent, #1ab3c6); }
.redactar-op.peligro:hover { border-color: var(--danger, #e66767); }
.redactar-op b { display: block; font-size: 14px; margin-bottom: 4px; }
.redactar-op span { display: block; font-size: 12.5px; color: var(--ink-2); line-height: 1.55; }

.version-row {
    display: flex; gap: 10px; align-items: center; justify-content: space-between;
    padding: 7px 0; font-size: 12px; color: var(--ink-2);
}
.version-row em { opacity: .7; }

/* Respuestas habladas */
.voz-card { border-top: 1px solid var(--border); padding: 16px; }
.voz-card.is-revisada { opacity: .72; }
.vz-cab { display: flex; gap: 12px; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.vz-cab b { display: block; font-size: 14px; }
.vz-cab > div > span { font-size: 11.5px; color: var(--ink-2); }
.vz-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.vz-preg { font-size: 12.5px; color: var(--ink-2); margin: 8px 0 10px; line-height: 1.5; font-style: italic; }
.voz-card audio { width: 100%; max-width: 420px; display: block; margin-bottom: 10px; }
.vz-det { margin-bottom: 10px; }
.vz-det summary { font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase;
    color: var(--ink-2); cursor: pointer; }
.vz-det p { font-size: 13px; line-height: 1.6; margin: 8px 0 0; padding: 10px 12px;
    background: var(--surface); border: 1px solid var(--border); border-radius: 8px; }
.vz-ia, .vz-senal { font-size: 13px; line-height: 1.55; margin: 0 0 8px; }
.vz-senal { color: var(--warning, #c98500); }
.vz-senal em { opacity: .8; font-size: 12px; }
.vz-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.vz-form input[name="nota"] { width: 84px; flex: 0 0 auto; }
.vz-form input[name="comentario"] { flex: 1 1 220px; }

/* Material de referencia */
.medios-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px; margin-top: 12px; max-height: 46vh; overflow-y: auto;
}
.medio-op {
    margin: 0; border: 1px solid var(--border); border-radius: 10px; overflow: hidden;
    cursor: pointer; position: relative; background: var(--surface);
}
.medio-op:hover { border-color: var(--accent, #1ab3c6); }
.medio-op img { width: 100%; height: 92px; object-fit: cover; display: block; }
.medio-op figcaption { padding: 7px 9px; font-size: 11px; line-height: 1.45; }
.medio-op figcaption b { display: block; color: var(--ink-0); font-size: 11.5px;
    overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.medio-op figcaption span { color: var(--ink-2); }
.medio-dur {
    position: absolute; right: 6px; top: 74px; background: rgba(0,0,0,.78); color: #fff;
    font: 600 10px/1 var(--font-mono, monospace); padding: 3px 5px; border-radius: 4px;
}

.medios-lista { display: flex; flex-direction: column; gap: 6px; }
.medio-row {
    display: flex; gap: 10px; align-items: center;
    border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px;
}
.medio-row img { width: 56px; height: 38px; object-fit: cover; border-radius: 6px; flex: 0 0 auto; }
.medio-txt { flex: 1; min-width: 0; }
.medio-txt b { display: block; font-size: 12.5px; }
.medio-txt span {
    display: block; font-size: 11px; color: var(--ink-2);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* PIN entregable */
.curso-pin { display: flex; gap: 14px; margin: 14px 0; }
.curso-pin > div {
    flex: 1; background: var(--surface); border: 1px solid var(--border);
    border-radius: 10px; padding: 14px; text-align: center;
}
.curso-pin span { display: block; font: 600 10px/1 var(--font-display, system-ui); letter-spacing: .14em; color: var(--ink-2); }
.curso-pin b { display: block; margin-top: 8px; font: 700 26px/1 var(--font-mono, monospace); letter-spacing: .1em; }

/* Matriz de progreso */
.curso-matriz td, .curso-matriz th { text-align: center; }
.curso-matriz td:first-child, .curso-matriz th:first-child { text-align: left; white-space: nowrap; }
.curso-matriz .cm-ok { background: rgba(23, 178, 106, .16); font-weight: 600; }
.curso-matriz .cm-mid { background: rgba(255, 181, 71, .16); }
.curso-matriz .cm-off { opacity: .35; }

@media (max-width: 780px) {
    .curso-sesion { flex-wrap: wrap; }
    .cs-acciones { width: 100%; justify-content: flex-start; }
}