/* /Chat/ArtifactPanel.razor.rz.scp.css */
/* Artifact Panel — Side panel for generated files */

.artifact-panel[b-s47dvunbno] {
    width: 0;
    overflow: hidden;
    border-left: 1px solid var(--border-light);
    background: var(--bg-primary);
    display: flex;
    flex-direction: column;
    transition: width var(--duration-normal) var(--ease-out);
    flex-shrink: 0;
}

.artifact-panel.open[b-s47dvunbno] {
    width: 400px;
}

/* Header */
.artifact-header[b-s47dvunbno] {
    height: 56px;
    padding: 0 var(--space-4);
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-shrink: 0;
}

.artifact-title[b-s47dvunbno] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
    letter-spacing: var(--tracking-tight);
}

.artifact-count[b-s47dvunbno] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 var(--space-1);
    background: var(--accent-subtle);
    color: var(--accent-primary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    border-radius: var(--radius-full);
}

.artifact-close-btn[b-s47dvunbno] {
    margin-left: auto;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: var(--radius-md);
    color: var(--text-tertiary);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.artifact-close-btn:hover[b-s47dvunbno] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Body */
.artifact-body[b-s47dvunbno] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

/* Empty State */
.artifact-empty[b-s47dvunbno] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-8);
    text-align: center;
    flex: 1;
}

.artifact-empty-icon[b-s47dvunbno] {
    color: var(--text-tertiary);
    opacity: 0.5;
    margin-bottom: var(--space-4);
}

.artifact-empty-title[b-s47dvunbno] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.artifact-empty-hint[b-s47dvunbno] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: 0;
    line-height: var(--leading-relaxed);
    max-width: 240px;
}

/* File List */
.artifact-list[b-s47dvunbno] {
    border-bottom: 1px solid var(--border-light);
    max-height: 280px;
    overflow-y: auto;
}

.artifact-item[b-s47dvunbno] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-out);
    border-bottom: 1px solid var(--border-light);
}

.artifact-item:last-child[b-s47dvunbno] {
    border-bottom: none;
}

.artifact-item:hover[b-s47dvunbno] {
    background: var(--bg-secondary);
}

.artifact-item.selected[b-s47dvunbno] {
    background: var(--accent-subtle);
    border-left: 2px solid var(--accent-primary);
    padding-left: calc(var(--space-4) - 2px);
}

/* Type Icons */
.artifact-type-icon[b-s47dvunbno] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.5625rem;
    font-weight: var(--font-bold);
    letter-spacing: var(--tracking-wide);
    flex-shrink: 0;
}

.artifact-type-icon.large[b-s47dvunbno] {
    width: 48px;
    height: 48px;
    font-size: var(--text-sm);
}

.type-excel[b-s47dvunbno] {
    background: rgba(34, 139, 34, 0.12);
    color: #228b22;
}

.type-csv[b-s47dvunbno] {
    background: rgba(59, 130, 246, 0.12);
    color: #3b82f6;
}

.type-pdf[b-s47dvunbno] {
    background: rgba(239, 68, 68, 0.12);
    color: #ef4444;
}

.type-html[b-s47dvunbno] {
    background: rgba(245, 158, 11, 0.12);
    color: #f59e0b;
}

.type-chart[b-s47dvunbno] {
    background: rgba(147, 51, 234, 0.12);
    color: #9333ea;
}

.type-other[b-s47dvunbno] {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
}

/* File Info */
.artifact-info[b-s47dvunbno] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.artifact-name[b-s47dvunbno] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.artifact-meta[b-s47dvunbno] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

/* Download Button */
.artifact-download-btn[b-s47dvunbno] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-tertiary);
    cursor: pointer;
    flex-shrink: 0;
    transition: all var(--duration-fast) var(--ease-out);
}

.artifact-download-btn:hover[b-s47dvunbno] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-secondary);
}

/* Preview Area */
.artifact-preview[b-s47dvunbno] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 200px;
}

.artifact-iframe[b-s47dvunbno] {
    flex: 1;
    width: 100%;
    border: none;
    background: white;
}

.artifact-image[b-s47dvunbno] {
    max-width: 100%;
    height: auto;
    padding: var(--space-4);
    object-fit: contain;
}

/* Download Prompt (non-previewable files) */
.artifact-download-prompt[b-s47dvunbno] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-8);
    text-align: center;
    flex: 1;
}

.artifact-prompt-name[b-s47dvunbno] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: var(--space-4) 0 var(--space-2) 0;
    word-break: break-all;
}

.artifact-prompt-desc[b-s47dvunbno] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: 0 0 var(--space-5) 0;
}

.artifact-download-full[b-s47dvunbno] {
    height: 36px;
    padding: 0 var(--space-5);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.artifact-download-full:hover[b-s47dvunbno] {
    background: var(--accent-hover);
}

.artifact-download-full:active[b-s47dvunbno] {
    transform: scale(0.98);
}

/* Mobile: full-screen overlay */
@media (max-width: 768px) {
    .artifact-panel.open[b-s47dvunbno] {
        position: fixed;
        inset: 0;
        width: 100%;
        z-index: 200;
        border-left: none;
    }
}
/* /Chat/ChatInput.razor.rz.scp.css */
/* Chat Input */

.chat-input-container[b-o8y9xkiqdd] {
    display: flex;
    flex-direction: column;
    padding: var(--space-4) var(--space-5);
    background-color: var(--bg-primary);
    border-top: 1px solid var(--border-light);
}

.input-row[b-o8y9xkiqdd] {
    display: flex;
    gap: var(--space-3);
    align-items: flex-end;
}

/* ============================================
   Attachment Preview Bar
   ============================================ */
.attachment-preview-bar[b-o8y9xkiqdd] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    padding-bottom: var(--space-3);
}

.attachment-chip[b-o8y9xkiqdd] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    background: var(--bg-tertiary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    transition: all var(--duration-fast) var(--ease-out);
}

.attachment-chip.uploading[b-o8y9xkiqdd] {
    opacity: 0.7;
}

.attachment-icon[b-o8y9xkiqdd] {
    flex-shrink: 0;
    color: var(--accent-primary);
}

.attachment-name[b-o8y9xkiqdd] {
    color: var(--text-primary);
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.attachment-size[b-o8y9xkiqdd] {
    color: var(--text-muted);
    font-size: var(--text-xs);
}

.attachment-uploading[b-o8y9xkiqdd] {
    color: var(--accent-primary);
    font-size: var(--text-xs);
    font-style: italic;
}

.remove-attachment[b-o8y9xkiqdd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--radius-full);
    color: var(--text-muted);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.remove-attachment:hover[b-o8y9xkiqdd] {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

/* Upload Error */
.upload-error[b-o8y9xkiqdd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    margin-bottom: var(--space-2);
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: var(--radius-lg);
    font-size: var(--text-sm);
    color: #ef4444;
}

.dismiss-error[b-o8y9xkiqdd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--radius-full);
    color: #ef4444;
    cursor: pointer;
    flex-shrink: 0;
}

.dismiss-error:hover[b-o8y9xkiqdd] {
    background: rgba(239, 68, 68, 0.15);
}

/* ============================================
   Voice Interim Transcript Bar
   ============================================ */
.voice-interim-bar[b-o8y9xkiqdd] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    margin-bottom: var(--space-2);
    background: var(--bg-secondary);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: var(--radius-lg);
    animation: interim-fade-in-b-o8y9xkiqdd 0.2s ease;
}

.voice-interim-icon[b-o8y9xkiqdd] {
    flex-shrink: 0;
    color: #ef4444;
    animation: interim-pulse-b-o8y9xkiqdd 1.4s ease-in-out infinite;
}

.voice-interim-text[b-o8y9xkiqdd] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    line-height: var(--leading-normal);
    word-break: break-word;
}

@keyframes interim-fade-in-b-o8y9xkiqdd {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes interim-pulse-b-o8y9xkiqdd {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.4; }
}

/* Textarea */
.chat-textarea[b-o8y9xkiqdd] {
    flex: 1;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-2xl);
    resize: none;
    font-family: inherit;
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    min-height: 44px;
    max-height: 200px;
    overflow-y: auto;
    outline: none;
    transition: border-color var(--duration-fast) var(--ease-out),
                background var(--duration-fast) var(--ease-out),
                box-shadow var(--duration-fast) var(--ease-out);
}

.chat-textarea:hover:not(:focus):not(:disabled)[b-o8y9xkiqdd] {
    border-color: var(--border-secondary);
}

.chat-textarea:focus[b-o8y9xkiqdd] {
    background: var(--bg-primary);
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.chat-textarea:disabled[b-o8y9xkiqdd] {
    background-color: var(--bg-tertiary);
    cursor: not-allowed;
    opacity: 0.6;
}

.chat-textarea[b-o8y9xkiqdd]::placeholder {
    color: var(--text-muted);
}

/* ============================================
   Action Buttons (shared)
   ============================================ */
.action-button[b-o8y9xkiqdd] {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border: none;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    background: transparent;
}

.action-button:active:not(:disabled)[b-o8y9xkiqdd] {
    transform: scale(0.88);
}

.action-button:disabled[b-o8y9xkiqdd] {
    opacity: 0.35;
    cursor: not-allowed;
}

/* ============================================
   Attach Button — paperclip icon
   ============================================ */
.action-button.attach[b-o8y9xkiqdd] {
    color: var(--text-muted);
    border-radius: var(--radius-full);
    transition: all 0.2s ease;
}

.action-button.attach:hover:not(:disabled)[b-o8y9xkiqdd] {
    color: var(--accent-primary);
    background: var(--bg-secondary);
}

/* ============================================
   Send Button — gradient pill with shimmer
   ============================================ */
.action-button.send[b-o8y9xkiqdd] {
    border-radius: var(--radius-full);
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-hover));
    box-shadow: 0 2px 12px rgba(99, 102, 241, 0.3);
    transition: all 0.2s ease;
    overflow: hidden;
}

.action-button.send[b-o8y9xkiqdd]::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.3) 50%,
        transparent 100%
    );
    transition: left 0.5s ease;
}

.action-button.send:hover:not(:disabled)[b-o8y9xkiqdd] {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(99, 102, 241, 0.45);
}

.action-button.send:hover:not(:disabled)[b-o8y9xkiqdd]::after {
    left: 100%;
}

.action-button.send:disabled[b-o8y9xkiqdd] {
    background: var(--bg-tertiary);
    box-shadow: none;
}

.action-button.send:disabled[b-o8y9xkiqdd]::after {
    display: none;
}

.send-icon[b-o8y9xkiqdd] {
    font-size: var(--text-lg);
    margin-left: 2px;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.2));
    position: relative;
    z-index: 1;
}

/* ============================================
   Stop Button — wireframe blob with pulsing glow
   SVG polygon handles the morphing shape.
   drop-shadow on the button follows the SVG shape.
   ============================================ */
.action-button.stop[b-o8y9xkiqdd] {
    filter:
        drop-shadow(0 0 8px rgba(255, 71, 87, 0.5))
        drop-shadow(0 0 18px rgba(255, 99, 72, 0.3));
    animation:
        stopPulse-b-o8y9xkiqdd 1.5s ease-in-out infinite,
        stopEntrance-b-o8y9xkiqdd 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.action-button.stop:hover[b-o8y9xkiqdd] {
    filter:
        drop-shadow(0 0 14px rgba(255, 71, 87, 0.7))
        drop-shadow(0 0 28px rgba(255, 99, 72, 0.4));
}

/* Wireframe blob SVG — fills the button area */
.blob-bg[b-o8y9xkiqdd] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

/* Stop square icon — centred above the blob */
.stop-icon[b-o8y9xkiqdd] {
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
}

/* Breathing scale */
@keyframes stopPulse-b-o8y9xkiqdd {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.06);
    }
}

/* Pop-in entrance */
@keyframes stopEntrance-b-o8y9xkiqdd {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .action-button.stop[b-o8y9xkiqdd] {
        animation: none;
    }
    .action-button.stop[b-o8y9xkiqdd]::before {
        clip-path: circle(48%);
        animation: none;
    }
    .action-button.send[b-o8y9xkiqdd]::after {
        display: none;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .chat-input-container[b-o8y9xkiqdd] {
        padding: var(--space-2) var(--space-3);
    }

    .input-row[b-o8y9xkiqdd] {
        gap: var(--space-2);
    }

    .action-button[b-o8y9xkiqdd] {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
    }

    .chat-textarea[b-o8y9xkiqdd] {
        font-size: 16px;
        padding: var(--space-2) var(--space-3);
    }
}
/* /Chat/ChatMessage.razor.rz.scp.css */
/* Chat Message - Linear-Inspired Design */

.chat-message[b-tf5v30ox89] {
    padding: var(--space-4);
    border-radius: var(--radius-xl);
    max-width: 80%;
    animation: messageSlideIn-b-tf5v30ox89 var(--duration-normal) var(--ease-spring);
}

@keyframes messageSlideIn-b-tf5v30ox89 {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* User Message */
.user-message[b-tf5v30ox89] {
    background: var(--chat-user-bg);
    color: var(--chat-user-text);
    margin-left: auto;
    border-bottom-right-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm);
}

/* Sophia Message */
.sophia-message[b-tf5v30ox89] {
    background-color: var(--chat-sophia-bg);
    color: var(--chat-sophia-text);
    margin-right: auto;
    border-bottom-left-radius: var(--radius-sm);
    border: 1px solid var(--chat-sophia-border);
}

/* Message Header */
.message-header[b-tf5v30ox89] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
    font-size: var(--text-sm);
}

/* Sophia Avatar */
.sophia-avatar[b-tf5v30ox89] {
    width: 22px;
    height: 22px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--thinking-primary) 0%, var(--thinking-secondary) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sophia-icon[b-tf5v30ox89] {
    color: white;
    font-weight: var(--font-bold);
    font-size: 0.625rem;
}

/* Sender Name */
.sender-name[b-tf5v30ox89] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm);
}

.user-message .sender-name[b-tf5v30ox89] {
    color: rgba(255, 255, 255, 0.9);
}

.sophia-message .sender-name[b-tf5v30ox89] {
    color: var(--text-primary);
}

/* Message Time */
.message-time[b-tf5v30ox89] {
    opacity: 0.6;
    font-size: var(--text-xs);
    margin-left: auto;
}

/* Message Content */
.message-content[b-tf5v30ox89] {
    line-height: var(--leading-relaxed);
    font-size: var(--text-sm);
    overflow-x: auto;
    max-width: 100%;
}

/* Code Blocks */
.message-content[b-tf5v30ox89]  pre {
    background-color: var(--code-bg);
    color: var(--code-text);
    padding: var(--space-4);
    border-radius: var(--radius-md);
    overflow-x: auto;
    margin: var(--space-3) 0;
    font-size: var(--text-xs);
    line-height: var(--leading-normal);
    border: 1px solid var(--border-light);
}

.message-content[b-tf5v30ox89]  code {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
}

.message-content[b-tf5v30ox89]  :not(pre) > code {
    background-color: var(--bg-tertiary);
    padding: 0.125rem var(--space-1);
    border-radius: var(--radius-xs);
    font-size: 0.8125em;
}

.user-message .message-content[b-tf5v30ox89]  :not(pre) > code {
    background-color: rgba(255, 255, 255, 0.15);
}

.user-message .message-content[b-tf5v30ox89]  pre {
    background-color: rgba(0, 0, 0, 0.2);
    border-color: rgba(255, 255, 255, 0.1);
}

/* Typography */
.message-content[b-tf5v30ox89]  p:first-child {
    margin-top: 0;
}

.message-content[b-tf5v30ox89]  p:last-child {
    margin-bottom: 0;
}

.message-content[b-tf5v30ox89]  p {
    margin: var(--space-3) 0;
}

/* Lists */
.message-content[b-tf5v30ox89]  ul,
.message-content[b-tf5v30ox89]  ol {
    margin: var(--space-3) 0;
    padding-left: var(--space-5);
}

.message-content[b-tf5v30ox89]  li {
    margin: var(--space-1) 0;
}

.message-content[b-tf5v30ox89]  li::marker {
    color: var(--text-muted);
}

.user-message .message-content[b-tf5v30ox89]  li::marker {
    color: rgba(255, 255, 255, 0.6);
}

/* Tables */
.message-content[b-tf5v30ox89]  table {
    border-collapse: collapse;
    width: 100%;
    margin: var(--space-3) 0;
    font-size: var(--text-sm);
}

.message-content[b-tf5v30ox89]  th,
.message-content[b-tf5v30ox89]  td {
    border: 1px solid var(--border-primary);
    padding: var(--space-2) var(--space-3);
    text-align: left;
    white-space: nowrap;
    font-size: var(--text-xs);
}

.message-content[b-tf5v30ox89]  th {
    background-color: var(--bg-tertiary);
    font-weight: var(--font-semibold);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-secondary);
}

.user-message .message-content[b-tf5v30ox89]  th {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
}

.user-message .message-content[b-tf5v30ox89]  td {
    border-color: rgba(255, 255, 255, 0.15);
}

/* Blockquotes */
.message-content[b-tf5v30ox89]  blockquote {
    border-left: 3px solid var(--accent-primary);
    margin: var(--space-3) 0;
    padding-left: var(--space-4);
    color: var(--text-secondary);
    font-style: italic;
}

.user-message .message-content[b-tf5v30ox89]  blockquote {
    border-left-color: rgba(255, 255, 255, 0.4);
    color: rgba(255, 255, 255, 0.85);
}

/* Links */
.message-content[b-tf5v30ox89]  a {
    color: var(--accent-primary);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color var(--duration-fast) var(--ease-out);
}

.message-content[b-tf5v30ox89]  a:hover {
    color: var(--accent-hover);
}

.user-message .message-content[b-tf5v30ox89]  a {
    color: white;
}

/* Horizontal Rules */
.message-content[b-tf5v30ox89]  hr {
    border: none;
    border-top: 1px solid var(--border-light);
    margin: var(--space-4) 0;
}

.user-message .message-content[b-tf5v30ox89]  hr {
    border-top-color: rgba(255, 255, 255, 0.15);
}

/* Strong/Bold */
.message-content[b-tf5v30ox89]  strong {
    font-weight: var(--font-semibold);
}

/* Emphasis */
.message-content[b-tf5v30ox89]  em {
    font-style: italic;
}

/* Headings in messages */
.message-content[b-tf5v30ox89]  h1,
.message-content[b-tf5v30ox89]  h2,
.message-content[b-tf5v30ox89]  h3,
.message-content[b-tf5v30ox89]  h4 {
    margin: var(--space-4) 0 var(--space-2) 0;
    font-weight: var(--font-semibold);
    line-height: var(--leading-tight);
}

.message-content[b-tf5v30ox89]  h1 {
    font-size: var(--text-lg);
}

.message-content[b-tf5v30ox89]  h2 {
    font-size: var(--text-md);
}

.message-content[b-tf5v30ox89]  h3,
.message-content[b-tf5v30ox89]  h4 {
    font-size: var(--text-base);
}

/* Thinking Section */
.thinking-section[b-tf5v30ox89] {
    margin-bottom: var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-light);
    background: var(--bg-secondary);
    overflow: hidden;
}

.thinking-toggle-btn[b-tf5v30ox89] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
    padding: var(--space-2) var(--space-3);
    background: none;
    border: none;
    cursor: pointer;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: var(--font-medium);
    transition: color var(--duration-fast) var(--ease-out);
}

.thinking-toggle-btn:hover[b-tf5v30ox89] {
    color: var(--text-secondary);
}

.thinking-chevron[b-tf5v30ox89] {
    font-size: 0.625rem;
    transition: transform var(--duration-fast) var(--ease-out);
}

.thinking-label[b-tf5v30ox89] {
    flex: 1;
    text-align: left;
}

.thinking-indicator[b-tf5v30ox89] {
    width: 6px;
    height: 6px;
    border-radius: var(--radius-full);
    background: var(--thinking-primary);
    opacity: 0.6;
}

.thinking-content[b-tf5v30ox89] {
    padding: 0 var(--space-3) var(--space-3);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    line-height: var(--leading-relaxed);
    border-top: 1px solid var(--border-light);
    max-height: 300px;
    overflow-y: auto;
}

.thinking-content[b-tf5v30ox89]  p {
    margin: var(--space-2) 0;
}

.thinking-content[b-tf5v30ox89]  p:first-child {
    margin-top: 0;
}

.thinking-content[b-tf5v30ox89]  p:last-child {
    margin-bottom: 0;
}

/* Status Indicator */
.status-indicator[b-tf5v30ox89] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) 0;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.status-spinner[b-tf5v30ox89] {
    width: 12px;
    height: 12px;
    border: 2px solid var(--border-light);
    border-top-color: var(--accent-primary);
    border-radius: var(--radius-full);
    animation: statusSpin-b-tf5v30ox89 0.8s linear infinite;
    flex-shrink: 0;
}

@keyframes statusSpin-b-tf5v30ox89 {
    to { transform: rotate(360deg); }
}

.status-text[b-tf5v30ox89] {
    font-style: italic;
    animation: statusPulse-b-tf5v30ox89 1.5s ease-in-out infinite;
}

@keyframes statusPulse-b-tf5v30ox89 {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

/* Thinking Badge */
.thinking-badge[b-tf5v30ox89] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: var(--space-2);
    padding: 2px var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    opacity: 0.7;
}

.thinking-badge svg[b-tf5v30ox89] {
    opacity: 0.6;
    flex-shrink: 0;
}

/* Attachments */
.message-attachments[b-tf5v30ox89] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px solid var(--border-light);
}

.attachment-card[b-tf5v30ox89] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-light);
    background: var(--bg-secondary);
    cursor: pointer;
    font-family: inherit;
    font-size: var(--text-xs);
    color: var(--text-primary);
    transition: background var(--duration-fast) var(--ease-out),
                border-color var(--duration-fast) var(--ease-out);
    max-width: 240px;
}

.attachment-card:hover[b-tf5v30ox89] {
    background: var(--bg-tertiary);
    border-color: var(--accent-primary);
}

.user-message .message-attachments[b-tf5v30ox89] {
    border-top-color: rgba(255, 255, 255, 0.15);
}

.user-message .attachment-card[b-tf5v30ox89] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.95);
}

.user-message .attachment-card:hover[b-tf5v30ox89] {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.4);
}

.attachment-icon[b-tf5v30ox89] {
    flex-shrink: 0;
    opacity: 0.7;
}

.attachment-info[b-tf5v30ox89] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.attachment-name[b-tf5v30ox89] {
    font-weight: var(--font-medium);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.attachment-size[b-tf5v30ox89] {
    font-size: 0.625rem;
    opacity: 0.6;
}

.attachment-download[b-tf5v30ox89] {
    flex-shrink: 0;
    opacity: 0.4;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.attachment-card:hover .attachment-download[b-tf5v30ox89] {
    opacity: 0.8;
}

/* Mobile — wider message bubbles */
@media (max-width: 768px) {
    .chat-message[b-tf5v30ox89] {
        max-width: 95%;
    }
}
/* /Chat/ConversationList.razor.rz.scp.css */
/* Conversation List - Linear-Inspired Design */

.conversation-list[b-yldi8viu3o] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background-color: var(--bg-secondary);
}

/* Header */
.list-header[b-yldi8viu3o] {
    padding: var(--space-4);
    border-bottom: 1px solid var(--border-light);
    background: var(--bg-primary);
}

.list-header h3[b-yldi8viu3o] {
    margin: 0 0 var(--space-3) 0;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

/* New Chat Button */
.new-chat-btn[b-yldi8viu3o] {
    width: 100%;
    height: 36px;
    padding: 0 var(--space-3);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    cursor: pointer;
    font-weight: var(--font-medium);
    font-size: var(--text-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    transition: all var(--duration-fast) var(--ease-out);
    box-shadow: var(--shadow-sm);
}

.new-chat-btn:hover[b-yldi8viu3o] {
    background: var(--accent-hover);
    box-shadow: var(--shadow-md);
}

.new-chat-btn:active[b-yldi8viu3o] {
    transform: scale(0.98);
    box-shadow: var(--shadow-xs);
}

.plus-icon[b-yldi8viu3o] {
    font-size: var(--text-lg);
    font-weight: var(--font-light);
    line-height: 1;
}

/* Conversations Container */
.conversations[b-yldi8viu3o] {
    flex: 1;
    overflow-y: auto;
    padding: var(--space-2);
}

/* Conversation Item */
.conversation-item[b-yldi8viu3o] {
    position: relative;
    padding: var(--space-3);
    padding-right: var(--space-8);
    border-radius: var(--radius-md);
    cursor: pointer;
    margin-bottom: var(--space-1);
    transition: all var(--duration-fast) var(--ease-out);
    border: 1px solid transparent;
}

.conversation-item:hover[b-yldi8viu3o] {
    background-color: var(--bg-tertiary);
}

.conversation-item.selected[b-yldi8viu3o] {
    background-color: var(--accent-subtle);
    border-color: var(--accent-light);
}

/* Delete Button */
.delete-btn[b-yldi8viu3o] {
    position: absolute;
    top: 50%;
    right: var(--space-2);
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all var(--duration-fast) var(--ease-out);
}

.conversation-item:hover .delete-btn[b-yldi8viu3o] {
    opacity: 1;
}

.delete-btn:hover[b-yldi8viu3o] {
    background: var(--bg-danger, rgba(239, 68, 68, 0.1));
    color: var(--text-danger, #ef4444);
}

.conversation-title[b-yldi8viu3o] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--text-sm);
    margin-bottom: var(--space-1);
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.whatsapp-badge[b-yldi8viu3o] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.conversation-item.selected .conversation-title[b-yldi8viu3o] {
    color: var(--accent-primary);
}

.conversation-meta[b-yldi8viu3o] {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* Loading & Empty States */
.loading[b-yldi8viu3o],
.empty-state[b-yldi8viu3o] {
    padding: var(--space-8);
    text-align: center;
    color: var(--text-tertiary);
}

.empty-state p[b-yldi8viu3o] {
    margin: 0;
    font-size: var(--text-sm);
}

.empty-state .hint[b-yldi8viu3o] {
    font-size: var(--text-xs);
    margin-top: var(--space-2);
    color: var(--text-muted);
}

/* Custom Scrollbar */
.conversations[b-yldi8viu3o]::-webkit-scrollbar {
    width: 6px;
}

.conversations[b-yldi8viu3o]::-webkit-scrollbar-track {
    background: transparent;
}

.conversations[b-yldi8viu3o]::-webkit-scrollbar-thumb {
    background: var(--border-primary);
    border-radius: var(--radius-full);
}

.conversations[b-yldi8viu3o]::-webkit-scrollbar-thumb:hover {
    background: var(--border-secondary);
}
/* /Chat/ThinkingIndicator.razor.rz.scp.css */
/* Thinking Indicator - Evolving Blob Animation */

.thinking-indicator[b-0o49qffq34] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    animation: fadeInUp-b-0o49qffq34 var(--duration-slow) var(--ease-out);
}

@keyframes fadeInUp-b-0o49qffq34 {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Blob Container */
.thinking-blob-container[b-0o49qffq34] {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* The Morphing Blob — glow lives here so it follows the SVG shape */
.thinking-blob[b-0o49qffq34] {
    width: 36px;
    height: 36px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    filter:
        drop-shadow(0 0 6px color-mix(in srgb, var(--thinking-primary) 60%, transparent))
        drop-shadow(0 0 14px color-mix(in srgb, var(--thinking-secondary) 35%, transparent));
}

.blob-svg[b-0o49qffq34] {
    width: 100%;
    height: 100%;
    overflow: visible;
    animation:
        blobPulse-b-0o49qffq34 2s ease-in-out infinite,
        blobRotate-b-0o49qffq34 12s linear infinite;
}

/* Subtle Pulse */
@keyframes blobPulse-b-0o49qffq34 {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.08);
        opacity: 0.85;
    }
}

/* Slow Rotation */
@keyframes blobRotate-b-0o49qffq34 {
    from {
        rotate: 0deg;
    }
    to {
        rotate: 360deg;
    }
}

/* Content Container */
.thinking-content[b-0o49qffq34] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-3) var(--space-4);
    background: var(--chat-sophia-bg);
    border: 1px solid var(--chat-sophia-border);
    border-radius: var(--radius-lg);
    border-top-left-radius: var(--radius-xs);
    min-width: 140px;
}

.thinking-label[b-0o49qffq34] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--accent-primary);
}

.thinking-text[b-0o49qffq34] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    animation: textPulse-b-0o49qffq34 3s ease-in-out infinite;
}

@keyframes textPulse-b-0o49qffq34 {
    0%, 100% {
        opacity: 0.7;
    }
    50% {
        opacity: 1;
    }
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
    .blob-svg[b-0o49qffq34] {
        animation: none;
    }

    .blob-svg polygon animate[b-0o49qffq34] {
        display: none;
    }

    .thinking-text[b-0o49qffq34] {
        animation: none;
        opacity: 1;
    }

    .thinking-indicator[b-0o49qffq34] {
        animation: none;
    }
}
/* /Chat/VoiceMicButton.razor.rz.scp.css */
/* Voice Mic Button — scoped styles using design system tokens */

.voice-mic-wrapper[b-pyw5fk0ur4] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.voice-mic-btn[b-pyw5fk0ur4] {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: var(--radius-full);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
    position: relative;
    z-index: 1;
}

.voice-mic-btn:focus-visible[b-pyw5fk0ur4] {
    outline: 2px solid var(--accent-primary);
    outline-offset: 2px;
}

.voice-mic-btn:active:not(:disabled)[b-pyw5fk0ur4] {
    transform: scale(0.88);
}

/* Idle */
.voice-mic-btn.idle[b-pyw5fk0ur4] {
    background-color: transparent;
    color: var(--text-muted);
}

.voice-mic-btn.idle:hover:not(:disabled)[b-pyw5fk0ur4] {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

/* Listening — red pulse */
.voice-mic-btn.listening[b-pyw5fk0ur4] {
    background-color: #ef4444;
    color: #ffffff;
    animation: mic-pulse-b-pyw5fk0ur4 1.4s ease-in-out infinite;
}

@keyframes mic-pulse-b-pyw5fk0ur4 {
    0%   { box-shadow: 0 0 0 0    rgba(239, 68, 68, 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);   }
    100% { box-shadow: 0 0 0 0    rgba(239, 68, 68, 0);   }
}

.voice-pulse-ring[b-pyw5fk0ur4] {
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(239, 68, 68, 0.35);
    animation: ring-expand-b-pyw5fk0ur4 1.4s ease-out infinite;
    pointer-events: none;
}

@keyframes ring-expand-b-pyw5fk0ur4 {
    0%   { transform: scale(1);   opacity: 1; }
    100% { transform: scale(1.6); opacity: 0; }
}

/* Processing — spinner */
.voice-mic-btn.processing[b-pyw5fk0ur4] {
    background-color: var(--accent-primary);
    color: #fff;
    cursor: not-allowed;
}

.voice-spinner[b-pyw5fk0ur4] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-pyw5fk0ur4 0.7s linear infinite;
    display: block;
}

@keyframes spin-b-pyw5fk0ur4 { to { transform: rotate(360deg); } }

/* Speaking — purple breathe */
.voice-mic-btn.speaking[b-pyw5fk0ur4] {
    background-color: #8b5cf6;
    color: #fff;
    animation: speaking-breathe-b-pyw5fk0ur4 1.8s ease-in-out infinite;
}

@keyframes speaking-breathe-b-pyw5fk0ur4 {
    0%, 100% { box-shadow: 0 0 0 0   rgba(139, 92, 246, 0.5); }
    50%      { box-shadow: 0 0 0 8px rgba(139, 92, 246, 0);   }
}

/* Error toast */
.voice-error-toast[b-pyw5fk0ur4] {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
    background: #dc2626;
    color: #fff;
    padding: 8px 16px;
    border-radius: var(--radius-lg);
    font-size: var(--text-sm);
    z-index: 9999;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    animation: toast-in-b-pyw5fk0ur4 0.25s ease;
}

@keyframes toast-in-b-pyw5fk0ur4 {
    from { opacity: 0; transform: translateX(-50%) translateY(8px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0);   }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .voice-mic-btn.listening[b-pyw5fk0ur4],
    .voice-mic-btn.speaking[b-pyw5fk0ur4] {
        animation: none;
    }
    .voice-pulse-ring[b-pyw5fk0ur4] {
        animation: none;
        display: none;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .voice-mic-btn[b-pyw5fk0ur4] {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
    }

    .voice-mic-btn svg[b-pyw5fk0ur4] {
        width: 18px;
        height: 18px;
    }
}
/* /Components/BrowserPanel.razor.rz.scp.css */
.browser-panel[b-ssvm4uu4hn] {
    background: var(--bg-secondary, #1a1a2e);
    border: 1px solid var(--border-color, #2a2a4a);
    border-radius: var(--radius-lg, 12px);
    margin: var(--space-3, 12px) 0;
    overflow: hidden;
    max-width: 480px;
    width: 50%;
    min-width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.browser-panel.collapsed .browser-panel-body[b-ssvm4uu4hn] {
    display: none;
}

.browser-panel-header[b-ssvm4uu4hn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
    user-select: none;
    background: var(--bg-tertiary, #16162a);
}

.browser-panel-header:hover[b-ssvm4uu4hn] {
    background: var(--bg-hover, #1e1e3a);
}

.browser-panel-title[b-ssvm4uu4hn] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-primary, #e0e0e0);
    overflow: hidden;
    min-width: 0;
}

.browser-icon[b-ssvm4uu4hn] {
    font-size: 0.9rem;
    flex-shrink: 0;
}

.browser-url[b-ssvm4uu4hn] {
    font-weight: 400;
    color: var(--text-secondary, #a0a0c0);
    font-size: 0.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.browser-panel-controls[b-ssvm4uu4hn] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.browser-stop-btn[b-ssvm4uu4hn] {
    background: var(--color-error, #e74c3c);
    color: white;
    border: none;
    border-radius: var(--radius-sm, 6px);
    padding: 2px 10px;
    font-size: 0.7rem;
    cursor: pointer;
    transition: background 0.2s;
}

.browser-stop-btn:hover[b-ssvm4uu4hn] {
    background: #c0392b;
}

.collapse-icon[b-ssvm4uu4hn] {
    color: var(--text-secondary, #a0a0c0);
    font-size: 1rem;
    font-weight: bold;
    width: 16px;
    text-align: center;
}

.browser-panel-body[b-ssvm4uu4hn] {
    padding: 8px;
}

.browser-screenshot-container[b-ssvm4uu4hn] {
    position: relative;
    border-radius: var(--radius-md, 8px);
    overflow: hidden;
}

.browser-screenshot[b-ssvm4uu4hn] {
    width: 100%;
    max-height: 280px;
    object-fit: contain;
    display: block;
    border-radius: var(--radius-md, 8px);
    border: 1px solid var(--border-color, #2a2a4a);
    background: #000;
}

.browser-placeholder[b-ssvm4uu4hn] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80px;
    color: var(--text-secondary, #a0a0c0);
    font-size: 0.8rem;
}

.browser-approval-overlay[b-ssvm4uu4hn] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(2px);
}

.browser-approval-card[b-ssvm4uu4hn] {
    background: var(--bg-secondary, #1a1a2e);
    border: 1px solid var(--border-color, #2a2a4a);
    border-radius: var(--radius-lg, 12px);
    padding: 12px 16px;
    max-width: 320px;
    text-align: center;
}

.browser-approval-text[b-ssvm4uu4hn] {
    color: var(--text-primary, #e0e0e0);
    margin-bottom: 8px;
    font-size: 0.8rem;
}

.browser-approval-buttons[b-ssvm4uu4hn] {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.browser-status[b-ssvm4uu4hn] {
    padding: 4px 0;
    color: var(--text-secondary, #a0a0c0);
    font-size: 0.75rem;
    font-style: italic;
}

.browser-action-log[b-ssvm4uu4hn] {
    margin-top: 4px;
}

.browser-action-log summary[b-ssvm4uu4hn] {
    cursor: pointer;
    color: var(--text-secondary, #a0a0c0);
    font-size: 0.75rem;
    user-select: none;
}

.browser-action-log ul[b-ssvm4uu4hn] {
    margin: 2px 0 0;
    padding-left: 12px;
    color: var(--text-secondary, #a0a0c0);
    font-size: 0.7rem;
    list-style: none;
}

.browser-action-log li[b-ssvm4uu4hn] {
    padding: 1px 0;
    border-bottom: 1px solid var(--border-color, #2a2a4a);
}

.browser-action-log li:last-child[b-ssvm4uu4hn] {
    border-bottom: none;
}
/* /Components/DiffView.razor.rz.scp.css */
.diff-container[b-of6st7b7q6] {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    overflow: hidden;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1.5;
    max-height: 500px;
    overflow-y: auto;
}

.diff-line[b-of6st7b7q6] {
    display: flex;
    align-items: stretch;
    min-height: 1.5em;
}

.diff-line.unchanged[b-of6st7b7q6] {
    color: var(--text-secondary);
    background: transparent;
}

.diff-line.added[b-of6st7b7q6] {
    background: var(--success-subtle);
    color: var(--text-primary);
}

.diff-line.removed[b-of6st7b7q6] {
    background: var(--error-subtle);
    color: var(--text-primary);
    text-decoration: line-through;
    text-decoration-color: var(--error);
}

.diff-gutter[b-of6st7b7q6] {
    display: flex;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
    border-right: 1px solid var(--border-light);
    background: var(--bg-secondary);
    user-select: none;
}

.diff-line-number[b-of6st7b7q6] {
    display: inline-block;
    min-width: 3ch;
    text-align: right;
    padding: 0 var(--space-1);
    color: var(--text-muted);
    font-size: var(--text-xs);
}

.diff-line-number.old[b-of6st7b7q6] {
    border-right: 1px solid var(--border-light);
}

.diff-indicator[b-of6st7b7q6] {
    display: inline-block;
    width: 1.5ch;
    text-align: center;
    font-weight: var(--font-bold);
    padding: 0 var(--space-1);
}

.diff-line.added .diff-indicator[b-of6st7b7q6] {
    color: var(--success);
}

.diff-line.removed .diff-indicator[b-of6st7b7q6] {
    color: var(--error);
}

.diff-content[b-of6st7b7q6] {
    flex: 1;
    padding: 0 var(--space-2);
    white-space: pre-wrap;
    word-break: break-all;
}

.diff-collapse[b-of6st7b7q6] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3);
    background: var(--bg-tertiary);
    color: var(--text-muted);
    font-size: var(--text-xs);
    cursor: pointer;
    border-top: 1px solid var(--border-light);
    border-bottom: 1px solid var(--border-light);
    transition: background var(--duration-fast) var(--ease-out);
}

.diff-collapse:hover[b-of6st7b7q6] {
    background: var(--bg-secondary);
    color: var(--text-secondary);
}

.diff-collapse-icon[b-of6st7b7q6] {
    color: var(--accent-primary);
    font-weight: var(--font-bold);
}

.diff-collapse-text[b-of6st7b7q6] {
    font-style: italic;
}

.diff-empty[b-of6st7b7q6] {
    padding: var(--space-4);
    text-align: center;
    color: var(--text-muted);
    font-style: italic;
}
/* /Components/EmailAuditPanel.razor.rz.scp.css */
.eal-panel[b-n5pyokak99] {
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.eal-header[b-n5pyokak99] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
}

.eal-header-actions[b-n5pyokak99] {
    display: flex;
    gap: var(--space-2);
    flex-shrink: 0;
}

.eal-header h2[b-n5pyokak99] {
    margin: 0;
    font-size: var(--text-xl);
    color: var(--text-primary);
}

.eal-subtitle[b-n5pyokak99] {
    margin: 4px 0 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    max-width: 720px;
}

.eal-filters[b-n5pyokak99] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: flex-end;
    padding: var(--space-3);
    background: var(--bg-elevated);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
}

.eal-field[b-n5pyokak99] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    min-width: 140px;
}

.eal-field-grow[b-n5pyokak99] {
    flex: 1;
    min-width: 240px;
}

.eal-field select[b-n5pyokak99],
.eal-field input[b-n5pyokak99] {
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-sm);
    padding: 6px 8px;
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.eal-field select:focus[b-n5pyokak99],
.eal-field input:focus[b-n5pyokak99] {
    outline: none;
    border-color: var(--accent-primary);
}

.eal-btn[b-n5pyokak99] {
    padding: 6px 14px;
    font-size: var(--text-sm);
    border-radius: var(--radius-sm);
    cursor: pointer;
    border: 1px solid transparent;
    font-weight: 500;
}

.eal-btn:disabled[b-n5pyokak99] {
    opacity: 0.6;
    cursor: not-allowed;
}

.eal-btn-secondary[b-n5pyokak99] {
    background: var(--accent-primary);
    color: white;
}

.eal-btn-secondary:hover:not(:disabled)[b-n5pyokak99] {
    background: var(--accent-hover);
}

.eal-btn-ghost[b-n5pyokak99] {
    background: transparent;
    color: var(--text-secondary);
    border-color: var(--border-primary);
}

.eal-btn-ghost:hover:not(:disabled)[b-n5pyokak99] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

.eal-empty[b-n5pyokak99] {
    padding: var(--space-6);
    text-align: center;
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    background: var(--bg-elevated);
    border: 1px dashed var(--border-primary);
    border-radius: var(--radius-md);
}

.eal-tablewrap[b-n5pyokak99] {
    overflow-x: auto;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background: var(--bg-elevated);
}

.eal-table[b-n5pyokak99] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
}

.eal-table thead[b-n5pyokak99] {
    background: var(--bg-secondary);
}

.eal-table th[b-n5pyokak99] {
    text-align: left;
    padding: 10px 12px;
    font-weight: 600;
    color: var(--text-secondary);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--border-primary);
}

.eal-table td[b-n5pyokak99] {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border-primary);
    color: var(--text-primary);
    vertical-align: top;
}

.eal-table tbody tr:last-child td[b-n5pyokak99] {
    border-bottom: none;
}

.eal-table tbody tr:hover[b-n5pyokak99] {
    background: var(--bg-tertiary);
}

.eal-row-clickable[b-n5pyokak99] {
    cursor: pointer;
}

.eal-row-clickable:hover[b-n5pyokak99] {
    background: var(--bg-accent-subtle, var(--bg-tertiary));
}

.eal-date[b-n5pyokak99] {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

.eal-mono[b-n5pyokak99] {
    font-family: var(--font-mono, monospace);
    font-size: var(--text-xs);
}

.eal-num[b-n5pyokak99] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.eal-ellipsis[b-n5pyokak99] {
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eal-error[b-n5pyokak99] {
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

.eal-user[b-n5pyokak99] {
    font-weight: 500;
}

.eal-user-sub[b-n5pyokak99] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.eal-badge[b-n5pyokak99] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.eal-badge-sent[b-n5pyokak99] {
    background: #d1fae5;
    color: #065f46;
}

.eal-badge-blocked[b-n5pyokak99] {
    background: #fee2e2;
    color: #7f1d1d;
}

.eal-badge-failed[b-n5pyokak99] {
    background: #fef3c7;
    color: #78350f;
}

.eal-pager[b-n5pyokak99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.eal-pager-info[b-n5pyokak99] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.eal-pager-btns[b-n5pyokak99] {
    display: flex;
    gap: var(--space-2);
}
/* /Components/OtpInput.razor.rz.scp.css */
.otp-input-container[b-ikwawn9fhu] {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin: 16px 0;
}

.otp-digit[b-ikwawn9fhu] {
    width: 44px;
    height: 52px;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    font-family: monospace;
    border: 2px solid var(--border-primary, rgba(255, 255, 255, 0.12));
    border-radius: var(--radius-md, 8px);
    background: var(--bg-secondary, #1a1a2e);
    color: var(--text-primary, #e0e0f0);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    caret-color: var(--accent-primary, #6366f1);
}

.otp-digit:focus[b-ikwawn9fhu] {
    border-color: var(--accent-primary, #6366f1);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.otp-digit.otp-error[b-ikwawn9fhu] {
    border-color: var(--danger, #ef4444);
    animation: shake-b-ikwawn9fhu 0.3s ease-in-out;
}

.otp-digit:disabled[b-ikwawn9fhu] {
    opacity: 0.5;
    cursor: not-allowed;
}

@keyframes shake-b-ikwawn9fhu {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}

@media (max-width: 480px) {
    .otp-digit[b-ikwawn9fhu] {
        width: 38px;
        height: 46px;
        font-size: 18px;
    }

    .otp-input-container[b-ikwawn9fhu] {
        gap: 6px;
    }
}
/* /Components/PilotExpiryBanner.razor.rz.scp.css */
.pilot-banner[b-3syosptykr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    animation: bannerSlide-b-3syosptykr var(--duration-normal) var(--ease-out) both;
}

@keyframes bannerSlide-b-3syosptykr {
    from { opacity: 0; transform: translateY(-100%); }
    to { opacity: 1; transform: translateY(0); }
}

.pilot-banner-content[b-3syosptykr] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.pilot-banner-icon[b-3syosptykr] {
    flex-shrink: 0;
}

.pilot-banner-message[b-3syosptykr] {
    line-height: var(--leading-normal);
}

.pilot-banner-dismiss[b-3syosptykr] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    opacity: 0.7;
    transition: opacity var(--duration-fast) var(--ease-out);
    color: inherit;
    flex-shrink: 0;
}

.pilot-banner-dismiss:hover[b-3syosptykr] {
    opacity: 1;
}

/* Warning levels */
.pilot-info[b-3syosptykr] {
    background: #dbeafe;
    color: #1e40af;
    border-bottom: 1px solid #93c5fd;
}

.pilot-warning[b-3syosptykr] {
    background: #fef3c7;
    color: #92400e;
    border-bottom: 1px solid #fcd34d;
}

.pilot-urgent[b-3syosptykr] {
    background: #ffedd5;
    color: #9a3412;
    border-bottom: 1px solid #fdba74;
}

.pilot-critical[b-3syosptykr] {
    background: #fee2e2;
    color: #991b1b;
    border-bottom: 1px solid #fca5a5;
}
/* /Components/SophiaWidget.razor.rz.scp.css */
/* SophiaWidget Scoped Styles */

.sophia-widget[b-g1rhxgc2da] {
    background: var(--bg-primary);
    border: none;
    border-radius: 0;
    overflow: hidden;
    min-height: 80px;
    display: flex;
    flex-direction: column;
}

/* Header */
.widget-header[b-g1rhxgc2da] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-primary);
}

.widget-title[b-g1rhxgc2da] {
    margin: 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.widget-actions[b-g1rhxgc2da] {
    display: flex;
    gap: var(--space-1);
}

.widget-refresh-btn[b-g1rhxgc2da] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    color: var(--text-tertiary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.widget-refresh-btn:hover[b-g1rhxgc2da] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

.widget-regenerate-btn[b-g1rhxgc2da] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    color: var(--text-tertiary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.widget-regenerate-btn:hover[b-g1rhxgc2da] {
    background: rgba(99, 102, 241, 0.10);
    color: var(--accent-primary);
}

.refreshing-badge[b-g1rhxgc2da] {
    font-size: var(--text-xs);
    color: var(--accent-primary);
    font-weight: var(--font-medium);
    animation: pulse-b-g1rhxgc2da 1.5s ease-in-out infinite;
}

@keyframes pulse-b-g1rhxgc2da {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.cache-time[b-g1rhxgc2da] {
    font-size: 10px;
    color: var(--text-tertiary);
    white-space: nowrap;
}

.recipe-badge[b-g1rhxgc2da] {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #10b981;
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.25);
    padding: 2px 6px 2px 5px;
    border-radius: 10px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    line-height: 1;
    cursor: help;
}

.recipe-badge svg[b-g1rhxgc2da] {
    flex-shrink: 0;
}

.recipe-badge.just-used[b-g1rhxgc2da] {
    animation: recipe-pulse-b-g1rhxgc2da 1.2s ease-out;
}

@keyframes recipe-pulse-b-g1rhxgc2da {
    0% {
        background: rgba(16, 185, 129, 0.4);
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5);
    }
    100% {
        background: rgba(16, 185, 129, 0.12);
        box-shadow: 0 0 0 6px rgba(16, 185, 129, 0);
    }
}

/* Body */
.widget-body[b-g1rhxgc2da] {
    flex: 1;
    padding: var(--space-4);
    background: var(--bg-primary);
}

/* Idle state */
.widget-idle[b-g1rhxgc2da] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
}

.widget-run-btn[b-g1rhxgc2da] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background: var(--accent-gradient);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.widget-run-btn:hover[b-g1rhxgc2da] {
    background: var(--accent-gradient-hover);
    transform: translateY(-1px);
}

/* Loading state */
.widget-loading[b-g1rhxgc2da] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    min-height: 60px;
    color: var(--text-secondary);
    font-size: var(--text-sm);
}

.widget-spinner[b-g1rhxgc2da] {
    width: 18px;
    height: 18px;
    border: 2px solid var(--border-secondary);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: sophia-spin-b-g1rhxgc2da 0.75s linear infinite;
}

@keyframes sophia-spin-b-g1rhxgc2da {
    to {
        transform: rotate(360deg);
    }
}

/* Content area */
.widget-content[b-g1rhxgc2da] {
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--text-primary);
    overflow-wrap: break-word;
}

.widget-content :deep(p)[b-g1rhxgc2da] {
    margin: 0 0 var(--space-2) 0;
}

.widget-content :deep(p:last-child)[b-g1rhxgc2da] {
    margin-bottom: 0;
}

/* Neutralize Bootstrap .table class inside widgets */
.widget-body :deep(table)[b-g1rhxgc2da],
.widget-body :deep(.table)[b-g1rhxgc2da] {
    --bs-table-bg: transparent;
    --bs-table-color: var(--text-primary);
    --bs-table-border-color: var(--border-primary);
    --bs-table-accent-bg: transparent;
    --bs-table-striped-bg: var(--bg-secondary);
    --bs-table-striped-color: var(--text-primary);
    --bs-table-hover-bg: var(--bg-tertiary);
    --bs-table-hover-color: var(--text-primary);
    margin-bottom: 0;
}

.widget-body :deep(table > :not(caption) > * > *)[b-g1rhxgc2da],
.widget-body :deep(.table > :not(caption) > * > *)[b-g1rhxgc2da] {
    background-color: transparent !important;
    box-shadow: none !important;
    color: var(--text-primary);
}

.widget-content :deep(table)[b-g1rhxgc2da] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-xs);
    margin: var(--space-2) 0;
}

.widget-content :deep(th)[b-g1rhxgc2da],
.widget-content :deep(td)[b-g1rhxgc2da] {
    padding: var(--space-1) var(--space-2);
    border: 1px solid var(--border-primary);
    text-align: left;
}

.widget-content :deep(th)[b-g1rhxgc2da] {
    background: var(--bg-tertiary) !important;
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
}

.widget-content :deep(td)[b-g1rhxgc2da] {
    color: var(--text-primary);
    background: transparent !important;
}

.widget-content :deep(tbody tr:nth-child(even) td)[b-g1rhxgc2da] {
    background: var(--bg-secondary) !important;
}

.widget-content :deep(tbody tr:hover td)[b-g1rhxgc2da] {
    background: var(--bg-tertiary) !important;
}

.widget-content :deep(ul)[b-g1rhxgc2da],
.widget-content :deep(ol)[b-g1rhxgc2da] {
    margin: var(--space-1) 0;
    padding-left: var(--space-4);
}

.widget-content :deep(strong)[b-g1rhxgc2da] {
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.widget-content :deep(code)[b-g1rhxgc2da] {
    background: var(--bg-tertiary);
    padding: 1px var(--space-1);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
}

/* Error state */
.widget-error[b-g1rhxgc2da] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
    min-height: 60px;
    justify-content: center;
    text-align: center;
}

.error-text[b-g1rhxgc2da] {
    font-size: var(--text-sm);
    color: var(--error);
}

.widget-retry-btn[b-g1rhxgc2da] {
    padding: var(--space-1) var(--space-3);
    background: none;
    border: 1px solid var(--error);
    border-radius: var(--radius-md);
    color: var(--error);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.widget-retry-btn:hover[b-g1rhxgc2da] {
    background: var(--error-subtle);
}
/* /Components/SpaceFilterBar.razor.rz.scp.css */
.filter-bar[b-pwazh6nple] {
    display: flex;
    gap: var(--space-3);
    align-items: flex-end;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    flex-wrap: wrap;
}

.filter-group[b-pwazh6nple] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.filter-group label[b-pwazh6nple] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-group select[b-pwazh6nple],
.filter-group input[b-pwazh6nple] {
    padding: var(--space-1) var(--space-2);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    font-size: 0.8rem;
    min-width: 140px;
}

.filter-group select:focus[b-pwazh6nple],
.filter-group input:focus[b-pwazh6nple] {
    outline: none;
    border-color: var(--accent-primary);
}

.date-range-group[b-pwazh6nple] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.custom-range[b-pwazh6nple] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.custom-range input[type="date"][b-pwazh6nple] {
    padding: var(--space-1) var(--space-2);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    font-size: 0.75rem;
}

.custom-range input[type="date"]:focus[b-pwazh6nple] {
    outline: none;
    border-color: var(--accent-primary);
}

.range-separator[b-pwazh6nple] {
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.filter-actions[b-pwazh6nple] {
    margin-left: auto;
}

.filter-clear[b-pwazh6nple] {
    background: none;
    border: none;
    color: var(--text-tertiary);
    font-size: 0.8rem;
    cursor: pointer;
    padding: var(--space-1) var(--space-2);
    transition: color 0.15s;
}

.filter-clear:hover[b-pwazh6nple] { color: var(--accent-primary); }
/* /Components/SpaceHighlights.razor.rz.scp.css */
.highlights-panel[b-b45gd870xb] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    overflow: hidden;
}

.highlights-toggle[b-b45gd870xb] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
    transition: background 0.15s;
}

.highlights-toggle:hover[b-b45gd870xb] { background: var(--bg-tertiary); }

.highlights-icon[b-b45gd870xb] { color: #f59e0b; display: flex; }

.stale-badge[b-b45gd870xb] {
    font-size: 0.65rem;
    font-weight: 600;
    background: #fef3c7;
    color: #92400e;
    padding: 1px 6px;
    border-radius: 10px;
    text-transform: uppercase;
}

.toggle-arrow[b-b45gd870xb] { margin-left: auto; font-size: 0.7rem; color: var(--text-tertiary); }

.highlights-body[b-b45gd870xb] { padding: 0 var(--space-4) var(--space-4); }

.highlights-loading[b-b45gd870xb] {
    color: var(--text-secondary);
    font-size: 0.85rem;
    padding: var(--space-2) 0;
}

.highlights-list[b-b45gd870xb] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.highlights-list li[b-b45gd870xb] {
    font-size: 0.85rem;
    color: var(--text-primary);
    padding-left: var(--space-4);
    position: relative;
    line-height: 1.5;
}

.highlights-list li[b-b45gd870xb]::before {
    content: "\2022";
    color: var(--accent-primary);
    font-weight: bold;
    position: absolute;
    left: var(--space-1);
}

.highlights-footer[b-b45gd870xb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--space-3);
    padding-top: var(--space-2);
    border-top: 1px solid var(--border-light);
}

.highlights-time[b-b45gd870xb] { font-size: 0.7rem; color: var(--text-tertiary); }

.highlights-refresh[b-b45gd870xb] {
    background: none;
    border: none;
    color: var(--accent-primary);
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    padding: var(--space-1) var(--space-2);
}

.highlights-refresh:hover[b-b45gd870xb] { text-decoration: underline; }

.highlights-empty[b-b45gd870xb] {
    color: var(--text-secondary);
    font-size: 0.85rem;
    margin: 0 0 var(--space-2);
}
/* /Components/SpaceShareDialog.razor.rz.scp.css */
.share-dialog[b-8zbdumwi30] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    width: 100%;
    max-width: 520px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-height: 80vh;
    overflow-y: auto;
}

.share-dialog h2[b-8zbdumwi30] { font-size: 1.25rem; font-weight: 700; margin: 0 0 var(--space-4); color: var(--text-primary); }
.share-dialog h3[b-8zbdumwi30] { font-size: 0.8rem; font-weight: 600; color: var(--text-secondary); margin: 0 0 var(--space-2); text-transform: uppercase; letter-spacing: 0.05em; }

.share-form[b-8zbdumwi30] { margin-bottom: var(--space-4); }

.share-input-row[b-8zbdumwi30] { display: flex; gap: var(--space-2); }

.share-input[b-8zbdumwi30] {
    flex: 1;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.85rem;
}

.share-input:focus[b-8zbdumwi30] { outline: none; border-color: var(--accent-primary); }

.share-permission-select[b-8zbdumwi30] {
    padding: var(--space-2) var(--space-2);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.8rem;
}

.share-error[b-8zbdumwi30] { color: #991b1b; font-size: 0.8rem; margin-top: var(--space-2); }

.shares-list[b-8zbdumwi30] { margin-top: var(--space-4); }

.share-row[b-8zbdumwi30] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-light);
}

.share-user[b-8zbdumwi30] { flex: 1; }
.share-name[b-8zbdumwi30] { display: block; font-size: 0.85rem; font-weight: 500; color: var(--text-primary); }
.share-email[b-8zbdumwi30] { display: block; font-size: 0.75rem; color: var(--text-tertiary); }
.share-perm[b-8zbdumwi30] { font-size: 0.75rem; color: var(--text-secondary); }

.share-revoke[b-8zbdumwi30] {
    background: none;
    border: none;
    color: #991b1b;
    font-size: 0.75rem;
    cursor: pointer;
    padding: var(--space-1) var(--space-2);
}

.share-revoke:hover[b-8zbdumwi30] { text-decoration: underline; }

.btn-primary[b-8zbdumwi30] { background: var(--accent-primary); color: white; border: none; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: 0.8rem; font-weight: 600; cursor: pointer; }
.btn-primary:disabled[b-8zbdumwi30] { opacity: 0.5; cursor: not-allowed; }
.btn-secondary[b-8zbdumwi30] { background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--border-light); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: 0.8rem; cursor: pointer; }

.dialog-actions[b-8zbdumwi30] { display: flex; justify-content: flex-end; margin-top: var(--space-4); }
/* /Components/SpaceTabBar.razor.rz.scp.css */
.tab-bar[b-o6hx0fj1xr] {
    display: flex;
    gap: var(--space-1);
    border-bottom: 1px solid var(--border-light);
    margin-bottom: var(--space-4);
    overflow-x: auto;
    padding-bottom: 0;
}

.tab-item[b-o6hx0fj1xr] {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: var(--space-2) var(--space-3);
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-tertiary);
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.tab-item:hover[b-o6hx0fj1xr] { color: var(--text-primary); }

.tab-item.active[b-o6hx0fj1xr] {
    color: var(--accent-primary);
    border-bottom-color: var(--accent-primary);
    font-weight: 600;
}

.tab-icon[b-o6hx0fj1xr] { font-size: 0.9rem; }

.tab-add[b-o6hx0fj1xr] {
    background: none;
    border: none;
    padding: var(--space-2) var(--space-3);
    font-size: 1rem;
    color: var(--text-tertiary);
    cursor: pointer;
    transition: color 0.15s;
}

.tab-add:hover[b-o6hx0fj1xr] { color: var(--accent-primary); }
/* /Components/ThemeSwitcher.razor.rz.scp.css */
/* Theme Switcher Component Styles */

.theme-switcher[b-qxumvaiwvb] {
    position: relative;
}

.theme-trigger[b-qxumvaiwvb] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    height: 32px;
    padding: 0 var(--space-2) 0 var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.theme-trigger:hover[b-qxumvaiwvb] {
    background: var(--bg-tertiary);
    border-color: var(--border-secondary);
}

.theme-trigger-icon[b-qxumvaiwvb] {
    font-size: var(--text-base);
    line-height: 1;
}

.theme-trigger-chevron[b-qxumvaiwvb] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    transition: transform var(--duration-fast) var(--ease-out);
}

.theme-switcher.open .theme-trigger-chevron[b-qxumvaiwvb] {
    transform: rotate(180deg);
}

/* Dropdown */
.theme-dropdown[b-qxumvaiwvb] {
    position: absolute;
    top: calc(100% + var(--space-2));
    right: 0;
    width: 220px;
    background: var(--bg-elevated);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    z-index: 100;
    animation: slideDown-b-qxumvaiwvb var(--duration-normal) var(--ease-spring);
    overflow: hidden;
}

@keyframes slideDown-b-qxumvaiwvb {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.theme-dropdown-header[b-qxumvaiwvb] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    border-bottom: 1px solid var(--border-light);
}

.theme-option[b-qxumvaiwvb] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    padding: var(--space-2) var(--space-3);
    background: transparent;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-out);
}

.theme-option:hover[b-qxumvaiwvb] {
    background: var(--bg-secondary);
}

.theme-option.active[b-qxumvaiwvb] {
    background: var(--accent-subtle);
}

.theme-option-icon[b-qxumvaiwvb] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: var(--text-base);
    flex-shrink: 0;
}

.theme-option-content[b-qxumvaiwvb] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.theme-option-name[b-qxumvaiwvb] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.theme-option-description[b-qxumvaiwvb] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.theme-option-check[b-qxumvaiwvb] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-primary);
    flex-shrink: 0;
}

/* Backdrop for closing dropdown */
.theme-backdrop[b-qxumvaiwvb] {
    position: fixed;
    inset: 0;
    z-index: 99;
}
/* /Components/ToastContainer.razor.rz.scp.css */
.toast-container[b-6tto77736p] {
    position: fixed;
    top: var(--space-4);
    right: var(--space-4);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    pointer-events: none;
    max-width: 380px;
    width: 100%;
}

.toast[b-6tto77736p] {
    pointer-events: auto;
    background: var(--bg-elevated);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    transform: translateX(0);
    opacity: 1;
}

.toast-enter[b-6tto77736p] {
    animation: toast-slide-in-b-6tto77736p 0.3s ease-out;
}

.toast-exit[b-6tto77736p] {
    animation: toast-slide-out-b-6tto77736p 0.3s ease-in forwards;
}

@keyframes toast-slide-in-b-6tto77736p {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes toast-slide-out-b-6tto77736p {
    from {
        transform: translateX(0);
        opacity: 1;
    }
    to {
        transform: translateX(100%);
        opacity: 0;
    }
}

.toast-content[b-6tto77736p] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
}

.toast-icon[b-6tto77736p] {
    flex-shrink: 0;
    color: var(--accent-primary);
    margin-top: 2px;
}

.toast-body[b-6tto77736p] {
    flex: 1;
    min-width: 0;
}

.toast-title[b-6tto77736p] {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.4;
}

.toast-message[b-6tto77736p] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    line-height: 1.4;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.toast-actions[b-6tto77736p] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0;
}

.toast-action-btn[b-6tto77736p] {
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-sm);
    padding: var(--space-1) var(--space-3);
    font-size: var(--text-xs);
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}

.toast-action-btn:hover[b-6tto77736p] {
    background: var(--accent-hover);
}

.toast-close-btn[b-6tto77736p] {
    background: transparent;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: var(--space-1);
    border-radius: var(--radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s ease, background 0.15s ease;
}

.toast-close-btn:hover[b-6tto77736p] {
    color: var(--text-primary);
    background: var(--bg-tertiary);
}

.toast-progress[b-6tto77736p] {
    height: 2px;
    background: var(--bg-tertiary);
}

.toast-progress-bar[b-6tto77736p] {
    height: 100%;
    background: var(--accent-primary);
    animation: toast-progress-shrink-b-6tto77736p linear forwards;
    transform-origin: left;
}

@keyframes toast-progress-shrink-b-6tto77736p {
    from {
        width: 100%;
    }
    to {
        width: 0%;
    }
}

.toast-error[b-6tto77736p] {
    border-color: #dc2626;
    background: #fef2f2;
    box-shadow: 0 10px 25px -5px rgba(220, 38, 38, 0.25), 0 4px 10px -2px rgba(220, 38, 38, 0.15);
}

.toast-error .toast-icon[b-6tto77736p] {
    color: #dc2626;
}

.toast-error .toast-title[b-6tto77736p] {
    color: #7f1d1d;
}

.toast-error .toast-message[b-6tto77736p] {
    color: #991b1b;
}

.toast-error .toast-progress-bar[b-6tto77736p] {
    background: #dc2626;
}

.toast-warning[b-6tto77736p] {
    border-color: #d97706;
    background: #fffbeb;
}

.toast-warning .toast-icon[b-6tto77736p] {
    color: #d97706;
}

.toast-warning .toast-progress-bar[b-6tto77736p] {
    background: #d97706;
}
/* /Components/WidgetChartRenderer.razor.rz.scp.css */
.widget-chart-container[b-tnu67msugl] {
    width: 100%;
    min-height: 180px;
    padding: var(--space-1) 0;
}

/* Ensure ApexCharts SVG fills container width */
.widget-chart-container :deep(.apexcharts-canvas)[b-tnu67msugl] {
    width: 100% !important;
}

.widget-chart-container :deep(.apexcharts-svg)[b-tnu67msugl] {
    overflow: visible;
}
/* /Components/WidgetComparisonRenderer.razor.rz.scp.css */
.comparison-container[b-o2x954eiil] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.comparison-header[b-o2x954eiil] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: 2px solid var(--border-primary);
}

.comparison-col-label[b-o2x954eiil] {
    font-size: 10px;
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.comparison-row[b-o2x954eiil] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: 1px solid var(--border-light);
}

.comparison-row:last-child[b-o2x954eiil] {
    border-bottom: none;
}

.comparison-cell[b-o2x954eiil] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.change-cell[b-o2x954eiil] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.metric-name[b-o2x954eiil] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.metric-value[b-o2x954eiil] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.metric-value.previous[b-o2x954eiil] {
    color: var(--text-secondary);
    font-weight: var(--font-normal);
}

.change-badge[b-o2x954eiil] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
    padding: 2px var(--space-2);
    border-radius: var(--radius-sm);
}

.change-badge.trend-up[b-o2x954eiil] {
    color: var(--success);
    background: color-mix(in srgb, var(--success) 10%, transparent);
}

.change-badge.trend-down[b-o2x954eiil] {
    color: var(--error);
    background: color-mix(in srgb, var(--error) 10%, transparent);
}

.change-badge.trend-flat[b-o2x954eiil] {
    color: var(--text-tertiary);
    background: var(--bg-tertiary);
}

.clickable[b-o2x954eiil] { cursor: pointer; transition: background 0.15s; }
.clickable:hover[b-o2x954eiil] { background: rgba(99, 102, 241, 0.06); }
/* /Components/WidgetGaugeRenderer.razor.rz.scp.css */
.gauge-container[b-eoqxvuxkwu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: var(--space-1);
    padding: var(--space-2) 0;
}

.gauge-svg[b-eoqxvuxkwu] {
    width: 160px;
    height: 110px;
}

.gauge-bg[b-eoqxvuxkwu] {
    fill: none;
    stroke: var(--border-secondary);
    stroke-width: 8;
    stroke-linecap: round;
}

.gauge-fill[b-eoqxvuxkwu] {
    fill: none;
    stroke-width: 8;
    stroke-linecap: round;
    transition: stroke-dashoffset 0.6s ease;
}

.gauge-fill.threshold-ok[b-eoqxvuxkwu] {
    stroke: var(--success);
}

.gauge-fill.threshold-warning[b-eoqxvuxkwu] {
    stroke: var(--warning);
}

.gauge-fill.threshold-critical[b-eoqxvuxkwu] {
    stroke: var(--error);
}

.gauge-target[b-eoqxvuxkwu] {
    stroke: var(--text-tertiary);
    stroke-width: 2;
    stroke-dasharray: 3 2;
}

.gauge-value-row[b-eoqxvuxkwu] {
    display: flex;
    align-items: baseline;
    gap: 2px;
}

.gauge-value[b-eoqxvuxkwu] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.gauge-value.threshold-ok[b-eoqxvuxkwu] {
    color: var(--success);
}

.gauge-value.threshold-warning[b-eoqxvuxkwu] {
    color: var(--warning);
}

.gauge-value.threshold-critical[b-eoqxvuxkwu] {
    color: var(--error);
}

.gauge-unit[b-eoqxvuxkwu] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.gauge-label[b-eoqxvuxkwu] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.gauge-target-label[b-eoqxvuxkwu] {
    font-size: 10px;
    color: var(--text-muted);
}

.clickable[b-eoqxvuxkwu] { cursor: pointer; transition: background 0.15s; }
.clickable:hover[b-eoqxvuxkwu] { background: rgba(99, 102, 241, 0.06); }
/* /Components/WidgetInsightRenderer.razor.rz.scp.css */
.insight-container[b-2j1witd5nu] {
    padding: var(--space-1) 0 var(--space-1) var(--space-3);
    border-left: 3px solid var(--text-tertiary);
}

.insight-container.sentiment-positive[b-2j1witd5nu] {
    border-left-color: var(--success);
}

.insight-container.sentiment-negative[b-2j1witd5nu] {
    border-left-color: var(--error);
}

.insight-container.sentiment-warning[b-2j1witd5nu] {
    border-left-color: var(--warning);
}

.insight-container.sentiment-neutral[b-2j1witd5nu] {
    border-left-color: var(--text-tertiary);
}

.insight-summary[b-2j1witd5nu] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    line-height: 1.6;
    margin: 0 0 var(--space-2) 0;
}

.insight-points[b-2j1witd5nu] {
    margin: 0 0 var(--space-2) 0;
    padding-left: var(--space-4);
    list-style: none;
}

.insight-points li[b-2j1witd5nu] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    line-height: 1.5;
    padding: var(--space-1) 0;
    position: relative;
}

.insight-points li[b-2j1witd5nu]::before {
    content: "\2022";
    color: var(--text-tertiary);
    position: absolute;
    left: calc(-1 * var(--space-3));
}

.insight-recommendation[b-2j1witd5nu] {
    background: var(--accent-subtle);
    border: 1px solid var(--accent-light);
    border-radius: var(--radius-md);
    padding: var(--space-2) var(--space-3);
    margin-top: var(--space-2);
}

.recommendation-label[b-2j1witd5nu] {
    display: block;
    font-size: 10px;
    font-weight: var(--font-semibold);
    color: var(--accent-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: var(--space-1);
}

.insight-recommendation p[b-2j1witd5nu] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0;
}
/* /Components/WidgetKpiRenderer.razor.rz.scp.css */
.kpi-container[b-fonxmh0no0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: var(--space-1);
    padding: var(--space-2) 0;
}

.kpi-label[b-fonxmh0no0] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.kpi-value[b-fonxmh0no0] {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.kpi-trend-row[b-fonxmh0no0] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-1);
}

.kpi-trend[b-fonxmh0no0] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
}

.kpi-trend.trend-up[b-fonxmh0no0] {
    color: var(--success);
}

.kpi-trend.trend-down[b-fonxmh0no0] {
    color: var(--error);
}

.kpi-trend.trend-flat[b-fonxmh0no0] {
    color: var(--text-tertiary);
}

.kpi-period[b-fonxmh0no0] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.kpi-secondary[b-fonxmh0no0] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    margin-top: var(--space-1);
}

.kpi-secondary-label[b-fonxmh0no0] {
    color: var(--text-tertiary);
}

.clickable[b-fonxmh0no0] { cursor: pointer; transition: background 0.15s; }
.clickable:hover[b-fonxmh0no0] { background: rgba(99, 102, 241, 0.06); }
/* /Components/WidgetListRenderer.razor.rz.scp.css */
.list-container[b-zge7wh9d2g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-1) 0;
}

.list-title[b-zge7wh9d2g] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.list-items[b-zge7wh9d2g] {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: 280px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border-secondary) transparent;
}

.list-items[b-zge7wh9d2g]::-webkit-scrollbar {
    width: 6px;
}

.list-items[b-zge7wh9d2g]::-webkit-scrollbar-track {
    background: transparent;
}

.list-items[b-zge7wh9d2g]::-webkit-scrollbar-thumb {
    background: var(--border-secondary);
    border-radius: 3px;
}

.list-item[b-zge7wh9d2g] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: 1px solid var(--border-light);
}

.list-item:last-child[b-zge7wh9d2g] {
    border-bottom: none;
}

.list-dot[b-zge7wh9d2g] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.list-dot.dot-positive[b-zge7wh9d2g] {
    background: var(--success);
}

.list-dot.dot-negative[b-zge7wh9d2g] {
    background: var(--error);
}

.list-dot.dot-warning[b-zge7wh9d2g] {
    background: var(--warning);
}

.list-dot.dot-neutral[b-zge7wh9d2g] {
    background: var(--text-muted);
}

.list-item-content[b-zge7wh9d2g] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.list-item-title[b-zge7wh9d2g] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.list-item-subtitle[b-zge7wh9d2g] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.list-item-value[b-zge7wh9d2g] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
    margin-left: auto;
}

.clickable[b-zge7wh9d2g] { cursor: pointer; transition: background 0.15s; }
.clickable:hover[b-zge7wh9d2g] { background: rgba(99, 102, 241, 0.06); }
/* /Components/WidgetScorecardRenderer.razor.rz.scp.css */
.scorecard-container[b-xthsems9it] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-1) 0;
}

.scorecard-title[b-xthsems9it] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.scorecard-grid[b-xthsems9it] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: var(--space-2);
}

.scorecard-card[b-xthsems9it] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-light);
}

.sc-label[b-xthsems9it] {
    font-size: 10px;
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sc-value[b-xthsems9it] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.sc-trend-row[b-xthsems9it] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: 2px;
}

.sc-trend[b-xthsems9it] {
    font-size: 10px;
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
}

.sc-trend.trend-up[b-xthsems9it] {
    color: var(--success);
}

.sc-trend.trend-down[b-xthsems9it] {
    color: var(--error);
}

.sc-trend.trend-flat[b-xthsems9it] {
    color: var(--text-tertiary);
}

.sc-period[b-xthsems9it] {
    font-size: 10px;
    color: var(--text-muted);
}

.clickable[b-xthsems9it] { cursor: pointer; transition: background 0.15s; }
.clickable:hover[b-xthsems9it] { background: rgba(99, 102, 241, 0.06); }
/* /Components/WidgetTableRenderer.razor.rz.scp.css */
/* Scrollable wrapper */
.widget-table-wrap[b-wc2hl9ix68] {
    max-height: 320px;
    overflow-y: auto;
    overflow-x: auto;
    /* Firefox */
    scrollbar-width: thin;
    scrollbar-color: var(--border-secondary) transparent;
}

/* Chrome / Edge / Safari */
.widget-table-wrap[b-wc2hl9ix68]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.widget-table-wrap[b-wc2hl9ix68]::-webkit-scrollbar-track {
    background: transparent;
}

.widget-table-wrap[b-wc2hl9ix68]::-webkit-scrollbar-thumb {
    background: var(--border-secondary);
    border-radius: 3px;
}

.widget-table-wrap[b-wc2hl9ix68]::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

/* CSS Grid table — column template set via inline style */
.widget-table[b-wc2hl9ix68] {
    display: grid;
    width: 100%;
    min-width: max-content;
}

/* Header row — display:contents so children participate in parent grid */
.widget-thead[b-wc2hl9ix68] {
    display: contents;
}

/* Header cells */
.widget-th[b-wc2hl9ix68] {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: var(--space-2) var(--space-3);
    font-size: 10px;
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: var(--bg-tertiary);
    border-bottom: 2px solid var(--border-primary);
    white-space: nowrap;
}

/* Body cells — explicit background on every cell to prevent inheritance */
.widget-td[b-wc2hl9ix68] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-xs);
    color: var(--text-primary);
    background: var(--bg-primary);
    border-bottom: 1px solid var(--border-light);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Alternating row background */
.widget-td.row-even[b-wc2hl9ix68] {
    background: var(--bg-secondary);
}

/* Column alignment */
.col-left[b-wc2hl9ix68] {
    text-align: left;
}

.col-right[b-wc2hl9ix68] {
    text-align: right;
}

.col-center[b-wc2hl9ix68] {
    text-align: center;
}

/* First column emphasis */
.cell-name[b-wc2hl9ix68] {
    font-weight: var(--font-medium);
}

.clickable[b-wc2hl9ix68] { cursor: pointer; transition: background 0.15s; }
.clickable:hover[b-wc2hl9ix68] { background: rgba(99, 102, 241, 0.06); }
/* /Layout/AppHeader.razor.rz.scp.css */
/* App Header - Linear-Inspired Navigation */

.app-header[b-m8p03ubu9p] {
    height: 52px;
    background: var(--bg-primary);
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: center;
    padding: 0 var(--space-4);
    position: sticky;
    top: 0;
    z-index: 100;
    gap: var(--space-4);
}

/* Brand Section */
.header-brand[b-m8p03ubu9p] {
    flex-shrink: 0;
}

.brand-link[b-m8p03ubu9p] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    text-decoration: none;
    padding: var(--space-1);
    border-radius: var(--radius-md);
    transition: background-color var(--duration-fast) var(--ease-out);
}

.brand-link:hover[b-m8p03ubu9p] {
    background-color: var(--bg-secondary);
}

.brand-icon[b-m8p03ubu9p] {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-md);
    background: var(--accent-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-bold);
    font-size: var(--text-sm);
}

.brand-logo[b-m8p03ubu9p] {
    height: 76px;
    width: auto;
}

.brand-name[b-m8p03ubu9p] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
}

/* Navigation */
.header-nav[b-m8p03ubu9p] {
    flex: 1;
    display: flex;
    justify-content: center;
    gap: var(--space-1);
}

.nav-link[b-m8p03ubu9p] {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
    text-decoration: none;
    font-weight: var(--font-medium);
    font-size: var(--text-sm);
    border-radius: var(--radius-md);
    transition: all var(--duration-fast) var(--ease-out);
    position: relative;
}

.nav-link:hover[b-m8p03ubu9p] {
    color: var(--text-primary);
    background-color: var(--bg-secondary);
}

.nav-link.active[b-m8p03ubu9p] {
    color: var(--text-primary);
    background-color: var(--bg-tertiary);
}

/* Subtle active indicator */
.nav-link.active[b-m8p03ubu9p]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 2px;
    background: var(--accent-primary);
    border-radius: var(--radius-full);
}

.nav-link.admin-link[b-m8p03ubu9p] {
    color: var(--accent-primary);
}

.nav-link.admin-link:hover[b-m8p03ubu9p] {
    background-color: var(--accent-subtle);
}

.nav-link.admin-link.active[b-m8p03ubu9p] {
    color: var(--accent-primary);
    background-color: var(--accent-subtle);
}

/* Spend Indicator */
.spend-indicator[b-m8p03ubu9p] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    text-decoration: none;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    transition: background-color var(--duration-fast) var(--ease-out);
    min-width: 100px;
    cursor: pointer;
}

.spend-indicator:hover[b-m8p03ubu9p] {
    background-color: var(--bg-secondary);
}

.spend-bar-track[b-m8p03ubu9p] {
    width: 100%;
    height: 3px;
    background: var(--border-light);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.spend-bar-fill[b-m8p03ubu9p] {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width var(--duration-normal) var(--ease-out);
}

.spend-indicator.ok .spend-bar-fill[b-m8p03ubu9p] {
    background: var(--accent-primary);
}

.spend-indicator.warning .spend-bar-fill[b-m8p03ubu9p] {
    background: var(--warning, #f59e0b);
}

.spend-indicator.over .spend-bar-fill[b-m8p03ubu9p] {
    background: var(--error, #ef4444);
}

.spend-label[b-m8p03ubu9p] {
    font-size: 0.6875rem;
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    white-space: nowrap;
    line-height: 1;
}

.spend-indicator.warning .spend-label[b-m8p03ubu9p] {
    color: var(--warning, #f59e0b);
}

.spend-indicator.over .spend-label[b-m8p03ubu9p] {
    color: var(--error, #ef4444);
}

/* Header Actions */
.header-actions[b-m8p03ubu9p] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-shrink: 0;
}

.admin-badge[b-m8p03ubu9p] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    background: var(--accent-subtle);
    color: var(--accent-primary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    border-radius: var(--radius-full);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.viewer-badge[b-m8p03ubu9p] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    background: color-mix(in srgb, var(--text-secondary, #707085) 15%, transparent);
    color: var(--text-secondary, #707085);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    border-radius: var(--radius-full);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.user-name[b-m8p03ubu9p] {
    color: var(--text-primary);
    font-weight: var(--font-medium);
    font-size: var(--text-sm);
}

.logout-btn[b-m8p03ubu9p] {
    height: 32px;
    padding: 0 var(--space-3);
    background: transparent;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    transition: all var(--duration-fast) var(--ease-out);
}

.logout-btn:hover[b-m8p03ubu9p] {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-secondary);
}

/* Tenant Switcher */
.tenant-switcher[b-m8p03ubu9p] {
    position: relative;
}

.tenant-switcher-btn[b-m8p03ubu9p] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    height: 32px;
    padding: 0 var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    font-family: inherit;
    transition: all var(--duration-fast) var(--ease-out);
    max-width: 180px;
}

.tenant-switcher-btn:hover[b-m8p03ubu9p] {
    border-color: var(--border-secondary);
    background: var(--bg-tertiary);
}

.tenant-switcher-name[b-m8p03ubu9p] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tenant-switcher-chevron[b-m8p03ubu9p] {
    flex-shrink: 0;
    transition: transform var(--duration-fast) var(--ease-out);
}

.tenant-switcher-chevron.open[b-m8p03ubu9p] {
    transform: rotate(180deg);
}

.tenant-dropdown-backdrop[b-m8p03ubu9p] {
    position: fixed;
    inset: 0;
    z-index: 149;
}

.tenant-dropdown[b-m8p03ubu9p] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 200px;
    max-width: 280px;
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    z-index: 150;
    padding: var(--space-1);
    animation: menuSlideIn-b-m8p03ubu9p var(--duration-fast) var(--ease-out);
}

.tenant-dropdown-item[b-m8p03ubu9p] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
    padding: var(--space-2) var(--space-3);
    background: none;
    border: none;
    border-radius: var(--radius-md);
    cursor: pointer;
    font-family: inherit;
    font-size: var(--text-sm);
    color: var(--text-primary);
    text-align: left;
    transition: background var(--duration-fast) var(--ease-out);
}

.tenant-dropdown-item:hover:not(:disabled)[b-m8p03ubu9p] {
    background: var(--bg-secondary);
}

.tenant-dropdown-item.active[b-m8p03ubu9p] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
    cursor: default;
}

.tenant-dropdown-item:disabled[b-m8p03ubu9p] {
    opacity: 0.6;
    cursor: default;
}

.tenant-dropdown-name[b-m8p03ubu9p] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: var(--font-medium);
}

.tenant-dropdown-role[b-m8p03ubu9p] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    flex-shrink: 0;
}

.tenant-dropdown-home[b-m8p03ubu9p] {
    font-size: 0.5625rem;
    font-weight: var(--font-semibold);
    color: var(--accent-primary);
    background: rgba(99, 102, 241, 0.1);
    padding: 1px var(--space-1);
    border-radius: var(--radius-full);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    flex-shrink: 0;
}

/* Mobile tenant section */
.mobile-tenant-section[b-m8p03ubu9p] {
    padding: var(--space-1) 0;
}

.mobile-tenant-label[b-m8p03ubu9p] {
    display: block;
    padding: var(--space-1) var(--space-4);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

/* Mobile menu button — hidden on desktop */
.mobile-menu-btn[b-m8p03ubu9p] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: none;
    color: var(--text-secondary);
    cursor: pointer;
    border-radius: var(--radius-md);
    transition: all var(--duration-fast) var(--ease-out);
    flex-shrink: 0;
}

.mobile-menu-btn:hover[b-m8p03ubu9p] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Mobile menu dropdown, backdrop, nav links — hidden on desktop */
.mobile-menu-backdrop[b-m8p03ubu9p] {
    display: none;
}

.mobile-menu[b-m8p03ubu9p] {
    display: none;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .app-header[b-m8p03ubu9p] {
        padding: 0 var(--space-3);
    }

    .header-nav[b-m8p03ubu9p] {
        display: none;
    }

    .brand-name[b-m8p03ubu9p] {
        display: none;
    }

    .user-name[b-m8p03ubu9p] {
        display: none;
    }

    .admin-badge[b-m8p03ubu9p],
    .viewer-badge[b-m8p03ubu9p] {
        display: none;
    }

    .logout-btn[b-m8p03ubu9p] {
        display: none;
    }

    .tenant-switcher[b-m8p03ubu9p] {
        display: none;
    }

    .spend-indicator[b-m8p03ubu9p] {
        display: none;
    }

    .mobile-menu-btn[b-m8p03ubu9p] {
        display: flex;
    }

    .mobile-menu-backdrop[b-m8p03ubu9p] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 149;
        background: rgba(0, 0, 0, 0.3);
        animation: menuFadeIn-b-m8p03ubu9p var(--duration-fast) var(--ease-out);
    }

    .mobile-menu[b-m8p03ubu9p] {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 52px;
        right: var(--space-3);
        width: 200px;
        max-height: calc(100dvh - 60px);
        overflow-y: auto;
        background: var(--bg-primary);
        border: 1px solid var(--border-light);
        border-radius: var(--radius-lg);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15), 0 2px 8px rgba(0, 0, 0, 0.08);
        z-index: 150;
        padding: var(--space-2) 0;
        animation: menuSlideIn-b-m8p03ubu9p var(--duration-fast) var(--ease-out);
    }

    .mobile-nav-link[b-m8p03ubu9p] {
        display: flex;
        align-items: center;
        padding: var(--space-3) var(--space-4);
        color: var(--text-secondary);
        text-decoration: none;
        font-size: var(--text-sm);
        font-weight: var(--font-medium);
        transition: all var(--duration-fast) var(--ease-out);
        min-height: 44px;
        border: none;
        background: none;
        width: 100%;
        cursor: pointer;
        text-align: left;
    }

    .mobile-nav-link:hover[b-m8p03ubu9p] {
        background: var(--bg-secondary);
        color: var(--text-primary);
    }

    .mobile-nav-link.active[b-m8p03ubu9p] {
        color: var(--accent-primary);
        background: var(--accent-subtle);
    }

    .mobile-nav-link.admin-link[b-m8p03ubu9p] {
        color: var(--accent-primary);
    }

    .mobile-nav-link.mobile-logout[b-m8p03ubu9p] {
        color: var(--text-tertiary);
        font-size: var(--text-sm);
    }

    .mobile-nav-link.mobile-logout:hover[b-m8p03ubu9p] {
        color: var(--error);
        background: var(--error-subtle);
    }

    .mobile-menu-divider[b-m8p03ubu9p] {
        height: 1px;
        background: var(--border-light);
        margin: var(--space-1) var(--space-3);
    }

    .mobile-menu-user[b-m8p03ubu9p] {
        display: flex;
        align-items: center;
        gap: var(--space-2);
        padding: var(--space-2) var(--space-4);
    }

    .mobile-user-name[b-m8p03ubu9p] {
        font-size: var(--text-sm);
        font-weight: var(--font-medium);
        color: var(--text-primary);
    }

    .mobile-menu-user .admin-badge[b-m8p03ubu9p],
    .mobile-menu-user .viewer-badge[b-m8p03ubu9p] {
        display: inline-flex;
    }
}

@keyframes menuFadeIn-b-m8p03ubu9p {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes menuSlideIn-b-m8p03ubu9p {
    from {
        opacity: 0;
        transform: translateY(-8px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Tablet - Show abbreviated nav */
@media (min-width: 769px) and (max-width: 1024px) {
    .header-nav[b-m8p03ubu9p] {
        gap: 0;
    }

    .nav-link[b-m8p03ubu9p] {
        padding: var(--space-2);
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* Main Layout - Linear-Inspired Design */

.app-layout[b-cgaxthfu7b] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: var(--bg-body);
    transition: background-color var(--duration-normal) var(--ease-out);
}

.app-main[b-cgaxthfu7b] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Page Transitions */
.app-main > *[b-cgaxthfu7b] {
    animation: pageEnter-b-cgaxthfu7b var(--duration-normal) var(--ease-out);
}

@keyframes pageEnter-b-cgaxthfu7b {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
/* /Pages/AcceptTerms.razor.rz.scp.css */
.accept-terms-page[b-y3xn275wse] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0a0a0f 0%, #12121e 50%, #0a0a0f 100%);
    padding: 2rem 1rem;
}

.accept-terms-container[b-y3xn275wse] {
    width: 100%;
    max-width: 480px;
}

.accept-terms-card[b-y3xn275wse] {
    background: rgba(22, 22, 30, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 2.5rem 2rem;
}

.accept-terms-header[b-y3xn275wse] {
    text-align: center;
    margin-bottom: 2rem;
}

.accept-terms-header .logo[b-y3xn275wse] {
    margin-bottom: 1.25rem;
}

.accept-terms-header .logo-image[b-y3xn275wse] {
    width: 56px;
    height: 56px;
    object-fit: contain;
}

.accept-terms-header h1[b-y3xn275wse] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #e0e0f0;
    margin: 0 0 0.5rem;
}

.accept-terms-subtitle[b-y3xn275wse] {
    font-size: 0.9375rem;
    color: #a0a0b8;
    margin: 0;
    line-height: 1.5;
}

.error-banner[b-y3xn275wse] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.25);
    border-radius: 8px;
    color: #fca5a5;
    font-size: 0.875rem;
    margin-bottom: 1.5rem;
}

.policy-links[b-y3xn275wse] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.policy-link[b-y3xn275wse] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    color: #e0e0f0;
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: 500;
    transition: background 0.15s, border-color 0.15s;
}

.policy-link:hover[b-y3xn275wse] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    color: #e0e0f0;
}

.policy-link svg[b-y3xn275wse] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    color: #8a8aad;
}

.policy-link span[b-y3xn275wse] {
    flex: 1;
}

.policy-link .external-icon[b-y3xn275wse] {
    width: 14px;
    height: 14px;
    color: #606078;
}

.checkbox-row[b-y3xn275wse] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #a0a0b8;
    line-height: 1.5;
}

.checkbox-row input[type="checkbox"][b-y3xn275wse] {
    margin-top: 0.125rem;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    accent-color: #6366f1;
    cursor: pointer;
}

.checkbox-row strong[b-y3xn275wse] {
    color: #c0c0d8;
}

.accept-button[b-y3xn275wse] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 48px;
    background: #6366f1;
    color: #ffffff;
    border: none;
    border-radius: 10px;
    font-size: 0.9375rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}

.accept-button:hover:not(:disabled)[b-y3xn275wse] {
    background: #5558e6;
}

.accept-button:disabled[b-y3xn275wse] {
    opacity: 0.5;
    cursor: not-allowed;
}

.loading-spinner[b-y3xn275wse] {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin-b-y3xn275wse 0.6s linear infinite;
}

@keyframes spin-b-y3xn275wse {
    to { transform: rotate(360deg); }
}

@media (max-width: 480px) {
    .accept-terms-card[b-y3xn275wse] {
        padding: 2rem 1.25rem;
    }
}
/* /Pages/Admin.razor.rz.scp.css */
/* Admin Page - Linear-Inspired Design */

.admin-page[b-yf3dm2cyn9] {
    padding: var(--space-6);
    max-width: 1400px;
    margin: 0 auto;
}

/* Header */
.admin-header[b-yf3dm2cyn9] {
    margin-bottom: var(--space-6);
}

.admin-header h1[b-yf3dm2cyn9] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
    letter-spacing: var(--tracking-tight);
}

.admin-header p[b-yf3dm2cyn9] {
    color: var(--text-tertiary);
    margin: 0;
    font-size: var(--text-base);
}

/* Banners */
.error-banner[b-yf3dm2cyn9],
.success-banner[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    font-size: var(--text-sm);
}

.error-banner[b-yf3dm2cyn9] {
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
}

.success-banner[b-yf3dm2cyn9] {
    background: var(--success-subtle);
    color: var(--success);
    border: 1px solid var(--success);
}

.close-btn[b-yf3dm2cyn9] {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-size: var(--text-sm);
    opacity: 0.7;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.close-btn:hover[b-yf3dm2cyn9] {
    opacity: 1;
}

/* Tabs */
.admin-tabs[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-6);
    border-bottom: 1px solid var(--border-light);
    padding-bottom: 0;
}

.tab-btn[b-yf3dm2cyn9] {
    position: relative;
    padding: var(--space-3) var(--space-4);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    transition: color var(--duration-fast) var(--ease-out);
}

.tab-btn:hover[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

.tab-btn.active[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

.tab-btn.active[b-yf3dm2cyn9]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--accent-primary);
    border-radius: var(--radius-full) var(--radius-full) 0 0;
}

/* Loading */
.loading[b-yf3dm2cyn9] {
    text-align: center;
    padding: var(--space-12);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
}

/* Section */
.admin-section[b-yf3dm2cyn9] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--border-light);
}

.section-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.section-header h2[b-yf3dm2cyn9] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.header-actions[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
}

/* Buttons */
.btn-primary[b-yf3dm2cyn9] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-primary:hover:not(:disabled)[b-yf3dm2cyn9] {
    background: var(--accent-hover);
}

.btn-primary:active:not(:disabled)[b-yf3dm2cyn9] {
    transform: scale(0.98);
}

.btn-primary:disabled[b-yf3dm2cyn9] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-secondary[b-yf3dm2cyn9] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-secondary:hover[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    border-color: var(--border-secondary);
}

/* Table */
.data-table[b-yf3dm2cyn9] {
    overflow-x: auto;
}

.data-table table[b-yf3dm2cyn9] {
    width: 100%;
    border-collapse: collapse;
}

.data-table th[b-yf3dm2cyn9] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-primary);
}

.data-table td[b-yf3dm2cyn9] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-light);
    vertical-align: middle;
}

.data-table tbody tr[b-yf3dm2cyn9] {
    transition: background-color var(--duration-fast) var(--ease-out);
}

.data-table tbody tr:hover[b-yf3dm2cyn9] {
    background: var(--bg-secondary);
}

.data-table tbody tr:last-child td[b-yf3dm2cyn9] {
    border-bottom: none;
}

/* Tenant Name with Color Swatch */
.tenant-name[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.color-swatch[b-yf3dm2cyn9] {
    width: 12px;
    height: 12px;
    border-radius: var(--radius-xs);
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
}

/* Status Badge */
.status-badge[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.status-badge.active[b-yf3dm2cyn9] {
    background: var(--success-subtle);
    color: var(--success);
}

.status-badge.inactive[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.status-badge.warning[b-yf3dm2cyn9] {
    background: var(--warning-subtle);
    color: var(--warning);
}

/* Role Badge */
.role-badge[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.role-badge.user[b-yf3dm2cyn9] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.role-badge.tenantadmin[b-yf3dm2cyn9] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.role-badge.systemadmin[b-yf3dm2cyn9] {
    background: var(--error-subtle);
    color: var(--error);
}

/* Actions */
.actions[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.btn-small[b-yf3dm2cyn9] {
    height: 24px;
    padding: 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    border: 1px solid var(--border-primary);
    background: var(--bg-primary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    color: var(--text-secondary);
    transition: all var(--duration-fast) var(--ease-out);
    white-space: nowrap;
}

.btn-small:hover[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-secondary);
}

.btn-small.btn-danger[b-yf3dm2cyn9] {
    color: var(--error);
    border-color: var(--error);
}

.btn-small.btn-danger:hover[b-yf3dm2cyn9] {
    background: var(--error-subtle);
}

/* No Data */
.no-data[b-yf3dm2cyn9] {
    text-align: center;
    color: var(--text-muted);
    padding: var(--space-10) var(--space-4) !important;
    font-size: var(--text-sm);
}

/* Modal Styles (for inline styled modals - will be moved to component) */
[b-yf3dm2cyn9] .modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: var(--space-4);
}

[b-yf3dm2cyn9] .modal-content {
    background: var(--bg-elevated);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--border-light);
    max-width: 480px;
    width: 100%;
    max-height: calc(100vh - var(--space-8));
    overflow-y: auto;
}

[b-yf3dm2cyn9] .modal-header {
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

[b-yf3dm2cyn9] .modal-header h3 {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

[b-yf3dm2cyn9] .modal-body {
    padding: var(--space-5);
}

[b-yf3dm2cyn9] .modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-light);
    background: var(--bg-secondary);
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
}

/* Prompts Section */
.prompts-description[b-yf3dm2cyn9] {
    padding: var(--space-4) var(--space-5);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    border-bottom: 1px solid var(--border-light);
}

.prompts-description p[b-yf3dm2cyn9] {
    margin: 0;
}

.prompts-list[b-yf3dm2cyn9] {
    padding: var(--space-4) var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.prompt-card[b-yf3dm2cyn9] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    transition: border-color var(--duration-fast) var(--ease-out);
}

.prompt-card:hover[b-yf3dm2cyn9] {
    border-color: var(--border-primary);
}

.prompt-card.inactive[b-yf3dm2cyn9] {
    opacity: 0.6;
}

.prompt-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-3);
}

.prompt-info[b-yf3dm2cyn9] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.prompt-order[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: var(--accent-subtle);
    color: var(--accent-primary);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    flex-shrink: 0;
}

.prompt-title-group h4[b-yf3dm2cyn9] {
    margin: 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.prompt-key[b-yf3dm2cyn9] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-family: var(--font-mono);
}

.skill-tag-badge[b-yf3dm2cyn9] {
    display: inline-block;
    font-size: 10px;
    font-weight: var(--font-semibold);
    color: var(--accent-primary);
    background: color-mix(in srgb, var(--accent-primary) 12%, transparent);
    padding: 1px 6px;
    border-radius: var(--radius-sm);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.prompt-summary-badge[b-yf3dm2cyn9] {
    display: block;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    font-style: italic;
    margin-top: 2px;
}

.form-hint[b-yf3dm2cyn9] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-top: 2px;
}

.prompt-actions[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.prompt-version[b-yf3dm2cyn9] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    padding: var(--space-1) var(--space-2);
    background: var(--bg-tertiary);
    border-radius: var(--radius-sm);
}

.prompt-preview[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
    white-space: pre-wrap;
    font-family: var(--font-mono);
    background: var(--bg-primary);
    padding: var(--space-3);
    border-radius: var(--radius-sm);
    max-height: 80px;
    overflow: hidden;
}

.section-divider[b-yf3dm2cyn9] {
    border-top: 1px solid var(--border-light);
    margin: var(--space-6) 0;
}

.tenant-prompt-selector[b-yf3dm2cyn9] {
    padding: var(--space-4) var(--space-5);
}

.form-select[b-yf3dm2cyn9] {
    width: 100%;
    max-width: 400px;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
}

.form-select:focus[b-yf3dm2cyn9] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.tenant-prompts-section[b-yf3dm2cyn9] {
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-light);
}

.tenant-prompts-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.tenant-prompts-header h3[b-yf3dm2cyn9] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.no-data-centered[b-yf3dm2cyn9] {
    text-align: center;
    padding: var(--space-8);
    color: var(--text-tertiary);
}

.no-data-centered p[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-3) 0;
}

.no-data-centered .text-muted[b-yf3dm2cyn9] {
    color: var(--text-muted);
    font-size: var(--text-sm);
}

.btn-success[b-yf3dm2cyn9] {
    color: var(--success);
    border-color: var(--success);
}

.btn-success:hover[b-yf3dm2cyn9] {
    background: var(--success-subtle);
}

/* Modal Styles */
.modal-overlay[b-yf3dm2cyn9] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: var(--space-4);
}

.modal-content[b-yf3dm2cyn9] {
    background: var(--bg-elevated);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--border-light);
    max-width: 480px;
    width: 100%;
    max-height: calc(100vh - var(--space-8));
    overflow-y: auto;
}

.modal-content.modal-large[b-yf3dm2cyn9] {
    max-width: 720px;
}

.modal-header[b-yf3dm2cyn9] {
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.modal-header h3[b-yf3dm2cyn9] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.modal-body[b-yf3dm2cyn9] {
    padding: var(--space-5);
}

.modal-footer[b-yf3dm2cyn9] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-light);
    background: var(--bg-secondary);
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
}

/* Form Styles */
.form-group[b-yf3dm2cyn9] {
    margin-bottom: var(--space-4);
}

.form-group label[b-yf3dm2cyn9] {
    display: block;
    margin-bottom: var(--space-1);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.form-row[b-yf3dm2cyn9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.form-input[b-yf3dm2cyn9] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    box-sizing: border-box;
}

.form-input:focus[b-yf3dm2cyn9] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-input:disabled[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    cursor: not-allowed;
}

.form-textarea[b-yf3dm2cyn9] {
    width: 100%;
    padding: var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-family: var(--font-mono);
    background: var(--bg-primary);
    color: var(--text-primary);
    resize: vertical;
    box-sizing: border-box;
    line-height: 1.5;
}

.form-textarea:focus[b-yf3dm2cyn9] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-checkbox[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
}

.form-checkbox label[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    margin-bottom: 0;
}

.form-checkbox input[type="checkbox"][b-yf3dm2cyn9] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent-primary);
}

/* Tier Badge */
.tier-badge[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.tier-badge.basic[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.tier-badge.professional[b-yf3dm2cyn9] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.tier-badge.enterprise[b-yf3dm2cyn9] {
    background: var(--warning-subtle);
    color: var(--warning);
}

/* Row Inactive State */
.row-inactive[b-yf3dm2cyn9] {
    opacity: 0.6;
}

.row-inactive:hover[b-yf3dm2cyn9] {
    opacity: 0.8;
}

/* Modal Tabs */
.modal-tabs[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-1);
    padding: 0 var(--space-5);
    border-bottom: 1px solid var(--border-light);
    background: var(--bg-secondary);
}

.modal-tab[b-yf3dm2cyn9] {
    position: relative;
    padding: var(--space-3) var(--space-4);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    transition: color var(--duration-fast) var(--ease-out);
}

.modal-tab:hover[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

.modal-tab.active[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

.modal-tab.active[b-yf3dm2cyn9]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--accent-primary);
    border-radius: var(--radius-full) var(--radius-full) 0 0;
}

/* Color Input */
.color-input-wrapper[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

.form-color[b-yf3dm2cyn9] {
    width: 40px;
    height: 34px;
    padding: 2px;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    background: var(--bg-primary);
}

.form-color[b-yf3dm2cyn9]::-webkit-color-swatch-wrapper {
    padding: 0;
}

.form-color[b-yf3dm2cyn9]::-webkit-color-swatch {
    border: none;
    border-radius: var(--radius-sm);
}

/* Branding Preview */
.branding-preview[b-yf3dm2cyn9] {
    margin-top: var(--space-4);
    padding: var(--space-4);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
}

.preview-label[b-yf3dm2cyn9] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    display: block;
    margin-bottom: var(--space-2);
}

.preview-card[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    background: var(--bg-primary);
    border-radius: var(--radius-md);
}

.preview-logo[b-yf3dm2cyn9] {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

/* Form Hint */
.form-hint[b-yf3dm2cyn9] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.form-error[b-yf3dm2cyn9] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    color: var(--error);
}

/* Form Note */
.form-note[b-yf3dm2cyn9] {
    margin-top: var(--space-4);
    padding: var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.form-note strong[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

/* Tier Info */
.tier-info[b-yf3dm2cyn9] {
    margin-top: var(--space-4);
    padding: var(--space-4);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
}

.tier-info h4[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.tier-info ul[b-yf3dm2cyn9] {
    margin: 0;
    padding-left: var(--space-4);
}

.tier-info li[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.tier-info li:last-child[b-yf3dm2cyn9] {
    margin-bottom: 0;
}

/* Role Info */
.role-info[b-yf3dm2cyn9] {
    margin-top: var(--space-4);
    padding: var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.role-info p[b-yf3dm2cyn9] {
    margin: 0;
}

.role-info strong[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

/* Memory Info */
.memory-info[b-yf3dm2cyn9] {
    margin-top: var(--space-4);
    padding: var(--space-4);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
}

.memory-info h4[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.memory-info ul[b-yf3dm2cyn9] {
    margin: 0;
    padding-left: var(--space-4);
}

.memory-info li[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.memory-info li strong[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

/* Activity Info */
.activity-info[b-yf3dm2cyn9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.activity-item[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
}

.activity-label[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
}

.activity-value[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    color: var(--text-primary);
}

/* API Discovery Modal */
.modal-content.modal-xlarge[b-yf3dm2cyn9] {
    max-width: 900px;
}

.discovery-subtitle[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-weight: var(--font-normal);
    margin-left: var(--space-2);
}

.discovery-loading[b-yf3dm2cyn9] {
    text-align: center;
    padding: var(--space-12) var(--space-4);
    color: var(--text-tertiary);
}

.discovery-loading p[b-yf3dm2cyn9] {
    margin-top: var(--space-3);
    font-size: var(--text-sm);
}

.discovery-error[b-yf3dm2cyn9] {
    text-align: center;
    padding: var(--space-8);
    color: var(--error);
}

.discovery-error p[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-4) 0;
    font-size: var(--text-sm);
}

.discovery-header-info[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
}

.discovery-api-info[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.discovery-version[b-yf3dm2cyn9] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    padding: var(--space-1) var(--space-2);
    background: var(--bg-tertiary);
    border-radius: var(--radius-sm);
}

.discovery-stats[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-4);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.discovery-toolbar[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
    align-items: center;
}

.discovery-search[b-yf3dm2cyn9] {
    flex: 1;
}

.discovery-endpoints-list[b-yf3dm2cyn9] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
}

.endpoint-group[b-yf3dm2cyn9] {
    border-bottom: 1px solid var(--border-light);
}

.endpoint-group:last-child[b-yf3dm2cyn9] {
    border-bottom: none;
}

.endpoint-group-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    position: sticky;
    top: 0;
    z-index: 1;
}

.endpoint-group-count[b-yf3dm2cyn9] {
    font-weight: var(--font-normal);
    color: var(--text-muted);
    text-transform: none;
}

.endpoint-item[b-yf3dm2cyn9] {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--border-light);
    transition: background-color 0.15s ease;
}

.endpoint-item:last-child[b-yf3dm2cyn9] {
    border-bottom: none;
}

.endpoint-item:hover[b-yf3dm2cyn9] {
    background: var(--bg-secondary);
}

.endpoint-item.selected[b-yf3dm2cyn9] {
    background: color-mix(in srgb, var(--accent-primary) 5%, transparent);
}

.endpoint-item-header[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
}

.endpoint-checkbox[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    font-size: var(--text-sm);
}

.endpoint-checkbox input[type="checkbox"][b-yf3dm2cyn9] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent-primary);
    flex-shrink: 0;
}

.method-badge[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: 10px;
    font-weight: 700;
    font-family: var(--font-mono);
    text-transform: uppercase;
    flex-shrink: 0;
}

.method-badge.get[b-yf3dm2cyn9] { background: #dbeafe; color: #1d4ed8; }
.method-badge.post[b-yf3dm2cyn9] { background: #dcfce7; color: #15803d; }
.method-badge.put[b-yf3dm2cyn9] { background: #fef3c7; color: #b45309; }
.method-badge.delete[b-yf3dm2cyn9] { background: #fce4ec; color: #c62828; }
.method-badge.patch[b-yf3dm2cyn9] { background: #f3e5f5; color: #7b1fa2; }

.endpoint-path[b-yf3dm2cyn9] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.endpoint-summary[b-yf3dm2cyn9] {
    margin-top: var(--space-1);
    padding-left: calc(16px + var(--space-2) + 48px + var(--space-2));
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.endpoint-params[b-yf3dm2cyn9] {
    margin-top: var(--space-2);
    padding-left: calc(16px + var(--space-2) + 48px + var(--space-2));
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.param-tag[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    height: 22px;
    padding: 0 var(--space-2);
    background: var(--bg-tertiary);
    border-radius: var(--radius-sm);
    font-size: 11px;
    font-family: var(--font-mono);
    color: var(--text-secondary);
}

.param-tag.required[b-yf3dm2cyn9] {
    border: 1px solid color-mix(in srgb, var(--accent-primary) 30%, transparent);
    background: color-mix(in srgb, var(--accent-primary) 8%, transparent);
}

.param-type[b-yf3dm2cyn9] {
    color: var(--text-muted);
}

.param-required[b-yf3dm2cyn9] {
    color: var(--error);
    font-weight: 700;
}

.discovery-preview[b-yf3dm2cyn9] {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.discovery-preview-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
}

.discovery-preview-count[b-yf3dm2cyn9] {
    font-weight: var(--font-normal);
    color: var(--text-muted);
}

.discovery-preview-content[b-yf3dm2cyn9] {
    padding: var(--space-3);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1.5;
    color: var(--text-secondary);
    background: var(--bg-primary);
    max-height: 200px;
    overflow-y: auto;
    margin: 0;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.spinner[b-yf3dm2cyn9] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border-light);
    border-top: 3px solid var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-yf3dm2cyn9 0.8s linear infinite;
    margin: 0 auto;
}

@keyframes spin-b-yf3dm2cyn9 {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Mobile */
@media (max-width: 768px) {
    .admin-page[b-yf3dm2cyn9] {
        padding: var(--space-4);
    }

    .section-header[b-yf3dm2cyn9] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }

    .header-actions[b-yf3dm2cyn9] {
        width: 100%;
    }

    .header-actions .btn-primary[b-yf3dm2cyn9],
    .header-actions .btn-secondary[b-yf3dm2cyn9] {
        flex: 1;
    }

    .actions[b-yf3dm2cyn9] {
        flex-direction: column;
        gap: var(--space-1);
    }

    .btn-small[b-yf3dm2cyn9] {
        width: 100%;
    }
}

/* Clickable Row */
.clickable-row[b-yf3dm2cyn9] {
    cursor: pointer;
}

.clickable-row:hover[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
}

/* Role Detail Panel */
.role-detail-panel[b-yf3dm2cyn9] {
    margin: var(--space-4) var(--space-5);
    padding: var(--space-4);
    background: var(--bg-secondary);
    border-left: 3px solid var(--accent-primary);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

.role-detail-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-3);
}

.role-detail-header h3[b-yf3dm2cyn9] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.role-detail-panel h4[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.role-detail-panel p[b-yf3dm2cyn9],
.role-description[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-3) 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.btn-close[b-yf3dm2cyn9] {
    background: none;
    border: none;
    font-size: var(--text-lg);
    color: var(--text-tertiary);
    cursor: pointer;
    padding: var(--space-1);
    line-height: 1;
    transition: color var(--duration-fast) var(--ease-out);
}

.btn-close:hover[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

/* Tier Requirement Badge */
.tier-requirement[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--space-4);
}

/* Tier Badge Variants (for role/model tier display) */
.tier-badge.tier-basic[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.tier-badge.tier-professional[b-yf3dm2cyn9] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.tier-badge.tier-enterprise[b-yf3dm2cyn9] {
    background: var(--warning-subtle);
    color: var(--warning);
}

/* Policy Category */
.policy-category[b-yf3dm2cyn9] {
    margin-bottom: var(--space-3);
}

.policy-category:last-child[b-yf3dm2cyn9] {
    margin-bottom: 0;
}

.policy-category h5[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-1) 0;
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.policy-category ul[b-yf3dm2cyn9] {
    margin: 0;
    padding-left: var(--space-4);
    list-style-type: none;
}

.policy-category li[b-yf3dm2cyn9] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    padding: 2px 0;
    position: relative;
    padding-left: var(--space-3);
}

.policy-category li[b-yf3dm2cyn9]::before {
    content: '·';
    position: absolute;
    left: 0;
    color: var(--accent-primary);
    font-weight: bold;
}

/* Tier cards */
.tier-cards[b-yf3dm2cyn9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-5);
    padding: var(--space-5) 0;
    align-items: start;
}

.tier-card[b-yf3dm2cyn9] {
    position: relative;
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-5) var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    transition: transform 0.15s, box-shadow 0.15s;
}

.tier-card:hover[b-yf3dm2cyn9] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.tier-card.inactive[b-yf3dm2cyn9] {
    opacity: 0.5;
}

.tier-card.tier-highlighted[b-yf3dm2cyn9] {
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 1px var(--accent-primary), 0 4px 16px rgba(var(--accent-primary-rgb, 59, 130, 246), 0.15);
}

.tier-badge[b-yf3dm2cyn9] {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--accent-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 14px;
    border-radius: 20px;
    white-space: nowrap;
}

.tier-card-header[b-yf3dm2cyn9] {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
}

.tier-card h3[b-yf3dm2cyn9] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--text-primary);
}

.tier-code[b-yf3dm2cyn9] {
    font-family: monospace;
    font-size: 0.7rem;
    color: var(--text-tertiary);
    background: var(--bg-tertiary);
    padding: 2px 6px;
    border-radius: 4px;
}

.tier-description[b-yf3dm2cyn9] {
    font-size: 0.85rem;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0;
}

.tier-pricing[b-yf3dm2cyn9] {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.tier-pricing .price[b-yf3dm2cyn9] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--text-primary);
    letter-spacing: -0.02em;
}

.tier-pricing .price-period[b-yf3dm2cyn9] {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.tier-annual[b-yf3dm2cyn9] {
    font-size: 0.8rem;
    color: var(--text-tertiary);
    margin-top: -8px;
}

.tier-section[b-yf3dm2cyn9] {
    border-top: 1px solid var(--border-light);
    padding-top: var(--space-3);
}

.tier-section h4[b-yf3dm2cyn9] {
    margin: 0 0 var(--space-2) 0;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.tier-limit-row[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    padding: 4px 0;
    color: var(--text-secondary);
}

.tier-limit-value[b-yf3dm2cyn9] {
    font-weight: 600;
    color: var(--text-primary);
}

.tier-limit-value.tier-yes[b-yf3dm2cyn9] {
    color: #22c55e;
}

.tier-limit-value.tier-no[b-yf3dm2cyn9] {
    color: var(--text-tertiary);
    font-weight: 400;
}

.tier-capabilities[b-yf3dm2cyn9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tier-capability[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.825rem;
    color: var(--text-secondary);
}

.tier-capability svg[b-yf3dm2cyn9] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #22c55e;
}

.tier-card-footer[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--border-light);
    padding-top: var(--space-3);
    margin-top: auto;
}

.tier-tenants[b-yf3dm2cyn9] {
    font-size: 0.8rem;
    color: var(--text-tertiary);
    font-weight: 600;
}

.section-desc[b-yf3dm2cyn9] {
    margin: -0.5rem 0 0 0;
    font-size: 0.875rem;
    color: var(--text-secondary);
}

/* ─── Billing ─── */

.billing-sub-nav[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.pill-btn[b-yf3dm2cyn9] {
    padding: var(--space-2) var(--space-4);
    border-radius: 9999px;
    border: 1px solid var(--border-primary);
    background: var(--bg-secondary);
    color: var(--text-secondary);
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.15s;
}

.pill-btn:hover[b-yf3dm2cyn9] {
    border-color: var(--accent-primary);
    color: var(--text-primary);
}

.pill-btn.active[b-yf3dm2cyn9] {
    background: var(--accent-primary);
    border-color: var(--accent-primary);
    color: #fff;
}

.billing-period-picker[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.billing-period-picker input[type="month"][b-yf3dm2cyn9] {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-primary);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.875rem;
}

.billing-stats[b-yf3dm2cyn9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.billing-stat-card[b-yf3dm2cyn9] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.billing-stat-card .stat-label[b-yf3dm2cyn9] {
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.billing-stat-card .stat-value[b-yf3dm2cyn9] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
}

.invoice-status[b-yf3dm2cyn9] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.invoice-status.draft[b-yf3dm2cyn9] { background: var(--bg-tertiary, #374151); color: var(--text-secondary); }
.invoice-status.finalized[b-yf3dm2cyn9] { background: #1e3a5f; color: #60a5fa; }
.invoice-status.sent[b-yf3dm2cyn9] { background: #1a3650; color: #38bdf8; }
.invoice-status.paid[b-yf3dm2cyn9] { background: #14532d; color: #4ade80; }
.invoice-status.void[b-yf3dm2cyn9] { background: #450a0a; color: #f87171; }
.invoice-status.none[b-yf3dm2cyn9] { background: var(--bg-tertiary, #374151); color: var(--text-tertiary); }

.change-type[b-yf3dm2cyn9] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
}

.change-type.initial[b-yf3dm2cyn9] { background: var(--bg-tertiary, #374151); color: var(--text-secondary); }
.change-type.upgrade[b-yf3dm2cyn9] { background: #14532d; color: #4ade80; }
.change-type.downgrade[b-yf3dm2cyn9] { background: #78350f; color: #fbbf24; }
.change-type.adminoverride[b-yf3dm2cyn9] { background: #1e3a5f; color: #60a5fa; }

.invoice-header-info[b-yf3dm2cyn9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: var(--space-2) var(--space-6);
    padding: var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
}

.invoice-header-info div[b-yf3dm2cyn9] {
    font-size: 0.875rem;
    color: var(--text-secondary);
}

.invoice-header-info strong[b-yf3dm2cyn9] {
    color: var(--text-primary);
}

.invoice-actions[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.status-update[b-yf3dm2cyn9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.status-update select[b-yf3dm2cyn9] {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-primary);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.875rem;
}

.export-buttons[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
}

.invoice-filters[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.invoice-filters select[b-yf3dm2cyn9] {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-primary);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.875rem;
}

.override-form[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
    flex-wrap: wrap;
}

.override-form select[b-yf3dm2cyn9],
.override-form input[b-yf3dm2cyn9] {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-primary);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.875rem;
}

/* Spending Limits */
.section-description[b-yf3dm2cyn9] {
    color: var(--text-secondary);
    font-size: var(--text-sm);
    margin: 0 0 var(--space-4);
}

.spend-cell[b-yf3dm2cyn9] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.progress-bar-mini[b-yf3dm2cyn9] {
    width: 100%;
    height: 4px;
    background: var(--border-light);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.progress-bar-fill[b-yf3dm2cyn9] {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.3s ease;
}

.progress-green[b-yf3dm2cyn9] {
    background: var(--success, #22c55e);
}

.progress-yellow[b-yf3dm2cyn9] {
    background: var(--warning, #f59e0b);
}

.progress-red[b-yf3dm2cyn9] {
    background: var(--error, #ef4444);
}

.status-badge.warning[b-yf3dm2cyn9] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--warning, #f59e0b);
}

.text-muted[b-yf3dm2cyn9] {
    color: var(--text-muted);
}

/* ─── Models Tab ─── */

.model-api-id[b-yf3dm2cyn9] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-family: var(--font-mono);
    margin-top: 2px;
}

.capability-badges[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-1);
}

.capability-badge[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
}

.capability-badge.enabled[b-yf3dm2cyn9] {
    background: var(--success-subtle);
    color: var(--success);
}

.capability-badge.disabled[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.api-status-badge[b-yf3dm2cyn9] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.api-status-badge.available[b-yf3dm2cyn9] {
    background: var(--success-subtle);
    color: var(--success);
}

.api-status-badge.unavailable[b-yf3dm2cyn9] {
    background: var(--error-subtle);
    color: var(--error);
}

.api-status-badge.not-checked[b-yf3dm2cyn9] {
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.clickable-badge[b-yf3dm2cyn9] {
    cursor: pointer;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.clickable-badge:hover[b-yf3dm2cyn9] {
    opacity: 0.8;
}

.sync-result-banner[b-yf3dm2cyn9] {
    padding: var(--space-3) var(--space-5);
    background: var(--accent-subtle);
    color: var(--accent-primary);
    font-size: var(--text-sm);
    border-bottom: 1px solid var(--border-light);
}

/* Provider Cards */
.provider-cards[b-yf3dm2cyn9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: var(--space-4);
}

.provider-card[b-yf3dm2cyn9] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
}

.provider-header[b-yf3dm2cyn9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.provider-header h3[b-yf3dm2cyn9] {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.provider-badges[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.badge-primary[b-yf3dm2cyn9] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.badge-error[b-yf3dm2cyn9] {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

.badge-warning[b-yf3dm2cyn9] {
    background: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
}

.provider-details[b-yf3dm2cyn9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.detail-row[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.detail-label[b-yf3dm2cyn9] {
    color: var(--text-tertiary);
    min-width: 80px;
}

.text-error[b-yf3dm2cyn9] {
    color: #ef4444;
}

.provider-actions[b-yf3dm2cyn9] {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.btn-sm[b-yf3dm2cyn9] {
    padding: var(--space-1) var(--space-3);
    font-size: var(--text-xs);
}

.provider-test-result[b-yf3dm2cyn9] {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    margin-top: var(--space-2);
}

.test-success[b-yf3dm2cyn9] {
    background: rgba(34, 197, 94, 0.1);
    color: #22c55e;
}

.test-failure[b-yf3dm2cyn9] {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}
/* /Pages/AwaitingSetup.razor.rz.scp.css */
/* Awaiting Setup Page */

.awaiting-page[b-y3hpepmwss] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-6);
    gap: var(--space-6);
}

.awaiting-card[b-y3hpepmwss] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 440px;
    width: 100%;
    gap: var(--space-4);
    animation: fadeIn-b-y3hpepmwss var(--duration-normal) var(--ease-out) both;
}

@keyframes fadeIn-b-y3hpepmwss {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Sophia Avatar */
.sophia-avatar[b-y3hpepmwss] {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: var(--radius-lg);
    background: var(--thinking-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-bold);
    font-size: var(--text-lg);
    margin-bottom: var(--space-2);
}

.avatar-pulse[b-y3hpepmwss] {
    position: absolute;
    inset: -4px;
    border-radius: var(--radius-lg);
    border: 2px solid var(--thinking-primary);
    opacity: 0;
    animation: pulse-b-y3hpepmwss 2.5s var(--ease-out) infinite;
}

@keyframes pulse-b-y3hpepmwss {
    0% { opacity: 0.6; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.3); }
}

/* Status Icon */
.status-icon[b-y3hpepmwss] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.status-icon.waiting[b-y3hpepmwss] {
    color: var(--text-tertiary);
}

.status-icon.checking[b-y3hpepmwss] {
    color: var(--accent-primary);
}

.check-spinner[b-y3hpepmwss] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border-primary);
    border-top-color: var(--accent-primary);
    border-radius: var(--radius-full);
    animation: spin-b-y3hpepmwss 0.8s linear infinite;
}

@keyframes spin-b-y3hpepmwss {
    to { transform: rotate(360deg); }
}

/* Text */
.awaiting-title[b-y3hpepmwss] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    margin: 0;
}

.awaiting-message[b-y3hpepmwss] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
    margin: 0;
    max-width: 380px;
}

.awaiting-hint[b-y3hpepmwss] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: 0;
}

/* Buttons */
.btn-check[b-y3hpepmwss] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    height: 40px;
    padding: 0 var(--space-5);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    margin-top: var(--space-2);
}

.btn-check:hover:not(:disabled)[b-y3hpepmwss] {
    background: var(--accent-hover);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.btn-check:disabled[b-y3hpepmwss] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Footer */
.awaiting-footer[b-y3hpepmwss] {
    position: fixed;
    bottom: var(--space-6);
}

.btn-logout[b-y3hpepmwss] {
    height: 32px;
    padding: 0 var(--space-4);
    background: transparent;
    color: var(--text-tertiary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-logout:hover[b-y3hpepmwss] {
    color: var(--text-secondary);
    border-color: var(--border-secondary);
    background: var(--bg-tertiary);
}

/* Mobile */
@media (max-width: 480px) {
    .awaiting-page[b-y3hpepmwss] {
        padding: var(--space-4);
    }

    .awaiting-title[b-y3hpepmwss] {
        font-size: var(--text-lg);
    }
}
/* /Pages/Chat.razor.rz.scp.css */
/* Chat Page - Linear-Inspired Design */

.chat-page[b-lkybln5xxo] {
    display: flex;
    height: calc(100vh - 56px);
    background-color: var(--bg-body);
}

/* Sidebar */
.sidebar[b-lkybln5xxo] {
    width: 280px;
    flex-shrink: 0;
    border-right: 1px solid var(--border-light);
}

/* Main Chat Area */
.chat-main[b-lkybln5xxo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background-color: var(--bg-primary);
    min-width: 0;
}

/* Chat Header */
.chat-header[b-lkybln5xxo] {
    height: 56px;
    padding: 0 var(--space-5);
    border-bottom: 1px solid var(--border-light);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--bg-primary);
    flex-shrink: 0;
}

.header-left[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.sophia-badge[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.sophia-icon[b-lkybln5xxo] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-lg);
    background: var(--thinking-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-bold);
    font-size: var(--text-sm);
    box-shadow: var(--shadow-sm);
}

.sophia-name[b-lkybln5xxo] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
}

/* Connection Status */
.connection-status[b-lkybln5xxo] {
    font-size: var(--text-xs);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-full);
    font-weight: var(--font-medium);
}

.connection-status.disconnected[b-lkybln5xxo] {
    background-color: var(--error-subtle);
    color: var(--error);
}

.connection-status.connected[b-lkybln5xxo] {
    background-color: var(--success-subtle);
    color: var(--success);
}

.reconnect-btn[b-lkybln5xxo] {
    height: 28px;
    padding: 0 var(--space-3);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.reconnect-btn:hover:not(:disabled)[b-lkybln5xxo] {
    background: var(--accent-hover);
}

.reconnect-btn:active:not(:disabled)[b-lkybln5xxo] {
    transform: scale(0.98);
}

.reconnect-btn:disabled[b-lkybln5xxo] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Header Right */
.header-right[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.model-selector[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.model-selector label[b-lkybln5xxo] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-weight: var(--font-medium);
}

.model-selector select[b-lkybln5xxo] {
    height: 32px;
    padding: 0 var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background-color: var(--bg-secondary);
    color: var(--text-primary);
    font-size: var(--text-sm);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    min-width: 140px;
}

.model-selector select:hover:not(:disabled)[b-lkybln5xxo] {
    border-color: var(--border-secondary);
    background-color: var(--bg-tertiary);
}

.model-selector select:focus[b-lkybln5xxo] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.model-selector select:disabled[b-lkybln5xxo] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Vibe Selector */
.vibe-selector[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.vibe-selector label[b-lkybln5xxo] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-weight: var(--font-medium);
}

.vibe-dropdown[b-lkybln5xxo] {
    position: relative;
}

.vibe-dropdown.disabled[b-lkybln5xxo] {
    opacity: 0.5;
    pointer-events: none;
}

.vibe-dropdown-trigger[b-lkybln5xxo] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    height: 32px;
    padding: 0 var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: var(--text-sm);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    min-width: 120px;
    white-space: nowrap;
}

.vibe-dropdown-trigger:hover:not(:disabled)[b-lkybln5xxo] {
    border-color: var(--accent-primary);
    background: var(--bg-tertiary);
}

.vibe-dropdown-trigger:disabled[b-lkybln5xxo] {
    cursor: not-allowed;
}

.vibe-trigger-icon[b-lkybln5xxo] {
    font-size: var(--text-base);
    line-height: 1;
}

.vibe-trigger-text[b-lkybln5xxo] {
    font-weight: var(--font-medium);
}

.vibe-trigger-text.off[b-lkybln5xxo] {
    color: var(--text-tertiary);
}

.vibe-trigger-chevron[b-lkybln5xxo] {
    margin-left: auto;
    color: var(--text-tertiary);
    transition: transform var(--duration-fast) var(--ease-out);
    flex-shrink: 0;
}

.vibe-trigger-chevron.open[b-lkybln5xxo] {
    transform: rotate(180deg);
}

.vibe-dropdown-backdrop[b-lkybln5xxo] {
    position: fixed;
    inset: 0;
    z-index: 99;
}

.vibe-dropdown-menu[b-lkybln5xxo] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 240px;
    max-width: 320px;
    max-height: 400px;
    overflow-y: auto;
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15), 0 2px 8px rgba(0, 0, 0, 0.08);
    z-index: 100;
    padding: var(--space-1) 0;
    animation: vibeMenuIn-b-lkybln5xxo var(--duration-fast) var(--ease-out);
}

.vibe-dropdown-item[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-out);
    font-size: var(--text-sm);
}

.vibe-dropdown-item:hover[b-lkybln5xxo] {
    background: var(--bg-tertiary);
}

.vibe-dropdown-item.active[b-lkybln5xxo] {
    background: var(--accent-primary);
    color: white;
}

.vibe-dropdown-item.active .vibe-item-desc[b-lkybln5xxo] {
    color: rgba(255, 255, 255, 0.7);
}

.vibe-dropdown-item.manage[b-lkybln5xxo] {
    color: var(--accent-primary);
    font-weight: var(--font-medium);
}

.vibe-dropdown-item.manage:hover[b-lkybln5xxo] {
    background: var(--bg-tertiary);
}

.vibe-item-icon[b-lkybln5xxo] {
    font-size: var(--text-base);
    line-height: 1;
    flex-shrink: 0;
    width: 20px;
    text-align: center;
}

.vibe-item-manage-icon[b-lkybln5xxo] {
    flex-shrink: 0;
    width: 20px;
    color: var(--accent-primary);
}

.vibe-item-content[b-lkybln5xxo] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.vibe-item-label[b-lkybln5xxo] {
    font-weight: var(--font-medium);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vibe-item-desc[b-lkybln5xxo] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vibe-dropdown-divider[b-lkybln5xxo] {
    height: 1px;
    background: var(--border-light);
    margin: var(--space-1) var(--space-2);
}

.vibe-dropdown-section-label[b-lkybln5xxo] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: var(--space-2) var(--space-3) var(--space-1);
}

@keyframes vibeMenuIn-b-lkybln5xxo {
    from {
        opacity: 0;
        transform: translateY(-4px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Vibe Modal */
.vibe-modal-overlay[b-lkybln5xxo] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    animation: fadeIn-b-lkybln5xxo var(--duration-fast) var(--ease-out);
}

.vibe-modal[b-lkybln5xxo] {
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    width: 480px;
    max-width: 90vw;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.24);
    animation: slideUp-b-lkybln5xxo var(--duration-normal) var(--ease-out);
}

/* Shortcuts modal is wider — long prompts need room to breathe. */
.vibe-modal.shortcuts-modal[b-lkybln5xxo] {
    width: 720px;
    max-height: 85vh;
}

.vibe-modal-header[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.vibe-modal-header h3[b-lkybln5xxo] {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.vibe-modal-close[b-lkybln5xxo] {
    background: none;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: var(--space-1);
    border-radius: var(--radius-md);
    transition: all var(--duration-fast) var(--ease-out);
}

.vibe-modal-close:hover[b-lkybln5xxo] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

.vibe-list[b-lkybln5xxo] {
    padding: var(--space-3) var(--space-5);
}

.vibe-list-item[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    transition: background var(--duration-fast) var(--ease-out);
}

.vibe-list-item:hover[b-lkybln5xxo] {
    background: var(--bg-secondary);
}

.vibe-list-icon[b-lkybln5xxo] {
    font-size: var(--text-xl);
    flex-shrink: 0;
    width: 32px;
    text-align: center;
}

.vibe-list-info[b-lkybln5xxo] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.vibe-list-name[b-lkybln5xxo] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.vibe-list-desc[b-lkybln5xxo] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vibe-list-actions[b-lkybln5xxo] {
    display: flex;
    gap: var(--space-1);
    flex-shrink: 0;
}

.vibe-action-btn[b-lkybln5xxo] {
    background: none;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: var(--space-1);
    border-radius: var(--radius-md);
    transition: all var(--duration-fast) var(--ease-out);
}

.vibe-action-btn:hover[b-lkybln5xxo] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

.vibe-action-delete:hover[b-lkybln5xxo] {
    color: var(--error);
}

.vibe-list-empty[b-lkybln5xxo] {
    text-align: center;
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    padding: var(--space-6) 0;
    margin: 0;
}

.vibe-modal-footer[b-lkybln5xxo] {
    padding: var(--space-3) var(--space-5) var(--space-5);
    display: flex;
    justify-content: flex-end;
}

.vibe-form[b-lkybln5xxo] {
    padding: var(--space-4) var(--space-5);
}

.vibe-form h4[b-lkybln5xxo] {
    margin: 0 0 var(--space-4);
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.vibe-form-field[b-lkybln5xxo] {
    margin-bottom: var(--space-3);
}

.vibe-form-field label[b-lkybln5xxo] {
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.vibe-form-field input[b-lkybln5xxo],
.vibe-form-field textarea[b-lkybln5xxo] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background-color: var(--bg-secondary);
    color: var(--text-primary);
    font-size: var(--text-sm);
    font-family: inherit;
    transition: all var(--duration-fast) var(--ease-out);
    box-sizing: border-box;
}

.vibe-form-field input:focus[b-lkybln5xxo],
.vibe-form-field textarea:focus[b-lkybln5xxo] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.vibe-form-field textarea[b-lkybln5xxo] {
    resize: vertical;
}

.vibe-form-actions[b-lkybln5xxo] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    margin-top: var(--space-4);
}

.vibe-btn-primary[b-lkybln5xxo] {
    padding: var(--space-2) var(--space-4);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.vibe-btn-primary:hover:not(:disabled)[b-lkybln5xxo] {
    background: var(--accent-hover);
}

.vibe-btn-primary:disabled[b-lkybln5xxo] {
    opacity: 0.5;
    cursor: not-allowed;
}

.vibe-btn-secondary[b-lkybln5xxo] {
    padding: var(--space-2) var(--space-4);
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.vibe-btn-secondary:hover:not(:disabled)[b-lkybln5xxo] {
    background: var(--bg-tertiary);
}

.vibe-suggest-row[b-lkybln5xxo] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--space-2);
}

.vibe-btn-suggest[b-lkybln5xxo] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3);
    background: linear-gradient(135deg, var(--thinking-primary), var(--accent-primary));
    color: white;
    border: none;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.vibe-btn-suggest:hover:not(:disabled)[b-lkybln5xxo] {
    filter: brightness(1.1);
    transform: translateY(-1px);
}

.vibe-btn-suggest:disabled[b-lkybln5xxo] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.suggest-spinner[b-lkybln5xxo] {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-lkybln5xxo 0.6s linear infinite;
}

@keyframes spin-b-lkybln5xxo {
    to { transform: rotate(360deg); }
}

@keyframes fadeIn-b-lkybln5xxo {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp-b-lkybln5xxo {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Thinking Toggle */
.thinking-toggle[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.thinking-toggle label[b-lkybln5xxo] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-weight: var(--font-medium);
}

.thinking-toggle input[type="checkbox"][b-lkybln5xxo] {
    width: 16px;
    height: 16px;
    accent-color: var(--thinking-primary);
    cursor: pointer;
}

/* Artifact Toggle Button */
.artifact-toggle-btn[b-lkybln5xxo] {
    position: relative;
    height: 32px;
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.artifact-toggle-btn:hover:not(:disabled)[b-lkybln5xxo] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-secondary);
}

.artifact-toggle-btn:disabled[b-lkybln5xxo] {
    opacity: 0.4;
    cursor: not-allowed;
}

.artifact-badge[b-lkybln5xxo] {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--accent-primary);
    color: white;
    border-radius: var(--radius-full);
    font-size: 0.5625rem;
    font-weight: var(--font-bold);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Error Banner */
.error-banner[b-lkybln5xxo] {
    padding: var(--space-2) var(--space-3);
    background-color: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    max-width: 50%;
    word-wrap: break-word;
}

/* Budget Banner */
.budget-banner[b-lkybln5xxo] {
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    text-align: center;
}

.budget-warning[b-lkybln5xxo] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--warning, #f59e0b);
    border-bottom: 1px solid rgba(245, 158, 11, 0.3);
}

.budget-over[b-lkybln5xxo] {
    background: rgba(239, 68, 68, 0.1);
    color: var(--error, #ef4444);
    border-bottom: 1px solid rgba(239, 68, 68, 0.3);
}

/* Messages Container */
.messages-container[b-lkybln5xxo] {
    flex: 1;
    overflow-y: auto;
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    background: var(--bg-primary);
}

/* Welcome Message */
.welcome-message[b-lkybln5xxo] {
    text-align: center;
    max-width: 480px;
    margin: auto;
    padding: var(--space-8);
    animation: fadeIn-b-lkybln5xxo var(--duration-normal) var(--ease-out);
}

@keyframes fadeIn-b-lkybln5xxo {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.welcome-logo[b-lkybln5xxo] {
    height: 240px;
    width: auto;
    margin: 0 auto var(--space-6);
    display: block;
}

.welcome-message h2[b-lkybln5xxo] {
    color: var(--text-primary);
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    letter-spacing: var(--tracking-tight);
}

.welcome-message p[b-lkybln5xxo] {
    color: var(--text-tertiary);
    margin: 0 0 var(--space-8) 0;
    font-size: var(--text-md);
    line-height: var(--leading-relaxed);
}

/* Suggestions */
.suggestions[b-lkybln5xxo] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.suggestion[b-lkybln5xxo] {
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    cursor: pointer;
    text-align: left;
    font-size: var(--text-sm);
    color: var(--text-primary);
    transition: all var(--duration-fast) var(--ease-out);
}

.suggestion:hover[b-lkybln5xxo] {
    background-color: var(--bg-tertiary);
    border-color: var(--border-secondary);
    transform: translateX(4px);
}

.suggestion:active[b-lkybln5xxo] {
    transform: translateX(2px);
}

.suggestion-manage[b-lkybln5xxo] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: var(--space-2) var(--space-3);
    background: transparent;
    border: 1px dashed var(--border-light);
    border-radius: var(--radius-md);
    color: var(--text-tertiary);
    font-size: 12px;
    cursor: pointer;
    margin-top: var(--space-2);
    transition: all var(--duration-fast) var(--ease-out);
}

.suggestion-manage:hover[b-lkybln5xxo] {
    border-color: var(--accent-primary);
    color: var(--accent-primary);
    background: rgba(99, 102, 241, 0.04);
}

/* Follow-up Question Panel — matches ThinkingIndicator design */
.follow-up-panel[b-lkybln5xxo] {
    padding: var(--space-3) var(--space-5);
    background: var(--bg-primary);
    border-top: 1px solid var(--border-light);
    animation: panelFadeIn-b-lkybln5xxo var(--duration-normal) var(--ease-out);
}

.follow-up-header[b-lkybln5xxo] {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.follow-up-label[b-lkybln5xxo] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--accent-primary);
    flex-shrink: 0;
}

.follow-up-question[b-lkybln5xxo] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    font-weight: var(--font-medium);
}

.follow-up-step[b-lkybln5xxo] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-left: auto;
    flex-shrink: 0;
}

.follow-up-options[b-lkybln5xxo] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
}

.follow-up-option[b-lkybln5xxo] {
    padding: var(--space-2) var(--space-4);
    background: var(--chat-sophia-bg);
    border: 1px solid var(--chat-sophia-border);
    border-radius: var(--radius-lg);
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--text-primary);
    transition: all var(--duration-fast) var(--ease-out);
}

.follow-up-option:hover[b-lkybln5xxo] {
    background: var(--accent-primary);
    border-color: var(--accent-primary);
    color: white;
    box-shadow:
        0 0 6px color-mix(in srgb, var(--accent-primary) 40%, transparent),
        0 0 12px color-mix(in srgb, var(--accent-primary) 20%, transparent);
}

.follow-up-option:active[b-lkybln5xxo] {
    opacity: 0.85;
}

@keyframes panelFadeIn-b-lkybln5xxo {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Write operation confirmation panel */
.write-operation-panel[b-lkybln5xxo] {
    border-top: 2px solid #f59e0b;
}

.clarification-panel[b-lkybln5xxo] {
    border-top: 2px solid #6366f1;
}

.clarification-input[b-lkybln5xxo] {
    display: flex;
    gap: var(--space-2);
    margin-top: var(--space-2);
}

.clarification-input input[b-lkybln5xxo] {
    flex: 1;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-secondary);
    border-radius: var(--radius-md);
    background: var(--bg-primary);
    color: var(--text-primary);
    font-size: var(--text-sm);
    font-family: var(--font-primary);
}

.clarification-input input:focus[b-lkybln5xxo] {
    outline: none;
    border-color: #6366f1;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.15);
}

.clarification-input button[b-lkybln5xxo] {
    flex-shrink: 0;
}

.write-operation-details[b-lkybln5xxo] {
    margin: var(--space-2) 0 var(--space-3);
}

.write-op-method[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
}

.write-op-method .method-badge[b-lkybln5xxo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 22px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: 11px;
    font-weight: 700;
    font-family: var(--font-mono);
    text-transform: uppercase;
    flex-shrink: 0;
}

.method-badge.method-post[b-lkybln5xxo] { background: #fef3c7; color: #b45309; }
.method-badge.method-put[b-lkybln5xxo] { background: #fed7aa; color: #c2410c; }
.method-badge.method-delete[b-lkybln5xxo] { background: #fce4ec; color: #c62828; }
.method-badge.method-patch[b-lkybln5xxo] { background: #e8d5f5; color: #7b1fa2; }
.method-badge.method-get[b-lkybln5xxo] { background: #dbeafe; color: #1d4ed8; }

.write-op-endpoint[b-lkybln5xxo] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    word-break: break-all;
}

.write-op-description[b-lkybln5xxo] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    margin: 0 0 var(--space-2);
}

.write-op-body-details[b-lkybln5xxo] {
    margin-top: var(--space-2);
}

.write-op-body-details summary[b-lkybln5xxo] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    cursor: pointer;
    user-select: none;
}

.write-op-body-preview[b-lkybln5xxo] {
    margin-top: var(--space-1);
    padding: var(--space-2);
    background: var(--bg-secondary);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    max-height: 200px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-all;
}

.follow-up-option.write-approve[b-lkybln5xxo] {
    background: #dcfce7;
    border-color: #86efac;
    color: #15803d;
}

.follow-up-option.write-approve:hover[b-lkybln5xxo] {
    background: #15803d;
    border-color: #15803d;
    color: white;
}

.follow-up-option.dismiss[b-lkybln5xxo] {
    background: #fce4ec;
    border-color: #f8bbd0;
    color: #c62828;
}

.follow-up-option.dismiss:hover[b-lkybln5xxo] {
    background: #c62828;
    border-color: #c62828;
    color: white;
}

/* Inline images from PTC code execution */
[b-lkybln5xxo] .message-content img {
    max-width: 100%;
    border-radius: var(--radius-md);
    margin: var(--space-2) 0;
}

/* Sidebar Toggle (hamburger) — hidden on desktop */
.sidebar-toggle[b-lkybln5xxo] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: none;
    color: var(--text-secondary);
    cursor: pointer;
    border-radius: var(--radius-md);
    transition: all var(--duration-fast) var(--ease-out);
    flex-shrink: 0;
}

.sidebar-toggle:hover[b-lkybln5xxo] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Mobile Settings Bar — hidden on desktop */
.mobile-settings[b-lkybln5xxo] {
    display: none;
}

/* Sidebar Backdrop — hidden on desktop */
.sidebar-backdrop[b-lkybln5xxo] {
    display: none;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .chat-page[b-lkybln5xxo] {
        height: 100vh;
        position: relative;
    }

    /* Sidebar becomes a slide-over drawer */
    .sidebar[b-lkybln5xxo] {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 280px;
        z-index: 201;
        transform: translateX(-100%);
        transition: transform var(--duration-normal) var(--ease-out);
        background: var(--bg-primary);
        border-right: 1px solid var(--border-light);
        box-shadow: none;
    }

    .sidebar.sidebar-open[b-lkybln5xxo] {
        transform: translateX(0);
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.2);
    }

    .sidebar-backdrop[b-lkybln5xxo] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 200;
        background: rgba(0, 0, 0, 0.4);
        animation: fadeIn-b-lkybln5xxo var(--duration-fast) var(--ease-out);
    }

    .sidebar-toggle[b-lkybln5xxo] {
        display: flex;
    }

    .chat-main[b-lkybln5xxo] {
        border-left: none;
    }

    .chat-header[b-lkybln5xxo] {
        padding: 0 var(--space-3);
        height: 48px;
    }

    .header-left[b-lkybln5xxo] {
        gap: var(--space-2);
    }

    /* Hide desktop controls — replaced by mobile-settings bar */
    .header-right .model-selector[b-lkybln5xxo],
    .header-right .vibe-selector[b-lkybln5xxo],
    .header-right .thinking-toggle[b-lkybln5xxo] {
        display: none;
    }

    .sophia-name[b-lkybln5xxo] {
        display: none;
    }

    /* Mobile Settings Bar */
    .mobile-settings[b-lkybln5xxo] {
        display: flex;
        align-items: center;
        gap: var(--space-2);
        padding: var(--space-2) var(--space-3);
        border-bottom: 1px solid var(--border-light);
        background: var(--bg-secondary);
        overflow-x: auto;
        flex-shrink: 0;
        -webkit-overflow-scrolling: touch;
    }

    .mobile-settings[b-lkybln5xxo]::-webkit-scrollbar {
        display: none;
    }

    .mobile-model-selector select[b-lkybln5xxo] {
        height: 32px;
        padding: 0 var(--space-2);
        border: 1px solid var(--border-primary);
        border-radius: var(--radius-md);
        background: var(--bg-primary);
        color: var(--text-primary);
        font-size: var(--text-xs);
        min-width: 0;
        max-width: 140px;
    }

    .mobile-thinking[b-lkybln5xxo] {
        display: flex;
        align-items: center;
        gap: var(--space-1);
        font-size: var(--text-xs);
        color: var(--text-secondary);
        white-space: nowrap;
        cursor: pointer;
        flex-shrink: 0;
    }

    .mobile-thinking input[type="checkbox"][b-lkybln5xxo] {
        width: 14px;
        height: 14px;
        accent-color: var(--thinking-primary);
        cursor: pointer;
    }

    .mobile-vibe-btn[b-lkybln5xxo] {
        height: 32px;
        padding: 0 var(--space-3);
        border: 1px solid var(--border-primary);
        border-radius: var(--radius-md);
        background: var(--bg-primary);
        color: var(--text-primary);
        font-size: var(--text-xs);
        cursor: pointer;
        white-space: nowrap;
        flex-shrink: 0;
        transition: all var(--duration-fast) var(--ease-out);
    }

    .mobile-vibe-btn:hover:not(:disabled)[b-lkybln5xxo] {
        border-color: var(--accent-primary);
        background: var(--bg-tertiary);
    }

    .mobile-vibe-btn:disabled[b-lkybln5xxo] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .messages-container[b-lkybln5xxo] {
        padding: var(--space-3);
    }

    .welcome-message[b-lkybln5xxo] {
        padding: var(--space-4);
    }

    .welcome-logo[b-lkybln5xxo] {
        height: 120px;
    }

    .welcome-message h2[b-lkybln5xxo] {
        font-size: var(--text-xl);
    }

    .follow-up-panel[b-lkybln5xxo] {
        padding: var(--space-2) var(--space-3);
    }

    .follow-up-option[b-lkybln5xxo] {
        font-size: var(--text-sm);
        padding: var(--space-2) var(--space-3);
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    /* Vibe dropdown needs higher z-index on mobile to appear above mobile-settings */
    .vibe-dropdown-menu[b-lkybln5xxo] {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        max-width: 100%;
        max-height: 60vh;
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        z-index: 300;
    }

    .error-banner[b-lkybln5xxo] {
        max-width: 100%;
    }
}

/* Setup Nudge Banner */
.setup-nudge-banner[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background: var(--accent-subtle);
    border-bottom: 1px solid var(--border-light);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    flex-shrink: 0;
}

.setup-nudge-content[b-lkybln5xxo] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.setup-nudge-content svg[b-lkybln5xxo] {
    color: var(--accent-primary);
    flex-shrink: 0;
}

.setup-nudge-link[b-lkybln5xxo] {
    color: var(--accent-primary);
    font-weight: var(--font-medium);
    text-decoration: none;
    white-space: nowrap;
    margin-left: var(--space-1);
}

.setup-nudge-link:hover[b-lkybln5xxo] {
    text-decoration: underline;
}

.setup-nudge-close[b-lkybln5xxo] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: color var(--duration-fast) var(--ease-out);
}

.setup-nudge-close:hover[b-lkybln5xxo] {
    color: var(--text-primary);
}

/* Small phones */
@media (max-width: 480px) {
    .welcome-message[b-lkybln5xxo] {
        padding: var(--space-3);
    }

    .welcome-logo[b-lkybln5xxo] {
        height: 100px;
    }

    .welcome-message h2[b-lkybln5xxo] {
        font-size: var(--text-lg);
    }

    .welcome-message p[b-lkybln5xxo] {
        font-size: var(--text-sm);
    }
}
/* /Pages/Dashboard.razor.rz.scp.css */
/* Dashboard Page Styles */

.dashboard-page[b-nchgaw4ntc] {
    padding: var(--space-6);
    max-width: 1400px;
    margin: 0 auto;
}

/* Header */
.dashboard-header[b-nchgaw4ntc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
}

.dashboard-header h1[b-nchgaw4ntc] {
    font-size: var(--text-3xl);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.dashboard-header .subtitle[b-nchgaw4ntc] {
    color: var(--text-secondary);
    font-size: var(--text-base);
    margin-top: var(--space-1);
}

.header-actions[b-nchgaw4ntc] {
    display: flex;
    gap: var(--space-2);
}

/* Buttons */
.btn-primary[b-nchgaw4ntc] {
    padding: var(--space-2) var(--space-4);
    background: var(--accent-gradient);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-primary:hover[b-nchgaw4ntc] {
    background: var(--accent-gradient-hover);
    transform: translateY(-1px);
}

.btn-primary:disabled[b-nchgaw4ntc] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.btn-secondary[b-nchgaw4ntc] {
    padding: var(--space-2) var(--space-4);
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-secondary:hover[b-nchgaw4ntc] {
    background: var(--bg-secondary);
    border-color: var(--accent-primary);
}

/* Loading */
.loading-container[b-nchgaw4ntc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
    padding: var(--space-12);
    color: var(--text-secondary);
}

.loading-spinner-large[b-nchgaw4ntc] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border-secondary);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-nchgaw4ntc 0.75s linear infinite;
}

@keyframes spin-b-nchgaw4ntc {
    to { transform: rotate(360deg); }
}

/* Error Banner */
.error-banner[b-nchgaw4ntc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
}

.close-btn[b-nchgaw4ntc] {
    background: none;
    border: none;
    color: inherit;
    font-size: var(--text-lg);
    cursor: pointer;
    padding: var(--space-1);
    line-height: 1;
}

/* ─── Welcome State ─── */
.welcome-state[b-nchgaw4ntc] {
    text-align: center;
    padding: var(--space-8) var(--space-4);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-6);
}

.welcome-icon[b-nchgaw4ntc] {
    color: var(--accent-primary);
    margin-bottom: var(--space-4);
}

.welcome-state h2[b-nchgaw4ntc] {
    font-size: var(--text-xl);
    color: var(--text-primary);
    margin: 0 0 var(--space-2) 0;
}

.welcome-state > p[b-nchgaw4ntc] {
    color: var(--text-secondary);
    margin: 0 0 var(--space-6) 0;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.starter-grid[b-nchgaw4ntc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-6);
    text-align: left;
}

.starter-card[b-nchgaw4ntc] {
    padding: var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
}

.starter-card h4[b-nchgaw4ntc] {
    margin: var(--space-2) 0 var(--space-1) 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.starter-card p[b-nchgaw4ntc] {
    margin: 0;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    line-height: 1.4;
}

/* ─── Widget Grid ─── */
.widget-grid[b-nchgaw4ntc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: dense;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

/* Dynamic column spans */
.col-span-1[b-nchgaw4ntc] { grid-column: span 1; }
.col-span-2[b-nchgaw4ntc] { grid-column: span 2; }
.col-span-3[b-nchgaw4ntc] { grid-column: span 3; }

/* KPI widgets are more compact */
.widget-card.wt-kpi[b-nchgaw4ntc] {
    min-height: 140px;
}

.widget-card[b-nchgaw4ntc] {
    position: relative;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    background: var(--bg-primary);
    overflow: hidden;
    min-width: 0;
}

/* ─── Resize Handle ─── */
.resize-handle[b-nchgaw4ntc] {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 20px;
    height: 20px;
    cursor: col-resize;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity var(--transition-fast);
    z-index: 5;
    color: var(--text-tertiary);
    border-radius: 0 0 var(--radius-lg) 0;
}

.widget-card:hover .resize-handle[b-nchgaw4ntc] {
    opacity: 0.6;
}

.resize-handle:hover[b-nchgaw4ntc] {
    opacity: 1 !important;
    color: var(--accent-primary);
}

/* Resizing active state */
.widget-card.resizing[b-nchgaw4ntc] {
    z-index: 10;
    box-shadow: 0 0 0 2px var(--accent-primary);
    transition: box-shadow 0.15s ease;
}

.widget-card.resizing .resize-handle[b-nchgaw4ntc] {
    opacity: 1;
    color: var(--accent-primary);
}

.widget-card-header[b-nchgaw4ntc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-1) var(--space-2);
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-light);
}

.widget-card-controls[b-nchgaw4ntc] {
    display: flex;
    gap: 2px;
    opacity: 0;
    transition: opacity var(--transition-fast);
}

.widget-card:hover .widget-card-controls[b-nchgaw4ntc] {
    opacity: 1;
}

.widget-ctrl-btn[b-nchgaw4ntc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--radius-sm);
    color: var(--text-tertiary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.widget-ctrl-btn:hover[b-nchgaw4ntc] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

.widget-ctrl-btn.danger:hover[b-nchgaw4ntc] {
    background: var(--error-subtle);
    color: var(--error);
}

.widget-ctrl-btn:disabled[b-nchgaw4ntc] {
    opacity: 0.3;
    cursor: not-allowed;
}

.widget-card-meta[b-nchgaw4ntc] {
    display: flex;
    gap: var(--space-1);
    align-items: center;
}

.widget-type-badge[b-nchgaw4ntc],
.starter-type-badge[b-nchgaw4ntc] {
    font-size: 10px;
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 1px var(--space-2);
    border-radius: var(--radius-sm);
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.widget-type-badge.wt-kpi[b-nchgaw4ntc],
.starter-type-badge.wt-kpi[b-nchgaw4ntc] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.widget-type-badge.wt-chart[b-nchgaw4ntc],
.starter-type-badge.wt-chart[b-nchgaw4ntc] {
    background: var(--success-subtle);
    color: var(--success);
}

.widget-type-badge.wt-table[b-nchgaw4ntc],
.starter-type-badge.wt-table[b-nchgaw4ntc] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.widget-type-badge.wt-insight[b-nchgaw4ntc],
.starter-type-badge.wt-insight[b-nchgaw4ntc] {
    background: var(--error-subtle);
    color: var(--error);
}

.interval-badge[b-nchgaw4ntc] {
    font-size: 10px;
    color: var(--text-tertiary);
    padding: 1px var(--space-1);
}

.interval-badge.manual[b-nchgaw4ntc] {
    color: var(--text-tertiary);
    font-style: italic;
}

/* ─── Modal ─── */
.modal-overlay[b-nchgaw4ntc] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    padding: var(--space-4);
}

.modal-content[b-nchgaw4ntc] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    max-width: 560px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: var(--shadow-xl);
}

.modal-header[b-nchgaw4ntc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.modal-header h3[b-nchgaw4ntc] {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

.modal-body[b-nchgaw4ntc] {
    padding: var(--space-5);
}

.modal-footer[b-nchgaw4ntc] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-light);
}

/* Form elements */
.form-group[b-nchgaw4ntc] {
    margin-bottom: var(--space-4);
}

.form-group label[b-nchgaw4ntc] {
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    margin-bottom: var(--space-1);
}

.form-group input[b-nchgaw4ntc],
.form-group textarea[b-nchgaw4ntc],
.form-group select[b-nchgaw4ntc] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.form-group input:focus[b-nchgaw4ntc],
.form-group textarea:focus[b-nchgaw4ntc],
.form-group select:focus[b-nchgaw4ntc] {
    outline: none;
    border-color: var(--accent-primary);
}

.form-row[b-nchgaw4ntc] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

/* ─── Activity Section ─── */
.activity-section[b-nchgaw4ntc] {
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
}

.activity-section .section-header[b-nchgaw4ntc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.activity-section h2[b-nchgaw4ntc] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.view-all-link[b-nchgaw4ntc] {
    font-size: var(--text-sm);
    color: var(--accent-primary);
    text-decoration: none;
}

.view-all-link:hover[b-nchgaw4ntc] {
    color: var(--accent-hover);
}

.activity-list[b-nchgaw4ntc] {
    display: flex;
    flex-direction: column;
}

.activity-item[b-nchgaw4ntc] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background var(--transition-fast);
}

.activity-item:hover[b-nchgaw4ntc] {
    background: var(--bg-secondary);
}

.activity-icon[b-nchgaw4ntc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--bg-tertiary);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    flex-shrink: 0;
}

.activity-content[b-nchgaw4ntc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    overflow: hidden;
}

.activity-title[b-nchgaw4ntc] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.activity-meta[b-nchgaw4ntc] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.empty-activity[b-nchgaw4ntc] {
    text-align: center;
    padding: var(--space-8) var(--space-4);
    color: var(--text-secondary);
}

.empty-activity p[b-nchgaw4ntc] {
    margin: 0 0 var(--space-4) 0;
}

/* ─── Size Selector (Edit Modal) ─── */
.size-selector[b-nchgaw4ntc] {
    display: flex;
    gap: var(--space-2);
}

.size-option[b-nchgaw4ntc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-1);
    background: var(--bg-primary);
    border: 2px solid var(--border-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: all var(--transition-fast);
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.size-option:hover[b-nchgaw4ntc] {
    border-color: var(--accent-primary);
    color: var(--text-primary);
}

.size-option.active[b-nchgaw4ntc] {
    border-color: var(--accent-primary);
    background: var(--accent-subtle);
    color: var(--accent-primary);
    font-weight: var(--font-medium);
}

.size-preview[b-nchgaw4ntc] {
    display: flex;
    gap: 2px;
    height: 16px;
    align-items: end;
}

.size-preview span[b-nchgaw4ntc] {
    display: block;
    width: 12px;
    height: 100%;
    background: var(--border-secondary);
    border-radius: 2px;
}

.size-option.active .size-preview span.filled[b-nchgaw4ntc] {
    background: var(--accent-primary);
}

.size-preview span.filled[b-nchgaw4ntc] {
    background: var(--text-tertiary);
}

/* Responsive */
@media (min-width: 600px) and (max-width: 999px) {
    .widget-grid[b-nchgaw4ntc] {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Clamp spans to 2 on medium screens */
    .col-span-3[b-nchgaw4ntc] { grid-column: span 2; }
}

@media (max-width: 599px) {
    .widget-grid[b-nchgaw4ntc] {
        grid-template-columns: 1fr;
    }

    /* All widgets full width on mobile */
    .col-span-1[b-nchgaw4ntc], .col-span-2[b-nchgaw4ntc], .col-span-3[b-nchgaw4ntc] {
        grid-column: span 1;
    }

    /* Hide resize handle on mobile/tablet */
    .resize-handle[b-nchgaw4ntc] {
        display: none;
    }
}

@media (max-width: 900px) {
    .form-row[b-nchgaw4ntc] {
        grid-template-columns: 1fr;
    }

    .starter-grid[b-nchgaw4ntc] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .dashboard-page[b-nchgaw4ntc] {
        padding: var(--space-4);
    }

    .dashboard-header[b-nchgaw4ntc] {
        flex-direction: column;
        gap: var(--space-3);
    }
}
/* /Pages/ForgotPassword.razor.rz.scp.css */
.reset-page[b-nql6scarxj] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-4);
}

.reset-container[b-nql6scarxj] {
    width: 100%;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.reset-card[b-nql6scarxj] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    box-shadow: var(--shadow-lg);
}

.reset-header[b-nql6scarxj] {
    text-align: center;
    margin-bottom: var(--space-6);
}

.logo[b-nql6scarxj] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-4);
}

.logo-image[b-nql6scarxj] {
    width: 120px;
    height: auto;
}

.tagline[b-nql6scarxj] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: var(--space-2) 0 0 0;
}

.instruction-text[b-nql6scarxj] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0 0 var(--space-4) 0;
}

.error-banner[b-nql6scarxj] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    background: var(--error-subtle);
    border: 1px solid var(--error);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    color: var(--error);
    font-size: var(--text-sm);
}

.success-banner[b-nql6scarxj] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    padding: var(--space-3);
    background: var(--success-subtle);
    border: 1px solid var(--success);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    color: var(--success);
    font-size: var(--text-sm);
    line-height: 1.5;
}

.success-banner svg[b-nql6scarxj] {
    flex-shrink: 0;
    margin-top: 2px;
}

.reset-form[b-nql6scarxj] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.form-group[b-nql6scarxj] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.form-group label[b-nql6scarxj] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.form-input[b-nql6scarxj] {
    width: 100%;
    height: 40px;
    padding: 0 var(--space-3);
    font-size: var(--text-base);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    transition: all var(--duration-fast) var(--ease-out);
    box-sizing: border-box;
}

.form-input:focus[b-nql6scarxj] {
    outline: none;
    background: var(--bg-primary);
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.form-input[b-nql6scarxj]::placeholder {
    color: var(--text-muted);
}

.submit-button[b-nql6scarxj] {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    margin-top: var(--space-2);
}

.submit-button:hover:not(:disabled)[b-nql6scarxj] {
    background: var(--accent-hover);
}

.submit-button:disabled[b-nql6scarxj] {
    opacity: 0.6;
    cursor: not-allowed;
}

.loading-spinner[b-nql6scarxj] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-nql6scarxj 0.6s linear infinite;
}

@keyframes spin-b-nql6scarxj {
    to { transform: rotate(360deg); }
}

.form-actions[b-nql6scarxj] {
    text-align: center;
    margin-top: var(--space-4);
}

.back-link[b-nql6scarxj] {
    font-size: var(--text-sm);
    color: var(--accent-primary);
    text-decoration: none;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.back-link:hover[b-nql6scarxj] {
    opacity: 0.8;
    text-decoration: underline;
}

.page-footer[b-nql6scarxj] {
    text-align: center;
}

.footer-text[b-nql6scarxj] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: 0;
}

.footer-text strong[b-nql6scarxj] {
    color: var(--accent-primary);
    font-weight: var(--font-semibold);
}
/* /Pages/Landing.razor.rz.scp.css */
/* ============================================
   Landing Page — Own Design System
   Brand palette from logo: navy → teal → cyan
   ============================================ */

.landing[b-eb4vk89b7c] {
    --ln-navy: #0a1628;
    --ln-navy-mid: #0f1f3a;
    --ln-ocean: #1a5276;
    --ln-teal: #17a2b8;
    --ln-cyan: #00d4ff;
    --ln-white: #ffffff;
    --ln-off-white: #f0f4f8;
    --ln-gray: #8a9bb5;
    --ln-gray-dark: #4a5e7a;
    --ln-section-dark: #0c1a2e;
    --ln-section-light: #f7fafc;
    --ln-card-bg: #ffffff;
    --ln-card-border: #e2e8f0;
    --ln-input-bg: #ffffff;
    --ln-input-border: #d1d5db;
    --ln-text-dark: #1a202c;
    --ln-text-body: #4a5568;

    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--ln-text-dark);
    overflow-x: hidden;
    scroll-behavior: smooth;
}

.landing-container[b-eb4vk89b7c] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* ============================================
   Navigation
   ============================================ */

.landing-nav[b-eb4vk89b7c] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: rgba(10, 22, 40, 0.92);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.nav-inner[b-eb4vk89b7c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
}

.nav-brand[b-eb4vk89b7c] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    text-decoration: none;
}

.nav-logo[b-eb4vk89b7c] {
    width: 56px;
    height: 56px;
    object-fit: contain;
}

.nav-wordmark[b-eb4vk89b7c] {
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--ln-white);
    letter-spacing: -0.02em;
}

.nav-links[b-eb4vk89b7c] {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.nav-anchor[b-eb4vk89b7c] {
    color: var(--ln-gray);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: color 0.15s;
}

.nav-anchor:hover[b-eb4vk89b7c] {
    color: var(--ln-white);
}

.nav-signup-btn[b-eb4vk89b7c] {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--ln-cyan);
    color: var(--ln-navy);
    font-size: 0.875rem;
    font-weight: 700;
    border-radius: 6px;
    text-decoration: none;
    transition: background 0.15s;
}

.nav-signup-btn:hover[b-eb4vk89b7c] {
    background: #00e5ff;
    color: var(--ln-navy);
}

.nav-login-btn[b-eb4vk89b7c] {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--ln-teal);
    color: var(--ln-white);
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none;
    transition: background 0.15s;
}

.nav-login-btn:hover[b-eb4vk89b7c] {
    background: #1ab8d0;
    color: var(--ln-white);
}

.mobile-toggle[b-eb4vk89b7c] {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
}

.mobile-toggle span[b-eb4vk89b7c] {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--ln-white);
    border-radius: 2px;
    transition: transform 0.2s, opacity 0.2s;
}

/* ============================================
   Hero
   ============================================ */

.hero[b-eb4vk89b7c] {
    position: relative;
    min-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding-top: 72px;
}

.hero-bg[b-eb4vk89b7c] {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #0a1628 0%, #1a5276 50%, #17a2b8 100%);
    z-index: 0;
}

.hero-bg[b-eb4vk89b7c]::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 20% 80%, rgba(0, 212, 255, 0.12) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 20%, rgba(23, 162, 184, 0.15) 0%, transparent 50%);
}

.hero-content[b-eb4vk89b7c] {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 4rem 1.5rem;
}

.hero-title[b-eb4vk89b7c] {
    font-size: clamp(2.25rem, 5vw, 4rem);
    font-weight: 800;
    color: var(--ln-white);
    line-height: 1.15;
    letter-spacing: -0.03em;
    margin-bottom: 1.5rem;
}

.hero-subtitle[b-eb4vk89b7c] {
    font-size: clamp(1rem, 2vw, 1.25rem);
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.6;
    max-width: 560px;
    margin: 0 auto 2.5rem;
}

.hero-cta[b-eb4vk89b7c] {
    display: inline-flex;
    align-items: center;
    height: 52px;
    padding: 0 2.5rem;
    background: var(--ln-cyan);
    color: var(--ln-navy);
    font-size: 1rem;
    font-weight: 700;
    border-radius: 8px;
    text-decoration: none;
    transition: transform 0.15s, box-shadow 0.15s;
    box-shadow: 0 4px 24px rgba(0, 212, 255, 0.3);
}

.hero-cta:hover[b-eb4vk89b7c] {
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(0, 212, 255, 0.4);
    color: var(--ln-navy);
}

.hero-cta:active[b-eb4vk89b7c] {
    transform: translateY(0);
}

.hero-cta-group[b-eb4vk89b7c] {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: center;
}

.hero-cta-secondary[b-eb4vk89b7c] {
    display: inline-flex;
    align-items: center;
    height: 52px;
    padding: 0 2rem;
    background: transparent;
    color: var(--ln-text);
    font-size: 1rem;
    font-weight: 600;
    border: 1px solid var(--ln-border);
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.hero-cta-secondary:hover[b-eb4vk89b7c] {
    border-color: var(--ln-cyan);
    color: var(--ln-cyan);
}

/* ============================================
   Sections (shared)
   ============================================ */

.section[b-eb4vk89b7c] {
    padding: 5rem 0;
}

.section-light[b-eb4vk89b7c] {
    background: var(--ln-section-light);
}

.section-dark[b-eb4vk89b7c] {
    background: var(--ln-section-dark);
}

.section-contact[b-eb4vk89b7c] {
    background: linear-gradient(135deg, #0c1a2e 0%, #0f2640 100%);
    padding: 6rem 0;
}

.section-title[b-eb4vk89b7c] {
    text-align: center;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 0.75rem;
    color: var(--ln-text-dark);
}

.section-title.light[b-eb4vk89b7c] {
    color: var(--ln-white);
}

.section-subtitle[b-eb4vk89b7c] {
    text-align: center;
    font-size: 1.0625rem;
    color: var(--ln-text-body);
    margin-bottom: 3rem;
}

.section-subtitle.light[b-eb4vk89b7c] {
    color: var(--ln-gray);
}

/* ============================================
   Features
   ============================================ */

.features-grid[b-eb4vk89b7c] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.features-grid .feature-card:nth-child(4)[b-eb4vk89b7c],
.features-grid .feature-card:nth-child(5)[b-eb4vk89b7c] {
    max-width: 100%;
}

.feature-card[b-eb4vk89b7c] {
    background: var(--ln-card-bg);
    border: 1px solid var(--ln-card-border);
    border-radius: 12px;
    padding: 2rem 1.5rem;
    text-align: center;
    transition: transform 0.2s, box-shadow 0.2s;
}

.feature-card:hover[b-eb4vk89b7c] {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

.feature-icon[b-eb4vk89b7c] {
    width: 48px;
    height: 48px;
    margin: 0 auto 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1a5276, #17a2b8);
    border-radius: 12px;
    color: var(--ln-white);
}

.feature-icon svg[b-eb4vk89b7c] {
    width: 24px;
    height: 24px;
}

.feature-card h3[b-eb4vk89b7c] {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--ln-text-dark);
    margin-bottom: 0.625rem;
}

.feature-card p[b-eb4vk89b7c] {
    font-size: 0.9375rem;
    color: var(--ln-text-body);
    line-height: 1.5;
}

/* ============================================
   How It Works
   ============================================ */

.steps-grid[b-eb4vk89b7c] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.step-card[b-eb4vk89b7c] {
    text-align: center;
    padding: 2rem 1.5rem;
}

.step-number[b-eb4vk89b7c] {
    width: 56px;
    height: 56px;
    margin: 0 auto 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--ln-teal), var(--ln-cyan));
    border-radius: 50%;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--ln-navy);
}

.step-card h3[b-eb4vk89b7c] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--ln-white);
    margin-bottom: 0.625rem;
}

.step-card p[b-eb4vk89b7c] {
    font-size: 0.9375rem;
    color: var(--ln-gray);
    line-height: 1.5;
}

/* ============================================
   Agent Capabilities
   ============================================ */

.capabilities-grid[b-eb4vk89b7c] {
    max-width: 720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.capability-row[b-eb4vk89b7c] {
    background: var(--ln-card-bg);
    border: 1px solid var(--ln-card-border);
    border-radius: 12px;
    padding: 1.5rem;
    transition: transform 0.2s, box-shadow 0.2s;
}

.capability-row:hover[b-eb4vk89b7c] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.capability-content h3[b-eb4vk89b7c] {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--ln-text-dark);
    margin-bottom: 0.375rem;
}

.capability-content p[b-eb4vk89b7c] {
    font-size: 0.9375rem;
    color: var(--ln-text-body);
    line-height: 1.55;
}

/* ============================================
   About
   ============================================ */

.about-content[b-eb4vk89b7c] {
    max-width: 720px;
}

.about-text p[b-eb4vk89b7c] {
    font-size: 1.0625rem;
    color: var(--ln-gray);
    line-height: 1.7;
    margin-bottom: 1.25rem;
}

.about-text p:last-child[b-eb4vk89b7c] {
    margin-bottom: 0;
}

/* ============================================
   Contact Form
   ============================================ */

.contact-container[b-eb4vk89b7c] {
    max-width: 600px;
}

.section-contact .section-title[b-eb4vk89b7c] {
    margin-bottom: 1rem;
}

.section-contact .section-subtitle[b-eb4vk89b7c] {
    margin-bottom: 2.5rem;
}

.contact-form[b-eb4vk89b7c] {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
}

.form-row-landing[b-eb4vk89b7c] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;
}

.form-field[b-eb4vk89b7c] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-field label[b-eb4vk89b7c] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.8);
}

.landing-input[b-eb4vk89b7c] {
    width: 100%;
    height: 48px;
    padding: 0 1rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: var(--ln-white);
    font-size: 0.9375rem;
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.landing-input[b-eb4vk89b7c]::placeholder {
    color: rgba(255, 255, 255, 0.35);
}

.landing-input:focus[b-eb4vk89b7c] {
    outline: none;
    border-color: var(--ln-teal);
    box-shadow: 0 0 0 3px rgba(23, 162, 184, 0.2);
}

.landing-textarea[b-eb4vk89b7c] {
    height: auto;
    min-height: 140px;
    padding: 0.875rem 1rem;
    resize: vertical;
}

.form-error[b-eb4vk89b7c] {
    padding: 0.75rem 1rem;
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 8px;
    color: #fca5a5;
    font-size: 0.875rem;
}

[b-eb4vk89b7c] .validation-message {
    color: #fca5a5;
    font-size: 0.75rem;
    margin-top: 0.125rem;
}

.submit-btn[b-eb4vk89b7c] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 52px;
    padding: 0 2.5rem;
    margin-top: 0.5rem;
    background: var(--ln-cyan);
    color: var(--ln-navy);
    font-size: 1rem;
    font-weight: 700;
    font-family: inherit;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s, opacity 0.15s;
    box-shadow: 0 4px 16px rgba(0, 212, 255, 0.25);
    align-self: flex-start;
}

.submit-btn:hover:not(:disabled)[b-eb4vk89b7c] {
    transform: translateY(-1px);
    box-shadow: 0 6px 24px rgba(0, 212, 255, 0.35);
}

.submit-btn:disabled[b-eb4vk89b7c] {
    opacity: 0.7;
    cursor: not-allowed;
}

.btn-spinner[b-eb4vk89b7c] {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(10, 22, 40, 0.3);
    border-top-color: var(--ln-navy);
    border-radius: 50%;
    animation: spin-b-eb4vk89b7c 0.6s linear infinite;
}

@keyframes spin-b-eb4vk89b7c {
    to { transform: rotate(360deg); }
}

.contact-success[b-eb4vk89b7c] {
    text-align: center;
    padding: 3rem 1rem;
}

.contact-success svg[b-eb4vk89b7c] {
    width: 56px;
    height: 56px;
    color: #34d399;
    margin-bottom: 1rem;
}

.contact-success h3[b-eb4vk89b7c] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--ln-white);
    margin-bottom: 0.5rem;
}

.contact-success p[b-eb4vk89b7c] {
    color: var(--ln-gray);
    font-size: 1.0625rem;
}

/* ============================================
   Footer
   ============================================ */

.landing-footer[b-eb4vk89b7c] {
    background: var(--ln-navy);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 3rem 0 0;
}

.footer-grid[b-eb4vk89b7c] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 2rem;
    padding-bottom: 2rem;
}

.footer-col[b-eb4vk89b7c] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.footer-brand[b-eb4vk89b7c] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.footer-logo[b-eb4vk89b7c] {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.footer-wordmark[b-eb4vk89b7c] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--ln-white);
    letter-spacing: -0.02em;
}

.footer-legal-name[b-eb4vk89b7c] {
    font-size: 0.8125rem;
    color: var(--ln-gray);
    font-weight: 600;
    margin: 0;
}

.footer-reg[b-eb4vk89b7c] {
    font-size: 0.75rem;
    color: var(--ln-gray-dark);
    margin: 0;
}

.footer-address[b-eb4vk89b7c] {
    font-size: 0.75rem;
    color: var(--ln-gray-dark);
    line-height: 1.5;
    margin: 0;
}

.footer-heading[b-eb4vk89b7c] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--ln-white);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.25rem;
}

.footer-legal a[b-eb4vk89b7c],
.footer-contact a[b-eb4vk89b7c] {
    color: var(--ln-gray);
    text-decoration: none;
    font-size: 0.8125rem;
    transition: color 0.15s;
}

.footer-legal a:hover[b-eb4vk89b7c],
.footer-contact a:hover[b-eb4vk89b7c] {
    color: var(--ln-white);
}

.footer-bottom[b-eb4vk89b7c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-2);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 1.25rem 0;
    font-size: 0.75rem;
    color: var(--ln-gray-dark);
}

.footer-bottom .recaptcha-notice[b-eb4vk89b7c] {
    opacity: 0.6;
}

.footer-bottom .recaptcha-notice a[b-eb4vk89b7c] {
    color: var(--ln-gray-dark);
    text-decoration: underline;
}

.footer-bottom .recaptcha-notice a:hover[b-eb4vk89b7c] {
    color: var(--ln-gray);
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 1024px) {
    .features-grid[b-eb4vk89b7c] {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media (max-width: 768px) {
    .mobile-toggle[b-eb4vk89b7c] {
        display: flex;
    }

    .nav-links[b-eb4vk89b7c] {
        position: fixed;
        top: 72px;
        left: 0;
        right: 0;
        flex-direction: column;
        background: rgba(10, 22, 40, 0.98);
        padding: 1.5rem;
        gap: 1rem;
        transform: translateY(-100%);
        opacity: 0;
        pointer-events: none;
        transition: transform 0.25s, opacity 0.25s;
    }

    .nav-links.open[b-eb4vk89b7c] {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }

    .nav-login-btn[b-eb4vk89b7c] {
        width: 100%;
        justify-content: center;
    }

    .hero[b-eb4vk89b7c] {
        min-height: 80vh;
    }

    .hero-content[b-eb4vk89b7c] {
        padding: 3rem 1rem;
    }

    .features-grid[b-eb4vk89b7c] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .steps-grid[b-eb4vk89b7c] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .form-row-landing[b-eb4vk89b7c] {
        grid-template-columns: 1fr;
    }

    .section[b-eb4vk89b7c] {
        padding: 3.5rem 0;
    }

    .submit-btn[b-eb4vk89b7c] {
        width: 100%;
    }

    .footer-grid[b-eb4vk89b7c] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
}

/* ============================================
   Scroll animation (CSS-only fade-in-up)
   ============================================ */

.feature-card[b-eb4vk89b7c],
.step-card[b-eb4vk89b7c] {
    animation: fadeInUpLanding-b-eb4vk89b7c 0.5s ease-out both;
}

.feature-card:nth-child(1)[b-eb4vk89b7c] { animation-delay: 0ms; }
.feature-card:nth-child(2)[b-eb4vk89b7c] { animation-delay: 100ms; }
.feature-card:nth-child(3)[b-eb4vk89b7c] { animation-delay: 200ms; }
.feature-card:nth-child(4)[b-eb4vk89b7c] { animation-delay: 300ms; }
.feature-card:nth-child(5)[b-eb4vk89b7c] { animation-delay: 400ms; }

.capability-row[b-eb4vk89b7c] {
    animation: fadeInUpLanding-b-eb4vk89b7c 0.5s ease-out both;
}

.capability-row:nth-child(1)[b-eb4vk89b7c] { animation-delay: 0ms; }
.capability-row:nth-child(2)[b-eb4vk89b7c] { animation-delay: 100ms; }
.capability-row:nth-child(3)[b-eb4vk89b7c] { animation-delay: 200ms; }
.capability-row:nth-child(4)[b-eb4vk89b7c] { animation-delay: 300ms; }
.capability-row:nth-child(5)[b-eb4vk89b7c] { animation-delay: 400ms; }

.step-card:nth-child(1)[b-eb4vk89b7c] { animation-delay: 0ms; }
.step-card:nth-child(2)[b-eb4vk89b7c] { animation-delay: 150ms; }
.step-card:nth-child(3)[b-eb4vk89b7c] { animation-delay: 300ms; }

@keyframes fadeInUpLanding-b-eb4vk89b7c {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Pages/Login.razor.rz.scp.css */
/* Login Page - Linear-Inspired Design */

.login-page[b-9ontgsbynt] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-4);
}

.login-container[b-9ontgsbynt] {
    width: 100%;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.login-card[b-9ontgsbynt] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    box-shadow: var(--shadow-lg);
}

/* Header */
.login-header[b-9ontgsbynt] {
    text-align: center;
    margin-bottom: var(--space-6);
}

.logo[b-9ontgsbynt] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-4);
}

.logo-icon[b-9ontgsbynt] {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-lg);
    background: var(--accent-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-bold);
    font-size: var(--text-2xl);
}

.logo-image[b-9ontgsbynt] {
    width: 240px;
    height: auto;
}

.logo-text[b-9ontgsbynt] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    margin: 0;
}

.tagline[b-9ontgsbynt] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: var(--space-2) 0 0 0;
}

/* Error Banner */
.error-banner[b-9ontgsbynt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    background: var(--error-subtle);
    border: 1px solid var(--error);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    color: var(--error);
    font-size: var(--text-sm);
}

.error-icon[b-9ontgsbynt] {
    flex-shrink: 0;
}

/* Form */
.login-form[b-9ontgsbynt] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.form-group[b-9ontgsbynt] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-bottom: 0;
}

.form-group label[b-9ontgsbynt] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.form-input[b-9ontgsbynt] {
    width: 100%;
    height: 40px;
    padding: 0 var(--space-3);
    font-size: var(--text-base);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    transition: all var(--duration-fast) var(--ease-out);
    box-sizing: border-box;
}

.form-input:focus[b-9ontgsbynt] {
    outline: none;
    background: var(--bg-primary);
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.form-input[b-9ontgsbynt]::placeholder {
    color: var(--text-muted);
}

/* Forgot Password Link */
.forgot-password-row[b-9ontgsbynt] {
    display: flex;
    justify-content: flex-end;
}

.forgot-password-link[b-9ontgsbynt] {
    font-size: var(--text-sm);
    color: var(--accent-primary);
    text-decoration: none;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.forgot-password-link:hover[b-9ontgsbynt] {
    opacity: 0.8;
    text-decoration: underline;
}

/* Login Button */
.login-button[b-9ontgsbynt] {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    margin-top: var(--space-2);
}

.login-button:hover:not(:disabled)[b-9ontgsbynt] {
    background: var(--accent-hover);
}

.login-button:active:not(:disabled)[b-9ontgsbynt] {
    transform: scale(0.98);
}

.login-button:disabled[b-9ontgsbynt] {
    opacity: 0.6;
    cursor: not-allowed;
}

.loading-spinner[b-9ontgsbynt] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-9ontgsbynt 0.6s linear infinite;
}

@keyframes spin-b-9ontgsbynt {
    to { transform: rotate(360deg); }
}

/* Footer */
.login-footer[b-9ontgsbynt] {
    text-align: center;
}

.footer-text[b-9ontgsbynt] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: 0;
}

.footer-text strong[b-9ontgsbynt] {
    color: var(--accent-primary);
    font-weight: var(--font-semibold);
}

.recaptcha-notice[b-9ontgsbynt] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: var(--space-1) 0 0;
    opacity: 0.7;
}

.recaptcha-notice a[b-9ontgsbynt] {
    color: var(--text-tertiary);
    text-decoration: underline;
}

.recaptcha-notice a:hover[b-9ontgsbynt] {
    color: var(--text-secondary);
}

/* Validation Messages */
[b-9ontgsbynt] .validation-message {
    color: var(--error);
    font-size: var(--text-xs);
    margin-top: var(--space-1);
}

/* Tenant Selection */
.tenant-selection[b-9ontgsbynt] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.tenant-selection-label[b-9ontgsbynt] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin: 0;
    font-weight: var(--font-medium);
}

.tenant-list[b-9ontgsbynt] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.tenant-option[b-9ontgsbynt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    cursor: pointer;
    font-family: inherit;
    color: var(--text-primary);
    transition: border-color var(--duration-fast) var(--ease-out),
                background var(--duration-fast) var(--ease-out);
}

.tenant-option:hover[b-9ontgsbynt] {
    border-color: var(--accent-primary);
    background: var(--bg-tertiary);
}

.tenant-option:disabled[b-9ontgsbynt] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tenant-option-info[b-9ontgsbynt] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.tenant-option-name[b-9ontgsbynt] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
}

.tenant-option-role[b-9ontgsbynt] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.tenant-home-badge[b-9ontgsbynt] {
    font-size: 0.625rem;
    font-weight: var(--font-semibold);
    color: var(--accent-primary);
    background: rgba(99, 102, 241, 0.1);
    padding: 2px var(--space-2);
    border-radius: var(--radius-full);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.back-to-login-link[b-9ontgsbynt] {
    background: none;
    border: none;
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    cursor: pointer;
    padding: var(--space-2) 0;
    font-family: inherit;
    text-align: center;
    transition: color var(--duration-fast) var(--ease-out);
}

.back-to-login-link:hover[b-9ontgsbynt] {
    color: var(--text-primary);
}

/* Signup prompt */
.signup-prompt[b-9ontgsbynt] {
    text-align: center;
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-primary);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.signup-link[b-9ontgsbynt] {
    color: var(--accent-primary);
    text-decoration: none;
    font-weight: var(--font-medium);
    margin-left: var(--space-1);
}

.signup-link:hover[b-9ontgsbynt] {
    text-decoration: underline;
}

/* Two-factor authentication */
.two-factor-input[b-9ontgsbynt] {
    text-align: center;
}

.two-factor-label[b-9ontgsbynt] {
    color: var(--text-secondary);
    font-size: 14px;
    margin-bottom: var(--space-4);
}

.two-factor-links[b-9ontgsbynt] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-top: var(--space-4);
}

.otp-verifying[b-9ontgsbynt] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    color: var(--text-secondary);
    font-size: 14px;
    margin-bottom: var(--space-3);
}
/* /Pages/Onboard.razor.rz.scp.css */
/* Onboarding Wizard — Conversational Concierge */

.onboard-page[b-wofpmnw62x] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--bg-body);
    padding: var(--space-6) var(--space-6) var(--space-8);
    overflow-y: auto;
}

/* ── Progress Rail ───────────────────────────────────────── */

.progress-rail[b-wofpmnw62x] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: var(--space-4) var(--space-4) var(--space-6);
    flex-shrink: 0;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    box-sizing: border-box;
}

.rail-stop[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0;
}

.stop-label[b-wofpmnw62x] {
    font-size: 0.5625rem;
    font-weight: var(--font-bold);
    white-space: nowrap;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-tertiary);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-full);
    padding: 2px 8px;
    transition: all var(--duration-normal) var(--ease-out);
}

.rail-stop.active .stop-label[b-wofpmnw62x] {
    color: white;
    background: var(--accent-primary);
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-primary) 15%, transparent);
}

.rail-stop.done .stop-label[b-wofpmnw62x] {
    color: var(--success);
    background: var(--success-subtle);
    border-color: var(--success);
}

.stop-dot[b-wofpmnw62x] {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-full);
    border: 2px solid var(--border-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6875rem;
    font-weight: var(--font-bold);
    color: var(--text-tertiary);
    background: var(--bg-primary);
    transition: all var(--duration-normal) var(--ease-out);
    flex-shrink: 0;
}

.rail-stop.active .stop-dot[b-wofpmnw62x] {
    border-color: var(--accent-primary);
    color: white;
    background: var(--accent-primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-primary) 20%, transparent);
}

.rail-stop.done .stop-dot[b-wofpmnw62x] {
    border-color: var(--success);
    color: var(--success);
    background: var(--success-subtle);
}

.rail-line[b-wofpmnw62x] {
    flex: 1;
    height: 2px;
    min-width: 12px;
    margin-top: 13px;
    background: var(--border-light);
    transition: background var(--duration-normal) var(--ease-out);
}

.rail-line.filled[b-wofpmnw62x] {
    background: var(--success);
}

/* ── Step Viewport ───────────────────────────────────────── */

.step-viewport[b-wofpmnw62x] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 640px;
    width: 100%;
    margin: 0 auto;
    gap: var(--space-5);
}

/* ── Sophia Says ─────────────────────────────────────────── */

.sophia-says[b-wofpmnw62x] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    width: 100%;
}

.sophia-says.animate-in[b-wofpmnw62x] {
    animation: slideUp-b-wofpmnw62x var(--duration-normal) var(--ease-out) both;
}

.sophia-avatar[b-wofpmnw62x] {
    position: relative;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-lg);
    background: var(--thinking-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-bold);
    font-size: var(--text-sm);
    flex-shrink: 0;
}

.avatar-pulse[b-wofpmnw62x] {
    position: absolute;
    inset: -3px;
    border-radius: var(--radius-lg);
    border: 2px solid var(--thinking-primary);
    opacity: 0;
    animation: pulse-b-wofpmnw62x 2.5s var(--ease-out) infinite;
}

@keyframes pulse-b-wofpmnw62x {
    0% { opacity: 0.6; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.3); }
}

.sophia-bubble[b-wofpmnw62x] {
    background: var(--chat-sophia-bg);
    border: 1px solid var(--chat-sophia-border);
    border-radius: 0 var(--radius-lg) var(--radius-lg) var(--radius-lg);
    padding: var(--space-3) var(--space-4);
    flex: 1;
}

.sophia-bubble p[b-wofpmnw62x] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-primary);
    line-height: var(--leading-relaxed);
}

/* ── Step Body ───────────────────────────────────────────── */

.step-body[b-wofpmnw62x] {
    width: 100%;
}

.step-body.animate-in[b-wofpmnw62x] {
    animation: slideUp-b-wofpmnw62x var(--duration-normal) var(--ease-out) 0.1s both;
}

.step-title[b-wofpmnw62x] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    margin: 0 0 var(--space-4);
}

/* ── Forms ────────────────────────────────────────────────── */

.form-grid[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.form-row[b-wofpmnw62x] {
    display: flex;
    gap: var(--space-4);
}

.form-row.two-col > .form-field[b-wofpmnw62x] {
    flex: 1;
}

.form-field[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.form-field label[b-wofpmnw62x] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
}

.form-field input[b-wofpmnw62x],
.form-field textarea[b-wofpmnw62x],
.form-field select[b-wofpmnw62x] {
    height: 40px;
    padding: 0 var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: var(--text-sm);
    font-family: inherit;
    transition: all var(--duration-fast) var(--ease-out);
}

.form-field textarea[b-wofpmnw62x] {
    height: auto;
    padding: var(--space-2) var(--space-3);
    resize: vertical;
    line-height: var(--leading-relaxed);
}

.form-field input:hover[b-wofpmnw62x],
.form-field textarea:hover[b-wofpmnw62x],
.form-field select:hover[b-wofpmnw62x] {
    border-color: var(--border-secondary);
    background: var(--bg-tertiary);
}

.form-field input:focus[b-wofpmnw62x],
.form-field textarea:focus[b-wofpmnw62x],
.form-field select:focus[b-wofpmnw62x] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.form-field input[b-wofpmnw62x]::placeholder,
.form-field textarea[b-wofpmnw62x]::placeholder {
    color: var(--text-tertiary);
}

.field-hint[b-wofpmnw62x] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.optional-tag[b-wofpmnw62x] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: normal;
}

/* Auth Toggle */
.auth-select[b-wofpmnw62x] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-out);
    appearance: auto;
}

.auth-select:focus[b-wofpmnw62x] {
    outline: none;
    border-color: var(--accent-primary);
}

/* Radio Cards */
.radio-group[b-wofpmnw62x] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2);
}

.radio-card[b-wofpmnw62x] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.radio-card:hover[b-wofpmnw62x] {
    border-color: var(--border-secondary);
    background: var(--bg-tertiary);
}

.radio-card.selected[b-wofpmnw62x] {
    border-color: var(--accent-primary);
    background: color-mix(in srgb, var(--accent-primary) 8%, var(--bg-secondary));
}

.radio-card input[type="radio"][b-wofpmnw62x] {
    accent-color: var(--accent-primary);
    margin: 0;
}

.radio-label[b-wofpmnw62x] {
    font-size: var(--text-sm);
    color: var(--text-primary);
}

/* ── Welcome Step ────────────────────────────────────────── */

.welcome-step[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-6) 0;
}

.welcome-logo-wrap[b-wofpmnw62x] {
    margin-bottom: var(--space-5);
}

.welcome-logo[b-wofpmnw62x] {
    height: 72px;
    width: auto;
}

.welcome-title[b-wofpmnw62x] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    margin: 0 0 var(--space-2);
}

.welcome-sub[b-wofpmnw62x] {
    font-size: var(--text-md);
    color: var(--text-tertiary);
    margin: 0 0 var(--space-6);
}

.welcome-btn[b-wofpmnw62x] {
    font-size: var(--text-md) !important;
    padding: var(--space-3) var(--space-6) !important;
}

/* ── Test Connection ─────────────────────────────────────── */

.test-step[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.test-card[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-6);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
}

.test-icon-wrap[b-wofpmnw62x] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.test-icon[b-wofpmnw62x] {
    width: 64px;
    height: 64px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
}

.test-icon.neutral[b-wofpmnw62x] {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
}

.test-icon.success[b-wofpmnw62x] {
    background: var(--success-subtle);
    color: var(--success);
    animation: scaleIn-b-wofpmnw62x var(--duration-normal) var(--ease-out);
}

.test-icon.error[b-wofpmnw62x] {
    background: var(--error-subtle);
    color: var(--error);
    animation: scaleIn-b-wofpmnw62x var(--duration-normal) var(--ease-out);
}

@keyframes scaleIn-b-wofpmnw62x {
    from { transform: scale(0.5); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.test-message[b-wofpmnw62x] {
    font-size: var(--text-sm);
    text-align: center;
    margin: 0;
    max-width: 400px;
    line-height: var(--leading-relaxed);
}

.test-message.neutral[b-wofpmnw62x] { color: var(--text-tertiary); }
.test-message.success[b-wofpmnw62x] { color: var(--success); }
.test-message.error[b-wofpmnw62x] { color: var(--error); }

.test-edit-link[b-wofpmnw62x] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: var(--space-1);
    padding: var(--space-1) var(--space-2);
    background: none;
    border: none;
    color: var(--accent-primary);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    border-radius: var(--radius-sm);
    transition: all var(--duration-fast) var(--ease-out);
}

.test-edit-link:hover[b-wofpmnw62x] {
    background: color-mix(in srgb, var(--accent-primary) 10%, transparent);
    text-decoration: underline;
}

/* ── Vibe Selection ──────────────────────────────────────── */

.vibe-step[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.vibe-grid[b-wofpmnw62x] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--space-3);
}

.vibe-card[b-wofpmnw62x] {
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.vibe-card:hover[b-wofpmnw62x] {
    border-color: var(--border-secondary);
    background: var(--bg-tertiary);
    transform: translateY(-1px);
}

.vibe-card.selected[b-wofpmnw62x] {
    border-color: var(--accent-primary);
    background: color-mix(in srgb, var(--accent-primary) 8%, var(--bg-secondary));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent-primary) 25%, transparent);
}

.vibe-card-header[b-wofpmnw62x] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-1);
}

.vibe-emoji[b-wofpmnw62x] {
    font-size: var(--text-md);
    width: 24px;
    text-align: center;
}

.vibe-name[b-wofpmnw62x] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.vibe-desc[b-wofpmnw62x] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: 0;
    line-height: var(--leading-relaxed);
}

.vibe-hint[b-wofpmnw62x] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: var(--space-2) 0 0;
    text-align: center;
}

/* ── Feature Tour ────────────────────────────────────────── */

.tour-step[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.feature-grid[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.feature-card[b-wofpmnw62x] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    transition: all var(--duration-fast) var(--ease-out);
}

.feature-card:hover[b-wofpmnw62x] {
    background: var(--bg-tertiary);
}

.feature-card.locked[b-wofpmnw62x] {
    opacity: 0.55;
}

.feature-icon[b-wofpmnw62x] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--accent-primary) 12%, var(--bg-secondary));
    color: var(--accent-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.feature-card.locked .feature-icon[b-wofpmnw62x] {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
}

.feature-info[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.feature-name[b-wofpmnw62x] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.feature-desc[b-wofpmnw62x] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    line-height: var(--leading-relaxed);
}

.available-badge[b-wofpmnw62x] {
    font-size: 0.625rem;
    font-weight: var(--font-semibold);
    color: var(--success);
    background: var(--success-subtle);
    padding: 2px var(--space-2);
    border-radius: var(--radius-full);
    flex-shrink: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tier-badge[b-wofpmnw62x] {
    font-size: 0.625rem;
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    background: var(--bg-tertiary);
    padding: 2px var(--space-2);
    border-radius: var(--radius-full);
    flex-shrink: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ── Complete Step ───────────────────────────────────────── */

.complete-step[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-4) 0;
    gap: var(--space-4);
}

.complete-check-wrap[b-wofpmnw62x] {
    animation: scaleIn-b-wofpmnw62x var(--duration-normal) var(--ease-out) 0.2s both;
}

.check-circle[b-wofpmnw62x] {
    animation: drawCircle-b-wofpmnw62x 0.8s var(--ease-out) 0.3s both;
}

.check-mark[b-wofpmnw62x] {
    stroke-dasharray: 40;
    stroke-dashoffset: 40;
    animation: drawCheck-b-wofpmnw62x 0.4s var(--ease-out) 0.8s both;
}

@keyframes drawCircle-b-wofpmnw62x {
    from { stroke-dashoffset: 188.5; }
    to { stroke-dashoffset: 0; }
}

@keyframes drawCheck-b-wofpmnw62x {
    from { stroke-dashoffset: 40; }
    to { stroke-dashoffset: 0; }
}

.complete-title[b-wofpmnw62x] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    margin: 0;
}

.summary-list[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    width: 100%;
    max-width: 320px;
}

.summary-item[b-wofpmnw62x] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.summary-item.done[b-wofpmnw62x] {
    color: var(--text-primary);
}

.summary-item.skipped[b-wofpmnw62x] {
    color: var(--text-tertiary);
}

.complete-btn[b-wofpmnw62x] {
    margin-top: var(--space-4);
    font-size: var(--text-md) !important;
    padding: var(--space-3) var(--space-6) !important;
}

/* ── Buttons ─────────────────────────────────────────────── */

.btn-primary[b-wofpmnw62x] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    height: 44px;
    padding: 0 var(--space-5);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-primary:hover:not(:disabled)[b-wofpmnw62x] {
    background: var(--accent-hover);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.btn-primary:active:not(:disabled)[b-wofpmnw62x] {
    transform: translateY(0);
}

.btn-primary:disabled[b-wofpmnw62x] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Step Navigation ─────────────────────────────────────── */

.step-nav[b-wofpmnw62x] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    max-width: 640px;
    width: 100%;
    margin: var(--space-4) auto 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

.step-nav.animate-in[b-wofpmnw62x] {
    animation: slideUp-b-wofpmnw62x var(--duration-normal) var(--ease-out) 0.2s both;
}

.nav-spacer[b-wofpmnw62x] {
    flex: 1;
}

.nav-btn[b-wofpmnw62x] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    height: 36px;
    padding: 0 var(--space-4);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    border: none;
}

.nav-back[b-wofpmnw62x] {
    background: transparent;
    color: var(--text-secondary);
}

.nav-back:hover:not(:disabled)[b-wofpmnw62x] {
    color: var(--text-primary);
    background: var(--bg-tertiary);
}

.nav-skip[b-wofpmnw62x] {
    background: transparent;
    color: var(--text-tertiary);
}

.nav-skip:hover:not(:disabled)[b-wofpmnw62x] {
    color: var(--text-secondary);
    background: var(--bg-tertiary);
}

.nav-next[b-wofpmnw62x] {
    background: var(--accent-primary);
    color: white;
}

.nav-next:hover:not(:disabled)[b-wofpmnw62x] {
    background: var(--accent-hover);
}

.nav-next:disabled[b-wofpmnw62x] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Animations ──────────────────────────────────────────── */

@keyframes slideUp-b-wofpmnw62x {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Spinner ─────────────────────────────────────────────── */

.btn-spinner[b-wofpmnw62x] {
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: var(--radius-full);
    animation: spin-b-wofpmnw62x 0.6s linear infinite;
}

@keyframes spin-b-wofpmnw62x {
    to { transform: rotate(360deg); }
}

/* ── Loading State ───────────────────────────────────────── */

.onboard-loading[b-wofpmnw62x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    gap: var(--space-4);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
}

.loading-pulse[b-wofpmnw62x] {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    background: var(--thinking-primary);
    animation: loadPulse-b-wofpmnw62x 1.5s var(--ease-out) infinite;
}

@keyframes loadPulse-b-wofpmnw62x {
    0%, 100% { opacity: 0.3; transform: scale(0.8); }
    50% { opacity: 1; transform: scale(1); }
}

/* ── Mobile ──────────────────────────────────────────────── */

@media (max-width: 768px) {
    .onboard-page[b-wofpmnw62x] {
        padding: var(--space-4) var(--space-4) var(--space-6);
    }

    .step-viewport[b-wofpmnw62x] {
        max-width: 100%;
    }

    .form-row.two-col[b-wofpmnw62x] {
        flex-direction: column;
    }

    .radio-group[b-wofpmnw62x] {
        grid-template-columns: 1fr;
    }

    .vibe-grid[b-wofpmnw62x] {
        grid-template-columns: 1fr 1fr;
    }

    .rail-line[b-wofpmnw62x] {
        margin-top: 11px;
    }

    .stop-dot[b-wofpmnw62x] {
        width: 24px;
        height: 24px;
        font-size: 0.5625rem;
    }

    .stop-label[b-wofpmnw62x] {
        font-size: 0.5rem;
    }
}

@media (max-width: 480px) {
    .vibe-grid[b-wofpmnw62x] {
        grid-template-columns: 1fr;
    }

    .welcome-logo[b-wofpmnw62x] {
        height: 56px;
    }

    .welcome-title[b-wofpmnw62x] {
        font-size: var(--text-xl);
    }
}
/* /Pages/PilotExpired.razor.rz.scp.css */
.expired-page[b-vq4tn1mvx2] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-6);
    gap: var(--space-6);
}

.expired-card[b-vq4tn1mvx2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 440px;
    width: 100%;
    gap: var(--space-4);
    animation: fadeIn-b-vq4tn1mvx2 var(--duration-normal) var(--ease-out) both;
}

@keyframes fadeIn-b-vq4tn1mvx2 {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.sophia-avatar[b-vq4tn1mvx2] {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: var(--radius-lg);
    background: var(--text-tertiary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--font-bold);
    font-size: var(--text-lg);
    margin-bottom: var(--space-2);
}

.status-icon[b-vq4tn1mvx2] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-tertiary);
}

.expired-title[b-vq4tn1mvx2] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    margin: 0;
}

.expired-message[b-vq4tn1mvx2] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
    margin: 0;
    max-width: 380px;
}

.btn-contact[b-vq4tn1mvx2] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    height: 40px;
    padding: 0 var(--space-5);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    margin-top: var(--space-2);
    text-decoration: none;
}

.btn-contact:hover[b-vq4tn1mvx2] {
    background: var(--accent-hover);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
    color: white;
}

.expired-footer[b-vq4tn1mvx2] {
    position: fixed;
    bottom: var(--space-6);
}

.btn-logout[b-vq4tn1mvx2] {
    height: 32px;
    padding: 0 var(--space-4);
    background: transparent;
    color: var(--text-tertiary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-logout:hover[b-vq4tn1mvx2] {
    color: var(--text-secondary);
    border-color: var(--border-secondary);
    background: var(--bg-tertiary);
}

@media (max-width: 480px) {
    .expired-page[b-vq4tn1mvx2] {
        padding: var(--space-4);
    }

    .expired-title[b-vq4tn1mvx2] {
        font-size: var(--text-lg);
    }
}
/* /Pages/Privacy.razor.rz.scp.css */
/* ============================================
   Legal Pages — Shared Design System
   Brand palette from landing: navy → teal → cyan
   ============================================ */

.legal-page[b-rv0tk3lw2j] {
    --ln-navy: #0a1628;
    --ln-navy-mid: #0f1f3a;
    --ln-ocean: #1a5276;
    --ln-teal: #17a2b8;
    --ln-cyan: #00d4ff;
    --ln-white: #ffffff;
    --ln-off-white: #f0f4f8;
    --ln-gray: #8a9bb5;
    --ln-gray-dark: #4a5e7a;
    --ln-text-dark: #1a202c;
    --ln-text-body: #4a5568;
    --ln-section-light: #f7fafc;
    --ln-card-border: #e2e8f0;

    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--ln-text-dark);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--ln-section-light);
}

.legal-container[b-rv0tk3lw2j] {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* Navigation */
.legal-nav[b-rv0tk3lw2j] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(10, 22, 40, 0.95);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.nav-row[b-rv0tk3lw2j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
}

.legal-brand[b-rv0tk3lw2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.legal-logo[b-rv0tk3lw2j] {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.legal-wordmark[b-rv0tk3lw2j] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--ln-white);
    letter-spacing: -0.02em;
}

.back-link[b-rv0tk3lw2j] {
    color: var(--ln-gray);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: color 0.15s;
}

.back-link:hover[b-rv0tk3lw2j] {
    color: var(--ln-white);
}

/* Content */
.legal-content[b-rv0tk3lw2j] {
    flex: 1;
    padding-top: 3rem;
    padding-bottom: 4rem;
}

.legal-content h1[b-rv0tk3lw2j] {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 0.5rem;
    color: var(--ln-text-dark);
}

.effective-date[b-rv0tk3lw2j] {
    font-size: 0.875rem;
    color: var(--ln-gray);
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--ln-card-border);
}

.legal-content section[b-rv0tk3lw2j] {
    margin-bottom: 2rem;
}

.legal-content h2[b-rv0tk3lw2j] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--ln-text-dark);
    margin-bottom: 0.75rem;
    margin-top: 0;
}

.legal-content h3[b-rv0tk3lw2j] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--ln-text-dark);
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

.legal-content p[b-rv0tk3lw2j] {
    font-size: 0.9375rem;
    color: var(--ln-text-body);
    line-height: 1.7;
    margin-bottom: 0.75rem;
}

.legal-content ul[b-rv0tk3lw2j] {
    padding-left: 1.5rem;
    margin-bottom: 0.75rem;
}

.legal-content li[b-rv0tk3lw2j] {
    font-size: 0.9375rem;
    color: var(--ln-text-body);
    line-height: 1.7;
    margin-bottom: 0.375rem;
}

.legal-content a[b-rv0tk3lw2j] {
    color: var(--ln-teal);
    text-decoration: none;
    transition: color 0.15s;
}

.legal-content a:hover[b-rv0tk3lw2j] {
    color: var(--ln-ocean);
    text-decoration: underline;
}

/* Footer */
.legal-footer[b-rv0tk3lw2j] {
    background: var(--ln-navy);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 1.25rem 0;
    font-size: 0.75rem;
    color: var(--ln-gray-dark);
    text-align: center;
}

/* Responsive */
@media (max-width: 768px) {
    .legal-content[b-rv0tk3lw2j] {
        padding-top: 2rem;
        padding-bottom: 3rem;
    }

    .legal-content h1[b-rv0tk3lw2j] {
        font-size: 1.5rem;
    }
}
/* /Pages/PromptReview.razor.rz.scp.css */
/* Prompt Review Page */

.review-page[b-7aydcpfagv] {
    padding: var(--space-6);
    max-width: 1400px;
    margin: 0 auto;
}

/* Header */
.review-header[b-7aydcpfagv] {
    margin-bottom: var(--space-6);
}

.review-header h2[b-7aydcpfagv] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
    letter-spacing: var(--tracking-tight);
}

.review-subtitle[b-7aydcpfagv] {
    color: var(--text-tertiary);
    margin: 0;
    font-size: var(--text-base);
}

/* Banners */
.error-banner[b-7aydcpfagv],
.success-banner[b-7aydcpfagv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    font-size: var(--text-sm);
}

.error-banner[b-7aydcpfagv] {
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
}

.success-banner[b-7aydcpfagv] {
    background: var(--success-subtle);
    color: var(--success);
    border: 1px solid var(--success);
}

.close-btn[b-7aydcpfagv] {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-size: var(--text-sm);
    opacity: 0.7;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.close-btn:hover[b-7aydcpfagv] {
    opacity: 1;
}

/* Tabs */
.review-tabs[b-7aydcpfagv] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-6);
    border-bottom: 1px solid var(--border-light);
    padding-bottom: 0;
}

.review-tab[b-7aydcpfagv] {
    position: relative;
    padding: var(--space-3) var(--space-4);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    transition: color var(--duration-fast) var(--ease-out);
}

.review-tab:hover[b-7aydcpfagv] {
    color: var(--text-primary);
}

.review-tab.active[b-7aydcpfagv] {
    color: var(--accent-primary);
}

.review-tab.active[b-7aydcpfagv]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--accent-primary);
    border-radius: 1px 1px 0 0;
}

/* Trigger Section */
.trigger-section[b-7aydcpfagv] {
    background: var(--bg-secondary);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    margin-bottom: var(--space-6);
    border: 1px solid var(--border-light);
}

.trigger-controls[b-7aydcpfagv] {
    display: flex;
    gap: var(--space-4);
    align-items: flex-end;
}

.form-group[b-7aydcpfagv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.form-group label[b-7aydcpfagv] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.form-select[b-7aydcpfagv],
.form-input[b-7aydcpfagv] {
    height: 36px;
    padding: 0 var(--space-3);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: var(--text-sm);
}

.form-select:focus[b-7aydcpfagv],
.form-input:focus[b-7aydcpfagv] {
    outline: none;
    border-color: var(--accent-primary);
}

.conversation-id-group[b-7aydcpfagv] {
    flex: 1;
    max-width: 400px;
}

/* Buttons */
.btn-primary[b-7aydcpfagv] {
    height: 36px;
    padding: 0 var(--space-5);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    transition: all var(--duration-fast) var(--ease-out);
    white-space: nowrap;
}

.btn-primary:hover:not(:disabled)[b-7aydcpfagv] {
    background: var(--accent-hover);
}

.btn-primary:disabled[b-7aydcpfagv] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-secondary[b-7aydcpfagv] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-secondary:hover:not(:disabled)[b-7aydcpfagv] {
    background: var(--bg-tertiary);
    border-color: var(--border-secondary);
}

.btn-secondary:disabled[b-7aydcpfagv] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-success[b-7aydcpfagv] {
    background: transparent;
    color: var(--success);
    border: 1px solid var(--success);
}

.btn-success:hover[b-7aydcpfagv] {
    background: var(--success-subtle);
}

.btn-small[b-7aydcpfagv] {
    height: 28px;
    padding: 0 var(--space-3);
    font-size: var(--text-xs);
    border-radius: var(--radius-sm);
}

/* Loading */
.loading-section[b-7aydcpfagv] {
    text-align: center;
    padding: var(--space-8) var(--space-4);
    color: var(--text-secondary);
}

.loading-hint[b-7aydcpfagv] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-top: var(--space-1);
}

.spinner[b-7aydcpfagv] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border-light);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-7aydcpfagv 0.8s linear infinite;
    margin: 0 auto var(--space-3);
}

.spinner-small[b-7aydcpfagv] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--border-light);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-7aydcpfagv 0.8s linear infinite;
}

@keyframes spin-b-7aydcpfagv {
    to { transform: rotate(360deg); }
}

/* Stats Row */
.stats-row[b-7aydcpfagv] {
    display: flex;
    gap: var(--space-3);
    margin-bottom: var(--space-6);
    flex-wrap: wrap;
}

.stat-card[b-7aydcpfagv] {
    flex: 1;
    min-width: 120px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.stat-card.stat-warning[b-7aydcpfagv] {
    border-color: var(--warning);
    background: var(--warning-subtle);
}

.stat-value[b-7aydcpfagv] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

.stat-label[b-7aydcpfagv] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Suggestions Section */
.suggestions-section[b-7aydcpfagv] {
    margin-bottom: var(--space-6);
}

.suggestions-section h3[b-7aydcpfagv] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-4) 0;
}

.suggestions-list[b-7aydcpfagv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.suggestion-card[b-7aydcpfagv] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    transition: border-color var(--duration-fast) var(--ease-out);
}

.suggestion-card.accepted[b-7aydcpfagv] {
    border-color: var(--success);
    opacity: 0.8;
}

.suggestion-card.dismissed[b-7aydcpfagv] {
    opacity: 0.5;
}

.suggestion-header[b-7aydcpfagv] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-2);
}

.suggestion-title-group[b-7aydcpfagv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.suggestion-title-group h4[b-7aydcpfagv] {
    margin: 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.prompt-key[b-7aydcpfagv] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.status-badge[b-7aydcpfagv] {
    display: inline-block;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.status-badge.accepted[b-7aydcpfagv] {
    background: var(--success-subtle);
    color: var(--success);
}

.status-badge.dismissed[b-7aydcpfagv] {
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.suggestion-rationale[b-7aydcpfagv] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-style: italic;
    margin: 0 0 var(--space-3) 0;
    line-height: 1.5;
}

.suggestion-diff[b-7aydcpfagv] {
    margin-bottom: var(--space-3);
}

.suggestion-actions[b-7aydcpfagv] {
    display: flex;
    gap: var(--space-2);
    justify-content: flex-end;
}

/* Analysis Section */
.analysis-section[b-7aydcpfagv] {
    margin-bottom: var(--space-6);
}

.analysis-section h3[b-7aydcpfagv] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-4) 0;
}

.analysis-content[b-7aydcpfagv] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-4) var(--space-5);
    font-size: var(--text-sm);
    line-height: 1.7;
    color: var(--text-primary);
    overflow-x: auto;
}

/* History Tab */
.history-content[b-7aydcpfagv] {
    margin-bottom: var(--space-6);
}

.empty-state[b-7aydcpfagv] {
    text-align: center;
    padding: var(--space-8) var(--space-4);
    color: var(--text-muted);
    font-style: italic;
}

.history-table-container[b-7aydcpfagv] {
    overflow-x: auto;
}

.data-table[b-7aydcpfagv] {
    width: 100%;
    border-collapse: collapse;
}

.data-table th[b-7aydcpfagv] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-tertiary);
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-primary);
}

.data-table td[b-7aydcpfagv] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-light);
    vertical-align: middle;
}

.data-table tbody tr[b-7aydcpfagv] {
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-out);
}

.data-table tbody tr:hover[b-7aydcpfagv] {
    background: var(--bg-secondary);
}

.data-table tbody tr.expanded[b-7aydcpfagv] {
    background: var(--bg-tertiary);
}

.diff-row[b-7aydcpfagv] {
    cursor: default;
}

.diff-row td[b-7aydcpfagv] {
    padding: var(--space-2) var(--space-3);
}

.reason-cell[b-7aydcpfagv] {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.source-badge[b-7aydcpfagv] {
    display: inline-block;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.source-badge.aisuggestion[b-7aydcpfagv] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.source-badge.manualedit[b-7aydcpfagv] {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.source-badge.revert[b-7aydcpfagv] {
    background: var(--warning-subtle);
    color: var(--warning);
}

/* Responsive */
@media (max-width: 768px) {
    .review-page[b-7aydcpfagv] {
        padding: var(--space-4);
    }

    .trigger-controls[b-7aydcpfagv] {
        flex-direction: column;
        align-items: stretch;
    }

    .conversation-id-group[b-7aydcpfagv] {
        max-width: none;
    }

    .stats-row[b-7aydcpfagv] {
        flex-direction: column;
    }

    .suggestion-actions[b-7aydcpfagv] {
        flex-direction: column;
    }
}
/* /Pages/Reports.razor.rz.scp.css */
/* Reports Page Styles */

.reports-page[b-2gxc96iej2] {
    padding: var(--space-6);
    max-width: 1400px;
    margin: 0 auto;
}

/* Header */
.reports-header[b-2gxc96iej2] {
    margin-bottom: var(--space-6);
}

.reports-header h1[b-2gxc96iej2] {
    font-size: var(--text-3xl);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.reports-header .subtitle[b-2gxc96iej2] {
    color: var(--text-secondary);
    font-size: var(--text-base);
    margin-top: var(--space-1);
}

/* Tabs */
.reports-tabs[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-6);
    border-bottom: 1px solid var(--border-primary);
    padding-bottom: var(--space-1);
}

.tab-btn[b-2gxc96iej2] {
    padding: var(--space-3) var(--space-4);
    background: transparent;
    border: none;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
    position: relative;
}

.tab-btn:hover[b-2gxc96iej2] {
    color: var(--text-primary);
    background: var(--bg-secondary);
}

.tab-btn.active[b-2gxc96iej2] {
    color: var(--accent-primary);
    background: var(--bg-secondary);
}

.tab-btn.active[b-2gxc96iej2]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--accent-primary);
}

/* Buttons */
.btn-primary[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-4);
    background: var(--accent-gradient);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-primary:hover[b-2gxc96iej2] {
    background: var(--accent-gradient-hover);
    transform: translateY(-1px);
}

.btn-secondary[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-4);
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-secondary:hover[b-2gxc96iej2] {
    background: var(--bg-tertiary);
    border-color: var(--border-secondary);
}

.btn-small[b-2gxc96iej2] {
    padding: var(--space-1) var(--space-3);
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-small:hover[b-2gxc96iej2] {
    background: var(--bg-tertiary);
}

.btn-small.btn-danger[b-2gxc96iej2] {
    color: var(--error);
    border-color: var(--error);
}

.btn-small.btn-danger:hover[b-2gxc96iej2] {
    background: var(--error-subtle);
}

/* Loading */
.loading-container[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16);
    color: var(--text-secondary);
}

.loading-spinner-large[b-2gxc96iej2] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border-primary);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-2gxc96iej2 0.75s linear infinite;
    margin-bottom: var(--space-4);
}

@keyframes spin-b-2gxc96iej2 {
    to { transform: rotate(360deg); }
}

/* Error Banner */
.error-banner[b-2gxc96iej2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
}

.close-btn[b-2gxc96iej2] {
    background: none;
    border: none;
    color: inherit;
    font-size: var(--text-lg);
    cursor: pointer;
    padding: var(--space-1);
    line-height: 1;
}

/* Info Banner */
.info-banner[b-2gxc96iej2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: rgba(99, 102, 241, 0.1);
    color: var(--text-primary);
    border: 1px solid rgba(99, 102, 241, 0.3);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
}

/* Report Completion Notification */
.report-notification[b-2gxc96iej2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: rgba(16, 185, 129, 0.1);
    color: var(--text-primary);
    border: 1px solid rgba(16, 185, 129, 0.3);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
    animation: slideIn-b-2gxc96iej2 0.3s ease-out;
}

@keyframes slideIn-b-2gxc96iej2 {
    from {
        transform: translateY(-10px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Templates Section */
.templates-section[b-2gxc96iej2] {
    /* No extra styles needed */
}

.templates-grid[b-2gxc96iej2] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
}

.template-card[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    padding: var(--space-5);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    transition: all var(--transition-fast);
}

.template-card:hover[b-2gxc96iej2] {
    border-color: var(--border-secondary);
    box-shadow: var(--shadow-md);
}

.template-icon[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: var(--radius-md);
    color: white;
    margin-bottom: var(--space-4);
}

.template-content[b-2gxc96iej2] {
    flex: 1;
    margin-bottom: var(--space-4);
}

.template-content h3[b-2gxc96iej2] {
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.template-content p[b-2gxc96iej2] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.template-actions[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-2);
}

/* History Section */
.history-section[b-2gxc96iej2] {
    /* No extra styles needed */
}

.history-table[b-2gxc96iej2] {
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.history-table table[b-2gxc96iej2] {
    width: 100%;
    border-collapse: collapse;
}

.history-table th[b-2gxc96iej2],
.history-table td[b-2gxc96iej2] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    border-bottom: 1px solid var(--border-light);
}

.history-table th[b-2gxc96iej2] {
    background: var(--bg-secondary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.history-table tr:last-child td[b-2gxc96iej2] {
    border-bottom: none;
}

.history-table tr:hover td[b-2gxc96iej2] {
    background: var(--bg-secondary);
}

.report-title[b-2gxc96iej2] {
    display: block;
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.report-desc[b-2gxc96iej2] {
    display: block;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: var(--space-1);
}

.actions[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-2);
}

/* Status Badges */
.status-badge[b-2gxc96iej2] {
    display: inline-flex;
    align-items: center;
    padding: var(--space-1) var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    border-radius: var(--radius-full);
}

.status-badge.ready[b-2gxc96iej2] {
    background: var(--success-subtle);
    color: var(--success);
}

.status-badge.generating[b-2gxc96iej2] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.status-badge.sent[b-2gxc96iej2] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.status-badge.failed[b-2gxc96iej2] {
    background: var(--error-subtle);
    color: var(--error);
}

.status-badge.pending[b-2gxc96iej2] {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.status-badge.active[b-2gxc96iej2] {
    background: var(--success-subtle);
    color: var(--success);
}

.status-badge.inactive[b-2gxc96iej2] {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
}

/* Scheduled Section */
.scheduled-section[b-2gxc96iej2] {
    /* No extra styles needed */
}

.scheduled-header[b-2gxc96iej2] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--space-4);
}

/* ─── Schedule Form ─── */
.schedule-form-card[b-2gxc96iej2] {
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-6);
}

.form-header[b-2gxc96iej2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-primary);
    background: var(--bg-secondary);
}

.form-header h3[b-2gxc96iej2] {
    margin: 0;
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.form-body[b-2gxc96iej2] {
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.form-group[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    flex: 1;
}

.form-group label[b-2gxc96iej2] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
}

.form-group input[b-2gxc96iej2],
.form-group select[b-2gxc96iej2],
.form-group textarea[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-primary);
    font-family: inherit;
    transition: border-color 150ms ease;
}

.form-group input:focus[b-2gxc96iej2],
.form-group select:focus[b-2gxc96iej2],
.form-group textarea:focus[b-2gxc96iej2] {
    outline: none;
    border-color: var(--accent-primary);
}

.form-group textarea[b-2gxc96iej2] {
    resize: vertical;
    min-height: 80px;
}

.form-hint[b-2gxc96iej2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.form-row[b-2gxc96iej2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.form-actions[b-2gxc96iej2] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-2);
}

/* ─── Recipients text ─── */
.recipients-text[b-2gxc96iej2] {
    display: block;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: var(--space-1);
}

/* ─── History Inline ─── */
.history-inline[b-2gxc96iej2] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    margin-top: calc(-1 * var(--space-1));
    margin-bottom: var(--space-1);
}

.history-inline h5[b-2gxc96iej2] {
    margin: 0 0 var(--space-3) 0;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.no-history[b-2gxc96iej2] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: 0;
}

.history-mini-table[b-2gxc96iej2] {
    width: 100%;
    border-collapse: collapse;
}

.history-mini-table th[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    text-align: left;
    border-bottom: 1px solid var(--border-primary);
}

.history-mini-table td[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-primary);
}

.history-mini-table tr:last-child td[b-2gxc96iej2] {
    border-bottom: none;
}

.output-cell[b-2gxc96iej2] {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.error-text[b-2gxc96iej2] {
    color: var(--error);
}

/* Paused card dim */
.scheduled-card.paused[b-2gxc96iej2] {
    opacity: 0.7;
}

.scheduled-list[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.scheduled-card[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
}

.scheduled-card:hover[b-2gxc96iej2] {
    border-color: var(--border-secondary);
}

.scheduled-info[b-2gxc96iej2] {
    flex: 1;
}

.scheduled-info h4[b-2gxc96iej2] {
    margin: 0 0 var(--space-1) 0;
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.schedule-text[b-2gxc96iej2] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.next-run[b-2gxc96iej2] {
    display: block;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: var(--space-2);
}

.scheduled-status[b-2gxc96iej2] {
    margin-right: var(--space-4);
}

.scheduled-actions[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-2);
}

/* Empty State */
.empty-state[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16);
    text-align: center;
    color: var(--text-secondary);
}

.empty-state svg[b-2gxc96iej2] {
    margin-bottom: var(--space-4);
    opacity: 0.5;
}

.empty-state h3[b-2gxc96iej2] {
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.empty-state p[b-2gxc96iej2] {
    margin: 0 0 var(--space-4) 0;
    max-width: 300px;
}

/* ─── Templates Header ─── */
.templates-header[b-2gxc96iej2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.templates-desc[b-2gxc96iej2] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

/* ─── My Reports Section ─── */
.my-reports-header[b-2gxc96iej2] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--space-4);
}

.report-def-form-card[b-2gxc96iej2] {
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-6);
    overflow: hidden;
}

.my-reports-list[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.report-def-card[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    transition: border-color var(--transition-fast);
}

.report-def-card:hover[b-2gxc96iej2] {
    border-color: var(--border-secondary);
}

.report-def-info[b-2gxc96iej2] {
    flex: 1;
    min-width: 0;
}

.report-def-info h4[b-2gxc96iej2] {
    margin: 0 0 var(--space-1) 0;
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.report-def-desc[b-2gxc96iej2] {
    margin: 0 0 var(--space-2) 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-def-meta[b-2gxc96iej2] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.meta-item[b-2gxc96iej2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.scheduled-badge[b-2gxc96iej2] {
    color: var(--success) !important;
    font-weight: var(--font-medium);
}

.report-def-actions[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-2);
    flex-shrink: 0;
}

.btn-small.btn-primary[b-2gxc96iej2] {
    background: var(--accent-gradient);
    color: white;
    border: none;
}

.btn-small.btn-primary:hover[b-2gxc96iej2] {
    background: var(--accent-gradient-hover);
}

/* ─── Report Viewer Modal ─── */
.report-viewer-overlay[b-2gxc96iej2] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    padding: var(--space-4);
}

.report-viewer[b-2gxc96iej2] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    max-width: 900px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-xl);
}

.viewer-header[b-2gxc96iej2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
    flex-shrink: 0;
}

.viewer-header h3[b-2gxc96iej2] {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

.viewer-body[b-2gxc96iej2] {
    flex: 1;
    overflow-y: auto;
    padding: var(--space-6) var(--space-8);
    font-size: var(--text-sm);
    line-height: 1.7;
    color: var(--text-primary);
    max-width: 900px;
}

/* Report Headings */
.viewer-body :deep(h1)[b-2gxc96iej2] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    margin-top: 0;
    margin-bottom: var(--space-4);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    padding-bottom: var(--space-3);
    border-bottom: 2px solid var(--accent-primary);
}

.viewer-body :deep(h2)[b-2gxc96iej2] {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    margin-top: var(--space-6);
    margin-bottom: var(--space-3);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    padding-bottom: var(--space-2);
    border-bottom: 1px solid var(--border-light);
}

.viewer-body :deep(h3)[b-2gxc96iej2] {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    margin-top: var(--space-5);
    margin-bottom: var(--space-2);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

/* Paragraphs */
.viewer-body :deep(p)[b-2gxc96iej2] {
    margin: var(--space-3) 0;
}

.viewer-body :deep(p:first-child)[b-2gxc96iej2] {
    margin-top: 0;
}

/* Tables */
.viewer-body :deep(table)[b-2gxc96iej2] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-xs);
    margin: var(--space-4) 0;
    overflow-x: auto;
    display: block;
}

.viewer-body :deep(th)[b-2gxc96iej2],
.viewer-body :deep(td)[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    text-align: left;
    white-space: nowrap;
    font-size: var(--text-xs);
}

.viewer-body :deep(th)[b-2gxc96iej2] {
    background: var(--bg-tertiary);
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-secondary);
}

.viewer-body :deep(tr:nth-child(even))[b-2gxc96iej2] {
    background: var(--bg-secondary);
}

.viewer-body :deep(tr:hover)[b-2gxc96iej2] {
    background: var(--bg-tertiary);
}

/* Lists */
.viewer-body :deep(ul)[b-2gxc96iej2],
.viewer-body :deep(ol)[b-2gxc96iej2] {
    margin: var(--space-3) 0;
    padding-left: var(--space-5);
}

.viewer-body :deep(li)[b-2gxc96iej2] {
    margin: var(--space-1) 0;
}

.viewer-body :deep(li::marker)[b-2gxc96iej2] {
    color: var(--text-muted);
}

/* Horizontal Rules */
.viewer-body :deep(hr)[b-2gxc96iej2] {
    border: none;
    border-top: 1px solid var(--border-light);
    margin: var(--space-5) 0;
}

/* Blockquotes */
.viewer-body :deep(blockquote)[b-2gxc96iej2] {
    border-left: 3px solid var(--accent-primary);
    margin: var(--space-4) 0;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-secondary);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    color: var(--text-secondary);
}

/* Strong/Bold for metric emphasis */
.viewer-body :deep(strong)[b-2gxc96iej2] {
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

/* Code */
.viewer-body :deep(code)[b-2gxc96iej2] {
    background: var(--bg-tertiary);
    padding: 1px var(--space-1);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
}

.no-content[b-2gxc96iej2] {
    color: var(--text-tertiary);
    text-align: center;
    padding: var(--space-8);
}

/* Responsive Design */
@media (max-width: 1024px) {
    .templates-grid[b-2gxc96iej2] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .reports-page[b-2gxc96iej2] {
        padding: var(--space-4);
    }

    .reports-tabs[b-2gxc96iej2] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tab-btn[b-2gxc96iej2] {
        white-space: nowrap;
    }

    .template-actions[b-2gxc96iej2] {
        flex-direction: column;
    }

    .scheduled-card[b-2gxc96iej2] {
        flex-direction: column;
        align-items: flex-start;
    }

    .scheduled-actions[b-2gxc96iej2] {
        width: 100%;
        margin-top: var(--space-3);
    }

    .history-table[b-2gxc96iej2] {
        overflow-x: auto;
    }

    .report-def-card[b-2gxc96iej2] {
        flex-direction: column;
        align-items: flex-start;
    }

    .report-def-actions[b-2gxc96iej2] {
        width: 100%;
        flex-wrap: wrap;
    }

    .report-viewer[b-2gxc96iej2] {
        max-height: 95vh;
    }

    .templates-header[b-2gxc96iej2] {
        flex-direction: column;
        gap: var(--space-2);
        align-items: flex-start;
    }
}

/* ─── Multi-select recipient picker ─── */

.multi-select-container[b-2gxc96iej2] {
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    padding: var(--space-2);
    min-height: 48px;
    background: var(--bg-primary);
}

.selected-chips[b-2gxc96iej2] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
    min-height: 32px;
    align-items: center;
}

.placeholder-text[b-2gxc96iej2] {
    color: var(--text-muted);
    font-size: var(--text-sm);
}

.recipient-chip[b-2gxc96iej2] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-sm);
    padding: 4px 8px 4px 12px;
    font-size: var(--text-sm);
    line-height: 1.4;
}

.chip-name[b-2gxc96iej2] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.chip-email[b-2gxc96iej2] {
    color: var(--text-muted);
    font-size: var(--text-xs);
}

.chip-remove[b-2gxc96iej2] {
    border: none;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    padding: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s;
}

.chip-remove:hover[b-2gxc96iej2] {
    background: rgba(231, 76, 60, 0.1);
    color: #e74c3c;
}

.btn-add-recipient[b-2gxc96iej2] {
    border: 1px dashed var(--border-primary);
    background: transparent;
    color: var(--accent-primary);
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    margin-top: var(--space-2);
    transition: all 0.2s;
}

.btn-add-recipient:hover[b-2gxc96iej2] {
    border-color: var(--accent-primary);
    background: rgba(99, 102, 241, 0.05);
}

.recipient-dropdown[b-2gxc96iej2] {
    margin-top: 4px;
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    max-height: 280px;
    overflow-y: auto;
}

.dropdown-empty[b-2gxc96iej2] {
    padding: var(--space-4);
    text-align: center;
    color: var(--text-muted);
    font-size: var(--text-sm);
}

.dropdown-item[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    cursor: pointer;
    transition: background 0.15s;
    border-bottom: 1px solid var(--border-light);
}

.dropdown-item:last-child[b-2gxc96iej2] {
    border-bottom: none;
}

.dropdown-item:hover[b-2gxc96iej2] {
    background: var(--bg-secondary);
}

.dropdown-item.selected[b-2gxc96iej2] {
    background: rgba(99, 102, 241, 0.06);
}

.dropdown-item input[type="checkbox"][b-2gxc96iej2] {
    cursor: pointer;
    flex-shrink: 0;
}

.user-info[b-2gxc96iej2] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.user-name[b-2gxc96iej2] {
    font-weight: var(--font-medium);
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.user-email[b-2gxc96iej2] {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* ─── Schedule Builder ─── */

.time-picker[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.time-picker select[b-2gxc96iej2] {
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-primary);
    font-family: inherit;
}

.time-picker span[b-2gxc96iej2] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
}

.checkbox-label[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-primary);
    cursor: pointer;
    padding-top: var(--space-2);
}

.checkbox-label input[type="checkbox"][b-2gxc96iej2] {
    cursor: pointer;
}

.day-picker[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.day-chip[b-2gxc96iej2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
    user-select: none;
}

.day-chip input[type="checkbox"][b-2gxc96iej2] {
    display: none;
}

.day-chip:hover[b-2gxc96iej2] {
    border-color: var(--accent-primary);
    color: var(--accent-primary);
}

.day-chip.selected[b-2gxc96iej2] {
    background: var(--accent-primary);
    border-color: var(--accent-primary);
    color: white;
}

.schedule-preview[b-2gxc96iej2] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    background: rgba(99, 102, 241, 0.06);
    border: 1px solid rgba(99, 102, 241, 0.15);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.preview-label[b-2gxc96iej2] {
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    white-space: nowrap;
}

.preview-cron[b-2gxc96iej2] {
    font-family: monospace;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    background: var(--bg-secondary);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

.preview-desc[b-2gxc96iej2] {
    color: var(--text-primary);
}

/* Model badge on scheduled card */
.model-badge[b-2gxc96iej2] {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--accent-primary);
    background: rgba(99, 102, 241, 0.08);
    border: 1px solid rgba(99, 102, 241, 0.2);
    border-radius: var(--radius-full);
    margin-top: var(--space-1);
}

.context-badge[b-2gxc96iej2] {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--success);
    background: rgba(16, 185, 129, 0.08);
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-radius: var(--radius-full);
    margin-top: var(--space-1);
}

/* ─── Setup Chat Panel ─── */

.setup-chat-panel[b-2gxc96iej2] {
    border-top: 1px solid var(--border-light);
    padding-top: var(--space-4);
}

.setup-chat-header[b-2gxc96iej2] {
    margin-bottom: var(--space-3);
}

.setup-chat-header h4[b-2gxc96iej2] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.setup-hint[b-2gxc96iej2] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.setup-chat-messages[b-2gxc96iej2] {
    max-height: 400px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding: var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-3);
}

.setup-msg[b-2gxc96iej2] {
    padding: var(--space-3);
    border-radius: var(--radius-lg);
    max-width: 85%;
}

.setup-msg.user-msg[b-2gxc96iej2] {
    align-self: flex-end;
    background: var(--accent-primary);
    color: white;
}

.setup-msg.sophia-msg[b-2gxc96iej2] {
    align-self: flex-start;
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    color: var(--text-primary);
}

.msg-role[b-2gxc96iej2] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-1);
    opacity: 0.7;
}

.msg-content[b-2gxc96iej2] {
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
}

.msg-content :deep(h2)[b-2gxc96iej2] {
    font-size: var(--text-md);
    margin-top: var(--space-3);
    margin-bottom: var(--space-2);
}

.msg-content :deep(h3)[b-2gxc96iej2] {
    font-size: var(--text-sm);
    margin-top: var(--space-2);
    margin-bottom: var(--space-1);
}

.msg-content :deep(table)[b-2gxc96iej2] {
    width: 100%;
    border-collapse: collapse;
    margin: var(--space-2) 0;
    font-size: var(--text-xs);
}

.msg-content :deep(th)[b-2gxc96iej2],
.msg-content :deep(td)[b-2gxc96iej2] {
    padding: var(--space-1) var(--space-2);
    border: 1px solid var(--border-light);
    text-align: left;
}

.msg-content :deep(th)[b-2gxc96iej2] {
    background: var(--bg-tertiary);
    font-weight: var(--font-semibold);
}

.msg-content :deep(ul)[b-2gxc96iej2],
.msg-content :deep(ol)[b-2gxc96iej2] {
    padding-left: var(--space-4);
    margin: var(--space-1) 0;
}

.typing-indicator[b-2gxc96iej2] {
    display: flex;
    gap: 4px;
    padding: var(--space-1) 0;
}

.typing-indicator span[b-2gxc96iej2] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--text-tertiary);
    animation: typing-bounce-b-2gxc96iej2 1.2s infinite ease-in-out;
}

.typing-indicator span:nth-child(2)[b-2gxc96iej2] {
    animation-delay: 0.2s;
}

.typing-indicator span:nth-child(3)[b-2gxc96iej2] {
    animation-delay: 0.4s;
}

@keyframes typing-bounce-b-2gxc96iej2 {
    0%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-6px); }
}

.setup-chat-input[b-2gxc96iej2] {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.setup-chat-input input[b-2gxc96iej2] {
    flex: 1;
    height: 40px;
    padding: 0 var(--space-3);
    font-size: var(--text-sm);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
}

.setup-chat-input input:focus[b-2gxc96iej2] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.btn-send[b-2gxc96iej2] {
    height: 40px;
    padding: 0 var(--space-4);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-out);
}

.btn-send:hover:not(:disabled)[b-2gxc96iej2] {
    background: var(--accent-hover);
}

.btn-send:disabled[b-2gxc96iej2] {
    opacity: 0.5;
    cursor: not-allowed;
}

.setup-chat-actions[b-2gxc96iej2] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
}
/* /Pages/ResetPassword.razor.rz.scp.css */
.reset-page[b-yy5bzyi62c] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-4);
}

.reset-container[b-yy5bzyi62c] {
    width: 100%;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.reset-card[b-yy5bzyi62c] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    box-shadow: var(--shadow-lg);
}

.reset-header[b-yy5bzyi62c] {
    text-align: center;
    margin-bottom: var(--space-6);
}

.logo[b-yy5bzyi62c] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-4);
}

.logo-image[b-yy5bzyi62c] {
    width: 120px;
    height: auto;
}

.tagline[b-yy5bzyi62c] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: var(--space-2) 0 0 0;
}

.error-banner[b-yy5bzyi62c] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    background: var(--error-subtle);
    border: 1px solid var(--error);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    color: var(--error);
    font-size: var(--text-sm);
}

.success-banner[b-yy5bzyi62c] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    padding: var(--space-3);
    background: var(--success-subtle);
    border: 1px solid var(--success);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    color: var(--success);
    font-size: var(--text-sm);
    line-height: 1.5;
}

.success-banner svg[b-yy5bzyi62c] {
    flex-shrink: 0;
    margin-top: 2px;
}

.reset-form[b-yy5bzyi62c] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.form-group[b-yy5bzyi62c] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.form-group label[b-yy5bzyi62c] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.form-input[b-yy5bzyi62c] {
    width: 100%;
    height: 40px;
    padding: 0 var(--space-3);
    font-size: var(--text-base);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    transition: all var(--duration-fast) var(--ease-out);
    box-sizing: border-box;
}

.form-input:focus[b-yy5bzyi62c] {
    outline: none;
    background: var(--bg-primary);
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.form-input[b-yy5bzyi62c]::placeholder {
    color: var(--text-muted);
}

.validation-hint[b-yy5bzyi62c] {
    color: var(--error);
    font-size: var(--text-xs);
    margin: 0;
}

.submit-button[b-yy5bzyi62c] {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    margin-top: var(--space-2);
}

.submit-button:hover:not(:disabled)[b-yy5bzyi62c] {
    background: var(--accent-hover);
}

.submit-button:disabled[b-yy5bzyi62c] {
    opacity: 0.6;
    cursor: not-allowed;
}

.loading-spinner[b-yy5bzyi62c] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-yy5bzyi62c 0.6s linear infinite;
}

@keyframes spin-b-yy5bzyi62c {
    to { transform: rotate(360deg); }
}

.form-actions[b-yy5bzyi62c] {
    text-align: center;
    margin-top: var(--space-4);
}

.back-link[b-yy5bzyi62c] {
    font-size: var(--text-sm);
    color: var(--accent-primary);
    text-decoration: none;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.back-link:hover[b-yy5bzyi62c] {
    opacity: 0.8;
    text-decoration: underline;
}

.action-button[b-yy5bzyi62c] {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 10px 0;
    background: var(--accent-primary);
    color: white;
    text-decoration: none;
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    transition: all var(--duration-fast) var(--ease-out);
    box-sizing: border-box;
}

.action-button:hover[b-yy5bzyi62c] {
    background: var(--accent-hover);
}

.page-footer[b-yy5bzyi62c] {
    text-align: center;
}

.footer-text[b-yy5bzyi62c] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: 0;
}

.footer-text strong[b-yy5bzyi62c] {
    color: var(--accent-primary);
    font-weight: var(--font-semibold);
}
/* /Pages/Settings.razor.rz.scp.css */
/* Settings Page */

.settings-page[b-tcrmlbo4sw] {
    padding: var(--space-6) var(--space-8);
    max-width: 800px;
    margin: 0 auto;
}

/* ─── Header ─── */
.page-header[b-tcrmlbo4sw] {
    margin-bottom: var(--space-8);
}

.page-header h1[b-tcrmlbo4sw] {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0;
    letter-spacing: var(--tracking-tight);
}

.subtitle[b-tcrmlbo4sw] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: var(--space-1) 0 0 0;
}

/* ─── Banners ─── */
.error-banner[b-tcrmlbo4sw],
.success-banner[b-tcrmlbo4sw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-6);
    font-size: var(--text-sm);
}

.error-banner[b-tcrmlbo4sw] {
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
}

.success-banner[b-tcrmlbo4sw] {
    background: var(--success-subtle, rgba(34, 197, 94, 0.08));
    color: var(--success, #22c55e);
    border: 1px solid var(--success, #22c55e);
}

.dismiss-btn[b-tcrmlbo4sw] {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    font-size: var(--text-lg);
    padding: 0 var(--space-1);
    opacity: 0.7;
}

.dismiss-btn:hover[b-tcrmlbo4sw] {
    opacity: 1;
}

/* ─── Loading ─── */
.loading-state[b-tcrmlbo4sw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-tertiary);
    gap: var(--space-4);
}

.spinner[b-tcrmlbo4sw] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border-primary);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-tcrmlbo4sw 0.8s linear infinite;
}

@keyframes spin-b-tcrmlbo4sw {
    to { transform: rotate(360deg); }
}

/* ─── Settings Grid ─── */
.settings-grid[b-tcrmlbo4sw] {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

/* ─── Settings Card ─── */
.settings-card[b-tcrmlbo4sw] {
    display: flex;
    gap: var(--space-5);
    padding: var(--space-6);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    transition: border-color var(--duration-fast) var(--ease-out);
}

.settings-card:hover[b-tcrmlbo4sw] {
    border-color: var(--border-secondary);
}

.card-icon[b-tcrmlbo4sw] {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.card-icon.email-icon[b-tcrmlbo4sw] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.card-icon.whatsapp-icon[b-tcrmlbo4sw] {
    background: rgba(37, 211, 102, 0.1);
    color: #25D366;
}

.card-content[b-tcrmlbo4sw] {
    flex: 1;
    min-width: 0;
}

.card-content h2[b-tcrmlbo4sw] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.card-description[b-tcrmlbo4sw] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: 0 0 var(--space-4) 0;
    line-height: 1.5;
}

/* ─── Toggle Switch ─── */
.toggle-row[b-tcrmlbo4sw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-4);
}

.toggle-label[b-tcrmlbo4sw] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
}

.toggle-switch[b-tcrmlbo4sw] {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    cursor: pointer;
}

.toggle-switch input[b-tcrmlbo4sw] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-tcrmlbo4sw] {
    position: absolute;
    inset: 0;
    background-color: var(--border-primary);
    border-radius: 24px;
    transition: background-color 200ms ease;
}

.toggle-slider[b-tcrmlbo4sw]::before {
    content: '';
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: transform 200ms ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.toggle-switch input:checked + .toggle-slider[b-tcrmlbo4sw] {
    background-color: var(--accent-primary);
}

.toggle-switch input:checked + .toggle-slider[b-tcrmlbo4sw]::before {
    transform: translateX(20px);
}

/* ─── Form Elements ─── */
.form-group[b-tcrmlbo4sw] {
    margin-bottom: var(--space-3);
}

.form-group label[b-tcrmlbo4sw] {
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-2);
}

.form-input[b-tcrmlbo4sw] {
    width: 100%;
    max-width: 320px;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: var(--text-sm);
    font-family: inherit;
    transition: border-color var(--duration-fast) var(--ease-out);
    box-sizing: border-box;
}

.form-input:focus[b-tcrmlbo4sw] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-hint[b-tcrmlbo4sw] {
    display: block;
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-top: var(--space-1);
}

.form-error[b-tcrmlbo4sw] {
    display: block;
    font-size: var(--text-xs);
    color: var(--error);
    margin-top: var(--space-1);
}

/* ─── Status Badge ─── */
.status-badge[b-tcrmlbo4sw] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    margin-top: var(--space-3);
}

.status-badge.confirmed[b-tcrmlbo4sw] {
    background: rgba(37, 211, 102, 0.1);
    color: #25D366;
}

.status-badge.pending[b-tcrmlbo4sw] {
    background: var(--warning-subtle, rgba(245, 158, 11, 0.08));
    color: var(--warning, #f59e0b);
}

/* ─── Save Button ─── */
.form-actions[b-tcrmlbo4sw] {
    margin-top: var(--space-8);
    padding-top: var(--space-6);
    border-top: 1px solid var(--border-light);
}

.btn-primary[b-tcrmlbo4sw] {
    padding: var(--space-2) var(--space-6);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    box-shadow: var(--shadow-sm);
}

.btn-primary:hover:not(:disabled)[b-tcrmlbo4sw] {
    background: var(--accent-hover);
    box-shadow: var(--shadow-md);
}

.btn-primary:active:not(:disabled)[b-tcrmlbo4sw] {
    transform: scale(0.98);
}

.btn-primary:disabled[b-tcrmlbo4sw] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ─── Session Card ─── */
.card-icon.session-icon[b-tcrmlbo4sw] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.card-icon.history-icon[b-tcrmlbo4sw] {
    background: rgba(148, 163, 184, 0.1);
    color: var(--text-tertiary);
}

.session-loading[b-tcrmlbo4sw] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    padding: var(--space-2) 0;
}

.session-detail[b-tcrmlbo4sw] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.session-info-row[b-tcrmlbo4sw] {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
    font-size: var(--text-sm);
}

.session-label[b-tcrmlbo4sw] {
    color: var(--text-tertiary);
    min-width: 100px;
    flex-shrink: 0;
}

.session-value[b-tcrmlbo4sw] {
    color: var(--text-primary);
    font-weight: var(--font-medium);
}

.other-sessions-warning[b-tcrmlbo4sw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background: var(--warning-subtle, rgba(245, 158, 11, 0.08));
    border: 1px solid var(--warning, #f59e0b);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--warning, #f59e0b);
}

.btn-danger-sm[b-tcrmlbo4sw] {
    padding: var(--space-1) var(--space-3);
    background: var(--error);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    cursor: pointer;
    white-space: nowrap;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-danger-sm:hover:not(:disabled)[b-tcrmlbo4sw] {
    opacity: 0.9;
}

.btn-danger-sm:disabled[b-tcrmlbo4sw] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ─── Login History ─── */
.history-list[b-tcrmlbo4sw] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.history-entry[b-tcrmlbo4sw] {
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-light, var(--border-primary));
}

.history-entry:last-child[b-tcrmlbo4sw] {
    border-bottom: none;
}

.history-device[b-tcrmlbo4sw] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    margin-bottom: var(--space-1);
}

.history-meta[b-tcrmlbo4sw] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-1);
}

.history-separator[b-tcrmlbo4sw] {
    color: var(--text-muted);
}

.history-reason[b-tcrmlbo4sw] {
    color: var(--text-tertiary);
    font-style: italic;
}

/* ─── Responsive ─── */
@media (max-width: 640px) {
    .settings-page[b-tcrmlbo4sw] {
        padding: var(--space-4) var(--space-4);
    }

    .settings-card[b-tcrmlbo4sw] {
        flex-direction: column;
        gap: var(--space-3);
        padding: var(--space-4);
    }

    .card-icon[b-tcrmlbo4sw] {
        width: 40px;
        height: 40px;
    }

    .form-input[b-tcrmlbo4sw] {
        max-width: 100%;
    }
}

/* Two-factor authentication */
.two-factor-setup-flow[b-tcrmlbo4sw] {
    text-align: center;
}

.qr-container[b-tcrmlbo4sw] {
    display: flex;
    justify-content: center;
    margin: 16px 0;
    padding: 16px;
    background: #fff;
    border-radius: var(--radius-md, 8px);
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

.qr-container[b-tcrmlbo4sw]  svg {
    max-width: 200px;
    height: auto;
}

.manual-entry-details[b-tcrmlbo4sw] {
    margin: 12px 0 20px;
    color: var(--text-tertiary);
    font-size: 13px;
}

.manual-entry-details summary[b-tcrmlbo4sw] {
    cursor: pointer;
    color: var(--accent-primary, #6366f1);
}

.shared-key-display[b-tcrmlbo4sw] {
    display: block;
    margin-top: 8px;
    padding: 8px 12px;
    background: var(--bg-tertiary, rgba(255, 255, 255, 0.04));
    border: 1px solid var(--border-primary, rgba(255, 255, 255, 0.08));
    border-radius: var(--radius-sm, 6px);
    font-family: monospace;
    font-size: 14px;
    letter-spacing: 2px;
    word-break: break-all;
    color: var(--text-primary);
    user-select: all;
}

.otp-instruction[b-tcrmlbo4sw] {
    color: var(--text-secondary);
    font-size: 14px;
    margin-bottom: 4px;
}

.otp-verifying[b-tcrmlbo4sw] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--text-secondary);
    font-size: 14px;
    margin-bottom: 8px;
}

.setup-actions-row[b-tcrmlbo4sw] {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-top: 16px;
}

.recovery-codes-panel[b-tcrmlbo4sw] {
    text-align: center;
}

.recovery-warning[b-tcrmlbo4sw] {
    color: var(--warning, #f59e0b);
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 16px;
    padding: 12px;
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: var(--radius-md, 8px);
}

.codes-grid[b-tcrmlbo4sw] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 20px;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.recovery-code[b-tcrmlbo4sw] {
    display: block;
    padding: 8px 12px;
    background: var(--bg-tertiary, rgba(255, 255, 255, 0.04));
    border: 1px solid var(--border-primary, rgba(255, 255, 255, 0.08));
    border-radius: var(--radius-sm, 6px);
    font-family: monospace;
    font-size: 14px;
    letter-spacing: 1.5px;
    color: var(--text-primary);
    text-align: center;
    user-select: all;
}

.recovery-count[b-tcrmlbo4sw] {
    color: var(--text-tertiary);
    font-size: 13px;
    margin-top: 8px;
}
/* /Pages/Signup.razor.rz.scp.css */
/* Signup Page — matches Login.razor.css patterns */

.signup-page[b-m3o6urwkb1] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-4);
}

.signup-container[b-m3o6urwkb1] {
    width: 100%;
    max-width: 440px;
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.signup-card[b-m3o6urwkb1] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    box-shadow: var(--shadow-lg);
}

.signup-header[b-m3o6urwkb1] {
    text-align: center;
    margin-bottom: var(--space-6);
}

.logo[b-m3o6urwkb1] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-4);
}

.logo-image[b-m3o6urwkb1] {
    width: 240px;
    height: auto;
}

.tagline[b-m3o6urwkb1] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin: var(--space-2) 0 0 0;
}

/* Error Banner */
.error-banner[b-m3o6urwkb1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    background: var(--error-subtle);
    border: 1px solid var(--error);
    border-radius: var(--radius-lg);
    color: var(--error);
    font-size: var(--text-sm);
    margin-bottom: var(--space-4);
}

.error-icon[b-m3o6urwkb1] {
    flex-shrink: 0;
}

/* Form */
.form-group[b-m3o6urwkb1] {
    margin-bottom: var(--space-4);
}

.form-group label[b-m3o6urwkb1] {
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.form-input[b-m3o6urwkb1] {
    width: 100%;
    padding: var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    color: var(--text-primary);
    font-size: var(--text-base);
    outline: none;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.form-input:focus[b-m3o6urwkb1] {
    border-color: var(--accent-primary);
}

.form-row[b-m3o6urwkb1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3);
}

/* Tier Selection */
.tier-cards[b-m3o6urwkb1] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-2);
    margin-top: var(--space-2);
}

.tier-option[b-m3o6urwkb1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--space-3) var(--space-2);
    background: var(--bg-secondary);
    border: 2px solid var(--border-primary);
    border-radius: var(--radius-lg);
    color: var(--text-primary);
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-out), background var(--duration-fast) var(--ease-out);
    position: relative;
}

.tier-option:hover[b-m3o6urwkb1] {
    border-color: var(--text-tertiary);
}

.tier-option.selected[b-m3o6urwkb1] {
    border-color: var(--accent-primary);
    background: rgba(99, 102, 241, 0.08);
}

.tier-option-name[b-m3o6urwkb1] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
}

.tier-option-price[b-m3o6urwkb1] {
    font-size: 11px;
    color: var(--text-tertiary);
}

.tier-popular[b-m3o6urwkb1] {
    position: absolute;
    top: -8px;
    right: -4px;
    font-size: 9px;
    font-weight: 700;
    background: var(--accent-primary);
    color: white;
    padding: 1px 6px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Submit Button */
.submit-button[b-m3o6urwkb1] {
    width: 100%;
    padding: var(--space-3);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    transition: background var(--duration-fast) var(--ease-out);
}

.submit-button:hover:not(:disabled)[b-m3o6urwkb1] {
    background: var(--accent-hover);
}

.submit-button:disabled[b-m3o6urwkb1] {
    opacity: 0.6;
    cursor: not-allowed;
}

.loading-spinner[b-m3o6urwkb1] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-m3o6urwkb1 0.6s linear infinite;
}

@keyframes spin-b-m3o6urwkb1 {
    to { transform: rotate(360deg); }
}

/* Footer Links */
.signup-footer-links[b-m3o6urwkb1] {
    text-align: center;
    margin-top: var(--space-4);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.signup-footer-links a[b-m3o6urwkb1] {
    color: var(--accent-primary);
    text-decoration: none;
    font-weight: var(--font-medium);
    margin-left: var(--space-1);
}

.signup-footer-links a:hover[b-m3o6urwkb1] {
    text-decoration: underline;
}

/* Success State */
.success-state[b-m3o6urwkb1] {
    text-align: center;
    padding: var(--space-4) 0;
}

.success-icon[b-m3o6urwkb1] {
    margin-bottom: var(--space-4);
}

.success-state h2[b-m3o6urwkb1] {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin-bottom: var(--space-3);
}

.success-state p[b-m3o6urwkb1] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: var(--space-2);
}

.success-state .hint[b-m3o6urwkb1] {
    color: var(--text-tertiary);
    font-size: 12px;
}

.login-link-btn[b-m3o6urwkb1] {
    display: inline-block;
    margin-top: var(--space-4);
    padding: var(--space-2) var(--space-6);
    background: var(--accent-primary);
    color: white;
    border-radius: var(--radius-lg);
    text-decoration: none;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
}

/* Footer */
.signup-footer[b-m3o6urwkb1] {
    text-align: center;
}

.footer-text[b-m3o6urwkb1] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.recaptcha-notice[b-m3o6urwkb1] {
    font-size: 10px;
    color: var(--text-tertiary);
    margin-top: var(--space-2);
}

.recaptcha-notice a[b-m3o6urwkb1] {
    color: var(--text-tertiary);
    text-decoration: underline;
}

@media (max-width: 480px) {
    .signup-card[b-m3o6urwkb1] {
        padding: var(--space-6);
    }

    .form-row[b-m3o6urwkb1] {
        grid-template-columns: 1fr;
    }

    .tier-cards[b-m3o6urwkb1] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/SpaceDetail.razor.rz.scp.css */
.space-page[b-1qwbqb9hpp] { max-width: 1400px; margin: 0 auto; padding: var(--space-4); }

.loading-container[b-1qwbqb9hpp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-12) 0; color: var(--text-secondary); gap: var(--space-3); }

.not-found[b-1qwbqb9hpp] { text-align: center; padding: var(--space-12) 0; }
.not-found h2[b-1qwbqb9hpp] { font-size: 1.25rem; color: var(--text-primary); margin: 0 0 var(--space-2); }
.not-found p[b-1qwbqb9hpp] { color: var(--text-secondary); font-size: 0.875rem; margin: 0 0 var(--space-4); }

.board-header[b-1qwbqb9hpp] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-5); gap: var(--space-4); }
.header-left[b-1qwbqb9hpp] { flex: 1; min-width: 0; }

.back-link[b-1qwbqb9hpp] { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--text-tertiary); font-size: 0.8rem; text-decoration: none; margin-bottom: var(--space-2); transition: color 0.15s; }
.back-link:hover[b-1qwbqb9hpp] { color: var(--accent-primary); }

.board-header h1[b-1qwbqb9hpp] { font-size: 1.5rem; font-weight: 700; color: var(--text-primary); margin: 0; }
.board-description[b-1qwbqb9hpp] { color: var(--text-secondary); font-size: 0.85rem; margin: var(--space-1) 0 0; }
.header-actions[b-1qwbqb9hpp] { display: flex; gap: var(--space-2); flex-shrink: 0; flex-wrap: wrap; }

.btn-primary[b-1qwbqb9hpp] { background: var(--accent-primary); color: white; border: none; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: opacity 0.15s; }
.btn-primary:hover[b-1qwbqb9hpp] { opacity: 0.9; }
.btn-primary:disabled[b-1qwbqb9hpp] { opacity: 0.5; cursor: not-allowed; }

.btn-secondary[b-1qwbqb9hpp] { background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--border-light); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: 0.8rem; font-weight: 500; cursor: pointer; transition: background 0.15s; display: inline-flex; align-items: center; gap: var(--space-1); }
.btn-secondary:hover[b-1qwbqb9hpp] { background: var(--bg-tertiary); }

.btn-danger[b-1qwbqb9hpp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: 0.8rem; font-weight: 500; cursor: pointer; }
.btn-danger:hover[b-1qwbqb9hpp] { background: #fee2e2; }

.error-banner[b-1qwbqb9hpp] { background: var(--error-bg, #fef2f2); color: var(--error-text, #991b1b); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); margin-bottom: var(--space-4); display: flex; justify-content: space-between; align-items: center; font-size: 0.875rem; }
.close-btn[b-1qwbqb9hpp] { background: none; border: none; cursor: pointer; color: inherit; font-size: 1rem; }

.empty-state[b-1qwbqb9hpp] { text-align: center; padding: var(--space-8) var(--space-4); border: 2px dashed var(--border-light); border-radius: var(--radius-lg); }
.empty-state h3[b-1qwbqb9hpp] { font-size: 1.1rem; color: var(--text-primary); margin: 0 0 var(--space-2); }
.empty-state p[b-1qwbqb9hpp] { color: var(--text-secondary); font-size: 0.85rem; margin: 0 0 var(--space-4); }

.generate-form[b-1qwbqb9hpp] { max-width: 560px; margin: 0 auto; text-align: left; }
.generate-form textarea[b-1qwbqb9hpp] {
    width: 100%;
    padding: var(--space-3);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.9rem;
    font-family: inherit;
    resize: vertical;
}
.generate-form textarea:focus[b-1qwbqb9hpp] { outline: none; border-color: var(--accent-primary); box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2); }
.generate-actions[b-1qwbqb9hpp] { display: flex; gap: var(--space-2); margin-top: var(--space-3); align-items: center; }

.widget-grid[b-1qwbqb9hpp] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.widget-cell[b-1qwbqb9hpp] { min-width: 0; }

.widget-card[b-1qwbqb9hpp] { background: var(--bg-secondary); border: 1px solid var(--border-light); border-radius: var(--radius-lg); overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.widget-header[b-1qwbqb9hpp] { display: flex; justify-content: space-between; align-items: center; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border-light); }
.widget-title[b-1qwbqb9hpp] { font-size: 0.8rem; font-weight: 600; color: var(--text-secondary); }
.widget-actions[b-1qwbqb9hpp] { display: flex; gap: var(--space-1); opacity: 0; transition: opacity 0.15s; }
.widget-card:hover .widget-actions[b-1qwbqb9hpp] { opacity: 1; }

.icon-btn[b-1qwbqb9hpp] { background: none; border: none; padding: var(--space-1); cursor: pointer; color: var(--text-tertiary); border-radius: var(--radius-sm); transition: color 0.15s, background 0.15s; display: flex; align-items: center; }
.icon-btn:hover[b-1qwbqb9hpp] { color: var(--text-primary); background: var(--bg-tertiary); }
.delete-btn:hover[b-1qwbqb9hpp] { color: #991b1b; background: #fef2f2; }

.widget-body[b-1qwbqb9hpp] { flex: 1; padding: var(--space-3) var(--space-4); min-height: 150px; }

.modal-backdrop[b-1qwbqb9hpp] { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: var(--space-4); }
.modal-content[b-1qwbqb9hpp] { background: var(--bg-primary); border-radius: var(--radius-lg); padding: var(--space-6); width: 100%; max-width: 520px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); max-height: 90vh; overflow-y: auto; }
.modal-content h2[b-1qwbqb9hpp] { font-size: 1.25rem; font-weight: 700; margin: 0 0 var(--space-4); color: var(--text-primary); }

.form-group[b-1qwbqb9hpp] { margin-bottom: var(--space-4); }
.form-group label[b-1qwbqb9hpp] { display: block; font-size: 0.8rem; font-weight: 600; color: var(--text-secondary); margin-bottom: var(--space-1); }
.form-group input[b-1qwbqb9hpp], .form-group textarea[b-1qwbqb9hpp], .form-group select[b-1qwbqb9hpp] { width: 100%; padding: var(--space-2) var(--space-3); border: 1px solid var(--border-light); border-radius: var(--radius-md); background: var(--bg-secondary); color: var(--text-primary); font-size: 0.875rem; font-family: inherit; }
.form-group input:focus[b-1qwbqb9hpp], .form-group textarea:focus[b-1qwbqb9hpp], .form-group select:focus[b-1qwbqb9hpp] { outline: none; border-color: var(--accent-primary); box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2); }

.size-picker[b-1qwbqb9hpp] { display: flex; gap: var(--space-2); }
.size-option[b-1qwbqb9hpp] { flex: 1; padding: var(--space-2); border: 2px solid var(--border-light); border-radius: var(--radius-md); background: var(--bg-secondary); color: var(--text-secondary); font-size: 0.8rem; font-weight: 500; cursor: pointer; text-align: center; transition: border-color 0.15s; }
.size-option:hover[b-1qwbqb9hpp] { border-color: var(--text-tertiary); }
.size-option.selected[b-1qwbqb9hpp] { border-color: var(--accent-primary); color: var(--accent-primary); background: rgba(99, 102, 241, 0.05); }

.form-actions[b-1qwbqb9hpp] { display: flex; gap: var(--space-2); justify-content: flex-end; margin-top: var(--space-5); }

.filter-config-list[b-1qwbqb9hpp] { display: flex; flex-direction: column; gap: var(--space-2); }

.filter-config-row[b-1qwbqb9hpp] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

.filter-config-row input[b-1qwbqb9hpp],
.filter-config-row select[b-1qwbqb9hpp] {
    padding: var(--space-2) var(--space-2);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.8rem;
    min-width: 0;
}

.filter-config-row input:first-child[b-1qwbqb9hpp] { flex: 1; }
.filter-config-row select[b-1qwbqb9hpp] { width: 130px; }
.filter-config-row input:nth-child(3)[b-1qwbqb9hpp] { flex: 1; }

@media (max-width: 1024px) { .widget-grid[b-1qwbqb9hpp] { grid-template-columns: repeat(2, 1fr); } .widget-cell[style*="span 3"][b-1qwbqb9hpp] { grid-column: span 2 !important; } }
@media (max-width: 768px) { .board-header[b-1qwbqb9hpp] { flex-direction: column; } .widget-grid[b-1qwbqb9hpp] { grid-template-columns: 1fr; } .widget-cell[b-1qwbqb9hpp] { grid-column: span 1 !important; } }
/* /Pages/SpacePresentation.razor.rz.scp.css */
.presentation[b-3z2ecljseq] {
    min-height: 100vh;
    background: var(--bg-primary);
    padding: var(--space-4);
}

.presentation.fullscreen[b-3z2ecljseq] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    overflow-y: auto;
}

.pres-loading[b-3z2ecljseq], .pres-error[b-3z2ecljseq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 80vh;
    color: var(--text-secondary);
    gap: var(--space-3);
}

.pres-header[b-3z2ecljseq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-2) var(--space-4);
    margin-bottom: var(--space-4);
}

.pres-header h1[b-3z2ecljseq] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}

.pres-controls[b-3z2ecljseq] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.pres-tab-label[b-3z2ecljseq] {
    font-size: 0.8rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.pres-btn[b-3z2ecljseq] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    cursor: pointer;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    transition: background 0.15s;
}

.pres-btn:hover[b-3z2ecljseq] { background: var(--bg-tertiary); }
.pres-btn:disabled[b-3z2ecljseq] { opacity: 0.3; cursor: not-allowed; }

.pres-exit[b-3z2ecljseq] {
    font-size: 0.8rem;
    font-weight: 500;
    padding: var(--space-1) var(--space-3);
}

.pres-timer-select[b-3z2ecljseq] {
    padding: var(--space-1) var(--space-2);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.8rem;
}

.pres-tab-name[b-3z2ecljseq] {
    text-align: center;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--space-4);
}

.pres-widget-grid[b-3z2ecljseq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
    max-width: 1400px;
    margin: 0 auto;
}

.pres-widget[b-3z2ecljseq] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.pres-widget-title[b-3z2ecljseq] {
    padding: var(--space-3) var(--space-4);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--border-light);
}

.pres-widget-body[b-3z2ecljseq] {
    padding: var(--space-3) var(--space-4);
    min-height: 180px;
}

@media (max-width: 1024px) {
    .pres-widget-grid[b-3z2ecljseq] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .pres-widget-grid[b-3z2ecljseq] { grid-template-columns: 1fr; }
    .pres-widget[b-3z2ecljseq] { grid-column: span 1 !important; }
}
/* /Pages/Spaces.razor.rz.scp.css */
.spaces-page[b-fhd07mawm9] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

.spaces-header[b-fhd07mawm9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.header-content h1[b-fhd07mawm9] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}

.subtitle[b-fhd07mawm9] {
    color: var(--text-secondary);
    font-size: 0.875rem;
    margin: var(--space-1) 0 0 0;
}

.header-actions[b-fhd07mawm9] { flex-shrink: 0; }

.btn-primary[b-fhd07mawm9] {
    background: var(--accent-primary);
    color: white;
    border: none;
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-md);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s;
}

.btn-primary:hover[b-fhd07mawm9] { opacity: 0.9; }
.btn-primary:disabled[b-fhd07mawm9] { opacity: 0.5; cursor: not-allowed; }

.btn-secondary[b-fhd07mawm9] {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-light);
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-md);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-secondary:hover[b-fhd07mawm9] { background: var(--bg-tertiary); }

.error-banner[b-fhd07mawm9] {
    background: var(--error-bg, #fef2f2);
    color: var(--error-text, #991b1b);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.875rem;
}

.close-btn[b-fhd07mawm9] {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-size: 1rem;
    padding: 0 var(--space-1);
}

.loading-container[b-fhd07mawm9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-12) 0;
    color: var(--text-secondary);
    gap: var(--space-3);
}

.welcome-state[b-fhd07mawm9] {
    text-align: center;
    padding: var(--space-8) var(--space-4);
}

.welcome-icon[b-fhd07mawm9] { color: var(--text-tertiary); margin-bottom: var(--space-4); }

.welcome-state h2[b-fhd07mawm9] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 var(--space-2);
}

.welcome-state > p[b-fhd07mawm9] {
    color: var(--text-secondary);
    font-size: 0.875rem;
    max-width: 480px;
    margin: 0 auto var(--space-6);
}

.welcome-actions[b-fhd07mawm9] { margin-top: var(--space-6); }

.template-section[b-fhd07mawm9] { margin-top: var(--space-6); }

.template-section h3[b-fhd07mawm9], .templates-section h3[b-fhd07mawm9] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 var(--space-3);
}

.template-grid[b-fhd07mawm9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--space-3);
    max-width: 720px;
    margin: 0 auto;
}

.template-card[b-fhd07mawm9] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
    display: flex;
    gap: var(--space-3);
    align-items: flex-start;
    text-align: left;
}

.template-card:hover[b-fhd07mawm9] { border-color: var(--accent-primary); box-shadow: 0 0 0 1px var(--accent-primary); }

.template-icon[b-fhd07mawm9] { font-size: 1.5rem; flex-shrink: 0; }

.template-info[b-fhd07mawm9] { display: flex; flex-direction: column; gap: var(--space-1); }

.template-title[b-fhd07mawm9] { font-weight: 600; font-size: 0.875rem; color: var(--text-primary); }
.template-desc[b-fhd07mawm9] { font-size: 0.75rem; color: var(--text-secondary); line-height: 1.4; }
.template-meta[b-fhd07mawm9] { font-size: 0.7rem; color: var(--text-tertiary); }

.templates-section[b-fhd07mawm9] {
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

.template-row[b-fhd07mawm9] { display: flex; gap: var(--space-2); flex-wrap: wrap; }

.template-chip[b-fhd07mawm9] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-full, 9999px);
    padding: var(--space-1) var(--space-3);
    font-size: 0.8rem;
    cursor: pointer;
    transition: border-color 0.15s;
    display: flex;
    align-items: center;
    gap: var(--space-1);
    color: var(--text-primary);
}

.template-chip:hover[b-fhd07mawm9] { border-color: var(--accent-primary); }
.chip-icon[b-fhd07mawm9] { font-size: 0.9rem; }

.boards-grid[b-fhd07mawm9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--space-4);
}

.board-card[b-fhd07mawm9] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    cursor: pointer;
    transition: border-color 0.15s, transform 0.1s;
}

.board-card:hover[b-fhd07mawm9] { border-color: var(--accent-primary); transform: translateY(-1px); }

.board-card-header[b-fhd07mawm9] { display: flex; gap: var(--space-3); align-items: flex-start; margin-bottom: var(--space-2); }
.board-icon[b-fhd07mawm9] { font-size: 1.5rem; flex-shrink: 0; }
.board-title-group[b-fhd07mawm9] { display: flex; flex-direction: column; gap: var(--space-1); }
.board-title[b-fhd07mawm9] { font-weight: 600; font-size: 1rem; color: var(--text-primary); }

.badge[b-fhd07mawm9] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 1px 6px;
    border-radius: var(--radius-sm);
    width: fit-content;
}

.badge-default[b-fhd07mawm9] { background: var(--bg-tertiary); color: var(--text-secondary); }
.badge-verified[b-fhd07mawm9] { background: #d1fae5; color: #065f46; }
.badge-shared[b-fhd07mawm9] { background: #dbeafe; color: #1e40af; }

.board-description[b-fhd07mawm9] { color: var(--text-secondary); font-size: 0.8rem; line-height: 1.4; margin: 0 0 var(--space-3); }
.board-meta[b-fhd07mawm9] { display: flex; gap: var(--space-3); font-size: 0.75rem; color: var(--text-tertiary); }

.modal-backdrop[b-fhd07mawm9] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: var(--space-4);
}

.modal-content[b-fhd07mawm9] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    width: 100%;
    max-width: 480px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.modal-content h2[b-fhd07mawm9] { font-size: 1.25rem; font-weight: 700; margin: 0 0 var(--space-4); color: var(--text-primary); }

.form-group[b-fhd07mawm9] { margin-bottom: var(--space-4); }

.form-group label[b-fhd07mawm9] { display: block; font-size: 0.8rem; font-weight: 600; color: var(--text-secondary); margin-bottom: var(--space-1); }

.form-group input[b-fhd07mawm9], .form-group textarea[b-fhd07mawm9] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-size: 0.875rem;
    font-family: inherit;
}

.form-group input:focus[b-fhd07mawm9], .form-group textarea:focus[b-fhd07mawm9] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
}

.icon-picker[b-fhd07mawm9] { display: flex; gap: var(--space-2); flex-wrap: wrap; }

.icon-option[b-fhd07mawm9] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
    cursor: pointer;
    font-size: 1.2rem;
    transition: border-color 0.15s;
}

.icon-option:hover[b-fhd07mawm9] { border-color: var(--text-tertiary); }
.icon-option.selected[b-fhd07mawm9] { border-color: var(--accent-primary); background: rgba(99, 102, 241, 0.1); }

.form-actions[b-fhd07mawm9] { display: flex; gap: var(--space-2); justify-content: flex-end; margin-top: var(--space-5); }

.shared-section[b-fhd07mawm9] {
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

.shared-section h3[b-fhd07mawm9] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 var(--space-3);
}

.shared-card[b-fhd07mawm9] { border-left: 3px solid var(--accent-primary); }

.shared-label[b-fhd07mawm9] {
    color: var(--accent-primary);
    font-weight: 500;
}

@media (max-width: 768px) {
    .spaces-header[b-fhd07mawm9] { flex-direction: column; }
    .boards-grid[b-fhd07mawm9] { grid-template-columns: 1fr; }
    .template-grid[b-fhd07mawm9] { grid-template-columns: 1fr; }
}
/* /Pages/TenantAdmin.razor.rz.scp.css */
/* Tenant Admin / Manage Page */

.manage-page[b-69vaqy209k] {
    padding: var(--space-6);
    max-width: 1400px;
    margin: 0 auto;
}

/* Header */
.manage-header[b-69vaqy209k] {
    margin-bottom: var(--space-6);
}

.manage-header h1[b-69vaqy209k] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
    letter-spacing: var(--tracking-tight);
}

.manage-header p[b-69vaqy209k] {
    color: var(--text-tertiary);
    margin: 0;
    font-size: var(--text-base);
}

/* Banners */
.error-banner[b-69vaqy209k],
.success-banner[b-69vaqy209k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    font-size: var(--text-sm);
}

.error-banner[b-69vaqy209k] {
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
}

.success-banner[b-69vaqy209k] {
    background: var(--success-subtle);
    color: var(--success);
    border: 1px solid var(--success);
}

.close-btn[b-69vaqy209k] {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-size: var(--text-sm);
    opacity: 0.7;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.close-btn:hover[b-69vaqy209k] {
    opacity: 1;
}

/* Tabs */
.manage-tabs[b-69vaqy209k] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-6);
    border-bottom: 1px solid var(--border-light);
    padding-bottom: 0;
}

.tab-btn[b-69vaqy209k] {
    position: relative;
    padding: var(--space-3) var(--space-4);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    transition: color var(--duration-fast) var(--ease-out);
}

.tab-btn:hover[b-69vaqy209k] {
    color: var(--text-primary);
}

.tab-btn.active[b-69vaqy209k] {
    color: var(--text-primary);
}

.tab-btn.active[b-69vaqy209k]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--accent-primary);
    border-radius: var(--radius-full) var(--radius-full) 0 0;
}

/* Loading */
.loading[b-69vaqy209k] {
    text-align: center;
    padding: var(--space-12);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
}

/* Section */
.manage-section[b-69vaqy209k] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--border-light);
}

.section-header[b-69vaqy209k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.section-header h2[b-69vaqy209k] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.section-description[b-69vaqy209k] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: 0;
    padding: var(--space-3) var(--space-5) 0;
}

/* Endpoint Step Cards */
.endpoint-step-card[b-69vaqy209k] {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-4) var(--space-5);
    margin: var(--space-3) var(--space-5);
    background: var(--bg-primary);
}

.endpoint-step-header[b-69vaqy209k] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.endpoint-step-number[b-69vaqy209k] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 50%;
    background: var(--bg-tertiary);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    margin-top: 2px;
}

.endpoint-step-number.done[b-69vaqy209k] {
    background: var(--success, #22c55e);
    color: white;
}

.endpoint-step-title[b-69vaqy209k] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.endpoint-step-desc[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: 0;
    line-height: 1.4;
}

.endpoint-step-action[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-3);
    padding-left: 40px;
}

.endpoint-step-body[b-69vaqy209k] {
    margin-top: var(--space-3);
    padding-left: 40px;
}

/* Warning Banner */
.endpoint-warning-banner[b-69vaqy209k] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    margin: var(--space-3) var(--space-5);
    background: rgba(234, 179, 8, 0.08);
    border: 1px solid rgba(234, 179, 8, 0.3);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    font-size: var(--text-xs);
    line-height: 1.5;
}

.endpoint-warning-banner svg[b-69vaqy209k] {
    color: #eab308;
    min-width: 16px;
    margin-top: 1px;
}

.endpoint-warning-banner strong[b-69vaqy209k] {
    color: var(--text-primary);
}

/* Discovery header info */
.discovery-header-info[b-69vaqy209k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.discovery-api-info[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.discovery-version[b-69vaqy209k] {
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

.discovery-stats[b-69vaqy209k] {
    display: flex;
    gap: var(--space-4);
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

/* AI-Assisted Selection */
.endpoint-ai-assist[b-69vaqy209k] {
    margin-bottom: var(--space-3);
    padding: var(--space-3);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
}

.endpoint-ai-assist-title[b-69vaqy209k] {
    margin: 0 0 var(--space-2) 0;
    font-weight: var(--font-semibold);
    font-size: var(--text-sm);
}

/* Endpoint items (matching Admin style) */
.endpoint-item[b-69vaqy209k] {
    padding: var(--space-2) var(--space-3) var(--space-2) var(--space-5);
    border-bottom: 1px solid var(--border-light);
    transition: background 0.1s;
}

.endpoint-item:last-child[b-69vaqy209k] {
    border-bottom: none;
}

.endpoint-item:hover[b-69vaqy209k] {
    background: var(--bg-secondary);
}

.endpoint-item.selected[b-69vaqy209k] {
    background: rgba(99, 102, 241, 0.05);
}

.endpoint-item-header[b-69vaqy209k] {
    display: flex;
    align-items: center;
}

.endpoint-checkbox[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    font-size: var(--text-sm);
}

.endpoint-item-summary[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding-left: 24px;
    margin-top: var(--space-1);
}

.endpoint-params[b-69vaqy209k] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding-left: 24px;
    margin-top: var(--space-1);
}

.param-tag[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 6px;
    font-size: 0.7rem;
    background: var(--bg-tertiary);
    border-radius: 4px;
    color: var(--text-secondary);
}

.param-tag.required[b-69vaqy209k] {
    border: 1px solid rgba(99, 102, 241, 0.3);
}

.param-type[b-69vaqy209k] {
    color: var(--text-tertiary);
    font-size: 0.65rem;
}

.param-required[b-69vaqy209k] {
    color: var(--accent-primary);
    font-weight: bold;
}

.endpoint-empty-state[b-69vaqy209k] {
    text-align: center;
    padding: var(--space-6) var(--space-4);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    border: 1px dashed var(--border-light);
    border-radius: var(--radius-lg);
    margin: var(--space-3) var(--space-5);
}

/* Endpoint Discovery */
.endpoint-schema-info[b-69vaqy209k] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-3) 0;
}

.endpoint-discovery-toolbar[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    flex-wrap: wrap;
}

.endpoint-selection-count[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: var(--font-medium);
    margin-left: auto;
}

.endpoint-discovery-groups[b-69vaqy209k] {
    max-height: 500px;
    overflow-y: auto;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
}

.endpoint-group[b-69vaqy209k] {
    border-bottom: 1px solid var(--border-light);
}

.endpoint-group:last-child[b-69vaqy209k] {
    border-bottom: none;
}

.endpoint-group-header[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    cursor: pointer;
    font-weight: var(--font-medium);
    font-size: var(--text-sm);
    user-select: none;
}

.endpoint-group-header:hover[b-69vaqy209k] {
    background: var(--bg-tertiary);
}

.endpoint-group-name[b-69vaqy209k] {
    font-family: var(--font-mono, monospace);
    font-size: var(--text-xs);
    color: var(--text-primary);
}

.endpoint-group-count[b-69vaqy209k] {
    font-size: 0.7rem;
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    padding: 1px 6px;
    border-radius: 10px;
    font-weight: var(--font-semibold);
}

.endpoint-group-items[b-69vaqy209k] {
    padding: var(--space-1) 0;
}

.endpoint-discovery-item[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3) var(--space-1) var(--space-5);
    cursor: pointer;
    font-size: var(--text-xs);
    transition: background 0.1s;
}

.endpoint-discovery-item:hover[b-69vaqy209k] {
    background: var(--bg-secondary);
}

.endpoint-discovery-item.selected[b-69vaqy209k] {
    background: rgba(99, 102, 241, 0.05);
}

.endpoint-path[b-69vaqy209k] {
    font-family: var(--font-mono, monospace);
    color: var(--text-primary);
    white-space: nowrap;
}

.endpoint-summary[b-69vaqy209k] {
    color: var(--text-tertiary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.endpoint-discovery-actions[b-69vaqy209k] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
    margin-top: var(--space-3);
}

/* Managed endpoint groups */
.endpoint-managed-group[b-69vaqy209k] {
    margin-bottom: var(--space-3);
}

.endpoint-managed-group .endpoint-group-header[b-69vaqy209k] {
    cursor: default;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}

/* Table */
.data-table[b-69vaqy209k] {
    overflow-x: auto;
}

.data-table table[b-69vaqy209k] {
    width: 100%;
    border-collapse: collapse;
}

.data-table th[b-69vaqy209k] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-primary);
}

.data-table td[b-69vaqy209k] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-light);
    vertical-align: middle;
}

.data-table tbody tr[b-69vaqy209k] {
    transition: background-color var(--duration-fast) var(--ease-out);
}

.data-table tbody tr:hover[b-69vaqy209k] {
    background: var(--bg-secondary);
}

.data-table tbody tr:last-child td[b-69vaqy209k] {
    border-bottom: none;
}

.no-data[b-69vaqy209k] {
    text-align: center;
    color: var(--text-muted);
    padding: var(--space-10) var(--space-4) !important;
    font-size: var(--text-sm);
}

.row-inactive[b-69vaqy209k] {
    opacity: 0.6;
}

.row-inactive:hover[b-69vaqy209k] {
    opacity: 0.8;
}

/* Badges */
.status-badge[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.status-badge.active[b-69vaqy209k] {
    background: var(--success-subtle);
    color: var(--success);
}

.status-badge.inactive[b-69vaqy209k] {
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.status-badge.warning[b-69vaqy209k] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.role-badge[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.role-badge.user[b-69vaqy209k] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.role-badge.tenantadmin[b-69vaqy209k] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.role-badge.systemadmin[b-69vaqy209k] {
    background: var(--error-subtle);
    color: var(--error);
}

.tier-badge[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.tier-badge.basic[b-69vaqy209k] {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.tier-badge.professional[b-69vaqy209k] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.tier-badge.enterprise[b-69vaqy209k] {
    background: var(--warning-subtle);
    color: var(--warning);
}

/* Actions */
.actions[b-69vaqy209k] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

/* Buttons */
.btn-primary[b-69vaqy209k] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-primary:hover:not(:disabled)[b-69vaqy209k] {
    background: var(--accent-hover);
}

.btn-primary:active:not(:disabled)[b-69vaqy209k] {
    transform: scale(0.98);
}

.btn-primary:disabled[b-69vaqy209k] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-secondary[b-69vaqy209k] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-secondary:hover:not(:disabled)[b-69vaqy209k] {
    background: var(--bg-tertiary);
    border-color: var(--border-secondary);
}

.btn-secondary:disabled[b-69vaqy209k] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-small[b-69vaqy209k] {
    height: 24px;
    padding: 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    border: 1px solid var(--border-primary);
    background: var(--bg-primary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    color: var(--text-secondary);
    transition: all var(--duration-fast) var(--ease-out);
    white-space: nowrap;
}

.btn-small:hover[b-69vaqy209k] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-secondary);
}

.btn-small.btn-danger[b-69vaqy209k] {
    color: var(--error);
    border-color: var(--error);
}

.btn-small.btn-danger:hover[b-69vaqy209k] {
    background: var(--error-subtle);
}

/* Organisation Info Bar */
.org-info-bar[b-69vaqy209k] {
    display: flex;
    gap: var(--space-6);
    padding: var(--space-4) var(--space-5);
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-5);
}

.info-item[b-69vaqy209k] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.info-label[b-69vaqy209k] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
}

.info-value[b-69vaqy209k] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    font-weight: var(--font-medium);
}

/* Organisation Cards */
.org-cards[b-69vaqy209k] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-5);
}

.org-card[b-69vaqy209k] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
}

.org-card h3[b-69vaqy209k] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--border-light);
}

.card-footer[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

/* Connection Status */
.connection-status[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
}

.connection-status.connected[b-69vaqy209k] {
    background: var(--success-subtle);
    color: var(--success);
}

.connection-status.failed[b-69vaqy209k] {
    background: var(--error-subtle);
    color: var(--error);
}

/* Modal */
.modal-overlay[b-69vaqy209k] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: var(--space-4);
}

.modal-content[b-69vaqy209k] {
    background: var(--bg-elevated);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--border-light);
    max-width: 480px;
    width: 100%;
    max-height: calc(100vh - var(--space-8));
    overflow-y: auto;
}

.modal-content.modal-wide[b-69vaqy209k] {
    max-width: 640px;
}

/* Bulk Import */
.bulk-import-example[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-bottom: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-tertiary);
    border-radius: var(--radius-md);
}

.bulk-import-example pre[b-69vaqy209k] {
    margin: var(--space-2) 0 var(--space-2);
    font-size: 0.75rem;
    color: var(--text-secondary);
    white-space: pre-wrap;
}

.bulk-import-legend[b-69vaqy209k] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    border-top: 1px solid var(--border-light);
    padding-top: var(--space-2);
}

.bulk-import-legend code[b-69vaqy209k] {
    background: var(--bg-secondary);
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.7rem;
}

.bulk-import-textarea[b-69vaqy209k] {
    width: 100%;
    min-height: 200px;
    resize: vertical;
    font-family: var(--font-mono, monospace);
    font-size: 0.8rem;
    line-height: 1.6;
}

.modal-header[b-69vaqy209k] {
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.modal-header h3[b-69vaqy209k] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.modal-body[b-69vaqy209k] {
    padding: var(--space-5);
}

.modal-description[b-69vaqy209k] {
    margin: 0 0 var(--space-4) 0;
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.modal-hint[b-69vaqy209k] {
    margin: 0 0 var(--space-4) 0;
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.modal-footer[b-69vaqy209k] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-light);
    background: var(--bg-secondary);
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
}

/* Endpoint Access Modal */
.endpoint-access-modal[b-69vaqy209k] {
    max-width: 600px;
}

.endpoint-access-toolbar[b-69vaqy209k] {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    align-items: center;
}

.endpoint-access-toolbar .form-input[b-69vaqy209k] {
    flex: 1;
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-3);
}

.endpoint-access-list[b-69vaqy209k] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
}

.ea-group[b-69vaqy209k] {
    border-bottom: 1px solid var(--border-light);
}

.ea-group:last-child[b-69vaqy209k] {
    border-bottom: none;
}

.ea-group-header[b-69vaqy209k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    position: sticky;
    top: 0;
    z-index: 1;
}

.ea-group-name[b-69vaqy209k] {
    color: var(--text-primary);
}

.ea-group-count[b-69vaqy209k] {
    color: var(--text-tertiary);
    font-weight: var(--font-normal);
    font-size: var(--text-xs);
}

.ea-item[b-69vaqy209k] {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: var(--space-2) var(--space-3);
    border-top: 1px solid var(--border-light);
    transition: background var(--duration-fast) var(--ease-out);
}

.ea-item:hover[b-69vaqy209k] {
    background: var(--bg-secondary);
}

.ea-item.disabled[b-69vaqy209k] {
    opacity: 0.5;
}

.ea-toggle-label[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    min-width: 0;
}

.ea-toggle-label input[type="checkbox"][b-69vaqy209k] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent-primary);
    flex-shrink: 0;
    cursor: pointer;
}

.ea-write-indicator[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: var(--radius-sm);
    background: #fef3c7;
    color: #b45309;
    font-size: 9px;
    font-weight: 700;
    font-family: var(--font-mono);
    flex-shrink: 0;
}

.ea-path[b-69vaqy209k] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ea-display-name[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding-left: calc(16px + var(--space-2) + 40px + var(--space-2));
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.method-badge[b-69vaqy209k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 18px;
    padding: 0 var(--space-1);
    border-radius: var(--radius-sm);
    font-size: 9px;
    font-weight: 700;
    font-family: var(--font-mono);
    text-transform: uppercase;
    flex-shrink: 0;
}

.method-badge.get[b-69vaqy209k] { background: #dbeafe; color: #1d4ed8; }
.method-badge.post[b-69vaqy209k] { background: #dcfce7; color: #15803d; }
.method-badge.put[b-69vaqy209k] { background: #fef3c7; color: #b45309; }
.method-badge.delete[b-69vaqy209k] { background: #fce4ec; color: #c62828; }
.method-badge.patch[b-69vaqy209k] { background: #f3e5f5; color: #7b1fa2; }

/* Forms */
.form-group[b-69vaqy209k] {
    margin-bottom: var(--space-4);
}

.form-group label[b-69vaqy209k] {
    display: block;
    margin-bottom: var(--space-1);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.form-row[b-69vaqy209k] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.form-input[b-69vaqy209k] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    box-sizing: border-box;
}

.form-input:focus[b-69vaqy209k] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-select[b-69vaqy209k] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    box-sizing: border-box;
}

.form-select:focus[b-69vaqy209k] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-hint[b-69vaqy209k] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.form-error[b-69vaqy209k] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    color: var(--error);
}

.form-checkbox[b-69vaqy209k] {
    display: flex;
    align-items: center;
}

.form-checkbox label[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    margin-bottom: 0;
}

.form-checkbox input[type="checkbox"][b-69vaqy209k] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent-primary);
}

/* Color Input */
.color-input-wrapper[b-69vaqy209k] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

.form-color[b-69vaqy209k] {
    width: 40px;
    height: 34px;
    padding: 2px;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    background: var(--bg-primary);
}

.form-color[b-69vaqy209k]::-webkit-color-swatch-wrapper {
    padding: 0;
}

.form-color[b-69vaqy209k]::-webkit-color-swatch {
    border: none;
    border-radius: var(--radius-sm);
}

/* Sophia Prompts */
.prompts-intro[b-69vaqy209k] {
    margin-bottom: var(--space-5);
}

.prompts-intro p[b-69vaqy209k] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: 0;
    line-height: 1.6;
}

.prompt-card[b-69vaqy209k] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    overflow: hidden;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.prompt-card.has-override[b-69vaqy209k] {
    border-color: var(--accent-primary);
    border-left: 3px solid var(--accent-primary);
}

.prompt-card-header[b-69vaqy209k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: var(--space-4) var(--space-5);
    gap: var(--space-3);
}

.prompt-card-title h3[b-69vaqy209k] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.prompt-summary[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.prompt-card-badges[b-69vaqy209k] {
    display: flex;
    gap: var(--space-2);
    flex-shrink: 0;
}

.stale-warning[b-69vaqy209k] {
    padding: var(--space-3) var(--space-5);
    background: var(--warning-subtle);
    color: var(--warning);
    font-size: var(--text-xs);
    line-height: 1.5;
    border-top: 1px solid var(--border-light);
}

.prompt-card-toggle[b-69vaqy209k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-5);
    border-top: 1px solid var(--border-light);
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    transition: all var(--duration-fast) var(--ease-out);
}

.prompt-card-toggle:hover[b-69vaqy209k] {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.expand-icon[b-69vaqy209k] {
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    color: var(--text-muted);
}

.prompt-card-body[b-69vaqy209k] {
    border-top: 1px solid var(--border-light);
    padding: var(--space-5);
}

.prompt-editor[b-69vaqy209k] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.editor-label[b-69vaqy209k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
    margin-bottom: var(--space-2);
}

.prompt-version[b-69vaqy209k] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    font-weight: var(--font-normal);
    text-transform: none;
    letter-spacing: normal;
}

.prompt-content-preview[b-69vaqy209k] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    font-size: var(--text-xs);
    font-family: var(--font-mono);
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-wrap: break-word;
    max-height: 400px;
    overflow-y: auto;
    line-height: 1.6;
}

.prompt-textarea[b-69vaqy209k] {
    width: 100%;
    min-height: 300px;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-family: var(--font-mono);
    background: var(--bg-primary);
    color: var(--text-primary);
    resize: vertical;
    line-height: 1.6;
    box-sizing: border-box;
}

.prompt-textarea:focus[b-69vaqy209k] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.prompt-content-view[b-69vaqy209k] {
    margin-bottom: var(--space-4);
}

.master-reference[b-69vaqy209k] {
    margin-bottom: var(--space-4);
}

.master-reference summary[b-69vaqy209k] {
    cursor: pointer;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding: var(--space-2) 0;
    user-select: none;
}

.master-reference summary:hover[b-69vaqy209k] {
    color: var(--text-primary);
}

.master-reference .prompt-content-preview[b-69vaqy209k] {
    margin-top: var(--space-2);
}

.prompt-card-actions[b-69vaqy209k] {
    display: flex;
    gap: var(--space-3);
    align-items: center;
}

/* Mobile */
@media (max-width: 768px) {
    .manage-page[b-69vaqy209k] {
        padding: var(--space-4);
    }

    .section-header[b-69vaqy209k] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }

    .org-info-bar[b-69vaqy209k] {
        flex-wrap: wrap;
        gap: var(--space-4);
    }

    .org-cards[b-69vaqy209k] {
        grid-template-columns: 1fr;
    }

    .actions[b-69vaqy209k] {
        flex-direction: column;
        gap: var(--space-1);
    }

    .btn-small[b-69vaqy209k] {
        width: 100%;
    }

    .form-row[b-69vaqy209k] {
        grid-template-columns: 1fr;
    }

    .card-footer[b-69vaqy209k] {
        flex-wrap: wrap;
    }

    .prompt-editor[b-69vaqy209k] {
        grid-template-columns: 1fr;
    }

    .prompt-card-header[b-69vaqy209k] {
        flex-direction: column;
    }
}

/* Spending Limits */
.spend-cell[b-69vaqy209k] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.progress-bar-mini[b-69vaqy209k] {
    width: 100%;
    height: 4px;
    background: var(--bg-secondary, #1a1a2e);
    border-radius: 2px;
    overflow: hidden;
}

.progress-bar-fill[b-69vaqy209k] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.progress-green[b-69vaqy209k] {
    background: var(--color-success, #10b981);
}

.progress-yellow[b-69vaqy209k] {
    background: var(--color-warning, #f59e0b);
}

.progress-red[b-69vaqy209k] {
    background: var(--color-error, #ef4444);
}

.text-muted[b-69vaqy209k] {
    color: var(--text-tertiary, #64748b);
}

[b-69vaqy209k] .status-badge.warning {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
}
/* /Pages/TenantAdmin2.razor.rz.scp.css */
/* TenantAdmin2 - Sidebar Layout */

/* Page Container */
.m2-page[b-ckovw53z0w] {
    display: flex;
    min-height: calc(100vh - 56px);
    background: var(--bg-body);
}

/* Sidebar */
.m2-sidebar[b-ckovw53z0w] {
    width: 230px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    border-right: 1px solid var(--border-light);
    background: var(--bg-secondary);
    flex-shrink: 0;
    z-index: 10;
    padding: var(--space-4) 0;
}

.m2-sidebar-section[b-ckovw53z0w] {
    padding: var(--space-1) var(--space-3);
    margin-bottom: var(--space-2);
}

.m2-sidebar-title[b-ckovw53z0w] {
    font-size: 0.6rem;
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    padding: var(--space-3) var(--space-3) var(--space-1);
}

.m2-sidebar-item[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
    padding: 7px var(--space-3);
    margin: 1px 0;
    cursor: pointer;
    border: none;
    border-radius: var(--radius-md);
    font-family: inherit;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    background: transparent;
    transition: all 0.15s ease;
    user-select: none;
    text-align: left;
    line-height: 1.4;
}

.m2-sidebar-item:hover[b-ckovw53z0w] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

.m2-sidebar-item.active[b-ckovw53z0w] {
    background: var(--accent-primary);
    color: #ffffff;
    font-weight: var(--font-medium);
}

.m2-sidebar-item.active:hover[b-ckovw53z0w] {
    background: var(--accent-primary);
    color: #ffffff;
}

.m2-sidebar-icon[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    opacity: 0.7;
}

.m2-sidebar-item.active .m2-sidebar-icon[b-ckovw53z0w] {
    opacity: 1;
}

.m2-sidebar-badge[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: var(--radius-full);
    font-size: 0.6rem;
    font-weight: var(--font-bold);
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    margin-left: auto;
}

.m2-sidebar-item.active .m2-sidebar-badge[b-ckovw53z0w] {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

/* Content Area */
.m2-content[b-ckovw53z0w] {
    flex: 1;
    padding: var(--space-6);
    overflow-y: auto;
    max-width: 1200px;
}

.m2-content-header[b-ckovw53z0w] {
    margin-bottom: var(--space-6);
}

.m2-content-header h1[b-ckovw53z0w] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
    letter-spacing: var(--tracking-tight);
}

.m2-content-header p[b-ckovw53z0w] {
    color: var(--text-tertiary);
    margin: 0;
    font-size: var(--text-base);
}

/* Setup Checklist */
.m2-setup-checklist[b-ckovw53z0w] {
    border: 1px solid var(--accent-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-4) var(--space-5);
    margin-bottom: var(--space-6);
    background: var(--accent-subtle);
}

.m2-setup-checklist h3[b-ckovw53z0w] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-3) 0;
}

.m2-setup-item[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.m2-setup-item.done[b-ckovw53z0w] {
    color: var(--success);
}

.m2-setup-item.done svg[b-ckovw53z0w] {
    color: var(--success);
}

.m2-setup-item.pending[b-ckovw53z0w] {
    color: var(--text-tertiary);
}

.m2-setup-item.pending svg[b-ckovw53z0w] {
    color: var(--text-muted);
}

.m2-setup-action[b-ckovw53z0w] {
    margin-left: auto;
    height: 28px;
    padding: 0 var(--space-3);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.m2-setup-action:hover[b-ckovw53z0w] {
    background: var(--accent-hover);
}

/* Mobile Sidebar Toggle */
.m2-sidebar-toggle[b-ckovw53z0w] {
    display: none;
    position: fixed;
    bottom: var(--space-4);
    right: var(--space-4);
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--accent-primary);
    color: white;
    border: none;
    cursor: pointer;
    z-index: 20;
    align-items: center;
    justify-content: center;
    box-shadow: var(--shadow-lg);
}

/* Responsive */
@media (max-width: 768px) {
    .m2-sidebar[b-ckovw53z0w] {
        position: fixed;
        left: -220px;
        top: 56px;
        height: calc(100vh - 56px);
        transition: left var(--duration-normal) var(--ease-out);
        z-index: 100;
        box-shadow: none;
    }

    .m2-sidebar.open[b-ckovw53z0w] {
        left: 0;
        box-shadow: var(--shadow-xl);
    }

    .m2-sidebar-toggle[b-ckovw53z0w] {
        display: flex;
    }

    .m2-content[b-ckovw53z0w] {
        padding: var(--space-4);
        width: 100%;
    }
}

/* ============================================
   Inner Content Styles (from TenantAdmin)
   ============================================ */

/* Banners */
.error-banner[b-ckovw53z0w],
.success-banner[b-ckovw53z0w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    font-size: var(--text-sm);
}

.error-banner[b-ckovw53z0w] {
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
}

.success-banner[b-ckovw53z0w] {
    background: var(--success-subtle);
    color: var(--success);
    border: 1px solid var(--success);
}

.close-btn[b-ckovw53z0w] {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-size: var(--text-sm);
    opacity: 0.7;
    transition: opacity var(--duration-fast) var(--ease-out);
}

.close-btn:hover[b-ckovw53z0w] {
    opacity: 1;
}

/* Loading */
.loading[b-ckovw53z0w] {
    text-align: center;
    padding: var(--space-12);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
}

/* Section */
.manage-section[b-ckovw53z0w] {
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--border-light);
}

.section-header[b-ckovw53z0w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.section-header h2[b-ckovw53z0w] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.section-description[b-ckovw53z0w] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: 0;
    padding: var(--space-3) var(--space-5) 0;
}

/* Endpoint Step Cards */
.endpoint-step-card[b-ckovw53z0w] {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-4) var(--space-5);
    margin: var(--space-3) var(--space-5);
    background: var(--bg-primary);
}

.endpoint-step-header[b-ckovw53z0w] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.endpoint-step-number[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 50%;
    background: var(--bg-tertiary);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    margin-top: 2px;
}

.endpoint-step-number.done[b-ckovw53z0w] {
    background: var(--success, #22c55e);
    color: white;
}

.endpoint-step-title[b-ckovw53z0w] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.endpoint-step-desc[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin: 0;
    line-height: 1.4;
}

.endpoint-step-action[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-3);
    padding-left: 40px;
}

.endpoint-step-body[b-ckovw53z0w] {
    margin-top: var(--space-3);
    padding-left: 40px;
}

/* Warning Banner */
.endpoint-warning-banner[b-ckovw53z0w] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    margin: var(--space-3) var(--space-5);
    background: rgba(234, 179, 8, 0.08);
    border: 1px solid rgba(234, 179, 8, 0.3);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    font-size: var(--text-xs);
    line-height: 1.5;
}

.endpoint-warning-banner svg[b-ckovw53z0w] {
    color: #eab308;
    min-width: 16px;
    margin-top: 1px;
}

.endpoint-warning-banner strong[b-ckovw53z0w] {
    color: var(--text-primary);
}

/* Discovery header info */
.discovery-header-info[b-ckovw53z0w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.discovery-api-info[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.discovery-version[b-ckovw53z0w] {
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

.discovery-stats[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-4);
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

/* AI-Assisted Selection */
.endpoint-ai-assist[b-ckovw53z0w] {
    margin-bottom: var(--space-3);
    padding: var(--space-3);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-secondary);
}

.endpoint-ai-assist-title[b-ckovw53z0w] {
    margin: 0 0 var(--space-2) 0;
    font-weight: var(--font-semibold);
    font-size: var(--text-sm);
}

/* Endpoint items (matching Admin style) */
.endpoint-item[b-ckovw53z0w] {
    padding: var(--space-2) var(--space-3) var(--space-2) var(--space-5);
    border-bottom: 1px solid var(--border-light);
    transition: background 0.1s;
}

.endpoint-item:last-child[b-ckovw53z0w] {
    border-bottom: none;
}

.endpoint-item:hover[b-ckovw53z0w] {
    background: var(--bg-secondary);
}

.endpoint-item.selected[b-ckovw53z0w] {
    background: rgba(99, 102, 241, 0.05);
}

.endpoint-item-header[b-ckovw53z0w] {
    display: flex;
    align-items: center;
}

.endpoint-checkbox[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    font-size: var(--text-sm);
}

.endpoint-item-summary[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding-left: 24px;
    margin-top: var(--space-1);
}

.endpoint-params[b-ckovw53z0w] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding-left: 24px;
    margin-top: var(--space-1);
}

.param-tag[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 6px;
    font-size: 0.7rem;
    background: var(--bg-tertiary);
    border-radius: 4px;
    color: var(--text-secondary);
}

.param-tag.required[b-ckovw53z0w] {
    border: 1px solid rgba(99, 102, 241, 0.3);
}

.param-type[b-ckovw53z0w] {
    color: var(--text-tertiary);
    font-size: 0.65rem;
}

.param-required[b-ckovw53z0w] {
    color: var(--accent-primary);
    font-weight: bold;
}

.endpoint-empty-state[b-ckovw53z0w] {
    text-align: center;
    padding: var(--space-6) var(--space-4);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    border: 1px dashed var(--border-light);
    border-radius: var(--radius-lg);
    margin: var(--space-3) var(--space-5);
}

.endpoint-prompts-nudge[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-top: var(--space-3);
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.endpoint-prompts-nudge svg[b-ckovw53z0w] {
    flex-shrink: 0;
    color: var(--accent-primary);
}

.link-btn[b-ckovw53z0w] {
    background: none;
    border: none;
    color: var(--accent-primary);
    font-weight: var(--font-semibold);
    cursor: pointer;
    padding: 0;
    font-size: inherit;
    text-decoration: underline;
}

.link-btn:hover[b-ckovw53z0w] {
    color: var(--accent-hover);
}

.m2-setup-icon.optional[b-ckovw53z0w] {
    color: var(--text-tertiary);
}

/* Endpoint Discovery */
.endpoint-schema-info[b-ckovw53z0w] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-3) 0;
}

.endpoint-discovery-toolbar[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    flex-wrap: wrap;
}

.endpoint-selection-count[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: var(--font-medium);
    margin-left: auto;
}

.endpoint-discovery-groups[b-ckovw53z0w] {
    max-height: 500px;
    overflow-y: auto;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
}

.endpoint-group[b-ckovw53z0w] {
    border-bottom: 1px solid var(--border-light);
}

.endpoint-group:last-child[b-ckovw53z0w] {
    border-bottom: none;
}

.endpoint-group-header[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    cursor: pointer;
    font-weight: var(--font-medium);
    font-size: var(--text-sm);
    user-select: none;
}

.endpoint-group-header:hover[b-ckovw53z0w] {
    background: var(--bg-tertiary);
}

.endpoint-group-name[b-ckovw53z0w] {
    font-family: var(--font-mono, monospace);
    font-size: var(--text-xs);
    color: var(--text-primary);
}

.endpoint-group-count[b-ckovw53z0w] {
    font-size: 0.7rem;
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    padding: 1px 6px;
    border-radius: 10px;
    font-weight: var(--font-semibold);
}

.endpoint-group-items[b-ckovw53z0w] {
    padding: var(--space-1) 0;
}

.endpoint-discovery-item[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3) var(--space-1) var(--space-5);
    cursor: pointer;
    font-size: var(--text-xs);
    transition: background 0.1s;
}

.endpoint-discovery-item:hover[b-ckovw53z0w] {
    background: var(--bg-secondary);
}

.endpoint-discovery-item.selected[b-ckovw53z0w] {
    background: rgba(99, 102, 241, 0.05);
}

.endpoint-path[b-ckovw53z0w] {
    font-family: var(--font-mono, monospace);
    color: var(--text-primary);
    white-space: nowrap;
}

.endpoint-summary[b-ckovw53z0w] {
    color: var(--text-tertiary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.endpoint-discovery-actions[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
    margin-top: var(--space-3);
}

/* Managed endpoint groups */
.endpoint-managed-group[b-ckovw53z0w] {
    margin-bottom: var(--space-3);
}

.endpoint-managed-group .endpoint-group-header[b-ckovw53z0w] {
    cursor: default;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}

/* Table */
.data-table[b-ckovw53z0w] {
    overflow-x: auto;
}

.data-table table[b-ckovw53z0w] {
    width: 100%;
    border-collapse: collapse;
}

.data-table th[b-ckovw53z0w] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-primary);
}

.data-table td[b-ckovw53z0w] {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-light);
    vertical-align: middle;
}

.data-table tbody tr[b-ckovw53z0w] {
    transition: background-color var(--duration-fast) var(--ease-out);
}

.data-table tbody tr:hover[b-ckovw53z0w] {
    background: var(--bg-secondary);
}

.data-table tbody tr:last-child td[b-ckovw53z0w] {
    border-bottom: none;
}

.no-data[b-ckovw53z0w] {
    text-align: center;
    color: var(--text-muted);
    padding: var(--space-10) var(--space-4) !important;
    font-size: var(--text-sm);
}

.row-inactive[b-ckovw53z0w] {
    opacity: 0.6;
}

.row-inactive:hover[b-ckovw53z0w] {
    opacity: 0.8;
}

/* Badges */
.status-badge[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.status-badge.active[b-ckovw53z0w] {
    background: var(--success-subtle);
    color: var(--success);
}

.status-badge.inactive[b-ckovw53z0w] {
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.status-badge.warning[b-ckovw53z0w] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.role-badge[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.role-badge.user[b-ckovw53z0w] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.role-badge.tenantadmin[b-ckovw53z0w] {
    background: var(--warning-subtle);
    color: var(--warning);
}

.role-badge.systemadmin[b-ckovw53z0w] {
    background: var(--error-subtle);
    color: var(--error);
}

.tier-badge[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

.tier-badge.basic[b-ckovw53z0w] {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

.tier-badge.professional[b-ckovw53z0w] {
    background: var(--accent-subtle);
    color: var(--accent-primary);
}

.tier-badge.enterprise[b-ckovw53z0w] {
    background: var(--warning-subtle);
    color: var(--warning);
}

/* Actions */
.actions[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

/* Buttons */
.btn-primary[b-ckovw53z0w] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--accent-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-primary:hover:not(:disabled)[b-ckovw53z0w] {
    background: var(--accent-hover);
}

.btn-primary:active:not(:disabled)[b-ckovw53z0w] {
    transform: scale(0.98);
}

.btn-primary:disabled[b-ckovw53z0w] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-secondary[b-ckovw53z0w] {
    height: 32px;
    padding: 0 var(--space-4);
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.btn-secondary:hover:not(:disabled)[b-ckovw53z0w] {
    background: var(--bg-tertiary);
    border-color: var(--border-secondary);
}

.btn-secondary:disabled[b-ckovw53z0w] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-small[b-ckovw53z0w] {
    height: 24px;
    padding: 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    border: 1px solid var(--border-primary);
    background: var(--bg-primary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    color: var(--text-secondary);
    transition: all var(--duration-fast) var(--ease-out);
    white-space: nowrap;
}

.btn-small:hover[b-ckovw53z0w] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-secondary);
}

.btn-small.btn-danger[b-ckovw53z0w] {
    color: var(--error);
    border-color: var(--error);
}

.btn-small.btn-danger:hover[b-ckovw53z0w] {
    background: var(--error-subtle);
}

.btn-spinner[b-ckovw53z0w] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-ckovw53z0w 0.6s linear infinite;
}

@keyframes spin-b-ckovw53z0w {
    to { transform: rotate(360deg); }
}

/* Organisation Info Bar */
.org-info-bar[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-6);
    padding: var(--space-4) var(--space-5);
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-5);
}

.info-item[b-ckovw53z0w] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.info-label[b-ckovw53z0w] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
}

.info-value[b-ckovw53z0w] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    font-weight: var(--font-medium);
}

/* Organisation Cards */
.org-cards[b-ckovw53z0w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-5);
}

.org-card[b-ckovw53z0w] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
}

.org-card h3[b-ckovw53z0w] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--border-light);
}

.card-footer[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

/* Connection Status */
.connection-status[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
}

.connection-status.connected[b-ckovw53z0w] {
    background: var(--success-subtle);
    color: var(--success);
}

.connection-status.failed[b-ckovw53z0w] {
    background: var(--error-subtle);
    color: var(--error);
}

/* Modal */
.modal-overlay[b-ckovw53z0w] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: var(--space-4);
}

.modal-content[b-ckovw53z0w] {
    background: var(--bg-elevated);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--border-light);
    max-width: 480px;
    width: 100%;
    max-height: calc(100vh - var(--space-8));
    overflow-y: auto;
}

.modal-content.modal-wide[b-ckovw53z0w] {
    max-width: 640px;
}

/* Bulk Import */
.bulk-import-example[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-bottom: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-tertiary);
    border-radius: var(--radius-md);
}

.bulk-import-example pre[b-ckovw53z0w] {
    margin: var(--space-2) 0 var(--space-2);
    font-size: 0.75rem;
    color: var(--text-secondary);
    white-space: pre-wrap;
}

.bulk-import-legend[b-ckovw53z0w] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    border-top: 1px solid var(--border-light);
    padding-top: var(--space-2);
}

.bulk-import-legend code[b-ckovw53z0w] {
    background: var(--bg-secondary);
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.7rem;
}

.bulk-import-textarea[b-ckovw53z0w] {
    width: 100%;
    min-height: 200px;
    resize: vertical;
    font-family: var(--font-mono, monospace);
    font-size: 0.8rem;
    line-height: 1.6;
}

.modal-header[b-ckovw53z0w] {
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-light);
}

.modal-header h3[b-ckovw53z0w] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.modal-body[b-ckovw53z0w] {
    padding: var(--space-5);
}

.modal-description[b-ckovw53z0w] {
    margin: 0 0 var(--space-4) 0;
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.modal-hint[b-ckovw53z0w] {
    margin: 0 0 var(--space-4) 0;
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.modal-footer[b-ckovw53z0w] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-light);
    background: var(--bg-secondary);
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
}

/* Endpoint Access Modal */
.endpoint-access-modal[b-ckovw53z0w] {
    max-width: 600px;
}

.endpoint-access-toolbar[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    align-items: center;
}

.endpoint-access-toolbar .form-input[b-ckovw53z0w] {
    flex: 1;
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-3);
}

.endpoint-access-list[b-ckovw53z0w] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
}

.ea-group[b-ckovw53z0w] {
    border-bottom: 1px solid var(--border-light);
}

.ea-group:last-child[b-ckovw53z0w] {
    border-bottom: none;
}

.ea-group-header[b-ckovw53z0w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    position: sticky;
    top: 0;
    z-index: 1;
}

.ea-group-name[b-ckovw53z0w] {
    color: var(--text-primary);
}

.ea-group-count[b-ckovw53z0w] {
    color: var(--text-tertiary);
    font-weight: var(--font-normal);
    font-size: var(--text-xs);
}

.ea-item[b-ckovw53z0w] {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: var(--space-2) var(--space-3);
    border-top: 1px solid var(--border-light);
    transition: background var(--duration-fast) var(--ease-out);
}

.ea-item:hover[b-ckovw53z0w] {
    background: var(--bg-secondary);
}

.ea-item.disabled[b-ckovw53z0w] {
    opacity: 0.5;
}

.ea-toggle-label[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    min-width: 0;
}

.ea-toggle-label input[type="checkbox"][b-ckovw53z0w] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent-primary);
    flex-shrink: 0;
    cursor: pointer;
}

.ea-write-indicator[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: var(--radius-sm);
    background: #fef3c7;
    color: #b45309;
    font-size: 9px;
    font-weight: 700;
    font-family: var(--font-mono);
    flex-shrink: 0;
}

.ea-path[b-ckovw53z0w] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ea-display-name[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding-left: calc(16px + var(--space-2) + 40px + var(--space-2));
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.method-badge[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 18px;
    padding: 0 var(--space-1);
    border-radius: var(--radius-sm);
    font-size: 9px;
    font-weight: 700;
    font-family: var(--font-mono);
    text-transform: uppercase;
    flex-shrink: 0;
}

.method-badge.get[b-ckovw53z0w] { background: #dbeafe; color: #1d4ed8; }
.method-badge.post[b-ckovw53z0w] { background: #dcfce7; color: #15803d; }
.method-badge.put[b-ckovw53z0w] { background: #fef3c7; color: #b45309; }
.method-badge.delete[b-ckovw53z0w] { background: #fce4ec; color: #c62828; }
.method-badge.patch[b-ckovw53z0w] { background: #f3e5f5; color: #7b1fa2; }

/* Forms */
.form-group[b-ckovw53z0w] {
    margin-bottom: var(--space-4);
}

.form-group label[b-ckovw53z0w] {
    display: block;
    margin-bottom: var(--space-1);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.form-row[b-ckovw53z0w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.form-input[b-ckovw53z0w] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    box-sizing: border-box;
}

.form-input:focus[b-ckovw53z0w] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-select[b-ckovw53z0w] {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    background: var(--bg-primary);
    color: var(--text-primary);
    box-sizing: border-box;
}

.form-select:focus[b-ckovw53z0w] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.form-hint[b-ckovw53z0w] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.form-error[b-ckovw53z0w] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    color: var(--error);
}

.form-checkbox[b-ckovw53z0w] {
    display: flex;
    align-items: center;
}

.form-checkbox label[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    margin-bottom: 0;
}

.form-checkbox input[type="checkbox"][b-ckovw53z0w] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent-primary);
}

/* Color Input */
.color-input-wrapper[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

.form-color[b-ckovw53z0w] {
    width: 40px;
    height: 34px;
    padding: 2px;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    background: var(--bg-primary);
}

.form-color[b-ckovw53z0w]::-webkit-color-swatch-wrapper {
    padding: 0;
}

.form-color[b-ckovw53z0w]::-webkit-color-swatch {
    border: none;
    border-radius: var(--radius-sm);
}

/* Sophia Prompts */
.prompts-intro[b-ckovw53z0w] {
    margin-bottom: var(--space-5);
}

.prompts-intro p[b-ckovw53z0w] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: 0 0 var(--space-2) 0;
    line-height: 1.6;
}

.prompts-hint-list[b-ckovw53z0w] {
    list-style: none;
    padding: 0;
    margin: var(--space-2) 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.prompts-hint-list li[b-ckovw53z0w] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    padding: var(--space-2) var(--space-3);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    border-left: 3px solid var(--accent-primary);
    line-height: 1.5;
}

.prompt-card[b-ckovw53z0w] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    overflow: hidden;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.prompt-card.has-override[b-ckovw53z0w] {
    border-color: var(--accent-primary);
    border-left: 3px solid var(--accent-primary);
}

.prompt-card-header[b-ckovw53z0w] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: var(--space-4) var(--space-5);
    gap: var(--space-3);
}

.prompt-card-title h3[b-ckovw53z0w] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.prompt-summary[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.prompt-card-badges[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-2);
    flex-shrink: 0;
}

.stale-warning[b-ckovw53z0w] {
    padding: var(--space-3) var(--space-5);
    background: var(--warning-subtle);
    color: var(--warning);
    font-size: var(--text-xs);
    line-height: 1.5;
    border-top: 1px solid var(--border-light);
}

.prompt-card-toggle[b-ckovw53z0w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-5);
    border-top: 1px solid var(--border-light);
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    transition: all var(--duration-fast) var(--ease-out);
}

.prompt-card-toggle:hover[b-ckovw53z0w] {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.expand-icon[b-ckovw53z0w] {
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    color: var(--text-muted);
}

.prompt-card-body[b-ckovw53z0w] {
    border-top: 1px solid var(--border-light);
    padding: var(--space-5);
}

.prompt-editor[b-ckovw53z0w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.editor-label[b-ckovw53z0w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
    margin-bottom: var(--space-2);
}

.prompt-version[b-ckovw53z0w] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    font-weight: var(--font-normal);
    text-transform: none;
    letter-spacing: normal;
}

.prompt-content-preview[b-ckovw53z0w] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    font-size: var(--text-xs);
    font-family: var(--font-mono);
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-wrap: break-word;
    max-height: 400px;
    overflow-y: auto;
    line-height: 1.6;
}

.prompt-textarea[b-ckovw53z0w] {
    width: 100%;
    min-height: 300px;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-family: var(--font-mono);
    background: var(--bg-primary);
    color: var(--text-primary);
    resize: vertical;
    line-height: 1.6;
    box-sizing: border-box;
}

.prompt-textarea:focus[b-ckovw53z0w] {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-subtle);
}

.prompt-content-view[b-ckovw53z0w] {
    margin-bottom: var(--space-4);
}

.master-reference[b-ckovw53z0w] {
    margin-bottom: var(--space-4);
}

.master-reference summary[b-ckovw53z0w] {
    cursor: pointer;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding: var(--space-2) 0;
    user-select: none;
}

.master-reference summary:hover[b-ckovw53z0w] {
    color: var(--text-primary);
}

.master-reference .prompt-content-preview[b-ckovw53z0w] {
    margin-top: var(--space-2);
}

.prompt-card-actions[b-ckovw53z0w] {
    display: flex;
    gap: var(--space-3);
    align-items: center;
}

/* Utility */
.optional-tag[b-ckovw53z0w] {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    background: var(--bg-tertiary);
    color: var(--text-muted);
}

.text-muted[b-ckovw53z0w] {
    color: var(--text-tertiary, #64748b);
}

.text-center[b-ckovw53z0w] {
    text-align: center;
}

.text-mono[b-ckovw53z0w] {
    font-family: var(--font-mono, monospace);
}

/* Spending Limits */
.spend-cell[b-ckovw53z0w] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.progress-bar-mini[b-ckovw53z0w] {
    width: 100%;
    height: 4px;
    background: var(--bg-secondary, #1a1a2e);
    border-radius: 2px;
    overflow: hidden;
}

.progress-bar-fill[b-ckovw53z0w] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.progress-green[b-ckovw53z0w] {
    background: var(--color-success, #10b981);
}

.progress-yellow[b-ckovw53z0w] {
    background: var(--color-warning, #f59e0b);
}

.progress-red[b-ckovw53z0w] {
    background: var(--color-error, #ef4444);
}

[b-ckovw53z0w] .status-badge.warning {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
}

/* Mobile */
@media (max-width: 768px) {
    .section-header[b-ckovw53z0w] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }

    .org-info-bar[b-ckovw53z0w] {
        flex-wrap: wrap;
        gap: var(--space-4);
    }

    .org-cards[b-ckovw53z0w] {
        grid-template-columns: 1fr;
    }

    .actions[b-ckovw53z0w] {
        flex-direction: column;
        gap: var(--space-1);
    }

    .btn-small[b-ckovw53z0w] {
        width: 100%;
    }

    .form-row[b-ckovw53z0w] {
        grid-template-columns: 1fr;
    }

    .card-footer[b-ckovw53z0w] {
        flex-wrap: wrap;
    }

    .prompt-editor[b-ckovw53z0w] {
        grid-template-columns: 1fr;
    }

    .prompt-card-header[b-ckovw53z0w] {
        flex-direction: column;
    }
}
/* /Pages/Terms.razor.rz.scp.css */
/* ============================================
   Legal Pages — Shared Design System
   Brand palette from landing: navy → teal → cyan
   ============================================ */

.legal-page[b-m12usxhv5u] {
    --ln-navy: #0a1628;
    --ln-navy-mid: #0f1f3a;
    --ln-ocean: #1a5276;
    --ln-teal: #17a2b8;
    --ln-cyan: #00d4ff;
    --ln-white: #ffffff;
    --ln-off-white: #f0f4f8;
    --ln-gray: #8a9bb5;
    --ln-gray-dark: #4a5e7a;
    --ln-text-dark: #1a202c;
    --ln-text-body: #4a5568;
    --ln-section-light: #f7fafc;
    --ln-card-border: #e2e8f0;

    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--ln-text-dark);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--ln-section-light);
}

.legal-container[b-m12usxhv5u] {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* Navigation */
.legal-nav[b-m12usxhv5u] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(10, 22, 40, 0.95);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.nav-row[b-m12usxhv5u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
}

.legal-brand[b-m12usxhv5u] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.legal-logo[b-m12usxhv5u] {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.legal-wordmark[b-m12usxhv5u] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--ln-white);
    letter-spacing: -0.02em;
}

.back-link[b-m12usxhv5u] {
    color: var(--ln-gray);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: color 0.15s;
}

.back-link:hover[b-m12usxhv5u] {
    color: var(--ln-white);
}

/* Content */
.legal-content[b-m12usxhv5u] {
    flex: 1;
    padding-top: 3rem;
    padding-bottom: 4rem;
}

.legal-content h1[b-m12usxhv5u] {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 0.5rem;
    color: var(--ln-text-dark);
}

.effective-date[b-m12usxhv5u] {
    font-size: 0.875rem;
    color: var(--ln-gray);
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--ln-card-border);
}

.legal-content section[b-m12usxhv5u] {
    margin-bottom: 2rem;
}

.legal-content h2[b-m12usxhv5u] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--ln-text-dark);
    margin-bottom: 0.75rem;
    margin-top: 0;
}

.legal-content h3[b-m12usxhv5u] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--ln-text-dark);
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

.legal-content p[b-m12usxhv5u] {
    font-size: 0.9375rem;
    color: var(--ln-text-body);
    line-height: 1.7;
    margin-bottom: 0.75rem;
}

.legal-content ul[b-m12usxhv5u] {
    padding-left: 1.5rem;
    margin-bottom: 0.75rem;
}

.legal-content li[b-m12usxhv5u] {
    font-size: 0.9375rem;
    color: var(--ln-text-body);
    line-height: 1.7;
    margin-bottom: 0.375rem;
}

.legal-content a[b-m12usxhv5u] {
    color: var(--ln-teal);
    text-decoration: none;
    transition: color 0.15s;
}

.legal-content a:hover[b-m12usxhv5u] {
    color: var(--ln-ocean);
    text-decoration: underline;
}

/* Footer */
.legal-footer[b-m12usxhv5u] {
    background: var(--ln-navy);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 1.25rem 0;
    font-size: 0.75rem;
    color: var(--ln-gray-dark);
    text-align: center;
}

/* Responsive */
@media (max-width: 768px) {
    .legal-content[b-m12usxhv5u] {
        padding-top: 2rem;
        padding-bottom: 3rem;
    }

    .legal-content h1[b-m12usxhv5u] {
        font-size: 1.5rem;
    }
}
/* /Pages/Usage.razor.rz.scp.css */
/* Usage Dashboard */

.usage-page[b-egyrlwka1k] {
    padding: var(--space-6) var(--space-8);
    max-width: 1400px;
    margin: 0 auto;
}

/* ─── Header ─── */
.page-header[b-egyrlwka1k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-8);
}

.page-header h1[b-egyrlwka1k] {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0;
    letter-spacing: var(--tracking-tight);
}

.subtitle[b-egyrlwka1k] {
    color: var(--text-tertiary);
    font-size: var(--text-sm);
    margin: var(--space-1) 0 0 0;
}

/* ─── Period Toggle (segmented control) ─── */
.period-toggle[b-egyrlwka1k] {
    display: flex;
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: 3px;
    gap: 2px;
}

.toggle-btn[b-egyrlwka1k] {
    padding: var(--space-2) var(--space-4);
    background: transparent;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    cursor: pointer;
    transition: all 150ms ease;
    white-space: nowrap;
}

.toggle-btn:hover[b-egyrlwka1k] {
    color: var(--text-primary);
}

.toggle-btn.active[b-egyrlwka1k] {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

/* ─── Error Banner ─── */
.error-banner[b-egyrlwka1k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) var(--space-4);
    background: var(--error-subtle);
    color: var(--error);
    border: 1px solid var(--error);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-6);
    font-size: var(--text-sm);
}

.dismiss-btn[b-egyrlwka1k] {
    background: none;
    border: none;
    color: inherit;
    font-size: var(--text-lg);
    cursor: pointer;
    padding: var(--space-1);
    line-height: 1;
    opacity: 0.7;
}

.dismiss-btn:hover[b-egyrlwka1k] {
    opacity: 1;
}

/* ─── Loading ─── */
.loading-state[b-egyrlwka1k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16);
    color: var(--text-tertiary);
    gap: var(--space-4);
}

.spinner[b-egyrlwka1k] {
    width: 36px;
    height: 36px;
    border: 3px solid var(--border-primary);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-egyrlwka1k 0.75s linear infinite;
}

@keyframes spin-b-egyrlwka1k {
    to { transform: rotate(360deg); }
}

/* ─── Metric Cards ─── */
.metrics-grid[b-egyrlwka1k] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.metrics-grid-4[b-egyrlwka1k] {
    grid-template-columns: repeat(4, 1fr);
}

.metric-card[b-egyrlwka1k] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    transition: border-color 150ms ease;
}

.metric-card:hover[b-egyrlwka1k] {
    border-color: var(--border-secondary, var(--border-primary));
}

.metric-label[b-egyrlwka1k] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.metric-value[b-egyrlwka1k] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: var(--tracking-tight);
    font-variant-numeric: tabular-nums;
}

.metric-value.cost[b-egyrlwka1k] {
    color: var(--accent-primary);
}

/* ─── Cards (shared) ─── */
.card[b-egyrlwka1k] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-6);
    overflow: hidden;
}

.card-header[b-egyrlwka1k] {
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border-primary);
}

.card-header h2[b-egyrlwka1k] {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

.card-body[b-egyrlwka1k] {
    padding: var(--space-5);
}

.card-body.no-pad[b-egyrlwka1k] {
    padding: 0;
}

/* ─── Chart Card ─── */
.chart-card .card-body[b-egyrlwka1k] {
    padding: var(--space-3) var(--space-4) var(--space-2);
}

/* ─── Data Tables ─── */
.data-table[b-egyrlwka1k] {
    width: 100%;
    border-collapse: collapse;
}

.data-table th[b-egyrlwka1k] {
    padding: var(--space-3) var(--space-5);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    background: var(--bg-tertiary);
    border-bottom: 2px solid var(--border-primary);
}

.data-table td[b-egyrlwka1k] {
    padding: var(--space-3) var(--space-5);
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-primary);
    font-variant-numeric: tabular-nums;
}

.data-table tbody tr:last-child td[b-egyrlwka1k] {
    border-bottom: none;
}

.data-table tbody tr:nth-child(even) td[b-egyrlwka1k] {
    background: color-mix(in srgb, var(--bg-tertiary) 30%, transparent);
}

.data-table tbody tr:hover td[b-egyrlwka1k] {
    background: var(--bg-tertiary);
}

/* Column alignment */
.col-left[b-egyrlwka1k] {
    text-align: left;
}

.col-right[b-egyrlwka1k] {
    text-align: right;
}

.col-center[b-egyrlwka1k] {
    text-align: center;
}

/* Cell variations */
.cell-name[b-egyrlwka1k] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.cell-cost[b-egyrlwka1k] {
    font-weight: var(--font-medium);
    color: var(--accent-primary);
}

.cell-email[b-egyrlwka1k] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

/* ─── User Cell (avatar + info) ─── */
.user-cell[b-egyrlwka1k] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.avatar[b-egyrlwka1k] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    background: var(--accent-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    flex-shrink: 0;
    text-transform: uppercase;
}

.user-info[b-egyrlwka1k] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

/* ─── Badges ─── */
.badge[b-egyrlwka1k] {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    border-radius: var(--radius-full);
    letter-spacing: 0.02em;
}

.badge-ok[b-egyrlwka1k] {
    background: var(--success-subtle);
    color: var(--success);
}

.badge-danger[b-egyrlwka1k] {
    background: var(--error-subtle);
    color: var(--error);
}

/* ─── Section Dividers ─── */
.section-divider[b-egyrlwka1k] {
    height: 1px;
    background: var(--border-primary);
    margin: var(--space-10) 0;
}

.section-header-row[b-egyrlwka1k] {
    margin-bottom: var(--space-6);
}

.section-title[b-egyrlwka1k] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0;
    letter-spacing: var(--tracking-tight);
}

/* ─── Budget Card ─── */
.budget-card[b-egyrlwka1k] {
    padding: var(--space-5);
}

.budget-row[b-egyrlwka1k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: var(--space-3);
}

.budget-left[b-egyrlwka1k] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.budget-label[b-egyrlwka1k] {
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

.budget-amount[b-egyrlwka1k] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

.budget-of[b-egyrlwka1k] {
    font-weight: var(--font-normal, 400);
    color: var(--text-tertiary);
    font-size: var(--text-sm);
}

.budget-remaining[b-egyrlwka1k] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.budget-track[b-egyrlwka1k] {
    height: 6px;
    background: var(--bg-tertiary);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.budget-fill[b-egyrlwka1k] {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.4s ease;
}

.budget-fill.ok[b-egyrlwka1k] { background: var(--success); }
.budget-fill.warning[b-egyrlwka1k] { background: var(--warning); }
.budget-fill.over[b-egyrlwka1k] { background: var(--error); }

/* ─── Responsive ─── */
@media (max-width: 1200px) {
    .metrics-grid[b-egyrlwka1k] {
        grid-template-columns: repeat(3, 1fr);
    }

    .metrics-grid-4[b-egyrlwka1k] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .usage-page[b-egyrlwka1k] {
        padding: var(--space-4);
    }

    .page-header[b-egyrlwka1k] {
        flex-direction: column;
        gap: var(--space-4);
    }

    .metrics-grid[b-egyrlwka1k],
    .metrics-grid-4[b-egyrlwka1k] {
        grid-template-columns: repeat(2, 1fr);
    }

    .period-toggle[b-egyrlwka1k] {
        align-self: stretch;
    }

    .toggle-btn[b-egyrlwka1k] {
        flex: 1;
        text-align: center;
    }

    .data-table th[b-egyrlwka1k],
    .data-table td[b-egyrlwka1k] {
        padding: var(--space-2) var(--space-3);
    }

    .card[b-egyrlwka1k] {
        overflow-x: auto;
    }
}

@media (max-width: 480px) {
    .metrics-grid[b-egyrlwka1k],
    .metrics-grid-4[b-egyrlwka1k] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/VerifyEmail.razor.rz.scp.css */
.verify-page[b-zbd0u9tt78] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: var(--space-4);
}

.verify-container[b-zbd0u9tt78] {
    width: 100%;
    max-width: 400px;
}

.verify-card[b-zbd0u9tt78] {
    background: var(--bg-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    box-shadow: var(--shadow-lg);
}

.verify-header[b-zbd0u9tt78] {
    text-align: center;
    margin-bottom: var(--space-6);
}

.logo[b-zbd0u9tt78] {
    display: flex;
    justify-content: center;
}

.logo-image[b-zbd0u9tt78] {
    width: 200px;
    height: auto;
}

.verify-state[b-zbd0u9tt78] {
    text-align: center;
    padding: var(--space-4) 0;
}

.verify-state h2[b-zbd0u9tt78] {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: var(--space-4) 0 var(--space-2);
}

.verify-state p[b-zbd0u9tt78] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.6;
}

.spinner[b-zbd0u9tt78] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border-primary);
    border-top-color: var(--accent-primary);
    border-radius: 50%;
    animation: spin-b-zbd0u9tt78 0.6s linear infinite;
    margin: 0 auto var(--space-4);
}

@keyframes spin-b-zbd0u9tt78 {
    to { transform: rotate(360deg); }
}

.login-btn[b-zbd0u9tt78] {
    display: inline-block;
    margin-top: var(--space-4);
    padding: var(--space-2) var(--space-6);
    background: var(--accent-primary);
    color: white;
    border-radius: var(--radius-lg);
    text-decoration: none;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
}

.login-btn.secondary[b-zbd0u9tt78] {
    background: var(--bg-secondary);
    color: var(--text-secondary);
    border: 1px solid var(--border-primary);
}
