/* GARUDA 10.2E — Dark Blue / White professional theme */
:root {
  --garuda-blue-950: #071629;
  --garuda-blue-900: #0b1f3a;
  --garuda-blue-850: #102b4e;
  --garuda-blue-800: #12375f;
  --garuda-blue-700: #174a7a;
  --garuda-blue-600: #1e63a7;
  --garuda-blue-500: #2e7fc2;
  --garuda-blue-100: #eaf3fb;
  --garuda-blue-050: #f4f7fb;
  --garuda-white: #ffffff;
  --garuda-ink: #152033;
  --garuda-muted: #5f6f85;
  --garuda-line: #dbe4ef;

  --b950: var(--garuda-blue-950) !important;
  --b900: var(--garuda-blue-900) !important;
  --b800: var(--garuda-blue-800) !important;
  --b700: var(--garuda-blue-600) !important;
  --b600: var(--garuda-blue-500) !important;
  --b100: var(--garuda-blue-100) !important;
  --ink: var(--garuda-ink) !important;
  --muted: var(--garuda-muted) !important;
  --line: var(--garuda-line) !important;
  --surface: var(--garuda-white) !important;
  --shadow: 0 18px 55px rgba(7, 22, 41, .12) !important;
}

html {
  color-scheme: light;
}

body {
  color: var(--garuda-ink) !important;
  background:
    radial-gradient(
      circle at 8% 8%,
      rgba(46, 127, 194, .14),
      transparent 30rem
    ),
    radial-gradient(
      circle at 92% 90%,
      rgba(30, 99, 167, .10),
      transparent 28rem
    ),
    var(--garuda-blue-050) !important;
}

body:has(.login-shell:not(.hidden)) {
  background:
    radial-gradient(
      circle at 8% 8%,
      rgba(46, 127, 194, .16),
      transparent 30rem
    ),
    radial-gradient(
      circle at 92% 90%,
      rgba(30, 99, 167, .11),
      transparent 28rem
    ),
    var(--garuda-blue-050) !important;
}

.login-shell {
  border-color: rgba(255, 255, 255, .92) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 25px 80px rgba(7, 22, 41, .14) !important;
}

.login-visual {
  background:
    linear-gradient(
      145deg,
      rgba(7, 22, 41, .99),
      rgba(18, 55, 95, .96)
    ) !important;
}

.brand-mark,
.avatar,
.primary-button {
  background:
    linear-gradient(
      135deg,
      var(--garuda-blue-700),
      var(--garuda-blue-500)
    ) !important;
  box-shadow: 0 14px 32px rgba(30, 99, 167, .24) !important;
}

.primary-button:hover {
  background:
    linear-gradient(
      135deg,
      var(--garuda-blue-600),
      var(--garuda-blue-500)
    ) !important;
}

.app-shell {
  background: var(--garuda-blue-050) !important;
}

.sidebar {
  background:
    radial-gradient(
      circle at 20% 0%,
      rgba(46, 127, 194, .28),
      transparent 20rem
    ),
    linear-gradient(
      180deg,
      var(--garuda-blue-950),
      var(--garuda-blue-900) 52%,
      var(--garuda-blue-850)
    ) !important;
  box-shadow: 12px 0 34px rgba(7, 22, 41, .14);
}

.sidebar-scroll {
  min-height: 0;
}

.nav {
  color: rgba(255, 255, 255, .76) !important;
}

.nav:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .09) !important;
}

.nav.active {
  color: #fff !important;
  background:
    linear-gradient(
      135deg,
      rgba(30, 99, 167, .98),
      rgba(77, 152, 209, .84)
    ) !important;
  box-shadow:
    inset 3px 0 0 #a7d6f5,
    0 12px 28px rgba(0, 0, 0, .16) !important;
}

.nav-group-title {
  color: rgba(255, 255, 255, .48) !important;
}

.sidebar-scope {
  background: rgba(255, 255, 255, .075) !important;
  border-color: rgba(255, 255, 255, .14) !important;
}

.workspace,
.content {
  background: var(--garuda-blue-050) !important;
}

.topbar {
  background: rgba(255, 255, 255, .94) !important;
  border-color: var(--garuda-line) !important;
}

.hero {
  background:
    radial-gradient(
      circle at 90% -20%,
      rgba(255, 255, 255, .24),
      transparent 18rem
    ),
    linear-gradient(
      135deg,
      var(--garuda-blue-950),
      var(--garuda-blue-700)
    ) !important;
  box-shadow: 0 20px 46px rgba(7, 22, 41, .20) !important;
}

.hero h2,
.hero .eyebrow {
  color: #fff !important;
}

.panel,
.metric-card,
.au-panel,
.om-panel,
.pm-panel,
.cm-panel,
.fm-panel,
.rf-panel,
.dp-panel,
.iv-panel,
.sc-panel {
  background: #fff !important;
  border-color: var(--garuda-line) !important;
  box-shadow: 0 12px 34px rgba(7, 22, 41, .075) !important;
}

.topbar h1,
.content h1,
.content h2,
.content h3,
.panel-head h3,
.panel h2,
.panel h3 {
  color: var(--garuda-blue-950) !important;
}

.eyebrow,
a,
.soft-button {
  color: var(--garuda-blue-600) !important;
}

.metric-icon,
.secure-pill {
  color: var(--garuda-blue-600) !important;
  background: var(--garuda-blue-100) !important;
}

.period.active,
.om-tab.active,
.pm-tab.active,
.iv-tab.active,
.sc-tab.active {
  color: var(--garuda-blue-700) !important;
}

input:focus,
select:focus,
textarea:focus,
button:focus-visible,
a:focus-visible {
  outline: 3px solid rgba(30, 99, 167, .20) !important;
  outline-offset: 2px;
  border-color: var(--garuda-blue-600) !important;
}

table thead,
.au-table thead,
.om-table thead,
.pm-table thead {
  background: var(--garuda-blue-100) !important;
  color: var(--garuda-blue-950) !important;
}

button[type="submit"]:not(.iv-danger):not(.danger),
.btn-primary,
.iv-primary,
.au-primary,
.om-apply,
.pm-primary,
.cm-primary,
.fm-primary,
.rf-primary,
.dp-primary,
.sc-primary {
  color: #fff !important;
  background:
    linear-gradient(
      135deg,
      var(--garuda-blue-700),
      var(--garuda-blue-500)
    ) !important;
  border-color: var(--garuda-blue-600) !important;
}

.v2-donut-segment:nth-of-type(2) {
  stroke: var(--garuda-blue-700) !important;
}

.v2-donut-segment:nth-of-type(3) {
  stroke: var(--garuda-blue-600) !important;
}

.v2-donut-segment:nth-of-type(4) {
  stroke: #78b8f1 !important;
}

.v2-legend-color-1 {
  background: var(--garuda-blue-700) !important;
}

.v2-legend-color-2 {
  background: var(--garuda-blue-600) !important;
}

.v2-legend-color-3 {
  background: #78b8f1 !important;
}

@media (max-width: 980px) {
  .sidebar {
    box-shadow: 18px 0 44px rgba(7, 22, 41, .24);
  }
}
