/* ---------- Temario · índice de bloques y temas ---------- */
/* caja estrecha a propósito: 54 filas de texto necesitan una línea legible */
.opr-ix-i-caja{max-width:880px !important}
.opr-ix-i-cabeza{margin-bottom:26px !important}

/* --- barra de búsqueda, pegada al borde superior --- */
.opr-ix-barra{position:sticky !important; top:0 !important; z-index:20 !important; display:flex !important; align-items:center !important; gap:12px !important;
  flex-wrap:wrap !important; padding:14px 0 13px !important; margin-bottom:14px !important;
  background:var(--superficie) !important; border-bottom:1px solid var(--borde) !important}

.opr-ix-buscador{position:relative !important; flex:1 1 260px !important; display:flex !important; align-items:center !important}
.opr-ix-lupa{position:absolute !important; left:15px !important; width:17px !important; height:17px !important; color:var(--tenue) !important; pointer-events:none !important}
.opr-ix-campo{width:100% !important; padding:13px 44px 13px 42px !important; border-radius:999px !important;
  background:var(--p50) !important; box-shadow:inset 0 0 0 1.5px var(--borde) !important;
  font-size:.9375rem !important; font-weight:500 !important; color:var(--tinta) !important; letter-spacing:-.006em !important;
  transition:box-shadow .16s ease, background .16s ease !important}
.opr-ix-campo::placeholder{color:var(--tenue) !important; font-weight:400 !important}
.opr-ix-campo:focus{background:var(--superficie) !important; box-shadow:inset 0 0 0 1.5px var(--p500) !important}
.opr-ix-campo::-webkit-search-cancel-button{display:none !important}
.opr-ix-limpiar{position:absolute !important; right:9px !important; width:30px !important; height:30px !important; border-radius:999px !important;
  display:grid !important; place-items:center !important; color:var(--tenue) !important; transition:color .16s ease, background .16s ease !important}
.opr-ix-limpiar:hover{color:var(--tinta) !important; background:var(--p100) !important}
.opr-ix-limpiar svg{width:15px !important; height:15px !important}

.opr-ix-estado{display:flex !important; align-items:center !important; gap:14px !important; flex:none !important}
.opr-ix-cuenta{font-size:.84375rem !important; font-weight:700 !important; color:var(--tenue) !important; white-space:nowrap !important}
.opr-ix-todo{font-size:.84375rem !important; font-weight:700 !important; color:var(--suave) !important; letter-spacing:-.01em !important;
  padding:8px 14px !important; border-radius:999px !important; box-shadow:inset 0 0 0 1.5px var(--borde) !important;
  white-space:nowrap !important; transition:color .16s ease, box-shadow .16s ease, background .16s ease !important}
.opr-ix-todo:hover{color:var(--tinta) !important; background:var(--p50) !important; box-shadow:inset 0 0 0 1.5px var(--borde2) !important}

/* --- un bloque --- */
.opr-ix-bloques{display:flex !important; flex-direction:column !important; gap:9px !important}
.opr-ix-b{position:relative !important; border-radius:var(--radio) !important; background:var(--superficie) !important;
  box-shadow:inset 0 0 0 1px var(--borde), var(--sombra-s) !important; overflow:hidden !important;
  scroll-margin-top:86px !important; transition:box-shadow .2s ease !important}
.opr-ix-b.es-abierto{box-shadow:inset 0 0 0 1px var(--borde2), var(--sombra) !important}
/* la barra lateral es el código de color del bloque, no decoración */
.opr-ix-b::before{content:'' !important; position:absolute !important; left:0 !important; top:0 !important; bottom:0 !important; width:4px !important; background:var(--acento) !important}

.opr-ix-cab{width:100% !important; display:flex !important; align-items:center !important; gap:14px !important; text-align:left !important;
  padding:16px 18px 16px 22px !important; transition:background .16s ease !important}
.opr-ix-cab:hover{background:var(--p50) !important}
.opr-ix-galon{flex:none !important; min-width:46px !important; height:44px !important; padding:0 9px !important; border-radius:12px !important;
  display:grid !important; place-items:center !important; background:var(--galon) !important; color:var(--galon-tinta) !important;
  font-size:1rem !important; font-weight:800 !important; letter-spacing:.01em !important}
.opr-ix-cab-meta{flex:1 1 auto !important; min-width:0 !important; display:flex !important; flex-direction:column !important; gap:2px !important}
.opr-ix-cab-meta b{font-size:1.0625rem !important; font-weight:700 !important; letter-spacing:-.018em !important; line-height:1.25 !important; text-wrap:balance !important}
.opr-ix-cab-meta i{font-size:.78125rem !important; font-weight:500 !important; color:var(--tenue) !important; font-variant-numeric:tabular-nums !important}
.opr-ix-chevron{flex:none !important; width:20px !important; height:20px !important; color:var(--tenue) !important;
  transition:transform .28s cubic-bezier(.32,.72,.16,1), color .16s ease !important}
.opr-ix-cab:hover .opr-ix-chevron{color:var(--tinta) !important}
.opr-ix-b.es-abierto .opr-ix-chevron{transform:rotate(180deg) !important; color:var(--tinta) !important}

/* --- despliegue: 0fr → 1fr, sin medir alturas a mano --- */
.opr-ix-caja{display:grid !important; grid-template-rows:0fr !important; transition:grid-template-rows .32s cubic-bezier(.32,.72,.16,1) !important}
.opr-ix-b.es-abierto .opr-ix-caja{grid-template-rows:1fr !important}
.opr-ix-lista{overflow:hidden !important; min-height:0 !important}
.opr-ix-b.es-abierto .opr-ix-lista{padding:0 18px 12px 22px !important}

/* --- una fila de tema --- */
.opr-ix-tema{display:flex !important; align-items:center !important; gap:13px !important; padding:11px 12px !important;
  border-radius:var(--radio-s) !important; border-top:1px solid var(--borde) !important;
  transition:background .14s ease, padding-left .14s ease !important}
.opr-ix-tema:first-child{border-top:0 !important}
.opr-ix-tema:hover{background:var(--p50) !important; padding-left:17px !important}
/* el número va en gris a propósito: 54 cifras de colores serían ruido, y el
   rojo del bloque X se confundiría con el rojo de «fallo». La identidad del
   bloque la llevan el galón y la barra lateral. */
.opr-ix-num{flex:none !important; min-width:26px !important; font-size:.8125rem !important; font-weight:800 !important; color:var(--tenue) !important;
  font-variant-numeric:tabular-nums !important}
.opr-ix-tit{flex:1 1 auto !important; font-size:.9375rem !important; font-weight:500 !important; line-height:1.4 !important;
  letter-spacing:-.008em !important; color:var(--tinta) !important; text-wrap:pretty !important}
.opr-ix-flecha{flex:none !important; width:16px !important; height:16px !important; color:var(--tinta) !important;
  opacity:0 !important; transform:translateX(-4px) !important; transition:opacity .14s ease, transform .14s ease !important}
.opr-ix-tema:hover .opr-ix-flecha{opacity:1 !important; transform:none !important}

/* --- aviso de acceso y candados --- */
.opr-ix-aviso{display:flex !important; align-items:center !important; gap:11px !important; padding:13px 16px !important; margin-bottom:14px !important;
  border-radius:var(--radio-s) !important; background:var(--av100) !important; box-shadow:inset 0 0 0 1px var(--av500) !important;
  font-size:.875rem !important; line-height:1.5 !important; color:var(--av900) !important; text-wrap:pretty !important}
.opr-ix-aviso a{font-weight:700 !important; color:var(--av900) !important; text-decoration:underline !important; text-underline-offset:3px !important}
.opr-ix-candado{flex:none !important; width:15px !important; height:15px !important; color:var(--tenue) !important}
.opr-ix-candado.es-bloque{width:17px !important; height:17px !important; margin-right:2px !important}
.opr-ix-b.es-bloqueado .opr-ix-galon{opacity:.62 !important}
.opr-ix-tema.es-cerrado .opr-ix-tit{color:var(--suave) !important}
.opr-ix-tema.es-cerrado:hover{background:var(--p50) !important; padding-left:12px !important}
.opr-ix-pronto{flex:none !important; font-size:.6875rem !important; font-weight:700 !important; letter-spacing:.01em !important;
  padding:3px 8px !important; border-radius:999px !important; background:var(--p100) !important; color:var(--tenue) !important}
.opr-ix-tema.es-pronto{cursor:default !important}
.opr-ix-tema.es-pronto:hover{background:none !important; padding-left:12px !important}
.opr-ix-tema.es-pronto .opr-ix-tit{color:var(--tenue) !important}
.opr-ix-libre{flex:none !important; font-size:.6875rem !important; font-weight:800 !important; letter-spacing:.01em !important;
  padding:3px 8px !important; border-radius:999px !important; background:var(--ok100) !important; color:var(--ok900) !important}

.opr-ix-marca{background:var(--av100) !important; color:var(--av900) !important; border-radius:3px !important; padding:0 2px !important; font-weight:700 !important}

.opr-ix-b.es-oculto{display:none !important}
.opr-ix-tema.es-oculto{display:none !important}
.opr-ix-vacio{margin-top:24px !important; text-align:center !important; font-size:.9375rem !important; color:var(--suave) !important}
.opr-ix-vacio b{font-weight:700 !important; color:var(--tinta) !important}

@media (max-width:560px){
  .opr-ix-barra{gap:9px !important; padding:12px 0 11px !important}
  .opr-ix-estado{flex:1 1 100% !important; justify-content:space-between !important; gap:10px !important}
  .opr-ix-cab{gap:12px !important; padding:14px 15px 14px 19px !important}
  .opr-ix-galon{min-width:40px !important; height:40px !important; font-size:.9375rem !important}
  .opr-ix-cab-meta b{font-size:.96875rem !important}
  .opr-ix-b.es-abierto .opr-ix-lista{padding:0 14px 11px 19px !important}
  .opr-ix-tema{gap:11px !important; padding:11px 9px !important}
  .opr-ix-tema:hover{padding-left:9px !important}
  .opr-ix-tit{font-size:.90625rem !important}
}

/* --- bloque 12: el temario oficial en PDF --- */
.opr-ix-b.es-pdf{margin-top:9px !important}
.opr-ix-pdf{display:flex !important; align-items:center !important; gap:13px !important; padding:11px 12px !important;
  border-radius:var(--radio-s) !important; border-top:1px solid var(--borde) !important}
.opr-ix-pdf:first-child{border-top:0 !important}
.opr-ix-pdf-meta{flex:1 1 auto !important; min-width:0 !important; display:flex !important; flex-direction:column !important; gap:2px !important}
.opr-ix-pdf-meta b{font-size:.9375rem !important; font-weight:600 !important; color:var(--tinta) !important; line-height:1.3 !important}
.opr-ix-pdf-meta i{font-size:.78125rem !important; font-weight:500 !important; font-style:normal !important; color:var(--tenue) !important}
.opr-ix-pdf-ver{flex:none !important; display:inline-flex !important; align-items:center !important; gap:7px !important;
  padding:8px 14px !important; border-radius:999px !important; background:var(--p50) !important;
  box-shadow:inset 0 0 0 1px var(--borde) !important; color:var(--tinta) !important;
  font-size:.84375rem !important; font-weight:700 !important; text-decoration:none !important;
  transition:background .14s ease, box-shadow .14s ease !important}
.opr-ix-pdf-ver:hover,.opr-ix-pdf-ver:focus{background:var(--superficie) !important; box-shadow:inset 0 0 0 1px var(--borde2) !important; color:var(--tinta) !important}
.opr-ix-pdf-ver svg{width:15px !important; height:15px !important; flex:none !important}
@media (max-width:560px){
  .opr-ix-pdf{flex-wrap:wrap !important; gap:8px 9px !important; padding:11px 9px !important}
  .opr-ix-pdf-meta{flex:1 1 100% !important}
  .opr-ix-pdf-meta b{font-size:.90625rem !important}
  .opr-ix-pdf-ver{margin-left:auto !important}
  .opr-ix-pdf-ver{gap:6px !important; padding:7px 11px !important; font-size:.8125rem !important}
  .opr-ix-pdf-ver svg{width:14px !important; height:14px !important}
}

/* --- una línea debajo del cajón del PDF, hacia el artículo del temario --- */
.opr-ix-mas{margin:14px 2px 0 !important; font-size:.875rem !important; line-height:1.5 !important; color:var(--suave) !important}
.opr-ix-mas a{font-weight:700 !important; color:var(--tinta) !important; text-decoration:none !important; box-shadow:inset 0 -1px 0 0 var(--borde2) !important; transition:box-shadow .14s ease !important}
.opr-ix-mas a:hover,.opr-ix-mas a:focus{box-shadow:inset 0 -2px 0 0 var(--tinta) !important; color:var(--tinta) !important}
@media (max-width:560px){ .opr-ix-mas{font-size:.84375rem !important; margin-top:12px !important} }

/* v1.2.22 · Dentro de los temas: lo que encuentra el buscador en el material */
.opr-ix-dentro-res{display:block !important; margin-top:28px !important}
.opr-ix-dentro-res[hidden]{display:none !important}
.opr-ix-res-cab{display:flex !important; align-items:baseline !important; justify-content:space-between !important; gap:12px !important; margin-bottom:12px !important}
.opr-ix-res-tit{font-size:1.125rem !important; font-weight:700 !important; line-height:1.3 !important; color:var(--tinta) !important; margin:0 !important}
.opr-ix-res-cuenta{font-size:.875rem !important; color:var(--suave) !important}
.opr-ix-res-lista{display:grid !important; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)) !important; gap:10px !important; list-style:none !important; margin:0 !important; padding:0 !important}
.opr-ix-res-lista li{margin:0 !important; padding:0 !important; list-style:none !important}
.opr-ix-res-lista a,.opr-ix-res-lista li > div{display:flex !important; flex-direction:column !important; gap:4px !important; height:100% !important; padding:14px 16px !important; border-radius:11px !important; background:#FFFFFF !important; box-shadow:inset 0 0 0 1px var(--borde) !important; text-decoration:none !important; color:var(--tinta) !important}
.opr-ix-res-lista a:hover{box-shadow:inset 0 0 0 1px var(--borde2) !important}
.opr-ix-res-lista a:focus-visible{outline:2px solid var(--tinta) !important; outline-offset:2px !important}
.opr-ix-res-donde{font-size:.8125rem !important; font-weight:700 !important; color:var(--suave) !important}
.opr-ix-res-t{font-size:.9375rem !important; font-weight:700 !important; line-height:1.35 !important}
.opr-ix-res-frag{font-size:.875rem !important; line-height:1.5 !important; color:var(--suave) !important; overflow-wrap:anywhere !important}
.opr-ix-res-frag.es-cerrado{font-style:normal !important}
@media (max-width:640px){ .opr-ix-res-lista{grid-template-columns:1fr !important} }
