/* Acceso con Google o X (participación y panel): estado «Conectando…» y código de invitación. */
.acceso-puntos { display: none; align-items: center; gap: 4px; flex: 0 0 auto; }
.eval-login-boton .acceso-puntos { flex: 0 0 auto; }
.acceso-puntos i { display: block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .25; animation: acceso-punto 1.1s infinite ease-in-out; }
.acceso-puntos i:nth-child(2) { animation-delay: .15s; }
.acceso-puntos i:nth-child(3) { animation-delay: .3s; }
@keyframes acceso-punto { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
.is-conectando { cursor: progress; }
.is-conectando .acceso-puntos { display: inline-flex; }
.is-conectando .eval-login-flecha { display: none; }
.eval-login-google.is-conectando, .eval-login-google.is-conectando:disabled { background: #f4f0f8; border-color: #5b2b8a; color: #211a2c; opacity: 1; }
.eval-login-x.is-conectando, .eval-login-x.is-conectando:disabled { background: #34263e; border-color: #34263e; color: #fff; opacity: 1; }
.is-enviando .eval-login-boton:not(.is-conectando) { opacity: .5; }
@media (prefers-reduced-motion: reduce) { .acceso-puntos i { animation: none; opacity: .7; } }

.acceso-invitacion { border: 1px dashed #cac4d2; border-radius: 12px; padding: .2rem .9rem; background: #faf8fc; }
.acceso-invitacion[open] { padding-bottom: .9rem; }
.acceso-invitacion summary { cursor: pointer; padding: .6rem 0; font-size: .9rem; font-weight: 600; color: var(--mr-morado, #5b2b8a); list-style-position: inside; }
.acceso-invitacion summary i { margin-right: .35rem; }
.acceso-invitacion .form-control { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; text-transform: uppercase; }
.acceso-invitacion-ayuda { font-size: .78rem; color: #5d5467; margin: .5rem 0 0; line-height: 1.45; }

/* Panel: botones de proveedor en la pantalla de entrada. */
.panel-proveedores { display: grid; gap: .7rem; margin-bottom: 1.25rem; }
.panel-proveedores .eval-login-boton { display: flex; align-items: center; gap: .85rem; min-height: 54px; padding: .8rem 1.1rem; border-radius: 12px; font-size: .96rem; text-align: left; }
.panel-proveedores .eval-login-boton > span:first-of-type { flex: 1; }
.panel-proveedores .eval-login-google { background: #fff; border: 1px solid #cac4d2; color: #211a2c; }
.panel-proveedores .eval-login-google .fa-google { color: #1967d2; }
.panel-proveedores .eval-login-x { background: #17131b; border: 1px solid #17131b; color: #fff; }
.panel-super { margin-top: 1.5rem; border-top: 1px solid #e4dfe8; padding-top: 1rem; }
.panel-super summary { cursor: pointer; font-size: .88rem; color: #5d5467; }

/* Mi cuenta: acceso al panel. */
.cuenta-panel-tarjeta { display: flex; gap: 1rem; align-items: flex-start; padding: 1.5rem; border-radius: 18px; background: #f4f0f8; border: 1px solid #e4dfe8; margin-bottom: 1.25rem; }
.cuenta-panel-tarjeta h3 { font-family: var(--mr-sans, inherit); font-size: 1.1rem; font-weight: 700; margin: 0 0 .35rem; }
.cuenta-panel-tarjeta p { color: #5d5467; margin: 0 0 .75rem; }
.cuenta-panel-datos { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; padding: 0; list-style: none; }
.cuenta-panel-datos li { background: #fff; border: 1px solid #e4dfe8; border-radius: 999px; padding: .3rem .8rem; font-size: .85rem; }
.cuenta-panel-datos strong { font-weight: 700; }
.cuenta-invitacion-form { display: flex; flex-wrap: wrap; gap: .6rem; align-items: flex-end; }
.cuenta-invitacion-form > div { flex: 1 1 16rem; }
.cuenta-invitacion-form .form-control { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; text-transform: uppercase; }
.acceso-estado { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Mi cuenta: botón y ventana del código del panel */
.cuenta-hero .btn.cuenta-cta-codigo { color: #fff; border: 1.5px solid #ffffff8c; background: #ffffff14; font-weight: 600; }
.cuenta-hero .btn.cuenta-cta-codigo:hover, .cuenta-hero .btn.cuenta-cta-codigo:focus-visible { color: var(--mr-morado, #5b2a86); background: #fff; border-color: #fff; }
.cuenta-modal-codigo .modal-content { border-radius: 20px; border: 0; box-shadow: 0 24px 60px #2a173e33; }
.cuenta-modal-codigo .modal-title { font-weight: 700; display: flex; gap: .5rem; align-items: center; }
.cuenta-modal-codigo .modal-title i { color: var(--mr-morado, #5b2a86); }
.cuenta-codigo-campo { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .1em; text-transform: uppercase; text-align: center; }
.cmt-cuenta-nombre p { margin: 0; }

/* Despedida al cerrar sesión */
.despedida { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 2rem 1rem; background: radial-gradient(circle at 15% 10%, #efe6f7 0, transparent 45%), radial-gradient(circle at 90% 90%, #fbefdc 0, transparent 40%), var(--mr-papel, #faf8f5); }
.despedida-tarjeta { width: 100%; max-width: 36rem; text-align: center; background: #fff; border: 1px solid var(--mr-linea, #e4dfe8); border-radius: 28px; padding: clamp(1.75rem, 5vw, 3rem); box-shadow: 0 18px 40px #2a173e14; }
.despedida-tarjeta h1 { font-size: clamp(2rem, 6vw, 3rem); line-height: 1.1; letter-spacing: -.03em; margin: 0 0 1rem; }
.despedida-tarjeta h1 em { font-style: normal; color: var(--mr-morado, #5b2a86); }
.despedida-texto { color: var(--mr-piedra, #5d5467); font-size: 1.05rem; line-height: 1.6; margin: 0 auto 1.5rem; max-width: 30rem; }
.despedida-barra { height: 4px; border-radius: 999px; background: #eee8f3; overflow: hidden; margin: 0 auto .75rem; max-width: 18rem; }
.despedida-barra span { display: block; height: 100%; background: var(--mr-cempa, #d99634); transform-origin: left; animation: despedida-barra linear forwards; }
@keyframes despedida-barra { from { transform: scaleX(1); } to { transform: scaleX(0); } }
.despedida-cuenta { color: var(--mr-piedra, #5d5467); font-size: .92rem; margin: 0 0 1.5rem; }
.despedida-acciones { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.despedida-acciones .btn { flex: 1 1 13rem; }
@media (prefers-reduced-motion: reduce) { .despedida-barra span { animation: none; } }
