/* =====================================================================
   OpoReal · Convocatorias · el listado
   =====================================================================
   Reglas de color que se respetan aquí, del documento 01: el verde, el
   rojo y el ámbar significan acierto, fallo y aviso, y no decoran. Por
   eso el estado de una convocatoria —abierta, próximamente, en proceso,
   cerrada— **no lleva color**: lleva un filete de tinta y una palabra.
   El único ámbar de esta página es el de «quedan pocos días», que sí es
   un aviso de verdad.
   ===================================================================== */
.opr-cv .opr-cv-cabeza{margin-bottom:clamp(28px,3.4vw,44px) !important}


/* --- el filtro por cuerpo --- */
.opr-cv .opr-cv-filtro{display:flex !important; flex-wrap:wrap !important; gap:10px !important; align-items:center !important}
.opr-cv .opr-cv-filtro .opr-seg{flex-wrap:wrap !important}
.opr-cv .opr-cv-filtro .opr-seg button span{
  margin-left:7px !important; font-variant-numeric:tabular-nums !important; color:var(--tenue) !important; font-weight:600 !important;
}
.opr-cv .opr-cv-filtro .opr-seg button[aria-pressed="true"] span{color:var(--suave) !important}


/* --- la rejilla --- */
.opr-cv .opr-cv-lista{
  margin-top:clamp(22px,2.6vw,32px) !important;
  display:grid !important; gap:clamp(14px,1.8vw,20px) !important;
}


/* --- una convocatoria --- */
.opr-cv .opr-cv-tarjeta{
  background:var(--superficie) !important; border:1px solid var(--borde) !important;
  border-radius:var(--radio) !important; box-shadow:var(--sombra-s) !important;
  padding:clamp(20px,2.6vw,30px) !important;
  display:grid !important; gap:18px !important;
}
.opr-cv .opr-cv-tarjeta.es-cerrada{background:var(--p50) !important; box-shadow:none !important}
.opr-cv .opr-cv-tarjeta.es-cerrada .opr-cv-titulo a{color:var(--suave) !important}
.opr-cv .opr-cv-alto{
  display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; gap:18px !important; align-items:start !important;
}
.opr-cv .opr-cv-organismo{
  display:block !important; margin-bottom:7px !important;
  font-size:.8125rem !important; font-weight:600 !important; color:var(--tenue) !important;
}
.opr-cv .opr-cv-titulo{
  font-size:clamp(1.15rem,2vw,1.4rem) !important; font-weight:800 !important;
  line-height:1.22 !important; letter-spacing:-.022em !important; text-wrap:balance !important;
}
.opr-cv .opr-cv-titulo a{color:var(--tinta) !important}
.opr-cv .opr-cv-titulo a:hover{text-decoration:underline !important; text-underline-offset:3px !important}


/* El estado: filete y palabra. Ni píldora ni punto de color. */
.opr-cv .opr-cv-estado{
  padding-left:13px !important; border-left:2.5px solid var(--tinta) !important;
  display:flex !important; flex-direction:column !important; gap:1px !important; white-space:nowrap !important;
}
.opr-cv .opr-cv-estado b{font-size:.9375rem !important; font-weight:700 !important; letter-spacing:-.012em !important}
.opr-cv .opr-cv-estado span{font-size:.75rem !important; color:var(--tenue) !important}
.opr-cv .opr-cv-estado.es-apagado{border-left-color:var(--borde2) !important}
.opr-cv .opr-cv-estado.es-apagado b{color:var(--suave) !important}


/* --- los cuatro datos --- */
/* Cinco datos desde la v1.0.14 —plazas, inscripción, BEC, físicas y
   entrevista—, y con cuatro columnas fijas el quinto se quedaba solo en una
   fila. `auto-fit` pone las que quepan: cinco en la ficha ancha, dos en un
   móvil y las que salgan en la tarjeta del listado, que es más estrecha. */
.opr-cv .opr-cv-datos{
  display:grid !important; grid-template-columns:repeat(auto-fit,minmax(132px,1fr)) !important; gap:14px !important;
  padding:16px 0 !important; border-top:1px solid var(--borde) !important; border-bottom:1px solid var(--borde) !important;
}
.opr-cv .opr-cv-dato{min-width:0 !important}
.opr-cv .opr-cv-dato dt{
  font-size:.75rem !important; font-weight:600 !important; color:var(--tenue) !important; margin-bottom:3px !important;
}
.opr-cv .opr-cv-dato dd{
  font-size:1.0625rem !important; font-weight:700 !important; letter-spacing:-.018em !important;
  font-variant-numeric:tabular-nums !important; overflow-wrap:anywhere !important;
}
.opr-cv .opr-cv-dato small{display:block !important; margin-top:2px !important; font-size:.75rem !important; font-weight:400 !important; color:var(--tenue) !important}


/* --- la marca de «estimado» ---
   Estaba solo en la hoja de la ficha, y la tarjeta del listado pinta los MISMOS
   datos con el mismo marcado: sin esta regla, «estimado» salía como texto en
   negrita pegado a la cifra —«593estimado»—, que se lee como si formara parte
   del número. Se vio el 4 de septiembre, con la 36.ª ya publicada. La regla es
   la misma que en `cv-ficha/estilo.css`: si se toca una, se tocan las dos. */
.opr-cv .opr-cv-datos .opr-cv-estimado{
  display:inline-block !important; margin-left:8px !important; vertical-align:3px !important;
  font-size:.6875rem !important; font-weight:700 !important; font-style:normal !important;
  letter-spacing:0 !important; color:var(--av600) !important; background:var(--av100) !important;
  padding:3px 9px !important; border-radius:999px !important;
}


/* --- el aviso de plazo, el único ámbar de la página --- */
.opr-cv .opr-cv-plazo{
  display:flex !important; gap:9px !important; align-items:flex-start !important;
  padding:11px 14px !important; border-radius:var(--radio-s) !important;
  background:var(--av100) !important; color:var(--av900) !important;
  font-size:.875rem !important; line-height:1.45 !important;
}
.opr-cv .opr-cv-plazo svg{width:16px !important; height:16px !important; flex:none !important; margin-top:2px !important; color:var(--av600) !important}
.opr-cv .opr-cv-resumen{font-size:.9375rem !important; color:var(--suave) !important; line-height:1.6 !important; max-width:72ch !important}
.opr-cv .opr-cv-pie{display:flex !important; flex-wrap:wrap !important; gap:10px !important; align-items:center !important}
.opr-cv .opr-cv-pie .opr-btn{padding:11px 19px !important; font-size:.9375rem !important; min-height:40px !important}

/* 40 px de alto: por debajo de 38 un dedo falla, y el arnés lo mide. */
.opr-cv .opr-cv-enlace{
  display:inline-flex !important; align-items:center !important; min-height:40px !important;
  font-size:.875rem !important; font-weight:600 !important; color:var(--suave) !important;
  padding:9px 15px !important; border-radius:999px !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
}
.opr-cv .opr-cv-enlace:hover{color:var(--tinta) !important; box-shadow:inset 0 0 0 1px var(--borde2) !important; background:var(--p50) !important}


/* --- sin resultados --- */
.opr-cv .opr-cv-vacio{
  padding:clamp(28px,4vw,48px) !important; text-align:center !important;
  border:1px dashed var(--borde2) !important; border-radius:var(--radio) !important; color:var(--suave) !important;
}
.opr-cv .opr-cv-vacio b{display:block !important; margin-bottom:6px !important; color:var(--tinta) !important; font-size:1.0625rem !important}


/* --- pie de la sección: los documentos van a Telegram --- */
.opr-cv .opr-cv-telegram{
  margin-top:clamp(26px,3vw,38px) !important; padding:clamp(18px,2.4vw,26px) !important;
  border-radius:var(--radio) !important; background:var(--p100) !important;
  display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; gap:18px !important; align-items:center !important;
}
.opr-cv .opr-cv-telegram p{font-size:.9375rem !important; color:var(--suave) !important; max-width:64ch !important}
.opr-cv .opr-cv-telegram b{color:var(--tinta) !important}


/* --- anchos --- */

@media (max-width:860px){
.opr-cv .opr-cv-datos{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
.opr-cv .opr-cv-telegram{grid-template-columns:1fr !important}
}
@media (max-width:560px){
.opr-cv .opr-cv-alto{grid-template-columns:1fr !important; gap:14px !important}
.opr-cv .opr-cv-estado{align-self:start !important}
.opr-cv .opr-cv-pie .opr-btn{width:100% !important}
}