/* ---------- /mi-perfil/ ---------- */
.opr-ct-perfil{background:var(--fondo) !important}

/* --- cabecera del alumno --- */
.opr-ct-perfil .opr-ct-cabeza{
  display:flex !important; align-items:center !important; gap:16px !important; flex-wrap:wrap !important;
  margin-bottom:clamp(26px,3vw,38px) !important;
}
.opr-ct-perfil .opr-ct-inicial{
  width:56px !important; height:56px !important; flex:none !important; border-radius:999px !important;
  background:var(--p950) !important; color:#fff !important; display:grid !important; place-items:center !important;
  font-size:1.375rem !important; font-weight:800 !important; letter-spacing:-.02em !important;
}
.opr-ct-perfil .opr-ct-quien{min-width:0 !important; flex:1 1 220px !important}
.opr-ct-perfil .opr-ct-quien h1{font-size:clamp(1.4rem,2.6vw,1.85rem) !important; font-weight:800 !important; letter-spacing:-.028em !important; line-height:1.15 !important}
.opr-ct-perfil .opr-ct-quien p{font-size:.9375rem !important; color:var(--suave) !important; overflow-wrap:anywhere !important}
.opr-ct-perfil .opr-ct-chip{
  display:inline-flex !important; align-items:center !important; gap:8px !important; padding:8px 15px !important; border-radius:999px !important;
  font-size:.875rem !important; font-weight:700 !important; letter-spacing:-.01em !important;
  color:var(--tinta) !important; box-shadow:inset 0 0 0 1.5px var(--borde2) !important; background:var(--superficie) !important;
}
.opr-ct-perfil .opr-ct-chip.es-sinplan{color:var(--suave) !important}
.opr-ct-perfil .opr-ct-chip i{width:8px !important; height:8px !important; border-radius:999px !important; background:var(--p400) !important; display:block !important}
.opr-ct-perfil .opr-ct-chip.es-conplan i{background:var(--ok500) !important}

/* --- pestañas --- */
.opr-ct-perfil .opr-ct-pestanas{
  display:flex !important; gap:4px !important; padding:4px !important; border-radius:999px !important; background:var(--p100) !important;
  width:max-content !important; max-width:100% !important; overflow-x:auto !important; margin-bottom:clamp(22px,2.6vw,30px) !important;
  scrollbar-width:none !important;
}
.opr-ct-perfil .opr-ct-pestanas::-webkit-scrollbar{display:none !important}
.opr-ct-perfil .opr-ct-pestanas button{
  padding:10px 18px !important; border-radius:999px !important; white-space:nowrap !important;
  font-size:.9375rem !important; font-weight:600 !important; letter-spacing:-.012em !important; color:var(--suave) !important;
  transition:color .15s ease, background .15s ease, box-shadow .15s ease !important;
}
.opr-ct-perfil .opr-ct-pestanas button:hover{color:var(--tinta) !important}
.opr-ct-perfil .opr-ct-pestanas button[aria-selected="true"]{
  background:var(--superficie) !important; color:var(--tinta) !important; font-weight:700 !important; box-shadow:var(--sombra-s) !important;
}

/* Los márgenes se ponen con clase, no con `style=""`: el reset del núcleo
   lleva !important y un estilo en línea sin él pierde. */
.opr-ct-perfil .opr-ct-sub{margin-bottom:14px !important}
.opr-ct-perfil .opr-ct-sub.es-cerca{margin-bottom:14px !important}
.opr-ct-perfil .opr-ct-sub:not(.es-cerca){margin-top:30px !important}
.opr-ct-perfil .opr-ct-sub.es-lejos{margin-top:40px !important}

/* --- paneles --- */
.opr-ct-perfil .opr-ct-tarjetas{display:grid !important; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) !important; gap:16px !important}
.opr-ct-perfil .opr-ct-tarjeta{
  background:var(--superficie) !important; border-radius:var(--radio) !important; padding:clamp(20px,2.4vw,26px) !important;
  box-shadow:inset 0 0 0 1px var(--borde), var(--sombra-s) !important;
}
.opr-ct-perfil .opr-ct-tarjeta h3{font-size:1.0625rem !important; font-weight:700 !important; letter-spacing:-.012em !important; margin-bottom:10px !important}
.opr-ct-perfil .opr-ct-tarjeta p{font-size:.9375rem !important; color:var(--suave) !important; line-height:1.55 !important}
.opr-ct-perfil .opr-ct-tarjeta .opr-btn{margin-top:18px !important}

.opr-ct-perfil .opr-ct-cifras{display:grid !important; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)) !important; gap:14px !important; margin-bottom:16px !important}
.opr-ct-perfil .opr-ct-cifra{
  background:var(--superficie) !important; border-radius:var(--radio) !important; padding:20px 22px !important;
  box-shadow:inset 0 0 0 1px var(--borde) !important;
}
.opr-ct-perfil .opr-ct-cifra b{
  display:block !important; font-size:2rem !important; font-weight:800 !important; letter-spacing:-.03em !important; line-height:1 !important;
  font-variant-numeric:tabular-nums !important;
}
.opr-ct-perfil .opr-ct-cifra span{display:block !important; margin-top:7px !important; font-size:.8125rem !important; color:var(--tenue) !important}

/* qué abre el plan */
.opr-ct-perfil .opr-ct-abre{display:flex !important; flex-direction:column !important; gap:11px !important; margin-top:16px !important}
.opr-ct-perfil .opr-ct-abre li{
  display:flex !important; align-items:center !important; gap:11px !important; font-size:.9375rem !important; color:var(--suave) !important;
  padding:11px 14px !important; border-radius:var(--radio-s) !important; background:var(--p50) !important;
}
.opr-ct-perfil .opr-ct-abre li b{color:var(--tinta) !important; font-weight:600 !important}
.opr-ct-perfil .opr-ct-abre li svg{width:18px !important; height:18px !important; flex:none !important}
.opr-ct-perfil .opr-ct-abre li.es-si svg{color:var(--ok600) !important}
.opr-ct-perfil .opr-ct-abre li.es-no svg{color:var(--p400) !important}
.opr-ct-perfil .opr-ct-abre li.es-no{color:var(--tenue) !important}

/* enlaces a la facturación de WooCommerce */
.opr-ct-perfil .opr-ct-enlaces{display:flex !important; flex-wrap:wrap !important; gap:10px !important; margin-top:18px !important}
.opr-ct-perfil .opr-ct-enlaces a{
  padding:10px 16px !important; border-radius:999px !important; font-size:.90625rem !important; font-weight:600 !important;
  color:var(--tinta) !important; box-shadow:inset 0 0 0 1.5px var(--borde2) !important; background:var(--superficie) !important;
  transition:box-shadow .15s ease, background .15s ease !important;
}
.opr-ct-perfil .opr-ct-enlaces a:hover{background:var(--p50) !important; box-shadow:inset 0 0 0 1.5px var(--p500) !important}

/* tabla de últimos simulacros */
.opr-ct-perfil .opr-ct-tabla{width:100% !important; overflow-x:auto !important; margin-top:16px !important}
.opr-ct-perfil .opr-ct-tabla table{width:100% !important; min-width:420px !important; border-collapse:collapse !important; font-size:.9375rem !important}
.opr-ct-perfil .opr-ct-tabla th{
  text-align:left !important; font-size:.8125rem !important; font-weight:600 !important; color:var(--tenue) !important;
  padding:0 12px 10px !important; border-bottom:1px solid var(--borde) !important;
}
.opr-ct-perfil .opr-ct-tabla td{padding:12px !important; border-bottom:1px solid var(--borde) !important; color:var(--suave) !important}
.opr-ct-perfil .opr-ct-tabla td b{color:var(--tinta) !important; font-variant-numeric:tabular-nums !important}

.opr-ct-perfil .opr-ct-vacio{
  padding:clamp(24px,3vw,34px) !important; text-align:center !important; border-radius:var(--radio) !important;
  background:var(--superficie) !important; box-shadow:inset 0 0 0 1px var(--borde) !important;
}
.opr-ct-perfil .opr-ct-vacio p{font-size:.9375rem !important; color:var(--suave) !important; max-width:52ch !important; margin:0 auto !important}
.opr-ct-perfil .opr-ct-vacio .opr-btn{margin-top:18px !important}

.opr-ct-perfil .opr-ct-salir{
  margin-top:clamp(28px,3.4vw,42px) !important; padding-top:22px !important; border-top:1px solid var(--borde) !important;
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px !important; flex-wrap:wrap !important;
}
.opr-ct-perfil .opr-ct-salir p{font-size:.8125rem !important; color:var(--tenue) !important}

@media (max-width:560px){
  .opr-ct-perfil .opr-ct-pestanas{width:100% !important}
}

/* --- la puerta al panel de progreso ---
   El progreso no se pinta aquí: lo hace la gamificación, en su propia página.
   Esto es solo el enlace. */
.opr-ct-perfil .opr-ct-puerta{
  display:flex !important; align-items:center !important; gap:16px !important; margin-bottom:22px !important;
  padding:18px 22px !important; border-radius:var(--radio) !important;
  background:var(--p950) !important; color:#fff !important;
  box-shadow:var(--sombra-s) !important;
  transition:background .16s ease, transform .1s ease !important;
}
.opr-ct-perfil .opr-ct-puerta:hover{background:var(--p800) !important}
.opr-ct-perfil .opr-ct-puerta:active{transform:translateY(1px) !important}
.opr-ct-perfil .opr-ct-puerta.es-pronto{background:var(--superficie) !important; color:var(--suave) !important;
  box-shadow:inset 0 0 0 1px var(--borde) !important; cursor:default !important}
.opr-ct-perfil .opr-ct-puerta.es-pronto:hover{background:var(--superficie) !important}
.opr-ct-perfil .opr-ct-puerta.es-pronto:active{transform:none !important}
.opr-ct-perfil .opr-ct-puerta-icono{
  width:42px !important; height:42px !important; flex:none !important; border-radius:12px !important; display:grid !important; place-items:center !important;
  background:rgba(255,255,255,.12) !important;
}
.opr-ct-perfil .opr-ct-puerta.es-pronto .opr-ct-puerta-icono{background:var(--p100) !important; color:var(--p500) !important}
.opr-ct-perfil .opr-ct-puerta-icono svg{width:21px !important; height:21px !important}
.opr-ct-perfil .opr-ct-puerta-texto{flex:1 1 auto !important; min-width:0 !important; font-size:.9375rem !important; line-height:1.45 !important; color:var(--p300) !important}
.opr-ct-perfil .opr-ct-puerta.es-pronto .opr-ct-puerta-texto{color:var(--tenue) !important}
.opr-ct-perfil .opr-ct-puerta-texto b{display:block !important; font-size:1.0625rem !important; font-weight:700 !important; letter-spacing:-.014em !important; color:#fff !important}
.opr-ct-perfil .opr-ct-puerta.es-pronto .opr-ct-puerta-texto b{color:var(--tinta) !important}
.opr-ct-perfil .opr-ct-puerta-flecha{flex:none !important; font-size:1.25rem !important; color:#fff !important}
.opr-ct-perfil .opr-ct-puerta-pronto{
  flex:none !important; padding:6px 13px !important; border-radius:999px !important; font-size:.8125rem !important; font-weight:700 !important;
  background:var(--p100) !important; color:var(--tenue) !important;
}

/* --- el avatar --- */
.opr-ct-perfil .opr-ct-avatar{
  width:56px !important; height:56px !important; flex:none !important; border-radius:999px !important; object-fit:cover !important;
  background:var(--p900) !important; box-shadow:inset 0 0 0 1.5px var(--borde) !important;
}
.opr-ct-perfil .opr-ct-avatares{
  display:grid !important; grid-template-columns:repeat(auto-fit,minmax(96px,1fr)) !important; gap:12px !important; margin-top:18px !important;
}
.opr-ct-perfil .opr-ct-elige{
  display:flex !important; flex-direction:column !important; align-items:center !important; gap:8px !important;
  padding:10px 6px 12px !important; border-radius:var(--radio-s) !important; background:var(--p50) !important;
  box-shadow:inset 0 0 0 1.5px transparent !important;
  transition:box-shadow .15s ease, background .15s ease, transform .1s ease !important;
}
.opr-ct-perfil .opr-ct-elige:hover{background:var(--p100) !important}
.opr-ct-perfil .opr-ct-elige:active{transform:translateY(1px) !important}
.opr-ct-perfil .opr-ct-elige img{
  width:72px !important; height:72px !important; border-radius:999px !important; object-fit:cover !important; background:var(--p900) !important;
}
.opr-ct-perfil .opr-ct-elige span{font-size:.75rem !important; font-weight:600 !important; color:var(--tenue) !important; text-align:center !important}
.opr-ct-perfil .opr-ct-elige.es-elegido{
  background:var(--superficie) !important; box-shadow:inset 0 0 0 2px var(--tinta) !important;
}
.opr-ct-perfil .opr-ct-elige.es-elegido span{color:var(--tinta) !important}
.opr-ct-perfil .opr-ct-quitar{
  margin-top:14px !important; font-size:.8125rem !important; font-weight:600 !important; color:var(--tenue) !important;
  text-decoration:underline !important; text-underline-offset:3px !important;
}
.opr-ct-perfil .opr-ct-quitar:hover{color:var(--tinta) !important}