/* =====================================================================
   InfinityMoney360 skin: clean, light, flat (style reference: wealthelite.in),
   in InfinityMoney360 colours. Loaded last, after styles.css and theme.css.
   ===================================================================== */
:root {
  --ink: #0B1220;
  --ink-2: #2B3445;
  --muted: #5B6575;
  --line: #E3E6EA;
  --line-soft: #EEF0F3;
  --bg: #F6F7F9;
  --navy: #0F2D5C;
  --blue: #123C82;
  --blue-dark: #0C2C63;
  --blue-soft: #EAF0FA;
  --leaf: #3C8D2F;
  --leaf-soft: #EAF5E6;
  --gold: #B8913A;
  --radius: 12px;
  --shadow-sm: 0 1px 2px rgba(11,18,32,.04);
  --shadow-md: 0 6px 18px rgba(11,18,32,.07);
}

body { background: var(--bg); background-image: none; color: var(--ink); }

/* ---------- Side menu: white, navy active pill ---------- */
.sidebar { background: #fff; border-right: 1px solid var(--line); box-shadow: 2px 0 12px rgba(11,18,32,.03); }
.sidebar .brand { border-bottom-color: var(--line-soft); }
.sidebar .brand-name { color: var(--navy); }
.sidebar .brand-name .brand-accent { color: var(--gold); }
.sidebar .brand-sub { color: var(--muted); }
.sidebar .brand-mark { box-shadow: 0 0 0 1px var(--line); }
.nav-section { color: #98A1B0; }
.nav-link { color: var(--ink-2); font-weight: 500; }
.nav-link:hover { background: var(--blue-soft); color: var(--navy); }
.nav-link.active { background: var(--navy); color: #fff; box-shadow: 0 6px 14px rgba(15,45,92,.22); }
.nav-link.active::before { display: none; }
.nav-link.active svg { color: #E2C273; }
.nav-foot { border-top-color: var(--line-soft); }
.sync-pill { background: var(--leaf-soft); color: #23571B; font-weight: 500; }
.collapse-btn { color: var(--muted); }

/* ---------- Top bar: white with soft drop shadow ---------- */
.appbar { background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid var(--line); box-shadow: 0 4px 10px rgba(11,18,32,.04); }
.switcher input { background: var(--bg); border-color: transparent; box-shadow: none; border-radius: 999px; }
.switcher input:focus { background: #fff; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(18,60,130,.12); }
.switcher kbd { background: #fff; }
.icon-btn, .profile-btn { border-color: var(--line); box-shadow: none; }
.icon-btn:hover, .profile-btn:hover { box-shadow: var(--shadow-md); }

/* ---------- Headings: heavy and dark ---------- */
.page-header h1 { font-weight: 800; color: var(--ink); font-size: 32px; letter-spacing: -.02em; }
.page-header .sub { color: var(--muted); font-size: 14px; }
.card h2, .report-section h3 { font-weight: 700; color: var(--ink); }

/* ---------- Cards: flat white, thin border ---------- */
.card { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.card:hover { box-shadow: var(--shadow-md); }
.kpi::after { display: none; }
.kpi { border-top: 3px solid var(--navy); }
.kpis > .kpi:nth-child(2) { border-top-color: var(--gold); }
.kpis > .kpi:nth-child(3) { border-top-color: var(--leaf); }
.kpis > .kpi:nth-child(5) { border-top-color: #B42318; }
.kpi .k { text-transform: uppercase; letter-spacing: .06em; font-size: 11.5px; font-weight: 700; color: var(--muted); }
.kpi .v { font-weight: 800; color: var(--ink); }
.sync-bar, .summary, .filters { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: none; }
.summary .k { text-transform: uppercase; letter-spacing: .05em; font-size: 11px; font-weight: 700; }
.table th { background: #F8F9FA; color: var(--muted); }
.table tbody tr:hover { background: #F5F8FD; }

/* ---------- Buttons: pills ---------- */
.btn { border-radius: 999px; padding: 0 20px; font-weight: 600; }
.btn-sm { padding: 0 14px; }
.btn-icon { padding: 0; border-radius: 12px; }
.btn-primary { background: var(--navy); border-color: var(--navy); }
.btn-primary:hover { background: var(--blue-dark); border-color: var(--blue-dark); }
.btn:not(.btn-primary):not(.btn-dark):not(.btn-icon) { border-color: var(--navy); color: var(--navy); }
.btn:not(.btn-primary):not(.btn-dark):not(.btn-icon):hover { background: var(--blue-soft); }
.pager .btn { border-color: var(--line); color: var(--ink-2); padding: 0 12px; }
.pager .btn[aria-current="page"] { background: var(--navy); border-color: var(--navy); color: #fff; }
.chip { border-color: var(--line); }
.chip[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); }
.input, .select { border-color: #D5DAE1; border-radius: 10px; }

/* ---------- Accent green for positive figures ---------- */
.gain { color: #2F7A24; }
.pill-success { background: var(--leaf-soft); color: #23571B; }
.flows .in { background: var(--navy); }
.c-equity { background: var(--navy); }
.r2 { background: var(--navy); }

/* ---------- Hero (investor): flat navy with gold rule ---------- */
.hero { background: var(--navy); animation: none; border-bottom: 4px solid var(--gold); }

/* ---------- Investor top bar ---------- */
.topbar { background: #fff; box-shadow: 0 4px 10px rgba(11,18,32,.04); }
.topnav a.active { background: var(--navy); color: #fff; }

/* ---------- Login ---------- */
.login-main { background: var(--bg); }
.login-card { border: 1px solid var(--line); box-shadow: var(--shadow-md); }
.segmented button[aria-selected="true"] { color: var(--navy); }

@media (max-width: 1023px) {
  .sidebar { box-shadow: 12px 0 32px rgba(11,18,32,.18); }
}

.c-hybrid { background: #7FA3D9; }
.c-gold { background: #D4A84B; }
