/* ============================================================
   assets/css/docencIA/xp-rubrica.css
   Rubricas (DocencIA). Se carga despues de xp-base.css y de
   xp-planea.css, de las que toma encabezado de resultado,
   acciones, documento y carga narrada.
   Vistas: Rubrica/ViewRubricaNueva.php y Rubrica/ViewRubrica.php
   Documento: clases de helpers/rubrica_render_helper.php
   ============================================================ */

/* Los pasos se muestran y ocultan con el atributo hidden; .xp-generando y
   .xp-error traen display propio que lo anularia. */
.xp-ambito [hidden] { display: none !important; }

.xp-rb-espacio { margin-top: 1rem; }
.xp-rb-parrafo { margin: 0 0 .5rem; }
.xp-rb-parrafo:last-child { margin-bottom: 0; }

.xp-rb-titulo {
  font-size: clamp(1.4rem, 3.4vw, 1.9rem);
  margin: .4rem 0 1rem;
}

/* ---------------- Formulario ---------------- */
.xp-rb-form {
  display: flex;
  flex-direction: column;
  gap: 1.15rem;
  margin-top: 1.3rem;
  background: var(--xp-superficie);
  border: 1px solid var(--xp-borde);
  border-radius: var(--xp-radio);
  box-shadow: var(--xp-sombra);
  padding: 1.25rem;
}

@media (min-width: 720px) { .xp-rb-form { padding: 1.6rem 1.8rem; } }

/* Opciones de radio con el aspecto de .xp-sesion (que es un boton en
   Planea). .xp-campo label pone mayusculas y bloque: aqui no aplica. */
.xp-campo .xp-rb-opcion {
  display: inline-flex;
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
}

.xp-rb-opcion input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}

.xp-rb-opcion .xp-sesion {
  display: inline-flex;
  align-items: center;
  padding: 0 .95rem;
  font-size: .92rem;
}

.xp-rb-opcion input:focus-visible + .xp-sesion { box-shadow: var(--xp-anillo-foco); }

.xp-rb-form .xp-textarea { margin-top: 0; }
.xp-rb-form .xp-confirma-acciones { margin-top: 0; }
.xp-rb-form .xp-detalle { margin: 0; }

.xp-rb-criterios {
  list-style: none;
  margin: .6rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}

.xp-rb-criterios li {
  border-left: 3px solid var(--xp-primario);
  background: var(--xp-fondo);
  border-radius: 0 10px 10px 0;
  padding: .55rem .75rem;
  font-size: .9rem;
  line-height: 1.45;
}

.xp-rb-criterios strong { display: block; }

.xp-rb-pda,
.xp-rb-revisar {
  display: block;
  margin-top: .2rem;
  font-size: .8rem;
  color: var(--xp-sec);
}

.xp-rb-revisar { color: var(--xp-ambar); }

.xp-rb-previas { margin: 0; }
.xp-rb-previas a { color: var(--xp-primario); font-weight: 600; }

.xp-rb-planeaciones { margin-top: 1.2rem; }

/* ---------------- Documento: la rubrica ---------------- */
.xp-rb-doc .rubrica-encabezado dl {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .1rem .9rem;
  margin: 0 0 1rem;
}

@media (min-width: 720px) {
  .xp-rb-doc .rubrica-encabezado dl { grid-template-columns: max-content minmax(0, 1fr); }
}

.xp-rb-doc .rubrica-encabezado dt {
  font-size: .74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--xp-sec);
  padding-top: .2rem;
}

.xp-rb-doc .rubrica-encabezado dd { margin: 0 0 .35rem; }

/* La tabla se desliza en horizontal en pantallas chicas en lugar de
   comprimir los descriptores en columnas ilegibles. */
.xp-rb-doc .rubrica-tabla-contenedor {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 -.2rem;
  padding: 0 .2rem;
}

.xp-rb-doc table.tabla-rubrica { min-width: 640px; table-layout: fixed; }
.xp-rb-doc .tabla-rubrica th.col-criterio,
.xp-rb-doc .tabla-rubrica td.col-criterio { width: 24%; }
.xp-rb-doc .tabla-rubrica td { font-size: .86rem; line-height: 1.45; }
.xp-rb-doc .tabla-rubrica td.col-criterio { background: var(--xp-fondo); }

.xp-rb-doc .rubrica-criterio { display: block; font-size: .92rem; }

.xp-rb-doc .rubrica-descripcion,
.xp-rb-doc .rubrica-pda,
.xp-rb-doc .rubrica-sesiones,
.xp-rb-doc .rubrica-revisar {
  display: block;
  margin-top: .3rem;
  font-size: .78rem;
  color: var(--xp-sec);
}

.xp-rb-doc .rubrica-pda {
  border-left: 2px solid var(--xp-menta);
  padding-left: .45rem;
}

.xp-rb-doc .rubrica-sesiones { font-weight: 600; color: var(--xp-primario-int); }

.xp-rb-doc .rubrica-revisar {
  color: #7A4E12;
  background: var(--xp-ambar-tinte);
  border-radius: 6px;
  padding: .2rem .4rem;
}

.xp-rb-doc .rubrica-aprendizajes,
.xp-rb-doc .rubrica-notas { margin-top: 1.3rem; }

/* Rubricas anteriores: HTML libre del modelo, solo se ordena la tabla. */
.xp-rb-legada table { min-width: 0; }

@media print {
  .xp-rb-doc .rubrica-tabla-contenedor { overflow: visible; }
  .xp-rb-doc table.tabla-rubrica { min-width: 0; }
  .xp-rb-doc .tabla-rubrica td.col-criterio { background: none; }
}