/* =========================================================
   PAROCHOS VCR – Radzen overrides
   (global, not scoped — applies to all Radzen elements)
   ========================================================= */

/* ── Buttons: no uppercase ── */
.rz-button {
    text-transform: none !important;
}

/* ── Header: force white background ─────────────────────────
   MainLayout_razor.css is SCOPED (Blazor CSS isolation),
   so its .rz-header rules don't reach the Radzen component.
   We override here (global) with higher specificity.
   ────────────────────────────────────────────────────────── */
.rz-layout > .rz-header,
.rz-header {
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: #1a1a2e !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important;
}

    /* Icon buttons inside header */
    .rz-header .rz-button,
    .rz-header .rz-sidebar-toggle {
        color: rgba(0, 0, 0, 0.6) !important;
        background: transparent !important;
        box-shadow: none !important;
    }

        .rz-header .rz-button:hover,
        .rz-header .rz-sidebar-toggle:hover {
            background: rgba(0, 0, 0, 0.05) !important;
            color: rgba(0, 0, 0, 0.85) !important;
        }

    /* Page title text in header */
    .rz-header .rz-text {
        color: #1a1a2e !important;
    }

/* ── Sidebar ──────────────────────────────────────────────── */
.rz-sidebar {
    border-right: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* ── Dialog ───────────────────────────────────────────────── */
.rz-dialog-wrapper .rz-dialog {
    border-radius: 12px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15) !important;
}

.rz-dialog-wrapper .rz-dialog-title {
    font-weight: 600 !important;
    font-size: 1rem !important;
    color: #1a1a2e !important;
}

/* ── DataGrid ─────────────────────────────────────────────── */
.rz-data-grid .rz-grid-table th {
    font-weight: 600 !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.02em !important;
    color: rgba(0, 0, 0, 0.55) !important;
    background: var(--rz-base-50, #fafafa) !important;
}

/* ── Badges / Status chips ─────────────────────────────────── */
.rz-badge {
    border-radius: 20px !important;
    font-weight: 500 !important;
}

/* ── Notifications ─────────────────────────────────────────── */
.rz-notification {
    border-radius: 10px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}

/* ── Form Fields ────────────────────────────────────────────── */
.rz-form-field .rz-textbox,
.rz-form-field .rz-numeric,
.rz-form-field .rz-textarea,
.rz-form-field .rz-dropdown {
    border-radius: 8px !important;
}

/* ── Dialog section cards ───────────────────────────────────── */
/*
   --rz-grid-cell-border in Radzen themes resolves to a COLOR value,
   not a full border shorthand. We redefine it as a full shorthand so
   that `border: var(--rz-grid-cell-border)` inside dialog sections works.
*/
:root {
    --rz-grid-cell-border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Utility class for dialog section cards (alternative to inline style) */
.dlg-section {
    padding: 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: var(--rz-border-radius, 8px);
}

/* ── Panel Menu (Sidebar nav) ───────────────────────────────── */
.rz-panel-menu .rz-navigation-item-text {
    font-size: 0.875rem !important;
    font-weight: 500 !important;
}

.rz-panel-menu .rz-navigation-item.selected > .rz-navigation-item-content,
.rz-panel-menu .rz-navigation-item.active > .rz-navigation-item-content {
    border-radius: 8px !important;
}


/* ── Stat card warning border (pending invitations) ── */
.stat-card--warn-border {
    border-color: var(--rz-warning) !important;
}