/*
 * PolarVariation1 — dashboard-style split: dark left rail (nav) vs light workspace.
 * Inspired by “EMERGE”-style UIs: charcoal sidebar, teal + blue accents, light content.
 */

:root {
    --pp-bg: #eef1f4;
    --pp-surface: #ffffff;
    --pp-border: #e2e8ee;
    --pp-muted: #6c7a89;
    --pp-text: #1a2530;
    --pp-primary: #1abc9c;
    --pp-primary-soft: #e8f8f5;
    --pp-danger: #d64545;
}

html,
body {
    background: #eef1f4 !important;
    color: #1a2530 !important;
}

.v2-app {
    --v2-bg: #eef1f4;
    --v2-surface: #ffffff;
    --v2-border: #e2e8ee;
    --v2-text: #1a2530;
    --v2-muted: #6c7a89;
    --v2-primary: #1abc9c;
    --v2-primary-soft: #e8f8f5;
    --v2-danger: #d64545;
    --pv1-sidebar: #2c3e50;
    --pv1-sidebar-border: rgba(255, 255, 255, 0.08);
    --pv1-sidebar-text: rgba(255, 255, 255, 0.82);
    --pv1-sidebar-dim: rgba(255, 255, 255, 0.52);
    --pv1-sidebar-hover: rgba(255, 255, 255, 0.07);
    --pv1-accent-blue: #5dade2;
    --v2-dash-chart-1: #0e6655;
    --v2-dash-chart-2: #1abc9c;
    --v2-dash-chart-3: #5dade2;
    --v2-dash-chart-4: #2874a6;
    --v2-dash-chart-5: #b9770e;
    --v2-dash-chart-6: #d68910;
    --v2-dash-chart-7: #b03a2e;
    --v2-dash-chart-8: #148f77;
    --v2-dash-chart-9: #5d6d7e;
    --v2-dash-chart-10: #7fb3d5;
    --v2-dash-chart-11: #1a5276;
    --v2-dash-chart-12: #af7ac5;
}

/* ---- Dark sidebar + footer (nav only) ---- */
.v2-app .v2-sidebar {
    background: var(--pv1-sidebar) !important;
    border-right: 1px solid var(--pv1-sidebar-border) !important;
    box-shadow: 4px 0 18px rgba(0, 0, 0, 0.06);
}

.v2-app .v2-sidebar .v2-brand {
    border-bottom: 1px solid var(--pv1-sidebar-border);
    margin-bottom: 12px;
    padding-bottom: 12px;
    color: #ffffff !important;
}

/* Bootstrap .text-body on brand link would otherwise force dark text */
.v2-app .v2-sidebar a.v2-brand.text-body {
    color: #ffffff !important;
}

.v2-app .v2-sidebar .v2-brand-title {
    color: #ffffff !important;
}

.v2-app .v2-sidebar .v2-brand-subtitle,
.v2-app .v2-sidebar .v2-muted {
    color: var(--pv1-sidebar-dim) !important;
}

.v2-app .v2-sidebar .v2-brand-icon {
    background: rgba(26, 188, 156, 0.22) !important;
    color: #48e5c9 !important;
}

.v2-app .v2-sidebar .v2-brand-icon.v2-brand-icon--image {
    background: transparent !important;
    color: inherit !important;
}

/* Sidebar + footer nav links (not main content) */
.v2-app .v2-sidebar .v2-link,
.v2-app .v2-side-footer .v2-link {
    color: var(--pv1-sidebar-text) !important;
}

.v2-app .v2-sidebar .v2-link:hover,
.v2-app .v2-side-footer .v2-link:hover {
    background: var(--pv1-sidebar-hover) !important;
    color: #ffffff !important;
}

.v2-app .v2-sidebar .v2-link.active,
.v2-app .v2-side-footer .v2-link.active {
    background: rgba(26, 188, 156, 0.2) !important;
    color: #7fe8d4 !important;
}

.v2-app .v2-sidebar .v2-link-trigger.open,
.v2-app .v2-side-footer .v2-link-trigger.open {
    background: rgba(93, 173, 226, 0.12) !important;
    color: var(--pv1-accent-blue) !important;
}

.v2-app .v2-sidebar .v2-nav .v2-link-trigger .v2-link-arrow,
.v2-app .v2-side-footer .v2-link-trigger .v2-link-arrow {
    color: var(--pv1-sidebar-dim) !important;
    opacity: 1 !important;
}

.v2-app .v2-side-footer {
    border-top: 1px solid var(--pv1-sidebar-border) !important;
}

.v2-app .v2-side-footer .v2-settings-title {
    color: var(--pv1-sidebar-dim) !important;
}

/* ---- Light main column ---- */
.v2-app .v2-main {
    background: var(--v2-bg);
}

.v2-app .v2-topbar {
    background: #ffffff !important;
    border-bottom: 1px solid var(--v2-border) !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
}

.v2-app .v2-top-right {
    color: #334257 !important;
}

.v2-app .v2-admin-chip {
    color: #1e6b4a !important;
    background: #e8f8f0 !important;
    border-color: #c5ebd9 !important;
}

.v2-app .v2-content {
    background: var(--v2-bg);
}

.v2-app .v2-card {
    background: var(--v2-surface) !important;
    border-color: var(--v2-border) !important;
    box-shadow: 0 2px 12px rgba(15, 35, 56, 0.05);
}

/* Primary actions: teal */
.v2-app .v2-btn-primary {
    background: #16a085 !important;
    border-color: #1abc9c !important;
}

.v2-app .v2-btn-primary:hover {
    background: #149174 !important;
    border-color: #17b897 !important;
}

/* Flyouts stay light (float over workspace) */
.v2-viewport .v2-nav-flyout,
.v2-app .v2-nav-flyout {
    background: #ffffff !important;
    border: 1px solid var(--v2-border) !important;
    box-shadow: 4px 12px 28px rgba(0, 0, 0, 0.1) !important;
}

.v2-viewport .v2-nav-flyout-link,
.v2-app .v2-nav-flyout-link {
    color: #2a394d !important;
}

.v2-viewport .v2-nav-flyout-link:hover,
.v2-app .v2-nav-flyout-link:hover {
    background: #f0f7fb !important;
    color: #162232 !important;
}

.v2-viewport .v2-nav-flyout-link.active,
.v2-app .v2-nav-flyout-link.active {
    background: var(--v2-primary-soft) !important;
    color: #0d806f !important;
}