/* ctxd-perfil-v1.css · /profile (30-oct-2026). Todo cuelga de html[data-ctxd-ruta="profile"], que pone
   ctxd-perfil-v1.js (o ctxd-header-v1.js) en cada cambio de ruta. Solo clases Tailwind estables, nada de hashes. */

/* P1 · avatar entero, encima del banner */
html[data-ctxd-ruta="profile"] main div.h-28.relative + div.flex.flex-col.items-center{position:relative;z-index:1;margin-top:-3rem}
html[data-ctxd-ruta="profile"] main div.h-28.relative + div.flex.flex-col.items-center > div.rounded-full:first-child{
  width:96px;height:96px;font-size:2rem;border:4px solid var(--card)!important;box-sizing:border-box;
  box-shadow:0 6px 18px rgba(15,23,42,.18),0 1px 3px rgba(15,23,42,.12)}
html[data-ctxd-ruta="profile"][data-ctxd-foto] main div.h-28.relative + div.flex.flex-col.items-center > div.rounded-full:first-child{
  background:var(--ctxd-foto) center/cover no-repeat,var(--card)!important;color:transparent!important}
@media (max-width:767px){
  html[data-ctxd-ruta="profile"] main div.h-28.relative + div.flex.flex-col.items-center{margin-top:-2.5rem}
  html[data-ctxd-ruta="profile"] main div.h-28.relative + div.flex.flex-col.items-center > div.rounded-full:first-child{width:80px;height:80px;font-size:1.6rem}
}

/* P3 · «USUARIO» fuera; «Miembro desde …» si hay fecha de alta */
html[data-ctxd-ruta="profile"] main [data-ctxd-usuario] > span{display:none}
html[data-ctxd-ruta="profile"] main [data-ctxd-desde]:not([data-ctxd-desde=""])::after{
  content:attr(data-ctxd-desde);font-size:12px;font-weight:500;color:var(--text-tertiary)}

/* P3 · accesos en 2 columnas (títulos en una línea) y sin la tarjeta duplicada de tickets */
@media (min-width:640px){
  html[data-ctxd-ruta="profile"] main div.grid.grid-cols-1[class*="sm:grid-cols-3"]{grid-template-columns:repeat(2,minmax(0,1fr))}
}
html[data-ctxd-ruta="profile"] main a[data-ctxd-dup]{display:none!important}

/* P2 · sin barra flotante «Mi día» y con hueco abajo para la barra inferior y las cookies */
html[data-ctxd-ruta="profile"] .ctxd-bar{display:none!important}
@media (max-width:767px){
  html[data-ctxd-ruta="profile"] main#main{padding-bottom:calc(144px + env(safe-area-inset-bottom,0px))!important}
}

/* P4 · bloque propio: Mi día + Para ti + Mis gustos y avisos (mismo aspecto que las tarjetas de React) */
#ctxd-perfil-extra{display:grid;gap:12px}
#ctxd-perfil-extra .cpx-dos{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:640px){#ctxd-perfil-extra .cpx-dos{grid-template-columns:repeat(2,minmax(0,1fr))}}
#ctxd-perfil-extra .cpx{display:flex;align-items:center;gap:12px;width:100%;padding:16px;border-radius:16px;
  border:1px solid var(--border);background:var(--card);color:var(--fg);text-decoration:none;text-align:left;
  font:inherit;cursor:pointer;box-sizing:border-box;min-height:44px;transition:box-shadow .15s,transform .15s,border-color .15s}
#ctxd-perfil-extra .cpx:hover{box-shadow:0 4px 12px rgba(0,0,0,.08);transform:translateY(-2px)}
#ctxd-perfil-extra .cpx:focus-visible{outline:2px solid #e63946;outline-offset:2px}
#ctxd-perfil-extra .cpx-ic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:0 0 40px}
#ctxd-perfil-extra .cpx-ic svg{width:20px;height:20px}
#ctxd-perfil-extra .cpx-tx{flex:1;min-width:0}
#ctxd-perfil-extra .cpx-t{display:block;font-size:14px;font-weight:700;line-height:1.35;color:var(--fg)}
#ctxd-perfil-extra .cpx-s{display:block;font-size:11px;line-height:1.4;color:var(--text-tertiary);margin-top:1px}
#ctxd-perfil-extra .cpx-n{font-size:22px;font-weight:900;line-height:1;color:var(--fg);padding:0 4px}
#ctxd-perfil-extra .cpx-ve{font-size:13px;font-weight:600;color:#e63946;white-space:nowrap}
#ctxd-perfil-extra .cpx:hover .cpx-t{color:#e63946}
@media (prefers-reduced-motion:reduce){#ctxd-perfil-extra .cpx{transition:none}#ctxd-perfil-extra .cpx:hover{transform:none}}