/* Acceso y registro de Cuenta Cliente */
.auth-client-page{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:40px 18px;background:radial-gradient(circle at 10% 15%,#e8eaff,transparent 32%),radial-gradient(circle at 90% 85%,#f7eaff,transparent 30%),#f5f7fb}.auth-client-layout{width:min(1080px,100%);display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;border:1px solid #e1e5ef;border-radius:30px;background:#fff;box-shadow:0 26px 70px rgba(26,31,64,.14)}.auth-client-pitch{padding:50px 46px;background:linear-gradient(135deg,#111a4b,#4338ca 52%,#8b5cf6);color:#fff}.auth-client-pitch h1{max-width:510px;margin:18px 0 12px;font-size:clamp(2.2rem,4vw,3.75rem);line-height:1.04}.auth-client-pitch>p{max-width:500px;margin:0;color:rgba(255,255,255,.84);line-height:1.65;font-size:1.04rem}.auth-benefits{display:grid;gap:11px;margin-top:30px}.auth-benefits div,.auth-benefit-action{display:grid;grid-template-columns:40px 1fr;column-gap:11px;align-items:center;padding:13px;border:1px solid rgba(255,255,255,.16);border-radius:15px;background:rgba(255,255,255,.09);color:#fff;text-align:left;text-decoration:none;font:inherit}.auth-benefit-action{width:100%;cursor:pointer;transition:.16s}.auth-benefit-action:hover{border-color:rgba(255,255,255,.38);background:rgba(255,255,255,.14);transform:translateY(-1px)}.auth-benefits span{grid-row:1/3;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.16)}.auth-benefits strong{font-size:.88rem}.auth-benefits small{margin-top:3px;color:rgba(255,255,255,.74);font-size:.77rem}.auth-client-card{padding:45px}.auth-client-card h2{margin:13px 0 6px;color:#202b54;font-size:2rem}.auth-client-form{display:grid;gap:14px;margin-top:22px}.auth-client-form label{display:grid;gap:7px;color:#404c69;font-size:.82rem;font-weight:850}.auth-client-form input{width:100%;padding:13px 14px;border:1px solid #d9deea;border-radius:13px;background:#fff;color:#1e294d;font:inherit;outline:none}.auth-client-form input:focus{border-color:#6259e9;box-shadow:0 0 0 4px #efeeff}.auth-client-two-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.optional{color:#8791a5;font-weight:650}.auth-client-foot{margin:21px 0 0;color:#69758d;font-size:.87rem}.auth-client-foot a{color:#5146e5;font-weight:900;text-decoration:none}@media(max-width:820px){.auth-client-layout{grid-template-columns:1fr}.auth-client-pitch{padding:34px}.auth-client-card{padding:32px}.auth-client-pitch h1{font-size:2.35rem}}@media(max-width:520px){.auth-client-page{padding:18px 12px}.auth-client-pitch,.auth-client-card{padding:26px 20px}.auth-client-two-cols{grid-template-columns:1fr}.auth-client-pitch h1{font-size:2rem}}

/* Registro Cliente / Organizador */
.register-layout {
    width: min(1120px, 100%);
    grid-template-columns: .95fr 1.05fr;
}

.register-page {
    padding-block: 28px;
}

.register-page .register-pitch {
    padding: 36px 34px;
}

.register-page .register-pitch h1 {
    max-width: 440px;
    margin: 14px 0 10px;
    font-size: clamp(1.9rem, 3vw, 2.8rem);
    line-height: 1.06;
}

.register-page .register-pitch > p {
    font-size: .88rem;
    line-height: 1.5;
}

.register-page .badge {
    padding: 6px 10px;
    font-size: .75rem;
    font-weight: 600;
}

.register-page .auth-benefits {
    gap: 8px;
    margin-top: 22px;
}

.register-page .auth-benefits div,
.register-page .auth-benefit-action {
    grid-template-columns: 34px 1fr;
    column-gap: 9px;
    padding: 10px;
    border-radius: 12px;
}

.register-page .auth-benefits span {
    width: 30px;
    height: 30px;
    border-radius: 9px;
}

.register-page .auth-benefits strong {
    font-size: .8rem;
    font-weight: 650;
}

.register-page .auth-benefits small {
    font-size: .7rem;
}

.register-pitch {
    background:
            linear-gradient(135deg, rgba(17,24,39,.96), rgba(31,41,55,.92)),
            linear-gradient(135deg, #111827, #77581a);
}

.register-pitch .auth-benefits span {
    color: #fef3c7;
    font-size: .78rem;
    font-weight: 950;
}

.register-card {
    padding: 32px 36px;
}

.register-page .auth-client-card h2 {
    margin: 10px 0 5px;
    font-size: 1.6rem;
}

.register-page .auth-client-form {
    gap: 10px;
    margin-top: 16px;
}

.register-page .auth-client-form label {
    gap: 5px;
    font-size: .75rem;
    font-weight: 650;
}

.register-page .auth-client-form input {
    padding: 10px 12px;
    border-radius: 10px;
    font-size: .88rem;
}

.register-page .auth-client-two-cols {
    gap: 10px;
}

.register-page .auth-client-form .btn {
    padding: 10px 15px;
    border-radius: 11px;
    font-size: .86rem;
    font-weight: 650;
}

.register-page .auth-client-foot {
    margin-top: 16px;
    font-size: .8rem;
}

.register-switch {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    min-height: 40px;
    padding: 4px;
    border: 1px solid #dfe4ee;
    border-radius: 999px;
    background: #f7f8fb;
}

.register-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.register-switch label {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    border-radius: 999px;
    color: #5b6475;
    font-size: .76rem;
    font-weight: 650;
    cursor: pointer;
    transition: color .18s ease;
}

.switch-indicator {
    position: absolute;
    z-index: 1;
    top: 4px;
    left: 4px;
    width: calc(50% - 4px);
    height: calc(100% - 8px);
    border-radius: 999px;
    background: #111827;
    box-shadow: 0 12px 26px rgba(17,24,39,.18);
    transition: transform .22s ease, background .22s ease;
}

#clientType:checked + label,
#organizerType:checked + label {
    color: #fff;
}

.register-switch:has(#organizerType:checked) .switch-indicator,
.auth-client-form[data-account-type="organizer"] .switch-indicator {
    transform: translateX(100%);
    background: #77581a;
}

.register-heading {
    margin-top: 8px;
}

.organizer-register-fields {
    display: grid;
    gap: 9px;
    padding: 12px;
    border: 1px solid #eadfca;
    border-radius: 14px;
    background: #fffaf0;
}

.organizer-register-fields[hidden] {
    display: none;
}

.register-subsection {
    display: grid;
    gap: 4px;
}

.register-subsection strong {
    color: #77581a;
}

.register-subsection span {
    color: #6b7280;
    font-size: .75rem;
    line-height: 1.45;
}

@media(max-width:900px){
    .register-layout{grid-template-columns:1fr}
    .register-card{padding:28px}
}

@media(max-width:560px){
    .register-switch{border-radius:18px;grid-template-columns:1fr}
    .register-switch label{justify-content:flex-start;padding:0 14px}
    .switch-indicator{display:none}
    #clientType:checked + label,#organizerType:checked + label{background:#111827;color:#fff}
}

/* Modal de asistencia a puerta en login y registro */
.gate-access-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(15, 23, 42, .62);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

.gate-access-modal.active {
    display: flex;
}

.gate-access-card {
    width: min(460px, 96vw);
    overflow: hidden;
    border: 1px solid #e5e8f1;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(15, 23, 42, .34);
}

.gate-access-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px;
    border-bottom: 1px solid #edf0f6;
    background: linear-gradient(135deg, #f8f9ff, #fff);
}

.gate-access-head span {
    display: inline-flex;
    margin-bottom: 8px;
    padding: 5px 8px;
    border-radius: 999px;
    background: #eef0ff;
    color: #5146e5;
    font-size: .72rem;
    font-weight: 900;
}

.gate-access-head h2 {
    margin: 0;
    color: #202b54;
    font-size: 1.35rem;
}

.gate-access-head p {
    margin: 6px 0 0;
    color: #6b7280;
    font-size: .85rem;
    line-height: 1.45;
}

.gate-access-head button {
    align-self: flex-start;
    border: 0;
    border-radius: 10px;
    padding: 8px 10px;
    background: #f0f2f7;
    color: #3f4a66;
    font: inherit;
    font-size: .78rem;
    font-weight: 850;
    cursor: pointer;
}

.gate-access-form {
    display: grid;
    gap: 13px;
    padding: 22px;
}

.gate-access-form label {
    display: grid;
    gap: 7px;
    color: #404c69;
    font-size: .82rem;
    font-weight: 850;
}

.gate-access-form input {
    width: 100%;
    padding: 13px 14px;
    border: 1px solid #d9deea;
    border-radius: 13px;
    background: #fff;
    color: #1e294d;
    font: inherit;
    outline: none;
}

.dashboard-nav {
    background: rgba(255,255,255,.5) !important;
    border-bottom-color: rgba(229,231,235,.5);
    -webkit-backdrop-filter: blur(16px) saturate(1.08);
    backdrop-filter: blur(16px) saturate(1.08);
}

.register-nav-actions {
    gap: 8px;
}

.register-nav-actions .btn {
    padding: 8px 12px;
    border-radius: 10px;
    font-size: .82rem;
    font-weight: 400;
}

.login-nav-actions {
    gap: 8px;
}

.login-nav-actions .btn {
    padding: 7px 11px;
    border-radius: 10px;
    font-size: .76rem;
}

.login-nav-actions .btn.secondary {
    font-weight: 400;
}

.login-nav-actions .btn.primary {
    font-weight: 700;
}

/* Densidad compacta del acceso, equivalente visualmente a un 80 %. */
.login-page {
    padding-block: 28px;
}

.login-page .auth-client-layout {
    width: min(920px, 100%);
    border-radius: 24px;
}

.login-page .auth-client-pitch {
    padding: 38px 36px;
}

.login-page .auth-client-pitch h1 {
    max-width: 430px;
    margin: 14px 0 10px;
    font-size: clamp(1.85rem, 3vw, 2.8rem);
    line-height: 1.06;
}

.login-page .auth-client-pitch > p {
    font-size: .86rem;
    line-height: 1.5;
}

.login-page .badge {
    padding: 6px 10px;
    font-size: .73rem;
}

.login-page .auth-benefits {
    gap: 8px;
    margin-top: 22px;
}

.login-page .auth-benefits div,
.login-page .auth-benefit-action {
    grid-template-columns: 32px 1fr;
    column-gap: 9px;
    padding: 10px;
    border-radius: 12px;
}

.login-page .auth-benefits span {
    width: 29px;
    height: 29px;
    border-radius: 9px;
    font-size: .7rem;
}

.login-page .auth-benefits strong {
    font-size: .78rem;
}

.login-page .auth-benefits small {
    font-size: .68rem;
}

.login-page .auth-client-card {
    padding: 34px;
}

.login-page .auth-client-card h2 {
    margin: 10px 0 5px;
    font-size: 1.6rem;
}

.login-page .auth-client-card > .muted.small {
    font-size: .78rem;
}

.login-page .auth-client-form {
    gap: 10px;
    margin-top: 16px;
}

.login-page .auth-client-form label {
    gap: 5px;
    font-size: .75rem;
    font-weight: 700;
}

.login-page .auth-client-form input {
    padding: 10px 12px;
    border-radius: 10px;
    font-size: .86rem;
}

.login-page .auth-client-form .btn {
    padding: 10px 14px;
    border-radius: 11px;
    font-size: .84rem;
}

.login-page .auth-client-foot {
    margin-top: 16px;
    font-size: .78rem;
}

.login-page .demo-box {
    margin-top: 15px;
    padding: 12px;
    border-radius: 12px;
}

.login-page .demo-box h3 {
    font-size: .86rem;
}

.login-page .demo-box p {
    font-size: .72rem;
}
