/* =========================================================
   Mi Piano — cuenta, perfiles e instructor
   ---------------------------------------------------------
   Va DESPUÉS de dialogos.css (reutiliza .modal/.modalbox) y ANTES de
   adaptaciones.css. Ver docs/Estilos.md
   ========================================================= */
body.cuenta-on .cuentadlg{display:block}

/* botón de la cabecera: dice el estado sin abrir nada */
.hbtn.nube{gap:6px}
.hbtn.nube.dentro{border-color:var(--ok);color:#2f6b41;background:#f1f8f3}
.hbtn.nube.dentro::before{content:"●";color:var(--ok);font-size:.7rem}

/* qué mitad del diálogo se ve, según haya sesión o no */
#cuentadentro,#cuentaprofe{display:none}
body.con-cuenta #cuentafuera{display:none}
body.con-cuenta #cuentadentro{display:block}
body.con-cuenta.soy-profesor #cuentaprofe{display:block}

.aviso-adulto{background:#fdf3dd;border:1px solid #ecd9ae;border-radius:12px;
  padding:9px 12px;margin-top:12px;font-size:.8rem;line-height:1.5}
.aviso-adulto a{color:var(--gold-dk)}

.cuentacab{display:flex;gap:10px;align-items:center;justify-content:space-between;
  background:#fbf8f1;border:1px solid var(--line);border-radius:14px;
  padding:10px 13px;margin:10px 0 4px}
.cuentacab b{font-size:.92rem;word-break:break-all}

.cuentalista{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:9px}
.cuentalista .btn.on{border-color:var(--gold);background:#fdf3dd;
  box-shadow:inset 0 0 0 2px var(--gold)}

.cuentanuevo{display:flex;gap:8px}
.cuentanuevo input{flex:1;min-width:0;height:40px;padding:0 11px;font-family:inherit;
  font-size:.92rem;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:11px}
.cuentanuevo input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px #f6e6c2}
#aluerror{color:var(--red);min-height:1.1em;margin:6px 0 0}

/* invitaciones y alumnos que sigue un profesor */
.insfila{display:flex;gap:8px;align-items:center;justify-content:space-between;
  border:1px solid var(--line);border-radius:12px;padding:8px 11px;margin-top:7px;font-size:.85rem}
.insfila .estado{font-size:.74rem;padding:2px 8px;border-radius:999px}
.insfila .estado.pendiente{background:#fdf3dd;color:#8a6d1f}
.insfila .estado.activo{background:#f1f8f3;color:#2f6b41}
.insfila .estado.revocado{background:#f5f2ea;color:var(--soft)}
.insenlace{width:100%;margin-top:7px;font-size:.72rem;padding:8px 10px;
  border:1px dashed var(--line);border-radius:10px;background:#fbf8f1;
  word-break:break-all;color:var(--soft)}

.btn.peligro{color:var(--red);border-color:#f0c9c7}
.btn.peligro:hover{background:#fdf2f1;border-color:var(--red)}

/* ejercicio fuera del plan: candado en la lista */
.item.bloqueado{opacity:.55}
.item.bloqueado .num{background:#f5f2ea;color:var(--soft)}
.plancinta{display:none;background:#fdf3dd;border:1px solid #ecd9ae;border-radius:12px;
  padding:9px 13px;margin:0 0 10px;font-size:.86rem;align-items:center;gap:10px}
.plancinta.hay{display:flex}

/* ---------------------------------------------------------
   Planes y compra
   --------------------------------------------------------- */
#cuentaplanes{display:none;margin-bottom:6px}
body.hay-que-comprar #cuentaplanes{display:block}
.planes{display:flex;flex-direction:column;gap:9px}
.plan{border:1px solid var(--line);border-radius:14px;padding:13px 15px;
  display:flex;gap:12px;align-items:center}
.plan.recomendado{border-color:var(--gold);background:#fffdf7;
  box-shadow:inset 0 0 0 1px var(--gold)}
.plan .txt{flex:1;min-width:0}
.plan .tit{font-weight:700;font-size:.95rem}
.plan .que{font-size:.8rem;color:var(--soft)}
.plan .ahorro{display:inline-block;font-size:.7rem;color:#2f6b41;background:#f1f8f3;
  border-radius:999px;padding:1px 8px;margin-top:4px}
.plan .precio{font-size:1.15rem;font-weight:800;white-space:nowrap}
.plan .btn{white-space:nowrap}
.planpie{margin-top:9px;font-size:.78rem}
.plancomprado{background:#f1f8f3;border:1px solid #cde5d5;border-radius:12px;
  padding:10px 13px;font-size:.86rem;color:#2f6b41}