/* /Components/Account/Pages/ForgotPassword.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   FORGOT PASSWORD — v3 Glass Card
   ═══════════════════════════════════════════════════════════ */

.forgot-password-container[b-chgl4upvmh] {
    max-width: 460px;
    margin: 0 auto;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-radius: 16px;
    padding: 2.5rem 2.25rem 2rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
    position: relative;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.forgot-password-container[b-chgl4upvmh]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.04), transparent);
    transition: left 0.5s ease;
    pointer-events: none;
}

.forgot-password-container:hover[b-chgl4upvmh] {
    border-color: rgba(139, 92, 246, 0.25);
    box-shadow: 0 12px 32px rgba(139, 92, 246, 0.12);
}

.forgot-password-container:hover[b-chgl4upvmh]::before {
    left: 100%;
}

.forgot-header[b-chgl4upvmh] {
    text-align: center;
    margin-bottom: 2rem;
}

.forgot-header h2[b-chgl4upvmh] {
    font-size: 1.75rem;
    font-weight: 800;
    background: linear-gradient(135deg, #a78bfa 0%, #f9a8d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.35rem;
}

.forgot-header p[b-chgl4upvmh] {
    color: rgba(148, 163, 184, 0.65);
    font-size: 0.9rem;
    line-height: 1.5;
}

:deep(.form-floating > .form-control)[b-chgl4upvmh] {
    background-color: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.1);
    color: #e2e8f0;
    border-radius: var(--vapor-radius-md);
}

:deep(.form-floating > .form-control:focus)[b-chgl4upvmh] {
    background-color: rgba(15, 23, 42, 0.8);
    border-color: rgba(139, 92, 246, 0.5);
    color: #e2e8f0;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12);
}

:deep(.form-floating > label)[b-chgl4upvmh] {
    color: rgba(148, 163, 184, 0.45);
    padding-left: 1rem;
}

:deep(.form-floating > .form-control:focus ~ label)[b-chgl4upvmh],
:deep(.form-floating > .form-control:not(:placeholder-shown) ~ label)[b-chgl4upvmh] {
    color: #a78bfa;
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}

:deep(.form-floating > label::after)[b-chgl4upvmh] {
    background-color: transparent !important;
}

.btn-primary-glow[b-chgl4upvmh] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: 1px solid rgba(139, 92, 246, 0.5);
    padding: 0.85rem;
    border-radius: var(--vapor-radius-md);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    width: 100%;
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}

.btn-primary-glow[b-chgl4upvmh]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.btn-primary-glow:hover[b-chgl4upvmh] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    filter: brightness(1.08);
}

.btn-primary-glow:hover[b-chgl4upvmh]::before {
    left: 100%;
}

.bottom-links p[b-chgl4upvmh] {
    margin-bottom: 0;
}

.bottom-links a[b-chgl4upvmh] {
    text-decoration: none;
    color: rgba(148, 163, 184, 0.5);
    transition: color 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.bottom-links a:hover[b-chgl4upvmh] {
    color: #8b5cf6;
}
/* /Components/Account/Pages/Login.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   LOGIN PAGE — v3 Glass Card
   ═══════════════════════════════════════════════════════════ */

.login-form-container[b-mn22htvplj] {
    max-width: 460px;
    margin: 0 auto;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-radius: 16px;
    padding: 2.5rem 2.25rem 2rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
    position: relative;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.login-form-container[b-mn22htvplj]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.04), transparent);
    transition: left 0.5s ease;
    pointer-events: none;
}

.login-form-container:hover[b-mn22htvplj] {
    border-color: rgba(139, 92, 246, 0.25);
    box-shadow: 0 12px 32px rgba(139, 92, 246, 0.12);
}

.login-form-container:hover[b-mn22htvplj]::before {
    left: 100%;
}

.login-header[b-mn22htvplj] {
    text-align: center;
    margin-bottom: 2rem;
}

.login-header h2[b-mn22htvplj] {
    font-size: 1.75rem;
    font-weight: 800;
    background: linear-gradient(135deg, #a78bfa 0%, #f9a8d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.35rem;
}

.login-header p[b-mn22htvplj] {
    color: rgba(148, 163, 184, 0.65);
    font-size: 0.9rem;
}

/* ─── Form Inputs ────────────────────────────────────────── */

:deep(.form-floating > .form-control)[b-mn22htvplj] {
    background-color: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.1);
    color: #e2e8f0;
    border-radius: var(--vapor-radius-md);
}

:deep(.form-floating > .form-control:focus)[b-mn22htvplj] {
    background-color: rgba(15, 23, 42, 0.8);
    border-color: rgba(139, 92, 246, 0.5);
    color: #e2e8f0;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12);
}

:deep(.form-floating > label)[b-mn22htvplj] {
    color: rgba(148, 163, 184, 0.45);
    padding-left: 1rem;
}

:deep(.form-floating > .form-control:focus ~ label)[b-mn22htvplj],
:deep(.form-floating > .form-control:not(:placeholder-shown) ~ label)[b-mn22htvplj] {
    color: #a78bfa;
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}

:deep(.form-floating > label::after)[b-mn22htvplj] {
    background-color: transparent !important;
}

/* ─── Checkbox ───────────────────────────────────────────── */

.checkbox .form-check-input[b-mn22htvplj] {
    background-color: rgba(15, 23, 42, 0.6);
    border-color: rgba(148, 163, 184, 0.2);
}

.checkbox .form-check-input:checked[b-mn22htvplj] {
    background-color: #8b5cf6;
    border-color: #8b5cf6;
    box-shadow: 0 0 8px rgba(139, 92, 246, 0.3);
}

.checkbox label[b-mn22htvplj] {
    color: rgba(148, 163, 184, 0.7);
}

/* ─── Submit Button ──────────────────────────────────────── */

.btn-primary-glow[b-mn22htvplj] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: 1px solid rgba(139, 92, 246, 0.5);
    padding: 0.85rem;
    border-radius: var(--vapor-radius-md);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    width: 100%;
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}

.btn-primary-glow[b-mn22htvplj]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.btn-primary-glow:hover[b-mn22htvplj] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    filter: brightness(1.08);
}

.btn-primary-glow:hover[b-mn22htvplj]::before {
    left: 100%;
}

/* ─── Bottom Links ───────────────────────────────────────── */

.bottom-links p[b-mn22htvplj] {
    margin-bottom: 0.5rem;
    color: rgba(148, 163, 184, 0.6);
}

.bottom-links a[b-mn22htvplj] {
    text-decoration: none;
    color: rgba(148, 163, 184, 0.5);
    transition: color 0.2s;
}

.bottom-links a:hover[b-mn22htvplj] {
    color: #e2e8f0;
}

.bottom-links .highlight-link[b-mn22htvplj] {
    color: #a78bfa;
    font-weight: 600;
}
/* /Components/Account/Pages/Register.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   REGISTER PAGE — v3 Role Selection + Form
   ═══════════════════════════════════════════════════════════ */

/* ─── Selection Screen ───────────────────────────────────── */

.register-options-container[b-u36yjh4f31] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    width: 100vw;
    max-width: 720px;
    margin-left: 50%;
    transform: translateX(-50%);
}

.options-row[b-u36yjh4f31] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    width: 100%;
}

.options-col[b-u36yjh4f31] {
    display: flex;
}

/* ─── Option Card ────────────────────────────────────────── */

.register-option-card[b-u36yjh4f31] {
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-radius: 16px;
    padding: 2.5rem 2.25rem 2rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    flex: 1;
}

.register-option-card[b-u36yjh4f31]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.04), transparent);
    transition: left 0.5s ease;
    pointer-events: none;
}

.register-option-card:hover[b-u36yjh4f31] {
    border-color: rgba(139, 92, 246, 0.25);
    box-shadow: 0 12px 32px rgba(139, 92, 246, 0.12);
}

.register-option-card:hover[b-u36yjh4f31]::before {
    left: 100%;
}

/* ─── Icon ───────────────────────────────────────────────── */

.option-icon-wrapper[b-u36yjh4f31] {
    width: 72px;
    height: 72px;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.15), rgba(236, 72, 153, 0.1));
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
    transition: all 0.3s ease;
}

.register-option-card:hover .option-icon-wrapper[b-u36yjh4f31] {
    transform: scale(1.08);
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.25);
    border-color: rgba(139, 92, 246, 0.4);
}

.option-icon[b-u36yjh4f31] {
    font-size: 2rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ─── Text ───────────────────────────────────────────────── */

.option-title[b-u36yjh4f31] {
    color: #e2e8f0;
    font-size: 1.35rem;
    font-weight: 700;
    margin-bottom: 0.65rem;
}

.option-description[b-u36yjh4f31] {
    color: rgba(148, 163, 184, 0.65);
    font-size: 0.88rem;
    margin-bottom: 1.5rem;
    line-height: 1.55;
    max-width: 280px;
    flex: 1;
}

/* ─── CTA Button ─────────────────────────────────────────── */

.option-btn[b-u36yjh4f31] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: 1px solid rgba(139, 92, 246, 0.5);
    color: #fff;
    padding: 0.75rem 1.5rem;
    border-radius: var(--vapor-radius-md);
    font-weight: 600;
    font-size: 0.88rem;
    transition: all 0.25s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    position: relative;
    overflow: hidden;
    width: 100%;
}

.option-btn[b-u36yjh4f31]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.register-option-card:hover .option-btn[b-u36yjh4f31] {
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    filter: brightness(1.08);
}

.register-option-card:hover .option-btn[b-u36yjh4f31]::before {
    left: 100%;
}

/* ─── Bottom Links ───────────────────────────────────────── */

.bottom-links p[b-u36yjh4f31] {
    margin-bottom: 0;
    color: rgba(148, 163, 184, 0.6);
}

.bottom-links a[b-u36yjh4f31] {
    text-decoration: none;
    color: rgba(148, 163, 184, 0.5);
    transition: color 0.2s;
}

.bottom-links a:hover[b-u36yjh4f31] {
    color: #e2e8f0;
}

.highlight-link[b-u36yjh4f31] {
    color: #a78bfa;
    font-weight: 600;
}

/* ─── Registration Form ──────────────────────────────────── */

.register-form-container[b-u36yjh4f31] {
    max-width: 460px;
    margin: 0 auto;
}

.register-header[b-u36yjh4f31] {
    text-align: center;
    margin-bottom: 2rem;
}

.register-header h2[b-u36yjh4f31] {
    font-size: 1.75rem;
    font-weight: 800;
    background: linear-gradient(135deg, #a78bfa 0%, #f9a8d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.35rem;
}

.register-header p[b-u36yjh4f31] {
    color: rgba(148, 163, 184, 0.65);
    font-size: 0.9rem;
}

:deep(.form-floating > .form-control)[b-u36yjh4f31] {
    background-color: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.1);
    color: #e2e8f0;
    border-radius: var(--vapor-radius-md);
}

:deep(.form-floating > .form-control:focus)[b-u36yjh4f31] {
    background-color: rgba(15, 23, 42, 0.8);
    border-color: rgba(139, 92, 246, 0.5);
    color: #e2e8f0;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12);
}

:deep(.form-floating > label)[b-u36yjh4f31] {
    color: rgba(148, 163, 184, 0.45);
    padding-left: 1rem;
}

:deep(.form-floating > .form-control:focus ~ label)[b-u36yjh4f31],
:deep(.form-floating > .form-control:not(:placeholder-shown) ~ label)[b-u36yjh4f31] {
    color: #a78bfa;
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}

.btn-primary-glow[b-u36yjh4f31] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: 1px solid rgba(139, 92, 246, 0.5);
    padding: 0.85rem;
    border-radius: var(--vapor-radius-md);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    width: 100%;
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}

.btn-primary-glow[b-u36yjh4f31]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.btn-primary-glow:hover[b-u36yjh4f31] {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    filter: brightness(1.08);
}

.btn-primary-glow:hover[b-u36yjh4f31]::before {
    left: 100%;
}

.back-link[b-u36yjh4f31] {
    color: rgba(148, 163, 184, 0.6);
    text-decoration: none;
    transition: color 0.2s;
    font-size: 0.88rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1rem;
}

.back-link:hover[b-u36yjh4f31] {
    color: #8b5cf6;
}

/* ─── Responsive ─────────────────────────────────────────── */

@media (max-width: 640px) {
    .register-options-container[b-u36yjh4f31] {
        max-width: 100%;
        padding: 0 0.5rem;
    }

    .options-row[b-u36yjh4f31] {
        grid-template-columns: 1fr;
    }

    .register-option-card[b-u36yjh4f31] {
        padding: 2rem 1.5rem 1.5rem;
    }

    .option-icon-wrapper[b-u36yjh4f31] {
        width: 60px;
        height: 60px;
    }

    .option-icon[b-u36yjh4f31] {
        font-size: 1.6rem;
    }

    .option-title[b-u36yjh4f31] {
        font-size: 1.15rem;
    }

    .option-description[b-u36yjh4f31] {
        font-size: 0.82rem;
    }
}
/* /Components/Account/Pages/RegisterSpecialist.razor.rz.scp.css */
/* Vapor Theme Register Specialist Form Styles */

.register-form-container[b-g61vo6a4p9] {
    max-width: 800px;
    margin: 2rem auto;
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px);
    border-radius: 24px;
    padding: 3rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.register-header[b-g61vo6a4p9] {
    text-align: center;
    margin-bottom: 2.5rem;
}

.register-header h2[b-g61vo6a4p9] {
    font-size: 2.5rem;
    font-weight: 800;
    background: linear-gradient(135deg, var(--vapor-text-main) 0%, var(--vapor-accent) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.5rem;
    letter-spacing: -0.02em;
    text-shadow: var(--vapor-glow-cyan);
}

.register-header .subtitle[b-g61vo6a4p9] {
    color: var(--vapor-text-muted);
    font-size: 1.1rem;
}

.section-title[b-g61vo6a4p9] {
    color: var(--vapor-text-main);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 2rem 0 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.section-title i[b-g61vo6a4p9] {
    color: var(--vapor-accent);
}

.alert-info[b-g61vo6a4p9] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.2);
    color: var(--vapor-accent);
    border-radius: 12px;
}

/* Apply dark theme to standard form elements in this scope if not already global */
:deep(.form-floating > .form-control)[b-g61vo6a4p9],
:deep(.form-floating > .form-select)[b-g61vo6a4p9] {
    background-color: rgba(10, 5, 20, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--vapor-text-main);
    border-radius: 12px;
}

:deep(.form-floating > .form-control:focus)[b-g61vo6a4p9],
:deep(.form-floating > .form-select:focus)[b-g61vo6a4p9] {
    background-color: rgba(10, 5, 20, 0.8);
    border-color: var(--vapor-accent);
    color: var(--vapor-text-main);
    box-shadow: 0 0 0 4px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
}

:deep(.form-floating > label)[b-g61vo6a4p9] {
    color: var(--vapor-text-dim);
    padding-left: 1rem;
}

:deep(.form-floating > .form-control:focus ~ label)[b-g61vo6a4p9],
:deep(.form-floating > .form-control:not(:placeholder-shown) ~ label)[b-g61vo6a4p9],
:deep(.form-floating > .form-select ~ label)[b-g61vo6a4p9] {
    color: var(--vapor-accent);
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}

/* Hides the default white background label opacity issue */
:deep(.form-floating > label::after)[b-g61vo6a4p9] {
    background-color: transparent !important; 
}

/* Primary Button Style */
.btn-success-glow[b-g61vo6a4p9] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border: none;
    padding: 1rem;
    border-radius: 12px;
    color: white;
    font-weight: 700;
    letter-spacing: 0.05em;
    font-size: 1.1rem;
    text-transform: uppercase;
    width: 100%;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.btn-success-glow:hover[b-g61vo6a4p9] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(111, 66, 193, 0.3), var(--vapor-glow-pink);
    filter: brightness(1.1);
}

.bottom-links p[b-g61vo6a4p9] {
    margin-bottom: 0.5rem;
    color: var(--vapor-text-muted);
}

.bottom-links a[b-g61vo6a4p9] {
    text-decoration: none;
    color: var(--vapor-text-dim);
    transition: color 0.2s;
}

.bottom-links a:hover[b-g61vo6a4p9] {
    color: var(--vapor-text-main);
    text-shadow: var(--vapor-glow-cyan);
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
/* Modern SaaS Manage Layout Styles */

.manage-layout-wrapper[b-sum580jvrq] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.manage-container[b-sum580jvrq] {
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    padding: 2rem;
    overflow-y: auto;
    height: calc(100vh - 72px - 48px);
    margin-top: 72px;
    scrollbar-width: thin;
    scrollbar-color: rgba(148, 163, 184, 0.3) transparent;
}

.manage-container[b-sum580jvrq]::-webkit-scrollbar {
    width: 8px;
}

.manage-container[b-sum580jvrq]::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.3);
    border-radius: 4px;
}

.manage-header[b-sum580jvrq] {
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}

.manage-header h2[b-sum580jvrq] {
    color: #f1f5f9;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.manage-header p[b-sum580jvrq] {
    color: #94a3b8;
    font-size: 1.05rem;
    margin: 0;
}

.manage-content[b-sum580jvrq] {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 2.5rem;
    align-items: start;
}

.manage-sidebar[b-sum580jvrq] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    padding: 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.1);
    position: sticky;
    top: 1rem;
}

.manage-body[b-sum580jvrq] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    padding: 2.5rem;
    border: 1px solid rgba(148, 163, 184, 0.1);
    min-height: 400px;
}

[b-sum580jvrq] .manage-nav {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-sum580jvrq] .manage-nav-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 10px;
    color: #cbd5e1 !important;
    text-decoration: none !important;
    transition: all 0.2s ease;
    font-weight: 600;
    font-size: 0.95rem;
    border: 1px solid transparent;
}

[b-sum580jvrq] .manage-nav-link i {
    font-size: 1.125rem;
    color: #94a3b8;
    flex-shrink: 0;
}

[b-sum580jvrq] .manage-nav-link:hover {
    background: rgba(59, 130, 246, 0.1);
    color: #60a5fa !important;
    transform: translateX(4px);
}

[b-sum580jvrq] .manage-nav-link:hover i {
    color: #60a5fa;
}

[b-sum580jvrq] .manage-nav-link.active {
    background: rgba(59, 130, 246, 0.15);
    color: #60a5fa !important;
    border-color: rgba(59, 130, 246, 0.3);
    font-weight: 700;
}

[b-sum580jvrq] .manage-nav-link.active i {
    color: #60a5fa;
}

[b-sum580jvrq] .manage-nav-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5);
}

[b-sum580jvrq] .manage-body h3 {
    color: #f1f5f9;
    font-size: 1.75rem;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

[b-sum580jvrq] .manage-body h4 {
    color: #e2e8f0;
    font-size: 1.25rem;
    margin-bottom: 1rem;
    font-weight: 600;
}

[b-sum580jvrq] .manage-body hr {
    border-color: rgba(148, 163, 184, 0.2);
    opacity: 0.5;
    margin: 2rem 0;
}

[b-sum580jvrq] .manage-body .form-floating {
    margin-bottom: 1.5rem;
}

[b-sum580jvrq] .manage-body .form-control,
[b-sum580jvrq] .manage-body .form-select {
    background: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.2);
    color: #e2e8f0;
    padding: 1rem 1rem;
    border-radius: 8px;
    min-height: 58px;
}

[b-sum580jvrq] .manage-body .form-control:focus,
[b-sum580jvrq] .manage-body .form-select:focus {
    background: rgba(15, 23, 42, 0.8);
    border-color: rgba(59, 130, 246, 0.5);
    color: #e2e8f0;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1);
}

[b-sum580jvrq] .manage-body .form-control:disabled,
[b-sum580jvrq] .manage-body .form-control[readonly] {
    background: rgba(15, 23, 42, 0.3);
    opacity: 0.6;
    color: #94a3b8;
}

[b-sum580jvrq] .manage-body .form-label,
[b-sum580jvrq] .manage-body label {
    color: #cbd5e1;
    font-weight: 600;
    margin-bottom: 0.75rem;
    font-size: 0.95rem;
    display: block;
}

[b-sum580jvrq] .manage-body .btn-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    border: none;
    padding: 0.75rem 1.75rem;
    font-weight: 600;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

[b-sum580jvrq] .manage-body .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(59, 130, 246, 0.4);
}

[b-sum580jvrq] .manage-body .btn-primary:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5), 0 4px 12px rgba(59, 130, 246, 0.3);
}

[b-sum580jvrq] .manage-body .btn-danger {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    border: none;
    padding: 0.75rem 1.75rem;
    font-weight: 600;
    border-radius: 10px;
}

[b-sum580jvrq] .manage-body .btn-danger:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(239, 68, 68, 0.4);
}

[b-sum580jvrq] .manage-body .btn-danger:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.5), 0 4px 12px rgba(239, 68, 68, 0.3);
}

[b-sum580jvrq] .manage-body .btn-lg {
    padding: 0.875rem 2rem !important;
    font-size: 1.05rem !important;
}

[b-sum580jvrq] .manage-body .text-danger {
    color: #ef4444 !important;
}

[b-sum580jvrq] .manage-body .text-success {
    color: #10b981 !important;
}

[b-sum580jvrq] .manage-body .text-info {
    color: #60a5fa !important;
}

[b-sum580jvrq] .manage-body .text-muted {
    color: #64748b !important;
}

[b-sum580jvrq] .manage-body .alert {
    border-radius: 12px;
    border: 1px solid;
    padding: 1rem 1.25rem;
}

[b-sum580jvrq] .manage-body .alert-danger {
    background: rgba(239, 68, 68, 0.15);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, 0.3);
}

[b-sum580jvrq] .manage-body .alert-success {
    background: rgba(16, 185, 129, 0.15);
    color: #6ee7b7;
    border-color: rgba(16, 185, 129, 0.3);
}

[b-sum580jvrq] .manage-body .alert-info {
    background: rgba(59, 130, 246, 0.15);
    color: #93c5fd;
    border-color: rgba(59, 130, 246, 0.3);
}

@media (prefers-reduced-motion: reduce) {
    *[b-sum580jvrq],
    *[b-sum580jvrq]::before,
    *[b-sum580jvrq]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

@media (max-width: 992px) {
    .manage-content[b-sum580jvrq] {
        grid-template-columns: 1fr;
    }

    .manage-sidebar[b-sum580jvrq] {
        position: static;
        padding: 1rem;
    }

    [b-sum580jvrq] .manage-nav {
        flex-direction: row;
        overflow-x: auto;
        gap: 0.5rem;
        padding-bottom: 0.5rem;
        scrollbar-width: thin;
    }

    [b-sum580jvrq] .manage-nav-link {
        white-space: nowrap;
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
    }
}

@media (max-width: 768px) {
    .manage-container[b-sum580jvrq] {
        padding: 1.5rem;
    }

    .manage-body[b-sum580jvrq] {
        padding: 1.5rem;
    }

    .manage-header h2[b-sum580jvrq] {
        font-size: 1.75rem;
    }

    .manage-sidebar[b-sum580jvrq] {
        padding: 0.75rem;
    }

    [b-sum580jvrq] .manage-nav {
        gap: 0.375rem;
    }

    [b-sum580jvrq] .manage-nav-link {
        padding: 0.625rem 0.875rem;
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .manage-container[b-sum580jvrq] {
        padding: 1rem;
    }

    .manage-body[b-sum580jvrq] {
        padding: 1rem;
    }

    .manage-header h2[b-sum580jvrq] {
        font-size: 1.5rem;
    }

    .manage-header p[b-sum580jvrq] {
        font-size: 0.9rem;
    }

    .manage-sidebar[b-sum580jvrq] {
        padding: 0.5rem;
    }

    [b-sum580jvrq] .manage-nav {
        gap: 0.25rem;
    }

    [b-sum580jvrq] .manage-nav-link {
        padding: 0.5rem 0.625rem;
        font-size: 0.75rem;
        gap: 0.375rem;
    }

    [b-sum580jvrq] .manage-nav-link i {
        font-size: 0.95rem;
    }
}
/* /Components/Layout/AppFooter.razor.rz.scp.css */
/* Vapor Theme Footer Styles */

.modern-footer[b-hgzpjc2tpb] {
    background: rgba(10, 5, 20, 0.98);
    backdrop-filter: blur(20px);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 2.5rem 0 2rem;
    margin-top: auto;
}

.footer-container[b-hgzpjc2tpb] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2rem;
}

.footer-content[b-hgzpjc2tpb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
}

.footer-brand[b-hgzpjc2tpb] {
    display: flex;
    align-items: center;
}

.footer-logo[b-hgzpjc2tpb] {
    height: 2.25rem;
    width: auto;
    display: block;
    filter: drop-shadow(0 0 8px rgba(111, 66, 193, 0.3));
    transition: all 0.3s ease;
}

.footer-brand:hover .footer-logo[b-hgzpjc2tpb] {
    filter: drop-shadow(0 0 20px rgba(111, 66, 193, 0.6)) drop-shadow(0 0 40px rgba(234, 57, 184, 0.4));
}

.brand-icon-footer[b-hgzpjc2tpb] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.1rem;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.3);
}

.brand-text-footer[b-hgzpjc2tpb] {
    font-size: 1.35rem;
    font-weight: 800;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.footer-links[b-hgzpjc2tpb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}

.footer-link[b-hgzpjc2tpb] {
    color: var(--vapor-text-main) !important;
    text-decoration: none !important;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    position: relative;
}

.footer-link[b-hgzpjc2tpb]::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    transition: width 0.3s ease;
    box-shadow: var(--vapor-glow-cyan);
}

.footer-link:hover[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
    text-shadow: var(--vapor-glow-cyan);
}

.footer-link:hover[b-hgzpjc2tpb]::after {
    width: 100%;
}

.footer-link:focus-visible[b-hgzpjc2tpb] {
    outline: none;
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

.footer-link:focus-visible[b-hgzpjc2tpb]::after {
    width: 100%;
}

/* Additional high-specificity rules to override Bootstrap and NavLink styles */
footer.modern-footer nav.footer-links a.footer-link[b-hgzpjc2tpb] {
    color: var(--vapor-text-main) !important;
    text-decoration: none !important;
}

footer.modern-footer nav.footer-links a.footer-link:hover[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

footer.modern-footer nav.footer-links a.footer-link:focus-visible[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

/* Ultra-high specificity to override any NavLink or Bootstrap styles */
footer.modern-footer .footer-links > a.footer-link:not([class*="active"])[b-hgzpjc2tpb] {
    color: var(--vapor-text-main) !important;
    text-decoration: none !important;
}

footer.modern-footer .footer-links > a.footer-link:not([class*="active"]):hover[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

footer.modern-footer .footer-links > a.footer-link:not([class*="active"]):focus-visible[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

/* Override active state as well */
footer.modern-footer .footer-links > a.footer-link.active[b-hgzpjc2tpb] {
    color: var(--vapor-text-main) !important;
    text-decoration: none !important;
}

/* Most aggressive approach - target all possible NavLink states */
footer.modern-footer .footer-links a[class*="nav-link"][b-hgzpjc2tpb],
footer.modern-footer .footer-links a.nav-link[b-hgzpjc2tpb],
footer.modern-footer .footer-links .nav-link[b-hgzpjc2tpb],
footer.modern-footer .footer-links a[href][class*="footer-link"][b-hgzpjc2tpb] {
    color: var(--vapor-text-main) !important;
    text-decoration: none !important;
}

footer.modern-footer .footer-links a[class*="nav-link"]:hover[b-hgzpjc2tpb],
footer.modern-footer .footer-links a.nav-link:hover[b-hgzpjc2tpb],
footer.modern-footer .footer-links .nav-link:hover[b-hgzpjc2tpb],
footer.modern-footer .footer-links a[href][class*="footer-link"]:hover[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

footer.modern-footer .footer-links a[class*="nav-link"]:focus-visible[b-hgzpjc2tpb],
footer.modern-footer .footer-links a.nav-link:focus-visible[b-hgzpjc2tpb],
footer.modern-footer .footer-links .nav-link:focus-visible[b-hgzpjc2tpb],
footer.modern-footer .footer-links a[href][class*="footer-link"]:focus-visible[b-hgzpjc2tpb] {
    color: var(--vapor-accent) !important;
    text-decoration: none !important;
}

/* CSS Custom Properties approach - sometimes overrides !important */
footer.modern-footer .footer-links a[b-hgzpjc2tpb] {
    --bs-nav-link-color: var(--vapor-text-main) !important;
    --bs-nav-link-hover-color: var(--vapor-accent) !important;
    color: var(--bs-nav-link-color, #fff) !important;
    text-decoration: none !important;
}

footer.modern-footer .footer-links a:hover[b-hgzpjc2tpb] {
    --bs-nav-link-hover-color: var(--vapor-accent) !important;
    color: var(--bs-nav-link-hover-color, #32fbe2) !important;
    text-decoration: none !important;
}

.footer-info[b-hgzpjc2tpb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
}

.version-badge[b-hgzpjc2tpb] {
    display: inline-flex;
    align-items: center;
    padding: 0.375rem 0.875rem;
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    border-radius: 20px;
    color: var(--vapor-accent);
    font-size: 0.8rem;
    font-weight: 600;
    font-family: 'Courier New', monospace;
    box-shadow: var(--vapor-glow-cyan);
}

.no-underline[b-hgzpjc2tpb] {
    text-decoration: none !important;
}

.copyright[b-hgzpjc2tpb] {
    color: var(--vapor-text-dim);
    font-size: 0.875rem;
    font-weight: 400;
}

.scroll-to-top-btn[b-hgzpjc2tpb] {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border: none;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.4);
    transition: all 0.3s ease;
    margin-top: 1rem;
}

    .scroll-to-top-btn:hover[b-hgzpjc2tpb] {
        transform: translateY(-3px);
        box-shadow: 0 6px 16px rgba(111, 66, 193, 0.5), var(--vapor-glow-pink);
    }

    .scroll-to-top-btn:focus-visible[b-hgzpjc2tpb] {
        outline: none;
        box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5), 0 4px 12px rgba(111, 66, 193, 0.4);
    }

    .scroll-to-top-btn:active[b-hgzpjc2tpb] {
        transform: translateY(-1px);
    }

@media (prefers-reduced-motion: reduce) {
    .footer-link[b-hgzpjc2tpb]::after {
        transition: none;
    }

    .scroll-to-top-btn[b-hgzpjc2tpb] {
        transition: none;
    }
}

@media (max-width: 768px) {
    .modern-footer[b-hgzpjc2tpb] {
        padding: 2rem 0 1.5rem;
    }

    .footer-container[b-hgzpjc2tpb] {
        padding: 0 1rem;
    }

    .footer-content[b-hgzpjc2tpb] {
        gap: 1.5rem;
    }

    .footer-links[b-hgzpjc2tpb] {
        gap: 1.25rem;
        flex-direction: column;
    }

    .footer-info[b-hgzpjc2tpb] {
        gap: 0.5rem;
    }

    .copyright[b-hgzpjc2tpb] {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .modern-footer[b-hgzpjc2tpb] {
        padding: 1.5rem 0 1rem;
    }

    .footer-brand[b-hgzpjc2tpb] {
        gap: 0.5rem;
    }

    .footer-logo[b-hgzpjc2tpb] {
        height: 1.75rem;
    }

    .brand-icon-footer[b-hgzpjc2tpb] {
        width: 32px;
        height: 32px;
        font-size: 1rem;
    }

    .brand-text-footer[b-hgzpjc2tpb] {
        font-size: 1.2rem;
    }

    .footer-links[b-hgzpjc2tpb] {
        gap: 1rem;
    }

    .footer-link[b-hgzpjc2tpb] {
        font-size: 0.875rem;
    }

    .version-badge[b-hgzpjc2tpb] {
        font-size: 0.75rem;
        padding: 0.3rem 0.75rem;
    }
}
/* /Components/Layout/CompactFooter.razor.rz.scp.css */
/* Vapor Theme Compact Footer Styles */

.compact-footer[b-yihu90t73a] {
    background: rgba(10, 5, 20, 0.95);
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0.65rem 1.5rem;
    flex-shrink: 0;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 48px;
    z-index: 100;
}

.compact-footer-content[b-yihu90t73a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    max-width: 1400px;
    margin: 0 auto;
    padding-left: 0px;
    padding-right: 0px;
}

.compact-version[b-yihu90t73a] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    border-radius: 12px;
    color: var(--vapor-accent);
    font-size: 0.7rem;
    font-weight: 600;
    font-family: 'Courier New', monospace;
    box-shadow: var(--vapor-glow-cyan);
}

.compact-copyright[b-yihu90t73a] {
    color: var(--vapor-text-dim);
    font-size: 0.75rem;
    font-weight: 400;
}

@media (max-width: 900px) {
    .compact-footer[b-yihu90t73a] {
        padding: 0.5rem 1rem;
    }

    .compact-footer-content[b-yihu90t73a] {
        gap: 0.5rem;
    }

    .compact-version[b-yihu90t73a] {
        font-size: 0.65rem;
        padding: 0.2rem 0.5rem;
        margin-top: 2px;
    }

    .compact-copyright[b-yihu90t73a] {
        font-size: 0.7rem;
    }
}

@media (max-width: 480px) {
    .compact-footer[b-yihu90t73a] {
        padding: 0.6rem 0.75rem;
    }

    .compact-footer-content[b-yihu90t73a] {
        gap: 0.25rem;
        padding-left: 0px;
        padding-right: 0px;
    }

    .compact-version[b-yihu90t73a] {
        font-size: 0.6rem;
        padding: 0.15rem 0.4rem;
        margin-top: 2px;
    }

    .compact-copyright[b-yihu90t73a] {
        font-size: 0.65rem;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Vapor Theme MainLayout Styles */

.layout-wrapper[b-wgq3rc25al] {
    display: flex;
    flex-direction: column;
    min-height: 95vh;
    width: 100%;
    background: transparent; /* Handled by global body style */
}

/* Navigation Display Control */
.desktop-nav[b-wgq3rc25al] {
    display: block;
}

.tablet-nav[b-wgq3rc25al] {
    display: none;
}

.smartphone-nav[b-wgq3rc25al] {
    display: none;
}

/* Tablet: Show tablet navigation, hide desktop and smartphone navigation */
@media (min-width: 769px) and (max-width: 1024px) {
    .desktop-nav[b-wgq3rc25al] {
        display: none;
    }
    
    .tablet-nav[b-wgq3rc25al] {
        display: block;
    }
}

/* Smartphone: Show smartphone navigation, hide desktop and tablet navigation */
@media (max-width: 768px) {
    .desktop-nav[b-wgq3rc25al] {
        display: none;
    }
    
    .tablet-nav[b-wgq3rc25al] {
        display: none;
    }
    
    .smartphone-nav[b-wgq3rc25al] {
        display: block;
    }
}

.main-content[b-wgq3rc25al] {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
}

.page[b-wgq3rc25al] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-wgq3rc25al] {
    flex: 1;
}

.sidebar[b-wgq3rc25al] {
    background: transparent;
}

.top-row[b-wgq3rc25al] {
    background: rgba(10, 5, 20, 0.8);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    justify-content: flex-end;
    height: 4rem;
    display: flex;
    align-items: center;
}

.top-row[b-wgq3rc25al]  a,
.top-row[b-wgq3rc25al]  .btn-link {
    white-space: nowrap;
    margin-left: 1.5rem;
    text-decoration: none;
    color: var(--vapor-text-muted);
    transition: color 0.2s ease;
}

.top-row[b-wgq3rc25al]  a:hover,
.top-row[b-wgq3rc25al]  .btn-link:hover {
    color: var(--vapor-accent);
    text-decoration: none;
    text-shadow: var(--vapor-glow-cyan);
}

.top-row[b-wgq3rc25al]  a:focus-visible,
.top-row[b-wgq3rc25al]  .btn-link:focus-visible {
    outline: none;
    color: var(--vapor-accent);
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5);
}

.top-row[b-wgq3rc25al]  a:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 480px) {
    .top-row[b-wgq3rc25al] {
        justify-content: space-between;
        height: 3.5rem;
    }

    .top-row[b-wgq3rc25al]  a,
    .top-row[b-wgq3rc25al]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 769px) {
    .page[b-wgq3rc25al] {
        flex-direction: row;
    }

    .sidebar[b-wgq3rc25al] {
        width: 280px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-wgq3rc25al] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-wgq3rc25al]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-wgq3rc25al] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-wgq3rc25al] {
    color-scheme: dark;
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: white;
    bottom: 0;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 1rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    border-radius: 12px 12px 0 0;
    font-weight: 500;
}

#blazor-error-ui .dismiss[b-wgq3rc25al] {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-size: 1.25rem;
    transition: transform 0.2s ease;
}

#blazor-error-ui .dismiss:hover[b-wgq3rc25al] {
    transform: scale(1.2);
}

#blazor-error-ui .reload[b-wgq3rc25al] {
    color: white;
    text-decoration: underline;
    font-weight: 600;
}

#blazor-error-ui .reload:hover[b-wgq3rc25al] {
    color: #fecaca;
}
/* /Components/Layout/MainLayoutCompactFooter.razor.rz.scp.css */
/* Vapor Theme MainLayoutCompactFooter Styles */

.layout-wrapper[b-o9aifscn7a] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: transparent;
}

[b-o9aifscn7a] .desktop-nav .modern-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
}

[b-o9aifscn7a] .smartphone-nav .mobile-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
}

.main-content[b-o9aifscn7a] {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    padding-top: 4.5rem;
}

@media (max-width: 1024px) {
    .main-content[b-o9aifscn7a] {
        padding-top: 4rem;
    }
}

#blazor-error-ui[b-o9aifscn7a] {
    color-scheme: dark;
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: white;
    bottom: 0;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 1rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    border-radius: 12px 12px 0 0;
    font-weight: 500;
}

#blazor-error-ui .dismiss[b-o9aifscn7a] {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-size: 1.25rem;
    transition: transform 0.2s ease;
}

#blazor-error-ui .dismiss:hover[b-o9aifscn7a] {
    transform: scale(1.2);
}

#blazor-error-ui .reload[b-o9aifscn7a] {
    color: white;
    text-decoration: underline;
    font-weight: 600;
}

#blazor-error-ui .reload:hover[b-o9aifscn7a] {
    color: #fecaca;
}
/* /Components/Layout/MobileNavMenu.razor.rz.scp.css */
/* Vapor Theme Mobile Navigation Menu Styles - Premium Edition */

.mobile-header[b-0byk4vu5t2] {
    background: rgba(10, 5, 20, 0.95);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.mobile-header-container[b-0byk4vu5t2] {
    width: 100%;
    margin: 0 auto;
    padding: 0 1.5rem;
    box-sizing: border-box;
}

.mobile-header-content[b-0byk4vu5t2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 4rem;
    gap: 1rem;
    position: relative;
}

.brand-link[b-0byk4vu5t2] {
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: transform 0.2s ease;
    z-index: 1002;
}

.brand-link:hover[b-0byk4vu5t2] {
    transform: scale(1.05);
}

.mobile-brand-logo[b-0byk4vu5t2] {
    height: 2rem;
    width: auto;
    min-width: 100px;
    display: block;
    filter: drop-shadow(0 0 6px rgba(111, 66, 193, 0.25));
    transition: all 0.3s ease;
}

.brand-link:hover .mobile-brand-logo[b-0byk4vu5t2] {
    filter: drop-shadow(0 0 15px rgba(111, 66, 193, 0.5)) drop-shadow(0 0 30px rgba(234, 57, 184, 0.3));
}

.mobile-header-actions[b-0byk4vu5t2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

.mobile-menu-toggle[b-0byk4vu5t2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: none;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 1002;
}

.mobile-menu-toggle:hover[b-0byk4vu5t2] {
    background: rgba(50, 251, 226, 0.1);
    transform: scale(1.05);
    box-shadow: var(--vapor-glow-cyan);
}

.hamburger-container[b-0byk4vu5t2] {
    width: 24px;
    height: 20px;
    position: relative;
}

.hamburger-line[b-0byk4vu5t2] {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: linear-gradient(90deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    border-radius: 3px;
    left: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.hamburger-line:nth-child(1)[b-0byk4vu5t2] { top: 0px; }
.hamburger-line:nth-child(2)[b-0byk4vu5t2] { top: 8px; }
.hamburger-line:nth-child(3)[b-0byk4vu5t2] { top: 16px; }

.hamburger-line.line-1-active[b-0byk4vu5t2] {
    top: 8px;
    transform: rotate(135deg);
}

.hamburger-line.line-2-active[b-0byk4vu5t2] {
    opacity: 0;
    left: -30px;
}

.hamburger-line.line-3-active[b-0byk4vu5t2] {
    top: 8px;
    transform: rotate(-135deg);
}

.mobile-nav[b-0byk4vu5t2] {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    max-width: 420px;
    height: 100vh;
    height: 100dvh;
    background: linear-gradient(180deg, #0f0a1e 0%, #0a0514 100%);
    backdrop-filter: blur(30px);
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1001;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    box-shadow: -8px 0 40px rgba(0, 0, 0, 0.6);
    box-sizing: border-box;
}

.mobile-nav.show[b-0byk4vu5t2] {
    right: 0;
}

.mobile-nav-header-gradient[b-0byk4vu5t2] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 200px;
    background: linear-gradient(180deg, rgba(139, 92, 246, 0.15) 0%, rgba(50, 251, 226, 0.05) 50%, transparent 100%);
    pointer-events: none;
}

.mobile-nav-content[b-0byk4vu5t2] {
    padding: 5.5rem 1.25rem 3rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 100vh;
    min-height: 100dvh;
    box-sizing: border-box;
}

/* Use ::deep to target child components (NavLink renders its own <a> tag) */
[b-0byk4vu5t2] .mobile-nav-link,
[b-0byk4vu5t2] .mobile-nav-link:link,
[b-0byk4vu5t2] .mobile-nav-link:visited,
[b-0byk4vu5t2] a.mobile-nav-link,
[b-0byk4vu5t2] a.mobile-nav-link:link,
[b-0byk4vu5t2] a.mobile-nav-link:visited {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    padding: 1.25rem 1.5rem !important;
    font-weight: 600 !important;
    font-size: 1.15rem !important;
    color: rgba(255, 255, 255, 0.9) !important;
    text-decoration: none !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 16px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
    overflow: hidden !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
}

[b-0byk4vu5t2] .mobile-nav-link::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

[b-0byk4vu5t2] .mobile-nav-link:hover,
[b-0byk4vu5t2] .mobile-nav-link:active,
[b-0byk4vu5t2] a.mobile-nav-link:hover,
[b-0byk4vu5t2] a.mobile-nav-link:active {
    color: #fff !important;
    text-decoration: none !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(50, 251, 226, 0.3) !important;
    transform: translateX(8px) !important;
    box-shadow: 0 8px 32px rgba(50, 251, 226, 0.15) !important;
}

[b-0byk4vu5t2] .mobile-nav-link:hover::before {
    opacity: 1;
}

[b-0byk4vu5t2] .mobile-nav-link.active,
[b-0byk4vu5t2] a.mobile-nav-link.active {
    color: #fff !important;
    text-decoration: none !important;
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.15) 0%, rgba(139, 92, 246, 0.15) 100%) !important;
    border-color: rgba(50, 251, 226, 0.5) !important;
    box-shadow: 0 0 30px rgba(50, 251, 226, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
    font-weight: 700 !important;
}

[b-0byk4vu5t2] .mobile-nav-link.active::after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 60%;
    background: linear-gradient(180deg, #32fbe2 0%, #8b5cf6 100%);
    border-radius: 0 4px 4px 0;
}

.mobile-nav-divider[b-0byk4vu5t2] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(139, 92, 246, 0.3) 20%, rgba(50, 251, 226, 0.4) 50%, rgba(234, 57, 184, 0.3) 80%, transparent 100%);
    margin: 1.5rem 0;
    position: relative;
}

.mobile-nav-divider[b-0byk4vu5t2]::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 5px;
    background: linear-gradient(90deg, transparent 0%, rgba(50, 251, 226, 0.3) 50%, transparent 100%);
    filter: blur(4px);
}

.mobile-user-info[b-0byk4vu5t2] {
    padding: 1.5rem;
    margin: 0.5rem 0;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 20px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.mobile-user-name-gradient[b-0byk4vu5t2] {
    font-size: 1.1rem;
    font-weight: 700;
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.mobile-logout-form[b-0byk4vu5t2] {
    margin: 0.5rem 0 0;
}

.mobile-logout-btn[b-0byk4vu5t2] {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 1.25rem 1.5rem;
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    font-weight: 600;
    font-size: 1.15rem;
    background: linear-gradient(135deg, rgba(234, 57, 184, 0.1) 0%, rgba(239, 68, 68, 0.1) 100%);
    border: 1px solid rgba(234, 57, 184, 0.2);
    border-radius: 16px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    font-family: inherit;
    min-height: 64px;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}

.mobile-logout-btn[b-0byk4vu5t2]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(234, 57, 184, 0.2) 0%, rgba(239, 68, 68, 0.2) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.mobile-logout-btn:hover[b-0byk4vu5t2] {
    color: #fff;
    background: linear-gradient(135deg, rgba(234, 57, 184, 0.2) 0%, rgba(239, 68, 68, 0.2) 100%);
    border-color: rgba(234, 57, 184, 0.5);
    transform: translateX(8px);
    box-shadow: 0 8px 32px rgba(234, 57, 184, 0.25);
}

.mobile-logout-btn:hover[b-0byk4vu5t2]::before {
    opacity: 1;
}

[b-0byk4vu5t2] .mobile-login-link,
[b-0byk4vu5t2] .mobile-login-link:link,
[b-0byk4vu5t2] .mobile-login-link:visited,
[b-0byk4vu5t2] a.mobile-login-link,
[b-0byk4vu5t2] a.mobile-login-link:link,
[b-0byk4vu5t2] a.mobile-login-link:visited {
    background: rgba(255, 255, 255, 0.02) !important;
    border-color: rgba(255, 255, 255, 0.04) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

[b-0byk4vu5t2] .mobile-login-link:hover,
[b-0byk4vu5t2] .mobile-login-link:active,
[b-0byk4vu5t2] a.mobile-login-link:hover,
[b-0byk4vu5t2] a.mobile-login-link:active {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

[b-0byk4vu5t2] .mobile-signup-link,
[b-0byk4vu5t2] .mobile-signup-link:link,
[b-0byk4vu5t2] .mobile-signup-link:visited,
[b-0byk4vu5t2] a.mobile-signup-link,
[b-0byk4vu5t2] a.mobile-signup-link:link,
[b-0byk4vu5t2] a.mobile-signup-link:visited {
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%) !important;
    border-color: rgba(50, 251, 226, 0.3) !important;
    font-weight: 700 !important;
    color: #fff !important;
}

[b-0byk4vu5t2] .mobile-signup-link:hover,
[b-0byk4vu5t2] .mobile-signup-link:active,
[b-0byk4vu5t2] a.mobile-signup-link:hover,
[b-0byk4vu5t2] a.mobile-signup-link:active {
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(139, 92, 246, 0.2) 100%) !important;
    border-color: rgba(50, 251, 226, 0.5) !important;
}

.mobile-nav-overlay[b-0byk4vu5t2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    width: 100dvw;
    height: 100vh;
    height: 100dvh;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(8px);
    z-index: 1000;
    opacity: 0;
    animation: fadeIn-b-0byk4vu5t2 0.3s ease forwards;
    overscroll-behavior: contain;
}

@keyframes fadeIn-b-0byk4vu5t2 {
    to { opacity: 1; }
}

@media (min-width: 769px) {
    .mobile-header[b-0byk4vu5t2] {
        display: none;
    }
}

@media (max-width: 1024px) {
    .mobile-header[b-0byk4vu5t2] {
        display: block;
    }
}

@media (max-width: 480px) {
    .mobile-header-container[b-0byk4vu5t2] {
        padding: 0 1rem;
    }

    .mobile-brand-logo[b-0byk4vu5t2] {
        height: 1.75rem;
        min-width: 85px;
    }

    [b-0byk4vu5t2] .mobile-nav-link,
    [b-0byk4vu5t2] a.mobile-nav-link,
    .mobile-logout-btn[b-0byk4vu5t2] {
        padding: 1.1rem 1.25rem !important;
        font-size: 1.1rem !important;
        min-height: 56px !important;
    }

    .mobile-nav-content[b-0byk4vu5t2] {
        padding: 5rem 1rem 2rem;
    }
}

@media (max-width: 380px) {
    .mobile-brand-logo[b-0byk4vu5t2] {
        height: 1.5rem;
        min-width: 75px;
    }

    [b-0byk4vu5t2] .mobile-nav-link,
    [b-0byk4vu5t2] a.mobile-nav-link,
    .mobile-logout-btn[b-0byk4vu5t2] {
        padding: 1rem 1.1rem !important;
        font-size: 1rem !important;
        min-height: 52px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *[b-0byk4vu5t2],
    *[b-0byk4vu5t2]::before,
    *[b-0byk4vu5t2]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Vapor Theme Navigation Menu Styles */

.modern-header[b-tbar12g86p] {
    background: rgba(10, 5, 20, 0.8);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.header-container[b-tbar12g86p] {
    width: 100%;
    margin: 0 auto;
    padding: 0 2rem;
    box-sizing: border-box;
}

.header-content[b-tbar12g86p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 4.5rem;
    gap: 1rem;
}

.brand-link[b-tbar12g86p] {
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: transform 0.2s ease;
    padding: 0.5rem 0;
}

.brand-link:hover[b-tbar12g86p] {
    transform: scale(1.05);
}

.brand-logo[b-tbar12g86p] {
    height: 2.25rem;
    width: auto;
    display: block;
    filter: drop-shadow(0 0 8px rgba(111, 66, 193, 0.3));
    transition: all 0.3s ease;
}

.brand-link:hover .brand-logo[b-tbar12g86p] {
    filter: drop-shadow(0 0 20px rgba(111, 66, 193, 0.6)) drop-shadow(0 0 40px rgba(234, 57, 184, 0.4));
}

.brand-icon[b-tbar12g86p] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.25rem;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.3);
}

.brand-text[b-tbar12g86p] {
    font-size: 1.5rem;
    font-weight: 800;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.main-nav[b-tbar12g86p] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 1;
}

.main-nav[b-tbar12g86p]  .nav-link,
.main-nav[b-tbar12g86p]  a.nav-link {
    display: flex;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    color: var(--vapor-text-muted);
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s ease;
    letter-spacing: 0.01em;
}

.main-nav[b-tbar12g86p]  .nav-link:hover,
.main-nav[b-tbar12g86p]  a.nav-link:hover {
    color: var(--vapor-text-main);
    transform: translateY(-1px);
    text-shadow: var(--vapor-glow-cyan);
}

.main-nav[b-tbar12g86p]  .nav-link.active,
.main-nav[b-tbar12g86p]  a.nav-link.active {
    color: var(--vapor-text-main) !important;
    font-weight: 900 !important;
    text-shadow: 0 0 30px rgba(50, 251, 226, 0.8),
                 0 0 60px rgba(234, 57, 184, 0.6),
                 0 0 90px rgba(50, 251, 226, 0.4);
    background: transparent;
    border: none;
}

.main-nav[b-tbar12g86p]  .nav-link:focus-visible,
.main-nav[b-tbar12g86p]  a.nav-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5);
}

.header-actions[b-tbar12g86p] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.user-menu[b-tbar12g86p] {
    position: relative;
}

.user-button[b-tbar12g86p] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--vapor-text-main);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.9rem;
}

.user-button:hover[b-tbar12g86p] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(50, 251, 226, 0.4);
    box-shadow: var(--vapor-glow-cyan);
}

.user-button:focus-visible[b-tbar12g86p] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5);
}

.user-avatar[b-tbar12g86p] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.25rem;
}

.user-name[b-tbar12g86p] {
    font-weight: 500;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dropdown-menu[b-tbar12g86p] {
    background: rgba(10, 5, 20, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    margin-top: 0.5rem;
    min-width: 200px;
    right: 0;
    left: auto;
    --bs-dropdown-link-color: var(--vapor-text-main);
    --bs-dropdown-link-hover-color: var(--vapor-accent);
    --bs-dropdown-link-active-color: var(--vapor-accent);
}

.dropdown-item[b-tbar12g86p],
[b-tbar12g86p] .dropdown-item,
[b-tbar12g86p] a.dropdown-item,
[b-tbar12g86p] a.dropdown-item:link,
[b-tbar12g86p] a.dropdown-item:visited {
    color: rgba(255, 255, 255, 0.9) !important;
    padding: 0.75rem 1.25rem;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    text-decoration: none !important;
    background: transparent !important;
    border-radius: 8px;
    margin: 0 0.5rem;
    width: calc(100% - 1rem);
}

.dropdown-item:hover[b-tbar12g86p],
[b-tbar12g86p] .dropdown-item:hover,
[b-tbar12g86p] a.dropdown-item:hover {
    background: rgba(111, 66, 193, 0.2) !important;
    color: #fff !important;
    text-shadow: 0 0 10px rgba(111, 66, 193, 0.5);
    border-radius: 8px;
}

.dropdown-item:focus-visible[b-tbar12g86p],
[b-tbar12g86p] .dropdown-item:focus-visible,
[b-tbar12g86p] a.dropdown-item:focus-visible {
    outline: none;
    background: rgba(111, 66, 193, 0.25) !important;
    color: #fff !important;
    box-shadow: 0 0 0 2px rgba(111, 66, 193, 0.4);
    border-radius: 8px;
}

.dropdown-item:active[b-tbar12g86p],
[b-tbar12g86p] .dropdown-item:active,
[b-tbar12g86p] a.dropdown-item:active {
    background: rgba(111, 66, 193, 0.35) !important;
    color: #fff !important;
}

.dropdown-divider[b-tbar12g86p] {
    border-color: rgba(255, 255, 255, 0.08);
    margin: 0.5rem 0;
}

.auth-buttons[b-tbar12g86p] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-login[b-tbar12g86p] {
    padding: 0.625rem 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    background: transparent;
    color: var(--vapor-text-muted);
    text-decoration: none;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    display: inline-block;
}

.btn-login:hover[b-tbar12g86p] {
    background: rgba(255, 255, 255, 0.05);
    border-color: var(--vapor-accent);
    color: var(--vapor-accent);
    box-shadow: var(--vapor-glow-cyan);
}

.btn-login:focus-visible[b-tbar12g86p] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5);
}

.btn-signup[b-tbar12g86p] {
    padding: 0.625rem 1.25rem;
    border: none;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    display: inline-block;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.3);
}

.btn-signup:hover[b-tbar12g86p] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.btn-signup:focus-visible[b-tbar12g86p] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5), 0 4px 12px rgba(111, 66, 193, 0.3);
}

@media (prefers-reduced-motion: reduce) {
    *[b-tbar12g86p],
    *[b-tbar12g86p]::before,
    *[b-tbar12g86p]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* Hide desktop navigation on tablet and mobile screens */
@media (max-width: 1024px) {
    .modern-header[b-tbar12g86p] {
        display: none;
    }
}

@media (max-width: 768px) {
    .header-container[b-tbar12g86p] {
        padding: 0 1rem;
    }

    .header-content[b-tbar12g86p] {
        height: 3.5rem;
        gap: 1rem;
    }

    .brand-logo[b-tbar12g86p] {
        height: 2rem;
        filter: drop-shadow(0 0 6px rgba(111, 66, 193, 0.25));
    }

    .brand-icon[b-tbar12g86p] {
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
    }

    .brand-text[b-tbar12g86p] {
        font-size: 1.25rem;
    }

    .main-nav[b-tbar12g86p] {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: rgba(10, 5, 20, 0.98);
        backdrop-filter: blur(20px);
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        flex-direction: column;
        padding: 1rem;
        gap: 0.5rem;
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    }

    .main-nav.show[b-tbar12g86p] {
        display: flex;
    }

    .main-nav .nav-link[b-tbar12g86p] {
        width: 100%;
        justify-content: flex-start;
        padding: 0.875rem 1rem;
    }

    .user-name[b-tbar12g86p] {
        display: none;
    }

    .user-button[b-tbar12g86p] {
        padding: 0.5rem;
    }

    .auth-buttons[b-tbar12g86p] {
        gap: 0.5rem;
    }

    .btn-login[b-tbar12g86p],
    .btn-signup[b-tbar12g86p] {
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
    }
}

@media (max-width: 480px) {
    .header-content[b-tbar12g86p] {
        gap: 0.5rem;
    }

    .brand-logo[b-tbar12g86p] {
        height: 1.75rem;
    }

    .brand-text[b-tbar12g86p] {
        font-size: 1.1rem;
    }

    .btn-login[b-tbar12g86p] {
        display: none;
    }
}
/* /Components/Layout/SessionLayout.razor.rz.scp.css */
/* Vapor Theme Session Layout Styles */

.session-layout[b-1yrk8di6yj] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent; /* Handled by global body style */
    padding: 2rem;
    position: relative;
}

.session-layout[b-1yrk8di6yj]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, rgba(111, 66, 193, 0.1) 0%, transparent 70%);
    pointer-events: none;
}

.session-container[b-1yrk8di6yj] {
    width: 100%;
    max-width: 480px;
    background: transparent;
    padding: 3rem;
    position: relative;
    z-index: 1;
}

.session-brand[b-1yrk8di6yj] {
    text-align: center;
    margin-bottom: 2.5rem;
}

.session-logo[b-1yrk8di6yj] {
    height: 3rem;
    width: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 0 12px rgba(111, 66, 193, 0.4)) drop-shadow(0 0 24px rgba(234, 57, 184, 0.3));
    transition: all 0.3s ease;
}

.session-logo:hover[b-1yrk8di6yj] {
    filter: drop-shadow(0 0 20px rgba(111, 66, 193, 0.6)) drop-shadow(0 0 40px rgba(234, 57, 184, 0.4));
}

@keyframes float-b-1yrk8di6yj {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

.session-brand i[b-1yrk8di6yj] {
    font-size: 4rem;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1rem;
    display: block;
    animation: float-b-1yrk8di6yj 3s ease-in-out infinite;
    text-shadow: var(--vapor-glow-pink);
}

.session-brand h1[b-1yrk8di6yj] {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    margin-bottom: 0.5rem;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.session-brand p[b-1yrk8di6yj] {
    color: var(--vapor-text-muted);
    font-size: 0.95rem;
    margin: 0;
}

.session-content[b-1yrk8di6yj] {
    margin-bottom: 2rem;
}

.session-content h1[b-1yrk8di6yj],
.session-content h2[b-1yrk8di6yj] {
    color: var(--vapor-text-main);
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    text-align: center;
}

.session-content hr[b-1yrk8di6yj] {
    border-color: rgba(255, 255, 255, 0.1);
    opacity: 0.5;
    margin: 1.5rem 0;
}

.session-content .form-floating[b-1yrk8di6yj] {
    margin-bottom: 1.25rem;
}

.session-content .form-control[b-1yrk8di6yj],
.session-content .form-select[b-1yrk8di6yj] {
    background: rgba(10, 5, 20, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--vapor-text-main);
    padding: 0.875rem 1rem;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.session-content .form-control:focus[b-1yrk8di6yj],
.session-content .form-select:focus[b-1yrk8di6yj] {
    background: rgba(10, 5, 20, 0.8);
    border-color: var(--vapor-accent);
    color: var(--vapor-text-main);
    box-shadow: 0 0 0 4px rgba(50, 251, 226, 0.1);
}

.session-content .form-control:disabled[b-1yrk8di6yj],
.session-content .form-control[readonly][b-1yrk8di6yj],
.session-content .form-select:disabled[b-1yrk8di6yj] {
    background: rgba(10, 5, 20, 0.3);
    color: var(--vapor-text-dim);
    opacity: 0.6;
    cursor: not-allowed;
}

.session-content .form-control[b-1yrk8di6yj]::placeholder {
    color: var(--vapor-text-dim);
}

.session-content .form-label[b-1yrk8di6yj],
.session-content label[b-1yrk8di6yj] {
    color: var(--vapor-text-muted);
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.session-content .form-check-label[b-1yrk8di6yj] {
    color: var(--vapor-text-muted);
    font-weight: 400;
}

.session-content .form-check-input[b-1yrk8di6yj] {
    background-color: rgba(10, 5, 20, 0.6);
    border-color: rgba(255, 255, 255, 0.2);
}

.session-content .form-check-input:checked[b-1yrk8di6yj] {
    background-color: var(--vapor-primary);
    border-color: var(--vapor-primary);
    box-shadow: var(--vapor-glow-pink);
}

.session-content .form-check-input:focus[b-1yrk8di6yj] {
    box-shadow: 0 0 0 3px rgba(111, 66, 193, 0.2);
}

.session-content .btn-primary[b-1yrk8di6yj] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border: none;
    padding: 0.875rem 1.5rem;
    font-weight: 700;
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.3);
    transition: all 0.3s ease;
    color: white;
}

.session-content .btn-primary:hover[b-1yrk8di6yj] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.session-content .btn-primary:focus-visible[b-1yrk8di6yj] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5), 0 4px 12px rgba(111, 66, 193, 0.3);
}

.session-content .text-danger[b-1yrk8di6yj] {
    color: #ef4444 !important;
}

.session-content .validation-message[b-1yrk8di6yj] {
    color: #ef4444;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

.session-content a[b-1yrk8di6yj] {
    color: var(--vapor-accent);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.session-content a:hover[b-1yrk8di6yj] {
    color: var(--vapor-primary);
    text-decoration: underline;
    text-shadow: var(--vapor-glow-cyan);
}

.session-content a:focus-visible[b-1yrk8di6yj] {
    outline: 2px solid var(--vapor-accent);
    outline-offset: 2px;
}

.session-footer[b-1yrk8di6yj] {
    text-align: center;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.session-footer small[b-1yrk8di6yj] {
    color: var(--vapor-text-dim);
    font-size: 0.875rem;
}

#blazor-error-ui[b-1yrk8di6yj] {
    color-scheme: dark;
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: white;
    bottom: 0;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3);
    display: none;
    left: 0;
    padding: 1rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    border-radius: 12px 12px 0 0;
}

#blazor-error-ui .dismiss[b-1yrk8di6yj] {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    top: 1rem;
}

#blazor-error-ui .dismiss:focus-visible[b-1yrk8di6yj] {
    outline: 2px solid white;
    outline-offset: 2px;
}

#blazor-error-ui .reload[b-1yrk8di6yj] {
    color: white;
    text-decoration: underline;
}

#blazor-error-ui .reload:focus-visible[b-1yrk8di6yj] {
    outline: 2px solid white;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    *[b-1yrk8di6yj],
    *[b-1yrk8di6yj]::before,
    *[b-1yrk8di6yj]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
    
    .session-brand i[b-1yrk8di6yj] {
        animation: none !important;
    }
}

@media (max-width: 768px) {
    .session-layout[b-1yrk8di6yj] {
        padding: 1.5rem;
    }

    .session-container[b-1yrk8di6yj] {
        padding: 2rem;
    }

    .session-logo[b-1yrk8di6yj] {
        height: 2.75rem;
    }

    .session-brand i[b-1yrk8di6yj] {
        font-size: 3rem;
    }

    .session-brand h1[b-1yrk8di6yj] {
        font-size: 2rem;
    }

    .session-content h1[b-1yrk8di6yj],
    .session-content h2[b-1yrk8di6yj] {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .session-layout[b-1yrk8di6yj] {
        padding: 1rem;
    }

    .session-container[b-1yrk8di6yj] {
        padding: 1.5rem;
        max-width: 100%;
    }

    .session-brand[b-1yrk8di6yj] {
        margin-bottom: 2rem;
    }

    .session-logo[b-1yrk8di6yj] {
        height: 2.25rem;
    }

    .session-brand i[b-1yrk8di6yj] {
        font-size: 2.5rem;
    }

    .session-brand h1[b-1yrk8di6yj] {
        font-size: 1.75rem;
    }

    .session-brand p[b-1yrk8di6yj] {
        font-size: 0.875rem;
    }

    .session-content h1[b-1yrk8di6yj],
    .session-content h2[b-1yrk8di6yj] {
        font-size: 1.25rem;
    }

    .session-content .form-control[b-1yrk8di6yj],
    .session-content .form-select[b-1yrk8di6yj] {
        font-size: 0.9rem;
    }

    .session-content .btn-primary[b-1yrk8di6yj] {
        padding: 0.75rem 1.25rem;
    }
}
/* /Components/Pages/AceptarTerminos.razor.rz.scp.css */
/* ============================================================
   AceptarTerminos — Terms Acceptance Gate
   Vapor dark theme: purple/pink/cyan glassmorphism
   ============================================================ */

.accept-terms-wrapper[b-ks3dx920o3] {
    min-height: 100vh;
    background: linear-gradient(135deg, #0a0614 0%, #0f0a1e 40%, #0d1117 100%);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2rem 1rem 4rem;
    position: relative;
    overflow: hidden;
}

/* Animated background orbs */
.bg-orb[b-ks3dx920o3] {
    position: fixed;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.12;
    pointer-events: none;
    animation: orbFloat-b-ks3dx920o3 12s ease-in-out infinite;
}

.bg-orb-1[b-ks3dx920o3] {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, #8b5cf6, #6d28d9);
    top: -100px;
    left: -150px;
    animation-delay: 0s;
}

.bg-orb-2[b-ks3dx920o3] {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, #ec4899, #be185d);
    top: 30%;
    right: -100px;
    animation-delay: -4s;
}

.bg-orb-3[b-ks3dx920o3] {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, #06b6d4, #0891b2);
    bottom: 10%;
    left: 20%;
    animation-delay: -8s;
}

@keyframes orbFloat-b-ks3dx920o3 {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-30px) scale(1.05); }
}

/* Container */
.accept-terms-container[b-ks3dx920o3] {
    width: 100%;
    max-width: 720px;
    position: relative;
    z-index: 1;
}

/* Hero */
.accept-hero[b-ks3dx920o3] {
    text-align: center;
    margin-bottom: 2rem;
    padding-top: 1rem;
}

.accept-hero-icon[b-ks3dx920o3] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 50%, #06b6d4 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
    margin: 0 auto 1.25rem;
    box-shadow: 0 0 40px rgba(139, 92, 246, 0.4), 0 0 80px rgba(236, 72, 153, 0.2);
    animation: heroGlow-b-ks3dx920o3 3s ease-in-out infinite alternate;
}

@keyframes heroGlow-b-ks3dx920o3 {
    from { box-shadow: 0 0 30px rgba(139, 92, 246, 0.4), 0 0 60px rgba(236, 72, 153, 0.15); }
    to   { box-shadow: 0 0 50px rgba(139, 92, 246, 0.6), 0 0 100px rgba(236, 72, 153, 0.3); }
}

.accept-hero-title[b-ks3dx920o3] {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 800;
    color: #f1f5f9;
    margin-bottom: 0.75rem;
    letter-spacing: -0.02em;
}

.gradient-text[b-ks3dx920o3] {
    background: linear-gradient(135deg, #a78bfa 0%, #f472b6 50%, #67e8f9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.accept-hero-subtitle[b-ks3dx920o3] {
    color: #94a3b8;
    font-size: 1rem;
    line-height: 1.6;
    max-width: 520px;
    margin: 0 auto;
}

/* Error banner */
.accept-error-banner[b-ks3dx920o3] {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    color: #fca5a5;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}

/* Glass card */
.accept-glass-card[b-ks3dx920o3] {
    background: rgba(15, 10, 30, 0.7);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 1.5rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.accept-card-header[b-ks3dx920o3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.15) 0%, rgba(236, 72, 153, 0.1) 100%);
    border-bottom: 1px solid rgba(139, 92, 246, 0.15);
}

.accept-card-header i[b-ks3dx920o3] {
    font-size: 1.25rem;
    color: #a78bfa;
}

.accept-card-header h2[b-ks3dx920o3] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0;
}

.accept-terms-scroll[b-ks3dx920o3] {
    padding: 1.5rem;
    max-height: 420px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(139, 92, 246, 0.4) transparent;
}

.accept-terms-scroll[b-ks3dx920o3]::-webkit-scrollbar {
    width: 4px;
}

.accept-terms-scroll[b-ks3dx920o3]::-webkit-scrollbar-track {
    background: transparent;
}

.accept-terms-scroll[b-ks3dx920o3]::-webkit-scrollbar-thumb {
    background: rgba(139, 92, 246, 0.4);
    border-radius: 2px;
}

/* Urgent alert */
.accept-alert[b-ks3dx920o3] {
    display: flex;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
}

.accept-alert-urgent[b-ks3dx920o3] {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.25);
    color: #fcd34d;
}

.accept-alert-urgent i[b-ks3dx920o3] {
    font-size: 1.25rem;
    color: #f59e0b;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.accept-alert-urgent strong[b-ks3dx920o3] {
    display: block;
    color: #fbbf24;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
}

.accept-alert-urgent p[b-ks3dx920o3] {
    margin: 0;
    color: #fcd34d;
}

/* Points grid */
.accept-points-grid[b-ks3dx920o3] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.accept-point[b-ks3dx920o3] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.accept-point-icon[b-ks3dx920o3] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.icon-purple[b-ks3dx920o3] {
    background: rgba(139, 92, 246, 0.2);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.icon-cyan[b-ks3dx920o3] {
    background: rgba(6, 182, 212, 0.15);
    color: #67e8f9;
    border: 1px solid rgba(6, 182, 212, 0.25);
}

.icon-pink[b-ks3dx920o3] {
    background: rgba(236, 72, 153, 0.15);
    color: #f9a8d4;
    border: 1px solid rgba(236, 72, 153, 0.25);
}

.icon-green[b-ks3dx920o3] {
    background: rgba(16, 185, 129, 0.15);
    color: #6ee7b7;
    border: 1px solid rgba(16, 185, 129, 0.25);
}

.accept-point-content h4[b-ks3dx920o3] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0 0 0.35rem;
}

.accept-point-content p[b-ks3dx920o3] {
    font-size: 0.825rem;
    color: #94a3b8;
    margin: 0;
    line-height: 1.55;
}

.accept-link[b-ks3dx920o3] {
    color: #a78bfa;
    text-decoration: none;
    border-bottom: 1px solid rgba(167, 139, 250, 0.3);
    transition: color 0.2s, border-color 0.2s;
}

.accept-link:hover[b-ks3dx920o3] {
    color: #c4b5fd;
    border-bottom-color: rgba(196, 181, 253, 0.6);
}

/* Doc links */
.accept-doc-links[b-ks3dx920o3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
}

.accept-doc-link[b-ks3dx920o3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: rgba(139, 92, 246, 0.1);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 8px;
    color: #a78bfa;
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
}

.accept-doc-link:hover[b-ks3dx920o3] {
    background: rgba(139, 92, 246, 0.2);
    border-color: rgba(139, 92, 246, 0.4);
    color: #c4b5fd;
    transform: translateY(-1px);
}

/* Checkbox */
.accept-checkbox-wrapper[b-ks3dx920o3] {
    margin-bottom: 1.5rem;
}

.accept-checkbox-label[b-ks3dx920o3] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    background: rgba(15, 10, 30, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.25s ease;
    user-select: none;
}

.accept-checkbox-label.is-checked[b-ks3dx920o3] {
    background: rgba(139, 92, 246, 0.08);
    border-color: rgba(139, 92, 246, 0.35);
    box-shadow: 0 0 20px rgba(139, 92, 246, 0.1);
}

.accept-checkbox-label:hover[b-ks3dx920o3] {
    border-color: rgba(139, 92, 246, 0.25);
    background: rgba(139, 92, 246, 0.05);
}

/* Hide native checkbox */
.accept-checkbox-input[b-ks3dx920o3] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.accept-checkbox-custom[b-ks3dx920o3] {
    width: 24px;
    height: 24px;
    min-width: 24px;
    border-radius: 6px;
    border: 2px solid rgba(139, 92, 246, 0.4);
    background: rgba(139, 92, 246, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    color: #a78bfa;
    transition: all 0.2s ease;
    margin-top: 0.1rem;
}

.accept-checkbox-label.is-checked .accept-checkbox-custom[b-ks3dx920o3] {
    background: linear-gradient(135deg, #8b5cf6, #ec4899);
    border-color: transparent;
    color: white;
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.5);
}

.accept-checkbox-text[b-ks3dx920o3] {
    font-size: 0.875rem;
    color: #cbd5e1;
    line-height: 1.6;
}

/* Action area */
.accept-action-area[b-ks3dx920o3] {
    text-align: center;
}

.accept-btn[b-ks3dx920o3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 50%, #06b6d4 100%);
    background-size: 200% 200%;
    border: none;
    border-radius: 14px;
    color: white;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 20px rgba(139, 92, 246, 0.4);
    animation: gradientShift-b-ks3dx920o3 4s ease infinite;
    letter-spacing: 0.01em;
}

@keyframes gradientShift-b-ks3dx920o3 {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.accept-btn:hover:not(:disabled)[b-ks3dx920o3] {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(139, 92, 246, 0.5), 0 4px 15px rgba(236, 72, 153, 0.3);
}

.accept-btn:active:not(:disabled)[b-ks3dx920o3] {
    transform: translateY(0);
}

.accept-btn-disabled[b-ks3dx920o3],
.accept-btn:disabled[b-ks3dx920o3] {
    background: rgba(148, 163, 184, 0.15) !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
    animation: none !important;
    color: rgba(148, 163, 184, 0.5) !important;
    transform: none !important;
}

.accept-action-note[b-ks3dx920o3] {
    margin-top: 0.875rem;
    font-size: 0.775rem;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}

/* Responsive */
@media (max-width: 640px) {
    .accept-terms-wrapper[b-ks3dx920o3] {
        padding: 1.25rem 0.75rem 3rem;
    }

    .accept-terms-scroll[b-ks3dx920o3] {
        max-height: 320px;
        padding: 1.25rem;
    }

    .accept-doc-links[b-ks3dx920o3] {
        flex-direction: column;
    }

    .accept-doc-link[b-ks3dx920o3] {
        width: 100%;
        justify-content: center;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .bg-orb[b-ks3dx920o3],
    .accept-hero-icon[b-ks3dx920o3],
    .accept-btn[b-ks3dx920o3] {
        animation: none;
    }
}
/* /Components/Pages/AvisoPrivacidad.razor.rz.scp.css */
/* ======================================================
   Aviso de Privacidad — Vapor Dark Legal Page Styles
   Scoped styles: NO :root allowed here
   ====================================================== */

.legal-page-wrapper[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
}

.legal-container[b-4j4b28fqtv] {
    max-width: 900px;
    margin: 0 auto;
    padding: 3rem 2rem 5rem;
    width: 100%;
}

/* ── Hero ─────────────────────────────────────────────── */

.legal-hero[b-4j4b28fqtv] {
    text-align: center;
    padding: 4rem 0 5rem;
    position: relative;
}

.legal-hero[b-4j4b28fqtv]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(139, 92, 246, 0.12) 0%, transparent 70%);
    pointer-events: none;
}

.legal-hero-icon[b-4j4b28fqtv] {
    font-size: 5rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1.5rem;
    display: inline-block;
    animation: heroFloat-b-4j4b28fqtv 3.5s ease-in-out infinite;
    filter: drop-shadow(0 0 18px rgba(139, 92, 246, 0.5));
}

@keyframes heroFloat-b-4j4b28fqtv {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

.legal-hero-title[b-4j4b28fqtv] {
    font-size: 3.8rem;
    font-weight: 800;
    color: #f1f5f9;
    margin-bottom: 1rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.gradient-text[b-4j4b28fqtv] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 60%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

.legal-hero-subtitle[b-4j4b28fqtv] {
    font-size: 1.25rem;
    color: #94a3b8;
    margin-bottom: 2rem;
    font-weight: 400;
}

.legal-meta[b-4j4b28fqtv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}

.meta-badge[b-4j4b28fqtv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
    padding: 0.5rem 1.25rem;
    border-radius: 100px;
    font-size: 0.875rem;
    font-weight: 600;
}

.meta-badge-law[b-4j4b28fqtv] {
    background: rgba(6, 182, 212, 0.12);
    color: #22d3ee;
    border-color: rgba(6, 182, 212, 0.25);
}

.back-link[b-4j4b28fqtv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s ease;
}

.back-link:hover[b-4j4b28fqtv] {
    color: #8b5cf6;
}

/* ── Cards ────────────────────────────────────────────── */

.legal-card[b-4j4b28fqtv] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    border: 1px solid rgba(148, 163, 184, 0.1);
    margin-bottom: 1.75rem;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.legal-card:hover[b-4j4b28fqtv] {
    border-color: rgba(139, 92, 246, 0.2);
    box-shadow: 0 8px 32px rgba(139, 92, 246, 0.08);
}

.legal-card-sensitive[b-4j4b28fqtv] {
    border-color: rgba(245, 158, 11, 0.2);
}

.legal-card-sensitive:hover[b-4j4b28fqtv] {
    border-color: rgba(245, 158, 11, 0.35);
    box-shadow: 0 8px 32px rgba(245, 158, 11, 0.08);
}

.legal-card-header[b-4j4b28fqtv] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 1.75rem 2rem 1rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.07);
}

.legal-card-header h2[b-4j4b28fqtv] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #f1f5f9;
    margin: 0 0 0.25rem;
}

.section-subtitle[b-4j4b28fqtv] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
    font-weight: 400;
}

.section-icon[b-4j4b28fqtv] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.icon-purple[b-4j4b28fqtv] {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.3) 0%, rgba(139, 92, 246, 0.15) 100%);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.icon-cyan[b-4j4b28fqtv] {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.25) 0%, rgba(6, 182, 212, 0.1) 100%);
    color: #22d3ee;
    border: 1px solid rgba(6, 182, 212, 0.25);
}

.icon-pink[b-4j4b28fqtv] {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.25) 0%, rgba(236, 72, 153, 0.1) 100%);
    color: #f472b6;
    border: 1px solid rgba(236, 72, 153, 0.25);
}

.icon-amber[b-4j4b28fqtv] {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.25) 0%, rgba(245, 158, 11, 0.1) 100%);
    color: #fbbf24;
    border: 1px solid rgba(245, 158, 11, 0.3);
}

.icon-green[b-4j4b28fqtv] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.25) 0%, rgba(16, 185, 129, 0.1) 100%);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.25);
}

.legal-card-body[b-4j4b28fqtv] {
    padding: 1.75rem 2rem;
}

.legal-card-body p[b-4j4b28fqtv] {
    color: #cbd5e1;
    line-height: 1.75;
    margin-bottom: 1.25rem;
}

.legal-card-body p:last-child[b-4j4b28fqtv] {
    margin-bottom: 0;
}

/* ── Contact Block ────────────────────────────────────── */

.contact-block[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin-top: 1.25rem;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.contact-item[b-4j4b28fqtv] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.contact-item i[b-4j4b28fqtv] {
    color: #8b5cf6;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.contact-label[b-4j4b28fqtv] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.contact-value[b-4j4b28fqtv] {
    color: #e2e8f0;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.95rem;
    transition: color 0.2s;
}

a.contact-value:hover[b-4j4b28fqtv] {
    color: #a78bfa;
}

/* ── Data Categories ──────────────────────────────────── */

.data-grid[b-4j4b28fqtv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.25rem;
}

.data-category[b-4j4b28fqtv] {
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.data-category-sensitive[b-4j4b28fqtv] {
    grid-column: 1 / -1;
    border-color: rgba(245, 158, 11, 0.2);
    background: rgba(245, 158, 11, 0.04);
}

.data-category h4[b-4j4b28fqtv] {
    color: #94a3b8;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.875rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.data-category h4 i[b-4j4b28fqtv] {
    color: #8b5cf6;
}

.data-category-sensitive h4 i[b-4j4b28fqtv] {
    color: #fbbf24;
}

.data-category ul[b-4j4b28fqtv] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.data-category ul li[b-4j4b28fqtv] {
    color: #cbd5e1;
    font-size: 0.9rem;
    padding: 0.35rem 0;
    padding-left: 1.25rem;
    position: relative;
    line-height: 1.5;
}

.data-category ul li[b-4j4b28fqtv]::before {
    content: '›';
    position: absolute;
    left: 0;
    color: #8b5cf6;
    font-weight: 700;
}

.data-category-sensitive ul li[b-4j4b28fqtv]::before {
    color: #fbbf24;
}

.sensitive-notice[b-4j4b28fqtv] {
    margin-top: 1rem;
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.25);
    border-radius: 8px;
    padding: 0.875rem 1rem;
    color: #fcd34d;
    font-size: 0.85rem;
    line-height: 1.6;
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.sensitive-notice i[b-4j4b28fqtv] {
    color: #fbbf24;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

/* ── Finalidades ──────────────────────────────────────── */

.finalidades-grid[b-4j4b28fqtv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-top: 1.25rem;
}

.finalidad-primary[b-4j4b28fqtv],
.finalidad-secondary[b-4j4b28fqtv] {
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.finalidad-primary[b-4j4b28fqtv] {
    border-left: 3px solid #8b5cf6;
}

.finalidad-secondary[b-4j4b28fqtv] {
    border-left: 3px solid rgba(148, 163, 184, 0.3);
}

.finalidad-primary h4[b-4j4b28fqtv],
.finalidad-secondary h4[b-4j4b28fqtv] {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 1rem;
    color: #94a3b8;
}

.finalidad-list[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.finalidad-item[b-4j4b28fqtv] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    font-size: 0.9rem;
    color: #cbd5e1;
    line-height: 1.55;
}

.finalidad-item i[b-4j4b28fqtv] {
    flex-shrink: 0;
    margin-top: 0.15rem;
    font-size: 1rem;
}

.finalidad-primary .finalidad-item i[b-4j4b28fqtv] {
    color: #34d399;
}

.finalidad-secondary .finalidad-item i[b-4j4b28fqtv] {
    color: #94a3b8;
}

.opt-out-note[b-4j4b28fqtv] {
    margin-top: 1rem;
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.6;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    padding-top: 0.875rem;
}

.opt-out-note a[b-4j4b28fqtv] {
    color: #a78bfa;
    text-decoration: none;
}

.opt-out-note a:hover[b-4j4b28fqtv] {
    text-decoration: underline;
}

/* ── Highlight Box ────────────────────────────────────── */

.highlight-box[b-4j4b28fqtv] {
    background: rgba(139, 92, 246, 0.08);
    border: 1px solid rgba(139, 92, 246, 0.25);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin: 1.25rem 0;
    color: #c4b5fd;
    font-size: 0.9rem;
    line-height: 1.65;
}

.highlight-box i[b-4j4b28fqtv] {
    color: #a78bfa;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

/* ── ARCO Grid ────────────────────────────────────────── */

.arco-grid[b-4j4b28fqtv] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    margin: 1.25rem 0 1.75rem;
}

.arco-card[b-4j4b28fqtv] {
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
    text-align: center;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.arco-card:hover[b-4j4b28fqtv] {
    border-color: rgba(139, 92, 246, 0.25);
    box-shadow: 0 4px 16px rgba(139, 92, 246, 0.1);
}

.arco-icon[b-4j4b28fqtv] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    margin: 0 auto 0.875rem;
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
}

.arco-access .arco-icon[b-4j4b28fqtv] { background: rgba(6, 182, 212, 0.15); color: #22d3ee; }
.arco-rectify .arco-icon[b-4j4b28fqtv] { background: rgba(139, 92, 246, 0.15); color: #a78bfa; }
.arco-cancel .arco-icon[b-4j4b28fqtv] { background: rgba(236, 72, 153, 0.15); color: #f472b6; }
.arco-oppose .arco-icon[b-4j4b28fqtv] { background: rgba(245, 158, 11, 0.15); color: #fbbf24; }

.arco-card h4[b-4j4b28fqtv] {
    color: #f1f5f9;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 0.625rem;
}

.arco-card p[b-4j4b28fqtv] {
    color: #94a3b8;
    font-size: 0.85rem;
    line-height: 1.6;
    margin: 0;
}

.arco-process[b-4j4b28fqtv] {
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.arco-process h4[b-4j4b28fqtv] {
    color: #f1f5f9;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.arco-process h4 i[b-4j4b28fqtv] {
    color: #8b5cf6;
}

.process-steps[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.process-step[b-4j4b28fqtv] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    color: #cbd5e1;
    font-size: 0.9rem;
    line-height: 1.6;
}

.step-num[b-4j4b28fqtv] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8b5cf6, #ec4899);
    color: white;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.process-step a[b-4j4b28fqtv] {
    color: #a78bfa;
    text-decoration: none;
}

.process-step a:hover[b-4j4b28fqtv] {
    text-decoration: underline;
}

/* ── Transfer Section ─────────────────────────────────── */

.transfer-notice[b-4j4b28fqtv] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    background: rgba(16, 185, 129, 0.08);
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    color: #6ee7b7;
    font-size: 0.9rem;
    margin-bottom: 1.25rem;
}

.transfer-notice i[b-4j4b28fqtv] {
    font-size: 1.3rem;
    flex-shrink: 0;
    color: #34d399;
}

.transfer-cases[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin-top: 0.875rem;
}

.transfer-item[b-4j4b28fqtv] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    color: #cbd5e1;
    font-size: 0.9rem;
    line-height: 1.6;
}

.transfer-item i[b-4j4b28fqtv] {
    color: #34d399;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

/* ── Security Grid ────────────────────────────────────── */

.security-grid[b-4j4b28fqtv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.25rem;
}

.security-item[b-4j4b28fqtv] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid rgba(16, 185, 129, 0.12);
}

.security-item i[b-4j4b28fqtv] {
    font-size: 1.75rem;
    color: #34d399;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.security-item h4[b-4j4b28fqtv] {
    color: #f1f5f9;
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.security-item p[b-4j4b28fqtv] {
    color: #94a3b8;
    font-size: 0.85rem;
    line-height: 1.6;
    margin: 0;
}

/* ── Retention Timeline ───────────────────────────────── */

.retention-timeline[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 1.25rem;
    padding-left: 1rem;
    border-left: 2px solid rgba(139, 92, 246, 0.3);
}

.retention-item[b-4j4b28fqtv] {
    display: flex;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
    position: relative;
}

.retention-item:last-child[b-4j4b28fqtv] {
    padding-bottom: 0;
}

.retention-dot[b-4j4b28fqtv] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: rgba(148, 163, 184, 0.3);
    border: 2px solid rgba(148, 163, 184, 0.5);
    position: absolute;
    left: -1.5625rem;
    top: 0.25rem;
    flex-shrink: 0;
}

.retention-dot.active[b-4j4b28fqtv] {
    background: #8b5cf6;
    border-color: #a78bfa;
    box-shadow: 0 0 8px rgba(139, 92, 246, 0.5);
}

.retention-item strong[b-4j4b28fqtv] {
    display: block;
    color: #f1f5f9;
    font-size: 0.95rem;
    margin-bottom: 0.375rem;
}

.retention-item p[b-4j4b28fqtv] {
    color: #94a3b8;
    font-size: 0.875rem;
    margin: 0;
}

/* ── Changes ──────────────────────────────────────────── */

.changes-list[b-4j4b28fqtv] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin: 1.25rem 0;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.change-item[b-4j4b28fqtv] {
    display: flex;
    gap: 0.875rem;
    align-items: center;
    color: #cbd5e1;
    font-size: 0.9rem;
}

.change-item i[b-4j4b28fqtv] {
    color: #06b6d4;
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* ── Authority Block ──────────────────────────────────── */

.authority-block[b-4j4b28fqtv] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.5rem;
    border: 1px solid rgba(139, 92, 246, 0.15);
    margin-top: 1.25rem;
}

.authority-logo[b-4j4b28fqtv] {
    font-size: 2.5rem;
    color: #8b5cf6;
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background: rgba(139, 92, 246, 0.12);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.authority-info h4[b-4j4b28fqtv] {
    color: #f1f5f9;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.authority-note[b-4j4b28fqtv] {
    color: #94a3b8;
    font-size: 0.875rem;
    line-height: 1.65;
    margin-bottom: 0.75rem;
}

.authority-url[b-4j4b28fqtv] {
    margin: 0;
    font-size: 0.875rem;
}

.authority-url a[b-4j4b28fqtv] {
    color: #22d3ee;
    text-decoration: none;
}

.authority-url a:hover[b-4j4b28fqtv] {
    text-decoration: underline;
}

.authority-url i[b-4j4b28fqtv] {
    color: #22d3ee;
}

/* ── Footer CTA ───────────────────────────────────────── */

.legal-footer-cta[b-4j4b28fqtv] {
    text-align: center;
    padding: 3rem 2rem;
    background: rgba(30, 41, 59, 0.4);
    border-radius: 16px;
    border: 1px solid rgba(139, 92, 246, 0.2);
    margin-top: 1rem;
}

.legal-footer-cta p[b-4j4b28fqtv] {
    color: #94a3b8;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
}

.cta-btn[b-4j4b28fqtv] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    color: white;
    text-decoration: none;
    padding: 0.875rem 2rem;
    border-radius: 100px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 16px rgba(139, 92, 246, 0.35);
}

.cta-btn:hover[b-4j4b28fqtv] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.5);
    color: white;
}

.legal-footer-links[b-4j4b28fqtv] {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
}

.footer-legal-link[b-4j4b28fqtv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #64748b;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s;
}

.footer-legal-link:hover[b-4j4b28fqtv] {
    color: #8b5cf6;
}

/* ── Responsive ───────────────────────────────────────── */

@media (max-width: 768px) {
    .legal-container[b-4j4b28fqtv] {
        padding: 2rem 1.25rem 4rem;
    }

    .legal-hero[b-4j4b28fqtv] {
        padding: 3rem 0 3.5rem;
    }

    .legal-hero-icon[b-4j4b28fqtv] {
        font-size: 3.5rem;
    }

    .legal-hero-title[b-4j4b28fqtv] {
        font-size: 2.5rem;
    }

    .legal-card-header[b-4j4b28fqtv] {
        padding: 1.25rem 1.25rem 0.875rem;
    }

    .legal-card-body[b-4j4b28fqtv] {
        padding: 1.25rem;
    }

    .data-grid[b-4j4b28fqtv] {
        grid-template-columns: 1fr;
    }

    .data-category-sensitive[b-4j4b28fqtv] {
        grid-column: 1;
    }

    .finalidades-grid[b-4j4b28fqtv] {
        grid-template-columns: 1fr;
    }

    .arco-grid[b-4j4b28fqtv] {
        grid-template-columns: 1fr;
    }

    .security-grid[b-4j4b28fqtv] {
        grid-template-columns: 1fr;
    }

    .authority-block[b-4j4b28fqtv] {
        flex-direction: column;
    }

    .legal-meta[b-4j4b28fqtv] {
        flex-direction: column;
        align-items: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .legal-hero-icon[b-4j4b28fqtv] {
        animation: none;
    }
}
/* /Components/Pages/Calendario.razor.rz.scp.css */
/* Vapor Theme Calendario Component Styles */

.calendario-page-wrapper[b-4lfdxmutcz] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.calendario-container[b-4lfdxmutcz] {
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    flex: 1;
    margin-top: 72px;
    margin-bottom: 48px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.calendario-container[b-4lfdxmutcz]::-webkit-scrollbar {
    width: 8px;
}

.calendario-container[b-4lfdxmutcz]::-webkit-scrollbar-track {
    background: transparent;
}

.calendario-container[b-4lfdxmutcz]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

.calendario-header[b-4lfdxmutcz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.calendario-header h3[b-4lfdxmutcz] {
    color: var(--vapor-text-main);
    text-transform: capitalize;
    margin: 0;
    font-size: 2rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    flex: 1;
    text-align: center;
    text-shadow: var(--vapor-glow-pink);
}

.calendario-header .btn[b-4lfdxmutcz] {
    font-size: 1.25rem;
    padding: 0.75rem 1.25rem;
}

.calendar-grid[b-4lfdxmutcz] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: auto repeat(6, 1fr);
    gap: 1px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.calendar-day-header[b-4lfdxmutcz] {
    background: rgba(10, 5, 20, 0.8);
    backdrop-filter: blur(10px);
    color: var(--vapor-text-main);
    padding: 1rem;
    text-align: center;
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.calendar-day[b-4lfdxmutcz] {
    background: rgba(10, 5, 20, 0.6);
    backdrop-filter: blur(10px);
    padding: 0.75rem;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 90px;
    border: 1px solid transparent;
}

.calendar-day:hover[b-4lfdxmutcz] {
    background: rgba(10, 5, 20, 0.8);
    border-color: rgba(50, 251, 226, 0.3);
    transform: scale(1.02);
    box-shadow: var(--vapor-glow-cyan);
    z-index: 1;
}

.calendar-day.other-month[b-4lfdxmutcz] {
    background: rgba(10, 5, 20, 0.3);
    opacity: 0.6;
}

.calendar-day.other-month:hover[b-4lfdxmutcz] {
    opacity: 0.8;
}

.calendar-day.today[b-4lfdxmutcz] {
    background: rgba(50, 251, 226, 0.1);
    border-color: var(--vapor-accent);
}

.calendar-day.today .day-number[b-4lfdxmutcz] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    color: #0a0514;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    box-shadow: var(--vapor-glow-cyan);
}

.calendar-day.selected[b-4lfdxmutcz] {
    background: rgba(111, 66, 193, 0.2);
    border-color: var(--vapor-primary);
    box-shadow: var(--vapor-glow-pink);
}

.day-number[b-4lfdxmutcz] {
    color: var(--vapor-text-main);
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.events-indicator[b-4lfdxmutcz] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: auto;
}

.event-dot[b-4lfdxmutcz] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.events-indicator small[b-4lfdxmutcz] {
    font-size: 0.7rem;
    color: var(--vapor-text-muted);
    font-weight: 600;
}

.events-panel[b-4lfdxmutcz] {
    background: rgba(10, 5, 20, 0.8);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 2rem;
    color: var(--vapor-text-main);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}

.events-panel-header[b-4lfdxmutcz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.events-panel-header h5[b-4lfdxmutcz] {
    color: var(--vapor-text-main);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0;
    text-transform: capitalize;
}

.events-panel-header .btn[b-4lfdxmutcz] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    color: var(--vapor-accent);
    padding: 0.5rem;
    border-radius: 8px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.events-panel-header .btn:hover[b-4lfdxmutcz] {
    background: rgba(50, 251, 226, 0.2);
    transform: rotate(90deg);
    box-shadow: var(--vapor-glow-cyan);
}

.events-list[b-4lfdxmutcz] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-height: 400px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.events-list[b-4lfdxmutcz]::-webkit-scrollbar {
    width: 6px;
}

.events-list[b-4lfdxmutcz]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
}

.event-card[b-4lfdxmutcz] {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    padding: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    border-left: 4px solid;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-left-width: 4px;
}

.event-card:hover[b-4lfdxmutcz] {
    background: rgba(255, 255, 255, 0.08);
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.event-card-header[b-4lfdxmutcz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.event-card-time[b-4lfdxmutcz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    font-weight: 500;
}

.event-card-time i[b-4lfdxmutcz] {
    color: var(--vapor-accent);
}

.status-pill[b-4lfdxmutcz] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-agendada[b-4lfdxmutcz] {
    background: rgba(50, 251, 226, 0.1);
    color: var(--vapor-accent);
    border: 1px solid rgba(50, 251, 226, 0.3);
}

.status-enprogreso[b-4lfdxmutcz] {
    background: rgba(234, 57, 184, 0.1);
    color: var(--vapor-secondary);
    border: 1px solid rgba(234, 57, 184, 0.3);
}

.status-completada[b-4lfdxmutcz] {
    background: rgba(111, 66, 193, 0.1);
    color: var(--vapor-primary);
    border: 1px solid rgba(111, 66, 193, 0.3);
}

.status-falta[b-4lfdxmutcz] {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.status-cancelada[b-4lfdxmutcz] {
    background: rgba(148, 163, 184, 0.2);
    color: var(--vapor-text-muted);
    border: 1px solid rgba(148, 163, 184, 0.3);
}

.event-card-title[b-4lfdxmutcz] {
    color: var(--vapor-text-main);
    font-weight: 700;
    font-size: 1.125rem;
    margin-bottom: 0.5rem;
}

.event-card-location[b-4lfdxmutcz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--vapor-text-dim);
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.event-card-location i[b-4lfdxmutcz] {
    color: var(--vapor-accent);
}

.event-card-description[b-4lfdxmutcz] {
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    line-height: 1.5;
}

.no-events-message[b-4lfdxmutcz] {
    text-align: center;
    padding: 3rem 2rem;
    color: var(--vapor-text-dim);
}

.no-events-message i[b-4lfdxmutcz] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: var(--vapor-text-muted);
    opacity: 0.5;
}

.no-events-message p[b-4lfdxmutcz] {
    font-size: 1rem;
    margin: 0;
}

@media (prefers-reduced-motion: reduce) {
    *[b-4lfdxmutcz],
    *[b-4lfdxmutcz]::before,
    *[b-4lfdxmutcz]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

@media (max-width: 768px) {
    .calendario-container[b-4lfdxmutcz] {
        padding: 1rem;
    }

    .calendario-header h3[b-4lfdxmutcz] {
        font-size: 1.5rem;
    }

    .calendario-header .btn[b-4lfdxmutcz] {
        padding: 0.5rem 0.75rem;
        font-size: 1rem;
    }

    .calendar-day[b-4lfdxmutcz] {
        min-height: 70px;
        padding: 0.5rem;
    }

    .calendar-day-header[b-4lfdxmutcz] {
        padding: 0.75rem;
        font-size: 0.75rem;
    }

    .day-number[b-4lfdxmutcz] {
        font-size: 0.875rem;
    }

    .events-panel[b-4lfdxmutcz] {
        padding: 1.5rem;
    }

    .event-card[b-4lfdxmutcz] {
        padding: 1rem;
    }

    .event-card-title[b-4lfdxmutcz] {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .calendario-container[b-4lfdxmutcz] {
        padding: 0.75rem;
        gap: 1rem;
    }

    .calendario-header[b-4lfdxmutcz] {
        gap: 1rem;
    }

    .calendario-header h3[b-4lfdxmutcz] {
        font-size: 1.25rem;
    }

    .calendar-day[b-4lfdxmutcz] {
        min-height: 60px;
        padding: 0.375rem;
    }

    .calendar-day-header[b-4lfdxmutcz] {
        padding: 0.5rem;
        font-size: 0.7rem;
    }

    .events-panel[b-4lfdxmutcz] {
        padding: 1rem;
    }
}
/* /Components/Pages/Chat.razor.rz.scp.css */
/* Vapor Theme Chat Component Styles */

.chat-page-wrapper[b-4dxujzvcqg] {
    display: flex;
    flex-direction: column;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
    overscroll-behavior: none;
    touch-action: none;
}

.chat-container[b-4dxujzvcqg] {
    display: flex;
    background: transparent;
    max-width: 100%;
    overflow: hidden;
    position: absolute;
    top: 72px;
    bottom: 48px;
    left: 0;
    right: 0;
    align-items: stretch;
    touch-action: none;
}

.chat-sidebar[b-4dxujzvcqg] {
    width: 320px;
    background: rgba(10, 5, 20, 0.95);
    backdrop-filter: blur(20px);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    height: 100% !important;
    min-height: 100% !important;
    align-self: stretch !important;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
        background 0.3s cubic-bezier(0.4, 0, 0.2, 1),
        border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
        transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.sidebar-header[b-4dxujzvcqg] {
    padding: 0 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    flex-shrink: 0;
    height: 80px;
    box-sizing: border-box;
    touch-action: none;
    overscroll-behavior: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.new-chat-btn[b-4dxujzvcqg] {
    font-weight: 600;
    margin: 0;
    line-height: 1.5;
}

.new-chat-btn:hover[b-4dxujzvcqg] {
    transform: translateY(-1px);
}

.new-chat-btn:active[b-4dxujzvcqg] {
    transform: scale(0.98);
}

.chat-list[b-4dxujzvcqg] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.chat-list[b-4dxujzvcqg]::-webkit-scrollbar {
    width: 6px;
}

.chat-list[b-4dxujzvcqg]::-webkit-scrollbar-track {
    background: transparent;
}

.chat-list[b-4dxujzvcqg]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
}

.chat-list[b-4dxujzvcqg]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4);
}

.chat-item[b-4dxujzvcqg] {
    padding: 1rem;
    cursor: pointer;
    border-radius: 10px;
    margin-bottom: 0.5rem;
    transition: background 0.2s cubic-bezier(0.4, 0, 0.2, 1),
        border-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
        box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1),
        transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
        color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    color: var(--vapor-text-muted);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid transparent;
}

.chat-item:hover[b-4dxujzvcqg] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(50, 251, 226, 0.2);
    transform: translateX(4px);
    box-shadow: var(--vapor-glow-cyan);
}

.chat-item.selected[b-4dxujzvcqg] {
    background: linear-gradient(135deg, rgba(111, 66, 193, 0.2) 0%, rgba(234, 57, 184, 0.1) 100%);
    border-color: var(--vapor-accent);
    color: var(--vapor-text-main);
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.2), var(--vapor-glow-cyan);
}

.chat-item:focus-visible[b-4dxujzvcqg] {
    outline: none;
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.25), var(--vapor-glow-cyan);
}

.chat-item.editing[b-4dxujzvcqg] {
    background: rgba(255, 255, 255, 0.05);
}

.chat-title[b-4dxujzvcqg] {
    font-weight: 600;
    margin-bottom: 0.375rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.95rem;
}

.chat-date[b-4dxujzvcqg] {
    font-size: 0.75rem;
    color: var(--vapor-text-dim);
    font-weight: 500;
}

.chat-main[b-4dxujzvcqg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: rgba(10, 5, 20, 0.6);
    backdrop-filter: blur(20px);
    height: 100%;
    overflow: hidden;
    border-radius: 0;
    min-height: 0;
    contain: layout style;
}

.welcome-screen[b-4dxujzvcqg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 3rem 2rem;
}

.welcome-screen h2[b-4dxujzvcqg] {
    margin-bottom: 1rem;
    color: var(--vapor-primary);
    font-size: 2.25rem;
    font-weight: 700;
    filter: drop-shadow(0 0 18px rgba(139, 92, 246, 0.45));
    text-wrap: balance;
}

.welcome-screen p[b-4dxujzvcqg] {
    color: var(--vapor-text-muted);
    max-width: 500px;
    font-size: 1.1rem;
    line-height: 1.6;
}

.messages-container[b-4dxujzvcqg] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2rem;
    padding-bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
    min-height: 0;
}

.messages-container[b-4dxujzvcqg]::-webkit-scrollbar {
    width: 8px;
}

.messages-container[b-4dxujzvcqg]::-webkit-scrollbar-track {
    background: transparent;
}

.messages-container[b-4dxujzvcqg]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

.messages-container[b-4dxujzvcqg]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4);
}

.message-wrapper[b-4dxujzvcqg] {
    display: flex;
    margin-bottom: 0.5rem;
    animation: fadeInUp-b-4dxujzvcqg 0.22s ease-out;
}

@keyframes fadeInUp-b-4dxujzvcqg {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.message-wrapper.user-message[b-4dxujzvcqg] {
    justify-content: flex-end;
}

.message-wrapper.ai-message[b-4dxujzvcqg] {
    justify-content: flex-start;
}

.message[b-4dxujzvcqg] {
    max-width: 75%;
    padding: 1rem 1.25rem;
    border-radius: 16px;
    line-height: 1.6;
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 0.95rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.user-message-content[b-4dxujzvcqg] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: #ffffff;
    border-bottom-right-radius: 4px;
    box-shadow: var(--vapor-glow-pink);
}

.ai-message-content[b-4dxujzvcqg] {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    color: var(--vapor-text-main);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom-left-radius: 4px;
}

.markdown-content[b-4dxujzvcqg] {
    line-height: 1.7;
}

.markdown-content pre[b-4dxujzvcqg] {
    background: rgba(10, 5, 20, 0.6);
    border-radius: 8px;
    padding: 1rem;
    margin: 0.75rem 0;
    overflow-x: auto;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.markdown-content code[b-4dxujzvcqg] {
    background: rgba(10, 5, 20, 0.4);
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-size: 0.9em;
    color: var(--vapor-accent);
}

.markdown-content pre code[b-4dxujzvcqg] {
    background: transparent;
    padding: 0;
    color: var(--vapor-text-main);
}

.typing-indicator[b-4dxujzvcqg] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.typing-dots[b-4dxujzvcqg] {
    display: flex;
    gap: 0.375rem;
    padding: 0.5rem;
}

.typing-dots span[b-4dxujzvcqg] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    animation: typing-b-4dxujzvcqg 1.4s infinite;
    box-shadow: var(--vapor-glow-pink);
}

.typing-dots span:nth-child(2)[b-4dxujzvcqg] {
    animation-delay: 0.2s;
}

.typing-dots span:nth-child(3)[b-4dxujzvcqg] {
    animation-delay: 0.4s;
}

@keyframes typing-b-4dxujzvcqg {
    0%, 60%, 100% {
        transform: translateY(0) scale(1);
        opacity: 0.5;
    }
    30% {
        transform: translateY(-12px) scale(1.1);
        opacity: 1;
    }
}

.message-input-container[b-4dxujzvcqg] {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 1rem 1.5rem;
    background: rgba(10, 5, 20, 0.95);
    backdrop-filter: blur(20px);
    z-index: 50;
    flex-shrink: 0;
    box-sizing: border-box;
}

.input-group[b-4dxujzvcqg] {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    padding: 0.5rem;
    border: 2px solid rgba(255, 255, 255, 0.08);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.input-group:focus-within[b-4dxujzvcqg] {
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 4px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
}

.message-input[b-4dxujzvcqg] {
    flex: 1;
    resize: none;
    min-height: 48px;
    max-height: 140px;
    border: none !important;
    background-color: transparent !important;
    color: var(--vapor-text-main) !important;
    padding: 0.75rem !important;
    font-size: 0.95rem;
}

.message-input:focus[b-4dxujzvcqg] {
    outline: none !important;
    box-shadow: none !important;
}

.message-input[b-4dxujzvcqg]::placeholder {
    color: var(--vapor-text-dim);
}

.input-group .btn:focus-visible[b-4dxujzvcqg] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5);
}

.input-group .btn[b-4dxujzvcqg] {
    min-width: 48px;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.input-group .btn:first-child[b-4dxujzvcqg] {
    border-radius: var(--vapor-radius-sm) 0 0 var(--vapor-radius-sm);
}

.input-group .btn:last-child[b-4dxujzvcqg] {
    border-radius: 0 var(--vapor-radius-sm) var(--vapor-radius-sm) 0;
}

@media (prefers-reduced-motion: reduce) {
    *[b-4dxujzvcqg],
    *[b-4dxujzvcqg]::before,
    *[b-4dxujzvcqg]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .hero-icon[b-4dxujzvcqg],
    .message-wrapper[b-4dxujzvcqg],
    .typing-dots span[b-4dxujzvcqg] {
        animation: none !important;
    }
}

.send-message-btn:hover:not(:disabled)[b-4dxujzvcqg] {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.send-message-btn:disabled[b-4dxujzvcqg] {
    opacity: 0.5;
    cursor: not-allowed;
}

.input-footer[b-4dxujzvcqg] {
    margin-top: 0.75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--vapor-text-dim);
    font-size: 0.85rem;
}

.voice-status[b-4dxujzvcqg],
.voice-result[b-4dxujzvcqg] {
    border-radius: 12px;
    backdrop-filter: blur(10px);
    animation: fadeInUp-b-4dxujzvcqg 0.22s ease-out;
    color: var(--vapor-text-main);
}

.voice-status[b-4dxujzvcqg] {
    background-color: rgba(59, 130, 246, 0.16);
    border: 1px solid rgba(59, 130, 246, 0.35);
}

.voice-result[b-4dxujzvcqg] {
    background-color: rgba(16, 185, 129, 0.16);
    border: 1px solid rgba(16, 185, 129, 0.35);
}

.voice-status-text[b-4dxujzvcqg],
.voice-result-text[b-4dxujzvcqg] {
    color: var(--vapor-text-main);
    font-size: 0.875rem;
}

.voice-status-text span[b-4dxujzvcqg] {
    color: var(--vapor-text-muted);
}

.voice-result .bi-mic-fill[b-4dxujzvcqg] {
    color: #10b981;
}

.chat-status-message[b-4dxujzvcqg] {
    margin-bottom: 0.75rem;
    padding: 0.65rem 0.85rem;
    border-radius: var(--vapor-radius-md);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: var(--vapor-text-main);
    font-size: 0.875rem;
}

.chat-status-message.danger[b-4dxujzvcqg] {
    background: rgba(239, 68, 68, 0.12);
    border-color: rgba(239, 68, 68, 0.35);
}

.chat-status-message.warning[b-4dxujzvcqg] {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.35);
}

.stop-response-btn[b-4dxujzvcqg] {
    width: fit-content;
    margin-top: 0.65rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.mobile-back-button[b-4dxujzvcqg] {
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(10, 5, 20, 0.95);
    margin-top: -1px;
    height: 64px;
    box-sizing: border-box;
    touch-action: none;
    overscroll-behavior: none;
}

.mobile-back-button button[b-4dxujzvcqg] {
    text-decoration: none;
    padding: 0.5rem 0.75rem;
    color: var(--vapor-text-muted);
    transition: color 0.2s ease;
}

.mobile-back-button button:hover[b-4dxujzvcqg] {
    color: var(--vapor-accent);
}

.loading-container[b-4dxujzvcqg] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    min-height: 300px;
}

.loading-container .spinner-border[b-4dxujzvcqg] {
    color: var(--vapor-accent) !important;
    width: 3rem;
    height: 3rem;
}

.loading-container p[b-4dxujzvcqg] {
    color: var(--vapor-text-muted);
    margin-top: 1.5rem;
    font-size: 1rem;
}

@media (max-width: 768px) {
    .chat-container[b-4dxujzvcqg] {
        flex-direction: column;
        top: 64px;
        bottom: 48px;
    }

    .chat-sidebar[b-4dxujzvcqg] {
        width: 100%;
        max-height: 40vh;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        overflow-y: auto;
    }

    .chat-sidebar.has-selected-chat[b-4dxujzvcqg] {
        display: none;
    }

    .chat-main[b-4dxujzvcqg] {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        min-height: 0;
    }

    .mobile-back-button[b-4dxujzvcqg] {
        flex-shrink: 0;
        z-index: 5;
    }

    .messages-container[b-4dxujzvcqg] {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 1rem;
        padding-bottom: 1rem;
        min-height: 0;
        position: relative;
    }

    .message-input-container[b-4dxujzvcqg] {
        padding: 0.75rem 1rem;
        z-index: 50;
        flex-shrink: 0;
        box-sizing: border-box;
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .chat-container[b-4dxujzvcqg] {
        flex-direction: column;
        top: 65px;
        bottom: 48px;
    }

    .chat-sidebar[b-4dxujzvcqg] {
        width: 100%;
        max-height: 40vh;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        overflow-y: auto;
    }

    .chat-sidebar.has-selected-chat[b-4dxujzvcqg] {
        display: none;
    }

    .chat-main[b-4dxujzvcqg] {
        flex: 1;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    .message[b-4dxujzvcqg] {
        max-width: 85%;
    }

    .messages-container[b-4dxujzvcqg] {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 1.5rem 1rem;
        padding-bottom: 1rem;
        min-height: 0;
        position: relative;
    }

    .message-input-container[b-4dxujzvcqg] {
        padding: 0.75rem 1rem;
        z-index: 50;
        flex-shrink: 0;
        box-sizing: border-box;
    }
}

.quota-indicator[b-4dxujzvcqg] {
    margin-top: 0.5rem;
    padding: 0.25rem 0.5rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: var(--vapor-text-dim);
    font-size: 0.75rem;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.quota-indicator small[b-4dxujzvcqg] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.chat-confirm-backdrop[b-4dxujzvcqg] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(3, 1, 10, 0.68);
    backdrop-filter: blur(10px);
    animation: fadeIn-b-4dxujzvcqg 0.18s ease-out;
}

.chat-confirm-dialog[b-4dxujzvcqg] {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1051;
    width: min(420px, calc(100vw - 2rem));
    transform: translate(-50%, -50%);
    padding: 1.5rem;
    border-radius: var(--vapor-radius-lg);
    background: rgba(15, 8, 30, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.48), var(--vapor-glow-pink);
    color: var(--vapor-text-main);
    animation: dialogIn-b-4dxujzvcqg 0.2s ease-out;
}

.chat-confirm-dialog h2[b-4dxujzvcqg] {
    margin: 0 0 0.75rem;
    font-size: 1.25rem;
    color: var(--vapor-text-main);
}

.chat-confirm-dialog p[b-4dxujzvcqg] {
    margin: 0;
    color: var(--vapor-text-muted);
    line-height: 1.5;
}

.chat-confirm-actions[b-4dxujzvcqg] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.25rem;
}

@keyframes fadeIn-b-4dxujzvcqg {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes dialogIn-b-4dxujzvcqg {
    from {
        opacity: 0;
        transform: translate(-50%, calc(-50% + 10px)) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

@media (max-width: 768px) {
    .quota-indicator[b-4dxujzvcqg] {
        font-size: 0.7rem;
        margin-top: 0.35rem;
        padding: 0.2rem 0.35rem;
    }
    
    .quota-indicator small[b-4dxujzvcqg] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.2rem;
    }
}

@media (max-width: 992px) {
    .compact-footer[b-4dxujzvcqg] {
        z-index: 90;
    }
}
/* /Components/Pages/CitaDetalle.razor.rz.scp.css */
.cita-detalle-wrapper[b-8in4mjpwog] {
    min-height: 100vh;
    padding: 2rem 1rem;
    background: linear-gradient(180deg, rgba(15, 15, 25, 0.95), rgba(10, 10, 20, 0.98));
}

.cita-detalle-container[b-8in4mjpwog] {
    max-width: 700px;
    margin: 0 auto;
}

.loading-state[b-8in4mjpwog],
.not-found[b-8in4mjpwog] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
}

.loading-state .spinner[b-8in4mjpwog],
.not-found i[b-8in4mjpwog] {
    font-size: 4rem;
    margin-bottom: 1.5rem;
    opacity: 0.5;
}

.spinner[b-8in4mjpwog] {
    width: 50px;
    height: 50px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top-color: var(--accent-primary, #2ecc71);
    border-radius: 50%;
    animation: spin-b-8in4mjpwog 1s linear infinite;
}

@keyframes spin-b-8in4mjpwog {
    to { transform: rotate(360deg); }
}

.not-found h2[b-8in4mjpwog] {
    color: #fff;
    margin-bottom: 0.5rem;
}

.cita-header[b-8in4mjpwog] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.status-badge[b-8in4mjpwog] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
}

.status-pending[b-8in4mjpwog] {
    background: rgba(241, 196, 15, 0.2);
    color: #f1c40f;
}

.status-confirmed[b-8in4mjpwog] {
    background: rgba(46, 204, 113, 0.2);
    color: #2ecc71;
}

.status-rejected[b-8in4mjpwog] {
    background: rgba(231, 76, 60, 0.2);
    color: #e74c3c;
}

.status-counter[b-8in4mjpwog] {
    background: rgba(52, 152, 219, 0.2);
    color: #3498db;
}

.status-cancelled[b-8in4mjpwog] {
    background: rgba(149, 165, 166, 0.2);
    color: #95a5a6;
}

.cita-info-card[b-8in4mjpwog],
.counter-proposal-card[b-8in4mjpwog],
.actions-section[b-8in4mjpwog] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.cita-info-card h2[b-8in4mjpwog],
.counter-proposal-card h3[b-8in4mjpwog],
.actions-section h3[b-8in4mjpwog] {
    margin: 0 0 1.25rem 0;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
}

.info-grid[b-8in4mjpwog] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.25rem;
}

.info-item[b-8in4mjpwog] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.info-item.full-width[b-8in4mjpwog] {
    grid-column: 1 / -1;
}

.info-item i[b-8in4mjpwog] {
    font-size: 1.25rem;
    color: var(--accent-primary, #2ecc71);
    width: 28px;
    text-align: center;
    margin-top: 2px;
}

.info-item div[b-8in4mjpwog] {
    display: flex;
    flex-direction: column;
}

.info-item .label[b-8in4mjpwog] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.25rem;
}

.info-item .value[b-8in4mjpwog] {
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
}

.counter-proposal-card[b-8in4mjpwog] {
    background: rgba(52, 152, 219, 0.1);
    border-color: rgba(52, 152, 219, 0.3);
}

.counter-proposal-card h3[b-8in4mjpwog] {
    color: #3498db;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.proposal-intro[b-8in4mjpwog] {
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 1rem;
}

.proposal-details[b-8in4mjpwog] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.proposal-item[b-8in4mjpwog] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
}

.proposal-item i[b-8in4mjpwog] {
    color: #3498db;
}

.proposal-note[b-8in4mjpwog] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(52, 152, 219, 0.2);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
}

.proposal-note i[b-8in4mjpwog] {
    color: #3498db;
    margin-top: 2px;
}

.error-message[b-8in4mjpwog],
.success-message[b-8in4mjpwog] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 10px;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}

.error-message[b-8in4mjpwog] {
    background: rgba(231, 76, 60, 0.2);
    border: 1px solid rgba(231, 76, 60, 0.4);
    color: #ff6b6b;
}

.success-message[b-8in4mjpwog] {
    background: rgba(46, 204, 113, 0.2);
    border: 1px solid rgba(46, 204, 113, 0.4);
    color: #2ecc71;
}

.actions-hint[b-8in4mjpwog] {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

.action-buttons[b-8in4mjpwog] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.btn-accept[b-8in4mjpwog],
.btn-counter[b-8in4mjpwog],
.btn-reject[b-8in4mjpwog],
.btn-cancel[b-8in4mjpwog] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.65rem 1.25rem;
    border: none;
    border-radius: var(--vapor-radius-md);
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
}

.btn-accept[b-8in4mjpwog] {
    background: linear-gradient(135deg, #2ecc71, #27ae60);
    color: #fff;
}

.btn-accept:hover:not(:disabled)[b-8in4mjpwog] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(46, 204, 113, 0.4);
}

.btn-counter[b-8in4mjpwog] {
    background: linear-gradient(135deg, #3498db, #2980b9);
    color: #fff;
}

.btn-counter:hover:not(:disabled)[b-8in4mjpwog] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(52, 152, 219, 0.4);
}

.btn-reject[b-8in4mjpwog] {
    background: rgba(231, 76, 60, 0.2);
    border: 1px solid rgba(231, 76, 60, 0.5);
    color: #e74c3c;
}

.btn-reject:hover:not(:disabled)[b-8in4mjpwog] {
    background: rgba(231, 76, 60, 0.3);
}

.btn-cancel[b-8in4mjpwog] {
    background: rgba(149, 165, 166, 0.2);
    border: 1px solid rgba(149, 165, 166, 0.5);
    color: #95a5a6;
}

.btn-cancel:hover:not(:disabled)[b-8in4mjpwog] {
    background: rgba(149, 165, 166, 0.3);
}

.counter-form[b-8in4mjpwog],
.reject-form[b-8in4mjpwog] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.counter-form h4[b-8in4mjpwog],
.reject-form h4[b-8in4mjpwog] {
    margin: 0 0 1rem 0;
    color: #fff;
    font-size: 1rem;
}

.form-group[b-8in4mjpwog] {
    margin-bottom: 1rem;
}

.form-group label[b-8in4mjpwog] {
    display: block;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 0.5rem;
}

.form-group input[b-8in4mjpwog],
.form-group textarea[b-8in4mjpwog] {
    width: 100%;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: #fff;
    font-family: inherit;
    font-size: 0.95rem;
    transition: border-color 0.2s ease;
}

.form-group input:focus[b-8in4mjpwog],
.form-group textarea:focus[b-8in4mjpwog] {
    outline: none;
    border-color: var(--accent-primary, #2ecc71);
}

.form-group textarea[b-8in4mjpwog] {
    resize: vertical;
    min-height: 80px;
}

.form-actions[b-8in4mjpwog] {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
}

.cancel-section[b-8in4mjpwog] {
    background: transparent;
    border: none;
    padding: 0;
    text-align: center;
}

.confirmed-info[b-8in4mjpwog],
.rejected-info[b-8in4mjpwog],
.cancelled-info[b-8in4mjpwog] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
    border-radius: 16px;
    margin-bottom: 1.5rem;
}

.confirmed-info[b-8in4mjpwog] {
    background: rgba(46, 204, 113, 0.1);
    border: 1px solid rgba(46, 204, 113, 0.3);
}

.confirmed-info i[b-8in4mjpwog] {
    font-size: 2rem;
    color: #2ecc71;
}

.confirmed-info h3[b-8in4mjpwog] {
    color: #2ecc71;
    margin: 0 0 0.5rem 0;
}

.confirmed-info p[b-8in4mjpwog] {
    color: rgba(255, 255, 255, 0.8);
    margin: 0;
}

.rejected-info[b-8in4mjpwog] {
    background: rgba(231, 76, 60, 0.1);
    border: 1px solid rgba(231, 76, 60, 0.3);
}

.rejected-info i[b-8in4mjpwog] {
    font-size: 2rem;
    color: #e74c3c;
}

.rejected-info h3[b-8in4mjpwog] {
    color: #e74c3c;
    margin: 0 0 0.5rem 0;
}

.rejected-info p[b-8in4mjpwog] {
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0 1rem 0;
}

.cancelled-info[b-8in4mjpwog] {
    background: rgba(149, 165, 166, 0.1);
    border: 1px solid rgba(149, 165, 166, 0.3);
}

.cancelled-info i[b-8in4mjpwog] {
    font-size: 2rem;
    color: #95a5a6;
}

.cancelled-info h3[b-8in4mjpwog] {
    color: #95a5a6;
    margin: 0 0 0.5rem 0;
}

.cancelled-info p[b-8in4mjpwog] {
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
}

.spinner-small[b-8in4mjpwog] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-8in4mjpwog 1s linear infinite;
}

@media (max-width: 600px) {
    .cita-detalle-wrapper[b-8in4mjpwog] {
        padding: 1rem 0.75rem;
    }

    .cita-header[b-8in4mjpwog] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .action-buttons[b-8in4mjpwog] {
        flex-direction: column;
    }

    .action-buttons button[b-8in4mjpwog] {
        width: 100%;
    }

    .form-actions[b-8in4mjpwog] {
        flex-direction: column;
    }
}
/* /Components/Pages/CitaReagendar.razor.rz.scp.css */
.reagendar-page-wrapper[b-puluul76rz] {
    min-height: 100vh;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    padding: 1rem;
}

.reagendar-container[b-puluul76rz] {
    max-width: 600px;
    margin: 0 auto;
}

.reagendar-header[b-puluul76rz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.reagendar-header h3[b-puluul76rz] {
    color: #fff;
    margin: 0;
    font-size: 1.25rem;
}

.loading-container[b-puluul76rz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: rgba(255, 255, 255, 0.7);
}

.loading-spinner[b-puluul76rz] {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top-color: #4a9eff;
    border-radius: 50%;
    animation: spin-b-puluul76rz 1s linear infinite;
}

@keyframes spin-b-puluul76rz {
    to { transform: rotate(360deg); }
}

.error-message[b-puluul76rz] {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 12px;
    padding: 2rem;
    text-align: center;
    color: #fff;
}

.error-message i[b-puluul76rz] {
    font-size: 2rem;
    color: #ef4444;
    margin-bottom: 1rem;
}

.current-appointment-info[b-puluul76rz] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.current-appointment-info h5[b-puluul76rz] {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 1rem 0;
}

.info-grid[b-puluul76rz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.info-item[b-puluul76rz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #fff;
}

.info-item i[b-puluul76rz] {
    color: #4a9eff;
    width: 20px;
}

.new-schedule-form[b-puluul76rz] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 1.25rem;
}

.new-schedule-form h5[b-puluul76rz] {
    color: #fff;
    font-size: 1rem;
    margin: 0 0 1.25rem 0;
}

.form-group[b-puluul76rz] {
    margin-bottom: 1.25rem;
}

.form-group label[b-puluul76rz] {
    display: block;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.form-input[b-puluul76rz],
.form-textarea[b-puluul76rz] {
    width: 100%;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    color: #fff;
    font-size: 1rem;
}

.form-input:focus[b-puluul76rz],
.form-textarea:focus[b-puluul76rz] {
    outline: none;
    border-color: #4a9eff;
    background: rgba(255, 255, 255, 0.15);
}

.loading-slots[b-puluul76rz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: rgba(255, 255, 255, 0.6);
    padding: 1rem;
}

.spinner-small[b-puluul76rz] {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-top-color: #4a9eff;
    border-radius: 50%;
    animation: spin-b-puluul76rz 1s linear infinite;
}

.time-slots-grid[b-puluul76rz] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 0.5rem;
}

.time-slot[b-puluul76rz] {
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    color: #fff;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
}

.time-slot:hover[b-puluul76rz] {
    background: rgba(74, 158, 255, 0.2);
    border-color: #4a9eff;
}

.time-slot.selected[b-puluul76rz] {
    background: #4a9eff;
    border-color: #4a9eff;
    color: #fff;
}

.no-slots-message[b-puluul76rz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
    padding: 1rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
}

.error-alert[b-puluul76rz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 8px;
    color: #ef4444;
    margin-bottom: 1rem;
}

.form-actions[b-puluul76rz] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* /Components/Pages/EditSpecialist.razor.rz.scp.css */
/* Vapor Theme EditSpecialist.razor.css - Component-scoped styles */

/* Page Layout */
.specialist-edit-page-wrapper[b-ibiw0kyh9g] {
    min-height: 100vh;
    background: transparent; /* Handled by global body style */
    padding: 2rem 1rem 6rem 1rem;
}

.specialist-edit-container[b-ibiw0kyh9g] {
    max-width: 900px;
    margin: 0 auto;
}

/* Header */
.edit-header[b-ibiw0kyh9g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.header-left[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.header-left h3[b-ibiw0kyh9g] {
    color: var(--vapor-text-main);
    margin: 0;
    font-weight: 600;
    text-shadow: var(--vapor-glow-cyan);
}

.header-right[b-ibiw0kyh9g] {
    display: flex;
    gap: 0.75rem;
}

/* Content Area */
.edit-content[b-ibiw0kyh9g] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

/* Tabs Navigation */
.edit-tabs[b-ibiw0kyh9g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 1rem;
    background: rgba(10, 5, 20, 0.5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tab-btn[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tab-btn:hover[b-ibiw0kyh9g] {
    background: rgba(139, 92, 246, 0.1);
    color: #a78bfa;
    border-color: rgba(139, 92, 246, 0.2);
}

.tab-btn.active[b-ibiw0kyh9g] {
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
    border-color: rgba(139, 92, 246, 0.3);
}

.tab-btn i[b-ibiw0kyh9g] {
    font-size: 1rem;
}

/* Tab Content */
.tab-content[b-ibiw0kyh9g] {
    padding: 2rem;
}

.form-section[b-ibiw0kyh9g] {
    animation: fadeIn-b-ibiw0kyh9g 0.3s ease;
}

@keyframes fadeIn-b-ibiw0kyh9g {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.form-section h4[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--vapor-text-main);
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid rgba(50, 251, 226, 0.3);
}

.form-section h4 i[b-ibiw0kyh9g] {
    color: var(--vapor-accent);
}

.section-description[b-ibiw0kyh9g] {
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    margin-bottom: 1.5rem;
}

/* Form Elements */
.form-row[b-ibiw0kyh9g] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-group[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.form-group label[b-ibiw0kyh9g] {
    color: var(--vapor-text-dim);
    font-size: 0.875rem;
    font-weight: 500;
}

.form-input[b-ibiw0kyh9g],
.form-select[b-ibiw0kyh9g],
.form-textarea[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    color: var(--vapor-text-main);
    font-size: 0.9375rem;
    transition: all 0.2s ease;
}

.form-input:focus[b-ibiw0kyh9g],
.form-select:focus[b-ibiw0kyh9g],
.form-textarea:focus[b-ibiw0kyh9g] {
    outline: none;
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.15), var(--vapor-glow-cyan);
}

.form-select:disabled[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.3);
    color: var(--vapor-text-dim);
    cursor: not-allowed;
    opacity: 0.6;
}

.form-select option[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.95);
    color: var(--vapor-text-main);
    padding: 0.5rem;
}

.form-input[b-ibiw0kyh9g]::placeholder,
.form-textarea[b-ibiw0kyh9g]::placeholder {
    color: var(--vapor-text-dim);
}

.form-textarea[b-ibiw0kyh9g] {
    resize: vertical;
    min-height: 100px;
}

.form-color[b-ibiw0kyh9g] {
    width: 60px;
    height: 40px;
    padding: 0.25rem;
    cursor: pointer;
}

/* Checkbox */
.checkbox-label[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--vapor-text-muted);
    cursor: pointer;
}

.checkbox-label input[type="checkbox"][b-ibiw0kyh9g] {
    width: 18px;
    height: 18px;
    accent-color: var(--vapor-primary);
}

/* Tags Editor */
.tags-editor[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.4);
    border-radius: 8px;
    padding: 1rem;
}

.tags-list[b-ibiw0kyh9g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.tag[b-ibiw0kyh9g] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(50, 251, 226, 0.15);
    color: var(--vapor-accent);
    padding: 0.5rem 0.75rem;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 500;
    border: 1px solid rgba(50, 251, 226, 0.2);
}

.tag button[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--vapor-accent);
    cursor: pointer;
    padding: 0;
    font-size: 1rem;
    opacity: 0.7;
    transition: opacity 0.2s;
}

.tag button:hover[b-ibiw0kyh9g] {
    opacity: 1;
}

.skill-tag[b-ibiw0kyh9g] {
    background: rgba(111, 66, 193, 0.15);
    color: var(--vapor-secondary);
    border-color: rgba(111, 66, 193, 0.2);
}

.tag-input-row[b-ibiw0kyh9g] {
    display: flex;
    gap: 0.5rem;
}

.tag-input-row .form-input[b-ibiw0kyh9g] {
    flex: 1;
}

.endorsements-input[b-ibiw0kyh9g] {
    width: 80px !important;
    flex: none !important;
}

/* List Item Cards */
.list-item-card[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.4);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 1rem;
    overflow: hidden;
}

.item-header[b-ibiw0kyh9g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: rgba(10, 5, 20, 0.6);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.item-title[b-ibiw0kyh9g] {
    color: var(--vapor-text-main);
    font-weight: 600;
    font-size: 1rem;
}

.item-body[b-ibiw0kyh9g] {
    padding: 1rem;
}

/* Schedule Items */
.schedule-item[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.4);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 0.75rem;
}

.schedule-item .form-row[b-ibiw0kyh9g] {
    margin-bottom: 0;
}

.schedule-day-card[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.45);
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 0.75rem;
    transition: border-color 0.2s;
}

.schedule-day-card:has(.day-status.open)[b-ibiw0kyh9g] {
    border-color: rgba(16, 185, 129, 0.2);
}

.schedule-day-header[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    margin-bottom: 0.25rem;
}

.schedule-day-toggle[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    user-select: none;
    width: 100%;
}

.schedule-day-toggle input[type="checkbox"][b-ibiw0kyh9g] {
    width: 18px;
    height: 18px;
    accent-color: #10b981;
    cursor: pointer;
    flex-shrink: 0;
}

.day-label[b-ibiw0kyh9g] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #f1f5f9;
    min-width: 90px;
}

.day-status[b-ibiw0kyh9g] {
    font-size: 0.78rem;
    font-weight: 500;
    padding: 2px 10px;
    border-radius: 20px;
    margin-left: auto;
}

.day-status.open[b-ibiw0kyh9g] {
    background: rgba(16, 185, 129, 0.15);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.25);
}

.day-status.closed[b-ibiw0kyh9g] {
    background: rgba(148, 163, 184, 0.08);
    color: #94a3b8;
    border: 1px solid rgba(148, 163, 184, 0.15);
}

.schedule-blocks[b-ibiw0kyh9g] {
    margin-top: 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.time-block-row[b-ibiw0kyh9g] {
    background: rgba(30, 41, 59, 0.5);
    border-radius: 8px;
    padding: 0.65rem 0.85rem;
}

.time-block-fields[b-ibiw0kyh9g] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.time-field[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.time-field label[b-ibiw0kyh9g] {
    font-size: 0.72rem;
    color: #94a3b8;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.time-input[b-ibiw0kyh9g] {
    width: 160px;
    min-width: 160px;
}

.duration-field[b-ibiw0kyh9g] {
    flex: 1;
    min-width: 120px;
    max-width: 150px;
}

.time-separator[b-ibiw0kyh9g] {
    color: #94a3b8;
    font-size: 1.1rem;
    padding-bottom: 0.4rem;
    flex-shrink: 0;
}

.btn-remove-block[b-ibiw0kyh9g] {
    background: transparent;
    border: none;
    color: #f87171;
    cursor: pointer;
    padding: 0.3rem;
    border-radius: 6px;
    margin-left: auto;
    align-self: flex-end;
    font-size: 1.1rem;
    transition: color 0.2s, background 0.2s;
    flex-shrink: 0;
}

.btn-remove-block:hover[b-ibiw0kyh9g] {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.1);
}

.btn-add-block[b-ibiw0kyh9g] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    border: 1px dashed rgba(16, 185, 129, 0.35);
    color: #34d399;
    font-size: 0.82rem;
    font-weight: 500;
    padding: 0.45rem 0.85rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    margin-top: 0.1rem;
}

.btn-add-block:hover[b-ibiw0kyh9g] {
    background: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.55);
}

@media (max-width: 600px) {
    .time-block-fields[b-ibiw0kyh9g] {
        gap: 0.5rem;
    }
    .time-input[b-ibiw0kyh9g] {
        width: 100px;
    }
    .duration-field[b-ibiw0kyh9g] {
        min-width: 100px;
    }
}

/* Visibility Section */
.visibility-options[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.visibility-card[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: rgba(10, 5, 20, 0.4);
    border-radius: 12px;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.visibility-icon[b-ibiw0kyh9g] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.visibility-icon.available[b-ibiw0kyh9g] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    color: #0a0514;
}

.visibility-icon.status[b-ibiw0kyh9g] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
}

.visibility-info[b-ibiw0kyh9g] {
    flex: 1;
}

.visibility-info h5[b-ibiw0kyh9g] {
    color: var(--vapor-text-main);
    margin: 0 0 0.25rem 0;
    font-weight: 600;
}

.visibility-info p[b-ibiw0kyh9g] {
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    margin: 0;
}

.visibility-toggle[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Toggle Switch */
.toggle-switch[b-ibiw0kyh9g] {
    position: relative;
    width: 50px;
    height: 26px;
    display: inline-block;
}

.toggle-switch input[b-ibiw0kyh9g] {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider[b-ibiw0kyh9g] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #475569;
    transition: 0.3s;
    border-radius: 26px;
}

.slider[b-ibiw0kyh9g]:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
}

input:checked + .slider[b-ibiw0kyh9g] {
    background-color: var(--vapor-accent);
    box-shadow: var(--vapor-glow-cyan);
}

input:checked + .slider[b-ibiw0kyh9g]:before {
    transform: translateX(24px);
}

.toggle-label[b-ibiw0kyh9g] {
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    font-weight: 500;
}

/* Alerts */
.alert[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 8px;
    margin-top: 1.5rem;
    font-weight: 500;
}

.alert-error[b-ibiw0kyh9g] {
    background: rgba(239, 68, 68, 0.15);
    color: #f87171;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.alert-success[b-ibiw0kyh9g] {
    background: rgba(50, 251, 226, 0.15);
    color: var(--vapor-accent);
    border: 1px solid rgba(50, 251, 226, 0.3);
}

/* Loading */
.loading-container[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    color: var(--vapor-text-muted);
}

.loading-spinner[b-ibiw0kyh9g] {
    width: 48px;
    height: 48px;
    border: 3px solid rgba(50, 251, 226, 0.2);
    border-top-color: var(--vapor-accent);
    border-radius: 50%;
    animation: spin-b-ibiw0kyh9g 1s linear infinite;
    margin-bottom: 1rem;
    box-shadow: var(--vapor-glow-cyan);
}

@keyframes spin-b-ibiw0kyh9g {
    to { transform: rotate(360deg); }
}

/* Profile Image Upload Styles */
.profile-image-upload[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.5rem;
    background: rgba(10, 5, 20, 0.4);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.profile-image-preview[b-ibiw0kyh9g] {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    overflow: hidden;
    background: rgba(10, 5, 20, 0.6);
    border: 3px solid rgba(50, 251, 226, 0.3);
    box-shadow: 0 0 20px rgba(50, 251, 226, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.profile-image-preview.background-preview[b-ibiw0kyh9g] {
    width: 100%;
    max-width: 600px;
    height: 200px;
    border-radius: 12px;
    aspect-ratio: 16 / 9;
}

.profile-image-preview.background-preview img[b-ibiw0kyh9g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.profile-image-preview img[b-ibiw0kyh9g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-image-placeholder[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--vapor-text-muted);
    gap: 0.5rem;
}

.profile-image-placeholder i[b-ibiw0kyh9g] {
    font-size: 3rem;
    opacity: 0.5;
}

/* Date/Month Input Styling for Dark Theme */
input[type="month"][b-ibiw0kyh9g],
input[type="date"][b-ibiw0kyh9g] {
    color-scheme: dark;
    position: relative;
}

input[type="month"][b-ibiw0kyh9g]::-webkit-calendar-picker-indicator,
input[type="date"][b-ibiw0kyh9g]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
    opacity: 0.8;
    padding: 4px;
    border-radius: 4px;
}

input[type="month"][b-ibiw0kyh9g]::-webkit-calendar-picker-indicator:hover,
input[type="date"][b-ibiw0kyh9g]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
    background: rgba(50, 251, 226, 0.2);
}

/* Ensure date inputs are clearly clickable */
.date-input-wrapper[b-ibiw0kyh9g] {
    position: relative;
    display: flex;
    align-items: center;
}

.date-input-wrapper input[type="month"][b-ibiw0kyh9g],
.date-input-wrapper input[type="date"][b-ibiw0kyh9g] {
    flex: 1;
    padding-right: 2.5rem;
}

.date-input-wrapper .calendar-icon[b-ibiw0kyh9g] {
    position: absolute;
    right: 0.75rem;
    color: var(--vapor-accent);
    pointer-events: none;
    font-size: 1.1rem;
}

.profile-image-placeholder span[b-ibiw0kyh9g] {
    font-size: 0.875rem;
}

.profile-image-controls[b-ibiw0kyh9g] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-upload[b-ibiw0kyh9g] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-upload:hover[b-ibiw0kyh9g] {
    background: rgba(50, 251, 226, 0.15);
    border-color: rgba(50, 251, 226, 0.3);
    color: var(--vapor-accent);
}

.profile-image-info[b-ibiw0kyh9g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 0.75rem;
    background: rgba(50, 251, 226, 0.1);
    border-radius: 8px;
    border: 1px solid rgba(50, 251, 226, 0.2);
}

.file-name[b-ibiw0kyh9g] {
    color: var(--vapor-accent);
    font-weight: 500;
    font-size: 0.875rem;
    word-break: break-all;
}

.file-size[b-ibiw0kyh9g] {
    color: var(--vapor-text-muted);
    font-size: 0.8125rem;
}

.image-upload-error[b-ibiw0kyh9g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: rgba(239, 68, 68, 0.15);
    color: #f87171;
    border-radius: 8px;
    font-size: 0.875rem;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.visually-hidden[b-ibiw0kyh9g] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .edit-header[b-ibiw0kyh9g] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .edit-tabs[b-ibiw0kyh9g] {
        flex-direction: column;
    }

    .tab-btn[b-ibiw0kyh9g] {
        width: 100%;
        justify-content: flex-start;
    }

    .visibility-card[b-ibiw0kyh9g] {
        flex-direction: column;
        text-align: center;
    }

    .visibility-toggle[b-ibiw0kyh9g] {
        width: 100%;
        justify-content: center;
    }
}

.cedula-validation-section[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.4);
    border-radius: 12px;
    padding: 1.5rem;
    border: 1px solid rgba(50, 251, 226, 0.1);
}

.cedula-validation-section h5[b-ibiw0kyh9g] {
    color: var(--vapor-accent);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.cedula-validation-content[b-ibiw0kyh9g] {
    margin-top: 1rem;
}

.validation-details[b-ibiw0kyh9g] {
    background: rgba(10, 5, 20, 0.6);
    border-radius: 8px;
    padding: 1rem;
    border: 1px solid rgba(50, 251, 226, 0.2);
}

.validation-details h6[b-ibiw0kyh9g] {
    color: var(--vapor-text-main);
    margin-bottom: 0.75rem;
}

.validation-details .table[b-ibiw0kyh9g],
.validation-details .table tbody[b-ibiw0kyh9g],
.validation-details .table tr[b-ibiw0kyh9g],
.validation-details .table td[b-ibiw0kyh9g] {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
}

.validation-details .table[b-ibiw0kyh9g] {
    color: var(--vapor-text-main);
    font-size: 0.875rem;
    width: 100%;
}

.validation-details .table td[b-ibiw0kyh9g] {
    padding: 0.5rem;
    color: var(--vapor-text-main);
}

.validation-details .table td:first-child[b-ibiw0kyh9g] {
    color: var(--vapor-text-muted);
    width: 40%;
}

.validation-details .table strong[b-ibiw0kyh9g] {
    color: var(--vapor-text-main);
    background: transparent !important;
    background-color: transparent !important;
}

.cedula-validation-section .alert[b-ibiw0kyh9g] {
    margin-top: 1rem;
}

.cedula-validation-section .alert-success[b-ibiw0kyh9g] {
    background: rgba(16, 185, 129, 0.15);
    border-color: rgba(16, 185, 129, 0.3);
    color: #34d399;
}

.cedula-validation-section .alert-danger[b-ibiw0kyh9g] {
    background: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.3);
    color: #f87171;
}

.cedula-validation-section .spinner-border[b-ibiw0kyh9g] {
    width: 1rem;
    height: 1rem;
    margin-right: 0.5rem;
}
/* /Components/Pages/EventoDetalle.razor.rz.scp.css */
/* Vapor Theme Evento Detalle Styles */

.evento-detalle-page-wrapper[b-ckxjjhxifx] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.evento-detalle-container[b-ckxjjhxifx] {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 2rem;
    overflow-y: auto;
    margin-top: 72px;
    margin-bottom: 48px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.evento-detalle-container[b-ckxjjhxifx]::-webkit-scrollbar {
    width: 8px;
}

.evento-detalle-container[b-ckxjjhxifx]::-webkit-scrollbar-track {
    background: transparent;
}

.evento-detalle-container[b-ckxjjhxifx]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

.loading-spinner[b-ckxjjhxifx] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.loading-spinner .spinner-border[b-ckxjjhxifx] {
    color: var(--vapor-accent) !important;
    width: 3rem;
    height: 3rem;
    box-shadow: var(--vapor-glow-cyan);
    border-radius: 50%;
}

.error-message[b-ckxjjhxifx] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
    padding: 2rem;
}

.error-message i[b-ckxjjhxifx] {
    font-size: 4rem;
    color: #ef4444;
    margin-bottom: 1.5rem;
}

.error-message h3[b-ckxjjhxifx] {
    color: var(--vapor-text-main);
    margin-bottom: 1rem;
    font-size: 1.75rem;
    font-weight: 700;
}

.error-message p[b-ckxjjhxifx] {
    color: var(--vapor-text-muted);
    margin-bottom: 2rem;
    font-size: 1.05rem;
}

.error-message .btn[b-ckxjjhxifx] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border: none;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 10px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.3);
}

.error-message .btn:hover[b-ckxjjhxifx] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.evento-header[b-ckxjjhxifx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.evento-header .btn[b-ckxjjhxifx] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    color: var(--vapor-accent);
    padding: 0.625rem 1.25rem;
    border-radius: 10px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.evento-header .btn:hover[b-ckxjjhxifx] {
    background: rgba(50, 251, 226, 0.2);
    border-color: var(--vapor-accent);
    transform: translateY(-2px);
    box-shadow: var(--vapor-glow-cyan);
}

.evento-header .btn-outline-warning[b-ckxjjhxifx] {
    background: rgba(251, 191, 36, 0.15);
    border-color: rgba(251, 191, 36, 0.3);
    color: #fbbf24;
}

.evento-header .btn-outline-warning:hover[b-ckxjjhxifx] {
    background: rgba(251, 191, 36, 0.25);
    border-color: rgba(251, 191, 36, 0.5);
}

.evento-header .btn-outline-danger[b-ckxjjhxifx] {
    background: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.3);
    color: #ef4444;
}

.evento-header .btn-outline-danger:hover[b-ckxjjhxifx] {
    background: rgba(239, 68, 68, 0.25);
    border-color: rgba(239, 68, 68, 0.5);
}

.evento-actions[b-ckxjjhxifx] {
    display: flex;
    gap: 0.75rem;
}

.evento-content[b-ckxjjhxifx] {
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
}

.evento-title-section[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    padding: 2rem;
    border-radius: 16px;
    margin-bottom: 2rem;
    border-left: 4px solid;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-left-width: 4px;
}

.evento-title-section h2[b-ckxjjhxifx] {
    color: var(--vapor-text-main);
    margin: 0;
    font-size: 2rem;
    font-weight: 700;
    text-shadow: var(--vapor-glow-cyan);
}

.evento-details-grid[b-ckxjjhxifx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.detail-item[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    padding: 1.5rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.2s ease;
}

.detail-item:hover[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(50, 251, 226, 0.2);
    transform: translateY(-2px);
    box-shadow: var(--vapor-glow-cyan);
}

.detail-label[b-ckxjjhxifx] {
    color: var(--vapor-text-muted);
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.detail-label i[b-ckxjjhxifx] {
    margin-right: 0.5rem;
    color: var(--vapor-accent);
}

.detail-value[b-ckxjjhxifx] {
    color: var(--vapor-text-main);
    font-size: 1.125rem;
    text-transform: capitalize;
    font-weight: 500;
}

.evento-description[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    padding: 2rem;
    border-radius: 16px;
    margin-bottom: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.evento-description h5[b-ckxjjhxifx] {
    color: var(--vapor-text-main);
    margin-bottom: 1rem;
    font-weight: 700;
    font-size: 1.125rem;
}

.evento-description h5 i[b-ckxjjhxifx] {
    color: var(--vapor-accent);
    margin-right: 0.5rem;
}

.evento-description p[b-ckxjjhxifx] {
    color: var(--vapor-text-muted);
    line-height: 1.7;
    margin: 0;
    font-size: 1rem;
}

.evento-metadata[b-ckxjjhxifx] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.5rem;
    background: rgba(10, 5, 20, 0.5);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.evento-metadata small[b-ckxjjhxifx] {
    color: var(--vapor-text-dim);
    font-size: 0.8rem;
}

.status-pill[b-ckxjjhxifx] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: inline-block;
}

.status-agendada[b-ckxjjhxifx] {
    background: rgba(50, 251, 226, 0.1);
    color: var(--vapor-accent);
    border: 1px solid rgba(50, 251, 226, 0.3);
}

.status-enprogreso[b-ckxjjhxifx] {
    background: rgba(234, 57, 184, 0.1);
    color: var(--vapor-secondary);
    border: 1px solid rgba(234, 57, 184, 0.3);
}

.status-completada[b-ckxjjhxifx] {
    background: rgba(111, 66, 193, 0.1);
    color: var(--vapor-primary);
    border: 1px solid rgba(111, 66, 193, 0.3);
}

.status-falta[b-ckxjjhxifx] {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.status-cancelada[b-ckxjjhxifx] {
    background: rgba(148, 163, 184, 0.2);
    color: var(--vapor-text-muted);
    border: 1px solid rgba(148, 163, 184, 0.3);
}

.priority-pill[b-ckxjjhxifx] {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: inline-block;
}

.priority-baja[b-ckxjjhxifx] {
    background: rgba(16, 185, 129, 0.2);
    color: #10b981;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.priority-normal[b-ckxjjhxifx] {
    background: rgba(50, 251, 226, 0.1);
    color: var(--vapor-accent);
    border: 1px solid rgba(50, 251, 226, 0.3);
}

.priority-alta[b-ckxjjhxifx] {
    background: rgba(251, 191, 36, 0.2);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.priority-urgente[b-ckxjjhxifx] {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.note-meta-info[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.meta-item[b-ckxjjhxifx] {
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
}

.meta-item strong[b-ckxjjhxifx] {
    color: var(--vapor-text-main);
}

@media (prefers-reduced-motion: reduce) {
    *[b-ckxjjhxifx],
    *[b-ckxjjhxifx]::before,
    *[b-ckxjjhxifx]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

@media (max-width: 768px) {
    .evento-detalle-container[b-ckxjjhxifx] {
        padding: 1.5rem;
    }

    .evento-header[b-ckxjjhxifx] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }

    .evento-actions[b-ckxjjhxifx] {
        width: 100%;
        justify-content: stretch;
    }

    .evento-actions .btn[b-ckxjjhxifx] {
        flex: 1;
    }

    .evento-details-grid[b-ckxjjhxifx] {
        grid-template-columns: 1fr;
    }

    .evento-title-section h2[b-ckxjjhxifx] {
        font-size: 1.5rem;
    }

    .detail-value[b-ckxjjhxifx] {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .evento-detalle-container[b-ckxjjhxifx] {
        padding: 1rem;
    }

    .evento-title-section[b-ckxjjhxifx] {
        padding: 1.5rem;
    }

    .evento-title-section h2[b-ckxjjhxifx] {
        font-size: 1.25rem;
    }

    .evento-description[b-ckxjjhxifx] {
        padding: 1.5rem;
    }
}

/* Cancel Modal Styles */
.modal-overlay[b-ckxjjhxifx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 1rem;
    animation: fadeIn-b-ckxjjhxifx 0.2s ease;
}

@keyframes fadeIn-b-ckxjjhxifx {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-container[b-ckxjjhxifx] {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    max-width: 450px;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    animation: slideUp-b-ckxjjhxifx 0.3s ease;
}

@keyframes slideUp-b-ckxjjhxifx {
    from { 
        opacity: 0;
        transform: translateY(20px);
    }
    to { 
        opacity: 1;
        transform: translateY(0);
    }
}

.modal-header[b-ckxjjhxifx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.modal-header h3[b-ckxjjhxifx] {
    color: #ef4444;
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-header .btn-close[b-ckxjjhxifx] {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    padding: 0.5rem;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.2s;
}

.modal-header .btn-close:hover[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.modal-body[b-ckxjjhxifx] {
    padding: 1.5rem;
}

.modal-body p[b-ckxjjhxifx] {
    color: #fff;
    margin: 0 0 1rem 0;
    font-size: 1rem;
}

.modal-body .modal-warning[b-ckxjjhxifx] {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.875rem;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.2);
    padding: 0.75rem 1rem;
    border-radius: 8px;
    margin: 0;
}

.modal-footer[b-ckxjjhxifx] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding: 1rem 1.5rem 1.5rem;
}

.modal-footer .btn[b-ckxjjhxifx] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.modal-footer .btn-outline-light[b-ckxjjhxifx] {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
}

.modal-footer .btn-outline-light:hover[b-ckxjjhxifx] {
    background: rgba(255, 255, 255, 0.1);
}

.modal-footer .btn-danger[b-ckxjjhxifx] {
    background: #ef4444;
    border: none;
    color: #fff;
}

.modal-footer .btn-danger:hover:not(:disabled)[b-ckxjjhxifx] {
    background: #dc2626;
}

.modal-footer .btn-danger:disabled[b-ckxjjhxifx] {
    opacity: 0.6;
    cursor: not-allowed;
}
/* /Components/Pages/EventoEditar.razor.rz.scp.css */
/* Vapor Theme Event Edit Component Styles */

.event-edit-page-wrapper[b-o8tbcepvci] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.event-edit-container[b-o8tbcepvci] {
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    flex: 1;
    margin-top: 72px;
    margin-bottom: 48px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.event-edit-container[b-o8tbcepvci]::-webkit-scrollbar {
    width: 8px;
}

.event-edit-container[b-o8tbcepvci]::-webkit-scrollbar-track {
    background: transparent;
}

.event-edit-container[b-o8tbcepvci]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

.event-edit-header[b-o8tbcepvci] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.header-left[b-o8tbcepvci] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.header-left h3[b-o8tbcepvci] {
    color: var(--vapor-text-main);
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: var(--vapor-glow-pink);
}

.header-right[b-o8tbcepvci] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.loading-container[b-o8tbcepvci] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    color: var(--vapor-text-muted);
}

.loading-spinner[b-o8tbcepvci] {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(50, 251, 226, 0.2);
    border-top: 3px solid var(--vapor-accent);
    border-radius: 50%;
    animation: spin-b-o8tbcepvci 1s linear infinite;
    margin-bottom: 1rem;
    box-shadow: var(--vapor-glow-cyan);
}

@keyframes spin-b-o8tbcepvci {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.event-form[b-o8tbcepvci] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.form-row[b-o8tbcepvci] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.form-group[b-o8tbcepvci] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group label[b-o8tbcepvci] {
    color: var(--vapor-text-main);
    font-weight: 600;
    font-size: 0.875rem;
}

.form-input[b-o8tbcepvci],
.form-select[b-o8tbcepvci],
.form-textarea[b-o8tbcepvci] {
    background: rgba(10, 5, 20, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--vapor-text-main);
    padding: 0.75rem 1rem;
    border-radius: 10px;
    font-size: 0.875rem;
    transition: all 0.2s ease;
}

.form-input:focus[b-o8tbcepvci],
.form-select:focus[b-o8tbcepvci],
.form-textarea:focus[b-o8tbcepvci] {
    outline: none;
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
}

.form-textarea[b-o8tbcepvci] {
    resize: vertical;
    min-height: 120px;
    font-family: inherit;
    line-height: 1.6;
}

.form-color[b-o8tbcepvci] {
    width: 100%;
    height: 44px;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(10, 5, 20, 0.8);
}

.form-color:focus[b-o8tbcepvci] {
    outline: none;
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
}

.form-group input[type="checkbox"][b-o8tbcepvci] {
    width: 20px;
    height: 20px;
    margin-right: 0.5rem;
    accent-color: var(--vapor-primary);
}

.form-group label:has(input[type="checkbox"])[b-o8tbcepvci] {
    flex-direction: row;
    align-items: center;
    cursor: pointer;
}

.event-meta-info[b-o8tbcepvci] {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.meta-item[b-o8tbcepvci] {
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
}

.meta-item strong[b-o8tbcepvci] {
    color: var(--vapor-text-main);
}

.error-message[b-o8tbcepvci],
.success-message[b-o8tbcepvci] {
    padding: 1rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.error-message[b-o8tbcepvci] {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #f87171;
}

.success-message[b-o8tbcepvci] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    color: var(--vapor-accent);
}

@media (prefers-reduced-motion: reduce) {
    *[b-o8tbcepvci],
    *[b-o8tbcepvci]::before,
    *[b-o8tbcepvci]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

@media (max-width: 768px) {
    .event-edit-container[b-o8tbcepvci] {
        padding: 1rem;
    }

    .event-edit-header[b-o8tbcepvci] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }

    .header-left[b-o8tbcepvci] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .header-left h3[b-o8tbcepvci] {
        font-size: 1.5rem;
        text-align: center;
    }

    .header-right[b-o8tbcepvci] {
        justify-content: center;
    }

    .form-row[b-o8tbcepvci] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .event-meta-info[b-o8tbcepvci] {
        flex-direction: column;
        gap: 0.5rem;
    }
}

@media (max-width: 480px) {
    .event-edit-container[b-o8tbcepvci] {
        padding: 0.75rem;
        gap: 1rem;
    }

    .header-left h3[b-o8tbcepvci] {
        font-size: 1.25rem;
    }

    .btn[b-o8tbcepvci] {
        padding: 0.625rem 1rem;
        font-size: 0.8rem;
    }

    .form-input[b-o8tbcepvci],
    .form-select[b-o8tbcepvci],
    .form-textarea[b-o8tbcepvci] {
        padding: 0.625rem 0.875rem;
        font-size: 0.8rem;
    }
}
/* /Components/Pages/Expediente.razor.rz.scp.css */
/* ─────────────────────────────────────────────────────────────────────────── */
/* Expediente — Single-scroll dashboard                                       */
/* ─────────────────────────────────────────────────────────────────────────── */

/* ── Layout ──────────────────────────────────────────────────────────────── */
.expediente-wrapper[b-n28ynzvge3] {
    min-height: 100vh;
    padding: 2rem 1.5rem 4rem;
    background: #0a0514;
}

.expediente-container[b-n28ynzvge3] {
    max-width: 1100px;
    margin: 0 auto;
}


/* ── Glass Card ──────────────────────────────────────────────────────────── */
.glass-card[b-n28ynzvge3] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 16px;
    border: 1px solid rgba(148, 163, 184, 0.1);
}

/* ── Hero Header ─────────────────────────────────────────────────────────── */
.hero[b-n28ynzvge3] {
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
}

.hero-top[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.hero-avatar[b-n28ynzvge3] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
    letter-spacing: 0.05em;
    box-shadow: 0 4px 16px rgba(139, 92, 246, 0.3);
}

.hero-info[b-n28ynzvge3] {
    flex: 1;
    min-width: 0;
}

.hero-info h1[b-n28ynzvge3] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0 0 0.35rem;
    line-height: 1.2;
}

.hero-meta[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.hero-detail[b-n28ynzvge3] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.8rem;
}

/* ── Motivo Quote ────────────────────────────────────────────────────────── */
.hero-motivo[b-n28ynzvge3] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-top: 0.85rem;
    padding: 0.65rem 1rem;
    background: rgba(139, 92, 246, 0.08);
    border-left: 3px solid rgba(139, 92, 246, 0.5);
    border-radius: 0 8px 8px 0;
    font-size: 0.88rem;
    color: #c4b5fd;
    line-height: 1.5;
}

.hero-motivo i[b-n28ynzvge3] {
    color: rgba(139, 92, 246, 0.5);
    font-size: 1rem;
    margin-top: 0.1rem;
    flex-shrink: 0;
}

/* ── Status Badges ───────────────────────────────────────────────────────── */
.status-badge[b-n28ynzvge3] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.status-activo[b-n28ynzvge3]    { background: rgba(16, 185, 129, 0.15); color: #34d399; border: 1px solid rgba(16, 185, 129, 0.25); }
.status-enespera[b-n28ynzvge3]  { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border: 1px solid rgba(245, 158, 11, 0.25); }
.status-alta[b-n28ynzvge3]      { background: rgba(6, 182, 212, 0.15);  color: #22d3ee; border: 1px solid rgba(6, 182, 212, 0.25); }
.status-inactivo[b-n28ynzvge3]  { background: rgba(100, 116, 139, 0.2); color: #94a3b8; border: 1px solid rgba(100, 116, 139, 0.3); }
.status-referido[b-n28ynzvge3]  { background: rgba(139, 92, 246, 0.15); color: #a78bfa; border: 1px solid rgba(139, 92, 246, 0.25); }

.etiqueta-chip[b-n28ynzvge3] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.18rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 500;
    background: rgba(139, 92, 246, 0.12);
    color: #c4b5fd;
    border: 1px solid rgba(139, 92, 246, 0.2);
}

/* ── Quick Stats Row ─────────────────────────────────────────────────────── */
.stats-row[b-n28ynzvge3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.stat-card[b-n28ynzvge3] {
    background: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 12px;
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    text-align: center;
    min-height: 88px;
}

.stat-icon[b-n28ynzvge3] {
    font-size: 1.1rem;
    color: #8b5cf6;
    margin-bottom: 0.15rem;
}

.stat-value[b-n28ynzvge3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #e2e8f0;
    line-height: 1.2;
}

.stat-value-sm[b-n28ynzvge3] {
    font-size: 0.95rem;
    font-weight: 600;
}

.stat-label[b-n28ynzvge3] {
    font-size: 0.72rem;
    color: rgba(148, 163, 184, 0.6);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.stat-status-badge[b-n28ynzvge3] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.stat-status-badge.status-activo[b-n28ynzvge3]    { background: rgba(16, 185, 129, 0.15); color: #34d399; border: 1px solid rgba(16, 185, 129, 0.25); }
.stat-status-badge.status-enespera[b-n28ynzvge3]  { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border: 1px solid rgba(245, 158, 11, 0.25); }
.stat-status-badge.status-alta[b-n28ynzvge3]      { background: rgba(6, 182, 212, 0.15);  color: #22d3ee; border: 1px solid rgba(6, 182, 212, 0.25); }
.stat-status-badge.status-inactivo[b-n28ynzvge3]  { background: rgba(100, 116, 139, 0.2); color: #94a3b8; border: 1px solid rgba(100, 116, 139, 0.3); }
.stat-status-badge.status-referido[b-n28ynzvge3]  { background: rgba(139, 92, 246, 0.15); color: #a78bfa; border: 1px solid rgba(139, 92, 246, 0.25); }

.stat-status-dot-inline[b-n28ynzvge3] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.stat-status-dot-inline.status-dot-activo[b-n28ynzvge3]    { background: #34d399; }
.stat-status-dot-inline.status-dot-enespera[b-n28ynzvge3]  { background: #fbbf24; }
.stat-status-dot-inline.status-dot-alta[b-n28ynzvge3]      { background: #22d3ee; }
.stat-status-dot-inline.status-dot-inactivo[b-n28ynzvge3]  { background: #94a3b8; }
.stat-status-dot-inline.status-dot-referido[b-n28ynzvge3]  { background: #a78bfa; }

/* ── Two-Column Layout ───────────────────────────────────────────────────── */
.columns[b-n28ynzvge3] {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 1.25rem;
    align-items: start;
}

.col-left[b-n28ynzvge3],
.col-right[b-n28ynzvge3] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Section Card ────────────────────────────────────────────────────────── */
.section-card[b-n28ynzvge3] {
    padding: 1.5rem 1.75rem;
}

.section-title[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 1rem;
    font-weight: 600;
    color: #e2e8f0;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.section-title i:first-child[b-n28ynzvge3] {
    color: #8b5cf6;
    font-size: 1.1rem;
}

/* ── Collapsible toggle ──────────────────────────────────────────────────── */
.section-toggle[b-n28ynzvge3] {
    cursor: pointer;
    background: none;
    border: none;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    width: 100%;
    text-align: left;
    padding: 0 0 1rem;
    margin-bottom: 0;
}

.section-toggle + *[b-n28ynzvge3] {
    margin-top: 1.25rem;
}

.toggle-icon[b-n28ynzvge3] {
    margin-left: auto;
    color: rgba(148, 163, 184, 0.5);
    font-size: 0.85rem;
    transition: transform 0.2s ease;
}

/* ── Subsection Title ────────────────────────────────────────────────────── */
.subsection-title[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: rgba(148, 163, 184, 0.8);
    margin: 1.5rem 0 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, 0.07);
}

.subsection-title i[b-n28ynzvge3] {
    color: #06b6d4;
}

/* ── Form Grid ───────────────────────────────────────────────────────────── */
.form-grid[b-n28ynzvge3] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.25rem;
}

.form-grid-3[b-n28ynzvge3] {
    grid-template-columns: repeat(3, 1fr);
}

.form-full[b-n28ynzvge3] {
    grid-column: 1 / -1;
    display: block;
}

.form-group[b-n28ynzvge3] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.75rem;
}

.form-group label[b-n28ynzvge3] {
    font-size: 0.8rem;
    font-weight: 500;
    color: rgba(148, 163, 184, 0.7);
    letter-spacing: 0.02em;
}

.required[b-n28ynzvge3] {
    color: #ec4899;
    font-size: 0.75em;
}

/* ── Form Input ──────────────────────────────────────────────────────────── */
.form-input[b-n28ynzvge3] {
    width: 100%;
    background: rgba(15, 5, 40, 0.5);
    border: 1px solid rgba(148, 163, 184, 0.15);
    border-radius: 10px;
    padding: 0.6rem 0.85rem;
    color: #e2e8f0;
    font-size: 0.9rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}

.form-input:focus[b-n28ynzvge3] {
    border-color: rgba(139, 92, 246, 0.6);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12);
}

.form-input[b-n28ynzvge3]::placeholder {
    color: rgba(148, 163, 184, 0.35);
}

select.form-input[b-n28ynzvge3] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    padding-right: 2.25rem;
    cursor: pointer;
}

select.form-input option[b-n28ynzvge3] {
    background: #0f0a1e;
    color: #e2e8f0;
}

.form-textarea[b-n28ynzvge3] {
    min-height: 100px;
    resize: vertical;
    line-height: 1.6;
    font-family: inherit;
}

.form-textarea.tall[b-n28ynzvge3] {
    min-height: 180px;
}

/* ── Save Row ────────────────────────────────────────────────────────────── */
.save-row[b-n28ynzvge3] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    flex-wrap: wrap;
}

.save-msg[b-n28ynzvge3] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 500;
}

.save-msg.success[b-n28ynzvge3] { color: #34d399; }
.save-msg.error[b-n28ynzvge3]   { color: #f87171; }


/* ── Timeline (Sesiones) ─────────────────────────────────────────────────── */
.timeline[b-n28ynzvge3] {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    padding-left: 1.25rem;
}

.timeline[b-n28ynzvge3]::before {
    content: '';
    position: absolute;
    left: 4px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background: rgba(148, 163, 184, 0.1);
    border-radius: 1px;
}

.timeline-item[b-n28ynzvge3] {
    display: flex;
    gap: 0.75rem;
    padding: 0.65rem 0;
    position: relative;
}

.timeline-dot[b-n28ynzvge3] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 0.35rem;
    margin-left: -1.25rem;
    position: relative;
    z-index: 1;
}

.timeline-dot.appt-accepted[b-n28ynzvge3] { background: #34d399; box-shadow: 0 0 6px rgba(52, 211, 153, 0.4); }
.timeline-dot.appt-rejected[b-n28ynzvge3] { background: #f87171; box-shadow: 0 0 6px rgba(248, 113, 113, 0.4); }
.timeline-dot.appt-counter[b-n28ynzvge3]  { background: #fbbf24; box-shadow: 0 0 6px rgba(251, 191, 36, 0.4); }
.timeline-dot.appt-pending[b-n28ynzvge3]  { background: #94a3b8; box-shadow: 0 0 6px rgba(148, 163, 184, 0.3); }

.timeline-content[b-n28ynzvge3] {
    flex: 1;
    min-width: 0;
}

.timeline-header[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.timeline-date-pill[b-n28ynzvge3] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #c4b5fd;
    background: rgba(139, 92, 246, 0.15);
    padding: 0.15rem 0.55rem;
    border-radius: 8px;
}

.timeline-time[b-n28ynzvge3] {
    font-size: 0.78rem;
    color: rgba(148, 163, 184, 0.7);
}

.timeline-note[b-n28ynzvge3] {
    font-size: 0.78rem;
    color: rgba(148, 163, 184, 0.55);
    margin-top: 0.25rem;
    line-height: 1.4;
}

/* ── Appointment Badges ──────────────────────────────────────────────────── */
.appt-badge[b-n28ynzvge3] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}

.appt-accepted[b-n28ynzvge3] { background: rgba(16, 185, 129, 0.15); color: #34d399;  border: 1px solid rgba(16, 185, 129, 0.25); }
.appt-rejected[b-n28ynzvge3] { background: rgba(239, 68, 68, 0.15);  color: #f87171;  border: 1px solid rgba(239, 68, 68, 0.25); }
.appt-counter[b-n28ynzvge3]  { background: rgba(245, 158, 11, 0.15); color: #fbbf24;  border: 1px solid rgba(245, 158, 11, 0.25); }
.appt-pending[b-n28ynzvge3]  { background: rgba(100, 116, 139, 0.2); color: #94a3b8;  border: 1px solid rgba(100, 116, 139, 0.3); }

/* ── Notas List ──────────────────────────────────────────────────────────── */
.notas-list[b-n28ynzvge3] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.notas-list-scroll[b-n28ynzvge3] {
    max-height: 480px;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.notas-list-scroll[b-n28ynzvge3]::-webkit-scrollbar { width: 4px; }
.notas-list-scroll[b-n28ynzvge3]::-webkit-scrollbar-track { background: transparent; }
.notas-list-scroll[b-n28ynzvge3]::-webkit-scrollbar-thumb { background: rgba(139, 92, 246, 0.3); border-radius: 2px; }
.notas-list-scroll[b-n28ynzvge3]::-webkit-scrollbar-thumb:hover { background: rgba(139, 92, 246, 0.5); }

.nota-item[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(15, 5, 40, 0.4);
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.nota-item:hover[b-n28ynzvge3] {
    border-color: rgba(139, 92, 246, 0.3);
    background: rgba(139, 92, 246, 0.05);
}

.nota-info[b-n28ynzvge3] {
    flex: 1;
    min-width: 0;
}

.nota-title[b-n28ynzvge3] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #e2e8f0;
    margin-bottom: 0.15rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nota-preview[b-n28ynzvge3] {
    font-size: 0.78rem;
    color: rgba(148, 163, 184, 0.6);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 0.15rem;
}

.nota-date[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: rgba(148, 163, 184, 0.45);
}

.nota-chevron[b-n28ynzvge3] {
    color: rgba(148, 163, 184, 0.3);
    font-size: 0.8rem;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

.nota-item:hover .nota-chevron[b-n28ynzvge3] {
    color: #8b5cf6;
}

/* ── Empty State ─────────────────────────────────────────────────────────── */
.empty-state[b-n28ynzvge3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: rgba(148, 163, 184, 0.4);
    text-align: center;
}

.empty-state i[b-n28ynzvge3] {
    font-size: 2rem;
    opacity: 0.5;
}

.empty-state p[b-n28ynzvge3] {
    font-size: 0.85rem;
    margin: 0;
}

/* ── Link / Action Buttons ───────────────────────────────────────────────── */
.btn-link[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    background: none;
    border: none;
    color: #8b5cf6;
    font-size: 0.82rem;
    font-weight: 500;
    cursor: pointer;
    padding: 0.65rem 0 0.25rem;
    width: 100%;
    transition: color 0.2s ease;
}

.btn-link:hover[b-n28ynzvge3] {
    color: #a78bfa;
}

.btn-nueva-nota[b-n28ynzvge3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 100%;
    margin-top: 0.85rem;
    padding: 0.55rem 1rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: 1px solid rgba(139, 92, 246, 0.5);
    border-radius: var(--vapor-radius-md);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}

.btn-nueva-nota[b-n28ynzvge3]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.btn-nueva-nota:hover[b-n28ynzvge3] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border-color: rgba(139, 92, 246, 0.6);
    color: #fff;
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    transform: translateY(-1px);
    filter: brightness(1.08);
}

.btn-nueva-nota:hover[b-n28ynzvge3]::before {
    left: 100%;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .columns[b-n28ynzvge3] {
        grid-template-columns: 1fr;
    }

    .stats-row[b-n28ynzvge3] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .expediente-wrapper[b-n28ynzvge3] {
        padding: 1.25rem 1rem 3rem;
    }

    .hero[b-n28ynzvge3] {
        padding: 1rem 1.25rem;
    }

    .hero-info h1[b-n28ynzvge3] {
        font-size: 1.1rem;
    }

    .hero-avatar[b-n28ynzvge3] {
        width: 44px;
        height: 44px;
        font-size: 1rem;
    }

    .stats-row[b-n28ynzvge3] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.5rem;
    }

    .stat-card[b-n28ynzvge3] {
        padding: 0.65rem 0.75rem;
    }

    .stat-value[b-n28ynzvge3] {
        font-size: 1.2rem;
    }

    .section-card[b-n28ynzvge3] {
        padding: 1.25rem;
    }

    .form-grid[b-n28ynzvge3] {
        grid-template-columns: 1fr;
    }

    .form-grid-3[b-n28ynzvge3] {
        grid-template-columns: 1fr;
    }

    .save-row[b-n28ynzvge3] {
        justify-content: stretch;
    }

    .btn-save[b-n28ynzvge3] {
        width: 100%;
        justify-content: center;
    }

    .save-msg[b-n28ynzvge3] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Vapor Theme Home Page Styles */

.home-page-wrapper[b-qpd4nl1o2p] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
}

.home-page-wrapper[b-qpd4nl1o2p]::-webkit-scrollbar {
    width: 10px;
}

.home-page-wrapper[b-qpd4nl1o2p]::-webkit-scrollbar-track {
    background: transparent;
}

.home-page-wrapper[b-qpd4nl1o2p]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 5px;
}

.home-page-wrapper[b-qpd4nl1o2p]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4);
}

.home-container[b-qpd4nl1o2p] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 4rem 2rem;
    width: 100%;
}

.hero-section[b-qpd4nl1o2p] {
    text-align: center;
    padding: 6rem 0 8rem;
    margin-bottom: 4rem;
    position: relative;
    perspective: 2000px;
}

.hero-section[b-qpd4nl1o2p]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, rgba(111, 66, 193, 0.15) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.hero-content[b-qpd4nl1o2p] {
    position: relative;
    z-index: 1;
    transform-style: preserve-3d;
    transition: transform 0.1s ease-out;
}

.hero-icon[b-qpd4nl1o2p] {
    font-size: 6rem;
    color: var(--vapor-primary);
    margin-bottom: 2rem;
    animation: float-b-qpd4nl1o2p 3s ease-in-out infinite, glow-b-qpd4nl1o2p 2s ease-in-out infinite alternate;
    display: inline-block;
    filter: drop-shadow(0 0 20px rgba(139, 92, 246, 0.6)) drop-shadow(0 0 40px rgba(236, 72, 153, 0.4));
}

@keyframes float-b-qpd4nl1o2p {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15px);
    }
}

@keyframes glow-b-qpd4nl1o2p {
    0% {
        filter: drop-shadow(0 0 10px rgba(50, 251, 226, 0.5));
    }
    100% {
        filter: drop-shadow(0 0 25px rgba(234, 57, 184, 0.8));
    }
}

.hero-title[b-qpd4nl1o2p] {
    font-size: 5rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    margin-bottom: 1.5rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-shadow: 0 0 40px rgba(111, 66, 193, 0.4);
}

.hero-title .brand[b-qpd4nl1o2p] {
    background: linear-gradient(135deg, #ffffff 0%, var(--vapor-accent) 50%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
    display: inline-block;
    animation: shimmer-b-qpd4nl1o2p 3s ease-in-out infinite;
}

@keyframes shimmer-b-qpd4nl1o2p {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

.hero-subtitle[b-qpd4nl1o2p] {
    font-size: 2rem;
    color: var(--vapor-text-muted);
    margin-bottom: 2.5rem;
    font-weight: 500;
}

.hero-description[b-qpd4nl1o2p] {
    max-width: 800px;
    margin: 0 auto;
}

.hero-description p[b-qpd4nl1o2p] {
    font-size: 1.25rem;
    color: var(--vapor-text-dim);
    line-height: 1.7;
}

.features-grid[b-qpd4nl1o2p] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin-bottom: 6rem;
}

.feature-card[b-qpd4nl1o2p] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px);
    border-radius: 20px;
    padding: 3rem;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid rgba(255, 255, 255, 0.08);
    position: relative;
    overflow: hidden;
}

.feature-card[b-qpd4nl1o2p]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--vapor-accent), transparent);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.feature-card:hover[b-qpd4nl1o2p]::before {
    opacity: 1;
}

.feature-card:hover[b-qpd4nl1o2p] {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), var(--vapor-glow-cyan);
    border-color: rgba(50, 251, 226, 0.3);
    background: rgba(255, 255, 255, 0.05);
}

.feature-icon[b-qpd4nl1o2p] {
    width: 80px;
    height: 80px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    margin-bottom: 2rem;
    transition: all 0.3s ease;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}

.feature-card:hover .feature-icon[b-qpd4nl1o2p] {
    transform: scale(1.1) rotate(5deg);
}

.chat-icon[b-qpd4nl1o2p] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
    box-shadow: var(--vapor-glow-pink);
}

.calendar-icon[b-qpd4nl1o2p] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    color: #0a0514;
    box-shadow: var(--vapor-glow-cyan);
}

.tools-icon[b-qpd4nl1o2p] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
}

.specialists-icon[b-qpd4nl1o2p] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    color: #0a0514;
}

.feature-card h3[b-qpd4nl1o2p] {
    color: var(--vapor-text-main);
    font-size: 1.8rem;
    margin-bottom: 1.25rem;
    font-weight: 700;
}

.feature-card p[b-qpd4nl1o2p] {
    color: var(--vapor-text-muted);
    line-height: 1.7;
    margin-bottom: 2rem;
    font-size: 1.1rem;
}

.feature-link[b-qpd4nl1o2p] {
    color: var(--vapor-accent);
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    transition: all 0.3s ease;
    font-size: 1.1rem;
}

.feature-link:hover[b-qpd4nl1o2p] {
    color: var(--vapor-primary);
    gap: 1rem;
    transform: translateX(4px);
    text-shadow: var(--vapor-glow-cyan);
}

.feature-link:focus-visible[b-qpd4nl1o2p] {
    outline: none;
    color: var(--vapor-accent);
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.quick-action-btn:focus-visible[b-qpd4nl1o2p] {
    outline: none;
    box-shadow: 0 0 0 4px rgba(50, 251, 226, 0.5), 0 8px 20px rgba(111, 66, 193, 0.3);
}

@media (prefers-reduced-motion: reduce) {
    *[b-qpd4nl1o2p],
    *[b-qpd4nl1o2p]::before,
    *[b-qpd4nl1o2p]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .hero-icon[b-qpd4nl1o2p],
    .hero-title .brand[b-qpd4nl1o2p],
    .quick-action-btn[b-qpd4nl1o2p]::before {
        animation: none !important;
    }
}

.tools-list[b-qpd4nl1o2p] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.tool-badge[b-qpd4nl1o2p] {
    background: rgba(50, 251, 226, 0.1);
    color: var(--vapor-text-muted);
    padding: 0.625rem 1.25rem;
    border-radius: 2rem;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    border: 1px solid rgba(50, 251, 226, 0.2);
    transition: all 0.3s ease;
    font-weight: 500;
}

.tool-badge:hover[b-qpd4nl1o2p] {
    background: rgba(50, 251, 226, 0.2);
    border-color: var(--vapor-accent);
    transform: translateY(-2px);
    color: var(--vapor-text-main);
    box-shadow: var(--vapor-glow-cyan);
}

.tool-badge i[b-qpd4nl1o2p] {
    color: var(--vapor-accent);
    font-size: 1rem;
}

.quick-actions-section[b-qpd4nl1o2p] {
    text-align: center;
    margin-bottom: 6rem;
    padding: 3rem 0;
}

.quick-actions-section h2[b-qpd4nl1o2p] {
    color: var(--vapor-text-main);
    font-size: 3rem;
    margin-bottom: 3rem;
    font-weight: 700;
}

.quick-actions-grid[b-qpd4nl1o2p] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    max-width: 1000px;
    margin: 0 auto 3rem auto;
}

.quick-action-btn[b-qpd4nl1o2p] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border: none;
    color: white;
    padding: 2.5rem;
    border-radius: 20px;
    font-size: 1.3rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    box-shadow: 0 8px 20px rgba(111, 66, 193, 0.3);
    position: relative;
    overflow: hidden;
}

.quick-action-btn[b-qpd4nl1o2p]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.quick-action-btn:hover[b-qpd4nl1o2p]::before {
    left: 100%;
}

.quick-action-btn:hover[b-qpd4nl1o2p] {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 15px 35px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.quick-action-btn i[b-qpd4nl1o2p] {
    font-size: 3rem;
    text-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

.info-section[b-qpd4nl1o2p] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
}

.info-card[b-qpd4nl1o2p] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px);
    border-radius: 20px;
    padding: 2.5rem;
    display: flex;
    gap: 1.5rem;
    align-items: start;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.info-card:hover[b-qpd4nl1o2p] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(50, 251, 226, 0.3);
    transform: translateY(-3px);
    box-shadow: var(--vapor-glow-cyan);
}

.info-card i[b-qpd4nl1o2p] {
    font-size: 2.5rem;
    color: var(--vapor-accent);
    flex-shrink: 0;
    text-shadow: var(--vapor-glow-cyan);
}

.info-card h4[b-qpd4nl1o2p] {
    color: var(--vapor-text-main);
    font-size: 1.4rem;
    margin-bottom: 0.75rem;
    font-weight: 700;
}

.info-card p[b-qpd4nl1o2p] {
    color: var(--vapor-text-muted);
    font-size: 1.05rem;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 768px) {
    .home-container[b-qpd4nl1o2p] {
        padding: 2.5rem 1.25rem;
    }

    .hero-section[b-qpd4nl1o2p] {
        padding: 3rem 0 4rem;
    }

    .hero-icon[b-qpd4nl1o2p] {
        font-size: 4rem;
    }

    .hero-title[b-qpd4nl1o2p] {
        font-size: 3rem;
    }

    .hero-subtitle[b-qpd4nl1o2p] {
        font-size: 1.5rem;
    }

    .hero-description p[b-qpd4nl1o2p] {
        font-size: 1.1rem;
    }

    .features-grid[b-qpd4nl1o2p] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .quick-actions-grid[b-qpd4nl1o2p] {
        grid-template-columns: 1fr;
    }

    .info-section[b-qpd4nl1o2p] {
        grid-template-columns: 1fr;
    }

    .quick-actions-section h2[b-qpd4nl1o2p] {
        font-size: 2.2rem;
    }
}
/* /Components/Pages/MisCitas.razor.rz.scp.css */
.citas-wrapper[b-5p65qx6s60] {
    min-height: 100vh;
    padding: 2rem 1rem;
    background: linear-gradient(180deg, rgba(15, 15, 25, 0.95), rgba(10, 10, 20, 0.98));
}

.citas-container[b-5p65qx6s60] {
    max-width: 800px;
    margin: 0 auto;
}

.page-header[b-5p65qx6s60] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.header-content h1[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #fff;
    font-size: 1.75rem;
    margin: 0 0 0.5rem 0;
}

.header-content h1 i[b-5p65qx6s60] {
    color: var(--accent-primary, #2ecc71);
}

.header-content p[b-5p65qx6s60] {
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
}


.tabs-nav[b-5p65qx6s60] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    padding: 0.5rem;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 12px;
}

.tab[b-5p65qx6s60] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: transparent;
    border: none;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tab:hover[b-5p65qx6s60] {
    color: rgba(255, 255, 255, 0.8);
}

.tab.active[b-5p65qx6s60] {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.tab .badge[b-5p65qx6s60] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: var(--accent-primary, #2ecc71);
    border-radius: 10px;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
}

.loading-state[b-5p65qx6s60],
.empty-state[b-5p65qx6s60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: rgba(255, 255, 255, 0.6);
}

.loading-state .spinner[b-5p65qx6s60],
.empty-state i[b-5p65qx6s60] {
    margin-bottom: 1rem;
}

.spinner[b-5p65qx6s60] {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top-color: var(--accent-primary, #2ecc71);
    border-radius: 50%;
    animation: spin-b-5p65qx6s60 1s linear infinite;
}

@keyframes spin-b-5p65qx6s60 {
    to { transform: rotate(360deg); }
}

.empty-state i[b-5p65qx6s60] {
    font-size: 4rem;
    opacity: 0.4;
}

.empty-state h3[b-5p65qx6s60] {
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0 1rem 0;
}


.appointments-list[b-5p65qx6s60] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.appointment-card[b-5p65qx6s60] {
    display: flex;
    flex-direction: column;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.appointment-card:hover[b-5p65qx6s60] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.2);
    transform: translateY(-2px);
}

.appointment-status[b-5p65qx6s60] {
    margin-bottom: 1rem;
}

.status-badge[b-5p65qx6s60] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-pending[b-5p65qx6s60] {
    background: rgba(241, 196, 15, 0.2);
    color: #f1c40f;
}

.status-confirmed[b-5p65qx6s60] {
    background: rgba(46, 204, 113, 0.2);
    color: #2ecc71;
}

.status-rejected[b-5p65qx6s60] {
    background: rgba(231, 76, 60, 0.2);
    color: #e74c3c;
}

.status-counter[b-5p65qx6s60] {
    background: rgba(52, 152, 219, 0.2);
    color: #3498db;
}

.status-cancelled[b-5p65qx6s60] {
    background: rgba(149, 165, 166, 0.2);
    color: #95a5a6;
}

.appointment-info[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.person-info[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.avatar[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.6);
    font-size: 1.25rem;
}

.details h4[b-5p65qx6s60] {
    margin: 0 0 0.25rem 0;
    color: #fff;
    font-size: 1rem;
}

.details .role[b-5p65qx6s60] {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.5);
}

.date-time[b-5p65qx6s60] {
    display: flex;
    gap: 1.5rem;
}

.date[b-5p65qx6s60],
.time[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
}

.date i[b-5p65qx6s60],
.time i[b-5p65qx6s60] {
    color: var(--accent-primary, #2ecc71);
    font-size: 0.85rem;
}

.quick-actions[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.5);
}

.quick-actions .action-hint[b-5p65qx6s60] {
    font-size: 0.85rem;
}

.quick-actions.counter[b-5p65qx6s60] {
    color: #3498db;
}

.quick-actions.counter .action-hint[b-5p65qx6s60] {
    font-weight: 500;
}

@media (max-width: 600px) {
    .page-header[b-5p65qx6s60] {
        flex-direction: column;
        align-items: stretch;
    }

    .btn-secondary[b-5p65qx6s60] {
        justify-content: center;
    }

    .tabs-nav[b-5p65qx6s60] {
        flex-wrap: wrap;
    }

    .tab[b-5p65qx6s60] {
        flex: 1 1 30%;
        padding: 0.6rem 0.5rem;
        font-size: 0.8rem;
    }

    .appointment-info[b-5p65qx6s60] {
        flex-direction: column;
        align-items: flex-start;
    }

    .date-time[b-5p65qx6s60] {
        width: 100%;
        justify-content: space-between;
    }
}

/* ─── Review Button & Badge ─────────────────────────────────────────────── */

.btn-review[b-5p65qx6s60] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #f5a623, #f7c948);
    border: none;
    border-radius: 8px;
    color: #1a1a2e;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-review:hover[b-5p65qx6s60] {
    transform: scale(1.05);
    box-shadow: 0 0 16px rgba(245, 166, 35, 0.4);
}

.reviewed-badge[b-5p65qx6s60] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.35rem 0.75rem;
    background: rgba(245, 166, 35, 0.15);
    border: 1px solid rgba(245, 166, 35, 0.3);
    border-radius: 8px;
    color: #f5a623;
    font-size: 0.85rem;
    font-weight: 600;
}

.reviewed-badge i[b-5p65qx6s60] {
    font-size: 0.8rem;
}

/* ─── Review Modal ──────────────────────────────────────────────────────── */

.modal-overlay[b-5p65qx6s60] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 1rem;
}

.review-modal[b-5p65qx6s60] {
    background: #1a1a2e;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    width: 100%;
    max-width: 460px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.review-modal-header[b-5p65qx6s60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.review-modal-header h3[b-5p65qx6s60] {
    margin: 0;
    font-size: 1.2rem;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.review-modal-header h3 i[b-5p65qx6s60] {
    color: #f5a623;
}

.btn-close-modal[b-5p65qx6s60] {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0.3rem;
    transition: color 0.2s;
}

.btn-close-modal:hover[b-5p65qx6s60] {
    color: #fff;
}

.review-modal-body[b-5p65qx6s60] {
    padding: 1.5rem;
}

.review-specialist-name[b-5p65qx6s60] {
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    margin: 0 0 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.review-specialist-name i[b-5p65qx6s60] {
    color: var(--accent-primary, #2ecc71);
}

.review-date[b-5p65qx6s60] {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.review-category[b-5p65qx6s60] {
    margin-bottom: 1rem;
}

.review-category label[b-5p65qx6s60] {
    display: block;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 0.4rem;
    font-weight: 500;
}

.star-selector[b-5p65qx6s60] {
    display: flex;
    gap: 0.25rem;
}

.star-btn[b-5p65qx6s60] {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0.2rem;
    transition: transform 0.15s ease;
}

.star-btn i[b-5p65qx6s60] {
    font-size: 1.75rem;
    color: rgba(255, 255, 255, 0.2);
    transition: color 0.15s ease;
}

.star-btn.active i[b-5p65qx6s60],
.star-btn:hover i[b-5p65qx6s60] {
    color: #f5a623;
}

.star-btn:hover[b-5p65qx6s60] {
    transform: scale(1.15);
}

.review-comment-section[b-5p65qx6s60] {
    margin-top: 1.25rem;
}

.review-comment-section label[b-5p65qx6s60] {
    display: block;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 0.4rem;
    font-weight: 500;
}

.label-hint[b-5p65qx6s60] {
    font-weight: 400;
    color: rgba(255, 255, 255, 0.35);
    font-size: 0.8rem;
}

.review-comment-section textarea[b-5p65qx6s60] {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    color: #fff;
    padding: 0.75rem;
    font-size: 0.9rem;
    resize: vertical;
    font-family: inherit;
    transition: border-color 0.2s;
}

.review-comment-section textarea:focus[b-5p65qx6s60] {
    outline: none;
    border-color: rgba(245, 166, 35, 0.5);
}

.review-comment-section textarea[b-5p65qx6s60]::placeholder {
    color: rgba(255, 255, 255, 0.25);
}

.review-error[b-5p65qx6s60] {
    margin-top: 0.75rem;
    padding: 0.6rem 0.75rem;
    background: rgba(231, 76, 60, 0.15);
    border: 1px solid rgba(231, 76, 60, 0.3);
    border-radius: 8px;
    color: #e74c3c;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.review-success[b-5p65qx6s60] {
    margin-top: 0.75rem;
    padding: 0.6rem 0.75rem;
    background: rgba(46, 204, 113, 0.15);
    border: 1px solid rgba(46, 204, 113, 0.3);
    border-radius: 8px;
    color: #2ecc71;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.review-modal-footer[b-5p65qx6s60] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.btn-cancel[b-5p65qx6s60] {
    padding: 0.6rem 1.25rem;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cancel:hover[b-5p65qx6s60] {
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
}

.btn-submit-review[b-5p65qx6s60] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 1.25rem;
    background: linear-gradient(135deg, #f5a623, #f7c948);
    border: none;
    border-radius: 8px;
    color: #1a1a2e;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-submit-review:hover:not(:disabled)[b-5p65qx6s60] {
    transform: scale(1.03);
    box-shadow: 0 0 16px rgba(245, 166, 35, 0.4);
}

.btn-submit-review:disabled[b-5p65qx6s60] {
    opacity: 0.5;
    cursor: not-allowed;
}

.spinner-sm[b-5p65qx6s60] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(26, 26, 46, 0.3);
    border-top-color: #1a1a2e;
    border-radius: 50%;
    animation: spin-b-5p65qx6s60 0.6s linear infinite;
}

@keyframes spin-b-5p65qx6s60 {
    to { transform: rotate(360deg); }
}
/* /Components/Pages/NotaDetalle.razor.rz.scp.css */
/* NotaDetalle — Heali Dark Glass Theme */

/* ── Page Layout ── */

.nd-wrapper[b-ondbnizkty] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.nd-container[b-ondbnizkty] {
    max-width: 800px;
    width: 100%;
    margin: 72px auto 48px;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(139, 92, 246, 0.3) transparent;
}

.nd-container[b-ondbnizkty]::-webkit-scrollbar {
    width: 4px;
}

.nd-container[b-ondbnizkty]::-webkit-scrollbar-track {
    background: transparent;
}

.nd-container[b-ondbnizkty]::-webkit-scrollbar-thumb {
    background: rgba(139, 92, 246, 0.3);
    border-radius: 4px;
}

/* ── Header ── */

.nd-header[b-ondbnizkty] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    margin-bottom: 1.5rem;
}

.nd-back[b-ondbnizkty] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(148, 163, 184, 0.1);
    border-radius: 10px;
    color: rgba(148, 163, 184, 0.7);
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.nd-back:hover[b-ondbnizkty] {
    background: rgba(139, 92, 246, 0.15);
    border-color: rgba(139, 92, 246, 0.4);
    color: #a78bfa;
}

.nd-title[b-ondbnizkty] {
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0 1rem;
    flex: 1;
    background: linear-gradient(135deg, #8b5cf6, #ec4899);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1.3;
}

.nd-actions[b-ondbnizkty] {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
    align-items: center;
    flex-shrink: 0;
}

.nd-pin[b-ondbnizkty] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(148, 163, 184, 0.1);
    border-radius: 10px;
    color: rgba(148, 163, 184, 0.7);
    cursor: pointer;
    transition: all 0.2s ease;
}

.nd-pin:hover[b-ondbnizkty] {
    background: rgba(139, 92, 246, 0.15);
    border-color: rgba(139, 92, 246, 0.4);
    color: #a78bfa;
}

.nd-share[b-ondbnizkty] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(148, 163, 184, 0.1);
    border-radius: 10px;
    color: rgba(148, 163, 184, 0.7);
    cursor: pointer;
    transition: all 0.2s ease;
}

.nd-share:hover[b-ondbnizkty] {
    background: rgba(16, 185, 129, 0.15);
    border-color: rgba(16, 185, 129, 0.4);
    color: #34d399;
}

.nd-share.active[b-ondbnizkty] {
    background: rgba(16, 185, 129, 0.2);
    border-color: rgba(16, 185, 129, 0.5);
    color: #34d399;
}

.nd-shared-badge[b-ondbnizkty] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.5rem;
    background: rgba(16, 185, 129, 0.15);
    border: 1px solid rgba(16, 185, 129, 0.3);
    border-radius: 6px;
    color: #34d399;
    font-size: 0.72rem;
    font-weight: 500;
    margin-left: 0.5rem;
}

.nd-save[b-ondbnizkty] {
    background: linear-gradient(135deg, #8b5cf6, #ec4899);
    border: 1px solid rgba(139, 92, 246, 0.5);
    color: #fff;
    padding: 0.55rem 1.25rem;
    font-weight: 600;
    font-size: 0.88rem;
    border-radius: var(--vapor-radius-md);
    cursor: pointer;
    transition: all 0.25s ease;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    position: relative;
    overflow: hidden;
}

.nd-save[b-ondbnizkty]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.nd-save:hover[b-ondbnizkty] {
    background: linear-gradient(135deg, #8b5cf6, #ec4899);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    filter: brightness(1.08);
}

.nd-save:hover[b-ondbnizkty]::before {
    left: 100%;
}

.nd-save:disabled[b-ondbnizkty] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
    filter: none;
}

.nd-save:disabled[b-ondbnizkty]::before {
    display: none;
}

/* ── Card ── */

.nd-card[b-ondbnizkty] {
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(148, 163, 184, 0.1);
    border-radius: 20px;
    padding: 0;
    overflow: hidden;
}

/* ── Title Input ── */

.nd-title-input[b-ondbnizkty] {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
    padding: 1.25rem 1.5rem;
    font-size: 1.15rem;
    font-weight: 600;
    color: #f1f5f9;
    font-family: inherit;
    transition: border-color 0.2s ease;
}

.nd-title-input[b-ondbnizkty]::placeholder {
    color: rgba(148, 163, 184, 0.35);
}

.nd-title-input:focus[b-ondbnizkty] {
    outline: none;
    border-bottom-color: rgba(139, 92, 246, 0.4);
    box-shadow: inset 0 -1px 0 rgba(139, 92, 246, 0.2);
}

/* ── Meta Row ── */

.nd-meta[b-ondbnizkty] {
    display: flex;
    flex-direction: row;
    gap: 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
    flex-wrap: wrap;
}

.nd-meta-item[b-ondbnizkty] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 1rem;
    border-right: 1px solid rgba(148, 163, 184, 0.06);
    position: relative;
}

.nd-meta-item:last-child[b-ondbnizkty] {
    border-right: none;
}

.nd-meta-item i[b-ondbnizkty] {
    color: rgba(148, 163, 184, 0.45);
    font-size: 0.8rem;
}

.nd-meta-select[b-ondbnizkty] {
    background: transparent;
    border: none;
    color: #e2e8f0;
    font-size: 0.82rem;
    font-family: inherit;
    outline: none;
    cursor: pointer;
    padding: 0;
    appearance: auto;
}

.nd-meta-select option[b-ondbnizkty] {
    background: #0f0a1e;
    color: #e2e8f0;
}

/* ── Content Textarea ── */

.nd-content[b-ondbnizkty] {
    width: 100%;
    border: none;
    background: transparent;
    padding: 1.25rem 1.5rem;
    min-height: 350px;
    resize: vertical;
    color: #e2e8f0;
    font-size: 0.92rem;
    line-height: 1.7;
    font-family: inherit;
}

.nd-content[b-ondbnizkty]::placeholder {
    color: rgba(148, 163, 184, 0.35);
}

.nd-content:focus[b-ondbnizkty] {
    outline: none;
}

/* ── Tags Row ── */

.nd-tags-row[b-ondbnizkty] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    background: rgba(255, 255, 255, 0.02);
}

.nd-tags-row i[b-ondbnizkty] {
    color: rgba(148, 163, 184, 0.4);
    font-size: 0.85rem;
}

.nd-tags-input[b-ondbnizkty] {
    flex: 1;
    background: transparent;
    border: none;
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.82rem;
    font-family: inherit;
    outline: none;
}

.nd-tags-input[b-ondbnizkty]::placeholder {
    color: rgba(148, 163, 184, 0.35);
}

/* ── Footer Meta ── */

.nd-footer-meta[b-ondbnizkty] {
    padding: 0.6rem 1.5rem;
    border-top: 1px solid rgba(148, 163, 184, 0.06);
    font-size: 0.72rem;
    color: rgba(148, 163, 184, 0.4);
}

/* ── Messages ── */

.nd-msg[b-ondbnizkty] {
    padding: 0.75rem 1rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 500;
    margin-top: 1rem;
}

.nd-msg-error[b-ondbnizkty] {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.25);
    color: #f87171;
}

.nd-msg-success[b-ondbnizkty] {
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.25);
    color: #34d399;
}

/* ── Shared Note Header ── */

.nd-shared-header[b-ondbnizkty] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: rgba(139, 92, 246, 0.1);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 12px;
    margin-bottom: 1rem;
    color: #a78bfa;
    font-size: 0.9rem;
}

.nd-shared-header strong[b-ondbnizkty] {
    color: #e2e8f0;
}

/* ── Read-Only Card ── */

.nd-readonly[b-ondbnizkty] {
    border-color: rgba(16, 185, 129, 0.15);
}

.nd-title-display[b-ondbnizkty] {
    width: 100%;
    padding: 1.25rem 1.5rem;
    font-size: 1.15rem;
    font-weight: 600;
    color: #f1f5f9;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}

.nd-meta-value[b-ondbnizkty] {
    color: #e2e8f0;
    font-size: 0.82rem;
}

.nd-content-display[b-ondbnizkty] {
    width: 100%;
    padding: 1.25rem 1.5rem;
    min-height: 350px;
    color: #e2e8f0;
    font-size: 0.92rem;
    line-height: 1.7;
    white-space: pre-wrap;
}

.nd-tags-readonly[b-ondbnizkty] {
    flex-wrap: wrap;
    gap: 0.35rem;
}

.nd-tag[b-ondbnizkty] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 6px;
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.75rem;
    font-weight: 500;
}

/* ── Accessibility ── */

@media (prefers-reduced-motion: reduce) {
    *[b-ondbnizkty],
    *[b-ondbnizkty]::before,
    *[b-ondbnizkty]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ── Responsive: Tablet ── */

@media (max-width: 768px) {
    .nd-container[b-ondbnizkty] {
        padding: 1rem;
    }

    .nd-title[b-ondbnizkty] {
        font-size: 1.1rem;
    }

    .nd-meta[b-ondbnizkty] {
        flex-wrap: wrap;
    }

    .nd-meta-item[b-ondbnizkty] {
        border-right: none;
        border-bottom: 1px solid rgba(148, 163, 184, 0.06);
    }

    .nd-title-input[b-ondbnizkty] {
        padding: 1rem 1.25rem;
        font-size: 1rem;
    }

    .nd-content[b-ondbnizkty] {
        padding: 1rem 1.25rem;
        min-height: 250px;
    }
}

/* ── Responsive: Mobile ── */

@media (max-width: 480px) {
    .nd-header[b-ondbnizkty] {
        flex-wrap: wrap;
    }

    .nd-title[b-ondbnizkty] {
        order: -1;
        width: 100%;
        margin: 0 0 0.75rem;
    }

    .nd-content[b-ondbnizkty] {
        min-height: 200px;
    }
}
/* /Components/Pages/Notas.razor.rz.scp.css */
.notas-page-wrapper[b-8414cu6pf0] {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1;
}

.notas-container[b-8414cu6pf0] {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    flex: 1;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(139, 92, 246, 0.3) transparent;
}

.notas-container[b-8414cu6pf0]::-webkit-scrollbar { width: 4px; }
.notas-container[b-8414cu6pf0]::-webkit-scrollbar-track { background: transparent; }
.notas-container[b-8414cu6pf0]::-webkit-scrollbar-thumb { background: rgba(139, 92, 246, 0.3); border-radius: 2px; }

/* ─── Page Header ────────────────────────────────────────── */

.notas-header[b-8414cu6pf0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.notas-header h3[b-8414cu6pf0] {
    margin: 0;
    font-size: 2rem;
    font-weight: 700;
    background: linear-gradient(135deg, #a78bfa 0%, #f9a8d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1.2;
}

.notas-actions[b-8414cu6pf0] {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

/* ─── Search Box ─────────────────────────────────────────── */

.search-box[b-8414cu6pf0] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-box input[b-8414cu6pf0] {
    background: rgba(30, 41, 59, 0.5);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(148, 163, 184, 0.08);
    color: #e2e8f0;
    padding: 0.7rem 1rem 0.7rem 2.5rem;
    border-radius: 12px;
    font-size: 0.9rem;
    width: 260px;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.search-box input[b-8414cu6pf0]::placeholder { color: rgba(148, 163, 184, 0.4); }

.search-box input:focus[b-8414cu6pf0] {
    outline: none;
    border-color: rgba(139, 92, 246, 0.4);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
}

.search-box i[b-8414cu6pf0] {
    position: absolute;
    left: 0.85rem;
    color: rgba(148, 163, 184, 0.4);
    font-size: 0.9rem;
    pointer-events: none;
}

/* ─── Filter Select ──────────────────────────────────────── */

.filter-select[b-8414cu6pf0] {
    background: rgba(30, 41, 59, 0.5);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(148, 163, 184, 0.08);
    color: #e2e8f0;
    padding: 0.7rem 1rem;
    border-radius: 12px;
    font-size: 0.9rem;
    min-width: 150px;
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
}

.filter-select:focus[b-8414cu6pf0] {
    border-color: rgba(139, 92, 246, 0.4);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
}

.filter-select option[b-8414cu6pf0] {
    background: #0f0a1e;
    color: #e2e8f0;
}

/* ─── Notes Grid ─────────────────────────────────────────── */

.notes-grid[b-8414cu6pf0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1.5rem;
}

/* ─── Note Card ──────────────────────────────────────────── */

.note-card[b-8414cu6pf0] {
    background: rgba(15, 23, 42, 0.5);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 0;
    cursor: pointer;
    transition: all 0.25s ease;
    border: 1px solid rgba(148, 163, 184, 0.06);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.note-card:hover[b-8414cu6pf0] {
    border-color: rgba(139, 92, 246, 0.25);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.1), 0 4px 8px rgba(0, 0, 0, 0.2);
}

.note-card.pinned[b-8414cu6pf0] {
    border-color: rgba(245, 158, 11, 0.2);
}

.note-card.pinned:hover[b-8414cu6pf0] {
    border-color: rgba(245, 158, 11, 0.3);
    box-shadow: 0 8px 24px rgba(245, 158, 11, 0.08), 0 4px 8px rgba(0, 0, 0, 0.2);
}

.note-card.urgent[b-8414cu6pf0] {
    border-left: 3px solid #ef4444;
}

.note-card.high[b-8414cu6pf0] {
    border-left: 3px solid #f59e0b;
}

/* ─── Shared Note Styles ─────────────────────────────────── */

.note-card.shared-note[b-8414cu6pf0] {
    cursor: pointer;
    border-color: rgba(16, 185, 129, 0.15);
}

.note-card.shared-note:hover[b-8414cu6pf0] {
    border-color: rgba(16, 185, 129, 0.25);
    box-shadow: 0 8px 24px rgba(16, 185, 129, 0.1), 0 4px 8px rgba(0, 0, 0, 0.2);
}

.note-shared-badge[b-8414cu6pf0] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.6rem;
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-radius: 6px;
    color: #34d399;
    font-size: 0.7rem;
    font-weight: 500;
    z-index: 1;
}

.note-specialist-badge[b-8414cu6pf0] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #a78bfa;
    background: rgba(139, 92, 246, 0.08);
    border: 1px solid rgba(139, 92, 246, 0.12);
    border-radius: 8px;
    padding: 0.25rem 0.6rem;
    margin: 0 1.5rem 1rem;
}

/* ─── Card Header ────────────────────────────────────────── */

.note-pin[b-8414cu6pf0] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: #fbbf24;
    font-size: 0.85rem;
    z-index: 1;
}

.note-header[b-8414cu6pf0] {
    padding: 1.25rem 1.5rem 0;
}

.note-title[b-8414cu6pf0] {
    color: #f1f5f9;
    font-weight: 600;
    font-size: 1rem;
    margin: 0 0 0.75rem 0;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 2rem;
}

.note-meta[b-8414cu6pf0] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.note-category[b-8414cu6pf0] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 500;
    color: #c4b5fd;
    background: rgba(139, 92, 246, 0.1);
}

.note-priority[b-8414cu6pf0] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 500;
}

.priority-low[b-8414cu6pf0] {
    background: rgba(16, 185, 129, 0.1);
    color: #34d399;
}

.priority-normal[b-8414cu6pf0] {
    background: rgba(100, 116, 139, 0.1);
    color: #94a3b8;
}

.priority-high[b-8414cu6pf0] {
    background: rgba(245, 158, 11, 0.1);
    color: #fbbf24;
}

.priority-urgent[b-8414cu6pf0] {
    background: rgba(239, 68, 68, 0.1);
    color: #f87171;
}

/* ─── Card Content ───────────────────────────────────────── */

.note-content[b-8414cu6pf0] {
    color: rgba(148, 163, 184, 0.6);
    font-size: 0.875rem;
    line-height: 1.6;
    padding: 1rem 1.5rem;
    max-height: 4.2rem;
    overflow: hidden;
    flex: 1;
}

/* ─── Patient Badge ──────────────────────────────────────── */

.note-paciente-badge[b-8414cu6pf0] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #34d399;
    background: rgba(16, 185, 129, 0.08);
    border: 1px solid rgba(16, 185, 129, 0.12);
    border-radius: 8px;
    padding: 0.25rem 0.6rem;
    margin: 0 1.5rem 1rem;
}

/* ─── Tags ───────────────────────────────────────────────── */

.note-tags[b-8414cu6pf0] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0 1.5rem;
    margin-bottom: 1rem;
}

.tag[b-8414cu6pf0] {
    background: rgba(255, 255, 255, 0.04);
    color: rgba(148, 163, 184, 0.5);
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 400;
}

/* ─── Card Footer ────────────────────────────────────────── */

.note-footer[b-8414cu6pf0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.5rem;
    border-top: 1px solid rgba(148, 163, 184, 0.04);
    background: rgba(0, 0, 0, 0.08);
    margin-top: auto;
}

.note-date[b-8414cu6pf0] {
    color: rgba(148, 163, 184, 0.35);
    font-size: 0.75rem;
    font-weight: 400;
}

.note-actions[b-8414cu6pf0] {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

.note-shared-icon[b-8414cu6pf0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #34d399;
    font-size: 0.85rem;
    padding: 0.25rem;
}

/* ─── Empty State ────────────────────────────────────────── */

.empty-state[b-8414cu6pf0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 6rem 2rem;
    gap: 1rem;
}

.empty-state i[b-8414cu6pf0] {
    font-size: 3rem;
    color: #a78bfa;
    opacity: 0.3;
}

.empty-state h4[b-8414cu6pf0] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #e2e8f0;
    margin: 0;
}

.empty-state p[b-8414cu6pf0] {
    font-size: 0.9rem;
    color: rgba(148, 163, 184, 0.5);
    max-width: 320px;
    line-height: 1.6;
    margin: 0;
}

/* ─── Accessibility ──────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
    *[b-8414cu6pf0],
    *[b-8414cu6pf0]::before,
    *[b-8414cu6pf0]::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ─── Responsive: Tablet ─────────────────────────────────── */

@media (max-width: 768px) {
    .notas-container[b-8414cu6pf0] {
        padding: 2rem 1.25rem;
    }

    .notas-header[b-8414cu6pf0] {
        flex-direction: column;
        align-items: stretch;
    }

    .notas-header h3[b-8414cu6pf0] {
        font-size: 1.5rem;
        text-align: center;
    }

    .notas-actions[b-8414cu6pf0] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box input[b-8414cu6pf0] {
        width: 100%;
    }

    .filter-select[b-8414cu6pf0] {
        width: 100%;
    }

    .notes-grid[b-8414cu6pf0] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* ─── Responsive: Mobile ─────────────────────────────────── */

@media (max-width: 480px) {
    .notas-container[b-8414cu6pf0] {
        padding: 1.5rem 1rem;
        gap: 1.5rem;
    }

    .notas-header h3[b-8414cu6pf0] {
        font-size: 1.35rem;
    }

    .note-header[b-8414cu6pf0] {
        padding: 1rem 1.25rem 0;
    }

    .note-title[b-8414cu6pf0] {
        font-size: 0.95rem;
    }

    .note-content[b-8414cu6pf0] {
        padding: 0.75rem 1.25rem;
        font-size: 0.85rem;
    }

    .note-tags[b-8414cu6pf0] {
        padding: 0 1.25rem;
    }

    .note-paciente-badge[b-8414cu6pf0],
    .note-specialist-badge[b-8414cu6pf0] {
        margin: 0 1.25rem 0.75rem;
    }

    .note-footer[b-8414cu6pf0] {
        padding: 0.75rem 1.25rem;
    }
}
/* /Components/Pages/Notificaciones.razor.rz.scp.css */
.notificaciones-page[b-cv3aekq5zt] {
    min-height: 100vh;
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
}

.page-header[b-cv3aekq5zt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.header-content h1[b-cv3aekq5zt] {
    margin: 0 0 0.25rem 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    color: var(--vapor-text-main);
    background: linear-gradient(135deg, #fff 0%, rgba(255, 255, 255, 0.8) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.header-subtitle[b-cv3aekq5zt] {
    margin: 0;
    font-size: 0.95rem;
    color: var(--vapor-text-muted);
}

.header-actions[b-cv3aekq5zt] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.btn-action[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border: none;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(111, 66, 193, 0.3);
}

.btn-action:hover[b-cv3aekq5zt] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.btn-action.btn-secondary[b-cv3aekq5zt] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: none;
}

.btn-action.btn-secondary:hover[b-cv3aekq5zt] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(234, 57, 184, 0.4);
    box-shadow: 0 0 20px rgba(234, 57, 184, 0.2);
}

.filters-bar[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.filter-group[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-group label[b-cv3aekq5zt] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--vapor-text-muted);
}

.filter-select[b-cv3aekq5zt] {
    padding: 0.5rem 2rem 0.5rem 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--vapor-text-main);
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23888' d='M6 8L2 4h8z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
}

.filter-select:hover[b-cv3aekq5zt],
.filter-select:focus[b-cv3aekq5zt] {
    border-color: rgba(50, 251, 226, 0.4);
    outline: none;
    box-shadow: var(--vapor-glow-cyan);
}

.filter-select option[b-cv3aekq5zt] {
    background: #1a1025;
    color: var(--vapor-text-main);
}

.filter-stats[b-cv3aekq5zt] {
    display: flex;
    gap: 1rem;
    margin-left: auto;
}

.filter-stats .stat[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    color: var(--vapor-text-muted);
}

.filter-stats .stat i[b-cv3aekq5zt] {
    color: var(--vapor-accent);
}

.notifications-container[b-cv3aekq5zt] {
    min-height: 400px;
}

.loading-state[b-cv3aekq5zt],
.empty-state[b-cv3aekq5zt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.loading-state .spinner[b-cv3aekq5zt],
.spinner[b-cv3aekq5zt] {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top-color: var(--vapor-accent);
    border-radius: 50%;
    animation: spin-b-cv3aekq5zt 0.8s linear infinite;
}

.spinner-sm[b-cv3aekq5zt] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-cv3aekq5zt 0.8s linear infinite;
}

@keyframes spin-b-cv3aekq5zt {
    to { transform: rotate(360deg); }
}

.loading-state p[b-cv3aekq5zt] {
    margin-top: 1rem;
    color: var(--vapor-text-muted);
}

.empty-state i[b-cv3aekq5zt] {
    font-size: 4rem;
    color: var(--vapor-text-muted);
    opacity: 0.3;
    margin-bottom: 1rem;
}

.empty-state h3[b-cv3aekq5zt] {
    margin: 0 0 0.5rem 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.25rem;
    color: var(--vapor-text-main);
}

.empty-state p[b-cv3aekq5zt] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--vapor-text-muted);
}

.notifications-list[b-cv3aekq5zt] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.notification-group[b-cv3aekq5zt] {
    margin-bottom: 0.5rem;
}

.group-header[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0;
}

.group-title[b-cv3aekq5zt] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--vapor-text-muted);
}

.group-count[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: rgba(111, 66, 193, 0.2);
    color: var(--vapor-accent);
    font-size: 0.7rem;
    font-weight: 600;
}

.notification-card[b-cv3aekq5zt] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.notification-card:hover[b-cv3aekq5zt] {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
    transform: translateX(4px);
}

.notification-card.unread[b-cv3aekq5zt] {
    background: rgba(50, 251, 226, 0.03);
    border-color: rgba(50, 251, 226, 0.15);
}

.notification-card.unread:hover[b-cv3aekq5zt] {
    background: rgba(50, 251, 226, 0.06);
}

.notification-card.priority-urgent[b-cv3aekq5zt] {
    border-left: 3px solid #ef4444;
}

.notification-card.priority-high[b-cv3aekq5zt] {
    border-left: 3px solid #f59e0b;
}

.unread-bar[b-cv3aekq5zt] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--vapor-accent), var(--vapor-secondary));
}

.notification-icon[b-cv3aekq5zt] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.notification-icon.type-success[b-cv3aekq5zt] {
    background: rgba(34, 197, 94, 0.15);
    color: #22c55e;
}

.notification-icon.type-error[b-cv3aekq5zt] {
    background: rgba(234, 57, 184, 0.15);
    color: #ea39b8;
}

.notification-icon.type-warning[b-cv3aekq5zt] {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
}

.notification-icon.type-info[b-cv3aekq5zt] {
    background: rgba(50, 251, 226, 0.15);
    color: #32fbe2;
}

.notification-icon.type-system[b-cv3aekq5zt] {
    background: rgba(111, 66, 193, 0.15);
    color: #6f42c1;
}

.notification-body[b-cv3aekq5zt] {
    flex: 1;
    min-width: 0;
}

.notification-header[b-cv3aekq5zt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.4rem;
}

.notification-title[b-cv3aekq5zt] {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--vapor-text-main);
    line-height: 1.3;
}

.notification-card.unread .notification-title[b-cv3aekq5zt] {
    color: #fff;
}

.notification-time[b-cv3aekq5zt] {
    flex-shrink: 0;
    font-size: 0.75rem;
    color: var(--vapor-text-muted);
}

.notification-message[b-cv3aekq5zt] {
    margin: 0 0 0.5rem 0;
    font-size: 0.875rem;
    color: var(--vapor-text-muted);
    line-height: 1.5;
}

.notification-meta[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
    font-size: 0.8rem;
    color: var(--vapor-accent);
}

.notification-tags[b-cv3aekq5zt] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.tag[b-cv3aekq5zt] {
    padding: 0.25rem 0.6rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 500;
}

.type-tag[b-cv3aekq5zt] {
    background: rgba(111, 66, 193, 0.15);
    color: #a78bfa;
}

.priority-tag[b-cv3aekq5zt] {
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
}

.notification-actions[b-cv3aekq5zt] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.notification-card:hover .notification-actions[b-cv3aekq5zt] {
    opacity: 1;
}


.read-indicator[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(50, 251, 226, 0.1);
    color: var(--vapor-accent);
    font-size: 0.875rem;
}

.load-more[b-cv3aekq5zt] {
    display: flex;
    justify-content: center;
    padding: 2rem 0;
}

.btn-load-more[b-cv3aekq5zt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--vapor-text-main);
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-load-more:hover:not(:disabled)[b-cv3aekq5zt] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(50, 251, 226, 0.4);
    box-shadow: var(--vapor-glow-cyan);
}

.btn-load-more:disabled[b-cv3aekq5zt] {
    opacity: 0.6;
    cursor: not-allowed;
}

@media (max-width: 768px) {
    .notificaciones-page[b-cv3aekq5zt] {
        padding: 1rem;
    }

    .page-header[b-cv3aekq5zt] {
        flex-direction: column;
        align-items: stretch;
    }

    .header-content h1[b-cv3aekq5zt] {
        font-size: 1.5rem;
    }

    .header-actions[b-cv3aekq5zt] {
        justify-content: stretch;
    }

    .header-actions .btn-action[b-cv3aekq5zt] {
        flex: 1;
        justify-content: center;
    }

    .filters-bar[b-cv3aekq5zt] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }

    .filter-group[b-cv3aekq5zt] {
        width: 100%;
    }

    .filter-select[b-cv3aekq5zt] {
        flex: 1;
    }

    .filter-stats[b-cv3aekq5zt] {
        margin-left: 0;
        justify-content: center;
    }

    .notification-card[b-cv3aekq5zt] {
        padding: 1rem;
    }

    .notification-icon[b-cv3aekq5zt] {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }

    .notification-header[b-cv3aekq5zt] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .notification-actions[b-cv3aekq5zt] {
        flex-direction: row;
        opacity: 1;
    }
}

@media (max-width: 480px) {
    .notification-tags[b-cv3aekq5zt] {
        display: none;
    }

    .notification-message[b-cv3aekq5zt] {
        font-size: 0.8rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .notification-card[b-cv3aekq5zt],
    .btn-action[b-cv3aekq5zt],
    .btn-icon[b-cv3aekq5zt],
    .btn-load-more[b-cv3aekq5zt],
    .filter-select[b-cv3aekq5zt] {
        transition: none;
    }

    .spinner[b-cv3aekq5zt],
    .spinner-sm[b-cv3aekq5zt] {
        animation: none;
    }
}
/* /Components/Pages/PacienteDetalle.razor.rz.scp.css */
/* ─────────────────────────────────────────────────────────────────────────── */
/* PacienteDetalle — Scoped CSS                                                */
/* ─────────────────────────────────────────────────────────────────────────── */

/* ── Layout ──────────────────────────────────────────────────────────────── */
.detalle-wrapper[b-9hcc16jlyg] {
    min-height: 100vh;
    padding: 2rem 1.5rem 4rem;
    background: #0a0514;
}

.detalle-container[b-9hcc16jlyg] {
    max-width: 900px;
    margin: 0 auto;
}


/* ── Create Mode Header ──────────────────────────────────────────────────── */
.create-header[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin-bottom: 1.75rem;
}

.create-icon[b-9hcc16jlyg] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #fff;
    flex-shrink: 0;
}

.create-title-group h1[b-9hcc16jlyg] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0;
    line-height: 1.2;
}

.create-subtitle[b-9hcc16jlyg] {
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.9rem;
    margin: 0.25rem 0 0;
}

/* ── Glass Card ──────────────────────────────────────────────────────────── */
.glass-card[b-9hcc16jlyg] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 16px;
    border: 1px solid rgba(148, 163, 184, 0.1);
}

/* ── Patient Hero ────────────────────────────────────────────────────────── */
.patient-hero[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem 1.75rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.hero-avatar[b-9hcc16jlyg] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
    letter-spacing: 0.05em;
    box-shadow: 0 4px 20px rgba(139, 92, 246, 0.35);
}

.hero-info[b-9hcc16jlyg] {
    flex: 1;
    min-width: 0;
}

.hero-info h1[b-9hcc16jlyg] {
    font-size: 1.6rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0 0 0.5rem;
    line-height: 1.2;
}

.hero-meta[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.hero-since[b-9hcc16jlyg],
.hero-age[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.82rem;
}

/* ── Status Badges ───────────────────────────────────────────────────────── */
.status-badge[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.status-activo[b-9hcc16jlyg]    { background: rgba(16, 185, 129, 0.15); color: #34d399; border: 1px solid rgba(16, 185, 129, 0.25); }
.status-enespera[b-9hcc16jlyg]  { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border: 1px solid rgba(245, 158, 11, 0.25); }
.status-alta[b-9hcc16jlyg]      { background: rgba(6, 182, 212, 0.15);  color: #22d3ee; border: 1px solid rgba(6, 182, 212, 0.25); }
.status-inactivo[b-9hcc16jlyg]  { background: rgba(100, 116, 139, 0.2); color: #94a3b8; border: 1px solid rgba(100, 116, 139, 0.3); }
.status-referido[b-9hcc16jlyg]  { background: rgba(139, 92, 246, 0.15); color: #a78bfa; border: 1px solid rgba(139, 92, 246, 0.25); }

/* ── Etiqueta Chip ───────────────────────────────────────────────────────── */
.etiqueta-chip[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    background: rgba(139, 92, 246, 0.12);
    color: #c4b5fd;
    border: 1px solid rgba(139, 92, 246, 0.2);
}

/* ── Delete Button ───────────────────────────────────────────────────────── */
.btn-danger-outline[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: none;
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #f87171;
    font-size: 0.83rem;
    font-weight: 500;
    padding: 0.5rem 1rem;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: auto;
    flex-shrink: 0;
}

.btn-danger-outline:hover[b-9hcc16jlyg] {
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.65);
    color: #fca5a5;
}

/* ── Tab Bar ─────────────────────────────────────────────────────────────── */
.tab-bar[b-9hcc16jlyg] {
    display: flex;
    gap: 0.25rem;
    background: rgba(15, 5, 40, 0.6);
    border-radius: 12px;
    padding: 0.35rem;
    margin-bottom: 1.25rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid rgba(148, 163, 184, 0.08);
    scrollbar-width: none;
}

.tab-bar[b-9hcc16jlyg]::-webkit-scrollbar { display: none; }

.tab-btn[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
    flex-shrink: 0;
    padding: 0.55rem 1rem;
    border-radius: 9px;
    border: none;
    background: none;
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.86rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tab-btn:hover[b-9hcc16jlyg] {
    background: rgba(139, 92, 246, 0.1);
    color: #c4b5fd;
}

.tab-btn.active[b-9hcc16jlyg] {
    background: rgba(139, 92, 246, 0.2);
    color: #8b5cf6;
    font-weight: 600;
    border: 1px solid rgba(139, 92, 246, 0.25);
}

.tab-badge[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 10px;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

/* ── Section Card ────────────────────────────────────────────────────────── */
.section-card[b-9hcc16jlyg] {
    padding: 1.75rem 2rem;
    margin-bottom: 1.25rem;
}

/* ── Section Title ───────────────────────────────────────────────────────── */
.section-title[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 1rem;
    font-weight: 600;
    color: #e2e8f0;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.section-title i[b-9hcc16jlyg] {
    color: #8b5cf6;
    font-size: 1.1rem;
}

/* ── Subsection Title ────────────────────────────────────────────────────── */
.subsection-title[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: rgba(148, 163, 184, 0.8);
    margin: 1.5rem 0 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, 0.07);
}

.subsection-title i[b-9hcc16jlyg] {
    color: #06b6d4;
}

/* ── Form Grid ───────────────────────────────────────────────────────────── */
.form-grid[b-9hcc16jlyg] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.25rem;
}

.form-grid-3[b-9hcc16jlyg] {
    grid-template-columns: repeat(3, 1fr);
}

.form-full[b-9hcc16jlyg] {
    grid-column: 1 / -1;
    display: block;
}

/* ── Form Group ──────────────────────────────────────────────────────────── */
.form-group[b-9hcc16jlyg] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.form-group label[b-9hcc16jlyg] {
    font-size: 0.8rem;
    font-weight: 500;
    color: rgba(148, 163, 184, 0.7);
    letter-spacing: 0.02em;
}

.required[b-9hcc16jlyg] {
    color: #ec4899;
    font-size: 0.75em;
}

/* ── Form Input ──────────────────────────────────────────────────────────── */
.form-input[b-9hcc16jlyg] {
    width: 100%;
    background: rgba(15, 5, 40, 0.5);
    border: 1px solid rgba(148, 163, 184, 0.15);
    border-radius: 10px;
    padding: 0.6rem 0.85rem;
    color: #e2e8f0;
    font-size: 0.9rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}

.form-input:focus[b-9hcc16jlyg] {
    border-color: rgba(139, 92, 246, 0.6);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12);
}

.form-input[b-9hcc16jlyg]::placeholder {
    color: rgba(148, 163, 184, 0.35);
}

/* select arrow */
select.form-input[b-9hcc16jlyg] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    padding-right: 2.25rem;
    cursor: pointer;
}

select.form-input option[b-9hcc16jlyg] {
    background: #0f0a1e;
    color: #e2e8f0;
}

/* ── Textarea ────────────────────────────────────────────────────────────── */
.form-textarea[b-9hcc16jlyg] {
    min-height: 120px;
    resize: vertical;
    line-height: 1.6;
    font-family: inherit;
}

.form-textarea.tall[b-9hcc16jlyg] {
    min-height: 200px;
}

/* ── Save Row ────────────────────────────────────────────────────────────── */
.save-row[b-9hcc16jlyg] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    flex-wrap: wrap;
}

/* ── Save Message ────────────────────────────────────────────────────────── */
.save-msg[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 500;
}

.save-msg.success[b-9hcc16jlyg] { color: #34d399; }
.save-msg.error[b-9hcc16jlyg]   { color: #f87171; }


/* ── Citas List ──────────────────────────────────────────────────────────── */
.citas-list[b-9hcc16jlyg] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cita-item[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: rgba(15, 5, 40, 0.4);
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    transition: border-color 0.2s ease;
}

.cita-item:hover[b-9hcc16jlyg] {
    border-color: rgba(139, 92, 246, 0.25);
}

.cita-date-block[b-9hcc16jlyg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    background: rgba(139, 92, 246, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.3);
    border-radius: 10px;
    padding: 0.4rem 0.5rem;
    flex-shrink: 0;
}

.cita-day[b-9hcc16jlyg] {
    font-size: 1.3rem;
    font-weight: 700;
    color: #c4b5fd;
    line-height: 1;
}

.cita-month[b-9hcc16jlyg] {
    font-size: 0.65rem;
    font-weight: 600;
    color: rgba(196, 181, 253, 0.7);
    letter-spacing: 0.05em;
    line-height: 1.2;
}

.cita-year[b-9hcc16jlyg] {
    font-size: 0.65rem;
    color: rgba(196, 181, 253, 0.5);
    line-height: 1.2;
}

.cita-info[b-9hcc16jlyg] {
    flex: 1;
    min-width: 0;
}

.cita-time[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.88rem;
    font-weight: 500;
    color: #e2e8f0;
    margin-bottom: 0.25rem;
}

.cita-note[b-9hcc16jlyg] {
    font-size: 0.82rem;
    color: rgba(148, 163, 184, 0.7);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Appointment Status Badges ───────────────────────────────────────────── */
.appt-badge[b-9hcc16jlyg] {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.65rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}

.appt-accepted[b-9hcc16jlyg] { background: rgba(16, 185, 129, 0.15); color: #34d399;  border: 1px solid rgba(16, 185, 129, 0.25); }
.appt-rejected[b-9hcc16jlyg] { background: rgba(239, 68, 68, 0.15);  color: #f87171;  border: 1px solid rgba(239, 68, 68, 0.25); }
.appt-counter[b-9hcc16jlyg]  { background: rgba(245, 158, 11, 0.15); color: #fbbf24;  border: 1px solid rgba(245, 158, 11, 0.25); }
.appt-pending[b-9hcc16jlyg]  { background: rgba(100, 116, 139, 0.2); color: #94a3b8;  border: 1px solid rgba(100, 116, 139, 0.3); }

/* ── Notas List ──────────────────────────────────────────────────────────── */
.notas-list[b-9hcc16jlyg] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.nota-item[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: rgba(15, 5, 40, 0.4);
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 12px;
    padding: 1rem 1.25rem;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.nota-item:hover[b-9hcc16jlyg] {
    border-color: rgba(139, 92, 246, 0.3);
    background: rgba(139, 92, 246, 0.05);
}

.nota-icon[b-9hcc16jlyg] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(139, 92, 246, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a78bfa;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.nota-info[b-9hcc16jlyg] {
    flex: 1;
    min-width: 0;
}

.nota-title[b-9hcc16jlyg] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #e2e8f0;
    margin-bottom: 0.2rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nota-preview[b-9hcc16jlyg] {
    font-size: 0.8rem;
    color: rgba(148, 163, 184, 0.65);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 0.2rem;
}

.nota-date[b-9hcc16jlyg] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    color: rgba(148, 163, 184, 0.5);
}

.nota-chevron[b-9hcc16jlyg] {
    color: rgba(148, 163, 184, 0.35);
    font-size: 0.85rem;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

.nota-item:hover .nota-chevron[b-9hcc16jlyg] {
    color: #8b5cf6;
}

/* ── Empty State ─────────────────────────────────────────────────────────── */
.tab-empty[b-9hcc16jlyg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: rgba(148, 163, 184, 0.45);
    text-align: center;
}

.tab-empty i[b-9hcc16jlyg] {
    font-size: 2.5rem;
    opacity: 0.5;
}

.tab-empty p[b-9hcc16jlyg] {
    font-size: 0.9rem;
    margin: 0;
}

/* ── Delete Modal ────────────────────────────────────────────────────────── */
.modal-overlay[b-9hcc16jlyg] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9000;
    padding: 1rem;
}

.modal-card[b-9hcc16jlyg] {
    background: rgba(22, 13, 51, 0.95);
    border: 1px solid rgba(239, 68, 68, 0.25);
    border-radius: 18px;
    padding: 2rem;
    max-width: 420px;
    width: 100%;
    text-align: center;
    backdrop-filter: blur(20px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.modal-icon[b-9hcc16jlyg] {
    font-size: 2.5rem;
    color: #f97316;
    margin-bottom: 1rem;
}

.modal-title[b-9hcc16jlyg] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0 0 0.75rem;
}

.modal-body[b-9hcc16jlyg] {
    font-size: 0.9rem;
    color: rgba(148, 163, 184, 0.8);
    line-height: 1.6;
    margin: 0 0 1.5rem;
}

.modal-body strong[b-9hcc16jlyg] {
    color: #e2e8f0;
}

.modal-actions[b-9hcc16jlyg] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
}

.btn-modal-cancel[b-9hcc16jlyg] {
    flex: 1;
    background: rgba(148, 163, 184, 0.1);
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 10px;
    color: rgba(148, 163, 184, 0.8);
    font-size: 0.88rem;
    font-weight: 500;
    padding: 0.65rem 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-modal-cancel:hover[b-9hcc16jlyg] {
    background: rgba(148, 163, 184, 0.18);
    color: #e2e8f0;
}

.btn-modal-delete[b-9hcc16jlyg] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
    border: none;
    border-radius: 10px;
    color: #fff;
    font-size: 0.88rem;
    font-weight: 600;
    padding: 0.65rem 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-modal-delete:hover[b-9hcc16jlyg] {
    opacity: 0.88;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(220, 38, 38, 0.35);
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    .detalle-wrapper[b-9hcc16jlyg] {
        padding: 1.25rem 1rem 3rem;
    }

    .patient-hero[b-9hcc16jlyg] {
        padding: 1.25rem;
    }

    .hero-info h1[b-9hcc16jlyg] {
        font-size: 1.25rem;
    }

    .hero-avatar[b-9hcc16jlyg] {
        width: 56px;
        height: 56px;
        font-size: 1.25rem;
    }

    .btn-danger-outline[b-9hcc16jlyg] {
        margin-left: 0;
        width: 100%;
        justify-content: center;
        margin-top: 0.5rem;
    }

    .form-grid[b-9hcc16jlyg] {
        grid-template-columns: 1fr;
    }

    .form-grid-3[b-9hcc16jlyg] {
        grid-template-columns: 1fr;
    }

    .section-card[b-9hcc16jlyg] {
        padding: 1.25rem;
    }

    .save-row[b-9hcc16jlyg] {
        justify-content: stretch;
    }

    .btn-save[b-9hcc16jlyg] {
        width: 100%;
        justify-content: center;
    }

    .save-msg[b-9hcc16jlyg] {
        width: 100%;
        justify-content: center;
    }

    .tab-btn[b-9hcc16jlyg] {
        font-size: 0.8rem;
        padding: 0.5rem 0.75rem;
    }

    .cita-item[b-9hcc16jlyg] {
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .modal-actions[b-9hcc16jlyg] {
        flex-direction: column;
    }

    .create-header[b-9hcc16jlyg] {
        flex-direction: column;
        text-align: center;
    }

    .create-title-group h1[b-9hcc16jlyg] {
        font-size: 1.4rem;
    }
}
/* /Components/Pages/Pacientes.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   PACIENTES PAGE — v3 Compact Glass Cards
   Dark/glass theme · Status accents · Refined layout
   ═══════════════════════════════════════════════════════════ */

.pacientes-wrapper[b-v3jhklyzps] {
    min-height: 100vh;
    width: 100%;
    padding-bottom: 4rem;
}

.pacientes-container[b-v3jhklyzps] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
}

/* ─── Page Header ────────────────────────────────────────── */

.pacientes-header[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}

.header-title-group[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.header-icon-wrap[b-v3jhklyzps] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #fff;
    flex-shrink: 0;
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.4);
}

.header-text h1[b-v3jhklyzps] {
    font-size: 1.75rem;
    font-weight: 800;
    margin: 0;
    background: linear-gradient(135deg, #a78bfa 0%, #f9a8d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1.2;
}

.header-subtitle[b-v3jhklyzps] {
    font-size: 0.85rem;
    color: rgba(148, 163, 184, 0.65);
    margin: 0.2rem 0 0;
}

.count-badge[b-v3jhklyzps] {
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.3);
    color: #a78bfa;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 0.25rem 0.8rem;
    border-radius: 999px;
    backdrop-filter: blur(8px);
}

.pinned-summary[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.25);
    color: #fbbf24;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.3rem 0.8rem;
    border-radius: 999px;
    animation: pinGlow-b-v3jhklyzps 2.5s ease-in-out infinite;
}

@keyframes pinGlow-b-v3jhklyzps {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
    50%       { box-shadow: 0 0 12px 2px rgba(245, 158, 11, 0.15); }
}

/* ─── Filters ────────────────────────────────────────────── */

.filters-bar[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.search-box[b-v3jhklyzps] {
    position: relative;
    flex: 1;
    min-width: 220px;
    max-width: 360px;
}

.search-icon[b-v3jhklyzps] {
    position: absolute;
    left: 0.9rem;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(148, 163, 184, 0.5);
    font-size: 0.9rem;
    pointer-events: none;
}

.search-input[b-v3jhklyzps] {
    width: 100%;
    background: rgba(30, 41, 59, 0.65);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(148, 163, 184, 0.1);
    border-radius: 12px;
    color: #e2e8f0;
    font-size: 0.9rem;
    padding: 0.65rem 2.5rem 0.65rem 2.5rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.search-input[b-v3jhklyzps]::placeholder { color: rgba(148, 163, 184, 0.45); }

.search-input:focus[b-v3jhklyzps] {
    border-color: rgba(139, 92, 246, 0.5);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12);
}

.search-clear[b-v3jhklyzps] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: rgba(148, 163, 184, 0.6);
    cursor: pointer;
    font-size: 1rem;
    padding: 0;
    line-height: 1;
    transition: color 0.2s;
}

.search-clear:hover[b-v3jhklyzps] { color: #e2e8f0; }

.status-pills[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.status-pill[b-v3jhklyzps] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.9rem;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.12);
    background: rgba(30, 41, 59, 0.5);
    color: rgba(148, 163, 184, 0.7);
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    backdrop-filter: blur(8px);
    white-space: nowrap;
}

.status-pill:hover[b-v3jhklyzps] {
    border-color: rgba(139, 92, 246, 0.35);
    color: #a78bfa;
    background: rgba(139, 92, 246, 0.08);
}

.status-pill.active[b-v3jhklyzps] {
    background: rgba(139, 92, 246, 0.2);
    border-color: rgba(139, 92, 246, 0.45);
    color: #a78bfa;
    box-shadow: 0 0 10px rgba(139, 92, 246, 0.18);
}

.pill-dot[b-v3jhklyzps] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}
.pill-dot.activo[b-v3jhklyzps]   { background: #22c55e; }
.pill-dot.enespera[b-v3jhklyzps] { background: #eab308; }
.pill-dot.alta[b-v3jhklyzps]     { background: #06b6d4; }
.pill-dot.inactivo[b-v3jhklyzps] { background: rgba(148, 163, 184, 0.5); }
.pill-dot.referido[b-v3jhklyzps] { background: #a78bfa; }

/* ─── Sort ───────────────────────────────────────────────── */

.sort-bar[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.sort-label[b-v3jhklyzps] {
    font-size: 0.8rem;
    color: rgba(148, 163, 184, 0.5);
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-right: 0.2rem;
}

.sort-btn[b-v3jhklyzps] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: rgba(30, 41, 59, 0.5);
    border: 1px solid rgba(148, 163, 184, 0.1);
    color: rgba(148, 163, 184, 0.6);
    padding: 0.32rem 0.85rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.sort-btn:hover[b-v3jhklyzps] {
    border-color: rgba(139, 92, 246, 0.3);
    color: #a78bfa;
}

.sort-btn.active[b-v3jhklyzps] {
    background: rgba(139, 92, 246, 0.15);
    border-color: rgba(139, 92, 246, 0.4);
    color: #a78bfa;
    font-weight: 600;
}

/* ─── Section Labels ─────────────────────────────────────── */

.section-label[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #fbbf24;
    margin-bottom: 0.85rem;
    padding-left: 0.25rem;
}

.section-label--rest[b-v3jhklyzps] {
    color: rgba(148, 163, 184, 0.5);
    margin-top: 2rem;
}

/* ─── Grid ───────────────────────────────────────────────── */

.pacientes-grid[b-v3jhklyzps] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1rem;
}

.pinned-grid[b-v3jhklyzps] {
    margin-bottom: 0.25rem;
}

/* ═══════════════════════════════════════════════════════════
   PATIENT CARD — Compact glass design
   ═══════════════════════════════════════════════════════════ */

.paciente-card[b-v3jhklyzps] {
    position: relative;
    display: flex;
    flex-direction: column;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 20px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.35s ease,
                border-color 0.35s ease;
}

.paciente-card:hover[b-v3jhklyzps] {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
    border-color: rgba(255, 255, 255, 0.12);
}

.paciente-card.s-activo:hover[b-v3jhklyzps]   { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(16, 185, 129, 0.12); border-color: rgba(16, 185, 129, 0.3); }
.paciente-card.s-enespera:hover[b-v3jhklyzps] { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(245, 158, 11, 0.12); border-color: rgba(245, 158, 11, 0.3); }
.paciente-card.s-alta:hover[b-v3jhklyzps]     { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(6, 182, 212, 0.12); border-color: rgba(6, 182, 212, 0.3); }
.paciente-card.s-inactivo:hover[b-v3jhklyzps] { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4); border-color: rgba(100, 116, 139, 0.25); }
.paciente-card.s-referido:hover[b-v3jhklyzps] { box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(139, 92, 246, 0.12); border-color: rgba(139, 92, 246, 0.3); }

.paciente-card.pinned[b-v3jhklyzps] {
    border-color: rgba(251, 191, 36, 0.2);
}

.paciente-card.pinned:hover[b-v3jhklyzps] {
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(245, 158, 11, 0.12);
    border-color: rgba(251, 191, 36, 0.4);
}

/* Top accent bar */
.card-top-bar[b-v3jhklyzps] {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    opacity: 0;
    transition: opacity 0.35s ease;
    z-index: 2;
}

.paciente-card:hover .card-top-bar[b-v3jhklyzps] { opacity: 1; }
.card-top-bar.always-on[b-v3jhklyzps]             { opacity: 1; }

.card-top-bar.s-activo[b-v3jhklyzps]   { background: linear-gradient(90deg, #10b981, #34d399); }
.card-top-bar.s-enespera[b-v3jhklyzps] { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.card-top-bar.s-alta[b-v3jhklyzps]     { background: linear-gradient(90deg, #06b6d4, #67e8f9); }
.card-top-bar.s-inactivo[b-v3jhklyzps] { background: linear-gradient(90deg, #64748b, #94a3b8); }
.card-top-bar.s-referido[b-v3jhklyzps] { background: linear-gradient(90deg, #8b5cf6, #a78bfa); }

/* ─── Card Header ────────────────────────────────────────── */

.pc-header[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1.15rem 1.25rem 0.85rem;
    position: relative;
}

.pc-avatar[b-v3jhklyzps] {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.paciente-card:hover .pc-avatar[b-v3jhklyzps] { transform: scale(1.08); }

.pc-avatar.s-activo[b-v3jhklyzps]   { background: linear-gradient(135deg, #059669, #34d399); box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3); }
.pc-avatar.s-enespera[b-v3jhklyzps] { background: linear-gradient(135deg, #d97706, #fbbf24); box-shadow: 0 4px 16px rgba(245, 158, 11, 0.3); }
.pc-avatar.s-alta[b-v3jhklyzps]     { background: linear-gradient(135deg, #0891b2, #67e8f9); box-shadow: 0 4px 16px rgba(6, 182, 212, 0.3); }
.pc-avatar.s-inactivo[b-v3jhklyzps] { background: linear-gradient(135deg, #475569, #94a3b8); box-shadow: 0 4px 12px rgba(100, 116, 139, 0.2); }
.pc-avatar.s-referido[b-v3jhklyzps] { background: linear-gradient(135deg, #7c3aed, #a78bfa); box-shadow: 0 4px 16px rgba(139, 92, 246, 0.3); }

.pc-initials[b-v3jhklyzps] {
    color: #fff;
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
    user-select: none;
    position: relative;
    z-index: 1;
}

.pc-pulse[b-v3jhklyzps] {
    position: absolute;
    inset: -3px;
    border-radius: 17px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    animation: pcPulse-b-v3jhklyzps 2s ease-in-out infinite;
    pointer-events: none;
}

@keyframes pcPulse-b-v3jhklyzps {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50%       { opacity: 1;    transform: scale(1.06); }
}

.pc-identity[b-v3jhklyzps] {
    flex: 1;
    min-width: 0;
}

.pc-name[b-v3jhklyzps] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #f1f5f9;
    margin: 0;
    line-height: 1.3;
    letter-spacing: -0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pc-name.pc-name--email[b-v3jhklyzps] {
    font-style: italic;
    font-weight: 500;
    font-size: 0.88rem;
    color: rgba(148, 163, 184, 0.7);
}

.pc-demo[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.pc-chip[b-v3jhklyzps] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.68rem;
    font-weight: 500;
    color: rgba(148, 163, 184, 0.7);
    background: rgba(255, 255, 255, 0.04);
    border-radius: 5px;
    padding: 0.1rem 0.4rem;
}

.pc-chip--tag[b-v3jhklyzps] {
    background: rgba(139, 92, 246, 0.1);
    color: #c4b5fd;
}

.pc-status-area[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-shrink: 0;
}

.pc-status-dot[b-v3jhklyzps] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: block;
    flex-shrink: 0;
}
.pc-status-dot.s-activo[b-v3jhklyzps]   { background: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.15); animation: pcDotPulse-b-v3jhklyzps 2s infinite; }
.pc-status-dot.s-enespera[b-v3jhklyzps] { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15); }
.pc-status-dot.s-alta[b-v3jhklyzps]     { background: #06b6d4; box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.15); }
.pc-status-dot.s-inactivo[b-v3jhklyzps] { background: rgba(100, 116, 139, 0.5); }
.pc-status-dot.s-referido[b-v3jhklyzps] { background: #8b5cf6; box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15); }

@keyframes pcDotPulse-b-v3jhklyzps {
    0%, 100% { box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2); }
    50%       { box-shadow: 0 0 0 5px rgba(16, 185, 129, 0.08); }
}

.pc-pin[b-v3jhklyzps] {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    border: none;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(148, 163, 184, 0.35);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    transition: all 0.22s ease;
    flex-shrink: 0;
}

.pc-pin:hover[b-v3jhklyzps] {
    background: rgba(245, 158, 11, 0.18);
    color: #fbbf24;
    transform: rotate(-12deg) scale(1.1);
}

.pc-pin.active[b-v3jhklyzps] {
    background: rgba(245, 158, 11, 0.18);
    color: #fbbf24;
    border: 1px solid rgba(245, 158, 11, 0.3);
}

.pc-pin.active:hover[b-v3jhklyzps] {
    background: rgba(245, 158, 11, 0.28);
    transform: none;
}

/* ─── Status + Motivo Band ───────────────────────────────── */

.pc-band[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 1.25rem;
    background: rgba(255, 255, 255, 0.02);
    flex-wrap: wrap;
}

.pc-status-badge[b-v3jhklyzps] {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0.18rem 0.6rem;
    border-radius: 999px;
    letter-spacing: 0.03em;
    white-space: nowrap;
    flex-shrink: 0;
}
.pc-status-badge.s-activo[b-v3jhklyzps]   { background: rgba(16, 185, 129, 0.15); color: #34d399; border: 1px solid rgba(16, 185, 129, 0.25); }
.pc-status-badge.s-enespera[b-v3jhklyzps] { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border: 1px solid rgba(245, 158, 11, 0.25); }
.pc-status-badge.s-alta[b-v3jhklyzps]     { background: rgba(6, 182, 212, 0.15);  color: #67e8f9; border: 1px solid rgba(6, 182, 212, 0.25); }
.pc-status-badge.s-inactivo[b-v3jhklyzps] { background: rgba(100, 116, 139, 0.15); color: #94a3b8; border: 1px solid rgba(100, 116, 139, 0.2); }
.pc-status-badge.s-referido[b-v3jhklyzps] { background: rgba(139, 92, 246, 0.15); color: #a78bfa; border: 1px solid rgba(139, 92, 246, 0.25); }

.pc-motivo[b-v3jhklyzps] {
    font-size: 0.78rem;
    color: rgba(148, 163, 184, 0.55);
    font-style: italic;
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ─── Stats Body ─────────────────────────────────────────── */

.pc-body[b-v3jhklyzps] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    padding: 0.5rem 1.25rem;
    flex: 1;
}

.pc-stat[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 0;
}

.pc-stat:nth-child(odd)[b-v3jhklyzps] {
    padding-right: 0.6rem;
    border-right: 1px solid rgba(255, 255, 255, 0.04);
}

.pc-stat:nth-child(even)[b-v3jhklyzps] {
    padding-left: 0.6rem;
}

.pc-stat:nth-child(-n+2)[b-v3jhklyzps] {
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.pc-stat-icon[b-v3jhklyzps] {
    font-size: 0.85rem;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    flex-shrink: 0;
}

.pc-stat-icon.apt[b-v3jhklyzps]    { background: rgba(139, 92, 246, 0.12); color: #a78bfa; }
.pc-stat-icon.notes[b-v3jhklyzps]  { background: rgba(6, 182, 212, 0.1);  color: #67e8f9; }
.pc-stat-icon.last[b-v3jhklyzps]   { background: rgba(255, 255, 255, 0.04); color: rgba(148, 163, 184, 0.6); }
.pc-stat-icon.activity-alta[b-v3jhklyzps]  { background: rgba(16, 185, 129, 0.12); color: #34d399; }
.pc-stat-icon.activity-media[b-v3jhklyzps] { background: rgba(245, 158, 11, 0.1); color: #fbbf24; }
.pc-stat-icon.activity-baja[b-v3jhklyzps]  { background: rgba(100, 116, 139, 0.1); color: #94a3b8; }

.pc-stat-text[b-v3jhklyzps] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}

.pc-stat-val[b-v3jhklyzps] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #e2e8f0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pc-stat-val.activity-alta[b-v3jhklyzps]  { color: #34d399; }
.pc-stat-val.activity-media[b-v3jhklyzps] { color: #fbbf24; }
.pc-stat-val.activity-baja[b-v3jhklyzps]  { color: #94a3b8; }

.pc-stat-lbl[b-v3jhklyzps] {
    font-size: 0.62rem;
    color: rgba(148, 163, 184, 0.45);
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ─── Footer ─────────────────────────────────────────────── */

.pc-footer[b-v3jhklyzps] {
    padding: 0.65rem 1.25rem 1rem;
    margin-top: auto;
}

.pc-alerts[b-v3jhklyzps] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    margin-bottom: 0.6rem;
}

.pc-alert[b-v3jhklyzps] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.12rem 0.4rem;
    border-radius: 5px;
}

.pc-alert.allergy[b-v3jhklyzps] { background: rgba(239, 68, 68, 0.12); color: #fca5a5; border: 1px solid rgba(239, 68, 68, 0.18); }
.pc-alert.meds[b-v3jhklyzps]    { background: rgba(6, 182, 212, 0.08);  color: #67e8f9; border: 1px solid rgba(6, 182, 212, 0.15); }

.pc-since[b-v3jhklyzps] {
    font-size: 0.65rem;
    color: rgba(148, 163, 184, 0.35);
}

/* CTA button */
.pc-cta[b-v3jhklyzps] {
    width: 100%;
    padding: 0.6rem 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: var(--vapor-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: 1px solid rgba(139, 92, 246, 0.5);
    color: #fff;
    letter-spacing: 0.02em;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.pc-cta[b-v3jhklyzps]::before {
    content: '';
    position: absolute;
    top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.4s ease;
    pointer-events: none;
}

.paciente-card:hover .pc-cta[b-v3jhklyzps] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    color: #fff;
    border-color: rgba(139, 92, 246, 0.6);
    box-shadow: 0 6px 24px rgba(139, 92, 246, 0.4), 0 2px 8px rgba(236, 72, 153, 0.2);
    filter: brightness(1.08);
    transform: translateY(-1px);
}

.paciente-card:hover .pc-cta[b-v3jhklyzps]::before { left: 100%; }

.pc-cta i[b-v3jhklyzps] { transition: transform 0.3s ease; font-size: 0.85rem; }
.paciente-card:hover .pc-cta i[b-v3jhklyzps] { transform: translateX(2px); }

/* ─── Empty States ───────────────────────────────────────── */

.empty-state[b-v3jhklyzps] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 5rem 2rem;
    gap: 1rem;
}

.empty-icon-wrap[b-v3jhklyzps] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(236, 72, 153, 0.15));
    border: 1px solid rgba(139, 92, 246, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
    color: #a78bfa;
    margin-bottom: 0.5rem;
    box-shadow: 0 8px 32px rgba(139, 92, 246, 0.15);
}

.empty-icon-wrap.secondary[b-v3jhklyzps] {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.15), rgba(139, 92, 246, 0.12));
    border-color: rgba(6, 182, 212, 0.2);
    color: #67e8f9;
}

.empty-state h2[b-v3jhklyzps] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #e2e8f0;
    margin: 0;
}

.empty-state p[b-v3jhklyzps] {
    font-size: 0.9rem;
    color: rgba(148, 163, 184, 0.65);
    max-width: 380px;
    line-height: 1.55;
    margin: 0;
}

.btn-clear-filters[b-v3jhklyzps] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.6rem 1.25rem;
    border-radius: 12px;
    border: 1px solid rgba(6, 182, 212, 0.3);
    background: rgba(6, 182, 212, 0.1);
    color: #67e8f9;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    margin-top: 0.5rem;
    text-decoration: none;
}

.btn-clear-filters:hover[b-v3jhklyzps] {
    background: rgba(6, 182, 212, 0.18);
    border-color: rgba(6, 182, 212, 0.5);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(6, 182, 212, 0.2);
}

/* ─── Responsive ─────────────────────────────────────────── */

@media (max-width: 768px) {
    .pacientes-container[b-v3jhklyzps] {
        padding: 1.5rem 1rem;
    }

    .pacientes-header[b-v3jhklyzps] {
        flex-direction: column;
        align-items: flex-start;
    }

    .filters-bar[b-v3jhklyzps] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box[b-v3jhklyzps] {
        max-width: 100%;
    }

    .status-pills[b-v3jhklyzps] {
        gap: 0.35rem;
    }

    .pacientes-grid[b-v3jhklyzps] {
        grid-template-columns: 1fr;
        gap: 0.85rem;
    }

    .header-text h1[b-v3jhklyzps] { font-size: 1.4rem; }

    .pc-avatar[b-v3jhklyzps] { width: 44px; height: 44px; }
    .pc-initials[b-v3jhklyzps] { font-size: 1.05rem; }
    .pc-name[b-v3jhklyzps] { font-size: 0.95rem; }
}

@media (max-width: 480px) {
    .status-pill[b-v3jhklyzps] {
        font-size: 0.75rem;
        padding: 0.32rem 0.65rem;
    }

    .pc-body[b-v3jhklyzps] {
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/Pages/PassphraseRecover.razor.rz.scp.css */
/* Vapor Theme Passphrase Recover Styles */

.passphrase-page-wrapper[b-mrk3g1qjt1] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: transparent; /* Handled by global body style */
}

.passphrase-container[b-mrk3g1qjt1] {
    max-width: 500px;
    width: 100%;
}

.passphrase-card[b-mrk3g1qjt1] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 3rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 40px rgba(111, 66, 193, 0.2), var(--vapor-glow-pink);
    text-align: center;
}

.passphrase-icon[b-mrk3g1qjt1] {
    width: 80px;
    height: 80px;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: white;
    box-shadow: 0 10px 30px rgba(111, 66, 193, 0.3), var(--vapor-glow-pink);
}

.passphrase-icon.recover[b-mrk3g1qjt1] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    box-shadow: 0 10px 30px rgba(50, 251, 226, 0.3), var(--vapor-glow-cyan);
}

.passphrase-title[b-mrk3g1qjt1] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    margin-bottom: 1rem;
    text-shadow: var(--vapor-glow-cyan);
}

.passphrase-subtitle[b-mrk3g1qjt1] {
    color: var(--vapor-text-muted);
    font-size: 1.1rem;
    margin-bottom: 2.5rem;
    line-height: 1.6;
}

.passphrase-subtitle strong[b-mrk3g1qjt1] {
    color: var(--vapor-accent);
}

.passphrase-form[b-mrk3g1qjt1] {
    margin-bottom: 2rem;
}

.form-group[b-mrk3g1qjt1] {
    margin-bottom: 1.5rem;
    text-align: left;
}

.passphrase-input[b-mrk3g1qjt1] {
    width: 100%;
    padding: 1rem 1.25rem;
    font-size: 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    background: rgba(10, 5, 20, 0.6);
    color: var(--vapor-text-main);
    transition: all 0.3s ease;
}

.passphrase-input:focus[b-mrk3g1qjt1] {
    outline: none;
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 4px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
}

.passphrase-input[b-mrk3g1qjt1]::placeholder {
    color: var(--vapor-text-dim);
}

.passphrase-btn[b-mrk3g1qjt1] {
    width: 100%;
    padding: 1.25rem;
    font-size: 1.2rem;
    font-weight: 700;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    box-shadow: 0 8px 20px rgba(111, 66, 193, 0.3);
    margin-bottom: 1rem;
}

.passphrase-btn:hover:not(:disabled)[b-mrk3g1qjt1] {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.passphrase-btn:disabled[b-mrk3g1qjt1] {
    opacity: 0.6;
    cursor: not-allowed;
}

.secondary-link[b-mrk3g1qjt1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--vapor-text-muted);
    text-decoration: none;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.secondary-link:hover[b-mrk3g1qjt1] {
    color: var(--vapor-accent);
    gap: 0.75rem;
    text-shadow: var(--vapor-glow-cyan);
}

.error-message[b-mrk3g1qjt1] {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #f87171;
    padding: 1rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.success-banner[b-mrk3g1qjt1] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    color: var(--vapor-accent);
    padding: 1rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.passphrase-info[b-mrk3g1qjt1] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    border-radius: 12px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--vapor-text-muted);
    font-size: 0.95rem;
}

.passphrase-info.warning[b-mrk3g1qjt1] {
    background: rgba(245, 158, 11, 0.15);
    border-color: rgba(245, 158, 11, 0.3);
}

.passphrase-info.warning i[b-mrk3g1qjt1] {
    color: #fbbf24;
}

.passphrase-info i[b-mrk3g1qjt1] {
    color: var(--vapor-accent);
    font-size: 1.25rem;
    flex-shrink: 0;
}

.passphrase-info p[b-mrk3g1qjt1] {
    margin: 0;
    text-align: left;
}

@media (max-width: 640px) {
    .passphrase-card[b-mrk3g1qjt1] {
        padding: 2rem 1.5rem;
    }
    
    .passphrase-title[b-mrk3g1qjt1] {
        font-size: 1.75rem;
    }
    
    .passphrase-subtitle[b-mrk3g1qjt1] {
        font-size: 1rem;
    }
}
/* /Components/Pages/PassphraseSetup.razor.rz.scp.css */
/* Vapor Theme Passphrase Setup Styles */

.passphrase-page-wrapper[b-v4pi4sfmcs] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: transparent; /* Handled by global body style */
}

.passphrase-container[b-v4pi4sfmcs] {
    max-width: 500px;
    width: 100%;
}

.passphrase-card[b-v4pi4sfmcs] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 3rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 40px rgba(111, 66, 193, 0.2), var(--vapor-glow-pink);
    text-align: center;
}

.passphrase-icon[b-v4pi4sfmcs] {
    width: 80px;
    height: 80px;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: white;
    box-shadow: 0 10px 30px rgba(111, 66, 193, 0.3), var(--vapor-glow-pink);
}

.passphrase-title[b-v4pi4sfmcs] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    margin-bottom: 1rem;
    text-shadow: var(--vapor-glow-cyan);
}

.passphrase-subtitle[b-v4pi4sfmcs] {
    color: var(--vapor-text-muted);
    font-size: 1.1rem;
    margin-bottom: 2.5rem;
    line-height: 1.6;
}

.passphrase-subtitle strong[b-v4pi4sfmcs] {
    color: var(--vapor-accent);
}

.passphrase-form[b-v4pi4sfmcs] {
    margin-bottom: 2rem;
}

.secondary-link[b-v4pi4sfmcs] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--vapor-text-muted);
    font-size: 0.95rem;
    margin-top: 1.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
}

.secondary-link:hover[b-v4pi4sfmcs] {
    color: var(--vapor-accent);
    text-decoration: none;
}

.secondary-link i[b-v4pi4sfmcs] {
    font-size: 1.1rem;
}

.form-group[b-v4pi4sfmcs] {
    margin-bottom: 1.5rem;
    text-align: left;
}

.passphrase-input[b-v4pi4sfmcs] {
    width: 100%;
    padding: 1rem 1.25rem;
    font-size: 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    background: rgba(10, 5, 20, 0.6);
    color: var(--vapor-text-main);
    transition: all 0.3s ease;
}

.passphrase-input:focus[b-v4pi4sfmcs] {
    outline: none;
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 4px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
}

.passphrase-input[b-v4pi4sfmcs]::placeholder {
    color: var(--vapor-text-dim);
}

.form-hint[b-v4pi4sfmcs] {
    display: block;
    margin-top: 0.5rem;
    color: var(--vapor-text-dim);
    font-size: 0.9rem;
}

.passphrase-btn[b-v4pi4sfmcs] {
    width: 100%;
    padding: 1.25rem;
    font-size: 1.2rem;
    font-weight: 700;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    box-shadow: 0 8px 20px rgba(111, 66, 193, 0.3);
}

.passphrase-btn:hover:not(:disabled)[b-v4pi4sfmcs] {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.passphrase-btn:disabled[b-v4pi4sfmcs] {
    opacity: 0.6;
    cursor: not-allowed;
}

.passphrase-btn.danger[b-v4pi4sfmcs] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    box-shadow: 0 8px 20px rgba(239, 68, 68, 0.3);
}

.passphrase-btn.danger:hover:not(:disabled)[b-v4pi4sfmcs] {
    box-shadow: 0 12px 30px rgba(239, 68, 68, 0.4);
}

.success-message[b-v4pi4sfmcs] {
    margin-bottom: 2rem;
}

.success-message i[b-v4pi4sfmcs] {
    font-size: 4rem;
    color: var(--vapor-accent);
    margin-bottom: 1rem;
    text-shadow: var(--vapor-glow-cyan);
}

.success-message p[b-v4pi4sfmcs] {
    color: var(--vapor-text-muted);
    font-size: 1.2rem;
    margin: 0;
}

.error-message[b-v4pi4sfmcs] {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #f87171;
    padding: 1rem;
    border-radius: 12px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.passphrase-info[b-v4pi4sfmcs] {
    background: rgba(50, 251, 226, 0.1);
    border: 1px solid rgba(50, 251, 226, 0.3);
    border-radius: 12px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--vapor-text-muted);
    font-size: 0.95rem;
    margin-top: 1.5rem;
}

.passphrase-info i[b-v4pi4sfmcs] {
    color: var(--vapor-accent);
    font-size: 1.25rem;
    flex-shrink: 0;
}

.passphrase-info p[b-v4pi4sfmcs] {
    margin: 0;
    text-align: left;
}

.reset-btn[b-v4pi4sfmcs] {
    width: 100%;
    padding: 1rem;
    font-size: 1rem;
    font-weight: 600;
    border: 2px solid rgba(239, 68, 68, 0.4);
    border-radius: 12px;
    background: rgba(239, 68, 68, 0.1);
    color: #f87171;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1.5rem;
}

.reset-btn:hover[b-v4pi4sfmcs] {
    background: rgba(239, 68, 68, 0.2);
    border-color: rgba(239, 68, 68, 0.6);
    transform: translateY(-2px);
}

.reset-section[b-v4pi4sfmcs] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.cancel-btn[b-v4pi4sfmcs] {
    width: 100%;
    padding: 1rem;
    font-size: 1rem;
    font-weight: 600;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    background: transparent;
    color: var(--vapor-text-muted);
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.cancel-btn:hover:not(:disabled)[b-v4pi4sfmcs] {
    background: rgba(255, 255, 255, 0.05);
    border-color: var(--vapor-text-main);
    color: var(--vapor-text-main);
}

.cancel-btn:disabled[b-v4pi4sfmcs] {
    opacity: 0.5;
    cursor: not-allowed;
}

.passphrase-info.warning[b-v4pi4sfmcs] {
    background: rgba(245, 158, 11, 0.15);
    border-color: rgba(245, 158, 11, 0.3);
    margin-bottom: 1.5rem;
}

.passphrase-info.warning i[b-v4pi4sfmcs] {
    color: #fbbf24;
}

@media (max-width: 640px) {
    .passphrase-card[b-v4pi4sfmcs] {
        padding: 2rem 1.5rem;
    }
    
    .passphrase-title[b-v4pi4sfmcs] {
        font-size: 1.75rem;
    }
    
    .passphrase-subtitle[b-v4pi4sfmcs] {
        font-size: 1rem;
    }
}
/* /Components/Pages/PreguntasEspecialista.razor.rz.scp.css */
/* ======================================================
   Preguntas Especialista — Vapor Dark FAQ Accordion Styles
   Scoped styles: NO :root allowed here
   Prefix: faq-spec-
   ====================================================== */

.faq-spec-page-wrapper[b-n768o3z8mp] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
}

.faq-spec-container[b-n768o3z8mp] {
    max-width: 900px;
    margin: 0 auto;
    padding: 3rem 2rem 5rem;
    width: 100%;
}

/* ── Hero ─────────────────────────────────────────────── */

.faq-spec-hero[b-n768o3z8mp] {
    text-align: center;
    padding: 4rem 0 5rem;
    position: relative;
}

.faq-spec-hero[b-n768o3z8mp]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(139, 92, 246, 0.12) 0%, transparent 70%);
    pointer-events: none;
}

.faq-spec-hero-icon[b-n768o3z8mp] {
    font-size: 5rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1.5rem;
    display: inline-block;
    animation: faqSpecHeroFloat-b-n768o3z8mp 3.5s ease-in-out infinite;
    filter: drop-shadow(0 0 18px rgba(139, 92, 246, 0.5));
}

@keyframes faqSpecHeroFloat-b-n768o3z8mp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

.faq-spec-hero-title[b-n768o3z8mp] {
    font-size: 3.8rem;
    font-weight: 800;
    color: #f1f5f9;
    margin-bottom: 1rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.faq-spec-gradient-text[b-n768o3z8mp] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 60%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

.faq-spec-hero-subtitle[b-n768o3z8mp] {
    font-size: 1.25rem;
    color: #94a3b8;
    margin-bottom: 2rem;
    font-weight: 400;
}

.faq-spec-back-link[b-n768o3z8mp] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s ease;
}

.faq-spec-back-link:hover[b-n768o3z8mp] {
    color: #8b5cf6;
}

/* ── Sections ─────────────────────────────────────────── */

.faq-spec-section[b-n768o3z8mp] {
    margin-bottom: 2.5rem;
}

.faq-spec-section-header[b-n768o3z8mp] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.faq-spec-section-header h2[b-n768o3z8mp] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #f1f5f9;
    margin: 0 0 0.25rem;
}

.faq-spec-section-subtitle[b-n768o3z8mp] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
    font-weight: 400;
}

.faq-spec-section-icon[b-n768o3z8mp] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.faq-spec-icon-purple[b-n768o3z8mp] {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.3) 0%, rgba(139, 92, 246, 0.15) 100%);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.faq-spec-icon-cyan[b-n768o3z8mp] {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.25) 0%, rgba(6, 182, 212, 0.1) 100%);
    color: #22d3ee;
    border: 1px solid rgba(6, 182, 212, 0.25);
}

.faq-spec-icon-pink[b-n768o3z8mp] {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.25) 0%, rgba(236, 72, 153, 0.1) 100%);
    color: #f472b6;
    border: 1px solid rgba(236, 72, 153, 0.25);
}

/* ── Accordion Cards ──────────────────────────────────── */

.faq-spec-card[b-n768o3z8mp] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(20px);
    border-radius: 14px;
    border: 1px solid rgba(148, 163, 184, 0.1);
    margin-bottom: 0.75rem;
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.faq-spec-card:hover[b-n768o3z8mp] {
    border-color: rgba(139, 92, 246, 0.25);
    box-shadow: 0 4px 20px rgba(139, 92, 246, 0.08);
}

.faq-spec-card-question[b-n768o3z8mp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    color: #f1f5f9;
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.4;
    user-select: none;
}

.faq-spec-chevron[b-n768o3z8mp] {
    font-size: 0.85rem;
    color: #64748b;
    transition: transform 0.3s ease, color 0.3s ease;
    flex-shrink: 0;
}

.faq-spec-chevron-open[b-n768o3z8mp] {
    transform: rotate(180deg);
    color: #8b5cf6;
}

.faq-spec-card-answer[b-n768o3z8mp] {
    padding: 0 1.5rem 1.25rem;
    animation: faqSpecSlideDown-b-n768o3z8mp 0.25s ease-out;
}

@keyframes faqSpecSlideDown-b-n768o3z8mp {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.faq-spec-card-answer p[b-n768o3z8mp] {
    color: #94a3b8;
    font-size: 0.9rem;
    line-height: 1.75;
    margin: 0;
}

.faq-spec-card-answer p strong[b-n768o3z8mp] {
    color: #cbd5e1;
}

.faq-spec-card-answer a[b-n768o3z8mp] {
    color: #a78bfa;
    text-decoration: none;
    transition: color 0.2s ease;
}

.faq-spec-card-answer a:hover[b-n768o3z8mp] {
    color: #c4b5fd;
    text-decoration: underline;
}

/* ── Footer CTA ───────────────────────────────────────── */

.faq-spec-footer-cta[b-n768o3z8mp] {
    text-align: center;
    padding: 3rem 2rem;
    background: rgba(30, 41, 59, 0.4);
    border-radius: 16px;
    border: 1px solid rgba(139, 92, 246, 0.2);
    margin-top: 1rem;
}

.faq-spec-footer-cta > p[b-n768o3z8mp] {
    color: #94a3b8;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
}

.faq-spec-footer-links[b-n768o3z8mp] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.faq-spec-footer-btn[b-n768o3z8mp] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1.75rem;
    border-radius: 100px;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    transition: all 0.3s ease;
}

.faq-spec-footer-btn-primary[b-n768o3z8mp] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    color: white;
    box-shadow: 0 4px 16px rgba(139, 92, 246, 0.35);
}

.faq-spec-footer-btn-primary:hover[b-n768o3z8mp] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.5);
    color: white;
}

.faq-spec-footer-btn-secondary[b-n768o3z8mp] {
    background: rgba(148, 163, 184, 0.1);
    color: #cbd5e1;
    border: 1px solid rgba(148, 163, 184, 0.2);
}

.faq-spec-footer-btn-secondary:hover[b-n768o3z8mp] {
    background: rgba(148, 163, 184, 0.18);
    color: #f1f5f9;
    transform: translateY(-2px);
}

.faq-spec-footer-home-link[b-n768o3z8mp] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #64748b;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s;
}

.faq-spec-footer-home-link:hover[b-n768o3z8mp] {
    color: #8b5cf6;
}

/* ── Responsive ───────────────────────────────────────── */

@media (max-width: 768px) {
    .faq-spec-container[b-n768o3z8mp] {
        padding: 2rem 1.25rem 4rem;
    }

    .faq-spec-hero[b-n768o3z8mp] {
        padding: 3rem 0 3.5rem;
    }

    .faq-spec-hero-icon[b-n768o3z8mp] {
        font-size: 3.5rem;
    }

    .faq-spec-hero-title[b-n768o3z8mp] {
        font-size: 2.5rem;
    }

    .faq-spec-section-header[b-n768o3z8mp] {
        gap: 1rem;
    }

    .faq-spec-section-header h2[b-n768o3z8mp] {
        font-size: 1.15rem;
    }

    .faq-spec-card-question[b-n768o3z8mp] {
        padding: 1rem 1.25rem;
        font-size: 0.9rem;
    }

    .faq-spec-card-answer[b-n768o3z8mp] {
        padding: 0 1.25rem 1rem;
    }

    .faq-spec-footer-links[b-n768o3z8mp] {
        flex-direction: column;
        align-items: center;
    }
}

@media (max-width: 480px) {
    .faq-spec-hero-title[b-n768o3z8mp] {
        font-size: 2rem;
    }

    .faq-spec-hero-subtitle[b-n768o3z8mp] {
        font-size: 1.05rem;
    }

    .faq-spec-section-icon[b-n768o3z8mp] {
        width: 40px;
        height: 40px;
        font-size: 1.15rem;
    }

    .faq-spec-card-question[b-n768o3z8mp] {
        padding: 0.875rem 1rem;
        font-size: 0.85rem;
    }

    .faq-spec-card-answer[b-n768o3z8mp] {
        padding: 0 1rem 0.875rem;
    }

    .faq-spec-card-answer p[b-n768o3z8mp] {
        font-size: 0.85rem;
    }
}

/* ── Reduced Motion ───────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
    .faq-spec-hero-icon[b-n768o3z8mp] {
        animation: none;
    }

    .faq-spec-card-answer[b-n768o3z8mp] {
        animation: none;
    }

    .faq-spec-chevron[b-n768o3z8mp] {
        transition: none;
    }

    .faq-spec-card[b-n768o3z8mp] {
        transition: none;
    }

    .faq-spec-footer-btn[b-n768o3z8mp],
    .faq-spec-footer-btn-primary[b-n768o3z8mp],
    .faq-spec-footer-btn-secondary[b-n768o3z8mp] {
        transition: none;
    }
}
/* /Components/Pages/PreguntasFrecuentes.razor.rz.scp.css */
/* ======================================================
   Preguntas Frecuentes — Vapor Dark FAQ Page Styles
   Scoped styles: NO :root allowed here
   ====================================================== */

.faq-page-wrapper[b-3ylwmayqqy] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
}

.faq-container[b-3ylwmayqqy] {
    max-width: 900px;
    margin: 0 auto;
    padding: 3rem 2rem 5rem;
    width: 100%;
}

/* ── Hero ─────────────────────────────────────────────── */

.faq-hero[b-3ylwmayqqy] {
    text-align: center;
    padding: 4rem 0 5rem;
    position: relative;
}

.faq-hero[b-3ylwmayqqy]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(139, 92, 246, 0.12) 0%, transparent 70%);
    pointer-events: none;
}

.faq-hero-icon[b-3ylwmayqqy] {
    font-size: 5rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1.5rem;
    display: inline-block;
    animation: faqHeroFloat-b-3ylwmayqqy 3.5s ease-in-out infinite;
    filter: drop-shadow(0 0 18px rgba(139, 92, 246, 0.5));
}

@keyframes faqHeroFloat-b-3ylwmayqqy {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

.faq-hero-title[b-3ylwmayqqy] {
    font-size: 3.8rem;
    font-weight: 800;
    color: #f1f5f9;
    margin-bottom: 1rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.gradient-text[b-3ylwmayqqy] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 60%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

.faq-hero-subtitle[b-3ylwmayqqy] {
    font-size: 1.25rem;
    color: #94a3b8;
    margin-bottom: 2rem;
    font-weight: 400;
}

.back-link[b-3ylwmayqqy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s ease;
}

.back-link:hover[b-3ylwmayqqy] {
    color: #8b5cf6;
}

/* ── Section Headers ─────────────────────────────────── */

.faq-section[b-3ylwmayqqy] {
    margin-bottom: 2.5rem;
}

.faq-section-header[b-3ylwmayqqy] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

.faq-section-header h2[b-3ylwmayqqy] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #f1f5f9;
    margin: 0;
}

.section-icon[b-3ylwmayqqy] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.icon-purple[b-3ylwmayqqy] {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.3) 0%, rgba(139, 92, 246, 0.15) 100%);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.icon-cyan[b-3ylwmayqqy] {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.25) 0%, rgba(6, 182, 212, 0.1) 100%);
    color: #22d3ee;
    border: 1px solid rgba(6, 182, 212, 0.25);
}

.icon-pink[b-3ylwmayqqy] {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.25) 0%, rgba(236, 72, 153, 0.1) 100%);
    color: #f472b6;
    border: 1px solid rgba(236, 72, 153, 0.25);
}

/* ── FAQ Items (Accordion Cards) ─────────────────────── */

.faq-item[b-3ylwmayqqy] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(20px);
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.1);
    margin-bottom: 0.75rem;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.faq-item:hover[b-3ylwmayqqy] {
    border-color: rgba(139, 92, 246, 0.2);
    box-shadow: 0 4px 20px rgba(139, 92, 246, 0.06);
}

.faq-question[b-3ylwmayqqy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.125rem 1.5rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s ease;
}

.faq-question:hover[b-3ylwmayqqy] {
    background: rgba(139, 92, 246, 0.06);
}

.faq-question span[b-3ylwmayqqy] {
    font-size: 1rem;
    font-weight: 600;
    color: #f1f5f9;
    line-height: 1.4;
}

.faq-chevron[b-3ylwmayqqy] {
    font-size: 0.875rem;
    color: #64748b;
    transition: transform 0.3s ease, color 0.3s ease;
    flex-shrink: 0;
    margin-left: 1rem;
}

.faq-question.open .faq-chevron[b-3ylwmayqqy] {
    transform: rotate(180deg);
    color: #8b5cf6;
}

.faq-question.open[b-3ylwmayqqy] {
    border-bottom: 1px solid rgba(148, 163, 184, 0.07);
}

/* ── FAQ Answer Body ─────────────────────────────────── */

.faq-answer[b-3ylwmayqqy] {
    padding: 1.25rem 1.5rem 1.5rem;
    animation: faqSlideIn-b-3ylwmayqqy 0.25s ease-out;
}

@keyframes faqSlideIn-b-3ylwmayqqy {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.faq-answer p[b-3ylwmayqqy] {
    color: #cbd5e1;
    line-height: 1.75;
    margin-bottom: 1rem;
    font-size: 0.925rem;
}

.faq-answer p:last-child[b-3ylwmayqqy] {
    margin-bottom: 0;
}

.faq-answer ul[b-3ylwmayqqy] {
    color: #cbd5e1;
    line-height: 1.75;
    margin: 0.75rem 0 1rem;
    padding-left: 1.5rem;
    font-size: 0.925rem;
}

.faq-answer ul li[b-3ylwmayqqy] {
    margin-bottom: 0.5rem;
}

.faq-answer ul li:last-child[b-3ylwmayqqy] {
    margin-bottom: 0;
}

.faq-answer strong[b-3ylwmayqqy] {
    color: #f1f5f9;
}

.faq-answer a[b-3ylwmayqqy] {
    color: #8b5cf6;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.faq-answer a:hover[b-3ylwmayqqy] {
    color: #a78bfa;
    text-decoration: underline;
}

/* ── Footer CTA ───────────────────────────────────────── */

.faq-footer-cta[b-3ylwmayqqy] {
    text-align: center;
    padding: 3rem 2rem;
    background: rgba(30, 41, 59, 0.4);
    border-radius: 16px;
    border: 1px solid rgba(139, 92, 246, 0.2);
    margin-top: 1rem;
}

.faq-footer-cta p[b-3ylwmayqqy] {
    color: #94a3b8;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
}

.cta-btn[b-3ylwmayqqy] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    color: white;
    text-decoration: none;
    padding: 0.875rem 2rem;
    border-radius: 100px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 16px rgba(139, 92, 246, 0.35);
}

.cta-btn:hover[b-3ylwmayqqy] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(139, 92, 246, 0.5);
    color: white;
}

.faq-footer-links[b-3ylwmayqqy] {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
}

.footer-legal-link[b-3ylwmayqqy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #64748b;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s;
}

.footer-legal-link:hover[b-3ylwmayqqy] {
    color: #8b5cf6;
}

/* ── Responsive ───────────────────────────────────────── */

@media (max-width: 768px) {
    .faq-container[b-3ylwmayqqy] {
        padding: 2rem 1.25rem 4rem;
    }

    .faq-hero[b-3ylwmayqqy] {
        padding: 3rem 0 3.5rem;
    }

    .faq-hero-icon[b-3ylwmayqqy] {
        font-size: 3.5rem;
    }

    .faq-hero-title[b-3ylwmayqqy] {
        font-size: 2.5rem;
    }

    .faq-question[b-3ylwmayqqy] {
        padding: 1rem 1.25rem;
    }

    .faq-answer[b-3ylwmayqqy] {
        padding: 1rem 1.25rem 1.25rem;
    }

    .faq-footer-links[b-3ylwmayqqy] {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }
}

@media (max-width: 480px) {
    .faq-hero-title[b-3ylwmayqqy] {
        font-size: 2rem;
    }

    .faq-hero-subtitle[b-3ylwmayqqy] {
        font-size: 1.05rem;
    }

    .faq-section-header h2[b-3ylwmayqqy] {
        font-size: 1.15rem;
    }

    .section-icon[b-3ylwmayqqy] {
        width: 40px;
        height: 40px;
        font-size: 1.15rem;
    }

    .faq-question span[b-3ylwmayqqy] {
        font-size: 0.925rem;
    }
}

/* ── Reduced Motion ───────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
    .faq-hero-icon[b-3ylwmayqqy] {
        animation: none;
    }

    .faq-answer[b-3ylwmayqqy] {
        animation: none;
    }

    .faq-chevron[b-3ylwmayqqy] {
        transition: none;
    }
}
/* /Components/Pages/SpecialistHome.razor.rz.scp.css */
/* Vapor Theme Specialist Home Page Styles */

.specialist-home-wrapper[b-0aptmg2lu0] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
}

.specialist-home-wrapper[b-0aptmg2lu0]::-webkit-scrollbar {
    width: 10px;
}

.specialist-home-wrapper[b-0aptmg2lu0]::-webkit-scrollbar-track {
    background: transparent;
}

.specialist-home-wrapper[b-0aptmg2lu0]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 5px;
}

.specialist-home-wrapper[b-0aptmg2lu0]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4);
}

.specialist-home-container[b-0aptmg2lu0] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 3rem 2rem;
    width: 100%;
}

/* Welcome Section */
.specialist-welcome-section[b-0aptmg2lu0] {
    background: linear-gradient(135deg, rgba(111, 66, 193, 0.15) 0%, rgba(234, 57, 184, 0.1) 100%);
    border-radius: 24px;
    padding: 3rem;
    margin-bottom: 3rem;
    border: 1px solid rgba(111, 66, 193, 0.2);
    position: relative;
    overflow: hidden;
}

.specialist-welcome-section[b-0aptmg2lu0]::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(111, 66, 193, 0.1) 0%, transparent 70%);
    pointer-events: none;
}

.welcome-content[b-0aptmg2lu0] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-bottom: 2.5rem;
    position: relative;
    z-index: 1;
}

.welcome-icon[b-0aptmg2lu0] {
    width: 100px;
    height: 100px;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    color: white;
    box-shadow: 0 10px 30px rgba(111, 66, 193, 0.3), var(--vapor-glow-pink);
}

.welcome-text h1[b-0aptmg2lu0] {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    margin-bottom: 0.5rem;
    line-height: 1.2;
}

.specialist-name[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: var(--vapor-glow-cyan);
}

.welcome-subtitle[b-0aptmg2lu0] {
    font-size: 1.25rem;
    color: var(--vapor-text-muted);
    margin: 0;
}

.quick-stats[b-0aptmg2lu0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    position: relative;
    z-index: 1;
}

.stat-card[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.stat-card:hover[b-0aptmg2lu0] {
    transform: translateY(-3px);
    border-color: rgba(50, 251, 226, 0.3);
    box-shadow: 0 10px 25px rgba(50, 251, 226, 0.15), var(--vapor-glow-cyan);
    background: rgba(255, 255, 255, 0.05);
}

.stat-icon[b-0aptmg2lu0] {
    width: 60px;
    height: 60px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
}

.stat-icon.patients[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
}

.stat-icon.appointments[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    color: #0a0514;
}

.stat-icon.rating[b-0aptmg2lu0] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
}

.stat-info[b-0aptmg2lu0] {
    display: flex;
    flex-direction: column;
}

.stat-value[b-0aptmg2lu0] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    line-height: 1;
}

.stat-label[b-0aptmg2lu0] {
    font-size: 0.9rem;
    color: var(--vapor-text-muted);
    margin-top: 0.25rem;
}

/* Specialist Actions Section */
.specialist-actions-section[b-0aptmg2lu0] {
    margin-bottom: 3rem;
}

.specialist-actions-section h2[b-0aptmg2lu0] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--vapor-text-main);
    margin-bottom: 1.5rem;
}

.specialist-actions-grid[b-0aptmg2lu0] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.specialist-action-card[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 2rem;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid rgba(255, 255, 255, 0.08);
    position: relative;
    overflow: hidden;
}

.specialist-action-card[b-0aptmg2lu0]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--vapor-accent), transparent);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.specialist-action-card:hover[b-0aptmg2lu0]::before {
    opacity: 1;
}

.specialist-action-card:hover[b-0aptmg2lu0] {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(111, 66, 193, 0.2), var(--vapor-glow-pink);
    border-color: rgba(50, 251, 226, 0.3);
    background: rgba(255, 255, 255, 0.05);
}

.action-icon[b-0aptmg2lu0] {
    width: 70px;
    height: 70px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin-bottom: 1.5rem;
    transition: all 0.3s ease;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.specialist-action-card:hover .action-icon[b-0aptmg2lu0] {
    transform: scale(1.1) rotate(5deg);
}

.action-icon.directory[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
}

.action-icon.calendar[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    color: #0a0514;
}

.action-icon.chat[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-secondary) 0%, var(--vapor-primary) 100%);
    color: white;
}

.action-icon.notes[b-0aptmg2lu0] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
}

.action-icon.patients[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
}

.action-icon.appointments[b-0aptmg2lu0] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
}

.action-icon.availability[b-0aptmg2lu0] {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    color: white;
}

.specialist-action-card h3[b-0aptmg2lu0] {
    color: var(--vapor-text-main);
    font-size: 1.5rem;
    margin-bottom: 0.75rem;
    font-weight: 700;
}

.specialist-action-card p[b-0aptmg2lu0] {
    color: var(--vapor-text-muted);
    line-height: 1.6;
    margin-bottom: 1.5rem;
    font-size: 1rem;
}

.action-link[b-0aptmg2lu0] {
    color: var(--vapor-accent);
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.action-link:hover[b-0aptmg2lu0] {
    color: var(--vapor-primary);
    gap: 0.75rem;
    text-shadow: var(--vapor-glow-cyan);
}

/* Appointments Section */
.appointments-section[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 2rem;
    margin-bottom: 3rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.section-header[b-0aptmg2lu0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.section-header h2[b-0aptmg2lu0] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--vapor-text-main);
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
}

.section-header h2 i[b-0aptmg2lu0] {
    color: var(--vapor-accent);
    text-shadow: var(--vapor-glow-cyan);
}


.appointments-list[b-0aptmg2lu0] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.appointment-card[b-0aptmg2lu0] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: rgba(10, 5, 20, 0.5);
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.appointment-card:hover[b-0aptmg2lu0] {
    background: rgba(10, 5, 20, 0.7);
    border-color: rgba(50, 251, 226, 0.3);
    box-shadow: var(--vapor-glow-cyan);
}

.appointment-date[b-0aptmg2lu0] {
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    text-align: center;
    min-width: 70px;
}

.appointment-date .day[b-0aptmg2lu0] {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    color: #0a0514;
    line-height: 1;
}

.appointment-date .month[b-0aptmg2lu0] {
    display: block;
    font-size: 0.75rem;
    color: rgba(10, 5, 20, 0.8);
    text-transform: uppercase;
    margin-top: 0.25rem;
    font-weight: 700;
}

.appointment-details[b-0aptmg2lu0] {
    flex: 1;
}

.appointment-details h4[b-0aptmg2lu0] {
    color: var(--vapor-text-main);
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
}

.appointment-details p[b-0aptmg2lu0] {
    color: var(--vapor-text-muted);
    font-size: 0.9rem;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.appointment-actions[b-0aptmg2lu0] {
    display: flex;
    gap: 0.5rem;
}


.empty-state[b-0aptmg2lu0] {
    text-align: center;
    padding: 3rem;
    color: var(--vapor-text-dim);
}

.empty-state i[b-0aptmg2lu0] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-state p[b-0aptmg2lu0] {
    margin: 0;
}

/* Professional Tools Section */
.professional-tools-section[b-0aptmg2lu0] {
    margin-bottom: 3rem;
}

.professional-tools-section h2[b-0aptmg2lu0] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--vapor-text-main);
    margin-bottom: 1.5rem;
}

.tools-grid[b-0aptmg2lu0] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.tool-card[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.tool-card:hover[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(50, 251, 226, 0.3);
    transform: translateY(-3px);
    box-shadow: var(--vapor-glow-cyan);
}

.tool-icon[b-0aptmg2lu0] {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(111, 66, 193, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--vapor-accent);
    margin-bottom: 1rem;
}

.tool-content h4[b-0aptmg2lu0] {
    color: var(--vapor-text-main);
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.5rem 0;
}

.tool-content p[b-0aptmg2lu0] {
    color: var(--vapor-text-muted);
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0 0 1.5rem 0;
    flex: 1;
}

.btn-tool[b-0aptmg2lu0] {
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    border: none;
    color: #fff;
    padding: 0.75rem;
    border-radius: var(--vapor-radius-md);
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-tool:hover[b-0aptmg2lu0] {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(139, 92, 246, 0.3);
}

/* Specialist Info Section */
.specialist-info-section[b-0aptmg2lu0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.specialist-info-section .info-card[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: start;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.specialist-info-section .info-card:hover[b-0aptmg2lu0] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(50, 251, 226, 0.3);
    box-shadow: var(--vapor-glow-cyan);
}

.specialist-info-section .info-card i[b-0aptmg2lu0] {
    font-size: 2rem;
    color: var(--vapor-accent);
    flex-shrink: 0;
    text-shadow: var(--vapor-glow-cyan);
}

.specialist-info-section .info-card h4[b-0aptmg2lu0] {
    color: var(--vapor-text-main);
    font-size: 1rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.specialist-info-section .info-card p[b-0aptmg2lu0] {
    color: var(--vapor-text-muted);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .tools-grid[b-0aptmg2lu0] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 992px) {
    .quick-stats[b-0aptmg2lu0] {
        grid-template-columns: 1fr;
    }

    .specialist-actions-grid[b-0aptmg2lu0] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .specialist-home-container[b-0aptmg2lu0] {
        padding: 2rem 1.25rem;
    }

    .welcome-content[b-0aptmg2lu0] {
        flex-direction: column;
        text-align: center;
    }

    .welcome-text h1[b-0aptmg2lu0] {
        font-size: 1.75rem;
    }

    .specialist-welcome-section[b-0aptmg2lu0] {
        padding: 2rem;
    }

    .stat-card[b-0aptmg2lu0] {
        padding: 1.25rem;
    }

    .tools-grid[b-0aptmg2lu0] {
        grid-template-columns: 1fr;
    }

    .specialist-info-section[b-0aptmg2lu0] {
        grid-template-columns: 1fr;
    }

    .appointment-card[b-0aptmg2lu0] {
        flex-direction: column;
        text-align: center;
    }

    .appointment-actions[b-0aptmg2lu0] {
        width: 100%;
        justify-content: center;
    }
}

.stat-card--link[b-0aptmg2lu0] {
    cursor: pointer;
}

.stat-card--alert[b-0aptmg2lu0] {
    border-color: rgba(251, 191, 36, 0.35);
}

.stat-card--alert:hover[b-0aptmg2lu0] {
    border-color: rgba(251, 191, 36, 0.6);
    box-shadow: 0 10px 25px rgba(251, 191, 36, 0.15);
}

.appointments-section--pending[b-0aptmg2lu0] {
    border-color: rgba(251, 191, 36, 0.2);
}

.appointments-section--pending .section-header h2 i[b-0aptmg2lu0] {
    color: #fbbf24;
    text-shadow: 0 0 8px rgba(251, 191, 36, 0.4);
}

.appointment-card--pending[b-0aptmg2lu0] {
    border-color: rgba(251, 191, 36, 0.15);
    cursor: pointer;
}

.appointment-card--pending:hover[b-0aptmg2lu0] {
    border-color: rgba(251, 191, 36, 0.4);
    box-shadow: 0 4px 16px rgba(251, 191, 36, 0.12);
}

.pending-badge[b-0aptmg2lu0] {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
    background: rgba(251, 191, 36, 0.15);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.3);
    white-space: nowrap;
}

.confirmed-badge[b-0aptmg2lu0] {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
    background: rgba(16, 185, 129, 0.15);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.3);
    white-space: nowrap;
}

.badge-count[b-0aptmg2lu0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fbbf24;
    color: #0a0514;
    font-size: 0.75rem;
    font-weight: 700;
    min-width: 22px;
    height: 22px;
    border-radius: 11px;
    padding: 0 6px;
}

@media (prefers-reduced-motion: reduce) {
    *[b-0aptmg2lu0],
    *[b-0aptmg2lu0]::before,
    *[b-0aptmg2lu0]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
/* /Components/Pages/SpecialistProfile.razor.rz.scp.css */
/* Vapor Theme SpecialistProfile Component Styles */

.specialist-profile-wrapper[b-w5oqoolrrf] {
    min-height: 100vh;
    background-color: transparent; /* Handled by global body style */
    padding: 24px 0;
}

.specialist-profile-container[b-w5oqoolrrf] {
    max-width: 1128px;
    margin: 0 auto;
    padding: 0 16px;
}

/* Profile Header Section */
.profile-header-section[b-w5oqoolrrf] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
    margin-bottom: 24px;
}

.profile-cover-photo[b-w5oqoolrrf] {
    height: 200px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    position: relative;
}

    .profile-cover-photo[b-w5oqoolrrf]::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }

.profile-header-content[b-w5oqoolrrf] {
    display: flex;
    padding: 0 32px 24px;
    position: relative;
}

.profile-avatar-container[b-w5oqoolrrf] {
    position: relative;
    margin-top: -75px;
    z-index: 10;
}

.profile-avatar[b-w5oqoolrrf] {
    width: 180px;
    height: 180px;
    border-radius: 50%;
    border: 4px solid rgba(10, 5, 20, 0.8);
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    background: rgba(10, 5, 20, 0.8);
    transition: transform 0.3s ease;
}

    .profile-avatar:hover[b-w5oqoolrrf] {
        transform: scale(1.02);
        box-shadow: var(--vapor-glow-cyan);
        border-color: var(--vapor-accent);
    }

    .profile-avatar img[b-w5oqoolrrf] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.availability-indicator[b-w5oqoolrrf] {
    position: absolute;
    bottom: 12px;
    right: 12px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 3px solid rgba(10, 5, 20, 0.8);
    transition: all 0.3s ease;
}

    .availability-indicator.available[b-w5oqoolrrf] {
        background: var(--vapor-accent);
        animation: pulse-emerald-b-w5oqoolrrf 2s infinite;
        box-shadow: var(--vapor-glow-cyan);
    }

    .availability-indicator.busy[b-w5oqoolrrf] {
        background: #f59e0b;
    }

@keyframes pulse-emerald-b-w5oqoolrrf {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(50, 251, 226, 0.4);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(50, 251, 226, 0);
    }
}

.btn-edit-avatar[b-w5oqoolrrf] {
    position: absolute;
    bottom: 8px;
    right: -8px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--vapor-accent) 0%, var(--vapor-primary) 100%);
    border: none;
    color: #0a0514;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

    .btn-edit-avatar:hover[b-w5oqoolrrf] {
        background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-accent) 100%);
        transform: scale(1.1);
        box-shadow: var(--vapor-glow-cyan);
    }

.profile-info[b-w5oqoolrrf] {
    flex: 1;
    padding: 16px 0 0 24px;
}

.profile-name-section[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.profile-name[b-w5oqoolrrf] {
    font-size: 28px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin: 0;
    line-height: 1.2;
}

.profile-credentials[b-w5oqoolrrf] {
    font-size: 18px;
    font-weight: 400;
    color: var(--vapor-text-muted);
}

.verified-badge[b-w5oqoolrrf] {
    color: var(--vapor-accent);
    font-size: 22px;
    cursor: help;
    transition: transform 0.2s ease;
    text-shadow: var(--vapor-glow-cyan);
}

    .verified-badge:hover[b-w5oqoolrrf] {
        transform: scale(1.1);
    }

    .verified-badge.unverified[b-w5oqoolrrf] {
        color: var(--vapor-text-muted);
        text-shadow: none;
        opacity: 0.6;
    }

        .verified-badge.unverified:hover[b-w5oqoolrrf] {
            opacity: 0.8;
        }

.profile-profession-row[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 12px 0 8px;
    flex-wrap: wrap;
}

.profession-item[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 6px;
}

    .profession-item i[b-w5oqoolrrf] {
        font-size: 16px;
        color: var(--vapor-accent);
    }

.profession-label[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-dim);
    font-weight: 400;
}

.profession-value[b-w5oqoolrrf] {
    font-size: 15px;
    color: var(--vapor-text-main);
    font-weight: 500;
}

.profession-separator[b-w5oqoolrrf] {
    color: var(--vapor-text-dim);
    font-size: 14px;
    opacity: 0.5;
}

.profile-location[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-dim);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

    .profile-location i[b-w5oqoolrrf] {
        font-size: 16px;
        color: var(--vapor-accent);
    }

.separator[b-w5oqoolrrf] {
    color: var(--vapor-text-dim);
}

.contact-info[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 4px;
}

    .contact-info a[b-w5oqoolrrf] {
        color: var(--vapor-accent);
        text-decoration: none;
        transition: color 0.2s ease;
    }

        .contact-info a:hover[b-w5oqoolrrf] {
            color: var(--vapor-primary);
            text-decoration: underline;
            text-shadow: var(--vapor-glow-cyan);
        }

.profile-actions[b-w5oqoolrrf] {
    display: flex;
    gap: 12px;
    margin-top: 16px;
}

.btn-primary-profile[b-w5oqoolrrf], .btn-secondary-profile[b-w5oqoolrrf] {
    padding: 10px 24px;
    border-radius: 24px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    border: none;
}

.btn-primary-profile[b-w5oqoolrrf] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
}

    .btn-primary-profile:hover[b-w5oqoolrrf] {
        background: linear-gradient(135deg, var(--vapor-secondary) 0%, var(--vapor-primary) 100%);
        box-shadow: var(--vapor-glow-pink);
        transform: translateY(-2px);
    }

.btn-secondary-profile[b-w5oqoolrrf] {
    background: transparent;
    color: var(--vapor-accent);
    border: 1px solid var(--vapor-accent);
}

    .btn-secondary-profile:hover[b-w5oqoolrrf] {
        background: rgba(50, 251, 226, 0.1);
        border-color: var(--vapor-primary);
        color: var(--vapor-primary);
        box-shadow: var(--vapor-glow-cyan);
    }

/* Stats Section */
.stats-section[b-w5oqoolrrf] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card[b-w5oqoolrrf] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 12px;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: all 0.3s ease;
}

    .stat-card:hover[b-w5oqoolrrf] {
        transform: translateY(-3px);
        border-color: rgba(50, 251, 226, 0.3);
        box-shadow: 0 8px 20px rgba(50, 251, 226, 0.15), var(--vapor-glow-cyan);
        background: rgba(255, 255, 255, 0.05);
    }

.stat-icon[b-w5oqoolrrf] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(111, 66, 193, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .stat-icon i[b-w5oqoolrrf] {
        font-size: 24px;
        color: var(--vapor-accent);
    }

    .stat-icon.rating[b-w5oqoolrrf] {
        background: linear-gradient(135deg, rgba(245, 158, 11, 0.2) 0%, rgba(217, 119, 6, 0.1) 100%);
    }

        .stat-icon.rating i[b-w5oqoolrrf] {
            color: #f59e0b;
        }

    .stat-icon.clients[b-w5oqoolrrf] {
        background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(111, 66, 193, 0.1) 100%);
    }

        .stat-icon.clients i[b-w5oqoolrrf] {
            color: var(--vapor-accent);
        }

    .stat-icon.experience[b-w5oqoolrrf] {
        background: linear-gradient(135deg, rgba(111, 66, 193, 0.2) 0%, rgba(234, 57, 184, 0.1) 100%);
    }

        .stat-icon.experience i[b-w5oqoolrrf] {
            color: var(--vapor-secondary);
        }

.stat-content[b-w5oqoolrrf] {
    flex: 1;
}

.stat-number[b-w5oqoolrrf] {
    font-size: 24px;
    font-weight: 600;
    color: var(--vapor-text-main);
    display: block;
    line-height: 1.2;
}

.stat-label[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-muted);
    margin-top: 2px;
    display: block;
}

.rating-stars[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-top: 4px;
}

    .rating-stars i[b-w5oqoolrrf] {
        font-size: 12px;
        color: #f59e0b;
    }

.review-count[b-w5oqoolrrf] {
    font-size: 12px;
    color: var(--vapor-text-muted);
    margin-left: 4px;
}

/* Content Grid */
.profile-content-grid[b-w5oqoolrrf] {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 24px;
}

/* Content Cards */
.content-card[b-w5oqoolrrf] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 24px;
    overflow: hidden;
    transition: all 0.3s ease;
}

    .content-card:hover[b-w5oqoolrrf] {
        box-shadow: var(--vapor-glow-cyan);
        border-color: rgba(50, 251, 226, 0.2);
        background: rgba(255, 255, 255, 0.05);
    }

.card-header[b-w5oqoolrrf] {
    padding: 20px 24px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .card-header h3[b-w5oqoolrrf] {
        font-size: 18px;
        font-weight: 600;
        color: var(--vapor-text-main);
        margin: 0;
        display: flex;
        align-items: center;
        gap: 10px;
    }

        .card-header h3 i[b-w5oqoolrrf] {
            color: var(--vapor-accent);
            text-shadow: var(--vapor-glow-cyan);
        }

.btn-card-action[b-w5oqoolrrf] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--vapor-text-muted);
    transition: all 0.2s ease;
}

    .btn-card-action:hover[b-w5oqoolrrf] {
        background: rgba(255, 255, 255, 0.1);
        border-color: var(--vapor-accent);
        color: var(--vapor-accent);
    }

.card-body[b-w5oqoolrrf] {
    padding: 20px 24px;
}

/* About Section */
.about-text[b-w5oqoolrrf] {
    font-size: 15px;
    line-height: 1.7;
    color: var(--vapor-text-muted);
    margin-bottom: 24px;
}

.availability-info h4[b-w5oqoolrrf], .contact-info-box h4[b-w5oqoolrrf] {
    font-size: 15px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

    .availability-info h4 i[b-w5oqoolrrf], .contact-info-box h4 i[b-w5oqoolrrf] {
        color: var(--vapor-accent);
    }

.schedule-list[b-w5oqoolrrf] {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
}

    .schedule-list li[b-w5oqoolrrf] {
        display: flex;
        justify-content: space-between;
        padding: 8px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        font-size: 14px;
    }

        .schedule-list li:last-child[b-w5oqoolrrf] {
            border-bottom: none;
        }

    .schedule-list .day[b-w5oqoolrrf] {
        color: var(--vapor-text-main);
        font-weight: 500;
    }

    .schedule-list .hours[b-w5oqoolrrf] {
        color: var(--vapor-text-muted);
    }

.contact-info-box[b-w5oqoolrrf] {
    background: rgba(10, 5, 20, 0.5);
    border-radius: 8px;
    padding: 16px;
}

.contact-item[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    font-size: 14px;
}

    .contact-item i[b-w5oqoolrrf] {
        color: var(--vapor-accent);
        font-size: 18px;
        width: 24px;
        text-align: center;
    }

    .contact-item span[b-w5oqoolrrf], .contact-item a[b-w5oqoolrrf] {
        color: var(--vapor-text-muted);
        text-decoration: none;
        transition: color 0.2s ease;
    }

        .contact-item a:hover[b-w5oqoolrrf] {
            color: var(--vapor-accent);
            text-shadow: var(--vapor-glow-cyan);
        }

/* Education Section */
.education-item[b-w5oqoolrrf] {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

    .education-item:last-child[b-w5oqoolrrf] {
        border-bottom: none;
    }

.education-icon[b-w5oqoolrrf] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(111, 66, 193, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .education-icon i[b-w5oqoolrrf] {
        font-size: 20px;
        color: var(--vapor-accent);
    }

.education-details h4[b-w5oqoolrrf] {
    font-size: 15px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin: 0 0 4px;
}

.institution[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
    margin: 0 0 4px;
}

.education-period[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-dim);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

    .education-period i[b-w5oqoolrrf] {
        font-size: 14px;
        color: var(--vapor-accent);
    }

.education-description[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-muted);
    margin: 8px 0 0;
    line-height: 1.5;
}

/* Skills Section */
.skills-container[b-w5oqoolrrf] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}

.skill-tag[b-w5oqoolrrf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: rgba(50, 251, 226, 0.1);
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    color: var(--vapor-text-main);
    transition: all 0.2s ease;
    cursor: default;
    border: 1px solid rgba(50, 251, 226, 0.2);
}

    .skill-tag:hover[b-w5oqoolrrf] {
        background: rgba(50, 251, 226, 0.2);
        border-color: var(--vapor-accent);
        transform: translateY(-2px);
        box-shadow: var(--vapor-glow-cyan);
    }

    .skill-tag.featured[b-w5oqoolrrf] {
        background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(111, 66, 193, 0.1) 100%);
        border-color: rgba(50, 251, 226, 0.3);
    }

.endorsement-count[b-w5oqoolrrf] {
    font-size: 12px;
    color: var(--vapor-text-muted);
    background: rgba(255, 255, 255, 0.1);
    padding: 2px 6px;
    border-radius: 10px;
}

.languages-section h4[b-w5oqoolrrf] {
    font-size: 15px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

    .languages-section h4 i[b-w5oqoolrrf] {
        color: var(--vapor-accent);
    }

.languages-list[b-w5oqoolrrf] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.language-item[b-w5oqoolrrf] {
    display: flex;
    justify-content: space-between;
    padding: 8px 12px;
    background: rgba(10, 5, 20, 0.5);
    border-radius: 8px;
}

.language-name[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-main);
}

.language-level[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-muted);
}

/* Certifications */
.certification-item[b-w5oqoolrrf] {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

    .certification-item:last-child[b-w5oqoolrrf] {
        border-bottom: none;
    }

.cert-icon[b-w5oqoolrrf] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(50, 251, 226, 0.2) 0%, rgba(111, 66, 193, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .cert-icon i[b-w5oqoolrrf] {
        font-size: 20px;
        color: var(--vapor-accent);
    }

.cert-details h4[b-w5oqoolrrf] {
    font-size: 15px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin: 0 0 4px;
}

.cert-issuer[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
    margin: 0 0 4px;
}

.cert-date[b-w5oqoolrrf], .cert-license[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-dim);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

    .cert-date i[b-w5oqoolrrf] {
        font-size: 14px;
        color: var(--vapor-accent);
    }

/* Ratings & Reviews Section */
.ratings-card .card-header h3 i[b-w5oqoolrrf] {
    color: #f5a623;
    text-shadow: 0 0 8px rgba(245, 166, 35, 0.4);
}

.ratings-overview[b-w5oqoolrrf] {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    margin-bottom: 24px;
}

.ratings-summary[b-w5oqoolrrf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 100px;
    flex-shrink: 0;
}

.ratings-big-number[b-w5oqoolrrf] {
    font-size: 48px;
    font-weight: 700;
    color: var(--vapor-text-main);
    line-height: 1;
}

.ratings-summary-stars[b-w5oqoolrrf] {
    display: flex;
    gap: 2px;
    margin: 6px 0;
}

    .ratings-summary-stars i[b-w5oqoolrrf] {
        color: #f5a623;
        font-size: 16px;
    }

.ratings-total[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-muted);
}

.ratings-breakdown[b-w5oqoolrrf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.breakdown-row[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.breakdown-label[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-secondary);
    min-width: 32px;
    display: flex;
    align-items: center;
    gap: 2px;
}

    .breakdown-label i[b-w5oqoolrrf] {
        color: #f5a623;
        font-size: 10px;
    }

.breakdown-bar-track[b-w5oqoolrrf] {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 4px;
    overflow: hidden;
}

.breakdown-bar-fill[b-w5oqoolrrf] {
    height: 100%;
    background: linear-gradient(90deg, #f5a623, #f7c948);
    border-radius: 4px;
    transition: width 0.6s ease;
}

.breakdown-count[b-w5oqoolrrf] {
    font-size: 12px;
    color: var(--vapor-text-muted);
    min-width: 24px;
    text-align: right;
}

.ratings-categories[b-w5oqoolrrf] {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.category-row[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.category-label[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-secondary);
}

.category-stars[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 2px;
}

    .category-stars i[b-w5oqoolrrf] {
        color: #f5a623;
        font-size: 14px;
    }

.category-avg[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-muted);
    margin-left: 8px;
    min-width: 28px;
}

@media (max-width: 480px) {
    .ratings-overview[b-w5oqoolrrf] {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }

    .ratings-breakdown[b-w5oqoolrrf] {
        width: 100%;
    }
}

/* Experience Section */
.experience-item[b-w5oqoolrrf] {
    display: flex;
    gap: 16px;
    padding: 20px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

    .experience-item:last-child[b-w5oqoolrrf] {
        border-bottom: none;
    }

    .experience-item.current-position[b-w5oqoolrrf] {
        position: relative;
    }

        .experience-item.current-position[b-w5oqoolrrf]::before {
            content: '';
            position: absolute;
            left: -24px;
            top: 0;
            bottom: 0;
            width: 3px;
            background: var(--vapor-accent);
            border-radius: 0 3px 3px 0;
            box-shadow: var(--vapor-glow-cyan);
        }

.experience-logo[b-w5oqoolrrf] {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

    .experience-logo img[b-w5oqoolrrf] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.company-initial[b-w5oqoolrrf] {
    font-size: 24px;
    font-weight: 700;
    color: var(--vapor-accent);
    text-transform: uppercase;
}

.experience-details h4[b-w5oqoolrrf] {
    font-size: 16px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin: 0 0 4px;
}

.company-name[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
    margin: 0 0 4px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.current-badge[b-w5oqoolrrf] {
    background: rgba(50, 251, 226, 0.2);
    color: var(--vapor-accent);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.experience-period[b-w5oqoolrrf], .experience-location[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-dim);
    margin: 0 0 4px;
    display: flex;
    align-items: center;
    gap: 6px;
}

    .experience-period i[b-w5oqoolrrf], .experience-location i[b-w5oqoolrrf] {
        font-size: 14px;
        color: var(--vapor-accent);
    }

.experience-description[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
    margin: 8px 0 0;
    line-height: 1.6;
}

/* Reviews Section */
.overall-rating[b-w5oqoolrrf] {
    display: flex;
    gap: 32px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 20px;
}

.rating-big[b-w5oqoolrrf] {
    text-align: center;
    padding-right: 32px;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.rating-value[b-w5oqoolrrf] {
    font-size: 48px;
    font-weight: 700;
    color: var(--vapor-text-main);
    line-height: 1;
}

.rating-stars-large[b-w5oqoolrrf] {
    display: flex;
    justify-content: center;
    gap: 2px;
    margin: 8px 0;
}

    .rating-stars-large i[b-w5oqoolrrf] {
        font-size: 20px;
        color: #f59e0b;
    }

.total-reviews[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
}

.rating-breakdown[b-w5oqoolrrf] {
    flex: 1;
}

.rating-bar-row[b-w5oqoolrrf] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

    .rating-bar-row .stars-label[b-w5oqoolrrf] {
        width: 16px;
        font-size: 14px;
        color: var(--vapor-text-muted);
    }

    .rating-bar-row .star-icon[b-w5oqoolrrf] {
        font-size: 14px;
        color: #f59e0b;
    }

.rating-bar[b-w5oqoolrrf] {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    overflow: hidden;
}

.rating-fill[b-w5oqoolrrf] {
    height: 100%;
    background: #f59e0b;
    border-radius: 4px;
}

.rating-bar-row .rating-count[b-w5oqoolrrf] {
    width: 24px;
    font-size: 13px;
    color: var(--vapor-text-muted);
    text-align: right;
}

/* Testimonials */
.testimonials-list[b-w5oqoolrrf] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.testimonial-item[b-w5oqoolrrf] {
    padding: 16px;
    background: rgba(10, 5, 20, 0.5);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.testimonial-header[b-w5oqoolrrf] {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
}

.testimonial-avatar[b-w5oqoolrrf] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

    .testimonial-avatar img[b-w5oqoolrrf] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.testimonial-meta h4[b-w5oqoolrrf] {
    font-size: 15px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin: 0 0 4px;
}

.testimonial-rating[b-w5oqoolrrf] {
    display: flex;
    gap: 2px;
    margin-bottom: 2px;
}

    .testimonial-rating i[b-w5oqoolrrf] {
        font-size: 14px;
        color: #f59e0b;
    }

.review-date[b-w5oqoolrrf] {
    font-size: 12px;
    color: var(--vapor-text-dim);
}

.testimonial-text[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
    line-height: 1.6;
    margin: 0;
    font-style: italic;
}

.service-tag[b-w5oqoolrrf] {
    display: inline-block;
    margin-top: 8px;
    padding: 4px 10px;
    background: rgba(50, 251, 226, 0.15);
    color: var(--vapor-accent);
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid rgba(50, 251, 226, 0.2);
}

.see-all-link[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-accent);
    text-decoration: none;
    font-weight: 500;
}

    .see-all-link:hover[b-w5oqoolrrf] {
        text-decoration: underline;
        text-shadow: var(--vapor-glow-cyan);
    }

/* Awards Section */
.award-item[b-w5oqoolrrf] {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

    .award-item:last-child[b-w5oqoolrrf] {
        border-bottom: none;
    }

.award-icon[b-w5oqoolrrf] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.2) 0%, rgba(217, 119, 6, 0.1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .award-icon i[b-w5oqoolrrf] {
        font-size: 20px;
        color: #f59e0b;
    }

.award-details h4[b-w5oqoolrrf] {
    font-size: 15px;
    font-weight: 600;
    color: var(--vapor-text-main);
    margin: 0 0 4px;
}

.award-issuer[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-text-muted);
    margin: 0 0 4px;
}

.award-date[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-dim);
    margin: 0;
}

/* Publications */
.publication-item[b-w5oqoolrrf] {
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

    .publication-item:last-child[b-w5oqoolrrf] {
        border-bottom: none;
    }

    .publication-item h4[b-w5oqoolrrf] {
        font-size: 15px;
        font-weight: 600;
        color: var(--vapor-text-main);
        margin: 0 0 4px;
        line-height: 1.4;
    }

.publication-journal[b-w5oqoolrrf] {
    font-size: 14px;
    color: var(--vapor-accent);
    margin: 0 0 4px;
    font-style: italic;
}

.publication-meta[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-text-dim);
    margin: 0 0 8px;
    display: flex;
    gap: 12px;
}

.pub-link[b-w5oqoolrrf] {
    font-size: 13px;
    color: var(--vapor-accent);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

    .pub-link:hover[b-w5oqoolrrf] {
        text-decoration: underline;
        text-shadow: var(--vapor-glow-cyan);
    }

/* Bottom CTA Section */
.profile-bottom-section[b-w5oqoolrrf] {
    margin-top: 24px;
}

.cta-card[b-w5oqoolrrf] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border-radius: 20px;
    padding: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
    box-shadow: 0 10px 30px rgba(111, 66, 193, 0.3), var(--vapor-glow-pink);
}

.cta-content h3[b-w5oqoolrrf] {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 8px;
}

.cta-content p[b-w5oqoolrrf] {
    font-size: 15px;
    margin: 0;
    opacity: 0.9;
}

.cta-actions[b-w5oqoolrrf] {
    display: flex;
    gap: 12px;
}

.btn-primary-cta[b-w5oqoolrrf], .btn-secondary-cta[b-w5oqoolrrf] {
    padding: 12px 24px;
    border-radius: 24px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    border: none;
}

.btn-primary-cta[b-w5oqoolrrf] {
    background: white;
    color: var(--vapor-primary);
}

    .btn-primary-cta:hover[b-w5oqoolrrf] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    }

.btn-secondary-cta[b-w5oqoolrrf] {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

    .btn-secondary-cta:hover[b-w5oqoolrrf] {
        background: rgba(255, 255, 255, 0.3);
    }

/* Responsive Design */
@media (max-width: 992px) {
    .profile-content-grid[b-w5oqoolrrf] {
        grid-template-columns: 1fr;
    }

    .stats-section[b-w5oqoolrrf] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .profile-header-content[b-w5oqoolrrf] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 0 16px 24px;
    }

    .profile-avatar-container[b-w5oqoolrrf] {
        margin-top: -90px;
    }

    .profile-info[b-w5oqoolrrf] {
        padding: 16px 0 0;
    }

    .profile-name-section[b-w5oqoolrrf] {
        justify-content: center;
    }

    .profile-location[b-w5oqoolrrf] {
        justify-content: center;
    }

    .profile-actions[b-w5oqoolrrf] {
        justify-content: center;
    }

    .profile-profession-row[b-w5oqoolrrf] {
        justify-content: center;
        gap: 12px;
    }

    .profession-separator[b-w5oqoolrrf] {
        display: none;
    }

    .overall-rating[b-w5oqoolrrf] {
        flex-direction: column;
        gap: 16px;
    }

    .rating-big[b-w5oqoolrrf] {
        padding-right: 0;
        padding-bottom: 16px;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    .cta-card[b-w5oqoolrrf] {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }

    .cta-actions[b-w5oqoolrrf] {
        flex-direction: column;
        width: 100%;
    }

    .btn-primary-cta[b-w5oqoolrrf], .btn-secondary-cta[b-w5oqoolrrf] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .stats-section[b-w5oqoolrrf] {
        grid-template-columns: 1fr;
    }

    .profile-cover-photo[b-w5oqoolrrf] {
        height: 150px;
    }

    .profile-avatar[b-w5oqoolrrf] {
        width: 140px;
        height: 140px;
    }

    .profile-avatar-container[b-w5oqoolrrf] {
        margin-top: -70px;
    }

    .profile-name[b-w5oqoolrrf] {
        font-size: 24px;
    }

    .profile-title[b-w5oqoolrrf] {
        font-size: 16px;
    }
}

.profile-cedula-status[b-w5oqoolrrf] {
    margin: 12px 0;
    font-size: 14px;
}

.cedula-validated[b-w5oqoolrrf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #10b981;
    font-weight: 500;
    background: rgba(16, 185, 129, 0.1);
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.cedula-validated i[b-w5oqoolrrf] {
    font-size: 16px;
}

.cedula-not-verified[b-w5oqoolrrf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--vapor-text-dim);
    font-weight: 400;
    background: rgba(255, 255, 255, 0.05);
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.cedula-not-verified i[b-w5oqoolrrf] {
    font-size: 16px;
}
/* /Components/Pages/SpecialistsDirectory.razor.rz.scp.css */
/* Vapor Theme Specialists Directory Styles */

.specialists-directory-wrapper[b-z3g5rszggs] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    background: transparent; /* Handled by global body style */
}

.specialists-directory-wrapper[b-z3g5rszggs]::-webkit-scrollbar {
    width: 10px;
}

.specialists-directory-wrapper[b-z3g5rszggs]::-webkit-scrollbar-track {
    background: transparent;
}

.specialists-directory-wrapper[b-z3g5rszggs]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 5px;
}

.specialists-directory-wrapper[b-z3g5rszggs]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4);
}

.specialists-container[b-z3g5rszggs] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem;
    width: 100%;
}

/* Header Section */
.directory-header[b-z3g5rszggs] {
    text-align: center;
    padding: 3rem 0 4rem;
    margin-bottom: 3rem;
    position: relative;
}

.directory-header[b-z3g5rszggs]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(111, 66, 193, 0.1) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.header-content[b-z3g5rszggs] {
    position: relative;
    z-index: 1;
}

.header-icon[b-z3g5rszggs] {
    font-size: 4rem;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1.5rem;
    animation: float-b-z3g5rszggs 3s ease-in-out infinite;
    text-shadow: var(--vapor-glow-pink);
}

@keyframes float-b-z3g5rszggs {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

.header-title[b-z3g5rszggs] {
    font-size: 3rem;
    font-weight: 800;
    color: var(--vapor-text-main);
    margin-bottom: 1rem;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.header-subtitle[b-z3g5rszggs] {
    font-size: 1.25rem;
    color: var(--vapor-text-muted);
    margin-bottom: 0;
    font-weight: 500;
}

/* Filters Section */
.filters-section[b-z3g5rszggs] {
    margin-bottom: 3rem;
}

.filters-card[b-z3g5rszggs] {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
}

.filters-card:hover[b-z3g5rszggs] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(50, 251, 226, 0.2);
    box-shadow: var(--vapor-glow-cyan);
}

.filters-header[b-z3g5rszggs] {
    margin-bottom: 2rem;
}

.filters-header h3[b-z3g5rszggs] {
    color: var(--vapor-text-main);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.filters-header i[b-z3g5rszggs] {
    color: var(--vapor-accent);
}

.filters-grid[b-z3g5rszggs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.filter-group[b-z3g5rszggs] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-z3g5rszggs] {
    color: var(--vapor-text-dim);
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-group .form-control[b-z3g5rszggs],
.filter-group .form-select[b-z3g5rszggs] {
    background: rgba(10, 5, 20, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--vapor-text-main);
    border-radius: 12px;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.filter-group .form-control:focus[b-z3g5rszggs],
.filter-group .form-select:focus[b-z3g5rszggs] {
    background: rgba(10, 5, 20, 0.8);
    border-color: var(--vapor-accent);
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.1), var(--vapor-glow-cyan);
    outline: none;
}

.filter-group .form-control[b-z3g5rszggs]::placeholder {
    color: var(--vapor-text-dim);
}

.filters-actions[b-z3g5rszggs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.results-count[b-z3g5rszggs] {
    color: var(--vapor-text-muted);
    font-weight: 500;
    font-size: 0.95rem;
}

/* Results Section */
.results-section[b-z3g5rszggs] {
    margin-bottom: 3rem;
}

.specialists-grid[b-z3g5rszggs] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 2rem;
    margin-bottom: 3rem;
}

.specialist-card[b-z3g5rszggs] {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.specialist-card-link[b-z3g5rszggs] {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.specialist-card[b-z3g5rszggs]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--vapor-primary) 0%, var(--vapor-secondary) 50%, var(--vapor-accent) 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.specialist-card-link:hover .specialist-card[b-z3g5rszggs]::before {
    opacity: 1;
}

.specialist-card-link:hover .specialist-card[b-z3g5rszggs] {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 
        0 25px 50px rgba(111, 66, 193, 0.25),
        0 10px 20px rgba(234, 57, 184, 0.15),
        var(--vapor-glow-cyan);
    border-color: rgba(50, 251, 226, 0.4);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%);
}

.specialist-header[b-z3g5rszggs] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 1.75rem 1.75rem 1.25rem;
    position: relative;
}

.specialist-avatar[b-z3g5rszggs] {
    width: 72px;
    height: 72px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
    flex-shrink: 0;
    box-shadow: 
        0 8px 24px rgba(111, 66, 193, 0.3),
        var(--vapor-glow-pink);
    overflow: hidden;
    position: relative;
    transition: all 0.3s ease;
}

.specialist-card-link:hover .specialist-avatar[b-z3g5rszggs] {
    transform: scale(1.05);
    box-shadow: 
        0 12px 32px rgba(111, 66, 193, 0.4),
        0 0 30px rgba(234, 57, 184, 0.3);
}

.specialist-avatar img[b-z3g5rszggs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}

.specialist-info[b-z3g5rszggs] {
    flex: 1;
    min-width: 0;
}

.specialist-name[b-z3g5rszggs] {
    color: var(--vapor-text-main);
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0 0 0.35rem 0;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.specialist-specialty[b-z3g5rszggs] {
    color: var(--vapor-accent);
    font-size: 0.875rem;
    font-weight: 500;
}

.specialist-status[b-z3g5rszggs] {
    position: absolute;
    top: 1.75rem;
    right: 1.75rem;
}

.status-icon[b-z3g5rszggs] {
    font-size: 0.625rem;
    cursor: help;
    transition: all 0.2s ease;
}

.status-icon.available[b-z3g5rszggs] {
    color: #10b981;
    filter: drop-shadow(0 0 4px rgba(16, 185, 129, 0.8));
    animation: pulse-icon-b-z3g5rszggs 2s infinite;
}

.status-icon.unavailable[b-z3g5rszggs] {
    color: rgba(255, 255, 255, 0.3);
}

.status-icon:hover[b-z3g5rszggs] {
    transform: scale(1.3);
}

@keyframes pulse-icon-b-z3g5rszggs {
    0%, 100% {
        filter: drop-shadow(0 0 2px rgba(16, 185, 129, 0.6));
    }
    50% {
        filter: drop-shadow(0 0 6px rgba(16, 185, 129, 0.9));
    }
}

.profession-row[b-z3g5rszggs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.35rem;
    flex-wrap: wrap;
}

.profession-label[b-z3g5rszggs] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--vapor-text-main);
}

.profession-separator[b-z3g5rszggs] {
    color: var(--vapor-text-dim);
    font-size: 0.75rem;
    opacity: 0.5;
}

.specialist-rating[b-z3g5rszggs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.02);
}

.rating-stars[b-z3g5rszggs] {
    display: flex;
    gap: 0.2rem;
}

.rating-stars i[b-z3g5rszggs] {
    font-size: 1rem;
    color: #fbbf24;
    filter: drop-shadow(0 0 4px rgba(251, 191, 36, 0.3));
}

.rating-stars.large i[b-z3g5rszggs] {
    font-size: 1.5rem;
}

.rating-text[b-z3g5rszggs] {
    color: var(--vapor-text-muted);
    font-weight: 600;
    font-size: 0.9rem;
}

.no-rating[b-z3g5rszggs] {
    color: var(--vapor-text-dim);
    font-style: italic;
    font-size: 0.9rem;
}

.specialist-body[b-z3g5rszggs] {
    padding: 1.25rem 1.75rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.specialist-contact[b-z3g5rszggs] {
    margin-bottom: 1rem;
}

.contact-item[b-z3g5rszggs] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-bottom: 0.625rem;
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
    transition: all 0.2s ease;
}

.contact-item:last-child[b-z3g5rszggs] {
    margin-bottom: 0;
}

.contact-item i[b-z3g5rszggs] {
    color: var(--vapor-accent);
    font-size: 1rem;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(50, 251, 226, 0.1);
    border-radius: 6px;
    padding: 0.25rem;
}

.specialist-experience[b-z3g5rszggs] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-top: auto;
    padding-top: 1rem;
    color: var(--vapor-text-muted);
    font-size: 0.875rem;
}

.specialist-experience i[b-z3g5rszggs] {
    color: var(--vapor-secondary);
    font-size: 1rem;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(234, 57, 184, 0.1);
    border-radius: 6px;
    padding: 0.25rem;
}

.specialist-actions[b-z3g5rszggs] {
    padding: 1.25rem 1.75rem 1.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: auto;
}

.specialist-actions .btn[b-z3g5rszggs] {
    width: 100%;
    padding: 0.875rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 48px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.specialist-actions .btn-primary[b-z3g5rszggs] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    color: white;
    box-shadow: 0 4px 16px rgba(111, 66, 193, 0.3);
    position: relative;
    overflow: hidden;
}

.specialist-actions .btn-primary[b-z3g5rszggs]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s ease;
}

.specialist-actions .btn-primary:hover[b-z3g5rszggs] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(111, 66, 193, 0.4), var(--vapor-glow-pink);
}

.specialist-actions .btn-primary:hover[b-z3g5rszggs]::before {
    left: 100%;
}

.specialist-actions .btn-primary:active[b-z3g5rszggs] {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(111, 66, 193, 0.3);
}

.specialist-actions .btn i[b-z3g5rszggs] {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.specialist-card-link:hover .specialist-actions .btn-primary i[b-z3g5rszggs] {
    transform: translateX(4px);
}

/* Pagination */
.pagination-container[b-z3g5rszggs] {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
}

.pagination .page-link[b-z3g5rszggs] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--vapor-text-muted);
    padding: 0.75rem 1rem;
    margin: 0 0.25rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.pagination .page-link:hover[b-z3g5rszggs] {
    background: rgba(50, 251, 226, 0.1);
    border-color: var(--vapor-accent);
    color: var(--vapor-text-main);
    box-shadow: var(--vapor-glow-cyan);
}

.pagination .page-item.active .page-link[b-z3g5rszggs] {
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border-color: var(--vapor-primary);
    color: white;
    box-shadow: var(--vapor-glow-pink);
}

.pagination .page-item.disabled .page-link[b-z3g5rszggs] {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.05);
    color: var(--vapor-text-dim);
    cursor: not-allowed;
}

/* Modal Styles */
.modal-content[b-z3g5rszggs] {
    background: #0a0514;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.modal-header[b-z3g5rszggs] {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding: 1.5rem 2rem;
}

.modal-title[b-z3g5rszggs] {
    color: var(--vapor-text-main);
    font-weight: 700;
}

.modal-body[b-z3g5rszggs] {
    padding: 2rem;
}

.modal-footer[b-z3g5rszggs] {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 1.5rem 2rem;
}

.specialist-details .detail-header[b-z3g5rszggs] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.detail-avatar[b-z3g5rszggs] {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--vapor-primary) 0%, var(--vapor-secondary) 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: white;
    flex-shrink: 0;
    box-shadow: var(--vapor-glow-pink);
}

.detail-info[b-z3g5rszggs] {
    flex: 1;
}

.detail-info h3[b-z3g5rszggs] {
    color: var(--vapor-text-main);
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
}

.detail-specialty[b-z3g5rszggs] {
    color: var(--vapor-accent);
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
}

.detail-category[b-z3g5rszggs] {
    color: var(--vapor-text-muted);
    font-size: 1rem;
    margin: 0;
}

.detail-rating[b-z3g5rszggs] {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.detail-section[b-z3g5rszggs] {
    margin-bottom: 2rem;
}

.detail-section h4[b-z3g5rszggs] {
    color: var(--vapor-text-main);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.detail-section p[b-z3g5rszggs] {
    color: var(--vapor-text-muted);
    line-height: 1.6;
    margin: 0;
}

.services-list[b-z3g5rszggs],
.languages-list[b-z3g5rszggs] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .specialists-grid[b-z3g5rszggs] {
        grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    }
}

@media (max-width: 768px) {
    .specialists-container[b-z3g5rszggs] {
        padding: 1.5rem 1rem;
    }

    .directory-header[b-z3g5rszggs] {
        padding: 2rem 0 2.5rem;
        margin-bottom: 2rem;
    }

    .header-title[b-z3g5rszggs] {
        font-size: 2.25rem;
    }

    .header-subtitle[b-z3g5rszggs] {
        font-size: 1.1rem;
    }

    .filters-grid[b-z3g5rszggs] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .filters-card[b-z3g5rszggs] {
        padding: 1.5rem;
    }

    .specialists-grid[b-z3g5rszggs] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .specialist-card[b-z3g5rszggs] {
        border-radius: 20px;
    }

    .specialist-header[b-z3g5rszggs] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1rem;
        padding: 1.5rem 1.25rem 1rem;
    }

    .specialist-avatar[b-z3g5rszggs] {
        width: 80px;
        height: 80px;
        border-radius: 20px;
    }

    .specialist-avatar img[b-z3g5rszggs] {
        border-radius: 20px;
    }

    .specialist-info[b-z3g5rszggs] {
        text-align: center;
    }

    .specialist-specialty[b-z3g5rszggs] {
        justify-content: center;
    }

    .specialist-status[b-z3g5rszggs] {
        position: static;
        margin-top: 0.5rem;
    }

    .profession-row[b-z3g5rszggs] {
        justify-content: center;
    }

    .specialist-rating[b-z3g5rszggs] {
        padding: 0.75rem 1.25rem;
        justify-content: center;
    }

    .specialist-body[b-z3g5rszggs] {
        padding: 1rem 1.25rem;
    }

    .specialist-actions[b-z3g5rszggs] {
        padding: 1rem 1.25rem 1.5rem;
    }

    .specialist-actions .btn[b-z3g5rszggs] {
        min-height: 44px;
        font-size: 0.9rem;
    }

    .filters-actions[b-z3g5rszggs] {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .specialist-details .detail-header[b-z3g5rszggs] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1rem;
    }

    .detail-rating[b-z3g5rszggs] {
        flex-direction: row;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .header-title[b-z3g5rszggs] {
        font-size: 1.875rem;
    }

    .specialist-card[b-z3g5rszggs] {
        border-radius: 16px;
    }

    .specialist-header[b-z3g5rszggs] {
        padding: 1.25rem 1rem 0.875rem;
    }

    .specialist-avatar[b-z3g5rszggs] {
        width: 64px;
        height: 64px;
        border-radius: 16px;
    }

    .specialist-avatar img[b-z3g5rszggs] {
        border-radius: 16px;
    }

    .specialist-name[b-z3g5rszggs] {
        font-size: 1.15rem;
    }

    .specialist-specialty[b-z3g5rszggs] {
        font-size: 0.875rem;
    }

    .specialist-rating[b-z3g5rszggs] {
        padding: 0.625rem 1rem;
    }

    .specialist-body[b-z3g5rszggs] {
        padding: 0.875rem 1rem;
    }

    .contact-item[b-z3g5rszggs] {
        font-size: 0.8rem;
    }

    .specialist-experience[b-z3g5rszggs] {
        font-size: 0.8rem;
    }

    .specialist-actions[b-z3g5rszggs] {
        padding: 0.875rem 1rem 1.25rem;
    }

    .modal-content[b-z3g5rszggs] {
        margin: 1rem;
    }

    .modal-header[b-z3g5rszggs],
    .modal-body[b-z3g5rszggs],
    .modal-footer[b-z3g5rszggs] {
        padding: 1rem;
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    *[b-z3g5rszggs],
    *[b-z3g5rszggs]::before,
    *[b-z3g5rszggs]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .header-icon[b-z3g5rszggs] {
        animation: none !important;
    }
}

/* Focus styles for accessibility */
.specialist-card:focus-visible[b-z3g5rszggs],
.btn:focus-visible[b-z3g5rszggs],
.form-control:focus-visible[b-z3g5rszggs],
.form-select:focus-visible[b-z3g5rszggs] {
    outline: 2px solid var(--vapor-accent);
    outline-offset: 2px;
}

.btn-close:focus-visible[b-z3g5rszggs] {
    outline: 2px solid var(--vapor-accent);
    outline-offset: 2px;
    border-radius: 0.25rem;
}
/* /Components/Pages/TerminosUso.razor.rz.scp.css */
.terms-page-wrapper[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
}

.terms-container[b-rk3lqg3bm5] {
    max-width: 900px;
    margin: 0 auto;
    padding: 3rem 2rem 5rem;
    width: 100%;
}

.terms-hero[b-rk3lqg3bm5] {
    text-align: center;
    padding: 4rem 0 5rem;
    position: relative;
}

.terms-hero[b-rk3lqg3bm5]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
    pointer-events: none;
}

.terms-hero-icon[b-rk3lqg3bm5] {
    font-size: 5rem;
    background: linear-gradient(135deg, #06b6d4 0%, #8b5cf6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1.5rem;
    display: inline-block;
    animation: heroFloat-b-rk3lqg3bm5 3.5s ease-in-out infinite;
    filter: drop-shadow(0 0 18px rgba(6, 182, 212, 0.45));
}

@keyframes heroFloat-b-rk3lqg3bm5 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

.terms-hero-title[b-rk3lqg3bm5] {
    font-size: 3.8rem;
    font-weight: 800;
    color: #f1f5f9;
    margin-bottom: 1rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.gradient-text[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, #06b6d4 0%, #8b5cf6 60%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

.terms-hero-subtitle[b-rk3lqg3bm5] {
    font-size: 1.25rem;
    color: #94a3b8;
    margin-bottom: 2rem;
    font-weight: 400;
}

.terms-meta[b-rk3lqg3bm5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}

.meta-badge[b-rk3lqg3bm5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(6, 182, 212, 0.12);
    color: #22d3ee;
    border: 1px solid rgba(6, 182, 212, 0.25);
    padding: 0.5rem 1.25rem;
    border-radius: 100px;
    font-size: 0.875rem;
    font-weight: 600;
}

.meta-badge-mx[b-rk3lqg3bm5] {
    background: rgba(139, 92, 246, 0.12);
    color: #a78bfa;
    border-color: rgba(139, 92, 246, 0.25);
}

.back-link[b-rk3lqg3bm5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s ease;
}

.back-link:hover[b-rk3lqg3bm5] {
    color: #06b6d4;
}

.terms-intro-card[b-rk3lqg3bm5] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
    background: rgba(6, 182, 212, 0.07);
    border: 1px solid rgba(6, 182, 212, 0.2);
    border-radius: 14px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    color: #7dd3fc;
    font-size: 0.9rem;
    line-height: 1.65;
}

.terms-intro-card i[b-rk3lqg3bm5] {
    font-size: 1.5rem;
    color: #22d3ee;
    flex-shrink: 0;
    margin-top: 0.15rem;
}

.terms-intro-card strong[b-rk3lqg3bm5] {
    display: block;
    color: #e0f2fe;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.terms-intro-card p[b-rk3lqg3bm5] {
    color: #94a3b8;
    margin: 0;
    font-size: 0.875rem;
}

.terms-card[b-rk3lqg3bm5] {
    background: rgba(30, 41, 59, 0.6);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    border: 1px solid rgba(148, 163, 184, 0.1);
    margin-bottom: 1.75rem;
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.terms-card:hover[b-rk3lqg3bm5] {
    border-color: rgba(6, 182, 212, 0.2);
    box-shadow: 0 8px 32px rgba(6, 182, 212, 0.07);
}

.terms-card-medical[b-rk3lqg3bm5] {
    border-color: rgba(245, 158, 11, 0.2);
}

.terms-card-medical:hover[b-rk3lqg3bm5] {
    border-color: rgba(245, 158, 11, 0.35);
    box-shadow: 0 8px 32px rgba(245, 158, 11, 0.07);
}

.terms-card-header[b-rk3lqg3bm5] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 1.75rem 2rem 1rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.07);
}

.terms-card-header h2[b-rk3lqg3bm5] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #f1f5f9;
    margin: 0 0 0.25rem;
}

.section-subtitle[b-rk3lqg3bm5] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
    font-weight: 400;
}

.section-icon[b-rk3lqg3bm5] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.icon-purple[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.3) 0%, rgba(139, 92, 246, 0.15) 100%);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.icon-cyan[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.25) 0%, rgba(6, 182, 212, 0.1) 100%);
    color: #22d3ee;
    border: 1px solid rgba(6, 182, 212, 0.25);
}

.icon-pink[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.25) 0%, rgba(236, 72, 153, 0.1) 100%);
    color: #f472b6;
    border: 1px solid rgba(236, 72, 153, 0.25);
}

.icon-amber[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.25) 0%, rgba(245, 158, 11, 0.1) 100%);
    color: #fbbf24;
    border: 1px solid rgba(245, 158, 11, 0.3);
}

.icon-green[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.25) 0%, rgba(16, 185, 129, 0.1) 100%);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.25);
}

.terms-card-body[b-rk3lqg3bm5] {
    padding: 1.75rem 2rem;
}

.terms-card-body p[b-rk3lqg3bm5] {
    color: #cbd5e1;
    line-height: 1.75;
    margin-bottom: 1.25rem;
}

.terms-card-body p:last-child[b-rk3lqg3bm5] {
    margin-bottom: 0;
}

.service-grid[b-rk3lqg3bm5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.25rem;
}

.service-item[b-rk3lqg3bm5] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.service-item i[b-rk3lqg3bm5] {
    font-size: 1.6rem;
    color: #22d3ee;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.service-item h4[b-rk3lqg3bm5] {
    color: #f1f5f9;
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.375rem;
}

.service-item p[b-rk3lqg3bm5] {
    color: #94a3b8;
    font-size: 0.85rem;
    line-height: 1.55;
    margin: 0;
}

.eligibility-list[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin-bottom: 1.25rem;
}

.eligibility-item[b-rk3lqg3bm5] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    font-size: 0.9rem;
    line-height: 1.6;
    padding: 0.875rem 1rem;
    border-radius: 10px;
}

.eligibility-item.eligible[b-rk3lqg3bm5] {
    background: rgba(16, 185, 129, 0.06);
    border: 1px solid rgba(16, 185, 129, 0.15);
    color: #cbd5e1;
}

.eligibility-item.eligible i[b-rk3lqg3bm5] {
    color: #34d399;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.eligibility-item.not-eligible[b-rk3lqg3bm5] {
    background: rgba(239, 68, 68, 0.06);
    border: 1px solid rgba(239, 68, 68, 0.15);
    color: #cbd5e1;
}

.eligibility-item.not-eligible i[b-rk3lqg3bm5] {
    color: #f87171;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.account-rules[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.account-rule[b-rk3lqg3bm5] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.125rem 1.25rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.rule-icon[b-rk3lqg3bm5] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(236, 72, 153, 0.12);
    color: #f472b6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.account-rule h4[b-rk3lqg3bm5] {
    color: #f1f5f9;
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.375rem;
}

.account-rule p[b-rk3lqg3bm5] {
    color: #94a3b8;
    font-size: 0.875rem;
    line-height: 1.6;
    margin: 0;
}

.account-rule p a[b-rk3lqg3bm5] {
    color: #a78bfa;
    text-decoration: none;
}

.account-rule p a:hover[b-rk3lqg3bm5] {
    text-decoration: underline;
}

.usage-columns[b-rk3lqg3bm5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-top: 0.5rem;
}

.usage-col[b-rk3lqg3bm5] {
    background: rgba(15, 23, 42, 0.5);
    border-radius: 12px;
    padding: 1.5rem;
}

.usage-allowed[b-rk3lqg3bm5] {
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-left: 3px solid #10b981;
}

.usage-forbidden[b-rk3lqg3bm5] {
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-left: 3px solid #ef4444;
}

.usage-col h4[b-rk3lqg3bm5] {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.usage-allowed h4[b-rk3lqg3bm5] {
    color: #34d399;
}

.usage-forbidden h4[b-rk3lqg3bm5] {
    color: #f87171;
}

.usage-col ul[b-rk3lqg3bm5] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.usage-col ul li[b-rk3lqg3bm5] {
    color: #cbd5e1;
    font-size: 0.875rem;
    line-height: 1.55;
    padding-left: 1.125rem;
    position: relative;
}

.usage-allowed ul li[b-rk3lqg3bm5]::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #34d399;
    font-weight: 700;
    font-size: 0.8rem;
}

.usage-forbidden ul li[b-rk3lqg3bm5]::before {
    content: '✕';
    position: absolute;
    left: 0;
    color: #f87171;
    font-weight: 700;
    font-size: 0.8rem;
}

.medical-alert[b-rk3lqg3bm5] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.35);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    color: #fcd34d;
}

.medical-alert i[b-rk3lqg3bm5] {
    font-size: 1.5rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.medical-alert strong[b-rk3lqg3bm5] {
    display: block;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.medical-alert p[b-rk3lqg3bm5] {
    color: #fbbf24;
    font-size: 0.875rem;
    margin: 0;
    opacity: 0.85;
}

.medical-disclaimers[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.medical-item[b-rk3lqg3bm5] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    color: #94a3b8;
    font-size: 0.875rem;
    line-height: 1.65;
}

.medical-item i[b-rk3lqg3bm5] {
    color: #6b7280;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.ip-grid[b-rk3lqg3bm5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.875rem;
    margin: 1.25rem 0;
}

.ip-item[b-rk3lqg3bm5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(15, 23, 42, 0.5);
    border-radius: 10px;
    padding: 0.875rem 1rem;
    color: #cbd5e1;
    font-size: 0.875rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.ip-item i[b-rk3lqg3bm5] {
    color: #a78bfa;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.privacy-highlights[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin: 1.25rem 0;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(6, 182, 212, 0.12);
}

.privacy-point[b-rk3lqg3bm5] {
    display: flex;
    gap: 0.875rem;
    align-items: center;
    color: #cbd5e1;
    font-size: 0.9rem;
}

.privacy-point i[b-rk3lqg3bm5] {
    color: #22d3ee;
    font-size: 1rem;
    flex-shrink: 0;
}

.privacy-link[b-rk3lqg3bm5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #22d3ee;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    transition: gap 0.2s, color 0.2s;
    margin-top: 0.5rem;
}

.privacy-link:hover[b-rk3lqg3bm5] {
    color: #06b6d4;
    gap: 0.75rem;
}

.liability-notice[b-rk3lqg3bm5] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    background: rgba(245, 158, 11, 0.07);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    color: #fcd34d;
    font-size: 0.9rem;
    margin-bottom: 1.25rem;
}

.liability-notice i[b-rk3lqg3bm5] {
    font-size: 1.1rem;
    flex-shrink: 0;
    color: #fbbf24;
}

.liability-items[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.liability-item[b-rk3lqg3bm5] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    color: #94a3b8;
    font-size: 0.875rem;
    line-height: 1.65;
    padding: 0.75rem 1rem;
    background: rgba(15, 23, 42, 0.35);
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.06);
}

.liability-item i[b-rk3lqg3bm5] {
    color: #64748b;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.termination-cases[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.termination-item[b-rk3lqg3bm5] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    color: #cbd5e1;
    font-size: 0.9rem;
    line-height: 1.6;
}

.term-num[b-rk3lqg3bm5] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ec4899, #8b5cf6);
    color: white;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.termination-user[b-rk3lqg3bm5] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    color: #94a3b8;
    font-size: 0.875rem;
    line-height: 1.65;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.termination-user i[b-rk3lqg3bm5] {
    color: #f472b6;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.termination-user a[b-rk3lqg3bm5] {
    color: #a78bfa;
    text-decoration: none;
}

.termination-user a:hover[b-rk3lqg3bm5] {
    text-decoration: underline;
}

.law-refs[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.25rem;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.law-ref[b-rk3lqg3bm5] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    color: #cbd5e1;
    font-size: 0.875rem;
}

.law-ref i[b-rk3lqg3bm5] {
    color: #8b5cf6;
    font-size: 1rem;
    flex-shrink: 0;
}

.contact-items[b-rk3lqg3bm5] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin: 1.25rem 0;
    background: rgba(15, 23, 42, 0.4);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.08);
}

.contact-row[b-rk3lqg3bm5] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.contact-row i[b-rk3lqg3bm5] {
    color: #22d3ee;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.contact-label[b-rk3lqg3bm5] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.contact-value[b-rk3lqg3bm5] {
    color: #e2e8f0;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.95rem;
    transition: color 0.2s;
}

a.contact-value:hover[b-rk3lqg3bm5] {
    color: #22d3ee;
}

.response-note[b-rk3lqg3bm5] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    color: #64748b;
    font-size: 0.8rem;
}

.response-note i[b-rk3lqg3bm5] {
    color: #475569;
}

.terms-footer-cta[b-rk3lqg3bm5] {
    text-align: center;
    padding: 3rem 2rem;
    background: rgba(30, 41, 59, 0.4);
    border-radius: 16px;
    border: 1px solid rgba(6, 182, 212, 0.2);
    margin-top: 1rem;
}

.terms-vigencia[b-rk3lqg3bm5] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    background: rgba(6, 182, 212, 0.07);
    border: 1px solid rgba(6, 182, 212, 0.18);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    color: #94a3b8;
    font-size: 0.875rem;
    line-height: 1.65;
    text-align: left;
    margin-bottom: 2rem;
}

.terms-vigencia i[b-rk3lqg3bm5] {
    color: #22d3ee;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.terms-vigencia strong[b-rk3lqg3bm5] {
    color: #e2e8f0;
}

.terms-footer-links[b-rk3lqg3bm5] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.footer-btn[b-rk3lqg3bm5] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1.75rem;
    border-radius: 100px;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    transition: all 0.3s ease;
}

.footer-btn-primary[b-rk3lqg3bm5] {
    background: linear-gradient(135deg, #06b6d4 0%, #8b5cf6 100%);
    color: white;
    box-shadow: 0 4px 16px rgba(6, 182, 212, 0.3);
}

.footer-btn-primary:hover[b-rk3lqg3bm5] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(6, 182, 212, 0.45);
    color: white;
}

.footer-btn-secondary[b-rk3lqg3bm5] {
    background: rgba(148, 163, 184, 0.1);
    color: #cbd5e1;
    border: 1px solid rgba(148, 163, 184, 0.2);
}

.footer-btn-secondary:hover[b-rk3lqg3bm5] {
    background: rgba(148, 163, 184, 0.18);
    color: #f1f5f9;
    transform: translateY(-2px);
}

.footer-home-link[b-rk3lqg3bm5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #64748b;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s;
}

.footer-home-link:hover[b-rk3lqg3bm5] {
    color: #06b6d4;
}

@media (max-width: 768px) {
    .terms-container[b-rk3lqg3bm5] {
        padding: 2rem 1.25rem 4rem;
    }

    .terms-hero[b-rk3lqg3bm5] {
        padding: 3rem 0 3.5rem;
    }

    .terms-hero-icon[b-rk3lqg3bm5] {
        font-size: 3.5rem;
    }

    .terms-hero-title[b-rk3lqg3bm5] {
        font-size: 2.5rem;
    }

    .terms-card-header[b-rk3lqg3bm5] {
        padding: 1.25rem 1.25rem 0.875rem;
    }

    .terms-card-body[b-rk3lqg3bm5] {
        padding: 1.25rem;
    }

    .service-grid[b-rk3lqg3bm5] {
        grid-template-columns: 1fr;
    }

    .usage-columns[b-rk3lqg3bm5] {
        grid-template-columns: 1fr;
    }

    .ip-grid[b-rk3lqg3bm5] {
        grid-template-columns: 1fr;
    }

    .terms-meta[b-rk3lqg3bm5] {
        flex-direction: column;
        align-items: center;
    }

    .terms-footer-links[b-rk3lqg3bm5] {
        flex-direction: column;
        align-items: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .terms-hero-icon[b-rk3lqg3bm5] {
        animation: none;
    }
}
/* /Components/Shared/AppointmentRequestModal.razor.rz.scp.css */
.modal-overlay[b-avyoe37ygv] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.modal-overlay.visible[b-avyoe37ygv] {
    opacity: 1;
    visibility: visible;
}

.modal-container[b-avyoe37ygv] {
    background: linear-gradient(145deg, rgba(30, 30, 45, 0.98), rgba(20, 20, 35, 0.98));
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    width: 90%;
    max-width: 560px;
    max-height: 85vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.5);
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.modal-overlay.visible .modal-container[b-avyoe37ygv] {
    transform: scale(1) translateY(0);
}

.modal-header[b-avyoe37ygv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.2);
}

.modal-header h3[b-avyoe37ygv] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.modal-header h3 i[b-avyoe37ygv] {
    color: var(--accent-primary, #2ecc71);
}

.btn-close[b-avyoe37ygv] {
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: rgba(255, 255, 255, 0.7);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-close:hover[b-avyoe37ygv] {
    background: rgba(255, 100, 100, 0.3);
    color: #ff6b6b;
}

.modal-body[b-avyoe37ygv] {
    padding: 1.5rem;
    overflow-y: auto;
    flex: 1;
}

.step-indicator[b-avyoe37ygv] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.step[b-avyoe37ygv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.4);
    background: rgba(255, 255, 255, 0.05);
    transition: all 0.3s ease;
}

.step.active[b-avyoe37ygv] {
    color: #fff;
    background: linear-gradient(135deg, var(--accent-primary, #2ecc71), var(--accent-secondary, #27ae60));
}

.step.completed[b-avyoe37ygv] {
    color: var(--accent-primary, #2ecc71);
    background: rgba(46, 204, 113, 0.2);
}

.loading-state[b-avyoe37ygv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 1rem;
}

.spinner[b-avyoe37ygv] {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top-color: var(--accent-primary, #2ecc71);
    border-radius: 50%;
    animation: spin-b-avyoe37ygv 1s linear infinite;
}

.spinner-small[b-avyoe37ygv] {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-avyoe37ygv 1s linear infinite;
}

@keyframes spin-b-avyoe37ygv {
    to { transform: rotate(360deg); }
}

.date-selection h4[b-avyoe37ygv],
.time-selection h4[b-avyoe37ygv] {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.9);
    text-transform: capitalize;
}

.date-grid[b-avyoe37ygv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 0.75rem;
}

.date-card[b-avyoe37ygv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 0.5rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #fff;
}

.date-card:hover[b-avyoe37ygv] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(46, 204, 113, 0.5);
    transform: translateY(-2px);
}

.date-card.selected[b-avyoe37ygv] {
    background: linear-gradient(135deg, var(--accent-primary, #2ecc71), var(--accent-secondary, #27ae60));
    border-color: transparent;
}

.date-card .day-name[b-avyoe37ygv] {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 0.25rem;
}

.date-card.selected .day-name[b-avyoe37ygv] {
    color: rgba(255, 255, 255, 0.9);
}

.date-card .day-number[b-avyoe37ygv] {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.date-card .month-name[b-avyoe37ygv] {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    margin-top: 0.25rem;
}

.date-card.selected .month-name[b-avyoe37ygv] {
    color: rgba(255, 255, 255, 0.8);
}

.time-grid[b-avyoe37ygv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 0.75rem;
}

.time-card[b-avyoe37ygv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
}

.time-card:hover[b-avyoe37ygv] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(46, 204, 113, 0.5);
}

.time-card.selected[b-avyoe37ygv] {
    background: linear-gradient(135deg, var(--accent-primary, #2ecc71), var(--accent-secondary, #27ae60));
    border-color: transparent;
}

.time-card i[b-avyoe37ygv] {
    font-size: 0.9rem;
    opacity: 0.7;
}

.time-card.selected i[b-avyoe37ygv] {
    opacity: 1;
}

.no-availability[b-avyoe37ygv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    text-align: center;
    color: rgba(255, 255, 255, 0.6);
}

.no-availability i[b-avyoe37ygv] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.no-availability p[b-avyoe37ygv] {
    margin: 0;
}

.no-availability .hint[b-avyoe37ygv] {
    font-size: 0.85rem;
    opacity: 0.7;
    margin-top: 0.5rem;
}


.confirmation[b-avyoe37ygv] {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 12px;
    padding: 1.5rem;
}

.appointment-summary[b-avyoe37ygv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.summary-item[b-avyoe37ygv] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.summary-item i[b-avyoe37ygv] {
    font-size: 1.25rem;
    color: var(--accent-primary, #2ecc71);
    width: 24px;
    text-align: center;
    margin-top: 2px;
}

.summary-item div[b-avyoe37ygv] {
    display: flex;
    flex-direction: column;
}

.summary-item .label[b-avyoe37ygv] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.summary-item .value[b-avyoe37ygv] {
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
}

.note-section[b-avyoe37ygv] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.note-section label[b-avyoe37ygv] {
    display: block;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 0.5rem;
}

.note-section textarea[b-avyoe37ygv] {
    width: 100%;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: #fff;
    font-family: inherit;
    font-size: 0.95rem;
    resize: vertical;
    transition: border-color 0.2s ease;
}

.note-section textarea[b-avyoe37ygv]::placeholder {
    color: rgba(255, 255, 255, 0.3);
}

.note-section textarea:focus[b-avyoe37ygv] {
    outline: none;
    border-color: var(--accent-primary, #2ecc71);
}

.note-section .char-count[b-avyoe37ygv] {
    display: block;
    text-align: right;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 0.25rem;
}

.error-message[b-avyoe37ygv],
.success-message[b-avyoe37ygv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 10px;
    margin-top: 1rem;
    font-size: 0.9rem;
}

.error-message[b-avyoe37ygv] {
    background: rgba(231, 76, 60, 0.2);
    border: 1px solid rgba(231, 76, 60, 0.4);
    color: #ff6b6b;
}

.success-message[b-avyoe37ygv] {
    background: rgba(46, 204, 113, 0.2);
    border: 1px solid rgba(46, 204, 113, 0.4);
    color: #2ecc71;
}

.modal-footer[b-avyoe37ygv] {
    padding: 1rem 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: flex-end;
    background: rgba(0, 0, 0, 0.2);
}

.modal-footer .btn-primary[b-avyoe37ygv] {
    border-radius: 24px;
    padding: 10px 24px;
    font-size: 15px;
    font-weight: 600;
}


@media (max-width: 480px) {
    .modal-container[b-avyoe37ygv] {
        width: 95%;
        max-height: 90vh;
    }

    .modal-header[b-avyoe37ygv],
    .modal-body[b-avyoe37ygv],
    .modal-footer[b-avyoe37ygv] {
        padding: 1rem;
    }

    .step-indicator[b-avyoe37ygv] {
        gap: 0.5rem;
    }

    .step[b-avyoe37ygv] {
        padding: 0.4rem 0.75rem;
        font-size: 0.75rem;
    }

    .date-grid[b-avyoe37ygv] {
        grid-template-columns: repeat(4, 1fr);
    }

    .time-grid[b-avyoe37ygv] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* /Components/Shared/NotificationCenter.razor.rz.scp.css */
.notification-center[b-sup7f3luwv] {
    position: relative;
}

.notification-bell[b-sup7f3luwv] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--vapor-text-muted);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 1.1rem;
}

.notification-bell:hover[b-sup7f3luwv] {
    background: rgba(255, 255, 255, 0.1);
    color: var(--vapor-accent);
    box-shadow: var(--vapor-glow-cyan);
}

.notification-bell:focus-visible[b-sup7f3luwv] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 251, 226, 0.5);
}

.notification-badge[b-sup7f3luwv] {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: linear-gradient(135deg, #ea39b8 0%, #6f42c1 100%);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 12px rgba(234, 57, 184, 0.6),
                0 0 24px rgba(234, 57, 184, 0.4);
    animation: badgePulse-b-sup7f3luwv 2s ease-in-out infinite;
}

@keyframes badgePulse-b-sup7f3luwv {
    0%, 100% { box-shadow: 0 0 12px rgba(234, 57, 184, 0.6), 0 0 24px rgba(234, 57, 184, 0.4); }
    50% { box-shadow: 0 0 20px rgba(234, 57, 184, 0.8), 0 0 40px rgba(234, 57, 184, 0.6); }
}

.notification-backdrop[b-sup7f3luwv] {
    position: fixed;
    inset: 0;
    z-index: 999;
}

.notification-panel[b-sup7f3luwv] {
    position: absolute;
    top: calc(100% + 0.75rem);
    right: 0;
    width: 380px;
    max-height: 70vh;
    background: rgba(10, 5, 20, 0.92);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    box-shadow: 0 16px 64px rgba(0, 0, 0, 0.5),
                0 0 32px rgba(111, 66, 193, 0.2);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    animation: panelSlideIn-b-sup7f3luwv 0.25s ease-out;
    overflow: hidden;
}

@keyframes panelSlideIn-b-sup7f3luwv {
    from {
        opacity: 0;
        transform: translateY(-12px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.panel-header[b-sup7f3luwv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.panel-header h3[b-sup7f3luwv] {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--vapor-text-main);
}

.btn-mark-all[b-sup7f3luwv] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.75rem;
    border: none;
    border-radius: 6px;
    background: rgba(50, 251, 226, 0.1);
    color: var(--vapor-accent);
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-mark-all:hover[b-sup7f3luwv] {
    background: rgba(50, 251, 226, 0.2);
    box-shadow: var(--vapor-glow-cyan);
}

.notification-list[b-sup7f3luwv] {
    flex: 1;
    overflow-y: auto;
    max-height: calc(70vh - 120px);
    scrollbar-width: thin;
    scrollbar-color: rgba(111, 66, 193, 0.5) transparent;
}

.notification-list[b-sup7f3luwv]::-webkit-scrollbar {
    width: 6px;
}

.notification-list[b-sup7f3luwv]::-webkit-scrollbar-track {
    background: transparent;
}

.notification-list[b-sup7f3luwv]::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(111, 66, 193, 0.5), rgba(234, 57, 184, 0.5));
    border-radius: 3px;
}

.notification-list[b-sup7f3luwv]::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(111, 66, 193, 0.7), rgba(234, 57, 184, 0.7));
}

.loading-state[b-sup7f3luwv],
.empty-state[b-sup7f3luwv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: var(--vapor-text-muted);
    gap: 0.75rem;
}

.empty-state i[b-sup7f3luwv] {
    font-size: 2.5rem;
    opacity: 0.5;
}

.empty-state p[b-sup7f3luwv] {
    margin: 0;
    font-size: 0.9rem;
}

.spinner[b-sup7f3luwv] {
    width: 24px;
    height: 24px;
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-top-color: var(--vapor-accent);
    border-radius: 50%;
    animation: spin-b-sup7f3luwv 0.8s linear infinite;
}

@keyframes spin-b-sup7f3luwv {
    to { transform: rotate(360deg); }
}

.notification-group[b-sup7f3luwv] {
    padding: 0.5rem 0;
}

.group-header[b-sup7f3luwv] {
    padding: 0.5rem 1.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--vapor-text-muted);
    opacity: 0.7;
}

.notification-item[b-sup7f3luwv] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

.notification-item:hover[b-sup7f3luwv] {
    background: rgba(255, 255, 255, 0.05);
}

.notification-item.unread[b-sup7f3luwv] {
    background: rgba(50, 251, 226, 0.03);
}

.notification-item.unread:hover[b-sup7f3luwv] {
    background: rgba(50, 251, 226, 0.08);
}

.notification-icon[b-sup7f3luwv] {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
}

.notification-icon.type-success[b-sup7f3luwv] {
    background: rgba(34, 197, 94, 0.15);
    color: #22c55e;
}

.notification-icon.type-error[b-sup7f3luwv] {
    background: rgba(234, 57, 184, 0.15);
    color: #ea39b8;
}

.notification-icon.type-warning[b-sup7f3luwv] {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
}

.notification-icon.type-info[b-sup7f3luwv] {
    background: rgba(50, 251, 226, 0.15);
    color: #32fbe2;
}

.notification-icon.type-system[b-sup7f3luwv] {
    background: rgba(111, 66, 193, 0.15);
    color: #6f42c1;
}

.notification-content[b-sup7f3luwv] {
    flex: 1;
    min-width: 0;
}

.notification-title[b-sup7f3luwv] {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--vapor-text-main);
    margin-bottom: 0.2rem;
    line-height: 1.3;
}

.notification-item.unread .notification-title[b-sup7f3luwv] {
    color: #fff;
}

.notification-message[b-sup7f3luwv] {
    font-size: 0.8rem;
    color: var(--vapor-text-muted);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.notification-sender[b-sup7f3luwv] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.3rem;
    font-size: 0.7rem;
    color: var(--vapor-accent);
    opacity: 0.8;
}

.notification-time[b-sup7f3luwv] {
    margin-top: 0.35rem;
    font-size: 0.7rem;
    color: var(--vapor-text-muted);
    opacity: 0.6;
}

.unread-indicator[b-sup7f3luwv] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ea39b8, #6f42c1);
    box-shadow: 0 0 8px rgba(234, 57, 184, 0.5);
    margin-top: 0.4rem;
}

.panel-footer[b-sup7f3luwv] {
    padding: 0.875rem 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.view-all-link[b-sup7f3luwv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem;
    border-radius: 8px;
    background: rgba(111, 66, 193, 0.1);
    color: var(--vapor-text-main);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.view-all-link:hover[b-sup7f3luwv] {
    background: rgba(111, 66, 193, 0.2);
    color: var(--vapor-accent);
    box-shadow: var(--vapor-glow-cyan);
}

@media (max-width: 480px) {
    .notification-panel[b-sup7f3luwv] {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        max-height: 85vh;
        border-radius: 24px 24px 0 0;
        animation: panelSlideUp-b-sup7f3luwv 0.3s ease-out;
    }

    @keyframes panelSlideUp-b-sup7f3luwv {
        from {
            opacity: 0;
            transform: translateY(100%);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .notification-list[b-sup7f3luwv] {
        max-height: calc(85vh - 140px);
    }

    .panel-header[b-sup7f3luwv] {
        padding: 1.25rem 1rem;
    }

    .panel-header[b-sup7f3luwv]::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        border-radius: 2px;
        background: rgba(255, 255, 255, 0.2);
    }

    .notification-item[b-sup7f3luwv] {
        padding: 1rem;
    }

    .group-header[b-sup7f3luwv] {
        padding: 0.5rem 1rem;
    }

    .panel-footer[b-sup7f3luwv] {
        padding: 1rem;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0));
    }
}

@media (prefers-reduced-motion: reduce) {
    .notification-panel[b-sup7f3luwv],
    .notification-badge[b-sup7f3luwv] {
        animation: none;
    }
    
    .notification-item[b-sup7f3luwv],
    .btn-mark-all[b-sup7f3luwv],
    .view-all-link[b-sup7f3luwv],
    .notification-bell[b-sup7f3luwv] {
        transition: none;
    }
}
/* /Components/Shared/PageLoader.razor.rz.scp.css */
/* PageLoader - Premium loading spinner with vapor theme */

.page-loader-overlay[b-ldmc6dab64] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(10, 5, 20, 0.97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-loader-overlay.visible[b-ldmc6dab64] {
    opacity: 1;
    visibility: visible;
}

.page-loader-content[b-ldmc6dab64] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
}

.loader-logo-container[b-ldmc6dab64] {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Animated glow behind logo */
.loader-glow[b-ldmc6dab64] {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: radial-gradient(circle,
        rgba(111, 66, 193, 0.4) 0%,
        rgba(234, 57, 184, 0.3) 40%,
        rgba(50, 251, 226, 0.2) 70%,
        transparent 100%);
    filter: blur(25px);
    animation: glowPulse-b-ldmc6dab64 2s ease-in-out infinite;
}

@keyframes glowPulse-b-ldmc6dab64 {
    0%, 100% {
        transform: scale(1);
        opacity: 0.6;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
    }
}

/* Outer spinning ring */
.loader-ring[b-ldmc6dab64] {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid transparent;
    border-top-color: rgba(111, 66, 193, 0.9);
    border-right-color: rgba(234, 57, 184, 0.6);
    animation: ringRotate-b-ldmc6dab64 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}

.loader-ring.ring-2[b-ldmc6dab64] {
    width: 85%;
    height: 85%;
    top: 7.5%;
    left: 7.5%;
    border-top-color: rgba(50, 251, 226, 0.9);
    border-right-color: rgba(111, 66, 193, 0.6);
    animation-direction: reverse;
    animation-duration: 1.5s;
}

@keyframes ringRotate-b-ldmc6dab64 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Logo image */
.loader-logo[b-ldmc6dab64] {
    width: 60px;
    height: auto;
    position: relative;
    z-index: 2;
    animation: logoPulse-b-ldmc6dab64 2s ease-in-out infinite;
    filter: drop-shadow(0 0 20px rgba(111, 66, 193, 0.5))
            drop-shadow(0 0 40px rgba(234, 57, 184, 0.3));
}

@keyframes logoPulse-b-ldmc6dab64 {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 20px rgba(111, 66, 193, 0.5))
                drop-shadow(0 0 40px rgba(234, 57, 184, 0.3));
    }
    50% {
        transform: scale(1.05);
        filter: drop-shadow(0 0 30px rgba(111, 66, 193, 0.7))
                drop-shadow(0 0 60px rgba(234, 57, 184, 0.5))
                drop-shadow(0 0 80px rgba(50, 251, 226, 0.3));
    }
}

/* Loading message */
.loader-message[b-ldmc6dab64] {
    color: rgba(255, 255, 255, 0.8);
    font-family: 'Outfit', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.5px;
    margin: 0;
    text-align: center;
    animation: messageFade-b-ldmc6dab64 2s ease-in-out infinite;
}

@keyframes messageFade-b-ldmc6dab64 {
    0%, 100% {
        opacity: 0.7;
    }
    50% {
        opacity: 1;
    }
}

/* Animated dots */
.loader-dots[b-ldmc6dab64] {
    display: flex;
    gap: 8px;
}

.loader-dots span[b-ldmc6dab64] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, 
        rgba(111, 66, 193, 1) 0%,
        rgba(234, 57, 184, 1) 50%,
        rgba(50, 251, 226, 1) 100%);
    animation: dotBounce-b-ldmc6dab64 1.4s ease-in-out infinite;
}

.loader-dots span:nth-child(1)[b-ldmc6dab64] {
    animation-delay: 0s;
}

.loader-dots span:nth-child(2)[b-ldmc6dab64] {
    animation-delay: 0.2s;
}

.loader-dots span:nth-child(3)[b-ldmc6dab64] {
    animation-delay: 0.4s;
}

@keyframes dotBounce-b-ldmc6dab64 {
    0%, 80%, 100% {
        transform: translateY(0);
        opacity: 0.4;
    }
    40% {
        transform: translateY(-12px);
        opacity: 1;
    }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .loader-glow[b-ldmc6dab64],
    .loader-ring[b-ldmc6dab64],
    .loader-logo[b-ldmc6dab64],
    .loader-message[b-ldmc6dab64],
    .loader-dots span[b-ldmc6dab64] {
        animation: none !important;
    }
    
    .loader-glow[b-ldmc6dab64] {
        opacity: 0.8;
    }
    
    .loader-ring[b-ldmc6dab64] {
        border-color: rgba(111, 66, 193, 0.5);
    }
    
    .loader-dots span[b-ldmc6dab64] {
        opacity: 0.7;
    }
}

/* Mobile adjustments */
@media (max-width: 576px) {
    .loader-logo-container[b-ldmc6dab64] {
        width: 100px;
        height: 100px;
    }
    
    .loader-logo[b-ldmc6dab64] {
        width: 50px;
    }
    
    .loader-message[b-ldmc6dab64] {
        font-size: 0.9rem;
        padding: 0 1rem;
    }
}
/* /Components/Shared/ToastContainer.razor.rz.scp.css */
.toast-container[b-ox9nglzlyw] {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-width: 400px;
    pointer-events: none;
}

.toast-item[b-ox9nglzlyw] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 12px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    pointer-events: auto;
    animation: slideIn-b-ox9nglzlyw 0.3s ease-out forwards;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.toast-item:hover[b-ox9nglzlyw] {
    transform: translateX(-4px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.toast-item.exiting[b-ox9nglzlyw] {
    animation: slideOut-b-ox9nglzlyw 0.3s ease-in forwards;
}

@keyframes slideIn-b-ox9nglzlyw {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideOut-b-ox9nglzlyw {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(100%);
    }
}

.toast-icon[b-ox9nglzlyw] {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1rem;
}

.toast-success .toast-icon[b-ox9nglzlyw] {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
}

.toast-error .toast-icon[b-ox9nglzlyw] {
    background: rgba(234, 57, 184, 0.2);
    color: #ea39b8;
}

.toast-warning .toast-icon[b-ox9nglzlyw] {
    background: rgba(245, 158, 11, 0.2);
    color: #f59e0b;
}

.toast-info .toast-icon[b-ox9nglzlyw] {
    background: rgba(50, 251, 226, 0.2);
    color: #32fbe2;
}

.toast-content[b-ox9nglzlyw] {
    flex: 1;
    min-width: 0;
}

.toast-title[b-ox9nglzlyw] {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
    color: #fff;
    margin-bottom: 0.25rem;
}

.toast-message[b-ox9nglzlyw] {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.toast-dismiss[b-ox9nglzlyw] {
    flex-shrink: 0;
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    transition: color 0.2s ease, background 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.toast-dismiss:hover[b-ox9nglzlyw] {
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

.toast-progress[b-ox9nglzlyw] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.toast-progress-bar[b-ox9nglzlyw] {
    height: 100%;
    width: 100%;
    transform-origin: left;
    animation: progressShrink-b-ox9nglzlyw linear forwards;
}

@keyframes progressShrink-b-ox9nglzlyw {
    from {
        transform: scaleX(1);
    }
    to {
        transform: scaleX(0);
    }
}

.toast-success .toast-progress-bar[b-ox9nglzlyw] {
    background: linear-gradient(90deg, #22c55e, #4ade80);
}

.toast-error .toast-progress-bar[b-ox9nglzlyw] {
    background: linear-gradient(90deg, #ea39b8, #f472b6);
}

.toast-warning .toast-progress-bar[b-ox9nglzlyw] {
    background: linear-gradient(90deg, #f59e0b, #fbbf24);
}

.toast-info .toast-progress-bar[b-ox9nglzlyw] {
    background: linear-gradient(90deg, #32fbe2, #6f42c1);
}

.toast-success[b-ox9nglzlyw] {
    border-color: rgba(34, 197, 94, 0.3);
    box-shadow: 0 4px 24px rgba(34, 197, 94, 0.15);
}

.toast-error[b-ox9nglzlyw] {
    border-color: rgba(234, 57, 184, 0.3);
    box-shadow: 0 4px 24px rgba(234, 57, 184, 0.15);
}

.toast-warning[b-ox9nglzlyw] {
    border-color: rgba(245, 158, 11, 0.3);
    box-shadow: 0 4px 24px rgba(245, 158, 11, 0.15);
}

.toast-info[b-ox9nglzlyw] {
    border-color: rgba(50, 251, 226, 0.3);
    box-shadow: 0 4px 24px rgba(50, 251, 226, 0.15);
}

@media (max-width: 480px) {
    .toast-container[b-ox9nglzlyw] {
        top: 0.5rem;
        right: 0.5rem;
        left: 0.5rem;
        max-width: none;
    }

    .toast-item[b-ox9nglzlyw] {
        padding: 0.75rem;
    }

    .toast-title[b-ox9nglzlyw] {
        font-size: 0.85rem;
    }

    .toast-message[b-ox9nglzlyw] {
        font-size: 0.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .toast-item[b-ox9nglzlyw],
    .toast-item.exiting[b-ox9nglzlyw] {
        animation: none;
    }

    .toast-progress-bar[b-ox9nglzlyw] {
        animation: none;
        transform: scaleX(0);
    }
}