/* ==========================================================================
   XORI ZO — App-Specific Styles
   Only styles that don't exist in shared app-core components.
   ========================================================================== */

/* ── Auth branding (logo area in .auth-card) ── */
.auth-card-logo {
    text-align: center;
    margin-bottom: var(--space-6);
}
.auth-card-logo svg {
    display: inline-block;
}
.auth-card-appname {
    font-size: 1.5rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
}
.auth-card .subtitle {
    text-align: center;
    color: var(--text-secondary);
    font-size: 0.875rem;
    margin-bottom: var(--space-4);
}
.auth-card .auth-link {
    text-align: center;
    margin-top: var(--space-4);
    font-size: 0.875rem;
    color: var(--text-secondary);
}
.auth-card .auth-link a {
    color: var(--primary);
    font-weight: 500;
}
.auth-card .auth-link a:hover {
    text-decoration: underline;
}

/* ── Dashboard stat cards + grid ──
   Now shared via app-core/dashboard.css.
   stat_card() UIComponent renders .dash-stat-card. */

/* ── Sidebar brand (no tenant logo in xorizo) ── */
.sidebar-brand-xz {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-4) var(--space-2);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text);
}
.sidebar-brand-xz svg { flex-shrink: 0; }

/* ── Sidebar user info ── */
.sidebar-user-info {
    padding: var(--space-2) var(--space-4) var(--space-4);
    border-bottom: 1px solid var(--border);
    margin-bottom: var(--space-2);
}
.sidebar-user-name {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: var(--space-2);
}
.super-badge {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    background: #fef3c7;
    color: #92400e;
    font-size: 0.6rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 999px;
    text-transform: uppercase;
}

/* ── Magic link banner ── */
.magic-link-banner {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-radius: var(--radius);
    padding: var(--space-4);
    margin-bottom: var(--space-6);
}
.magic-link-banner .banner-title {
    font-weight: 600;
    color: #065f46;
    margin-bottom: var(--space-2);
    display: flex;
    align-items: center;
    gap: var(--space-2);
}
.magic-link-banner .banner-hint {
    font-size: 0.8125rem;
    color: #065f46;
    margin-bottom: var(--space-2);
}
.magic-link-banner .copy-row {
    display: flex;
    gap: var(--space-2);
}
.magic-link-banner .copy-row input {
    flex: 1;
    padding: var(--space-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: 0.8125rem;
    font-family: monospace;
}

/* ── Responsive (dashboard responsive is in shared dashboard.css) ── */