/* /Components/Chat/AppointmentProgressStrip.razor.rz.scp.css */
/* ===== Progress Strip ===== */

.progress-strip[b-p4ukvvkbwp] {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 1rem auto;
    border: 1px solid rgba(129, 230, 217, 0.4);
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    animation: fadeIn-b-p4ukvvkbwp 0.3s ease-out both;
}

.strip-label[b-p4ukvvkbwp] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(44, 122, 123, 0.5);
    margin-right: 0.15rem;
    white-space: nowrap;
}

/* ===== Badges ===== */

.field-badge[b-p4ukvvkbwp] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.65rem;
    border-radius: 2rem;
    font-size: 0.78rem;
    font-weight: 500;
    animation: badgePop-b-p4ukvvkbwp 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.field-badge-primary[b-p4ukvvkbwp] {
    background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
    color: #fff;
    box-shadow: 0 2px 8px rgba(44, 122, 123, 0.3);
}

.field-badge-secondary[b-p4ukvvkbwp] {
    background: rgba(44, 122, 123, 0.1);
    color: #4338ca;
    border: 1px solid rgba(44, 122, 123, 0.2);
}

@keyframes fadeIn-b-p4ukvvkbwp {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .progress-strip[b-p4ukvvkbwp] {
        display: none !important;
    }
}

@keyframes badgePop-b-p4ukvvkbwp {
    from {
        opacity: 0;
        transform: scale(0.7);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}
/* /Components/Chat/AppXAssistantChatWidget.razor.rz.scp.css */
/* ── AppX Assistant Chat Widget — dark teal glass theme ───────────────
   Adapted from the AppX integration test page's "appx-chat-panel" theme,
   trimmed to fill its container (used inside the assistant FAB modal). */

@keyframes assistantChatBgShift-b-esom01k2ku {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes assistantChatGlowA-b-esom01k2ku {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.15; }
    50% { transform: translate(15px, 15px) scale(1.1); opacity: 0.3; }
}

@keyframes assistantChatGlowB-b-esom01k2ku {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.1; }
    50% { transform: translate(-15px, -15px) scale(1.1); opacity: 0.25; }
}

.assistant-chat-panel[b-esom01k2ku] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.assistant-chat-panel[b-esom01k2ku]  .page-wrapper {
    max-width: none;
    margin: 0;
    padding: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.assistant-chat-panel[b-esom01k2ku]  .chat-card {
    position: relative;
    height: 100%;
    flex: 1 1 auto;
    border-radius: 0;
    background: linear-gradient(135deg, rgb(8 94 125 / 95%), rgb(10 34 35 / 85%), rgb(0 3 15 / 95%));
    background-size: 200% 200%;
    animation: assistantChatBgShift-b-esom01k2ku 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(129, 230, 217, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

    .assistant-chat-panel[b-esom01k2ku]  .chat-card::before {
        content: '';
        position: absolute;
        top: -80px;
        left: -80px;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle, rgba(44, 122, 123, 0.3) 0%, transparent 65%);
        pointer-events: none;
        animation: assistantChatGlowA-b-esom01k2ku 8s ease-in-out infinite;
    }

    .assistant-chat-panel[b-esom01k2ku]  .chat-card::after {
        content: '';
        position: absolute;
        bottom: -60px;
        right: -60px;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(129, 230, 217, 0.25) 0%, transparent 65%);
        pointer-events: none;
        animation: assistantChatGlowB-b-esom01k2ku 10s ease-in-out infinite reverse;
    }

.assistant-chat-panel[b-esom01k2ku]  .chat-messages {
    position: relative;
    z-index: 1;
    background: transparent;
}

    .assistant-chat-panel[b-esom01k2ku]  .chat-messages::-webkit-scrollbar-thumb {
        background: rgba(129, 230, 217, 0.25);
    }

        .assistant-chat-panel[b-esom01k2ku]  .chat-messages::-webkit-scrollbar-thumb:hover {
            background: rgba(129, 230, 217, 0.45);
        }

.assistant-chat-panel[b-esom01k2ku]  .empty-state {
    color: rgba(167, 204, 219, 0.65);
}

.assistant-chat-panel[b-esom01k2ku]  .msg-bubble {
    background: linear-gradient(160deg, rgba(8, 94, 125, 0.45) 0%, rgba(10, 34, 35, 0.8) 100%);
    border: 1px solid rgba(129, 230, 217, 0.28);
    color: #e2e8f0;
    box-shadow: 0 4px 24px rgba(0, 3, 15, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.assistant-chat-panel[b-esom01k2ku]  .avatar {
    background: linear-gradient(135deg, #085e7d, #2c7a7b);
    color: #e6fffa;
    box-shadow: 0 2px 10px rgba(8, 94, 125, 0.45), 0 0 0 3px rgba(129, 230, 217, 0.15);
}

.assistant-chat-panel[b-esom01k2ku]  .sender-name {
    background: linear-gradient(135deg, #085e7d, #2c7a7b);
    color: #e6fffa;
    box-shadow: 0 1px 6px rgba(8, 94, 125, 0.45);
}

.assistant-chat-panel[b-esom01k2ku]  .user-message .msg-bubble {
    background: linear-gradient(135deg, rgba(44, 122, 123, 0.95) 0%, rgba(8, 94, 125, 0.85) 100%);
    border: 1px solid rgba(129, 230, 217, 0.45);
    color: #f0fdfa;
    box-shadow: 0 4px 24px rgba(8, 94, 125, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.assistant-chat-panel[b-esom01k2ku]  .user-message .avatar {
    background: #2c7a7b;
    box-shadow: 0 2px 8px rgba(129, 230, 217, 0.35);
}

.assistant-chat-panel[b-esom01k2ku]  .user-message .sender-name {
    background: #2c7a7b;
    box-shadow: 0 1px 6px rgba(129, 230, 217, 0.3);
}

.assistant-chat-panel[b-esom01k2ku]  .slot-option-btn {
    background: rgba(44, 122, 123, 0.16);
    border: 1px solid rgba(129, 230, 217, 0.32);
    color: #e2e8f0;
}

    .assistant-chat-panel[b-esom01k2ku]  .slot-option-btn:hover:not(.disabled) {
        background: rgba(44, 122, 123, 0.35);
        border-color: rgba(129, 230, 217, 0.7);
        box-shadow: 0 4px 14px rgba(129, 230, 217, 0.18);
    }

.assistant-chat-panel[b-esom01k2ku]  .slot-datetime {
    color: #bee3f8;
}

.assistant-chat-panel[b-esom01k2ku]  .slot-hospital {
    color: #a7ccdb;
}

.assistant-chat-panel[b-esom01k2ku]  .slot-practitioner {
    color: #81e6d9;
}

.assistant-chat-panel[b-esom01k2ku]  .typing-bubble {
    background: linear-gradient(160deg, rgba(8, 94, 125, 0.45) 0%, rgba(10, 34, 35, 0.8) 100%);
    border: 1px solid rgba(129, 230, 217, 0.28);
    box-shadow: 0 4px 24px rgba(0, 3, 15, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.assistant-chat-panel[b-esom01k2ku]  .typing-dot {
    background: #81e6d9;
}

.assistant-chat-panel[b-esom01k2ku]  .chat-input-area {
    position: relative;
    z-index: 1;
    background: linear-gradient(135deg, rgba(44, 122, 123, 0.35) 0%, rgba(8, 94, 125, 0.30) 100%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid rgba(129, 230, 217, 0.3);
}

.assistant-chat-panel[b-esom01k2ku]  .chat-compose-bar {
    background: rgba(255, 255, 255, 0.18);
    border: 1.5px solid rgba(129, 230, 217, 0.4);
    box-shadow: 0 2px 16px rgba(0, 3, 15, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

    .assistant-chat-panel[b-esom01k2ku]  .chat-compose-bar:focus-within {
        background: rgba(255, 255, 255, 0.24);
        border-color: rgba(129, 230, 217, 0.75);
        box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.18), 0 4px 24px rgba(129, 230, 217, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    }

.assistant-chat-panel[b-esom01k2ku]  .chat-input {
    color: #f8fafc;
}

    .assistant-chat-panel[b-esom01k2ku]  .chat-input::placeholder {
        color: rgba(230, 255, 250, 0.65);
    }

    .assistant-chat-panel[b-esom01k2ku]  .chat-input:disabled {
        color: rgba(230, 255, 250, 0.45);
    }

        .assistant-chat-panel[b-esom01k2ku]  .chat-input:disabled::placeholder {
            color: rgba(230, 255, 250, 0.4);
        }

/* ── Mic and Voice Buttons ───────────────────────────────────────── */

.assistant-chat-panel[b-esom01k2ku]  .btn-mic,
.assistant-chat-panel[b-esom01k2ku]  .voice-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;

    border-radius: 50%;
    width: 2.4rem;
    height: 2.4rem;
    padding: 0;
    flex-shrink: 0;

    background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
    color: #fff;
    box-shadow: 0 2px 10px rgba(44, 122, 123, 0.35);
}

.assistant-chat-panel[b-esom01k2ku]  .btn-mic .bi,
.assistant-chat-panel[b-esom01k2ku]  .voice-btn .bi,
.assistant-chat-panel[b-esom01k2ku]  .app-btn .bi {
    width: 1.25rem;
    height: 1.25rem;
}

.assistant-chat-panel[b-esom01k2ku]  .btn-mic:hover:not(:disabled),
.assistant-chat-panel[b-esom01k2ku]  .voice-btn.active:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(44, 122, 123, 0.5);
}

.assistant-chat-panel[b-esom01k2ku]  .btn-mic:active:not(:disabled),
.assistant-chat-panel[b-esom01k2ku]  .voice-btn.active:active:not(:disabled) {
    transform: scale(0.97);
}

.assistant-chat-panel[b-esom01k2ku]  .btn-mic:disabled,
.assistant-chat-panel[b-esom01k2ku]  .voice-btn:disabled {
    cursor: not-allowed;
    background: #adb5bd;
    box-shadow: none;
    opacity: 0.5;
}

.assistant-chat-panel[b-esom01k2ku]  .voice-btn:not(.active) {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(129, 230, 217, 0.25);
    color: #a7ccdb;
    box-shadow: none;
}

.assistant-chat-panel[b-esom01k2ku]  .voice-btn:not(.active):hover:not(:disabled) {
    background: rgba(129, 230, 217, 0.15);
    border-color: rgba(129, 230, 217, 0.45);
}

.assistant-chat-panel[b-esom01k2ku]  .btn-mic.recording {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    box-shadow: 0 2px 10px rgba(239, 68, 68, 0.35);
}

.assistant-chat-panel[b-esom01k2ku]  .btn-mic.recording:hover {
    box-shadow: 0 6px 20px rgba(239, 68, 68, 0.5);
}

/* ── Mobile ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .assistant-chat-panel[b-esom01k2ku]  .page-wrapper {
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .assistant-chat-panel[b-esom01k2ku]  .chat-card {
        height: 100% !important;
        border-radius: 0 !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: linear-gradient(135deg, rgb(8 94 125) 0%, rgb(10 34 35) 50%, rgb(0 3 15) 100%) !important;
    }

    .assistant-chat-panel[b-esom01k2ku]  .chat-input-area {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgb(10 34 35) !important;
    }

    .assistant-chat-panel[b-esom01k2ku]  .voice-btn:not(.active) {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .assistant-chat-panel[b-esom01k2ku]  .chat-messages {
        padding: 0.75rem 0.5rem;
    }
}

/* ── Voice Mode Layout Styles ────────────────────────────────────── */

@keyframes voiceTextPulse-b-esom01k2ku {
    0%, 100% { opacity: 0.8; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.02); }
}

@keyframes voiceIndicatorPulse-b-esom01k2ku {
    0% { transform: scale(0.9); opacity: 0.6; }
    50% { transform: scale(1.4); opacity: 1; box-shadow: 0 0 12px rgba(255, 217, 94, 1); }
    100% { transform: scale(0.9); opacity: 0.6; }
}

.voice-action-btn:hover[b-esom01k2ku] {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: rgba(129, 230, 217, 0.5) !important;
    color: #e6fffa !important;
}

.voice-pulse-indicator[b-esom01k2ku] {
    width: 8px;
    height: 8px;
    background: #ffd95e;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(255, 217, 94, 0.8);
    display: inline-block;
    animation: voiceIndicatorPulse-b-esom01k2ku 1.2s infinite;
}

/* /Components/Chat/AppXSessionConfigWidget.razor.rz.scp.css */
@keyframes assistantChatBgShift-b-wx7u5xrd41 {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes assistantChatGlowA-b-wx7u5xrd41 {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.15; }
    50% { transform: translate(15px, 15px) scale(1.1); opacity: 0.3; }
}

@keyframes assistantChatGlowB-b-wx7u5xrd41 {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.1; }
    50% { transform: translate(-15px, -15px) scale(1.1); opacity: 0.25; }
}

.session-config-widget[b-wx7u5xrd41] {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: linear-gradient(135deg, rgb(8 94 125 / 95%), rgb(10 34 35 / 85%), rgb(0 3 15 / 95%));
    background-size: 200% 200%;
    animation: assistantChatBgShift-b-wx7u5xrd41 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: #e2e8f0;
    overflow: hidden;
}

.session-config-widget[b-wx7u5xrd41]::before {
    content: '';
    position: absolute;
    top: -80px;
    left: -80px;
    width: 240px;
    height: 240px;
    background: radial-gradient(circle, rgba(44, 122, 123, 0.3) 0%, transparent 65%);
    pointer-events: none;
    animation: assistantChatGlowA-b-wx7u5xrd41 8s ease-in-out infinite;
}

.session-config-widget[b-wx7u5xrd41]::after {
    content: '';
    position: absolute;
    bottom: -80px;
    right: -80px;
    width: 240px;
    height: 240px;
    background: radial-gradient(circle, rgba(129, 230, 217, 0.2) 0%, transparent 65%);
    pointer-events: none;
    animation: assistantChatGlowB-b-wx7u5xrd41 10s ease-in-out infinite reverse;
}

.config-scroll-area[b-wx7u5xrd41] {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1.25rem;
}

/* Scrollbar styles for config panel */
.config-scroll-area[b-wx7u5xrd41]::-webkit-scrollbar {
    width: 6px;
}
.config-scroll-area[b-wx7u5xrd41]::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
}
.config-scroll-area[b-wx7u5xrd41]::-webkit-scrollbar-thumb {
    background: rgba(129, 230, 217, 0.25);
    border-radius: 3px;
}
.config-scroll-area[b-wx7u5xrd41]::-webkit-scrollbar-thumb:hover {
    background: rgba(129, 230, 217, 0.45);
}

.config-footer[b-wx7u5xrd41] {
    position: relative;
    z-index: 2;
    padding: 1rem 1.25rem;
    border-top: 1px solid rgba(129, 230, 217, 0.2);
    background: rgba(10, 34, 35, 0.4);
    display: flex;
    justify-content: flex-end;
    flex-shrink: 0;
}

.setup-form[b-wx7u5xrd41] {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.form-section[b-wx7u5xrd41] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background: rgba(255, 255, 255, 0.03);
    padding: 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(129, 230, 217, 0.15);
}

.form-section h6[b-wx7u5xrd41] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #81e6d9;
    margin: 0 0 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.form-row[b-wx7u5xrd41] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-row label[b-wx7u5xrd41] {
    font-size: 0.75rem;
    font-weight: 500;
    color: rgba(230, 255, 250, 0.7);
}

.form-row.two-col[b-wx7u5xrd41] {
    flex-direction: row;
    gap: 0.75rem;
}

.form-row.two-col > div[b-wx7u5xrd41] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Form fields customization */
.setup-form .form-control[b-wx7u5xrd41],
.setup-form .form-select[b-wx7u5xrd41] {
    background-color: rgba(255, 255, 255, 0.08) !important;
    border: 1.5px solid rgba(129, 230, 217, 0.25) !important;
    color: #f8fafc !important;
    border-radius: 8px !important;
    font-size: 0.85rem !important;
    padding: 0.4rem 0.6rem !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.setup-form .form-control:focus[b-wx7u5xrd41],
.setup-form .form-select:focus[b-wx7u5xrd41] {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(129, 230, 217, 0.6) !important;
    box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.2) !important;
    outline: none !important;
}

.setup-form .form-control[b-wx7u5xrd41]::placeholder {
    color: rgba(230, 255, 250, 0.35) !important;
}

/* Favorites and family rows */
.fav-row[b-wx7u5xrd41], .household-row[b-wx7u5xrd41] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.fav-row .form-control[b-wx7u5xrd41],
.household-row .form-control[b-wx7u5xrd41] {
    font-size: 0.8rem !important;
}

.btn-remove[b-wx7u5xrd41] {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.2);
    color: #f87171;
    cursor: pointer;
    font-size: 0.8rem;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.btn-remove:hover[b-wx7u5xrd41] {
    background: rgba(239, 68, 68, 0.25);
    border-color: rgba(239, 68, 68, 0.4);
    color: #ef4444;
}

.btn-add[b-wx7u5xrd41] {
    background: rgba(129, 230, 217, 0.05);
    border: 1.5px dashed rgba(129, 230, 217, 0.3);
    border-radius: 8px;
    color: #81e6d9;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.45rem;
    text-align: center;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.btn-add:hover[b-wx7u5xrd41] {
    background: rgba(129, 230, 217, 0.12);
    border-color: rgba(129, 230, 217, 0.55);
}

@media (max-width: 768px) {
    .session-config-widget[b-wx7u5xrd41] {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: linear-gradient(135deg, rgb(8 94 125) 0%, rgb(10 34 35) 50%, rgb(0 3 15) 100%) !important;
    }
}
/* /Components/Chat/AssistantMessage.razor.rz.scp.css */
.msg-row[b-hdownlg5cu] {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 1.1rem;
    animation: msgSlideUp-b-hdownlg5cu 0.3s ease-out both;
}

.msg-group[b-hdownlg5cu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 75%;
}

    .msg-group.has-slots[b-hdownlg5cu] {
        max-width: 95%;
    }

@media (max-width: 768px) {
    .msg-group[b-hdownlg5cu] {
        max-width: 92%;
    }
}

.msg-header[b-hdownlg5cu] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: -18px;
    position: relative;
    z-index: 1;
    padding-left: 10px;
}

.avatar[b-hdownlg5cu] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(135deg, #005B33, #009A45);
    color: #E8F5E9;
    box-shadow: 0 2px 10px rgba(0, 91, 51, 0.35), 0 0 0 3px rgba(0, 91, 51, 0.12);
    animation: avatarIn-b-hdownlg5cu 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.sender-name[b-hdownlg5cu] {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #E8F5E9;
    padding: 0.18rem 0.6rem;
    border-radius: 2rem;
    white-space: nowrap;
    background: linear-gradient(135deg, #005B33, #009A45);
    box-shadow: 0 1px 6px rgba(0, 91, 51, 0.35);
}

.msg-bubble[b-hdownlg5cu] {
    padding: 1.4rem 1rem 0.65rem;
    border-radius: 1.1rem;
    border-bottom-left-radius: 0.3rem;
    font-size: 0.92rem;
    line-height: 1.5;
    word-wrap: break-word;
    width: 100%;
    background: radial-gradient(circle at center, #002E1A 0%, #080C09 100%);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(174, 213, 129, 0.4); /* Light Moss border */
    color: #E8F5E9;
    box-shadow: 0 4px 24px rgba(0, 46, 26, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.markdown-content p:last-child[b-hdownlg5cu] {
    margin-bottom: 0;
}

.markdown-content[b-hdownlg5cu] {
    white-space: pre-line;
}

.markdown-content > :first-child[b-hdownlg5cu] {
    margin-top: 0;
}

@keyframes msgSlideUp-b-hdownlg5cu {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes avatarIn-b-hdownlg5cu {
    0% {
        opacity: 0;
        transform: scale(0.4) rotate(-15deg);
    }

    70% {
        transform: scale(1.15) rotate(4deg);
    }

    100% {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}

.slot-option-btn[b-hdownlg5cu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
    padding: 0.45rem 0.7rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(174, 213, 129, 0.45);
    background: rgba(0, 91, 51, 0.18);
    color: #E8F5E9;
    cursor: pointer;
    transition: background 0.18s, border-color 0.18s, transform 0.12s;
    text-align: left;
    width: 100%;
}

    .slot-option-btn:hover:not(.disabled)[b-hdownlg5cu] {
        background: rgba(0, 154, 69, 0.28);
        border-color: rgba(174, 213, 129, 0.8);
        transform: translateY(-1px);
    }

    .slot-option-btn.disabled[b-hdownlg5cu] {
        opacity: 0.45;
        cursor: not-allowed;
    }

.slot-datetime[b-hdownlg5cu] {
    font-size: 0.88rem;
    font-weight: 700;
    color: #c5e8a0;
    white-space: nowrap;
}

.slot-meta[b-hdownlg5cu] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.slot-hospital[b-hdownlg5cu] {
    font-size: 0.72rem;
    color: #a8d5a2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.slot-practitioner[b-hdownlg5cu] {
    font-size: 0.72rem;
    color: #8ecfa0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.options-container[b-hdownlg5cu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
    gap: 0.4rem;
    margin-top: 0.6rem;
}
/* /Components/Chat/ChatShell.razor.rz.scp.css */
/* ===== Page Layout ===== */

.page-wrapper[b-i38vlffv4x] {
    max-width: 720px;
    margin: 0 auto;
    padding-top: 1.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* ===== Chat Header ===== */

.chat-header[b-i38vlffv4x] {
    text-align: center;
    margin-bottom: 1.5rem;
}

/* ===== Provider Toggle (inside Header RenderFragment — ::deep required) ===== */

[b-i38vlffv4x] .provider-toggle {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border: 1px solid rgba(var(--neolink-fern-rgb), 0.2);
    border-radius: 2rem;
    padding: 0.2rem;
    margin-top: 0.75rem;
    box-shadow: 0 2px 12px rgba(var(--neolink-fern-rgb), 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

/* ===== Chat Card ===== */

.chat-card[b-i38vlffv4x] {
    height: 68vh;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(var(--neolink-shamrock-rgb), 0.12), 0 1px 4px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

/* ===== Messages Area ===== */

.chat-messages[b-i38vlffv4x] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    scroll-behavior: smooth;
    background: var(--neolink-bg-chat);
}

    /* Scrollbar */
    .chat-messages[b-i38vlffv4x]::-webkit-scrollbar {
        width: 6px;
    }

    .chat-messages[b-i38vlffv4x]::-webkit-scrollbar-track {
        background: transparent;
    }

    .chat-messages[b-i38vlffv4x]::-webkit-scrollbar-thumb {
        background: rgba(var(--neolink-shamrock-rgb), 0.30);
        border-radius: 3px;
    }

        .chat-messages[b-i38vlffv4x]::-webkit-scrollbar-thumb:hover {
            background: rgba(var(--neolink-shamrock-rgb), 0.50);
        }

/* ===== Responsive ===== */

@media (max-width: 768px) {
    .page-wrapper[b-i38vlffv4x] {
        margin-left: -1.5rem;
        margin-right: -1.5rem;
        padding-top: 0.2rem;
        padding-left: 0;
        padding-right: 0;
        height: calc(100svh - 5rem);
        display: flex;
        flex-direction: column;
    }

    .chat-header[b-i38vlffv4x] {
        margin-bottom: 0.5rem;
        padding: 0 1rem;
        flex-shrink: 0;
    }

    .chat-card[b-i38vlffv4x] {
        height: auto;
        flex: 1 1 0;
        min-height: 0;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }

    .chat-messages[b-i38vlffv4x] {
        padding: 0.75rem 0.5rem;
    }

    .chat-sidebar[b-i38vlffv4x] {
        display: none !important;
    }
}

/* ===== Empty State ===== */

.empty-state[b-i38vlffv4x] {
    text-align: center;
    color: #adb5bd;
    margin: auto;
    animation: fadeIn-b-i38vlffv4x 0.6s ease-out;
}

.empty-state-icon[b-i38vlffv4x] {
    font-size: 3rem;
    opacity: 0.5;
    display: block;
    margin-bottom: 0.5rem;
}

.empty-state p[b-i38vlffv4x] {
    font-size: 0.95rem;
}

/* ===== Input Area ===== */

.chat-input-area[b-i38vlffv4x] {
    padding: 0.85rem 1rem;
    background: var(--neolink-bg-input-area);
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border-top: 1px solid rgba(var(--neolink-fern-rgb), 0.22);
}

.chat-compose-bar[b-i38vlffv4x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(20px) saturate(200%);
    -webkit-backdrop-filter: blur(20px) saturate(200%);
    border: 1.5px solid rgba(var(--neolink-shamrock-rgb), 0.20);
    border-radius: 2rem;
    padding: 0.35rem 0.35rem 0.35rem 1.1rem;
    box-shadow: 0 2px 20px rgba(var(--neolink-shamrock-rgb), 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.95);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

    .chat-compose-bar:focus-within[b-i38vlffv4x] {
        border-color: rgba(var(--neolink-shamrock-rgb), 0.55);
        box-shadow: 0 0 0 3px rgba(var(--neolink-shamrock-rgb), 0.10), 0 4px 24px rgba(var(--neolink-shamrock-rgb), 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95);
    }

/* ===== Chat Input (inside InputBar RenderFragment — ::deep required) ===== */

[b-i38vlffv4x] .chat-input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    padding: 0.45rem 0.25rem;
    font-size: 0.92rem;
    color: var(--neolink-text-heading);
    min-width: 0;
}

    [b-i38vlffv4x] .chat-input:focus {
        outline: none;
        box-shadow: none;
        background: transparent;
    }

    [b-i38vlffv4x] .chat-input::placeholder {
        color: rgba(var(--neolink-shamrock-rgb), 0.40);
        font-style: italic;
    }

    [b-i38vlffv4x] .chat-input:disabled {
        color: rgba(var(--neolink-shamrock-rgb), 0.35);
        cursor: not-allowed;
    }

        [b-i38vlffv4x] .chat-input:disabled::placeholder {
            color: rgba(var(--neolink-shamrock-rgb), 0.30);
        }

[b-i38vlffv4x] .btn-send-icon {
    font-size: 1.1rem;
}

/* ===== Animations ===== */

@keyframes fadeIn-b-i38vlffv4x {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideUp-b-i38vlffv4x {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes celebratePop-b-i38vlffv4x {
    0% {
        transform: scale(0);
    }

    60% {
        transform: scale(1.3);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes badgePop-b-i38vlffv4x {
    from {
        opacity: 0;
        transform: scale(0.5);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}
/* /Components/Chat/ConfirmCard.razor.rz.scp.css */
.confirm-card[b-c00jvuujxo] {
    padding: 1rem 1.25rem;
    background: rgba(255, 249, 230, 0.88);
    backdrop-filter: blur(14px) saturate(180%);
    -webkit-backdrop-filter: blur(14px) saturate(180%);
    border-top: 1px solid rgba(255, 193, 7, 0.3);
    animation: slideUp-b-c00jvuujxo 0.4s ease-out both;
}

    .confirm-card h6[b-c00jvuujxo] {
        font-weight: 700;
        margin-bottom: 0.75rem;
        color: #92400e;
    }

.confirm-label[b-c00jvuujxo] {
    color: #78716c;
    font-size: 0.82rem;
}

.confirm-value[b-c00jvuujxo] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e1b4b;
}

.confirm-patient[b-c00jvuujxo] {
    color: #c2410c;
    font-weight: 700;
}

@keyframes slideUp-b-c00jvuujxo {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Chat/GeneralChat.razor.rz.scp.css */
.general-chat-wrapper[b-p948m1ez2m] {
    display: flex;
    height: 100dvh;
    width: auto;
    margin-left: -2rem;
    margin-right: -1.5rem;
    margin-top: -1.5rem; /* negate possible parent padding */
    background-color: #1a1a1a;
    color: #e0e0e0;
    font-family: inherit;
    overflow: hidden;
    position: relative; /* Fix for absolute positioning context */
}

/* Drag-and-drop visual feedback */
[b-p948m1ez2m] .chat-main.drop-hover {
    outline: 2px dashed #646cff;
    outline-offset: -4px;
    background-color: rgba(100, 108, 255, 0.06);
}

    [b-p948m1ez2m] .chat-main.drop-hover::after {
        content: '📂 Soltar ficheiros aqui';
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.25rem;
        color: #646cff;
        background-color: rgba(26, 26, 26, 0.7);
        z-index: 50;
        pointer-events: none;
        border-radius: inherit;
    }

/* Sidebar Styling */
.chat-sidebar[b-p948m1ez2m] {
    width: 320px;
    background-color: #121212;
    border-left: 1px solid #333;
    display: flex;
    flex-direction: column;
}

.sidebar-header[b-p948m1ez2m] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #333;
}

.mobile-sidebar-close[b-p948m1ez2m] {
    display: none;
    background: none;
    border: none;
    color: #e0e0e0;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0 10px;
}

.sidebar-header h3[b-p948m1ez2m] {
    margin: 0;
    font-size: 1.1rem;
    color: #fff;
}

.sidebar-actions button[b-p948m1ez2m] {
    background: none;
    border: none;
    color: #888;
    cursor: pointer;
    font-size: 1rem;
    margin-left: 10px;
}

.sidebar-search[b-p948m1ez2m] {
    padding: 8px 16px;
    border-bottom: 1px solid #333;
}

.search-input[b-p948m1ez2m] {
    width: 100%;
    background-color: #2a2a2a;
    border: 1px solid #444;
    border-radius: 6px;
    color: #e0e0e0;
    padding: 8px 10px;
    font-size: 0.85rem;
    font-family: inherit;
}

    .search-input:focus[b-p948m1ez2m] {
        outline: none;
        border-color: #4caf50;
    }

    .search-input[b-p948m1ez2m]::placeholder {
        color: #666;
    }

.sidebar-actions button.active[b-p948m1ez2m] {
    color: #4caf50;
}

.sidebar-actions button.sort-asc[b-p948m1ez2m] {
    transform: rotate(180deg);
}

.chat-list[b-p948m1ez2m] {
    flex: 1;
    overflow-y: auto;
    padding: 10px;
}

.chat-list-item[b-p948m1ez2m] {
    display: flex;
    align-items: center;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: background-color 0.2s;
}

    .chat-list-item:hover[b-p948m1ez2m], .chat-list-item.active[b-p948m1ez2m] {
        background-color: #2a2a2a;
    }

.star-btn[b-p948m1ez2m] {
    background: none;
    border: none;
    cursor: pointer;
    margin-right: 12px;
    font-size: 1.1rem;
    opacity: 0.3;
}

    .star-btn.favorited[b-p948m1ez2m] {
        opacity: 1;
        color: #ffd700;
    }

.chat-info[b-p948m1ez2m] {
    display: flex;
    flex-direction: column;
}

.chat-title[b-p948m1ez2m] {
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 4px;
}

.chat-date[b-p948m1ez2m] {
    font-size: 0.8rem;
    color: #888;
}

/* Main Chat Area */
.chat-main[b-p948m1ez2m] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 20px;
    overflow: hidden;
    position: relative;
}

.chat-top-bar[b-p948m1ez2m] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #333;
    padding-bottom: 15px;
    margin-bottom: 20px;
    gap: 15px;
}

.mobile-sidebar-toggle[b-p948m1ez2m] {
    display: none;
    background: none;
    border: none;
    color: #e0e0e0;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0 10px 0 0;
}

.chat-top-bar h2[b-p948m1ez2m] {
    margin: 0;
    font-size: 1.3rem;
    flex: 1;
}

/* Messages */
.message[b-p948m1ez2m] {
    display: flex;
    margin-bottom: 15px;
}

    .message.user[b-p948m1ez2m] {
        justify-content: flex-end;
    }

    .message.ai[b-p948m1ez2m] {
        justify-content: flex-start;
    }

.message-content[b-p948m1ez2m] {
    max-width: 75%;
    padding: 12px 18px;
    border-radius: 12px;
    line-height: 1.5;
}

.message.user .message-content[b-p948m1ez2m] {
    background-color: #2e7d32;
    color: white;
    border-bottom-right-radius: 0;
}

.message.ai .message-content[b-p948m1ez2m] {
    background-color: #262626;
    border: 1px solid #444;
    border-bottom-left-radius: 0;
}

/* Toolbar & Input */
.chat-toolbar[b-p948m1ez2m] {
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
}

    .chat-toolbar button[b-p948m1ez2m] {
        background: none;
        border: none;
        color: #888;
        cursor: pointer;
        font-size: 1rem;
        padding: 8px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .chat-toolbar button:hover[b-p948m1ez2m] {
            background-color: #333;
            color: #e0e0e0;
        }

.chat-messages[b-p948m1ez2m] {
    flex: 1;
    overflow-y: auto;
    padding-right: 10px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
}

.empty-state[b-p948m1ez2m] {
    margin: auto;
    text-align: center;
    color: #666;
}

.empty-state-icon[b-p948m1ez2m] {
    font-size: 3rem;
    margin-bottom: 10px;
    display: block;
}

.chat-input-area[b-p948m1ez2m] {
    display: flex;
    flex-direction: column;
    background-color: #1e1e1e;
    border-radius: 12px;
    padding: 15px;
    border: 1px solid #333;
}

.chat-input-wrapper[b-p948m1ez2m] {
    display: flex;
    position: relative;
    border: 1px solid #444; /* Added to improve contrast where the button sits */
    border-radius: 8px;
    padding: 0 10px;
    background-color: #2a2a2a;
}

.chat-input-textarea[b-p948m1ez2m] {
    flex: 1;
    background-color: transparent;
    border: none;
    color: #e0e0e0;
    padding: 12px 10px 12px 0;
    resize: none;
    min-height: 24px;
    font-family: inherit;
    font-size: 0.95rem;
    z-index: 1;
}

    .chat-input-textarea:focus[b-p948m1ez2m] {
        outline: none;
    }

.btn-send[b-p948m1ez2m] {
    background-color: #2e7d32;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 40px;
    min-width: 40px;
    margin: 8px 0 8px auto;
    transition: background-color 0.2s;
    z-index: 2;
}

    .btn-send svg[b-p948m1ez2m] {
        display: block;
        margin: auto;
    }

    .btn-send:hover:not(:disabled)[b-p948m1ez2m] {
        background-color: #1b5e20;
    }

.delete-btn[b-p948m1ez2m] {
    background: none;
    border: none;
    color: #e57373;
    opacity: 0.5;
    cursor: pointer;
    margin-left: auto;
    font-size: 0.9rem;
    transition: opacity 0.2s;
    z-index: 10;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .delete-btn svg[b-p948m1ez2m] {
        display: block;
    }

    .delete-btn:hover[b-p948m1ez2m] {
        opacity: 1;
        color: #f44336;
    }

.attach-btn[b-p948m1ez2m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: #888;
    cursor: pointer;
    font-size: 1rem;
    padding: 8px;
    border-radius: 6px;
    transition: background-color 0.2s, color 0.2s;
    margin: 0;
}

    .attach-btn svg[b-p948m1ez2m] {
        display: block;
    }

    .attach-btn:hover[b-p948m1ez2m] {
        background-color: #333;
        color: #e0e0e0;
    }

.selected-files-list[b-p948m1ez2m] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
    padding: 0 10px;
}

.file-badge[b-p948m1ez2m] {
    background-color: #333;
    color: #eee;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #444;
}

.remove-file-btn[b-p948m1ez2m] {
    background: none;
    border: none;
    color: #e57373;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .remove-file-btn:hover[b-p948m1ez2m] {
        color: #f44336;
    }

@media (max-width: 768px) {
    .general-chat-wrapper[b-p948m1ez2m] {
        margin: -1.5rem -1.5rem 0 -1.5rem; /* Remove top/side padding on mobile layout context */
        width: 100vw;
    }

    .chat-sidebar[b-p948m1ez2m] {
        position: absolute;
        top: 0;
        bottom: 0;
        right: -320px; /* Hidden off-screen right */
        z-index: 100;
        transition: right 0.3s ease;
        box-shadow: -4px 0 15px rgba(0, 0, 0, 0.5);
    }

        .chat-sidebar.open[b-p948m1ez2m] {
            right: 0;
        }

    .mobile-sidebar-toggle[b-p948m1ez2m] {
        display: block;
    }

    .mobile-sidebar-close[b-p948m1ez2m] {
        display: block;
    }

    .sidebar-actions[b-p948m1ez2m] {
        display: none; /* Hide sort/search on mobile header if cramped */
    }

    .chat-main[b-p948m1ez2m] {
        padding: 10px;
    }

    .chat-top-bar[b-p948m1ez2m] {
        margin-bottom: 10px;
        padding-bottom: 10px;
    }

        .chat-top-bar h2[b-p948m1ez2m] {
            font-size: 1.1rem;
        }

    .token-badge[b-p948m1ez2m] {
        font-size: 0.75rem;
        padding: 4px 8px;
    }

    .chat-toolbar[b-p948m1ez2m] {
        overflow-x: auto;
        padding-bottom: 4px;
        gap: 2px;
    }
}

.btn-send:disabled[b-p948m1ez2m] {
    background-color: #4CAF50;
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-mic[b-p948m1ez2m] {
    background: none;
    color: #888;
    border: none;
    border-radius: 8px;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 40px;
    min-width: 40px;
    margin: 8px 4px 8px 0;
    transition: background-color 0.2s, color 0.2s;
    z-index: 2;
}

    .btn-mic:hover:not(:disabled)[b-p948m1ez2m] {
        background-color: #333;
        color: #e0e0e0;
    }

    .btn-mic:disabled[b-p948m1ez2m] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .btn-mic.recording[b-p948m1ez2m] {
        background-color: #c62828;
        color: white;
        animation: mic-pulse-b-p948m1ez2m 1.2s ease-in-out infinite;
    }

        .btn-mic.recording:hover[b-p948m1ez2m] {
            background-color: #b71c1c;
            color: white;
        }

@keyframes mic-pulse-b-p948m1ez2m {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.6;
    }
}

.attach-btn.loading[b-p948m1ez2m] {
    opacity: 0.5;
    cursor: wait;
    pointer-events: none;
}

.file-error[b-p948m1ez2m] {
    font-size: 0.75rem;
    color: #f44336;
    padding: 2px 6px;
}

/* Scrollbar for chat list and main chat messages (applied to ChatShell inner elements theoretically or handled via generic scrollbars) */
[b-p948m1ez2m]::-webkit-scrollbar {
    width: 8px;
}

[b-p948m1ez2m]::-webkit-scrollbar-track {
    background: #1a1a1a;
}

[b-p948m1ez2m]::-webkit-scrollbar-thumb {
    background: #444;
    border-radius: 4px;
}

    [b-p948m1ez2m]::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

/* Thinking indicator */
.thinking-indicator[b-p948m1ez2m] {
    padding: 14px 20px;
    border-radius: 12px;
    border-bottom-left-radius: 0;
    background: linear-gradient(135deg, #0a1f0f 0%, #111 100%);
    border: 1px solid rgba(76, 175, 80, 0.2);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), 0 0 20px rgba(76, 175, 80, 0.06);
    max-width: 260px;
    animation: thinkSlideUp-b-p948m1ez2m 0.35s cubic-bezier(0.16, 1, 0.3, 1) both;
    overflow: hidden;
}

.thinking-content[b-p948m1ez2m] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.thinking-spark[b-p948m1ez2m] {
    font-size: 1rem;
    color: #66bb6a;
    display: inline-block;
    animation: sparkSpin-b-p948m1ez2m 2s linear infinite;
}

.thinking-text[b-p948m1ez2m] {
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    background: linear-gradient(90deg, #81c784, #4caf50, #81c784);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: textShimmer-b-p948m1ez2m 2.5s ease-in-out infinite;
}

.thinking-bar[b-p948m1ez2m] {
    height: 2px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

.thinking-bar-fill[b-p948m1ez2m] {
    height: 100%;
    width: 40%;
    border-radius: 2px;
    background: linear-gradient(90deg, transparent, #4caf50, #66bb6a, transparent);
    animation: barSweep-b-p948m1ez2m 1.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes thinkSlideUp-b-p948m1ez2m {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes sparkSpin-b-p948m1ez2m {
    0% {
        transform: rotate(0deg) scale(1);
        opacity: 0.6;
    }

    50% {
        transform: rotate(180deg) scale(1.3);
        opacity: 1;
    }

    100% {
        transform: rotate(360deg) scale(1);
        opacity: 0.6;
    }
}

@keyframes textShimmer-b-p948m1ez2m {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

@keyframes barSweep-b-p948m1ez2m {
    0% {
        transform: translateX(-120%);
    }

    100% {
        transform: translateX(350%);
    }
}

.message-actions[b-p948m1ez2m] {
    display: flex;
    gap: 8px;
    margin-top: 6px;
    justify-content: flex-start;
}

.action-btn[b-p948m1ez2m] {
    background: transparent;
    border: none;
    font-size: 14px;
    color: #888;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: background 0.2s, color 0.2s;
}

    .action-btn:hover[b-p948m1ez2m] {
        background: rgba(255, 255, 255, 0.1);
        color: #e0e0e0;
    }

.voice-btn[b-p948m1ez2m] {
    padding: 4px;
    border-radius: 4px;
    border: none;
    background: transparent;
    color: #a1a1a1;
    cursor: pointer;
    transition: color 0.3s;
}

    .voice-btn:hover[b-p948m1ez2m], .voice-btn.active[b-p948m1ez2m] {
        color: #e0e0e0;
    }
/* /Components/Chat/MedicalActResultCard.razor.rz.scp.css */
.result-card[b-5scpt3vo4p] {
    margin: 0 1rem 0.75rem;
    padding: 1rem 1.25rem;
    background: rgba(var(--neolink-shamrock-rgb), 0.07);
    border: 1px solid rgba(var(--neolink-shamrock-rgb), 0.22);
    border-radius: 0.875rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    animation: slideUp-b-5scpt3vo4p 0.35s ease-out both;
}

.result-icon[b-5scpt3vo4p] {
    font-size: 1.5rem;
    flex-shrink: 0;
    line-height: 1;
}

.result-act-name[b-5scpt3vo4p] {
    font-size: 1rem;
    color: var(--neolink-shamrock-dark);
    margin: 0;
}

@keyframes slideUp-b-5scpt3vo4p {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Chat/SuccessCard.razor.rz.scp.css */
.success-card[b-eoow1t8e1q] {
    padding: 1rem 1.25rem;
    background: rgba(236, 253, 245, 0.88);
    backdrop-filter: blur(14px) saturate(180%);
    -webkit-backdrop-filter: blur(14px) saturate(180%);
    border-top: 1px solid rgba(16, 185, 129, 0.25);
    animation: slideUp-b-eoow1t8e1q 0.4s ease-out both;
}

.success-icon[b-eoow1t8e1q] {
    font-size: 2rem;
    animation: celebratePop-b-eoow1t8e1q 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.success-card h6[b-eoow1t8e1q] {
    color: #065f46;
    font-weight: 700;
}

@keyframes slideUp-b-eoow1t8e1q {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes celebratePop-b-eoow1t8e1q {
    0% {
        transform: scale(0);
    }

    60% {
        transform: scale(1.3);
    }

    100% {
        transform: scale(1);
    }
}
/* /Components/Chat/TypingIndicator.razor.rz.scp.css */
.typing-row[b-aiutkodu00] {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 1.1rem;
    animation: msgSlideUp-b-aiutkodu00 0.3s ease-out both;
}

.msg-group[b-aiutkodu00] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.msg-header[b-aiutkodu00] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: -18px;
    position: relative;
    z-index: 1;
    padding-left: 10px;
}

.avatar[b-aiutkodu00] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(135deg, #005B33, #009A45);
    color: #E8F5E9;
    box-shadow: 0 2px 10px rgba(0, 91, 51, 0.35), 0 0 0 3px rgba(0, 91, 51, 0.12);
}

.sender-name[b-aiutkodu00] {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #E8F5E9;
    padding: 0.18rem 0.6rem;
    border-radius: 2rem;
    white-space: nowrap;
    background: linear-gradient(135deg, #005B33, #009A45);
    box-shadow: 0 1px 6px rgba(0, 91, 51, 0.35);
}

.typing-bubble[b-aiutkodu00] {
    background: radial-gradient(circle at center, #002E1A 0%, #080C09 100%);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(174, 213, 129, 0.4);
    padding: 1.4rem 1.2rem 0.6rem;
    border-radius: 1.1rem;
    border-bottom-left-radius: 0.3rem;
    box-shadow: 0 4px 24px rgba(0, 46, 26, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    gap: 5px;
}

.typing-dot[b-aiutkodu00] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #AED581;
    opacity: 0.4;
    animation: typingPulse-b-aiutkodu00 1.4s ease-in-out infinite;
}

    .typing-dot:nth-child(2)[b-aiutkodu00] {
        animation-delay: 0.2s;
    }

    .typing-dot:nth-child(3)[b-aiutkodu00] {
        animation-delay: 0.4s;
    }

@keyframes msgSlideUp-b-aiutkodu00 {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes typingPulse-b-aiutkodu00 {
    0%, 100% {
        opacity: 0.3;
        transform: scale(0.85);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }
}
/* /Components/Chat/UserMessage.razor.rz.scp.css */
.msg-row[b-4ypwuvs87s] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.1rem;
    animation: msgSlideUp-b-4ypwuvs87s 0.3s ease-out both;
}

.msg-group[b-4ypwuvs87s] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    max-width: 75%;
}

@media (max-width: 768px) {
    .msg-group[b-4ypwuvs87s] {
        max-width: 92%;
    }
}

.msg-header[b-4ypwuvs87s] {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: -18px;
    position: relative;
    z-index: 1;
    padding-right: 10px;
}

.avatar[b-4ypwuvs87s] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #009A45;
    color: #E8F5E9;
    box-shadow: 0 2px 8px rgba(0, 154, 69, 0.45);
    animation: avatarIn-b-4ypwuvs87s 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.sender-name[b-4ypwuvs87s] {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #E8F5E9;
    padding: 0.18rem 0.6rem;
    border-radius: 2rem;
    white-space: nowrap;
    background: #009A45;
    box-shadow: 0 1px 6px rgba(0, 154, 69, 0.4);
}

.msg-bubble[b-4ypwuvs87s] {
    padding: 1.4rem 1rem 0.65rem;
    border-radius: 1.1rem;
    border-bottom-right-radius: 0.3rem;
    font-size: 0.92rem;
    line-height: 1.5;
    word-wrap: break-word;
    width: 100%;
    background: linear-gradient(135deg, #005B33 0%, #003b22 100%);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(76, 175, 80, 0.45);
    color: #E8F5E9;
    box-shadow: 0 4px 24px rgba(0, 91, 51, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

@keyframes msgSlideUp-b-4ypwuvs87s {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes avatarIn-b-4ypwuvs87s {
    0% {
        opacity: 0;
        transform: scale(0.4) rotate(15deg);
    }

    70% {
        transform: scale(1.15) rotate(-4deg);
    }

    100% {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-zmzs1ibiix] {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

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

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

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

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

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

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

#blazor-error-ui[b-zmzs1ibiix] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-zmzs1ibiix] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* ===== Animations ===== */
@keyframes bgShift-b-9bsuppiza2 {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes floatGlow1-b-9bsuppiza2 {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.15; }
    50% { transform: translate(15px, 15px) scale(1.1); opacity: 0.3; }
}

@keyframes floatGlow2-b-9bsuppiza2 {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.1; }
    50% { transform: translate(-15px, -15px) scale(1.1); opacity: 0.25; }
}

/* ===== Sidebar shell ===== */

.nav-sidebar[b-9bsuppiza2] {
    display: flex;
    flex-direction: column;
    height: 100%;
    /* Darkened background gradient, especially at the top, to reduce lightness */
    background: linear-gradient(135deg, rgb(8 94 125 / 95%), rgb(10 34 35 / 85%), rgb(0 3 15 / 95%));
    background-size: 200% 200%;
    animation: bgShift-b-9bsuppiza2 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    position: relative;
    overflow: hidden;
    
    /* Replaced sharp rect right border with a smooth, fading gradient line */
    border-right: 1px solid;
    border-image: linear-gradient(to bottom, transparent 5%, rgba(129, 230, 217, 0.35) 50%, transparent 95%) 1;
    
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.25);
}

    .nav-sidebar[b-9bsuppiza2]::before {
        content: '';
        position: absolute;
        top: -80px;
        left: -80px;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle, rgba(44, 122, 123, 0.3) 0%, transparent 65%);
        pointer-events: none;
        animation: floatGlow1-b-9bsuppiza2 8s ease-in-out infinite;
    }

    .nav-sidebar[b-9bsuppiza2]::after {
        content: '';
        position: absolute;
        bottom: -60px;
        right: -60px;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(129, 230, 217, 0.25) 0%, transparent 65%);
        pointer-events: none;
        animation: floatGlow2-b-9bsuppiza2 10s ease-in-out infinite reverse;
    }

/* ===== Brand row ===== */

.nav-brand-row[b-9bsuppiza2] {
    position: relative;
    z-index: 1;
    min-height: 3.5rem;
    display: flex;
    align-items: center;
    padding: 0 1rem;
    border-bottom: 1px solid rgba(129, 230, 217, 0.1);
    flex-shrink: 0;
}

.nav-brand[b-9bsuppiza2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.brand-gem[b-9bsuppiza2] {
    font-size: 1.3rem;
    color: #4CAF50;
    line-height: 1;
}

.brand-name[b-9bsuppiza2] {
    font-size: 1.35rem;
    font-weight: 1000;
    letter-spacing: 0.08em;
    color: #a7ccdb;
}

/* ===== Mobile toggler ===== */

.navbar-toggler[b-9bsuppiza2] {
    appearance: none;
    cursor: pointer;
    width: 2.2rem;
    height: 2.2rem;
    position: absolute;
    top: 0.65rem;
    right: 0.75rem;
    border: 1px solid rgba(129, 230, 217, 0.25);
    border-radius: 0.5rem;
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28165%2C 180%2C 252%2C 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.4rem rgba(44, 122, 123, 0.1);
    z-index: 2;
}

    .navbar-toggler:checked[b-9bsuppiza2] {
        background-color: rgba(44, 122, 123, 0.3);
    }

/* ===== Nav scrollable area ===== */

.nav-scrollable[b-9bsuppiza2] {
    display: none;
    position: relative;
    z-index: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.5rem 0.75rem 1.5rem;
    scrollbar-width: none;
}

    .nav-scrollable[b-9bsuppiza2]::-webkit-scrollbar {
        display: none;
    }

.navbar-toggler:checked ~ .nav-scrollable[b-9bsuppiza2] {
    display: block;
}

/* ===== Section label ===== */

.nav-section-label[b-9bsuppiza2] {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(129, 230, 217, 0.35);
    padding: 0.75rem 0.5rem 0.4rem;
    margin: 0;
}

/* ===== Nav items ===== */

.nav-item[b-9bsuppiza2] {
    margin-bottom: 0.4rem;
}

    .nav-item[b-9bsuppiza2]  a {
        display: flex;
        align-items: center;
        padding: 0.65rem 0.75rem;
        border-radius: 6px;
        color: rgba(203, 213, 225, 0.65);
        text-decoration: none;
        font-size: 0.875rem;
        font-weight: 500;
        transition: background 0.25s cubic-bezier(0.25, 0.8, 0.25, 1), color 0.25s ease, transform 0.25s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.25s ease;
        position: relative;
        line-height: 1.4;
        border: 1px solid transparent;
    }

        .nav-item[b-9bsuppiza2]  a:hover {
            background: rgba(44, 122, 123, 0.08);
            color: rgba(226, 232, 240, 0.95);
            transform: translateX(4px);
            border-color: rgba(44, 122, 123, 0.2);
        }

        .nav-item[b-9bsuppiza2]  a.active {
            background: rgba(44, 122, 123, 0.15);
            color: #ffffff;
            font-weight: 600;
            border-color: rgba(129, 230, 217, 0.3);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 4px 12px rgba(44, 122, 123, 0.2);
        }

            .nav-item[b-9bsuppiza2]  a.active::before {
                content: '';
                position: absolute;
                left: -2px; /* Pull outside to fit layout */
                top: 20%;
                height: 60%;
                width: 4px;
                background: linear-gradient(180deg, #bee3f8, #bee3f8);
                border-radius: 4px; /* Techy pill shape */
                box-shadow: 0 0 12px rgba(129, 230, 217, 0.8);
            }

/* ===== Icons ===== */

.bi[b-9bsuppiza2] {
    display: inline-block;
    width: 1.1rem;
    height: 1.1rem;
    margin-right: 0.7rem;
    flex-shrink: 0;
    background-size: cover;
    opacity: 0.7;
    transition: opacity 0.2s ease;
    vertical-align: middle;
}

.nav-item[b-9bsuppiza2]  a:hover .bi,
.nav-item[b-9bsuppiza2]  a.active .bi {
    opacity: 1;
}

.bi-house-door-fill[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-calendar-plus[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M8 7a.5.5 0 0 1 .5.5V9H10a.5.5 0 0 1 0 1H8.5v1.5a.5.5 0 0 1-1 0V10H6a.5.5 0 0 1 0-1h1.5V7.5A.5.5 0 0 1 8 7z'/%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z'/%3E%3C/svg%3E");
}

.bi-stars[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M7.657 6.247c.11-.33.576-.33.686 0l.645 1.937a2.89 2.89 0 0 0 1.829 1.828l1.936.645c.33.11.33.576 0 .686l-1.937.645a2.89 2.89 0 0 0-1.828 1.829l-.645 1.936a.361.361 0 0 1-.686 0l-.645-1.937a2.89 2.89 0 0 0-1.828-1.828l-1.937-.645a.361.361 0 0 1 0-.686l1.937-.645a2.89 2.89 0 0 0 1.828-1.828l.645-1.937zM3.794 1.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387A1.734 1.734 0 0 0 4.593 5.69l-.387 1.162a.217.217 0 0 1-.412 0L3.407 5.69A1.734 1.734 0 0 0 2.31 4.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387A1.734 1.734 0 0 0 3.407 2.31l.387-1.162zM10.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.753.732.868l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.156 1.156 0 0 0-.732.868l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.156 1.156 0 0 0-.732-.868l-.774-.258a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.522.732-.868L10.863.1z'/%3E%3C/svg%3E");
}

.bi-book[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M1 2.828c.885-.37 2.154-.769 3.388-.893 1.33-.134 2.458.063 3.112.752v9.746c-.935-.53-2.12-.603-3.213-.493-1.18.12-2.37.461-3.287.811zm7.5-.141c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783'/%3E%3C/svg%3E");
}

.bi-plug[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M6 0a.5.5 0 0 1 .5.5V3h3V.5a.5.5 0 0 1 1 0V3h1a.5.5 0 0 1 .5.5v3A3.5 3.5 0 0 1 8.5 10c-.002.434-.01.845-.04 1.22-.041.514-.126 1.003-.317 1.424a2.08 2.08 0 0 1-.97 1.028C6.725 13.9 6.169 14 5.5 14c-.998 0-1.61.33-1.974.718A1.92 1.92 0 0 0 3 16H2c0-.616.232-1.367.797-1.968C3.374 13.42 4.261 13 5.5 13c.581 0 .962-.088 1.218-.219.241-.123.4-.3.514-.55.121-.266.193-.621.23-1.09.027-.34.035-.718.037-1.141A3.5 3.5 0 0 1 4 6.5v-3a.5.5 0 0 1 .5-.5h1V.5A.5.5 0 0 1 6 0M5 4v2.5a2.5 2.5 0 0 0 5 0V4z'/%3E%3C/svg%3E");
}

.bi-search-heart[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 4.482c1.664-1.673 5.825 1.254 0 5.018-5.825-3.764-1.664-6.69 0-5.018Z'/%3E%3Cpath d='M13 6.5a6.471 6.471 0 0 1-1.258 3.844c.04.03.078.062.115.098l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1.007 1.007 0 0 1-.1-.115h.002A6.5 6.5 0 1 1 13 6.5ZM6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11Z'/%3E%3C/svg%3E");
}

.bi-mic-fill[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M5 3a3 3 0 0 1 6 0v5a3 3 0 0 1-6 0V3z'/%3E%3Cpath d='M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
}

.bi-people-fill[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-5.784 6A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E");
}

.bi-key-fill[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 11.5a3.5 3.5 0 1 1 3.163-5H14L15.5 8 14 9.5l-1-1-1 1-1-1-1 1-1-1-1.235 1.164A3.5 3.5 0 0 1 3.5 11.5zm0-1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E");
}

.bi-box-arrow-left[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M6 12.5a.5.5 0 0 0 .5.5h8a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5h-8a.5.5 0 0 0-.5.5v2a.5.5 0 0 1-1 0v-2A1.5 1.5 0 0 1 6.5 2h8A1.5 1.5 0 0 1 16 3.5v9a1.5 1.5 0 0 1-1.5 1.5h-8A1.5 1.5 0 0 1 5 12.5v-2a.5.5 0 0 1 1 0v2zm-7.354-4.354a.5.5 0 0 0 0 .708l3 3a.5.5 0 0 0 .708-.708L1.207 8.5H10.5a.5.5 0 0 0 0-1H1.207l2.147-2.146a.5.5 0 1 0-.708-.708l-3 3z'/%3E%3C/svg%3E");
}

.bi-speedometer[b-9bsuppiza2] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z'/%3E%3Cpath fill-rule='evenodd' d='M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z'/%3E%3C/svg%3E");
}

/* ===== Logout button — matches the ::deep a nav-link appearance ===== */

.nav-item button.nav-link[b-9bsuppiza2] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.65rem 0.75rem;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.4;
    border: 1px solid transparent;
    background: transparent;
    transition: background 0.25s cubic-bezier(0.25, 0.8, 0.25, 1), color 0.25s ease, transform 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
    text-align: left;
}

    .nav-item button.nav-link:hover[b-9bsuppiza2] {
        background: rgba(220, 53, 69, 0.08);
        transform: translateX(4px);
        border-color: rgba(220, 53, 69, 0.2);
    }

        .nav-item button.nav-link:hover .bi[b-9bsuppiza2] {
            opacity: 1;
        }

.nav-group[b-9bsuppiza2] {
    position: relative;
    margin-bottom: 0.15rem;
    padding-left: 0;
}

    .nav-group[b-9bsuppiza2]::before {
        content: '';
        position: absolute;
        left: 1.35rem;
        top: 2.6rem;
        bottom: 0.45rem;
        width: 1px;
        background: linear-gradient(180deg, rgba(129, 230, 217, 0.35) 0%, transparent 100%);
        pointer-events: none;
    }

/* ===== Sub-items ===== */

.nav-sub-item[b-9bsuppiza2] {
    padding-left: 1rem;
}

    .nav-sub-item[b-9bsuppiza2]  a {
        font-size: 0.815rem;
        color: rgba(203, 213, 225, 0.5);
        padding: 0.45rem 0.65rem;
    }

        .nav-sub-item[b-9bsuppiza2]  a:hover {
            color: rgba(226, 232, 240, 0.85);
        }

        .nav-sub-item[b-9bsuppiza2]  a.active {
            color: #e0e7ff;
            font-weight: 500;
            background: rgba(44, 122, 123, 0.12);
        }

/* ===== Responsive ===== */

@media (min-width: 641px) {
    .nav-sidebar[b-9bsuppiza2] {
        min-height: 100vh;
    }

    .navbar-toggler[b-9bsuppiza2] {
        display: none;
    }

    .nav-scrollable[b-9bsuppiza2] {
        display: flex;
        flex-direction: column;
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}

/* ===== Home Link Special Styling ===== */
.nav-item-home[b-9bsuppiza2] {
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(129, 230, 217, 0.15);
}

    .nav-item-home[b-9bsuppiza2]  a.home-link {
        background: rgba(44, 122, 123, 0.25);
        border: 1px solid rgba(129, 230, 217, 0.4);
        box-shadow: 0 4px 12px rgba(44, 122, 123, 0.15);
        color: #ffffff;
        font-weight: 600;
    }

        .nav-item-home[b-9bsuppiza2]  a.home-link:hover {
            background: rgba(44, 122, 123, 0.4);
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(44, 122, 123, 0.25);
            border-color: rgba(129, 230, 217, 0.6);
        }

        .nav-item-home[b-9bsuppiza2]  a.home-link.active::before {
            display: none; /* remove the tiny side pill for home link since its custom looking */
        }

/* ===== Build version ===== */

.nav-version[b-9bsuppiza2] {
    padding: 0.75rem 1rem;
    text-align: center;
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.35);
    letter-spacing: 0.05em;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
/* /Components/Pages/Admin/Accounts.razor.rz.scp.css */
/* ═══ NavMenu-style teal glass theme, applied hierarchically ═══════
   Level 1: page header — teal accent
   Level 2: table card / modals — light glass shells
   Level 3: toolbar, table head, modal header — tinted bands
   Level 4: rows, fields — lightest
   Semantic badge colors (role/status) are intentionally preserved. */

@keyframes accountsBgShift-b-uonuc3yx8q {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes accountsGlowPulse-b-uonuc3yx8q {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

/* ── Page Header ────────────────────────── */

.accounts-header[b-uonuc3yx8q] {
    margin-bottom: 1.5rem !important;
    border-bottom: 2px solid rgba(44, 122, 123, 0.25) !important;
}

    .accounts-header h4[b-uonuc3yx8q] {
        color: #0b4a63;
        font-weight: 700;
        font-size: 1.25rem;
        letter-spacing: -0.01em;
    }

/* ── Form Card ──────────────────────────── */

.form-card[b-uonuc3yx8q] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 154, 69, 0.1);
    border-left: 4px solid #4CAF50 !important;
    background: #ffffff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .form-card .card-header[b-uonuc3yx8q] {
        background-color: transparent;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        padding: 0.75rem 1rem;
        color: #1e293b;
        font-weight: 600;
        font-size: 1rem;
    }

    .form-card .card-body[b-uonuc3yx8q] {
        padding: 1rem;
    }

/* ── Table Card (level 2 — light glass shell) ── */

.table-card[b-uonuc3yx8q] {
    position: relative;
    background-color: rgba(255, 255, 255, 0.8);
    background-image: linear-gradient(135deg, rgba(8, 94, 125, 0.10), rgba(129, 230, 217, 0.07), rgba(8, 94, 125, 0.12));
    background-size: 200% 200%;
    animation: accountsBgShift-b-uonuc3yx8q 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(8, 94, 125, 0.10);
    border: 1px solid rgba(44, 122, 123, 0.22);
    overflow: hidden;
    margin-bottom: 1.5rem;
}

    /* Soft aqua corner glow — same ambient effect as the AppX panels */
    .table-card[b-uonuc3yx8q]::after {
        content: '';
        position: absolute;
        top: -60px;
        right: -60px;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(129, 230, 217, 0.18) 0%, transparent 65%);
        pointer-events: none;
        animation: accountsGlowPulse-b-uonuc3yx8q 10s ease-in-out infinite;
    }

/* ── Table Toolbar (level 3 — tinted band) ── */

.table-toolbar[b-uonuc3yx8q] {
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, rgba(8, 94, 125, 0.10) 0%, rgba(129, 230, 217, 0.06) 100%);
    border-bottom: 1px solid rgba(44, 122, 123, 0.15);
}

    .table-toolbar .input-group-text[b-uonuc3yx8q] {
        border-right: none;
        background: rgba(129, 230, 217, 0.12);
        border-color: rgba(44, 122, 123, 0.25);
    }

    .table-toolbar .form-control[b-uonuc3yx8q],
    .table-toolbar .form-select[b-uonuc3yx8q] {
        background: rgba(255, 255, 255, 0.65);
        border-color: rgba(44, 122, 123, 0.25);
        box-shadow: none;
    }

    .table-toolbar .form-control[b-uonuc3yx8q] {
        border-left: none;
    }

        .table-toolbar .form-control:focus[b-uonuc3yx8q],
        .table-toolbar .form-select:focus[b-uonuc3yx8q] {
            background: rgba(255, 255, 255, 0.95);
            border-color: rgba(44, 122, 123, 0.5);
            box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.25);
        }

    /* "New user" action — teal gradient like the section tabs */
    .table-toolbar .btn-primary[b-uonuc3yx8q] {
        background: linear-gradient(135deg, #085e7d, #2c7a7b);
        border-color: #2c7a7b;
        font-weight: 600;
        box-shadow: 0 2px 10px rgba(44, 122, 123, 0.25);
        transition: all 0.15s ease;
    }

        .table-toolbar .btn-primary:hover:not(:disabled)[b-uonuc3yx8q] {
            background: linear-gradient(135deg, #0a4f68, #236263);
            border-color: #236263;
            transform: translateY(-1px);
            box-shadow: 0 4px 14px rgba(44, 122, 123, 0.4);
        }

/* ── Table ──────────────────────────────── */

.accounts-table[b-uonuc3yx8q] {
    width: 100%;
    margin-bottom: 0;
    color: #334155;
    border-collapse: separate;
    border-spacing: 0;
}

    .accounts-table th[b-uonuc3yx8q] {
        background-color: rgba(8, 94, 125, 0.08);
        color: #0f5e6e;
        font-weight: 600;
        text-transform: uppercase;
        font-size: 0.70rem;
        letter-spacing: 0.03em;
        padding: 0.75rem 1rem;
        border-bottom: 1px solid rgba(44, 122, 123, 0.2);
        border-top: none;
    }

    .accounts-table td[b-uonuc3yx8q] {
        padding: 0.75rem 1rem;
        vertical-align: middle;
        border-bottom: 1px solid rgba(44, 122, 123, 0.08);
        font-size: 0.85rem;
        background: transparent;
    }

    .accounts-table tbody tr[b-uonuc3yx8q] {
        transition: background-color 0.2s ease;
    }

        .accounts-table tbody tr:hover[b-uonuc3yx8q] {
            background-color: rgba(129, 230, 217, 0.10);
        }

        .accounts-table tbody tr:hover td[b-uonuc3yx8q] {
            background: transparent;
        }

        .accounts-table tbody tr:last-child td[b-uonuc3yx8q] {
            border-bottom: none;
        }

/* ── Badges ─────────────────────────────── */

.badge-role[b-uonuc3yx8q] {
    font-weight: 600;
    padding: 0.35em 0.65em;
    font-size: 0.70rem;
    border-radius: 6px;
    letter-spacing: 0.02em;
}

.badge-status[b-uonuc3yx8q] {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    padding: 0.35em 0.65em;
    border-radius: 6px;
    font-size: 0.70rem;
    letter-spacing: 0.02em;
}

/* Adjust colors for specific badges where generic classes are used in razor */
.bg-danger[b-uonuc3yx8q] {
    background-color: rgba(239, 68, 68, 0.1) !important;
    color: #ef4444 !important;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.bg-secondary[b-uonuc3yx8q] {
    background-color: rgba(100, 116, 139, 0.1) !important;
    color: #64748b !important;
    border: 1px solid rgba(100, 116, 139, 0.2);
}

.bg-warning[b-uonuc3yx8q] {
    background-color: rgba(245, 158, 11, 0.1) !important;
    color: #b45309 !important;
    border: 1px solid rgba(245, 158, 11, 0.2);
}

.bg-success[b-uonuc3yx8q] {
    background-color: rgba(34, 197, 94, 0.1) !important;
    color: #15803d !important;
    border: 1px solid rgba(34, 197, 94, 0.2);
}

/* ── Buttons ────────────────────────────── */

.table-responsive .btn-sm[b-uonuc3yx8q] {
    border-radius: 6px;
    padding: 0;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    transition: all 0.2s ease;
}

.icon-pencil[b-uonuc3yx8q], .icon-key[b-uonuc3yx8q], .icon-reset[b-uonuc3yx8q] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background-color: currentColor;
}

.icon-pencil[b-uonuc3yx8q] {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M12.854.146a.5.5 0 0 0-.707 0L10.5 1.793 14.207 5.5l1.647-1.646a.5.5 0 0 0 0-.708zm-1.146 2.146L2.5 11.502V13h1.498l9.207-9.207z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M12.854.146a.5.5 0 0 0-.707 0L10.5 1.793 14.207 5.5l1.647-1.646a.5.5 0 0 0 0-.708zm-1.146 2.146L2.5 11.502V13h1.498l9.207-9.207z'/%3E%3C/svg%3E") no-repeat center / contain;
}

.icon-key[b-uonuc3yx8q] {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 11.5a3.5 3.5 0 1 1 3.163-5H14L15.5 8 14 9.5l-1-1-1 1-1-1-1 1-1-1-1.235 1.164A3.5 3.5 0 0 1 3.5 11.5zm0-1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 11.5a3.5 3.5 0 1 1 3.163-5H14L15.5 8 14 9.5l-1-1-1 1-1-1-1 1-1-1-1.235 1.164A3.5 3.5 0 0 1 3.5 11.5zm0-1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E") no-repeat center / contain;
}

.icon-reset[b-uonuc3yx8q] {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2z'/%3E%3Cpath d='M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2z'/%3E%3Cpath d='M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466'/%3E%3C/svg%3E") no-repeat center / contain;
}

.btn-outline-primary[b-uonuc3yx8q] {
    color: #2c7a7b;
    border-color: rgba(44, 122, 123, 0.35);
}

    .btn-outline-primary:hover[b-uonuc3yx8q] {
        background-color: #2c7a7b;
        border-color: #2c7a7b;
        color: white;
    }

    .btn-outline-primary:focus[b-uonuc3yx8q], .btn-outline-primary:active[b-uonuc3yx8q] {
        box-shadow: 0 0 0 0.25rem rgba(129, 230, 217, 0.3) !important;
    }

.btn-outline-info[b-uonuc3yx8q] {
    color: #0284c7;
    border-color: rgba(2, 132, 199, 0.3);
}

    .btn-outline-info:hover[b-uonuc3yx8q] {
        background-color: #0284c7;
        border-color: #0284c7;
        color: white;
    }

.btn-outline-warning[b-uonuc3yx8q] {
    color: #d97706;
    border-color: rgba(217, 119, 6, 0.3);
}

    .btn-outline-warning:hover[b-uonuc3yx8q] {
        background-color: #d97706;
        border-color: #d97706;
        color: white;
    }

/* ── Pagination ─────────────────────────── */

.pagination-container[b-uonuc3yx8q] {
    padding: 0.75rem 1rem;
    background: transparent;
    border-top: 1px solid rgba(44, 122, 123, 0.12);
}

.pagination .page-link[b-uonuc3yx8q] {
    border-radius: 6px;
    margin: 0 2px;
    border: 1px solid transparent;
    color: #134e5e;
    font-weight: 500;
    background: transparent;
}

    .pagination .page-link:hover[b-uonuc3yx8q] {
        background-color: rgba(129, 230, 217, 0.15);
        border-color: rgba(44, 122, 123, 0.25);
    }

.pagination .page-item.active .page-link[b-uonuc3yx8q] {
    background-color: rgba(129, 230, 217, 0.18);
    border-color: #2c7a7b;
    color: #2c7a7b;
    font-weight: 700;
}

.pagination .page-item.disabled .page-link[b-uonuc3yx8q] {
    background-color: transparent;
    color: rgba(19, 78, 94, 0.35);
}

/* ── Modals (level 2 — glass shells over a blurred page) ── */

.modal.show[b-uonuc3yx8q] {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.modal-content[b-uonuc3yx8q] {
    position: relative;
    background-color: rgba(255, 255, 255, 0.92);
    background-image: linear-gradient(135deg, rgba(8, 94, 125, 0.10), rgba(129, 230, 217, 0.07), rgba(8, 94, 125, 0.12));
    background-size: 200% 200%;
    animation: accountsBgShift-b-uonuc3yx8q 15s ease infinite;
    border: 1px solid rgba(44, 122, 123, 0.3);
    border-left: 4px solid #2c7a7b;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 3, 15, 0.35);
    overflow: hidden;
}

    .modal-content[b-uonuc3yx8q]::after {
        content: '';
        position: absolute;
        top: -60px;
        right: -60px;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(129, 230, 217, 0.18) 0%, transparent 65%);
        pointer-events: none;
        animation: accountsGlowPulse-b-uonuc3yx8q 10s ease-in-out infinite;
    }

.modal-header[b-uonuc3yx8q] {
    background: linear-gradient(135deg, rgba(8, 94, 125, 0.14) 0%, rgba(129, 230, 217, 0.08) 100%);
    border-bottom: 1px solid rgba(44, 122, 123, 0.18);
}

.modal-title[b-uonuc3yx8q] {
    color: #0b4a63;
    font-weight: 700;
}

.modal-body .form-label[b-uonuc3yx8q] {
    color: #134e5e;
}

/* InputText / InputSelect render inside Blazor form components — ::deep required */
.modal-body[b-uonuc3yx8q]  .form-control,
.modal-body[b-uonuc3yx8q]  .form-select {
    background-color: rgba(255, 255, 255, 0.65);
    border-color: rgba(44, 122, 123, 0.3);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .modal-body[b-uonuc3yx8q]  .form-control:focus,
    .modal-body[b-uonuc3yx8q]  .form-select:focus {
        background-color: rgba(255, 255, 255, 0.95);
        border-color: rgba(44, 122, 123, 0.55);
        box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.25);
    }

.modal-footer[b-uonuc3yx8q] {
    border-top: 1px solid rgba(44, 122, 123, 0.15);
}

    /* Save buttons render inside LoadingButton — ::deep required */
    .modal-footer[b-uonuc3yx8q]  .btn-success,
    .modal-footer[b-uonuc3yx8q]  .btn-primary {
        background: linear-gradient(135deg, #085e7d, #2c7a7b);
        border-color: #2c7a7b;
        font-weight: 600;
        box-shadow: 0 2px 10px rgba(44, 122, 123, 0.25);
        transition: all 0.15s ease;
    }

        .modal-footer[b-uonuc3yx8q]  .btn-success:hover:not(:disabled),
        .modal-footer[b-uonuc3yx8q]  .btn-primary:hover:not(:disabled) {
            background: linear-gradient(135deg, #0a4f68, #236263);
            border-color: #236263;
            transform: translateY(-1px);
            box-shadow: 0 4px 14px rgba(44, 122, 123, 0.4);
        }
/* /Components/Pages/Admin/AiSettings.razor.rz.scp.css */
/* ═══ NavMenu-style teal glass theme, applied hierarchically ═══════
   Level 1: section switcher — strongest tint (the "navigation" level)
   Level 2: config cards — light glass shells
   Level 3: card header — tinted band inside the card
   Level 4: card body / fields — lightest
   Semantic colors (warnings) are intentionally preserved. */

@keyframes aiSettingsBgShift-b-ioishj0nxc {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes aiSettingsGlowPulse-b-ioishj0nxc {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

/* ── Page Header ────────────────────────── */

.page-header[b-ioishj0nxc] {
    margin-bottom: 1.5rem !important;
    border-bottom: 2px solid rgba(44, 122, 123, 0.25) !important;
}

    .page-header h4[b-ioishj0nxc] {
        color: #0b4a63;
        font-weight: 700;
        font-size: 1.25rem;
        letter-spacing: -0.01em;
    }

    .page-header p[b-ioishj0nxc] {
        font-size: 0.875rem;
    }

/* ── Section Switcher (level 1 — strongest tint) ── */

.section-switcher[b-ioishj0nxc] {
    background-color: rgba(255, 255, 255, 0.7);
    background-image: linear-gradient(135deg, rgba(8, 94, 125, 0.18), rgba(129, 230, 217, 0.12), rgba(8, 94, 125, 0.22));
    background-size: 200% 200%;
    animation: aiSettingsBgShift-b-ioishj0nxc 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(44, 122, 123, 0.3);
    border-radius: 10px;
    padding: 4px;
    gap: 2px;
    box-shadow: 0 4px 18px rgba(8, 94, 125, 0.12);
}

.section-tab[b-ioishj0nxc] {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 1.1rem;
    border-radius: 7px;
    border: none;
    background: transparent;
    font-size: 0.85rem;
    font-weight: 600;
    color: #41657a;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

    .section-tab:hover:not(.section-tab-active)[b-ioishj0nxc] {
        background: rgba(129, 230, 217, 0.18);
        color: #0b4a63;
    }

.section-tab-active[b-ioishj0nxc] {
    background: linear-gradient(135deg, #085e7d, #2c7a7b);
    box-shadow: 0 2px 10px rgba(8, 94, 125, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

    .section-tab-active.section-tab-messages[b-ioishj0nxc],
    .section-tab-active.section-tab-prompts[b-ioishj0nxc],
    .section-tab-active.section-tab-embeddings[b-ioishj0nxc],
    .section-tab-active[b-ioishj0nxc] {
        color: #e6fffa;
    }

/* ── Config Card (level 2 — light glass shell) ── */

.config-card[b-ioishj0nxc] {
    position: relative;
    background-color: rgba(255, 255, 255, 0.8);
    background-image: linear-gradient(135deg, rgba(8, 94, 125, 0.10), rgba(129, 230, 217, 0.07), rgba(8, 94, 125, 0.12));
    background-size: 200% 200%;
    animation: aiSettingsBgShift-b-ioishj0nxc 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(8, 94, 125, 0.10);
    border: 1px solid rgba(44, 122, 123, 0.22);
    border-left: 4px solid #2c7a7b;
    margin-bottom: 1.5rem;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

    .config-card:hover[b-ioishj0nxc] {
        box-shadow: 0 10px 36px rgba(8, 94, 125, 0.16);
    }

    /* Soft aqua corner glow — same ambient effect as the AppX panels */
    .config-card[b-ioishj0nxc]::after {
        content: '';
        position: absolute;
        top: -60px;
        right: -60px;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(129, 230, 217, 0.18) 0%, transparent 65%);
        pointer-events: none;
        animation: aiSettingsGlowPulse-b-ioishj0nxc 10s ease-in-out infinite;
    }

/* ── Card Header (level 3 — tinted band) ── */

.config-card-header[b-ioishj0nxc] {
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, rgba(8, 94, 125, 0.14) 0%, rgba(129, 230, 217, 0.08) 100%);
    border-bottom: 1px solid rgba(44, 122, 123, 0.18);
}

.config-card-title-row[b-ioishj0nxc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.config-card-title[b-ioishj0nxc] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0b4a63;
    margin-bottom: 0;
}

.config-card-key[b-ioishj0nxc] {
    font-size: 0.75rem;
    color: rgba(8, 94, 125, 0.6);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    letter-spacing: 0.02em;
}

.config-card-meta[b-ioishj0nxc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ── Feature Page Links ─────────────────── */

.config-card-link[b-ioishj0nxc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background-color: rgba(44, 122, 123, 0.10);
    text-decoration: none;
    transition: all 0.15s ease;
    border: 1px solid transparent;
}

    .config-card-link:hover[b-ioishj0nxc] {
        background-color: rgba(44, 122, 123, 0.2);
        border-color: rgba(44, 122, 123, 0.3);
        transform: translateY(-1px);
    }

    .config-card-link .bi[b-ioishj0nxc] {
        display: inline-block;
        width: 16px;
        height: 16px;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        opacity: 0.85;
    }

    .config-card-link:hover .bi[b-ioishj0nxc] {
        opacity: 1;
    }

    .config-card-link .bi-chat-dots-fill[b-ioishj0nxc] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%232c7a7b' viewBox='0 0 16 16'%3E%3Cpath d='M16 8c0 3.866-3.582 7-8 7a9 9 0 0 1-2.347-.306c-.584.296-1.925.864-4.181 1.234-.2.032-.352-.176-.273-.362.354-.836.674-1.95.77-2.966C.744 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7M5 8a1 1 0 1 0-2 0 1 1 0 0 0 2 0m4 0a1 1 0 1 0-2 0 1 1 0 0 0 2 0m3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E%3C/svg%3E");
    }

    .config-card-link .bi-mic-fill[b-ioishj0nxc] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%232c7a7b' viewBox='0 0 16 16'%3E%3Cpath d='M5 3a3 3 0 0 1 6 0v5a3 3 0 0 1-6 0z'/%3E%3Cpath d='M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5'/%3E%3C/svg%3E");
    }

    .config-card-link .bi-search-heart[b-ioishj0nxc] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%232c7a7b' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 4.482c1.664-1.673 5.825 1.254 0 5.018-5.825-3.764-1.664-6.69 0-5.018'/%3E%3Cpath d='M13 6.5a6.47 6.47 0 0 1-1.258 3.835l.74.74a.75.75 0 0 1 .018 1.042l-.018.02-.019.018a.75.75 0 0 1-1.042.018l-.74-.74A6.5 6.5 0 1 1 13 6.5M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11'/%3E%3C/svg%3E");
    }

    .config-card-link .bi-house-door-fill[b-ioishj0nxc] {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%232c7a7b' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
    }

/* ── Badge ──────────────────────────────── */

.config-card-badge[b-ioishj0nxc] {
    font-size: 0.725rem;
    color: #0f5e6e;
    background: rgba(129, 230, 217, 0.18);
    border: 1px solid rgba(44, 122, 123, 0.2);
    border-radius: 6px;
    padding: 0.3rem 0.6rem;
    white-space: nowrap;
}

/* ── Card Body ──────────────────────────── */

.config-card-body[b-ioishj0nxc] {
    padding: 1.25rem;
}

/* ── Fields ─────────────────────────────── */

.config-field[b-ioishj0nxc] {
    margin-bottom: 1.25rem;
}

.config-label[b-ioishj0nxc] {
    display: block;
    font-size: 0.825rem;
    font-weight: 600;
    color: #134e5e;
    margin-bottom: 0.4rem;
    letter-spacing: 0.01em;
}

.config-field[b-ioishj0nxc]  .form-select {
    border-radius: 8px;
    border: 1px solid rgba(44, 122, 123, 0.3);
    background-color: rgba(255, 255, 255, 0.65);
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .config-field[b-ioishj0nxc]  .form-select:focus {
        border-color: rgba(44, 122, 123, 0.55);
        background-color: rgba(255, 255, 255, 0.9);
        box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.25);
    }

/* ── Prompt Editor ──────────────────────── */

.config-prompt-editor[b-ioishj0nxc] {
    border-radius: 8px !important;
    border: 1px solid rgba(44, 122, 123, 0.3) !important;
    font-size: 0.8rem !important;
    line-height: 1.6 !important;
    background: rgba(255, 255, 255, 0.6) !important;
    resize: vertical;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .config-prompt-editor:focus[b-ioishj0nxc] {
        border-color: rgba(44, 122, 123, 0.55) !important;
        box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.25) !important;
        background: rgba(255, 255, 255, 0.92) !important;
    }

/* ── Placeholder Hints ──────────────────── */

.config-placeholders[b-ioishj0nxc] {
    margin-top: 0.5rem;
    font-size: 0.775rem;
    color: #64748b;
    line-height: 1.6;
}

    .config-placeholders code[b-ioishj0nxc] {
        background: rgba(44, 122, 123, 0.08);
        color: #0f766e;
        padding: 0.15rem 0.4rem;
        border-radius: 4px;
        font-size: 0.75rem;
        font-weight: 500;
        border: 1px solid rgba(44, 122, 123, 0.15);
    }

/* ── Actions ────────────────────────────── */

.config-info-note[b-ioishj0nxc] {
    font-size: 0.8rem;
    color: #134e5e;
    background: rgba(129, 230, 217, 0.12);
    border: 1px solid rgba(44, 122, 123, 0.25);
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    margin-bottom: 1rem;
    line-height: 1.5;
}

    .config-info-note .bi[b-ioishj0nxc] {
        color: #2c7a7b;
    }

/* ── Model Warning ──────────────────────── */

.model-warning[b-ioishj0nxc] {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    line-height: 1.5;
}

    .model-warning .bi[b-ioishj0nxc] {
        color: #d97706;
    }

.config-actions[b-ioishj0nxc] {
    display: flex;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(44, 122, 123, 0.12);
}

    .config-actions .btn-primary[b-ioishj0nxc] {
        background: linear-gradient(135deg, #085e7d, #2c7a7b);
        border-color: #2c7a7b;
        border-radius: 8px;
        font-size: 0.85rem;
        font-weight: 600;
        padding: 0.45rem 1rem;
        transition: all 0.15s ease;
        box-shadow: 0 2px 10px rgba(44, 122, 123, 0.25);
    }

        .config-actions .btn-primary:hover:not(:disabled)[b-ioishj0nxc] {
            background: linear-gradient(135deg, #0a4f68, #236263);
            border-color: #236263;
            transform: translateY(-1px);
            box-shadow: 0 4px 14px rgba(44, 122, 123, 0.4);
        }

    .config-actions .btn-outline-secondary[b-ioishj0nxc] {
        border-radius: 8px;
        font-size: 0.85rem;
        font-weight: 600;
        padding: 0.45rem 1rem;
    }
/* /Components/Pages/Admin/AppXStageMessagesCard.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════════
   AppXStageMessagesCard — isolated CSS
   Scoped to this component only via Blazor CSS isolation.
   ══════════════════════════════════════════════════════════════ */

/* ── Card shell ─────────────────────────────────────────────── */

.stage-messages-card[b-5jbe0ac87d] {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.04);
    border: 1px solid rgba(45, 212, 191, 0.2);
    border-top: 4px solid #0d9488;
    margin-bottom: 2rem;
    overflow: hidden;
}

/* ── Card header ─────────────────────────────────────────────── */

.stage-card-header[b-5jbe0ac87d] {
    padding: 1.25rem 1.5rem 1rem;
    background: transparent;
    border-bottom: 1px solid rgba(45, 212, 191, 0.15);
}

.stage-card-title-row[b-5jbe0ac87d] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.stage-card-title-group[b-5jbe0ac87d] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.stage-card-icon-wrap[b-5jbe0ac87d] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #f0fdfa;
    border: 1px solid rgba(20, 184, 166, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.1rem;
    color: #0d9488;
}

.stage-card-title[b-5jbe0ac87d] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    letter-spacing: -0.01em;
}

.stage-card-badges[b-5jbe0ac87d] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.stage-flow-badge[b-5jbe0ac87d] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #0f766e;
    background: #f0fdfa;
    border: 1px solid rgba(20, 184, 166, 0.2);
    border-radius: 6px;
    padding: 0.25rem 0.75rem;
    white-space: nowrap;
}

.stage-flow-badge-dot[b-5jbe0ac87d] {
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #14b8a6;
    border-radius: 50%;
    box-shadow: 0 0 6px rgba(20, 184, 166, 0.6);
}

.stage-card-updated[b-5jbe0ac87d] {
    font-size: 0.75rem;
    color: #94a3b8;
    white-space: nowrap;
}

/* ── Step tracker ────────────────────────────────────────────── */

.step-tracker[b-5jbe0ac87d] {
    display: flex;
    align-items: flex-start;
    padding: 0.85rem 0 0.4rem;
    gap: 0;
    overflow-x: auto;
}

.step-item[b-5jbe0ac87d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
    min-width: 60px;
}

.step-bubble[b-5jbe0ac87d] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    background: #f0fdfa;
    border: 2px solid rgba(45, 212, 191, 0.5);
    color: #0d9488;
    transition: all 0.25s ease;
}

.step-label[b-5jbe0ac87d] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #0f766e;
    white-space: nowrap;
    text-align: center;
}

.step-connector[b-5jbe0ac87d] {
    flex: 1;
    height: 2px;
    background: rgba(45, 212, 191, 0.25);
    margin-top: 14px;
    min-width: 20px;
    max-width: 45px;
}

.step-connector-muted[b-5jbe0ac87d] {
    background: #e2e8f0;
}

.step-bubble-locked[b-5jbe0ac87d] {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #94a3b8 !important;
    font-size: 0.85rem;
}

.step-label-locked[b-5jbe0ac87d] {
    color: #94a3b8 !important;
}

/* ── Step legend ─────────────────────────────────────────────── */

.step-legend[b-5jbe0ac87d] {
    display: flex;
    gap: 1.25rem;
    padding: 0.5rem 0 0.25rem;
}

.step-legend-item[b-5jbe0ac87d] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.7rem;
    color: #64748b;
    font-weight: 500;
}

.step-legend-dot[b-5jbe0ac87d] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.step-legend-active[b-5jbe0ac87d] {
    background: #14b8a6;
    box-shadow: 0 0 4px rgba(20, 184, 166, 0.5);
}

.step-legend-locked[b-5jbe0ac87d] {
    background: #cbd5e1;
}

/* ── Card body ─────────────────────────────────────────────────── */

.stage-card-body[b-5jbe0ac87d] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    background: transparent;
}

/* ── Individual stage field ────────────────────────────────────── */

.stage-field[b-5jbe0ac87d] {
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(45, 212, 191, 0.15);
    border-left: 4px solid rgba(45, 212, 191, 0.35);
    border-radius: 10px;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
}

    .stage-field:focus-within[b-5jbe0ac87d] {
        box-shadow: 0 4px 20px rgba(20, 184, 166, 0.08);
        background: #ffffff;
        border-color: rgba(20, 184, 166, 0.25);
        border-left-color: #0d9488;
        transform: translateX(3px);
    }

.stage-field-header[b-5jbe0ac87d] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.stage-field-num[b-5jbe0ac87d] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 800;
    flex-shrink: 0;
    background: #f0fdfa;
    border: 2px solid rgba(45, 212, 191, 0.4);
    color: #0d9488;
    transition: all 0.25s ease;
}

.stage-field:focus-within .stage-field-num[b-5jbe0ac87d] {
    border-color: #0d9488;
    background: #0d9488;
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(13, 148, 136, 0.3);
}

.stage-field-info[b-5jbe0ac87d] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    flex: 1;
    min-width: 0;
}

.stage-field-name[b-5jbe0ac87d] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.01em;
    transition: color 0.25s ease;
}

.stage-field:focus-within .stage-field-name[b-5jbe0ac87d] {
    color: #0f766e;
}

.stage-field-description[b-5jbe0ac87d] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.5;
}

.stage-textarea[b-5jbe0ac87d] {
    width: 100%;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    font-size: 0.85rem;
    line-height: 1.6;
    background: #ffffff;
    padding: 0.6rem 0.85rem;
    color: #1e293b;
    resize: vertical;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

    .stage-textarea:focus[b-5jbe0ac87d] {
        outline: none;
        border-color: #14b8a6;
        box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.15);
    }

    .stage-textarea[b-5jbe0ac87d]::placeholder {
        color: #94a3b8;
        font-style: italic;
    }

.stage-char-count[b-5jbe0ac87d] {
    text-align: right;
    font-size: 0.7rem;
    color: #94a3b8;
    margin-top: 0.3rem;
    font-weight: 500;
}

.stage-char-warn[b-5jbe0ac87d] {
    color: #ef4444;
    font-weight: 700;
}

/* ── Greeting live preview ─────────────────────────────────────── */

.stage-preview[b-5jbe0ac87d] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #f0fdfa;
    border: 1px solid rgba(20, 184, 166, 0.2);
    border-radius: 6px;
    font-size: 0.75rem;
}

.stage-preview-label[b-5jbe0ac87d] {
    color: #0d9488;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stage-preview-text[b-5jbe0ac87d] {
    color: #115e59;
    font-style: italic;
}

.placeholder-code[b-5jbe0ac87d] {
    font-family: 'Cascadia Code', 'Consolas', monospace;
    background: #ccfbf1;
    color: #0f766e;
    border-radius: 4px;
    padding: 0.1rem 0.35rem;
    font-size: 0.85em;
    font-weight: 600;
}

/* ── Info note ─────────────────────────────────────────────────── */

.stage-info-note[b-5jbe0ac87d] {
    font-size: 0.8rem;
    color: #0f766e;
    background: #f0fdfa;
    border: 1px solid rgba(20, 184, 166, 0.2);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    line-height: 1.6;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.stage-info-note .bi[b-5jbe0ac87d] {
    color: #14b8a6;
    font-size: 1rem;
    margin-top: 0.1rem;
}

/* ── Actions ───────────────────────────────────────────────────── */

.stage-card-actions[b-5jbe0ac87d] {
    display: flex;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(45, 212, 191, 0.15);
    margin-top: 0.5rem;
}

    .stage-card-actions .btn-primary[b-5jbe0ac87d] {
        background-color: #0d9488;
        border-color: #0d9488;
        border-radius: 8px;
        font-size: 0.85rem;
        font-weight: 600;
        padding: 0.5rem 1.25rem;
        transition: all 0.2s ease;
    }

        .stage-card-actions .btn-primary:hover:not(:disabled)[b-5jbe0ac87d] {
            background-color: #0f766e;
            border-color: #0f766e;
            box-shadow: 0 4px 12px rgba(13, 148, 136, 0.3);
            transform: translateY(-1px);
        }

    .stage-card-actions .btn-outline-secondary[b-5jbe0ac87d] {
        border-radius: 8px;
        font-size: 0.85rem;
        font-weight: 600;
        padding: 0.5rem 1.25rem;
        color: #64748b;
        border-color: #cbd5e1;
        background: #ffffff;
        transition: all 0.2s ease;
    }

        .stage-card-actions .btn-outline-secondary:hover:not(:disabled)[b-5jbe0ac87d] {
            background-color: #f8fafc;
            border-color: #94a3b8;
            color: #334155;
        }
/* /Components/Pages/Admin/EmbeddingCacheEditorCard.razor.rz.scp.css */
.cache-editor-card[b-a0g7pt2n72] {
    border-left-color: #0ea5e9;
}

.cache-editor-note[b-a0g7pt2n72] {
    font-size: 0.8rem;
    color: #475569;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    margin-bottom: 1rem;
    line-height: 1.5;
}

    .cache-editor-note code[b-a0g7pt2n72] {
        background: rgba(14, 165, 233, 0.1);
        color: #0369a1;
        border: 1px solid rgba(14, 165, 233, 0.2);
        border-radius: 4px;
        padding: 0.1rem 0.35rem;
    }

.cache-reset-all-btn[b-a0g7pt2n72] {
    margin-bottom: 0.5rem;
}

.cache-dropdown[b-a0g7pt2n72] {
    border: 1px solid #dbeafe;
    border-radius: 10px;
    margin-bottom: 0.75rem;
    overflow: hidden;
    background: #fff;
}

    .cache-dropdown summary[b-a0g7pt2n72] {
        cursor: pointer;
        list-style: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.7rem 0.9rem;
        background: #f8fbff;
        border-bottom: 1px solid #dbeafe;
    }

        .cache-dropdown summary[b-a0g7pt2n72]::-webkit-details-marker {
            display: none;
        }

.cache-title[b-a0g7pt2n72] {
    font-size: 0.87rem;
    font-weight: 700;
    color: #0f172a;
}

.cache-count[b-a0g7pt2n72] {
    font-size: 0.75rem;
    color: #0369a1;
    background: #e0f2fe;
    border-radius: 999px;
    padding: 0.15rem 0.55rem;
}

.cache-meta[b-a0g7pt2n72] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.cache-status-dot[b-a0g7pt2n72] {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    display: inline-block;
}

.cache-status-ready[b-a0g7pt2n72] {
    background: #22c55e;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.15);
}

.cache-status-not-ready[b-a0g7pt2n72] {
    background: #ef4444;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.15);
}

.cache-status-text[b-a0g7pt2n72] {
    font-size: 0.75rem;
    color: #334155;
    font-weight: 600;
}

.cache-body[b-a0g7pt2n72] {
    padding: 0.8rem;
}

.cache-editor-textarea[b-a0g7pt2n72] {
    min-height: 220px;
    border-radius: 8px !important;
    border: 1px solid #dbeafe !important;
    font-size: 0.8rem !important;
}

    .cache-editor-textarea:focus[b-a0g7pt2n72] {
        border-color: #0ea5e9 !important;
        box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.12) !important;
    }

.cache-actions[b-a0g7pt2n72] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.6rem;
}
/* /Components/Pages/Admin/StressTest.razor.rz.scp.css */
.stress-page[b-o2vh51s3jb] {
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Page Header ────────────────────────── */

.page-header[b-o2vh51s3jb] {
    margin-bottom: 1.25rem !important;
    border-bottom: 2px solid rgba(0, 154, 69, 0.14) !important;
}

    .page-header h4[b-o2vh51s3jb] {
        color: #1e293b;
        font-weight: 700;
        font-size: 1.2rem;
        letter-spacing: -0.01em;
    }

    .page-header p[b-o2vh51s3jb] {
        font-size: 0.875rem;
    }

/* ── Cards ────────────────────────── */
.stress-card[b-o2vh51s3jb] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
    border-left: 4px solid #4CAF50;
}

.card-section-title[b-o2vh51s3jb] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    margin: 0 0 1rem;
}

/* ── Config grids ────────────────────────── */
.config-grid[b-o2vh51s3jb] {
    display: grid;
    gap: 1rem;
    margin-bottom: 0.9rem;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.config-grid-params[b-o2vh51s3jb] {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.field-group[b-o2vh51s3jb] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.field-group-span2[b-o2vh51s3jb] {
    grid-column: span 2;
}

.field-label[b-o2vh51s3jb] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #334155;
}

.field-input[b-o2vh51s3jb] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    font-size: 0.875rem;
    color: #1f2937;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .field-input:focus[b-o2vh51s3jb] {
        outline: none;
        border-color: #009a45;
        box-shadow: 0 0 0 3px rgba(0, 154, 69, 0.1);
    }

    .field-input:disabled[b-o2vh51s3jb] {
        opacity: 0.55;
        cursor: not-allowed;
    }

.field-help[b-o2vh51s3jb] {
    font-size: 0.75rem;
    color: #64748b;
}

    .field-help code[b-o2vh51s3jb] {
        color: #0f766e;
        background: #f0fdfa;
        border: 1px solid #ccfbf1;
        border-radius: 4px;
        padding: 0.08rem 0.35rem;
    }

.query-mode-row[b-o2vh51s3jb] {
    display: flex;
    gap: 1rem;
    align-items: center;
    min-height: 42px;
}

.query-mode-option[b-o2vh51s3jb] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.86rem;
    color: #334155;
}

    .query-mode-option input[type="radio"][b-o2vh51s3jb] {
        accent-color: #009a45;
    }

/* ── Action buttons ────────────────────────── */
.config-actions[b-o2vh51s3jb] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.form-error[b-o2vh51s3jb] {
    width: 100%;
    font-size: 0.82rem;
    color: #b02a37;
    background: rgba(220, 53, 69, 0.08);
    border: 1px solid rgba(220, 53, 69, 0.24);
    border-radius: 8px;
    padding: 0.45rem 0.7rem;
}

.btn-stress-start[b-o2vh51s3jb],
.btn-stress-stop[b-o2vh51s3jb] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.5rem;
    border-radius: 8px;
    border: none;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.btn-stress-start[b-o2vh51s3jb] {
    background: #009a45;
    color: #fff;
    box-shadow: 0 2px 8px rgba(0, 154, 69, 0.3);
}

    .btn-stress-start:hover:not(:disabled)[b-o2vh51s3jb] {
        background: #007a38;
        box-shadow: 0 4px 16px rgba(0, 154, 69, 0.4);
        transform: translateY(-1px);
    }

    .btn-stress-start:disabled[b-o2vh51s3jb] {
        opacity: 0.6;
        cursor: not-allowed;
        transform: none;
    }

.btn-stress-stop[b-o2vh51s3jb] {
    background: linear-gradient(135deg, #dc3545, #b02a37);
    color: #fff;
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.35);
}

    .btn-stress-stop:hover[b-o2vh51s3jb] {
        box-shadow: 0 4px 16px rgba(220, 53, 69, 0.5);
        transform: translateY(-1px);
    }

.btn-icon[b-o2vh51s3jb] {
    font-size: 0.8rem;
}

/* ── Progress card ── */
.progress-card[b-o2vh51s3jb] {
}

.progress-header[b-o2vh51s3jb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

    .progress-header .card-section-title[b-o2vh51s3jb] {
        margin-bottom: 0;
    }

.progress-status[b-o2vh51s3jb] {
    font-size: 0.74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
}

.status-running[b-o2vh51s3jb] {
    background: rgba(0, 154, 69, 0.1);
    color: #007a38;
    animation: pulse-badge-b-o2vh51s3jb 1.2s ease-in-out infinite;
}

.status-done[b-o2vh51s3jb] {
    background: rgba(0, 154, 69, 0.1);
    color: #007a38;
}

.status-failed[b-o2vh51s3jb] {
    background: rgba(220, 53, 69, 0.12);
    color: #dc3545;
}

@keyframes pulse-badge-b-o2vh51s3jb {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.6;
    }
}

/* ── Progress bar ── */
.progress-bar-wrap[b-o2vh51s3jb] {
    margin-bottom: 1.5rem;
}

.progress-bar-track[b-o2vh51s3jb] {
    height: 8px;
    background: rgba(0, 154, 69, 0.12);
    border-radius: 99px;
    overflow: hidden;
    margin-bottom: 0.4rem;
}

.progress-bar-fill[b-o2vh51s3jb] {
    height: 100%;
    background: linear-gradient(90deg, #009a45 0%, #31b86a 100%);
    border-radius: 99px;
    transition: width 0.4s ease;
}

.progress-bar-label[b-o2vh51s3jb] {
    font-size: 0.8rem;
    color: #64748b;
}

/* ── Batch table ── */
.batch-table-wrap[b-o2vh51s3jb] {
    overflow-x: auto;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.batch-table[b-o2vh51s3jb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

    .batch-table thead th[b-o2vh51s3jb] {
        padding: 0.55rem 0.85rem;
        text-align: left;
        font-size: 0.75rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: #64748b;
        background: #f8fafc;
        border-bottom: 1px solid #e2e8f0;
    }

    .batch-table tbody td[b-o2vh51s3jb] {
        padding: 0.5rem 0.85rem;
        color: #334155;
        border-bottom: 1px solid #f1f5f9;
    }

    .batch-table tbody tr:last-child td[b-o2vh51s3jb] {
        border-bottom: none;
    }

    .batch-table tbody tr:hover td[b-o2vh51s3jb] {
        background: #f8fafc;
    }

    .batch-table .row-has-failures td[b-o2vh51s3jb] {
        background: rgba(220, 53, 69, 0.04);
    }

    .batch-table .col-success[b-o2vh51s3jb] {
        color: #007a38;
        font-weight: 600;
    }

    .batch-table .col-fail[b-o2vh51s3jb] {
        color: #dc3545;
        font-weight: 600;
    }

.btn-batch-details[b-o2vh51s3jb] {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.55rem;
}

    .btn-batch-details:hover[b-o2vh51s3jb] {
        background: #f8fafc;
        border-color: #94a3b8;
    }

.batch-modal-backdrop[b-o2vh51s3jb] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.batch-modal[b-o2vh51s3jb] {
    width: min(1200px, 96vw);
    max-height: 88vh;
    overflow: hidden;
    background: #fff;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.28);
    display: flex;
    flex-direction: column;
    padding: 1rem 1rem 0.9rem;
}

.batch-modal-header[b-o2vh51s3jb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.4rem;
}

.btn-close-modal[b-o2vh51s3jb] {
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 1rem;
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

    .btn-close-modal:hover[b-o2vh51s3jb] {
        background: #f1f5f9;
        color: #0f172a;
    }

.batch-modal-table-wrap[b-o2vh51s3jb] {
    overflow: auto;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.batch-modal-table[b-o2vh51s3jb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}

    .batch-modal-table th[b-o2vh51s3jb] {
        position: sticky;
        top: 0;
        z-index: 1;
        background: #f8fafc;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        font-size: 0.7rem;
        padding: 0.5rem 0.65rem;
        border-bottom: 1px solid #e2e8f0;
        text-align: left;
    }

    .batch-modal-table td[b-o2vh51s3jb] {
        padding: 0.48rem 0.65rem;
        border-bottom: 1px solid #f1f5f9;
        vertical-align: top;
        color: #334155;
    }

    .batch-modal-table tr:last-child td[b-o2vh51s3jb] {
        border-bottom: none;
    }

.response-preview[b-o2vh51s3jb] {
    max-width: 480px;
    white-space: normal;
    word-break: break-word;
}

/* ── Summary card ── */
.summary-grid[b-o2vh51s3jb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1rem;
}

.summary-stat[b-o2vh51s3jb] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 1rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

    .summary-stat.stat-success[b-o2vh51s3jb] {
        background: #ecfdf3;
        border-color: rgba(0, 154, 69, 0.22);
    }

    .summary-stat.stat-fail[b-o2vh51s3jb] {
        background: rgba(220, 53, 69, 0.06);
        border-color: rgba(220, 53, 69, 0.22);
    }

    .summary-stat.stat-highlight[b-o2vh51s3jb] {
        background: linear-gradient(135deg, #009a45, #0b7f3f);
        border: none;
    }

        .summary-stat.stat-highlight .stat-label[b-o2vh51s3jb],
        .summary-stat.stat-highlight .stat-value[b-o2vh51s3jb] {
            color: #fff;
        }

.stat-label[b-o2vh51s3jb] {
    font-size: 0.73rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
}

.stat-value[b-o2vh51s3jb] {
    font-size: 1.35rem;
    font-weight: 800;
    color: #1e293b;
    letter-spacing: -0.02em;
}

/* ── Error card ── */
.error-card[b-o2vh51s3jb] {
    border-color: rgba(220, 53, 69, 0.25);
    background: rgba(220, 53, 69, 0.04);
}

.error-count[b-o2vh51s3jb] {
    display: inline-block;
    background: #dc3545;
    color: #fff;
    border-radius: 99px;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.1rem 0.5rem;
    margin-left: 0.4rem;
    vertical-align: middle;
}

.error-log[b-o2vh51s3jb] {
    max-height: 200px;
    overflow-y: auto;
    font-family: var(--bs-font-monospace);
    font-size: 0.8rem;
    background: rgba(0,0,0,0.04);
    border-radius: 6px;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.error-line[b-o2vh51s3jb] {
    color: #b02a37;
    word-break: break-all;
}

.error-truncated[b-o2vh51s3jb] {
    color: #64748b;
    font-style: italic;
}

@media (max-width: 991px) {
    .field-group-span2[b-o2vh51s3jb] {
        grid-column: span 1;
    }
}
/* /Components/Pages/Avaliador/AppXAssistantPage.razor.rz.scp.css */
/* ── Page Layout ──────────────────────────────────────────────────── */

.assistant-page[b-sdkfxppvpe] {
    position: relative;
    min-height: calc(100vh - 4rem);
    display: flex;
    align-items: center;
    justify-content: center;
}

.assistant-empty-state[b-sdkfxppvpe] {
    text-align: center;
    color: rgba(15, 42, 50, 0.55);
    padding: 2rem;
    max-width: 320px;
}

.empty-icon-wrapper[b-sdkfxppvpe] {
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 50%;
    background: linear-gradient(135deg, rgb(8 94 125 / 15%), rgb(10 34 35 / 25%));
    border: 1px solid rgba(129, 230, 217, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.25rem;
    box-shadow: 0 8px 32px rgba(10, 34, 35, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.empty-icon-wrapper .bi[b-sdkfxppvpe] {
    width: 2.2rem;
    height: 2.2rem;
    opacity: 0.8;
}

.assistant-empty-state h4[b-sdkfxppvpe] {
    font-weight: 700;
    margin-bottom: 0.35rem;
    color: rgba(10, 34, 35, 0.85);
}

.assistant-empty-state p[b-sdkfxppvpe] {
    font-size: 0.9rem;
    color: rgba(10, 34, 35, 0.65);
}

/* ── Debug panel: authoritative API state inspector ──────────────────
   Read-only inspector for the last /chat response, anchored to the
   top-left of the empty page so it never overlaps the chat popover,
   FAB, or bottom nav. */

.appx-debug-panel[b-sdkfxppvpe] {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 900;
    width: min(340px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    border-radius: 14px;
    background: rgba(10, 34, 35, 0.92);
    border: 1px solid rgba(129, 230, 217, 0.25);
    box-shadow: 0 12px 36px rgba(0, 3, 15, 0.35);
    color: #e6fffa;
    font-size: 0.78rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.appx-debug-header[b-sdkfxppvpe] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    font-weight: 700;
    font-size: 0.82rem;
    border-bottom: 1px solid rgba(129, 230, 217, 0.2);
    background: linear-gradient(135deg, rgb(8 94 125 / 70%), rgb(10 34 35 / 70%));
    border-radius: 14px 14px 0 0;
}

.appx-debug-header .bi[b-sdkfxppvpe] {
    width: 1rem;
    height: 1rem;
    color: #ffd95e;
}

.appx-debug-body[b-sdkfxppvpe] {
    padding: 0.6rem 0.85rem 0.9rem;
}

.appx-debug-section[b-sdkfxppvpe] {
    margin: 0.6rem 0 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(129, 230, 217, 0.85);
}

.appx-debug-section:first-child[b-sdkfxppvpe] {
    margin-top: 0;
}

.appx-debug-row[b-sdkfxppvpe] {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.18rem 0;
    border-bottom: 1px solid rgba(230, 255, 250, 0.06);
}

.appx-debug-label[b-sdkfxppvpe] {
    color: rgba(230, 255, 250, 0.6);
    flex-shrink: 0;
}

.appx-debug-value[b-sdkfxppvpe] {
    text-align: right;
    word-break: break-word;
    font-weight: 600;
}

.appx-debug-row.appx-debug-warn .appx-debug-value[b-sdkfxppvpe] {
    color: #ff8a8a;
}

@media (max-width: 768px) {
    .appx-debug-panel[b-sdkfxppvpe] {
        position: fixed;
    }
}

/* ── Mobile-style bottom navigation pill ─────────────────────────────
   Dark teal capsule dock, mimicking the bottom nav bar of the patient app. */

.mobile-bottom-nav[b-sdkfxppvpe] {
    position: fixed;
    left: 50%;
    bottom: 24px;
    transform: translateX(-50%);
    width: min(420px, 92vw);
    z-index: 1000;
    pointer-events: none;
}

.nav-pill[b-sdkfxppvpe] {
    position: relative;
    overflow: visible;
    height: 64px;
    border-radius: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.75rem;
    background: linear-gradient(135deg, rgb(8 94 125 / 96%), rgb(10 34 35 / 94%));
    border: 1px solid rgba(129, 230, 217, 0.25);
    box-shadow: 0 12px 36px rgba(0, 3, 15, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Neon bottom light line */
.nav-pill[b-sdkfxppvpe]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 32px;
    right: 32px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(129, 230, 217, 0.8) 30%, rgba(255, 217, 94, 0.9) 50%, rgba(129, 230, 217, 0.8) 70%, transparent);
    box-shadow: 0 2px 10px rgba(129, 230, 217, 0.8), 0 0 16px rgba(255, 217, 94, 0.4);
    border-radius: 2px;
    pointer-events: none;
}

/* Side buttons: flat icon-over-label, warming to the FAB's amber on
   hover so the dock reads as one family without extra shapes. */
.nav-pill-item[b-sdkfxppvpe] {
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.9rem;
    border: none;
    background: transparent;
    color: rgba(230, 255, 250, 0.82);
    cursor: pointer;
    transition: transform 0.18s ease, color 0.18s ease;
}

.nav-pill-item .bi[b-sdkfxppvpe] {
    width: 1.45rem;
    height: 1.45rem;
    opacity: 0.82;
    transition: opacity 0.18s ease, filter 0.18s ease, transform 0.18s ease;
}

.nav-pill-label[b-sdkfxppvpe] {
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1;
}

.nav-pill-item:hover[b-sdkfxppvpe] {
    transform: translateY(-2px);
    color: #ffd95e;
}

.nav-pill-item:hover .bi[b-sdkfxppvpe] {
    opacity: 1;
    filter: drop-shadow(0 0 6px rgba(255, 217, 94, 0.65));
    transform: scale(1.1);
}

.nav-pill-item:active[b-sdkfxppvpe] {
    transform: translateY(0) scale(0.95);
}

.nav-pill-spacer[b-sdkfxppvpe] {
    width: 88px;
    flex-shrink: 0;
}

/* ── Floating Action Button ───────────────────────────────────────────
   Amber circle docked in the nav pill's center notch. Toggles the chat
   panel: the mic icon cross-fades into an X and the surface shifts to
   the dark teal of the open panel, so badge and panel read as one unit. */

.assistant-fab[b-sdkfxppvpe] {
    position: fixed;
    left: 50%;
    bottom: 34px;
    transform: translateX(-50%);
    width: 76px;
    height: 76px;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.85);
    z-index: 1010;
    background: linear-gradient(145deg, #ffd95e 0%, #f6ad37 70%, #ec9c2a 100%);
    color: #0a2223;
    box-shadow: 0 6px 18px rgba(10, 34, 35, 0.35), 0 2px 6px rgba(10, 34, 35, 0.25);
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, color 0.25s ease;
}

    .assistant-fab:hover[b-sdkfxppvpe] {
        transform: translateX(-50%) translateY(-3px);
        box-shadow: 0 10px 26px rgba(10, 34, 35, 0.4), 0 3px 8px rgba(10, 34, 35, 0.3);
    }

    .assistant-fab:active[b-sdkfxppvpe] {
        transform: translateX(-50%) scale(0.94);
    }

    .assistant-fab.open[b-sdkfxppvpe] {
        background: linear-gradient(145deg, #0d6a8c 0%, #0a2223 100%);
        color: #e6fffa;
        border-color: rgba(129, 230, 217, 0.5);
    }

/* Cross-fading mic / close icons, both absolutely centered. */
.assistant-fab .fab-icon[b-sdkfxppvpe] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease, transform 0.25s ease;
}

.assistant-fab .fab-icon .bi[b-sdkfxppvpe] {
    width: 2.1rem;
    height: 2.1rem;
}

.assistant-fab .fab-icon-close[b-sdkfxppvpe] {
    opacity: 0;
    transform: rotate(-90deg) scale(0.6);
}

.assistant-fab.open .fab-icon-mic[b-sdkfxppvpe] {
    opacity: 0;
    transform: rotate(90deg) scale(0.6);
}

.assistant-fab.open .fab-icon-close[b-sdkfxppvpe] {
    opacity: 1;
    transform: rotate(0) scale(1);
}

/* Soft attention pulse while the panel is closed. */
.assistant-fab .fab-pulse[b-sdkfxppvpe] {
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    border: 3px solid rgba(246, 173, 55, 0.55);
    animation: fabPulse-b-sdkfxppvpe 2.4s ease-out infinite;
    pointer-events: none;
}

@keyframes fabPulse-b-sdkfxppvpe {
    0% { transform: scale(1); opacity: 0.8; }
    70% { transform: scale(1.45); opacity: 0; }
    100% { transform: scale(1.45); opacity: 0; }
}

/* ── Click catcher ────────────────────────────────────────────────────
   Invisible layer that closes the panel on outside clicks — no dimmed
   backdrop, the panel is a popover, not a modal. */

.assistant-click-catcher[b-sdkfxppvpe] {
    position: fixed;
    inset: 0;
    z-index: 1004;
    background: transparent;
}

/* ── Anchored chat panel ──────────────────────────────────────────────
   Fixed popover that scales up out of the FAB (transform-origin at the
   badge) instead of a detached centered modal. */

.assistant-popover[b-sdkfxppvpe] {
    position: absolute;
    left: 50%;
    bottom: 126px;
    transform: translateX(-50%) translateY(28px) scale(0.15);
    transform-origin: 50% 100%;
    width: min(420px, 92vw);
    height: min(640px, calc(100dvh - 158px));
    z-index: 1006;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    overflow: visible;
    background: rgb(10 34 35);
    border: 1px solid rgba(129, 230, 217, 0.25);
    box-shadow: 0 24px 64px rgba(0, 3, 15, 0.5), 0 6px 20px rgba(0, 3, 15, 0.35);
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1), opacity 0.2s ease, visibility 0s linear 0.28s;
}

    .assistant-popover.open[b-sdkfxppvpe] {
        transform: translateX(-50%) translateY(0) scale(1);
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
        transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1), opacity 0.2s ease, visibility 0s;
    }

/* Tail pointing down at the FAB, completing the visual connection. */
.assistant-popover-tail[b-sdkfxppvpe] {
    position: absolute;
    left: 50%;
    bottom: -8px;
    transform: translateX(-50%) rotate(45deg);
    width: 16px;
    height: 16px;
    background: rgb(10 34 35);
    border-right: 1px solid rgba(129, 230, 217, 0.25);
    border-bottom: 1px solid rgba(129, 230, 217, 0.25);
}

/* ── Panel header ─────────────────────────────────────────────────── */

.assistant-popover-header[b-sdkfxppvpe] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border-radius: 20px 20px 0 0;
    background: linear-gradient(135deg, rgb(8 94 125 / 95%), rgb(10 34 35 / 92%));
    border-bottom: 1px solid rgba(129, 230, 217, 0.2);
    color: #e6fffa;
    flex-shrink: 0;
}

.header-identity[b-sdkfxppvpe] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
}

.header-avatar[b-sdkfxppvpe] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, #ffd95e, #f6ad37);
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(246, 173, 55, 0.35);
}

.header-avatar .bi[b-sdkfxppvpe] {
    width: 1.25rem;
    height: 1.25rem;
}

.header-text[b-sdkfxppvpe] {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
    min-width: 0;
}

.header-title[b-sdkfxppvpe] {
    font-weight: 700;
    font-size: 0.95rem;
}

.header-status[b-sdkfxppvpe] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    color: rgba(230, 255, 250, 0.65);
}

.status-dot[b-sdkfxppvpe] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 6px rgba(74, 222, 128, 0.8);
}

.header-close[b-sdkfxppvpe] {
    border: none;
    background: rgba(230, 255, 250, 0.08);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease;
}

.header-close:hover[b-sdkfxppvpe] {
    background: rgba(230, 255, 250, 0.18);
}

.header-close .bi[b-sdkfxppvpe] {
    width: 1rem;
    height: 1rem;
}

/* ── Panel body ───────────────────────────────────────────────────── */

.assistant-popover-body[b-sdkfxppvpe] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    border-radius: 0 0 20px 20px;
}

/* ── Mobile ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .assistant-popover[b-sdkfxppvpe] {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        height: 100dvh;
        border-radius: 0;
        border: none;
        transform: translateY(36px) scale(0.96);
        transform-origin: 50% 100%;
        background: rgb(10 34 35) !important;
    }

        .assistant-popover.open[b-sdkfxppvpe] {
            transform: translateY(0) scale(1);
        }

    .assistant-popover-header[b-sdkfxppvpe] {
        border-radius: 0;
    }

    .assistant-popover-body[b-sdkfxppvpe] {
        border-radius: 0;
    }

    .assistant-popover-tail[b-sdkfxppvpe] {
        display: none;
    }

    /* Full-screen panel covers the FAB's spot — hide it and rely on the
       header's minimize button to close. */
    .assistant-fab.open[b-sdkfxppvpe] {
        opacity: 0;
        pointer-events: none;
    }

    .panel-open .mobile-bottom-nav[b-sdkfxppvpe] {
        display: none !important;
    }
    .panel-open .assistant-fab[b-sdkfxppvpe] {
        display: none !important;
    }
}

@media (min-width: 641px) {
    .mobile-bottom-nav[b-sdkfxppvpe] {
        position: absolute;
    }
    .assistant-fab[b-sdkfxppvpe] {
        position: absolute;
    }
}


/* /Components/Pages/Avaliador/AppXTestPage.razor.rz.scp.css */
.appx-test-layout[b-s2zc2h8b5p] {
    display: flex;
    gap: 1rem;
    height: calc(100vh - 1.5rem);
    padding: 0.75rem;
    overflow: hidden;
}

@media (max-width: 900px) {
    .appx-test-layout[b-s2zc2h8b5p] {
        flex-direction: column;
        height: auto;
    }
}

/* ── Setup Panel ─────────────────────────────────────────────────── */

/* Same NavMenu-style teal glass as the chat panel, but in light tints so the
   two panels read as one family while staying clearly differentiated. */
.appx-setup-panel[b-s2zc2h8b5p] {
    width: 340px;
    min-width: 340px;
    position: relative;
    background-color: rgba(255, 255, 255, 0.78);
    background-image: linear-gradient(135deg, rgba(8, 94, 125, 0.14), rgba(129, 230, 217, 0.10), rgba(8, 94, 125, 0.18));
    background-size: 200% 200%;
    animation: appxChatBgShift-b-s2zc2h8b5p 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(44, 122, 123, 0.25);
    border-radius: 12px;
    padding: 1rem;
    overflow-y: auto;
    overflow-x: hidden;
    transition: width 0.3s ease, min-width 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    box-shadow: 0 8px 32px rgba(8, 94, 125, 0.12);
}

    /* Soft ambient glows — light counterparts of the chat panel's blobs.
       Anchored fully INSIDE the panel (gradient centred on the corner) and
       animated via opacity only: this panel is its own scroll container, so
       negative offsets or transform animations would inflate the scrollable
       area and force a scrollbar even when the content fits. */
    .appx-setup-panel[b-s2zc2h8b5p]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle at 0% 0%, rgba(44, 122, 123, 0.14) 0%, transparent 65%);
        pointer-events: none;
        animation: appxPanelGlowPulse-b-s2zc2h8b5p 8s ease-in-out infinite;
    }

    .appx-setup-panel[b-s2zc2h8b5p]::after {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle at 100% 100%, rgba(129, 230, 217, 0.18) 0%, transparent 65%);
        pointer-events: none;
        animation: appxPanelGlowPulse-b-s2zc2h8b5p 10s ease-in-out infinite reverse;
    }

@keyframes appxPanelGlowPulse-b-s2zc2h8b5p {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

    .appx-setup-panel.panel-collapsed[b-s2zc2h8b5p] {
        width: 300px;
        min-width: 300px;
    }

.panel-header[b-s2zc2h8b5p] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .panel-header h5[b-s2zc2h8b5p] {
        margin: 0;
        font-size: 0.95rem;
        font-weight: 600;
        flex: 1;
        color: #0b4a63;
        letter-spacing: 0.02em;
    }

.panel-icon[b-s2zc2h8b5p] {
    font-size: 1.1rem;
}

.btn-icon[b-s2zc2h8b5p] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted, #94a3b8);
    font-size: 0.85rem;
    padding: 2px 6px;
    border-radius: 4px;
    transition: background 0.15s;
}

    .btn-icon:hover[b-s2zc2h8b5p] {
        background: var(--hover-bg, #f1f5f9);
    }

/* Session badge — teal/aqua family */
.session-badge[b-s2zc2h8b5p] {
    background: rgba(129, 230, 217, 0.18);
    border: 1px solid rgba(44, 122, 123, 0.35);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.badge-label[b-s2zc2h8b5p] {
    font-size: 0.7rem;
    color: #0f766e;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.badge-id[b-s2zc2h8b5p] {
    font-size: 0.65rem;
    color: #115e59;
    word-break: break-all;
}

/* Flow type badge */
.flow-badge[b-s2zc2h8b5p] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: 6px;
    padding: 0.35rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 0.25rem;
}

.flow-badge-detecting[b-s2zc2h8b5p] {
    background: #fefce8;
    border: 1px solid #fde68a;
    color: #92400e;
}

.flow-badge-standard[b-s2zc2h8b5p] {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
}

.flow-badge-practitioner[b-s2zc2h8b5p] {
    background: #fdf4ff;
    border: 1px solid #e9d5ff;
    color: #6b21a8;
}

/* Debug state (removed - replaced by booking-stepper) */
.setup-form[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.form-section[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

    .form-section h6[b-s2zc2h8b5p] {
        font-size: 0.8rem;
        font-weight: 600;
        color: rgba(8, 94, 125, 0.75);
        margin: 0;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

/* Inputs — translucent glass fields with a teal focus ring */
.appx-setup-panel .form-control[b-s2zc2h8b5p],
.appx-setup-panel .form-select[b-s2zc2h8b5p] {
    background-color: rgba(255, 255, 255, 0.65);
    border-color: rgba(44, 122, 123, 0.3);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

    .appx-setup-panel .form-control:focus[b-s2zc2h8b5p],
    .appx-setup-panel .form-select:focus[b-s2zc2h8b5p] {
        background-color: rgba(255, 255, 255, 0.9);
        border-color: rgba(44, 122, 123, 0.55);
        box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.25);
    }

.form-row[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .form-row label[b-s2zc2h8b5p] {
        font-size: 0.75rem;
        color: var(--text-muted, #64748b);
    }

    .form-row.two-col[b-s2zc2h8b5p] {
        flex-direction: row;
        gap: 0.5rem;
    }

        .form-row.two-col > div[b-s2zc2h8b5p] {
            flex: 1;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

/* Favorites */
.fav-row[b-s2zc2h8b5p] {
    display: flex;
    gap: 4px;
    align-items: center;
}

    .fav-row .form-control[b-s2zc2h8b5p] {
        flex: 1;
        font-size: 0.75rem;
    }

.btn-remove[b-s2zc2h8b5p] {
    background: none;
    border: none;
    color: #ef4444;
    cursor: pointer;
    font-size: 0.75rem;
    padding: 2px 4px;
    border-radius: 4px;
}

    .btn-remove:hover[b-s2zc2h8b5p] {
        background: #fef2f2;
    }

.btn-add[b-s2zc2h8b5p] {
    background: none;
    border: 1px dashed var(--border-color, #e2e8f0);
    border-radius: 6px;
    color: var(--text-muted, #64748b);
    cursor: pointer;
    font-size: 0.75rem;
    padding: 4px 8px;
    transition: all 0.15s;
    align-self: flex-start;
}

    .btn-add:hover[b-s2zc2h8b5p] {
        border-color: #2c7a7b;
        color: #2c7a7b;
    }

/* Debug state (removed - replaced by booking-stepper) */

/* ── Booking Stepper ─────────────────────────────────────────────── */

.booking-stepper[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0.25rem 0;
    flex: 1;
}

.step[b-s2zc2h8b5p] {
    display: flex;
    gap: 0.6rem;
    min-height: 52px;
}

.step-left[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    width: 24px;
}

.step-dot[b-s2zc2h8b5p] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 700;
    flex-shrink: 0;
}

.step-done .step-dot[b-s2zc2h8b5p] {
    background: #22c55e;
    color: #fff;
}

.step-current .step-dot[b-s2zc2h8b5p] {
    background: #2c7a7b;
    color: #fff;
    box-shadow: 0 0 0 3px rgba(44, 122, 123, 0.2);
}

.step-pending .step-dot[b-s2zc2h8b5p] {
    background: #e2e8f0;
    color: #94a3b8;
}

.dot-check[b-s2zc2h8b5p] {
    font-size: 0.75rem;
}

.step-line[b-s2zc2h8b5p] {
    width: 2px;
    flex: 1;
    background: #e2e8f0;
    margin: 2px 0;
    min-height: 10px;
}

    .step-line.line-done[b-s2zc2h8b5p] {
        background: #22c55e;
    }

.step-body[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    padding-bottom: 0.6rem;
    min-width: 0;
    flex: 1;
}

.step-header-row[b-s2zc2h8b5p] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 2px;
}

.step-icon[b-s2zc2h8b5p] {
    font-size: 0.8rem;
    line-height: 1;
}

.step-label[b-s2zc2h8b5p] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary, #475569);
    white-space: nowrap;
}

.step-done .step-label[b-s2zc2h8b5p] {
    color: var(--text-primary, #1e293b);
}

.step-current .step-label[b-s2zc2h8b5p] {
    color: #2c7a7b;
}

.step-value[b-s2zc2h8b5p] {
    font-size: 0.72rem;
    color: #166534;
    background: #f0fdf4;
    border-radius: 4px;
    padding: 1px 5px;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: block;
}

    .step-value.step-waiting[b-s2zc2h8b5p] {
        background: none;
        color: #94a3b8;
        font-style: italic;
        padding: 1px 0;
    }

.step-pending .step-value[b-s2zc2h8b5p] {
    background: none;
    color: #94a3b8;
    padding: 1px 0;
}

.step-extra[b-s2zc2h8b5p] {
    font-size: 0.65rem;
    color: #64748b;
    margin-top: 1px;
    display: block;
}

/* ── Chat Panel ──────────────────────────────────────────────────── */

.appx-chat-panel[b-s2zc2h8b5p] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

    /* Override ChatShell internals to fill available height */
    .appx-chat-panel[b-s2zc2h8b5p]  .page-wrapper {
        height: 100%;
        max-width: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
    }

    .appx-chat-panel[b-s2zc2h8b5p]  .chat-card {
        height: auto;
        flex: 1;
        min-height: 0;
    }

/* ── Chat Theme — NavMenu-style dark teal glass ──────────────────────
   Mirrors the sidebar's animated deep-teal gradient, floating aqua
   glows and glass borders, with a chat-appropriate bubble palette.
   Scoped to this page only via ::deep — other chat pages keep the
   default green theme. */

@keyframes appxChatBgShift-b-s2zc2h8b5p {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes appxChatGlowA-b-s2zc2h8b5p {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.15; }
    50% { transform: translate(15px, 15px) scale(1.1); opacity: 0.3; }
}

@keyframes appxChatGlowB-b-s2zc2h8b5p {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.1; }
    50% { transform: translate(-15px, -15px) scale(1.1); opacity: 0.25; }
}

/* Card shell — the NavMenu background, verbatim */
.appx-chat-panel[b-s2zc2h8b5p]  .chat-card {
    position: relative;
    background: linear-gradient(135deg, rgb(8 94 125 / 95%), rgb(10 34 35 / 85%), rgb(0 3 15 / 95%));
    background-size: 200% 200%;
    animation: appxChatBgShift-b-s2zc2h8b5p 15s ease infinite;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(129, 230, 217, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

    /* Floating ambient glows, same as the sidebar */
    .appx-chat-panel[b-s2zc2h8b5p]  .chat-card::before {
        content: '';
        position: absolute;
        top: -80px;
        left: -80px;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle, rgba(44, 122, 123, 0.3) 0%, transparent 65%);
        pointer-events: none;
        animation: appxChatGlowA-b-s2zc2h8b5p 8s ease-in-out infinite;
    }

    .appx-chat-panel[b-s2zc2h8b5p]  .chat-card::after {
        content: '';
        position: absolute;
        bottom: -60px;
        right: -60px;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(129, 230, 217, 0.25) 0%, transparent 65%);
        pointer-events: none;
        animation: appxChatGlowB-b-s2zc2h8b5p 10s ease-in-out infinite reverse;
    }

/* Messages area — let the card gradient show through */
.appx-chat-panel[b-s2zc2h8b5p]  .chat-messages {
    position: relative;
    z-index: 1;
    background: transparent;
}

    .appx-chat-panel[b-s2zc2h8b5p]  .chat-messages::-webkit-scrollbar-thumb {
        background: rgba(129, 230, 217, 0.25);
    }

        .appx-chat-panel[b-s2zc2h8b5p]  .chat-messages::-webkit-scrollbar-thumb:hover {
            background: rgba(129, 230, 217, 0.45);
        }

.appx-chat-panel[b-s2zc2h8b5p]  .empty-state {
    color: rgba(167, 204, 219, 0.65);
}

/* Assistant bubble — dark teal glass */
.appx-chat-panel[b-s2zc2h8b5p]  .msg-bubble {
    background: linear-gradient(160deg, rgba(8, 94, 125, 0.45) 0%, rgba(10, 34, 35, 0.8) 100%);
    border: 1px solid rgba(129, 230, 217, 0.28);
    color: #e2e8f0;
    box-shadow: 0 4px 24px rgba(0, 3, 15, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.appx-chat-panel[b-s2zc2h8b5p]  .avatar {
    background: linear-gradient(135deg, #085e7d, #2c7a7b);
    color: #e6fffa;
    box-shadow: 0 2px 10px rgba(8, 94, 125, 0.45), 0 0 0 3px rgba(129, 230, 217, 0.15);
}

.appx-chat-panel[b-s2zc2h8b5p]  .sender-name {
    background: linear-gradient(135deg, #085e7d, #2c7a7b);
    color: #e6fffa;
    box-shadow: 0 1px 6px rgba(8, 94, 125, 0.45);
}

/* User bubble — brighter teal so sides stay distinguishable */
.appx-chat-panel[b-s2zc2h8b5p]  .user-message .msg-bubble {
    background: linear-gradient(135deg, rgba(44, 122, 123, 0.95) 0%, rgba(8, 94, 125, 0.85) 100%);
    border: 1px solid rgba(129, 230, 217, 0.45);
    color: #f0fdfa;
    box-shadow: 0 4px 24px rgba(8, 94, 125, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.appx-chat-panel[b-s2zc2h8b5p]  .user-message .avatar {
    background: #2c7a7b;
    box-shadow: 0 2px 8px rgba(129, 230, 217, 0.35);
}

.appx-chat-panel[b-s2zc2h8b5p]  .user-message .sender-name {
    background: #2c7a7b;
    box-shadow: 0 1px 6px rgba(129, 230, 217, 0.3);
}

/* Slot option cards — aqua glass chips */
.appx-chat-panel[b-s2zc2h8b5p]  .slot-option-btn {
    background: rgba(44, 122, 123, 0.16);
    border: 1px solid rgba(129, 230, 217, 0.32);
    color: #e2e8f0;
}

    .appx-chat-panel[b-s2zc2h8b5p]  .slot-option-btn:hover:not(.disabled) {
        background: rgba(44, 122, 123, 0.35);
        border-color: rgba(129, 230, 217, 0.7);
        box-shadow: 0 4px 14px rgba(129, 230, 217, 0.18);
    }

.appx-chat-panel[b-s2zc2h8b5p]  .slot-datetime {
    color: #bee3f8;
}

.appx-chat-panel[b-s2zc2h8b5p]  .slot-hospital {
    color: #a7ccdb;
}

.appx-chat-panel[b-s2zc2h8b5p]  .slot-practitioner {
    color: #81e6d9;
}

/* Typing indicator — match the assistant bubble */
.appx-chat-panel[b-s2zc2h8b5p]  .typing-bubble {
    background: linear-gradient(160deg, rgba(8, 94, 125, 0.45) 0%, rgba(10, 34, 35, 0.8) 100%);
    border: 1px solid rgba(129, 230, 217, 0.28);
    box-shadow: 0 4px 24px rgba(0, 3, 15, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.appx-chat-panel[b-s2zc2h8b5p]  .typing-dot {
    background: #81e6d9;
}

/* Input area — lighter teal glass footer so it clearly reads as an input zone */
.appx-chat-panel[b-s2zc2h8b5p]  .chat-input-area {
    position: relative;
    z-index: 1;
    background: linear-gradient(135deg, rgba(44, 122, 123, 0.35) 0%, rgba(8, 94, 125, 0.30) 100%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid rgba(129, 230, 217, 0.3);
}

.appx-chat-panel[b-s2zc2h8b5p]  .chat-compose-bar {
    background: rgba(255, 255, 255, 0.18);
    border: 1.5px solid rgba(129, 230, 217, 0.4);
    box-shadow: 0 2px 16px rgba(0, 3, 15, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

    .appx-chat-panel[b-s2zc2h8b5p]  .chat-compose-bar:focus-within {
        background: rgba(255, 255, 255, 0.24);
        border-color: rgba(129, 230, 217, 0.75);
        box-shadow: 0 0 0 3px rgba(129, 230, 217, 0.18), 0 4px 24px rgba(129, 230, 217, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    }

.appx-chat-panel[b-s2zc2h8b5p]  .chat-input {
    color: #f8fafc;
}

    .appx-chat-panel[b-s2zc2h8b5p]  .chat-input::placeholder {
        color: rgba(230, 255, 250, 0.65);
    }

    .appx-chat-panel[b-s2zc2h8b5p]  .chat-input:disabled {
        color: rgba(230, 255, 250, 0.45);
    }

        .appx-chat-panel[b-s2zc2h8b5p]  .chat-input:disabled::placeholder {
            color: rgba(230, 255, 250, 0.4);
        }

/* ── Household row (setup form) ──────────────────────────────────── */

.household-row[b-s2zc2h8b5p] {
    display: flex;
    gap: 4px;
    align-items: center;
}

    .household-row .form-control[b-s2zc2h8b5p] {
        font-size: 0.75rem;
    }

/* ── Patient badge (active session panel) ────────────────────────── */

.patient-badge[b-s2zc2h8b5p] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 8px;
    padding: 0.4rem 0.65rem;
    margin-top: 0.25rem;
    font-size: 0.75rem;
}

.patient-badge-self[b-s2zc2h8b5p] {
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    color: #0369a1;
}

.patient-badge-other[b-s2zc2h8b5p] {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #c2410c;
}

.patient-badge-icon[b-s2zc2h8b5p] {
    font-size: 1rem;
    flex-shrink: 0;
}

.patient-badge-info[b-s2zc2h8b5p] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.patient-badge-label[b-s2zc2h8b5p] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.7;
}

.patient-badge-name[b-s2zc2h8b5p] {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.patient-badge-sub[b-s2zc2h8b5p] {
    font-size: 0.65rem;
    opacity: 0.75;
    font-family: monospace;
}

/* ── Mic and Voice Buttons ───────────────────────────────────────── */

.btn-mic[b-s2zc2h8b5p], .voice-btn[b-s2zc2h8b5p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    
    /* Circle shape matching AppButton */
    border-radius: 50%;
    width: 2.4rem;
    height: 2.4rem;
    padding: 0;
    flex-shrink: 0;
    font-size: 1.1rem;
    
    /* Default primary matching AppButton primary */
    background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
    color: #fff;
    box-shadow: 0 2px 10px rgba(44, 122, 123, 0.35);
}

.btn-mic:hover:not(:disabled)[b-s2zc2h8b5p], .voice-btn.active:hover:not(:disabled)[b-s2zc2h8b5p] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(44, 122, 123, 0.5);
}

.btn-mic:active:not(:disabled)[b-s2zc2h8b5p], .voice-btn.active:active:not(:disabled)[b-s2zc2h8b5p] {
    transform: scale(0.97);
}

.btn-mic:disabled[b-s2zc2h8b5p], .voice-btn:disabled[b-s2zc2h8b5p] {
    cursor: not-allowed;
    background: #adb5bd;
    box-shadow: none;
    opacity: 0.5;
}

/* Voice btn inactive state (ghost) — dark glass to match the teal input area */
.voice-btn:not(.active)[b-s2zc2h8b5p] {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(129, 230, 217, 0.25);
    color: #a7ccdb;
    box-shadow: none;
}

.voice-btn:not(.active):hover:not(:disabled)[b-s2zc2h8b5p] {
    background: rgba(129, 230, 217, 0.15);
    border-color: rgba(129, 230, 217, 0.45);
}

/* Recording mic (danger style) */
.btn-mic.recording[b-s2zc2h8b5p] {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    box-shadow: 0 2px 10px rgba(239, 68, 68, 0.35);
}

.btn-mic.recording:hover[b-s2zc2h8b5p] {
    box-shadow: 0 6px 20px rgba(239, 68, 68, 0.5);
}

/* ── Beta Voice Badge ────────────────────────────────────────────── */

.beta-voice-badge[b-s2zc2h8b5p] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: linear-gradient(135deg, rgba(44, 122, 123, 0.25), rgba(8, 94, 125, 0.25));
    border: 1px solid rgba(129, 230, 217, 0.35);
    color: #81e6d9;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 3px 8px 3px 5px;
    border-radius: 12px;
    margin-right: 4px;
    position: relative;
    overflow: hidden;
    user-select: none;
    cursor: default;
}

.beta-voice-badge[b-s2zc2h8b5p]::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(129, 230, 217, 0.35), transparent);
    animation: shimmer-b-s2zc2h8b5p 3s infinite;
}

.pulse-dot[b-s2zc2h8b5p] {
    width: 6px;
    height: 6px;
    background-color: #81e6d9;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(129, 230, 217, 0.7);
    animation: pulse-badge-b-s2zc2h8b5p 2s infinite;
}

@keyframes shimmer-b-s2zc2h8b5p {
    0% { left: -100%; }
    15% { left: 200%; }
    100% { left: 200%; }
}

@keyframes pulse-badge-b-s2zc2h8b5p {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(129, 230, 217, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 5px rgba(129, 230, 217, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(129, 230, 217, 0); }
}
/* /Components/Pages/Avaliador/AzureFoundryAudioSearch.razor.rz.scp.css */
/* /Components/Pages/Avaliador/AzureFoundryMedicalSearch.razor.rz.scp.css */
/* /Components/Pages/Avaliador/MedicalActChatDiagnose.razor.rz.scp.css */
/* ===== Page-specific header styles ===== */

.diagnose-header-title[b-o9ec4ga9sj] {
    font-weight: 700;
    font-size: 1.75rem;
    color: var(--neolink-fern-dark);
}

.diagnose-header-desc[b-o9ec4ga9sj] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.6rem;
}

@media (max-width: 768px) {
    .diagnose-header-title[b-o9ec4ga9sj] {
        font-size: 1.35rem;
    }

    .diagnose-header-desc[b-o9ec4ga9sj] {
        display: none;
    }
}
/* /Components/Pages/Avaliador/MedicalActSearch.razor.rz.scp.css */
/* /Components/Pages/Avaliador/MedicalActSearchAudio.razor.rz.scp.css */
/* /Components/Pages/Avaliador/MedicalActSearchGuide.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Medical Act Search Guide — glassmorphism info layout
   Violet/purple accent to match the Identificador de Ato page
   ═══════════════════════════════════════════════ */

.guide-wrapper[b-p9lce20r7g] {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1.5rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

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

.guide-hero[b-p9lce20r7g] {
    position: relative;
    text-align: center;
    padding: 3.5rem 2rem 3rem;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(192, 165, 252, 0.3);
    border-radius: 1.5rem;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 8px 40px rgba(129, 230, 217, 0.08), inset 0 1px 0 rgba(255,255,255,0.7);
    overflow: hidden;
}

.hero-glow[b-p9lce20r7g] {
    position: absolute;
    top: -60px;
    left: 50%;
    transform: translateX(-50%);
    width: 400px;
    height: 200px;
    background: radial-gradient(ellipse, rgba(var(--neolink-shamrock-rgb), 0.18) 0%, transparent 70%);
    pointer-events: none;
}

.hero-badge[b-p9lce20r7g] {
    display: inline-block;
    padding: 0.3rem 1rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(var(--neolink-shamrock-rgb), 0.12), rgba(var(--neolink-fern-rgb), 0.12));
    border: 1px solid rgba(var(--neolink-shamrock-rgb), 0.25);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--neolink-shamrock-dark);
    margin-bottom: 1.25rem;
}

.hero-title[b-p9lce20r7g] {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 800;
    line-height: 1.2;
    color: #1e1b4b;
    margin-bottom: 1rem;
}

.hero-accent[b-p9lce20r7g] {
    background: var(--neolink-gradient-brand);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-sub[b-p9lce20r7g] {
    font-size: 1.05rem;
    color: #475569;
    max-width: 560px;
    margin: 0 auto 2rem;
    line-height: 1.65;
}

.hero-cta[b-p9lce20r7g] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.75rem;
    border-radius: 999px;
    background: var(--neolink-gradient-accent);
    color: var(--neolink-text-on-accent);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    box-shadow: 0 4px 20px rgba(var(--neolink-shamrock-rgb), 0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .hero-cta:hover[b-p9lce20r7g] {
        transform: translateY(-2px);
        box-shadow: 0 8px 28px rgba(var(--neolink-shamrock-rgb), 0.45);
        color: #ffffff;
    }

.cta-arrow[b-p9lce20r7g] {
    font-size: 1.1rem;
    transition: transform 0.2s ease;
}

.hero-cta:hover .cta-arrow[b-p9lce20r7g] {
    transform: translateX(4px);
}

/* ── Section shell ────────────────────────────── */

.guide-section[b-p9lce20r7g] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section-title[b-p9lce20r7g] {
    font-size: 1.5rem;
    font-weight: 750;
    color: #1e1b4b;
    margin: 0;
}

.section-subtitle[b-p9lce20r7g] {
    font-size: 0.95rem;
    color: #64748b;
    margin: -0.75rem 0 0;
}

/* ── Steps grid ───────────────────────────────── */

.steps-grid[b-p9lce20r7g] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}

.step-card[b-p9lce20r7g] {
    position: relative;
    padding: 1.5rem;
    background: rgba(255,255,255,0.6);
    border: 1px solid rgba(var(--neolink-shamrock-rgb), 0.20);
    border-radius: 1.1rem;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 16px rgba(var(--neolink-shamrock-rgb), 0.06), inset 0 1px 0 rgba(255,255,255,0.8);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .step-card:hover[b-p9lce20r7g] {
        transform: translateY(-3px);
        box-shadow: 0 8px 28px rgba(var(--neolink-shamrock-rgb), 0.12);
    }

.step-number[b-p9lce20r7g] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: var(--neolink-gradient-accent);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-icon[b-p9lce20r7g] {
    font-size: 2rem;
    margin-bottom: 0.75rem;
    line-height: 1;
}

.step-card h3[b-p9lce20r7g] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e1b4b;
    margin: 0 0 0.5rem;
}

.step-card p[b-p9lce20r7g] {
    font-size: 0.875rem;
    color: #475569;
    margin: 0;
    line-height: 1.6;
}

/* ── Features grid ────────────────────────────── */

.features-grid[b-p9lce20r7g] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}

.feature-card[b-p9lce20r7g] {
    padding: 1.4rem 1.5rem;
    border-radius: 1.1rem;
    border: 1px solid transparent;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: transform 0.2s ease;
}

    .feature-card:hover[b-p9lce20r7g] {
        transform: translateY(-2px);
    }

    .feature-card h4[b-p9lce20r7g] {
        font-size: 0.9rem;
        font-weight: 700;
        margin: 0.5rem 0 0.4rem;
    }

    .feature-card p[b-p9lce20r7g] {
        font-size: 0.855rem;
        margin: 0;
        line-height: 1.6;
    }

.feature-icon[b-p9lce20r7g] {
    font-size: 1.6rem;
    line-height: 1;
}

.feature-purple[b-p9lce20r7g] {
    background: linear-gradient(135deg, rgba(57,158,90,0.10), rgba(57,158,90,0.06));
    border-color: rgba(57,158,90,0.22);
    color: #1a4a2a;
}

.feature-blue[b-p9lce20r7g] {
    background: linear-gradient(135deg, rgba(83,122,90,0.10), rgba(83,122,90,0.07));
    border-color: rgba(83,122,90,0.22);
    color: #2c302e;
}

.feature-teal[b-p9lce20r7g] {
    background: linear-gradient(135deg, rgba(57,158,90,0.12), rgba(43,122,67,0.08));
    border-color: rgba(57,158,90,0.20);
    color: #1a4a2a;
}

.feature-indigo[b-p9lce20r7g] {
    background: linear-gradient(135deg, rgba(44,48,46,0.08), rgba(44,48,46,0.05));
    border-color: rgba(44,48,46,0.18);
    color: #2c302e;
}

.feature-rose[b-p9lce20r7g] {
    background: linear-gradient(135deg, rgba(83,122,90,0.09), rgba(57,158,90,0.05));
    border-color: rgba(83,122,90,0.15);
    color: #3d5c43;
}

.feature-amber[b-p9lce20r7g] {
    background: linear-gradient(135deg, rgba(71,74,72,0.09), rgba(71,74,72,0.05));
    border-color: rgba(71,74,72,0.16);
    color: #474a48;
}

/* ── Tips list ────────────────────────────────── */

.tips-list[b-p9lce20r7g] {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(192, 165, 252, 0.25);
    border-radius: 1.1rem;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    overflow: hidden;
}

.tip-item[b-p9lce20r7g] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.1rem 1.5rem;
    font-size: 0.9rem;
    color: #334155;
    line-height: 1.65;
    border-bottom: 1px solid rgba(192, 165, 252, 0.14);
    transition: background 0.15s ease;
}

    .tip-item:last-child[b-p9lce20r7g] {
        border-bottom: none;
    }

    .tip-item:hover[b-p9lce20r7g] {
        background: rgba(129, 230, 217, 0.04);
    }

.tip-dot[b-p9lce20r7g] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--neolink-shamrock), var(--neolink-shamrock-light));
    margin-top: 0.45rem;
    box-shadow: 0 0 6px rgba(var(--neolink-shamrock-rgb), 0.4);
}

/* ── Fields explainer ─────────────────────────── */

.progress-explainer[b-p9lce20r7g] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.pe-item[b-p9lce20r7g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.1rem;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(192, 165, 252, 0.2);
    border-radius: 0.875rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

    .pe-item p[b-p9lce20r7g] {
        font-size: 0.8rem;
        color: #475569;
        margin: 0;
        line-height: 1.55;
    }

.pe-badge[b-p9lce20r7g] {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    width: fit-content;
}

.pe-act[b-p9lce20r7g] {
    background: rgba(var(--neolink-shamrock-rgb), 0.12);
    color: var(--neolink-shamrock-dark);
    border: 1px solid rgba(var(--neolink-shamrock-rgb), 0.25);
}

.pe-spec[b-p9lce20r7g] {
    background: rgba(var(--neolink-fern-rgb), 0.12);
    color: var(--neolink-fern-dark);
    border: 1px solid rgba(var(--neolink-fern-rgb), 0.25);
}
/* /Components/Pages/Avaliador/MedicalSearchGuide.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Guide page — glassmorphism info layout
   ═══════════════════════════════════════════════ */

.guide-wrapper[b-qh0k1pkuqm] {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1.5rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

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

.guide-hero[b-qh0k1pkuqm] {
    position: relative;
    text-align: center;
    padding: 3.5rem 2rem 3rem;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(129, 230, 217, 0.3);
    border-radius: 1.5rem;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 8px 40px rgba(44, 122, 123, 0.08), inset 0 1px 0 rgba(255,255,255,0.7);
    overflow: hidden;
}

.hero-glow[b-qh0k1pkuqm] {
    position: absolute;
    top: -60px;
    left: 50%;
    transform: translateX(-50%);
    width: 400px;
    height: 200px;
    background: radial-gradient(ellipse, rgba(44, 122, 123,0.18) 0%, transparent 70%);
    pointer-events: none;
}

.hero-badge[b-qh0k1pkuqm] {
    display: inline-block;
    padding: 0.3rem 1rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(44, 122, 123,0.12), rgba(129, 230, 217,0.12));
    border: 1px solid rgba(44, 122, 123,0.25);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: #2c7a7b;
    margin-bottom: 1.25rem;
}

.hero-title[b-qh0k1pkuqm] {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 800;
    line-height: 1.2;
    color: #1e1b4b;
    margin-bottom: 1rem;
}

.hero-accent[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, #2c7a7b 0%, #81e6d9 60%, #bee3f8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-sub[b-qh0k1pkuqm] {
    font-size: 1.05rem;
    color: #475569;
    max-width: 560px;
    margin: 0 auto 2rem;
    line-height: 1.65;
}

.hero-cta[b-qh0k1pkuqm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.75rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
    color: #ffffff;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    box-shadow: 0 4px 20px rgba(44, 122, 123,0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .hero-cta:hover[b-qh0k1pkuqm] {
        transform: translateY(-2px);
        box-shadow: 0 8px 28px rgba(44, 122, 123,0.45);
        color: #ffffff;
    }

.cta-arrow[b-qh0k1pkuqm] {
    font-size: 1.1rem;
    transition: transform 0.2s ease;
}

.hero-cta:hover .cta-arrow[b-qh0k1pkuqm] {
    transform: translateX(4px);
}

/* ── Section shell ────────────────────────────── */

.guide-section[b-qh0k1pkuqm] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section-title[b-qh0k1pkuqm] {
    font-size: 1.5rem;
    font-weight: 750;
    color: #1e1b4b;
    margin: 0;
}

.section-subtitle[b-qh0k1pkuqm] {
    font-size: 0.95rem;
    color: #64748b;
    margin: -0.75rem 0 0;
}

/* ── Steps grid ───────────────────────────────── */

.steps-grid[b-qh0k1pkuqm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}

.step-card[b-qh0k1pkuqm] {
    position: relative;
    padding: 1.5rem;
    background: rgba(255,255,255,0.6);
    border: 1px solid rgba(129, 230, 217,0.25);
    border-radius: 1.1rem;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 16px rgba(44, 122, 123,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .step-card:hover[b-qh0k1pkuqm] {
        transform: translateY(-3px);
        box-shadow: 0 8px 28px rgba(44, 122, 123,0.12);
    }

.step-number[b-qh0k1pkuqm] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #2c7a7b, #81e6d9);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-icon[b-qh0k1pkuqm] {
    font-size: 2rem;
    margin-bottom: 0.75rem;
    line-height: 1;
}

.step-card h3[b-qh0k1pkuqm] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e1b4b;
    margin: 0 0 0.5rem;
}

.step-card p[b-qh0k1pkuqm] {
    font-size: 0.875rem;
    color: #475569;
    margin: 0;
    line-height: 1.6;
}

/* ── Features grid ────────────────────────────── */

.features-grid[b-qh0k1pkuqm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}

.feature-card[b-qh0k1pkuqm] {
    padding: 1.4rem 1.5rem;
    border-radius: 1.1rem;
    border: 1px solid transparent;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: transform 0.2s ease;
}

    .feature-card:hover[b-qh0k1pkuqm] {
        transform: translateY(-2px);
    }

    .feature-card h4[b-qh0k1pkuqm] {
        font-size: 0.9rem;
        font-weight: 700;
        margin: 0.5rem 0 0.4rem;
    }

    .feature-card p[b-qh0k1pkuqm] {
        font-size: 0.855rem;
        margin: 0;
        line-height: 1.6;
    }

.feature-icon[b-qh0k1pkuqm] {
    font-size: 1.6rem;
    line-height: 1;
}

.feature-purple[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, rgba(129, 230, 217,0.1), rgba(44, 122, 123,0.08));
    border-color: rgba(129, 230, 217,0.2);
    color: #3730a3;
}

.feature-blue[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, rgba(59,130,246,0.1), rgba(44, 122, 123,0.06));
    border-color: rgba(59,130,246,0.2);
    color: #1e3a8a;
}

.feature-teal[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, rgba(20,184,166,0.1), rgba(16,185,129,0.06));
    border-color: rgba(20,184,166,0.2);
    color: #134e4a;
}

.feature-indigo[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, rgba(44, 122, 123,0.12), rgba(79,70,229,0.08));
    border-color: rgba(44, 122, 123,0.25);
    color: #312e81;
}

.feature-rose[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, rgba(244,63,94,0.08), rgba(251,113,133,0.06));
    border-color: rgba(244,63,94,0.18);
    color: #881337;
}

.feature-amber[b-qh0k1pkuqm] {
    background: linear-gradient(135deg, rgba(245,158,11,0.1), rgba(251,191,36,0.07));
    border-color: rgba(245,158,11,0.2);
    color: #78350f;
}

/* ── Tips list ────────────────────────────────── */

.tips-list[b-qh0k1pkuqm] {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(129, 230, 217,0.25);
    border-radius: 1.1rem;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    overflow: hidden;
}

.tip-item[b-qh0k1pkuqm] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.1rem 1.5rem;
    font-size: 0.9rem;
    color: #334155;
    line-height: 1.65;
    border-bottom: 1px solid rgba(129, 230, 217,0.14);
    transition: background 0.15s ease;
}

    .tip-item:last-child[b-qh0k1pkuqm] {
        border-bottom: none;
    }

    .tip-item:hover[b-qh0k1pkuqm] {
        background: rgba(44, 122, 123,0.04);
    }

.tip-dot[b-qh0k1pkuqm] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2c7a7b, #bee3f8);
    margin-top: 0.45rem;
    box-shadow: 0 0 6px rgba(44, 122, 123,0.4);
}

/* ── Progress explainer ───────────────────────── */

.progress-explainer[b-qh0k1pkuqm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
    gap: 1rem;
}

.pe-item[b-qh0k1pkuqm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.1rem;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(129, 230, 217,0.2);
    border-radius: 0.875rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

    .pe-item p[b-qh0k1pkuqm] {
        font-size: 0.8rem;
        color: #475569;
        margin: 0;
        line-height: 1.55;
    }

.pe-badge[b-qh0k1pkuqm] {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    width: fit-content;
}

.pe-act[b-qh0k1pkuqm] {
    background: rgba(44, 122, 123,0.12);
    color: #4338ca;
    border: 1px solid rgba(44, 122, 123,0.25);
}

.pe-ins[b-qh0k1pkuqm] {
    background: rgba(20,184,166,0.12);
    color: #0f766e;
    border: 1px solid rgba(20,184,166,0.25);
}

.pe-hc[b-qh0k1pkuqm] {
    background: rgba(59,130,246,0.12);
    color: #1d4ed8;
    border: 1px solid rgba(59,130,246,0.25);
}

.pe-dt[b-qh0k1pkuqm] {
    background: rgba(245,158,11,0.12);
    color: #b45309;
    border: 1px solid rgba(245,158,11,0.25);
}

.pe-pr[b-qh0k1pkuqm] {
    background: rgba(129, 230, 217,0.12);
    color: #6d28d9;
    border: 1px solid rgba(129, 230, 217,0.25);
}

/* ── Bottom CTA block ─────────────────────────── */

.guide-cta-block[b-qh0k1pkuqm] {
    position: relative;
    text-align: center;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, rgba(44, 122, 123,0.1) 0%, rgba(129, 230, 217,0.08) 100%);
    border: 1px solid rgba(44, 122, 123,0.2);
    border-radius: 1.5rem;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    overflow: hidden;
}

.cta-glow[b-qh0k1pkuqm] {
    position: absolute;
    bottom: -60px;
    left: 50%;
    transform: translateX(-50%);
    width: 380px;
    height: 180px;
    background: radial-gradient(ellipse, rgba(129, 230, 217,0.22) 0%, transparent 70%);
    pointer-events: none;
}

.guide-cta-block h2[b-qh0k1pkuqm] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #1e1b4b;
    margin-bottom: 0.5rem;
}

.guide-cta-block p[b-qh0k1pkuqm] {
    color: #475569;
    margin-bottom: 1.75rem;
    font-size: 1rem;
}

.cta-btn-large[b-qh0k1pkuqm] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 2rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
    color: #ffffff;
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    box-shadow: 0 6px 24px rgba(44, 122, 123,0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .cta-btn-large:hover[b-qh0k1pkuqm] {
        transform: translateY(-3px);
        box-shadow: 0 10px 32px rgba(44, 122, 123,0.45);
        color: #ffffff;
    }

.cta-arrow-lg[b-qh0k1pkuqm] {
    font-size: 1.2rem;
}

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

@media (max-width: 600px) {
    .guide-wrapper[b-qh0k1pkuqm] {
        padding: 1rem 1rem 3rem;
        gap: 2.5rem;
    }

    .hero-title[b-qh0k1pkuqm] {
        font-size: 1.6rem;
    }

    .steps-grid[b-qh0k1pkuqm],
    .features-grid[b-qh0k1pkuqm],
    .progress-explainer[b-qh0k1pkuqm] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/ChangePassword.razor.rz.scp.css */
/* ── Viewport & Culture ─────────────────────────────────────────── */
.login-viewport[b-pvgquex1y4] {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #020617; /* Deep slate baseline */
    background-image: radial-gradient(rgba(255, 255, 255, 0.04) 1.5px, transparent 1.5px);
    background-size: 30px 30px;
    animation: darkPatternDrift-b-pvgquex1y4 60s linear infinite;
}

@keyframes darkPatternDrift-b-pvgquex1y4 {
    0% { background-position: 0px 0px; }
    100% { background-position: 300px 300px; }
}

.culture-wrapper[b-pvgquex1y4] {
    position: absolute;
    top: 1.5rem;
    right: 2rem;
    z-index: 100;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 0.25rem 0.5rem;
    transition: all 0.2s;
}

.culture-wrapper:hover[b-pvgquex1y4] {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(20, 184, 166, 0.5);
}

.culture-wrapper[b-pvgquex1y4]  select {
    background: transparent;
    color: white;
    border: none;
    font-weight: 500;
    cursor: pointer;
    outline: none;
}
.culture-wrapper[b-pvgquex1y4]  select option {
    background: #1e293b;
    color: white;
}

/* ── Vibrant Animated Background ────────────────────────────────── */
.animated-bg[b-pvgquex1y4] {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    filter: blur(80px);
}

.blob[b-pvgquex1y4] {
    position: absolute;
    border-radius: 50%;
    opacity: 0.8;
    mix-blend-mode: screen;
    animation: drift-b-pvgquex1y4 20s infinite alternate ease-in-out;
}

.blob-1[b-pvgquex1y4] {
    top: -10%; left: -10%;
    width: 50vw; height: 50vw;
    background: #0ea5e9; /* Neon Sky Blue */
    animation-delay: 0s;
}

.blob-2[b-pvgquex1y4] {
    bottom: -20%; right: -10%;
    width: 60vw; height: 60vw;
    background: #14b8a6; /* Vibrant Teal */
    animation-delay: -5s;
    animation-direction: alternate-reverse;
}

.blob-3[b-pvgquex1y4] {
    top: 40%; left: 60%;
    width: 40vw; height: 40vw;
    background: #3b82f6; /* Bright Blue */
    animation-delay: -10s;
}

.blob-4[b-pvgquex1y4] {
    top: 20%; right: 40%;
    width: 30vw; height: 30vw;
    background: #0284c7; /* Deep Ocean */
    animation-delay: -15s;
    animation-direction: alternate-reverse;
}

@keyframes drift-b-pvgquex1y4 {
    0% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(10vw, 5vh) scale(1.1); }
    100% { transform: translate(-5vw, 15vh) scale(0.9); }
}

/* ── Container Layout ───────────────────────────────────────────── */
.login-glass-container[b-pvgquex1y4] {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5rem;
    padding: 3rem;
    width: 100%;
    max-width: 1000px;
}

/* ── Left Side: Brand Showcase ──────────────────────────────────── */
.brand-showcase[b-pvgquex1y4] {
    flex: 1;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.brand-title[b-pvgquex1y4] {
    font-size: 4.5rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    margin: 0 0 0.5rem 0;
    line-height: 1.1;
}

/* ── Right Side: Premium Glass Card ─────────────────────────────── */
.login-card-premium[b-pvgquex1y4] {
    width: 420px;
    background-color: rgba(15, 23, 42, 0.4); /* Dark glass */
    background-image: 
        linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 24px;
    padding: 3rem 2.5rem;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.4), inset 0 0 32px rgba(255, 255, 255, 0.02);
}

.form-title[b-pvgquex1y4] {
    color: #ffffff;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 2.5rem;
    text-align: center;
    letter-spacing: -0.02em;
}

/* ── Floating Inputs ────────────────────────────────────────────── */
.floating-group[b-pvgquex1y4] {
    position: relative;
    margin-bottom: 1.5rem;
}

[b-pvgquex1y4] .floating-input {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    padding: 1.25rem 1rem 0.5rem;
    font-size: 1rem;
    color: #ffffff;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

[b-pvgquex1y4] .floating-input:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.1);
    border-color: #14b8a6;
    box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.2);
}

.floating-label[b-pvgquex1y4] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.6);
    pointer-events: none;
    transition: all 0.25s ease;
}

[b-pvgquex1y4] .floating-input:focus ~ .floating-label,
[b-pvgquex1y4] .floating-input:not(:placeholder-shown) ~ .floating-label {
    top: 0.5rem;
    transform: translateY(0);
    font-size: 0.75rem;
    color: #14b8a6;
    font-weight: 600;
}

/* ── Premium Button ─────────────────────────────────────────────── */
[b-pvgquex1y4] .btn-premium {
    width: 100%;
    background: linear-gradient(135deg, #0d9488, #0f766e);
    color: white;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 24px rgba(13, 148, 136, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    margin-top: 1.5rem;
}

[b-pvgquex1y4] .btn-premium:hover {
    background: linear-gradient(135deg, #14b8a6, #0d9488);
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(13, 148, 136, 0.5);
}

[b-pvgquex1y4] .btn-premium:active {
    transform: translateY(1px);
    box-shadow: 0 4px 12px rgba(13, 148, 136, 0.3);
}

/* ── Alert ──────────────────────────────────────────────────────── */
.alert-premium[b-pvgquex1y4] {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #fca5a5;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    backdrop-filter: blur(10px);
}
.alert-premium i[b-pvgquex1y4] { font-size: 1.2rem; }

/* ── Loading Overlay (Updated to match dark/neon theme) ─────────── */
.login-overlay[b-pvgquex1y4] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(2, 6, 23, 0.85); /* Deep slate */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    animation: login-overlay-in-b-pvgquex1y4 0.3s ease-out both;
    user-select: none;
}
@keyframes login-overlay-in-b-pvgquex1y4 { from { opacity: 0; } to { opacity: 1; } }

.login-stage[b-pvgquex1y4] {
    position: relative;
    width: 200px;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-glow[b-pvgquex1y4] {
    position: absolute;
    inset: -80px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(20, 184, 166, 0.4) 0%, rgba(14, 165, 233, 0.2) 45%, transparent 70%);
    pointer-events: none;
    animation: login-glow-breathe-b-pvgquex1y4 3.2s ease-in-out infinite;
}
@keyframes login-glow-breathe-b-pvgquex1y4 {
    0%, 100% { opacity: 0.55; transform: scale(0.93); }
    50% { opacity: 1; transform: scale(1.07); }
}

.login-ring[b-pvgquex1y4] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    animation: login-pulse-out-b-pvgquex1y4 3.6s ease-out infinite;
}
.login-ring--1[b-pvgquex1y4] { width: 116px; height: 116px; border: 1.5px solid rgba(20, 184, 166, 0.9); animation-delay: 0s; }
.login-ring--2[b-pvgquex1y4] { width: 148px; height: 148px; border: 1px solid rgba(14, 165, 233, 0.6); animation-delay: 1.1s; }
.login-ring--3[b-pvgquex1y4] { width: 178px; height: 178px; border: 1px solid rgba(99, 102, 241, 0.4); animation-delay: 2.2s; }

@keyframes login-pulse-out-b-pvgquex1y4 {
    0% { transform: scale(0.65); opacity: 1; }
    100% { transform: scale(1.85); opacity: 0; }
}

.login-arc[b-pvgquex1y4] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    border: 2px solid transparent;
}
.login-arc--outer[b-pvgquex1y4] {
    width: 112px; height: 112px;
    border-top-color: #14b8a6;
    border-right-color: rgba(20, 184, 166, 0.4);
    animation: login-spin-b-pvgquex1y4 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    box-shadow: 0 0 16px rgba(20, 184, 166, 0.5);
}
.login-arc--inner[b-pvgquex1y4] {
    width: 94px; height: 94px;
    border-bottom-color: rgba(56, 189, 248, 0.9);
    border-left-color: rgba(56, 189, 248, 0.3);
    animation: login-spin-b-pvgquex1y4 2.2s cubic-bezier(0.4, 0, 0.6, 1) infinite reverse;
}
@keyframes login-spin-b-pvgquex1y4 { to { transform: rotate(360deg); } }

.login-core[b-pvgquex1y4] {
    position: relative;
    z-index: 2;
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(20, 184, 166, 0.5);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2), 0 0 30px rgba(20, 184, 166, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
}
.login-wordmark[b-pvgquex1y4] {
    font-size: 13px; font-weight: 800; color: #ffffff;
}
.login-anim-label[b-pvgquex1y4] {
    margin-top: 2.8rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #14b8a6;
    animation: login-label-breathe-b-pvgquex1y4 2.4s ease-in-out infinite;
}
@keyframes login-label-breathe-b-pvgquex1y4 { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .login-glass-container[b-pvgquex1y4] {
        flex-direction: column;
        gap: 3rem;
        padding: 2rem;
    }
    .brand-showcase[b-pvgquex1y4] { text-align: center; }
    .brand-title[b-pvgquex1y4] { font-size: 3.5rem; }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Dashboard wrapper ────────────────────────── */

.dashboard-wrapper[b-qtsnvtthk6] {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 1.5rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 3.5rem;
}

    /* Subtle tech-inspired dot grid background */
    .dashboard-wrapper[b-qtsnvtthk6]::before {
        content: '';
        position: absolute;
        top: -5rem;
        left: -10rem;
        right: -10rem;
        bottom: -5rem;
        pointer-events: none;
        z-index: -1;
        background-image: radial-gradient(rgba(0, 154, 69, 0.12) 1.5px, transparent 1.5px);
        background-size: 32px 32px;
        mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
        -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
    }

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

.dashboard-hero[b-qtsnvtthk6] {
    text-align: center;
    margin-top: 1rem;
}

.hero-gem[b-qtsnvtthk6] {
    font-size: 2.25rem;
    background: linear-gradient(135deg, #009A45, #4CAF50);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: block;
    margin-bottom: 0.75rem;
    line-height: 1;
}

.hero-title[b-qtsnvtthk6] {
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 800;
    color: #1e1b4b;
    margin: 0 0 0.75rem;
    line-height: 1.15;
    letter-spacing: -0.01em;
}

.hero-accent[b-qtsnvtthk6] {
    background: linear-gradient(135deg, #009A45 0%, #4CAF50 60%, #10b981 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-sub[b-qtsnvtthk6] {
    font-size: 1.05rem;
    color: #64748b;
    margin: 0;
    font-weight: 500;
}

/* ── Tools grid ───────────────────────────────── */

.tools-container[b-qtsnvtthk6] {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.tool-category[b-qtsnvtthk6] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.category-title[b-qtsnvtthk6] {
    font-size: 1.2rem;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
    padding-bottom: 0.5rem;
    border-bottom: 3px solid rgba(0, 154, 69, 0.15);
    display: inline-block;
    align-self: flex-start;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tools-grid[b-qtsnvtthk6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.25rem;
}

/* ── Tool card ────────────────────────────────── */

.tool-invoice[b-qtsnvtthk6] {
    --card-primary: #10b981; /* Emerald */
    --card-rgb: 16, 185, 129;
}

.tool-avaliador[b-qtsnvtthk6] {
    --card-primary: #3b82f6; /* Blue */
    --card-rgb: 59, 130, 246;
}

.tool-avaliador-voice[b-qtsnvtthk6] {
    --card-primary: #3b82f6; /* Blue */
    --card-rgb: 59, 130, 246;
}

.tool-diagnose[b-qtsnvtthk6] {
    --card-primary: #ec4899; /* Pink */
    --card-rgb: 236, 72, 153;
}

.tool-diagnose-voice[b-qtsnvtthk6] {
    --card-primary: #ec4899; /* Pink */
    --card-rgb: 236, 72, 153;
}

.tool-card[b-qtsnvtthk6] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.5rem 1.25rem;
    background: linear-gradient(160deg, #ffffff 0%, rgba(255, 255, 255, 0.8) 100%);
    border: 1px solid rgba(var(--card-rgb), 0.25);
    border-top: 4px solid var(--card-primary);
    border-radius: 12px;
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease, border-color 0.3s ease;
    text-decoration: none;
}

    /* Soft glowing wave in background */
    .tool-card[b-qtsnvtthk6]::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: radial-gradient(circle at top right, rgba(var(--card-rgb), 0.1) 0%, transparent 60%);
        pointer-events: none;
    }

    .tool-card:hover[b-qtsnvtthk6] {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(var(--card-rgb), 0.15);
        border-color: rgba(var(--card-rgb), 0.6);
    }

/* ── Tool header row ──────────────────────────── */

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

.tool-icon[b-qtsnvtthk6] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.35rem;
    line-height: 1;
    background: rgba(var(--card-rgb), 0.15);
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px rgba(var(--card-rgb), 0.3);
}

.tool-badge[b-qtsnvtthk6] {
    display: inline-block;
    padding: 0.25rem 0.6rem;
    border-radius: 20px;
    font-size: 0.65rem;
    font-weight: 750;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background: rgba(var(--card-rgb), 0.12);
    color: var(--card-primary);
    border: 1px solid rgba(var(--card-rgb), 0.25);
}

/* ── Tool name & description ──────────────────── */

.tool-name[b-qtsnvtthk6] {
    font-size: 1.15rem;
    font-weight: 800;
    color: #1e1b4b;
    margin: 0;
    line-height: 1.25;
}

/* ── Tool action link ─────────────────────────── */

.tool-footer[b-qtsnvtthk6] {
    margin-top: auto;
    padding-top: 0.5rem;
}

.action-text[b-qtsnvtthk6] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--card-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.btn-arrow[b-qtsnvtthk6] {
    display: inline-block;
    transition: transform 0.2s ease;
}

.tool-card:hover .btn-arrow[b-qtsnvtthk6] {
    transform: translateX(4px);
}

.tool-guide-link[b-qtsnvtthk6] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #009A45;
    text-decoration: none;
    padding: 0.35rem 0;
    border-bottom: 1px dashed rgba(0, 154, 69, 0.3);
    transition: color 0.15s ease, border-color 0.15s ease;
}

    .tool-guide-link:hover[b-qtsnvtthk6] {
        color: #009A45;
        border-bottom-color: rgba(79, 70, 229, 0.6);
    }

/* ===== Header — mirrors .chat-header from Avaliador ===== */

.chat-header[b-qtsnvtthk6] {
    text-align: center;
    margin-bottom: 0;
}

    .chat-header h1[b-qtsnvtthk6] {
        font-weight: 700;
        font-size: 1.75rem;
        background: linear-gradient(135deg, #009A45, #4CAF50);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .chat-header p[b-qtsnvtthk6] {
        color: #6c757d;
        font-size: 0.9rem;
    }

/* ===== Upload Card — mirrors .chat-card from Avaliador ===== */

.upload-card[b-qtsnvtthk6] {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 1.75rem;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 154, 69, 0.12), 0 1px 4px rgba(0, 0, 0, 0.04);
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

/* ===== Upload Zone ===== */

.upload-zone[b-qtsnvtthk6] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 2.5rem 1.25rem;
    border-radius: 0.75rem;
    border: 2px dashed rgba(0, 154, 69, 0.25);
    background: rgba(0, 154, 69, 0.03);
    cursor: pointer;
    text-align: center;
    min-height: 9rem;
    transition: border-color 0.2s ease, background 0.2s ease;
    overflow: hidden;
}

    .upload-zone:hover[b-qtsnvtthk6] {
        border-color: rgba(0, 154, 69, 0.5);
        background: rgba(0, 154, 69, 0.07);
    }

    .upload-zone.has-file[b-qtsnvtthk6] {
        border-style: solid;
        border-color: rgba(0, 154, 69, 0.4);
        background: rgba(0, 154, 69, 0.05);
    }

/* The <InputFile> is stretched invisibly over the whole zone */
.upload-input[b-qtsnvtthk6] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.upload-icon[b-qtsnvtthk6] {
    font-size: 2.5rem;
    line-height: 1;
    margin-bottom: 0.2rem;
    pointer-events: none;
}

.upload-prompt[b-qtsnvtthk6] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #4338ca;
    margin: 0;
    pointer-events: none;
}

.upload-hint[b-qtsnvtthk6] {
    font-size: 0.8rem;
    color: #94a3b8;
    margin: 0;
    pointer-events: none;
}

.upload-filename[b-qtsnvtthk6] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e1b4b;
    margin: 0;
    word-break: break-all;
    pointer-events: none;
}

.upload-meta[b-qtsnvtthk6] {
    font-size: 0.8rem;
    color: #009A45;
    margin: 0;
    pointer-events: none;
}

/* ===== Actions row ===== */

.upload-actions[b-qtsnvtthk6] {
    display: flex;
    justify-content: center;
}

/* ===== Error strip ===== */

.error-strip[b-qtsnvtthk6] {
    border-top: 1px solid rgba(220, 53, 69, 0.15);
    padding-top: 0.5rem;
    animation: slideUp-b-qtsnvtthk6 0.3s ease-out both;
}

/* ===== Results Card — mirrors .chat-card from Avaliador ===== */

.results-card[b-qtsnvtthk6] {
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 154, 69, 0.12), 0 1px 4px rgba(0, 0, 0, 0.04);
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

.results-header[b-qtsnvtthk6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.9rem 1.25rem;
    background: linear-gradient(135deg, rgba(0, 154, 69, 0.1), rgba(79, 70, 229, 0.07));
    border-bottom: 1px solid rgba(0, 154, 69, 0.12);
}

.results-title[b-qtsnvtthk6] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e1b4b;
}

.cost-badge[b-qtsnvtthk6] {
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    background: rgba(0, 154, 69, 0.1);
    color: #4338ca;
    border: 1px solid rgba(0, 154, 69, 0.2);
}

/* ===== Results Table ===== */

.results-table-wrapper[b-qtsnvtthk6] {
    overflow-x: auto;
    max-height: 420px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 154, 69, 0.3) transparent;
}

    .results-table-wrapper[b-qtsnvtthk6]::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    .results-table-wrapper[b-qtsnvtthk6]::-webkit-scrollbar-track {
        background: transparent;
    }

    .results-table-wrapper[b-qtsnvtthk6]::-webkit-scrollbar-thumb {
        background: rgba(0, 154, 69, 0.3);
        border-radius: 3px;
    }

.results-table[b-qtsnvtthk6] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

    .results-table thead th[b-qtsnvtthk6] {
        position: sticky;
        top: 0;
        z-index: 1;
        padding: 0.65rem 1.25rem;
        font-size: 0.75rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #009A45;
        background: rgba(249, 250, 255, 0.97);
        border-bottom: 1px solid rgba(0, 154, 69, 0.1);
    }

    .results-table tbody tr[b-qtsnvtthk6] {
        border-bottom: 1px solid rgba(76, 175, 80, 0.12);
        transition: background 0.15s ease;
    }

        .results-table tbody tr:last-child[b-qtsnvtthk6] {
            border-bottom: none;
        }

        .results-table tbody tr:hover[b-qtsnvtthk6] {
            background: rgba(0, 154, 69, 0.04);
        }

        .results-table tbody tr.row-meta[b-qtsnvtthk6] {
            background: rgba(0, 154, 69, 0.05);
        }

.field-name[b-qtsnvtthk6] {
    padding: 0.65rem 1.25rem;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
    width: 40%;
}

.field-value[b-qtsnvtthk6] {
    padding: 0.65rem 1.25rem;
    color: #1e293b;
    word-break: break-word;
}

.value-badge[b-qtsnvtthk6] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    margin: 0.1rem;
    border-radius: 0.375rem;
    background: rgba(0, 154, 69, 0.1);
    color: #4338ca;
    font-size: 0.8rem;
    border: 1px solid rgba(0, 154, 69, 0.15);
}

/* ===== Animations ===== */

@keyframes slideUp-b-qtsnvtthk6 {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Pages/InvoiceReader/InvoiceReader.razor.rz.scp.css */
/* ===== Page Layout ===== */

.page-wrapper[b-93xxp1vi12] {
    max-width: 720px;
    margin: 0 auto;
    padding: 1.5rem 0 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ===== Header ===== */

.chat-header[b-93xxp1vi12] {
    text-align: center;
    margin-bottom: 0;
}

    .chat-header h1[b-93xxp1vi12] {
        font-weight: 700;
        font-size: 1.75rem;
        background: linear-gradient(135deg, #009A45, #4CAF50);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .chat-header p[b-93xxp1vi12] {
        color: #6c757d;
        font-size: 0.9rem;
    }

/* ===== Upload Card ===== */

.upload-card[b-93xxp1vi12] {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 1.75rem;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 154, 69, 0.12), 0 1px 4px rgba(0, 0, 0, 0.04);
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

/* ===== Upload Zone ===== */

.upload-zone[b-93xxp1vi12] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 2.5rem 1.25rem;
    border-radius: 0.75rem;
    border: 2px dashed rgba(0, 154, 69, 0.25);
    background: rgba(0, 154, 69, 0.03);
    cursor: pointer;
    text-align: center;
    min-height: 9rem;
    transition: border-color 0.2s ease, background 0.2s ease;
    overflow: hidden;
}

    .upload-zone:hover[b-93xxp1vi12] {
        border-color: rgba(0, 154, 69, 0.5);
        background: rgba(0, 154, 69, 0.07);
    }

    .upload-zone.has-file[b-93xxp1vi12] {
        border-style: solid;
        border-color: rgba(0, 154, 69, 0.4);
        background: rgba(0, 154, 69, 0.05);
    }

.upload-input[b-93xxp1vi12] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.upload-icon[b-93xxp1vi12] {
    font-size: 2.5rem;
    line-height: 1;
    margin-bottom: 0.2rem;
    pointer-events: none;
}

.upload-prompt[b-93xxp1vi12] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #4338ca;
    margin: 0;
    pointer-events: none;
}

.upload-hint[b-93xxp1vi12] {
    font-size: 0.8rem;
    color: #94a3b8;
    margin: 0;
    pointer-events: none;
}

.upload-filename[b-93xxp1vi12] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e1b4b;
    margin: 0;
    word-break: break-all;
    pointer-events: none;
}

.upload-meta[b-93xxp1vi12] {
    font-size: 0.8rem;
    color: #009A45;
    margin: 0;
    pointer-events: none;
}

/* ===== Actions row ===== */

.upload-actions[b-93xxp1vi12] {
    display: flex;
    justify-content: center;
}

/* ===== Error strip ===== */

.error-strip[b-93xxp1vi12] {
    border-top: 1px solid rgba(220, 53, 69, 0.15);
    padding-top: 0.5rem;
    animation: slideUp-b-93xxp1vi12 0.3s ease-out both;
}

/* ===== Results Card ===== */

.results-card[b-93xxp1vi12] {
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 154, 69, 0.12), 0 1px 4px rgba(0, 0, 0, 0.04);
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

.results-header[b-93xxp1vi12] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.9rem 1.25rem;
    background: linear-gradient(135deg, rgba(0, 154, 69, 0.1), rgba(79, 70, 229, 0.07));
    border-bottom: 1px solid rgba(0, 154, 69, 0.12);
}

.results-title[b-93xxp1vi12] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e1b4b;
}

.cost-badge[b-93xxp1vi12] {
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    background: rgba(0, 154, 69, 0.1);
    color: #4338ca;
    border: 1px solid rgba(0, 154, 69, 0.2);
}

/* ===== Results Table ===== */

.results-table-wrapper[b-93xxp1vi12] {
    overflow-x: auto;
    max-height: 420px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 154, 69, 0.3) transparent;
}

    .results-table-wrapper[b-93xxp1vi12]::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    .results-table-wrapper[b-93xxp1vi12]::-webkit-scrollbar-track {
        background: transparent;
    }

    .results-table-wrapper[b-93xxp1vi12]::-webkit-scrollbar-thumb {
        background: rgba(0, 154, 69, 0.3);
        border-radius: 3px;
    }

.results-table[b-93xxp1vi12] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

    .results-table thead th[b-93xxp1vi12] {
        position: sticky;
        top: 0;
        z-index: 1;
        padding: 0.65rem 1.25rem;
        font-size: 0.75rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #009A45;
        background: rgba(249, 250, 255, 0.97);
        border-bottom: 1px solid rgba(0, 154, 69, 0.1);
    }

    .results-table tbody tr[b-93xxp1vi12] {
        border-bottom: 1px solid rgba(76, 175, 80, 0.12);
        transition: background 0.15s ease;
    }

        .results-table tbody tr:last-child[b-93xxp1vi12] {
            border-bottom: none;
        }

        .results-table tbody tr:hover[b-93xxp1vi12] {
            background: rgba(0, 154, 69, 0.04);
        }

        .results-table tbody tr.row-meta[b-93xxp1vi12] {
            background: rgba(0, 154, 69, 0.05);
        }

.field-name[b-93xxp1vi12] {
    padding: 0.65rem 1.25rem;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
    width: 40%;
}

.field-value[b-93xxp1vi12] {
    padding: 0.65rem 1.25rem;
    color: #1e293b;
    word-break: break-word;
}

.value-badge[b-93xxp1vi12] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    margin: 0.1rem;
    border-radius: 0.375rem;
    background: rgba(0, 154, 69, 0.1);
    color: #4338ca;
    font-size: 0.8rem;
    border: 1px solid rgba(0, 154, 69, 0.15);
}

/* ===== Animations ===== */

@keyframes slideUp-b-93xxp1vi12 {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Pages/InvoiceReader/InvoiceReaderGuide.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Invoice Reader Guide page — glassmorphism info layout
   ═══════════════════════════════════════════════ */

.guide-wrapper[b-69cudrzs2t] {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1.5rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

/* ── Section shell ────────────────────────────── */

.guide-section[b-69cudrzs2t] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section-title[b-69cudrzs2t] {
    font-size: 1.5rem;
    font-weight: 750;
    color: #1e1b4b;
    margin: 0;
}

.section-subtitle[b-69cudrzs2t] {
    font-size: 0.95rem;
    color: #64748b;
    margin: -0.75rem 0 0;
}

/* ── Steps grid ───────────────────────────────── */

.steps-grid[b-69cudrzs2t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}

.step-card[b-69cudrzs2t] {
    position: relative;
    padding: 1.5rem;
    background: rgba(255,255,255,0.6);
    border: 1px solid rgba(129, 230, 217,0.25);
    border-radius: 1.1rem;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 16px rgba(44, 122, 123,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .step-card:hover[b-69cudrzs2t] {
        transform: translateY(-3px);
        box-shadow: 0 8px 28px rgba(44, 122, 123,0.12);
    }

.step-number[b-69cudrzs2t] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #2c7a7b, #81e6d9);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-icon[b-69cudrzs2t] {
    font-size: 2rem;
    margin-bottom: 0.75rem;
    line-height: 1;
}

.step-card h3[b-69cudrzs2t] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e1b4b;
    margin: 0 0 0.5rem;
}

.step-card p[b-69cudrzs2t] {
    font-size: 0.875rem;
    color: #475569;
    margin: 0;
    line-height: 1.6;
}

/* ── Features grid ────────────────────────────── */

.features-grid[b-69cudrzs2t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}

.feature-card[b-69cudrzs2t] {
    padding: 1.4rem 1.5rem;
    border-radius: 1.1rem;
    border: 1px solid transparent;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: transform 0.2s ease;
}

    .feature-card:hover[b-69cudrzs2t] {
        transform: translateY(-2px);
    }

    .feature-card h4[b-69cudrzs2t] {
        font-size: 0.9rem;
        font-weight: 700;
        margin: 0.5rem 0 0.4rem;
    }

    .feature-card p[b-69cudrzs2t] {
        font-size: 0.855rem;
        margin: 0;
        line-height: 1.6;
    }

.feature-icon[b-69cudrzs2t] {
    font-size: 1.6rem;
    line-height: 1;
}

.feature-purple[b-69cudrzs2t] {
    background: linear-gradient(135deg, rgba(129, 230, 217,0.1), rgba(44, 122, 123,0.08));
    border-color: rgba(129, 230, 217,0.2);
    color: #3730a3;
}

.feature-blue[b-69cudrzs2t] {
    background: linear-gradient(135deg, rgba(59,130,246,0.1), rgba(44, 122, 123,0.06));
    border-color: rgba(59,130,246,0.2);
    color: #1e3a8a;
}

.feature-teal[b-69cudrzs2t] {
    background: linear-gradient(135deg, rgba(20,184,166,0.1), rgba(16,185,129,0.06));
    border-color: rgba(20,184,166,0.2);
    color: #134e4a;
}

.feature-indigo[b-69cudrzs2t] {
    background: linear-gradient(135deg, rgba(44, 122, 123,0.12), rgba(79,70,229,0.08));
    border-color: rgba(44, 122, 123,0.25);
    color: #312e81;
}

.feature-rose[b-69cudrzs2t] {
    background: linear-gradient(135deg, rgba(244,63,94,0.08), rgba(251,113,133,0.06));
    border-color: rgba(244,63,94,0.18);
    color: #881337;
}

.feature-amber[b-69cudrzs2t] {
    background: linear-gradient(135deg, rgba(245,158,11,0.1), rgba(251,191,36,0.07));
    border-color: rgba(245,158,11,0.2);
    color: #78350f;
}

/* ── Tips list ────────────────────────────────── */

.tips-list[b-69cudrzs2t] {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(129, 230, 217,0.25);
    border-radius: 1.1rem;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    overflow: hidden;
}

.tip-item[b-69cudrzs2t] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.1rem 1.5rem;
    font-size: 0.9rem;
    color: #334155;
    line-height: 1.65;
    border-bottom: 1px solid rgba(129, 230, 217,0.14);
    transition: background 0.15s ease;
}

    .tip-item:last-child[b-69cudrzs2t] {
        border-bottom: none;
    }

    .tip-item:hover[b-69cudrzs2t] {
        background: rgba(44, 122, 123,0.04);
    }

.tip-dot[b-69cudrzs2t] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2c7a7b, #bee3f8);
    margin-top: 0.45rem;
    box-shadow: 0 0 6px rgba(44, 122, 123,0.4);
}

/* ── Fields explainer ─────────────────────────── */

.progress-explainer[b-69cudrzs2t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
    gap: 1rem;
}

.pe-item[b-69cudrzs2t] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.1rem;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(129, 230, 217,0.2);
    border-radius: 0.875rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

    .pe-item p[b-69cudrzs2t] {
        font-size: 0.8rem;
        color: #475569;
        margin: 0;
        line-height: 1.55;
    }

.pe-badge[b-69cudrzs2t] {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    width: fit-content;
}

.pe-act[b-69cudrzs2t] {
    background: rgba(44, 122, 123,0.12);
    color: #4338ca;
    border: 1px solid rgba(44, 122, 123,0.25);
}

.pe-ins[b-69cudrzs2t] {
    background: rgba(20,184,166,0.12);
    color: #0f766e;
    border: 1px solid rgba(20,184,166,0.25);
}

.pe-hc[b-69cudrzs2t] {
    background: rgba(59,130,246,0.12);
    color: #1d4ed8;
    border: 1px solid rgba(59,130,246,0.25);
}

.pe-dt[b-69cudrzs2t] {
    background: rgba(245,158,11,0.12);
    color: #b45309;
    border: 1px solid rgba(245,158,11,0.25);
}

.pe-pr[b-69cudrzs2t] {
    background: rgba(129, 230, 217,0.12);
    color: #6d28d9;
    border: 1px solid rgba(129, 230, 217,0.25);
}
/* /Components/Pages/LocalHub/LocalHub.razor.rz.scp.css */
/* ── Page ─────────────────────────────────── */
.ac-page[b-dkcqsbc693] {
    display: flex;
    justify-content: center;
    padding: 3rem 1.5rem;
    min-height: 100%;
}

.ac-card[b-dkcqsbc693] {
    width: 100%;
    max-width: 680px;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* ── Header ───────────────────────────────── */
.ac-header[b-dkcqsbc693] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.ac-header-icon[b-dkcqsbc693] {
    font-size: 1.75rem;
    line-height: 1;
    color: var(--accent, #6366f1);
}

.ac-title[b-dkcqsbc693] {
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0;
    color: var(--text-primary, #1e1e2e);
}

.ac-subtitle[b-dkcqsbc693] {
    margin: .25rem 0 0;
    font-size: .85rem;
    color: var(--text-secondary, #6b7280);
}

/* ── Search Input ─────────────────────────── */
.ac-search-wrapper[b-dkcqsbc693] {
    position: relative;
}

.ac-input-group[b-dkcqsbc693] {
    position: relative;
    display: flex;
    align-items: center;
}

.ac-input-icon[b-dkcqsbc693] {
    position: absolute;
    left: 1rem;
    font-size: .95rem;
    color: var(--text-secondary, #9ca3af);
    pointer-events: none;
}

.ac-input[b-dkcqsbc693] {
    width: 100%;
    padding: .85rem 2.75rem .85rem 2.75rem;
    font-size: .95rem;
    border: 1.5px solid var(--border, #e5e7eb);
    border-radius: 12px;
    background: var(--surface, #fff);
    color: var(--text-primary, #1e1e2e);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}

    .ac-input:focus[b-dkcqsbc693] {
        border-color: var(--accent, #6366f1);
        box-shadow: 0 0 0 3px rgba(99, 102, 241, .12);
    }

.ac-spinner[b-dkcqsbc693] {
    position: absolute;
    right: 1rem;
    width: 18px;
    height: 18px;
    border: 2px solid var(--border, #e5e7eb);
    border-top-color: var(--accent, #6366f1);
    border-radius: 50%;
    animation: ac-spin-b-dkcqsbc693 .6s linear infinite;
}

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

/* ── Dropdown ─────────────────────────────── */
.ac-dropdown[b-dkcqsbc693] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: var(--surface, #fff);
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
    max-height: 320px;
    overflow-y: auto;
    z-index: 50;
    padding: .35rem;
}

.ac-option[b-dkcqsbc693] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: .7rem .85rem;
    border: none;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
    text-align: left;
    gap: .75rem;
    transition: background .1s;
    color: var(--text-primary, #1e1e2e);
}

    .ac-option:hover[b-dkcqsbc693],
    .ac-option--highlighted[b-dkcqsbc693] {
        background: var(--hover, #f3f4f6);
    }

.ac-option-content[b-dkcqsbc693] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.ac-option-name[b-dkcqsbc693] {
    font-size: .9rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ac-option-specialty[b-dkcqsbc693] {
    font-size: .75rem;
    color: var(--text-secondary, #6b7280);
}

.ac-option-ai[b-dkcqsbc693] {
    flex-shrink: 0;
    font-size: .7rem;
    font-weight: 600;
    color: var(--accent, #6366f1);
    background: rgba(99, 102, 241, .08);
    padding: .2rem .55rem;
    border-radius: 6px;
    white-space: nowrap;
}

.ac-dropdown-hint[b-dkcqsbc693] {
    padding: .5rem .85rem;
    font-size: .75rem;
    color: var(--accent, #6366f1);
    text-align: center;
}

/* ── Selected Result ──────────────────────── */
.ac-selected[b-dkcqsbc693] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.ac-selected-label[b-dkcqsbc693] {
    font-size: .8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--text-secondary, #6b7280);
    margin: 0;
}

.ac-selected-card[b-dkcqsbc693] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--surface-elevated, #f9fafb);
    border: 1.5px solid var(--accent, #6366f1);
    border-radius: 12px;
}

.ac-selected-info[b-dkcqsbc693] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    flex: 1;
    min-width: 0;
}

.ac-selected-name[b-dkcqsbc693] {
    font-size: .95rem;
    font-weight: 600;
    color: var(--text-primary, #1e1e2e);
}

.ac-selected-specialty[b-dkcqsbc693] {
    font-size: .8rem;
    color: var(--text-secondary, #6b7280);
}

.ac-selected-id[b-dkcqsbc693] {
    font-size: .7rem;
    font-family: monospace;
    color: var(--text-secondary, #9ca3af);
    flex-shrink: 0;
}
/* /Components/Pages/Login.razor.rz.scp.css */
/* ── Viewport & Culture ─────────────────────────────────────────── */
.login-viewport[b-9dktuhmges] {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #020617; /* Deep slate baseline */
    background-image: radial-gradient(rgba(255, 255, 255, 0.04) 1.5px, transparent 1.5px);
    background-size: 30px 30px;
    animation: darkPatternDrift-b-9dktuhmges 60s linear infinite;
}

@keyframes darkPatternDrift-b-9dktuhmges {
    0% { background-position: 0px 0px; }
    100% { background-position: 300px 300px; }
}

.culture-wrapper[b-9dktuhmges] {
    position: absolute;
    top: 1.5rem;
    right: 2rem;
    z-index: 100;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 0.25rem 0.5rem;
    transition: all 0.2s;
}

.culture-wrapper:hover[b-9dktuhmges] {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(20, 184, 166, 0.5);
}

.culture-wrapper[b-9dktuhmges]  select {
    background: transparent;
    color: white;
    border: none;
    font-weight: 500;
    cursor: pointer;
    outline: none;
}
.culture-wrapper[b-9dktuhmges]  select option {
    background: #1e293b;
    color: white;
}

/* ── Vibrant Animated Background ────────────────────────────────── */
.animated-bg[b-9dktuhmges] {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    filter: blur(80px);
}

.blob[b-9dktuhmges] {
    position: absolute;
    border-radius: 50%;
    opacity: 0.8;
    mix-blend-mode: screen;
    animation: drift-b-9dktuhmges 20s infinite alternate ease-in-out;
}

.blob-1[b-9dktuhmges] {
    top: -10%; left: -10%;
    width: 50vw; height: 50vw;
    background: #0ea5e9; /* Neon Sky Blue */
    animation-delay: 0s;
}

.blob-2[b-9dktuhmges] {
    bottom: -20%; right: -10%;
    width: 60vw; height: 60vw;
    background: #14b8a6; /* Vibrant Teal */
    animation-delay: -5s;
    animation-direction: alternate-reverse;
}

.blob-3[b-9dktuhmges] {
    top: 40%; left: 60%;
    width: 40vw; height: 40vw;
    background: #3b82f6; /* Bright Blue */
    animation-delay: -10s;
}

.blob-4[b-9dktuhmges] {
    top: 20%; right: 40%;
    width: 30vw; height: 30vw;
    background: #0284c7; /* Deep Ocean */
    animation-delay: -15s;
    animation-direction: alternate-reverse;
}

@keyframes drift-b-9dktuhmges {
    0% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(10vw, 5vh) scale(1.1); }
    100% { transform: translate(-5vw, 15vh) scale(0.9); }
}

/* ── Container Layout ───────────────────────────────────────────── */
.login-glass-container[b-9dktuhmges] {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5rem;
    padding: 3rem;
    width: 100%;
    max-width: 1000px;
}

/* ── Left Side: Brand Showcase ──────────────────────────────────── */
.brand-showcase[b-9dktuhmges] {
    flex: 1;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    animation: brandIn-b-9dktuhmges 0.8s ease 0.05s both;
}

@keyframes brandIn-b-9dktuhmges {
    from { opacity: 0; transform: translateX(-28px); }
    to { opacity: 1; transform: translateX(0); }
}

.brand-title[b-9dktuhmges] {
    font-size: 4.5rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    margin: 0 0 0.5rem 0;
    line-height: 1.1;
}

/* ── Right Side: Premium Glass Card ─────────────────────────────── */
.login-card-premium[b-9dktuhmges] {
    position: relative;
    width: 420px;
    background-color: rgba(15, 23, 42, 0.4); /* Dark glass */
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 24px;
    padding: 3rem 2.5rem;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.4), inset 0 0 32px rgba(255, 255, 255, 0.02);
    animation: cardIn-b-9dktuhmges 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
}

    /* Travelling aqua sheen along the card border (gradient-border mask trick) */
    .login-card-premium[b-9dktuhmges]::before {
        content: '';
        position: absolute;
        inset: -1px;
        border-radius: 25px;
        padding: 1px;
        background: linear-gradient(120deg, transparent 30%, rgba(129, 230, 217, 0.8) 45%, rgba(56, 189, 248, 0.8) 55%, transparent 70%);
        background-size: 300% 300%;
        animation: borderSheen-b-9dktuhmges 7s ease-in-out infinite;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: exclude;
        pointer-events: none;
    }

@keyframes cardIn-b-9dktuhmges {
    from { opacity: 0; transform: translateY(26px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes borderSheen-b-9dktuhmges {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.form-title[b-9dktuhmges] {
    position: relative;
    color: #ffffff;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 2rem;
    padding-bottom: 0.9rem;
    text-align: center;
    letter-spacing: -0.02em;
}

    /* Same glowing accent pill as the NavMenu's active item */
    .form-title[b-9dktuhmges]::after {
        content: '';
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        width: 44px;
        height: 4px;
        border-radius: 4px;
        background: linear-gradient(90deg, #bee3f8, #81e6d9);
        box-shadow: 0 0 12px rgba(129, 230, 217, 0.8);
    }

/* ── Floating Inputs ────────────────────────────────────────────── */
.floating-group[b-9dktuhmges] {
    position: relative;
    margin-bottom: 1.5rem;
}

[b-9dktuhmges] .floating-input {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    padding: 1.25rem 1rem 0.5rem;
    font-size: 1rem;
    color: #ffffff;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

[b-9dktuhmges] .floating-input {
    caret-color: #81e6d9;
}

[b-9dktuhmges] .floating-input:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.1);
    border-color: #14b8a6;
    box-shadow: 0 0 0 4px rgba(129, 230, 217, 0.18);
}

/* Browser autofill paints inputs yellow/white — keep them on-theme */
[b-9dktuhmges] .floating-input:-webkit-autofill,
[b-9dktuhmges] .floating-input:-webkit-autofill:hover,
[b-9dktuhmges] .floating-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #0d1f2d inset;
    -webkit-text-fill-color: #ffffff;
    caret-color: #ffffff;
    border-color: rgba(129, 230, 217, 0.4);
    transition: background-color 600000s 0s;
}

.floating-label[b-9dktuhmges] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.6);
    pointer-events: none;
    transition: all 0.25s ease;
}

[b-9dktuhmges] .floating-input:focus ~ .floating-label,
[b-9dktuhmges] .floating-input:not(:placeholder-shown) ~ .floating-label {
    top: 0.5rem;
    transform: translateY(0);
    font-size: 0.75rem;
    color: #14b8a6;
    font-weight: 600;
}

/* ── Premium Button ─────────────────────────────────────────────── */
[b-9dktuhmges] .btn-premium {
    position: relative;
    overflow: hidden;
    width: 100%;
    background: linear-gradient(135deg, #0d9488, #0f766e);
    color: white;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 24px rgba(13, 148, 136, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    margin-top: 1.5rem;
}

    /* Light sweep across the button on hover */
    [b-9dktuhmges] .btn-premium::after {
        content: '';
        position: absolute;
        top: 0;
        left: -150%;
        width: 60%;
        height: 100%;
        background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.35), transparent);
        transform: skewX(-20deg);
        pointer-events: none;
    }

[b-9dktuhmges] .btn-premium:hover {
    background: linear-gradient(135deg, #14b8a6, #0d9488);
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(13, 148, 136, 0.5);
}

    [b-9dktuhmges] .btn-premium:hover::after {
        left: 150%;
        transition: left 0.6s ease;
    }

[b-9dktuhmges] .btn-premium .bi {
    transition: transform 0.2s ease;
}

[b-9dktuhmges] .btn-premium:hover .bi {
    transform: translateX(4px);
}

[b-9dktuhmges] .btn-premium:active {
    transform: translateY(1px);
    box-shadow: 0 4px 12px rgba(13, 148, 136, 0.3);
}

/* ── Alert ──────────────────────────────────────────────────────── */
.alert-premium[b-9dktuhmges] {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #fca5a5;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    backdrop-filter: blur(10px);
    animation: alertShake-b-9dktuhmges 0.5s ease;
}

@keyframes alertShake-b-9dktuhmges {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-7px); }
    40% { transform: translateX(6px); }
    60% { transform: translateX(-4px); }
    80% { transform: translateX(2px); }
}
.alert-premium i[b-9dktuhmges] { font-size: 1.2rem; }

/* ── Loading Overlay (Updated to match dark/neon theme) ─────────── */
.login-overlay[b-9dktuhmges] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(2, 6, 23, 0.85); /* Deep slate */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    animation: login-overlay-in-b-9dktuhmges 0.3s ease-out both;
    user-select: none;
}
@keyframes login-overlay-in-b-9dktuhmges { from { opacity: 0; } to { opacity: 1; } }

.login-stage[b-9dktuhmges] {
    position: relative;
    width: 200px;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-glow[b-9dktuhmges] {
    position: absolute;
    inset: -80px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(20, 184, 166, 0.4) 0%, rgba(14, 165, 233, 0.2) 45%, transparent 70%);
    pointer-events: none;
    animation: login-glow-breathe-b-9dktuhmges 3.2s ease-in-out infinite;
}
@keyframes login-glow-breathe-b-9dktuhmges {
    0%, 100% { opacity: 0.55; transform: scale(0.93); }
    50% { opacity: 1; transform: scale(1.07); }
}

.login-ring[b-9dktuhmges] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    animation: login-pulse-out-b-9dktuhmges 3.6s ease-out infinite;
}
.login-ring--1[b-9dktuhmges] { width: 116px; height: 116px; border: 1.5px solid rgba(20, 184, 166, 0.9); animation-delay: 0s; }
.login-ring--2[b-9dktuhmges] { width: 148px; height: 148px; border: 1px solid rgba(14, 165, 233, 0.6); animation-delay: 1.1s; }
.login-ring--3[b-9dktuhmges] { width: 178px; height: 178px; border: 1px solid rgba(99, 102, 241, 0.4); animation-delay: 2.2s; }

@keyframes login-pulse-out-b-9dktuhmges {
    0% { transform: scale(0.65); opacity: 1; }
    100% { transform: scale(1.85); opacity: 0; }
}

.login-arc[b-9dktuhmges] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    border: 2px solid transparent;
}
.login-arc--outer[b-9dktuhmges] {
    width: 112px; height: 112px;
    border-top-color: #14b8a6;
    border-right-color: rgba(20, 184, 166, 0.4);
    animation: login-spin-b-9dktuhmges 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    box-shadow: 0 0 16px rgba(20, 184, 166, 0.5);
}
.login-arc--inner[b-9dktuhmges] {
    width: 94px; height: 94px;
    border-bottom-color: rgba(56, 189, 248, 0.9);
    border-left-color: rgba(56, 189, 248, 0.3);
    animation: login-spin-b-9dktuhmges 2.2s cubic-bezier(0.4, 0, 0.6, 1) infinite reverse;
}
@keyframes login-spin-b-9dktuhmges { to { transform: rotate(360deg); } }

.login-core[b-9dktuhmges] {
    position: relative;
    z-index: 2;
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(20, 184, 166, 0.5);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2), 0 0 30px rgba(20, 184, 166, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
}
.login-wordmark[b-9dktuhmges] {
    font-size: 13px; font-weight: 800; color: #ffffff;
}
.login-anim-label[b-9dktuhmges] {
    margin-top: 2.8rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #14b8a6;
    animation: login-label-breathe-b-9dktuhmges 2.4s ease-in-out infinite;
}
@keyframes login-label-breathe-b-9dktuhmges { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .login-glass-container[b-9dktuhmges] {
        flex-direction: column;
        gap: 3rem;
        padding: 2rem;
    }
    .brand-showcase[b-9dktuhmges] { text-align: center; }
    .brand-title[b-9dktuhmges] { font-size: 3.5rem; }
}
/* /Components/UI/AppButton.razor.rz.scp.css */
/* ===== Base ===== */

.app-btn[b-yi6vrytl9u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.4;
    white-space: nowrap;
    text-decoration: none;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

    .app-btn:disabled[b-yi6vrytl9u],
    .app-btn--loading[b-yi6vrytl9u] {
        cursor: not-allowed;
        pointer-events: none;
    }

/* ===== Sizes ===== */

.app-btn--sm[b-yi6vrytl9u] {
    font-size: 0.82rem;
    padding: 0.3rem 0.85rem;
}

.app-btn--md[b-yi6vrytl9u] {
    font-size: 0.9rem;
    padding: 0.45rem 1.1rem;
}

.app-btn--lg[b-yi6vrytl9u] {
    font-size: 1rem;
    padding: 0.6rem 1.5rem;
}

/* ===== Shapes ===== */

.app-btn--default[b-yi6vrytl9u] {
    border-radius: 0.625rem;
}

.app-btn--pill[b-yi6vrytl9u] {
    border-radius: 2rem;
}

.app-btn--circle[b-yi6vrytl9u] {
    border-radius: 50%;
    width: 2.4rem;
    height: 2.4rem;
    padding: 0;
    flex-shrink: 0;
}

/* ===== Variant: primary (indigo gradient) ===== */

.app-btn--primary[b-yi6vrytl9u] {
    background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
    color: #fff;
    border: none;
    box-shadow: 0 2px 10px rgba(44, 122, 123, 0.35);
}

    .app-btn--primary:hover:not(:disabled)[b-yi6vrytl9u] {
        transform: translateY(-1px);
        box-shadow: 0 6px 20px rgba(44, 122, 123, 0.5);
    }

    .app-btn--primary:active:not(:disabled)[b-yi6vrytl9u] {
        transform: scale(0.97);
    }

    .app-btn--primary:disabled[b-yi6vrytl9u] {
        background: #adb5bd;
        box-shadow: none;
        opacity: 0.5;
    }

/* ===== Variant: success (emerald gradient) ===== */

.app-btn--success[b-yi6vrytl9u] {
    background: linear-gradient(135deg, #2c7a7b, #81e6d9);
    color: #fff;
    border: none;
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.3);
}

    .app-btn--success:hover:not(:disabled)[b-yi6vrytl9u] {
        transform: translateY(-1px);
        box-shadow: 0 4px 14px rgba(5, 150, 105, 0.4);
        color: #fff;
    }

    .app-btn--success:active:not(:disabled)[b-yi6vrytl9u] {
        transform: scale(0.97);
    }

    .app-btn--success:disabled[b-yi6vrytl9u] {
        opacity: 0.65;
    }

/* ===== Variant: ghost (glass secondary) ===== */

.app-btn--ghost[b-yi6vrytl9u] {
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(180, 175, 170, 0.5);
    color: #6c757d;
}

    .app-btn--ghost:hover:not(:disabled)[b-yi6vrytl9u] {
        background: rgba(233, 229, 225, 0.75);
        border-color: rgba(120, 113, 108, 0.4);
    }

/* ===== Variant: outline-primary (indigo glass) ===== */

.app-btn--outline-primary[b-yi6vrytl9u] {
    background: rgba(44, 122, 123, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(44, 122, 123, 0.4);
    color: #2c7a7b;
    font-weight: 600;
}

    .app-btn--outline-primary:hover:not(:disabled)[b-yi6vrytl9u] {
        background: rgba(44, 122, 123, 0.18);
        border-color: #2c7a7b;
        color: #4338ca;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(44, 122, 123, 0.3);
    }

    .app-btn--outline-primary:disabled[b-yi6vrytl9u] {
        opacity: 0.35;
    }

/* ===== Variant: outline-success (emerald glass) ===== */

.app-btn--outline-success[b-yi6vrytl9u] {
    background: rgba(16, 185, 129, 0.1);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(16, 185, 129, 0.35);
    color: #2c7a7b;
    font-weight: 600;
}

    .app-btn--outline-success:hover:not(:disabled)[b-yi6vrytl9u] {
        background: rgba(16, 185, 129, 0.2);
        border-color: #81e6d9;
        color: #047857;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);
    }

/* ===== Variant: toggle (provider selector) ===== */

.app-btn--toggle[b-yi6vrytl9u] {
    background: transparent;
    border: none;
    color: rgba(79, 70, 229, 0.55);
}

    .app-btn--toggle.app-btn--sm[b-yi6vrytl9u] {
        padding: 0.3rem 1.1rem;
    }

    .app-btn--toggle:hover:not(.app-btn--active):not(:disabled)[b-yi6vrytl9u] {
        color: #2c7a7b;
        background: rgba(44, 122, 123, 0.07);
    }

    .app-btn--toggle.app-btn--active[b-yi6vrytl9u] {
        background: linear-gradient(135deg, #2c7a7b, #2c7a7b);
        color: #fff;
        box-shadow: 0 2px 8px rgba(44, 122, 123, 0.35);
    }

/* ===== Loading spinner ===== */

.btn-spinner[b-yi6vrytl9u] {
    width: 0.85em;
    height: 0.85em;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: btnSpin-b-yi6vrytl9u 0.6s linear infinite;
    flex-shrink: 0;
}

.app-btn--ghost .btn-spinner[b-yi6vrytl9u],
.app-btn--outline-primary .btn-spinner[b-yi6vrytl9u],
.app-btn--outline-success .btn-spinner[b-yi6vrytl9u],
.app-btn--toggle .btn-spinner[b-yi6vrytl9u] {
    border-color: rgba(0, 0, 0, 0.12);
    border-top-color: currentColor;
}

@keyframes btnSpin-b-yi6vrytl9u {
    to {
        transform: rotate(360deg);
    }
}
/* /Components/UI/CultureSelector.razor.rz.scp.css */
.culture-selector[b-4dm7rjvtme] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.65rem 0.75rem;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.4;
    border: 1px solid transparent;
    background: transparent;
    color: rgba(203, 213, 225, 0.65);
    transition: background 0.25s cubic-bezier(0.25, 0.8, 0.25, 1), color 0.25s ease, transform 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
    text-align: left;
}

    .culture-selector:hover[b-4dm7rjvtme] {
        background: rgba(44, 122, 123, 0.08);
        color: rgba(226, 232, 240, 0.95);
        transform: translateX(4px);
        border-color: rgba(44, 122, 123, 0.2);
    }

    .culture-selector i[b-4dm7rjvtme] {
        display: inline-block;
        width: 1.1rem;
        height: 1.1rem;
        margin-right: 0.7rem;
        flex-shrink: 0;
        background-size: cover;
        vertical-align: middle;
        opacity: 0.7;
        transition: opacity 0.2s ease;
    }

    .culture-selector:hover i[b-4dm7rjvtme] {
        opacity: 1;
    }

.bi-globe[b-4dm7rjvtme] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23a5b4fc' viewBox='0 0 16 16'%3E%3Cpath d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm7.5-6.923c-.67.204-1.335.82-1.887 1.855A7.97 7.97 0 0 0 5.145 4H7.5V1.077zM4.09 4a9.267 9.267 0 0 1 .64-1.539 6.7 6.7 0 0 1 .597-.933A7.025 7.025 0 0 0 2.255 4H4.09zm-.582 3.5c.03-.877.138-1.718.312-2.5H1.674a6.958 6.958 0 0 0-.656 2.5h2.49zM4.847 5a12.5 12.5 0 0 0-.338 2.5H7.5V5H4.847zM8.5 5v2.5h2.99a12.495 12.495 0 0 0-.337-2.5H8.5zM4.51 8.5a12.5 12.5 0 0 0 .337 2.5H7.5V8.5H4.51zm3.99 0V11h2.653c.187-.765.306-1.608.338-2.5H8.5zM5.145 12c.138.386.295.744.468 1.068.552 1.035 1.218 1.65 1.887 1.855V12H5.145zm.141 2.469c.205.132.418.256.639.366A6.993 6.993 0 0 0 8.5 14.923V12h2.355a7.962 7.962 0 0 1-4.569 2.469zm3.56-2.469h2.355a7.97 7.97 0 0 0-.468-1.068c-.552-1.035-1.218-1.65-1.887-1.855V12zM11.91 12A9.266 9.266 0 0 0 11.27 10.461a6.76 6.76 0 0 0-.597-.933A7.025 7.025 0 0 1 13.745 12h-1.835zm.582-3.5c-.03.877-.138 1.718-.312 2.5h2.146c.196-.785.334-1.626.353-2.5h-2.187zM11.153 5A12.5 12.5 0 0 1 11.49 7.5h2.188c-.019-.874-.157-1.715-.353-2.5h-2.172z'/%3E%3C/svg%3E");
}

.culture-selector select[b-4dm7rjvtme] {
    background-color: transparent;
    border: none;
    cursor: pointer;
    font-weight: 500;
    color: inherit;
    padding: 0;
    width: 100%;
}

    .culture-selector select:focus[b-4dm7rjvtme] {
        box-shadow: none;
        outline: none;
        border: none;
    }

    .culture-selector select option[b-4dm7rjvtme] {
        color: black;
    }
/* /Components/UI/LoadingButton.razor.rz.scp.css */
.spinner-border[b-ow5dvnjs59] {
    width: 1rem;
    height: 1rem;
    border-width: 0.15em;
    vertical-align: -0.125em;
}
/* /Components/UI/PageLoader.razor.rz.scp.css */
/* ── Loader shell ─────────────────────────────────────── */

.nl-loader[b-jgyrumdihe] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 80vh;
    user-select: none;
    animation: nl-loader-in-b-jgyrumdihe 0.4s ease-out both;
}

@keyframes nl-loader-in-b-jgyrumdihe {
    from {
        opacity: 0;
        transform: scale(0.96);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* ── Stage  ───────────────────────────────────────────── */

.nl-loader-stage[b-jgyrumdihe] {
    position: relative;
    width: 200px;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Ambient glow ─────────────────────────────────────── */

.nl-ambient-glow[b-jgyrumdihe] {
    position: absolute;
    inset: -80px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(20, 184, 166, 0.14) 0%, rgba(14, 165, 233, 0.07) 45%, transparent 70%);
    pointer-events: none;
    animation: nl-glow-breathe-b-jgyrumdihe 3.2s ease-in-out infinite;
}

@keyframes nl-glow-breathe-b-jgyrumdihe {
    0%, 100% {
        opacity: 0.55;
        transform: scale(0.93);
    }

    50% {
        opacity: 1;
        transform: scale(1.07);
    }
}

/* ── Pulsing sonar rings ──────────────────────────────── */

.nl-pulse-ring[b-jgyrumdihe] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    will-change: transform, opacity;
    animation: nl-pulse-out-b-jgyrumdihe 3.6s ease-out infinite;
}

.nl-pulse-ring--1[b-jgyrumdihe] {
    width: 116px;
    height: 116px;
    border: 1.5px solid rgba(20, 184, 166, 0.60);
    animation-delay: 0s;
}

.nl-pulse-ring--2[b-jgyrumdihe] {
    width: 148px;
    height: 148px;
    border: 1px solid rgba(14, 165, 233, 0.42);
    animation-delay: 1.1s;
}

.nl-pulse-ring--3[b-jgyrumdihe] {
    width: 178px;
    height: 178px;
    border: 1px solid rgba(99, 102, 241, 0.26);
    animation-delay: 2.2s;
}

@keyframes nl-pulse-out-b-jgyrumdihe {
    0% {
        transform: scale(0.65);
        opacity: 1;
    }

    100% {
        transform: scale(1.85);
        opacity: 0;
    }
}

/* ── Comet rings ──────────────────────────────────────────
   Conic-gradient tails masked into thin rings. Each ring spins
   linearly and an orbit dot (below) with the same duration rides
   its bright head — reads as a comet with a glowing nucleus. */

.nl-comet[b-jgyrumdihe] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform;
}

.nl-comet--outer[b-jgyrumdihe] {
    width: 132px;
    height: 132px;
    background: conic-gradient(from 0deg,
        transparent 0deg,
        transparent 220deg,
        rgba(20, 184, 166, 0.12) 250deg,
        rgba(20, 184, 166, 0.55) 320deg,
        #5eead4 360deg);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3.5px), #fff calc(100% - 2.5px));
    mask: radial-gradient(farthest-side, transparent calc(100% - 3.5px), #fff calc(100% - 2.5px));
    animation: nl-spin-b-jgyrumdihe 2.4s linear infinite;
}

.nl-comet--inner[b-jgyrumdihe] {
    width: 94px;
    height: 94px;
    background: conic-gradient(from 0deg,
        transparent 0deg,
        transparent 240deg,
        rgba(56, 189, 248, 0.10) 265deg,
        rgba(56, 189, 248, 0.5) 325deg,
        #7dd3fc 360deg);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #fff calc(100% - 2px));
    mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #fff calc(100% - 2px));
    animation: nl-spin-b-jgyrumdihe 3.4s linear infinite reverse;
}

/* ── Orbit dots (comet heads) ─────────────────────────── */

.nl-orbit[b-jgyrumdihe] {
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform;
}

.nl-orbit--outer[b-jgyrumdihe] {
    width: 132px;
    height: 132px;
    animation: nl-spin-b-jgyrumdihe 2.4s linear infinite;
}

.nl-orbit--inner[b-jgyrumdihe] {
    width: 94px;
    height: 94px;
    animation: nl-spin-b-jgyrumdihe 3.4s linear infinite reverse;
}

.nl-orbit-dot[b-jgyrumdihe] {
    position: absolute;
    top: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #5eead4;
    box-shadow: 0 0 10px 2px rgba(94, 234, 212, 0.85), 0 0 22px 6px rgba(20, 184, 166, 0.35);
}

.nl-orbit-dot--sky[b-jgyrumdihe] {
    width: 6px;
    height: 6px;
    top: -2.5px;
    background: #7dd3fc;
    box-shadow: 0 0 8px 2px rgba(125, 211, 252, 0.85), 0 0 18px 5px rgba(56, 189, 248, 0.3);
}

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

/* ── Center frosted-glass core ────────────────────────── */

.nl-core[b-jgyrumdihe] {
    position: relative;
    z-index: 2;
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.90);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(20, 184, 166, 0.24);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 0 18px rgba(20, 184, 166, 0.15), 0 8px 28px rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: nl-core-breathe-b-jgyrumdihe 3.2s ease-in-out infinite;
}

/* Breathes in sync with the ambient glow */
@keyframes nl-core-breathe-b-jgyrumdihe {
    0%, 100% {
        transform: scale(1);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 0 18px rgba(20, 184, 166, 0.15), 0 8px 28px rgba(0, 0, 0, 0.06);
    }

    50% {
        transform: scale(1.045);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 0 26px rgba(20, 184, 166, 0.3), 0 8px 28px rgba(0, 0, 0, 0.06);
    }
}

.nl-wordmark[b-jgyrumdihe] {
    display: block;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    background: linear-gradient(110deg, #0f172a 0%, #0ea5e9 35%, #14b8a6 50%, #0ea5e9 65%, #0f172a 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: geometricPrecision;
    transform: translateZ(0);
    animation: nl-wordmark-sheen-b-jgyrumdihe 3.2s ease-in-out infinite;
}

@keyframes nl-wordmark-sheen-b-jgyrumdihe {
    0%, 100% {
        background-position: 0% 0;
    }

    50% {
        background-position: 100% 0;
    }
}

/* ── Loading label ────────────────────────────────────── */

.nl-label[b-jgyrumdihe] {
    margin-top: 2.8rem;
    margin-bottom: 0;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #64748b;
    -webkit-font-smoothing: antialiased;
    animation: nl-label-breathe-b-jgyrumdihe 2.4s ease-in-out infinite;
}

@keyframes nl-label-breathe-b-jgyrumdihe {
    0%, 100% {
        opacity: 0.35;
    }

    50% {
        opacity: 1;
    }
}

/* ── Content reveal (after load) ─────────────────────── */

.nl-content-reveal[b-jgyrumdihe] {
    animation: nl-reveal-b-jgyrumdihe 0.3s ease-out both;
}

@keyframes nl-reveal-b-jgyrumdihe {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* ── Reduced motion ───────────────────────────────────────
   Stop the spatial animations (spin/scale) for users with
   vestibular sensitivity; keep only gentle opacity fades so
   the loader still reads as "working". */

@media (prefers-reduced-motion: reduce) {
    .nl-loader[b-jgyrumdihe],
    .nl-pulse-ring[b-jgyrumdihe],
    .nl-comet[b-jgyrumdihe],
    .nl-orbit[b-jgyrumdihe],
    .nl-ambient-glow[b-jgyrumdihe],
    .nl-core[b-jgyrumdihe],
    .nl-content-reveal[b-jgyrumdihe] {
        animation: none !important;
    }

    .nl-pulse-ring[b-jgyrumdihe] {
        opacity: 0.4;
    }
}
/* /Components/UI/ToastContainer.razor.rz.scp.css */
.toast-container[b-5kwi77vke4] {
    position: fixed;
    bottom: 1.75rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1090;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 0.5rem;
    pointer-events: none;
}

.toast-item[b-5kwi77vke4] {
    pointer-events: all;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.8rem 1.25rem;
    border-radius: 0.5rem;
    width: min(460px, calc(100vw - 2rem));
    min-width: 300px;
    max-width: 460px;
    box-sizing: border-box;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    font-size: 0.9rem;
    font-weight: 500;
    animation: toast-in-b-5kwi77vke4 0.3s ease forwards;
}

    .toast-item.toast-leaving[b-5kwi77vke4] {
        animation: toast-out-b-5kwi77vke4 0.35s ease forwards;
    }

@keyframes toast-in-b-5kwi77vke4 {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes toast-out-b-5kwi77vke4 {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(16px);
    }
}

@keyframes toast-error-shake-b-5kwi77vke4 {
    0%, 100% {
        transform: translateX(0);
    }

    20%, 60% {
        transform: translateX(-4px);
    }

    40%, 80% {
        transform: translateX(4px);
    }
}

@keyframes toast-error-pulse-b-5kwi77vke4 {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.18);
        opacity: 0.75;
    }
}

.toast-success[b-5kwi77vke4] {
    background-color: #d1e7dd;
    border-left: 4px solid #198754;
    color: #0f5132;
}

.toast-warning[b-5kwi77vke4] {
    background-color: #fff3cd;
    border-left: 4px solid #ffc107;
    color: #664d03;
}

.toast-error[b-5kwi77vke4] {
    position: relative;
    background: linear-gradient(135deg, #fdeeee 0%, #fbd9dc 100%);
    border-left: 4px solid #dc3545;
    color: #842029;
    box-shadow: 0 6px 24px rgba(220, 53, 69, 0.25), 0 0 0 1px rgba(220, 53, 69, 0.08);
    animation: toast-in-b-5kwi77vke4 0.3s ease forwards, toast-error-shake-b-5kwi77vke4 0.4s ease 0.3s;
}

    .toast-error .toast-icon[b-5kwi77vke4] {
        color: #dc3545;
        animation: toast-error-pulse-b-5kwi77vke4 1.6s ease-in-out infinite;
    }

.toast-info[b-5kwi77vke4] {
    background-color: #cff4fc;
    border-left: 4px solid #0dcaf0;
    color: #055160;
}

.toast-icon[b-5kwi77vke4] {
    font-size: 1.05rem;
    flex-shrink: 0;
    margin-top: 0.15rem;
}

.toast-message[b-5kwi77vke4] {
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.4;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.toast-close[b-5kwi77vke4] {
    background: none;
    border: none;
    cursor: pointer;
    opacity: 0.5;
    padding: 0;
    font-size: 0.75rem;
    color: inherit;
    flex-shrink: 0;
    line-height: 1;
    margin-top: 0.2rem;
}

    .toast-close:hover[b-5kwi77vke4] {
        opacity: 1;
    }