/* ===============================
   App Styling (neutral)
   =============================== */

.app-shell.mud-layout {
    min-height: 100vh;
}

/* tenant-aware background */
.app-shell.mud-layout,
.app-shell .mud-drawer-content,
.app-shell .mud-main-content {
    background-color: var(--rc-page-bg, #f4f6f8) !important;
}

/* page padding */
.app-shell .rc-page {
    padding: 24px !important;
    background-color: var(--rc-page-bg);
}
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: var(--rc-page-bg);
}

.rc-light {
    --rc-card-bg: #ffffff;
    --rc-value-bg: #f5f5f5;
    --rc-value-highlight-bg: #eef4ff;
    --rc-value-highlight-text: #1e3a8a;
    --rc-content-bg: transparent;
}

/* Dark */
.rc-dark {
    --rc-card-bg: #1e1e1e;
    --rc-value-bg: #2a2a2a;
    --rc-value-highlight-bg: #253a5e;
    --rc-value-highlight-text: #c7d6ff;
    --rc-content-bg: #121212;
    --rc-page-bg: #121212;
}

.app-shell.mud-layout {
    min-height: 100vh;
}

/* das ist der entscheidende Teil */
.app-shell .mud-main-content {
    min-height: calc(100vh - 64px); /* AppBar-Höhe (Default MudBlazor) */
    background-color: var(--rc-page-bg) !important;
}

/* optional: rc-page ebenfalls "strecken" */
.app-shell .rc-page {
    min-height: 100%;
    background-color: var(--rc-page-bg) !important;
}

.rc-page.rc-light {
    --rc-content-bg: transparent;
}

.rc-page.rc-dark {
    --rc-content-bg: #121212;
}


:root {
    --rc-page-bg: #f4f6f8;
}

.rc-dark {
    --rc-page-bg: #121212;
}

/* light drawer */
.rc-drawer.rc-light,
.rc-drawer.rc-light .mud-drawer-paper,
.rc-drawer.rc-light .mud-drawer-content {
    background-color: #ffffff !important;
}

/* dark drawer */
.rc-drawer.rc-dark,
.rc-drawer.rc-dark .mud-drawer-paper,
.rc-drawer.rc-dark .mud-drawer-content {
    background-color: #181818 !important;
}

.rc-darkmode-toggle {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px;
    flex-wrap: nowrap !important;
    white-space: nowrap;
}

.rc-darkmode-label {
    white-space: nowrap;
}


.tenant-default .mud-input-outlined:focus-within .mud-input-outlined-border,
.tenant-mcd .mud-input-outlined:focus-within .mud-input-outlined-border,
.tenant-x .mud-input-outlined:focus-within .mud-input-outlined-border {
    border-color: var(--rc-primary) !important;
}

@media (max-width: 600px) {
    .app-shell .rc-page {
        padding: 16px !important;
    }
}