@import url("/assets/highcharts/css/default.css");

:root,
.highcharts-light {
  --page-bg: #EFF3F6;
  --page-text: #000000;
  --page-text-secondary: #4C5B73;
  --page-text-disabled: #C4D1DB;
  --page-text-muted: #7788A3;
  --button-bg-disabled: #C4D1DB;
  --button-text-disabled: #7788A3;
  --popover-bg-color: var(--page-bg);
  --popover-text-color: var(--page-text-secondary);
  --box-shadow: 0 0 0 2px #F0F0F0;

  /* --logo-bg: #ffffff; */
  --side-menu-bg: #FFFFFF;
  --side-menu-color: #485E75;
  --active-side-menu-bg: #495f74;
  --flyout-menu-bg: #FFFFFF;

  --button-secondary-bg: #E9EEF4;
  --button-secondary-color: #4C5B73;

  --panel-bg: #FFFFFF;
  --surface-muted: #F4F6FA;
  --border-soft: rgba(15, 23, 42, 0.1);
  --panel-shadow: 0 8px 26px -18px rgba(15, 23, 42, 0.4);

  --highcharts-background-color: #FFFFFF;
  --highcharts-grid-line-color: #e9e9e9;
  --highcharts-color-0: #00F6ED;
  --highcharts-color-1: #F2E863;
  --highcharts-color-2: #00CC66;
  --highcharts-color-3: #604ADA;
  --highcharts-color-4: #E55DED;
  --highcharts-color-5: #DD6031;
  --highcharts-color-6: #FAA4BD;
  --highcharts-color-7: #E85D75;
  --highcharts-color-8: #91e8e1;
  --highcharts-color-9: #ba87f7;
  --highcharts-color-10: #fd8899;
  --highcharts-color-11: #33af28;
  --highcharts-color-12: #7D80DA;

  --highcharts-text-color: #000000;
  --highcharts-text-color-1: #fdfdfd;

  --highcharts-axis-line-color: #d0d0d0;

  --icon-color: #74757c;
  --icon-active-color: var(--main-color);

  /* --ag-header-foreground-color: #000000; */
  --hover-orange: #fef2e7;

  --score-card-text-color: #ffffff;

  --ag-grid-budget-background-color: #ffaf64;
  --ag-grid-budget-text-color: #000000;
  --action-icon-color: #000000;
  --ag-grid-preset-btn-bg: #228be633;

  --snapshot-up-bg: #D0F3E1;
  --snapshot-down-bg: #F5E6E5;
  --snapshot-mid-bg: #F0EBA7;
  --snapshot-neutral-bg: #E7E9ED;

  --snapshot-top-row-up: #00CC66;
  --snapshot-top-row-down: #ED6A5A;
  --snapshot-top-row-mid: #4C5B73;

  --card-circle-up: #00CC66;
  --card-circle-down: #ED6A5A;
  --card-circle-mid: #F0B760;

  --snapshot-bar-color-1: #eaf4ef;
  --snapshot-bar-color-2: #eaf7f7;

  --custom-export-row-color: #FFFFFF;

  --snapshot-pie-color-0: var(--highcharts-color-0);
  --snapshot-pie-color-1: var(--highcharts-color-1);
  --snapshot-pie-color-2: var(--highcharts-color-2);
  --snapshot-pie-color-3: var(--highcharts-color-3);
  --snapshot-pie-color-4: var(--highcharts-color-4);
  --snapshot-pie-color-5: var(--highcharts-color-5);
  --snapshot-pie-color-6: var(--highcharts-color-6);
  --snapshot-pie-color-7: var(--highcharts-color-7);
  --snapshot-pie-color-8: var(--highcharts-color-8);

  --drilldown-set-a-color: #7D80DA;
  --drilldown-set-b-color: #F2E863;
  
  --tooltip-bg: #090C11;
  --tooltip-color: #e0e0e0;

  --ui-tooltip-bg: #1A2433;
  --ui-tooltip-color: #FFFFFF;
  --ui-tooltip-border: transparent;

  --heading-color: #000000;
  --cadence-date-color: #485E75;

  --alert-input-card-bg: #ffffff;

  --mi-card-bg: #ecf0f4;
  --mi-card-border-color: #e5e5e5;
  --mi-item-list-bg: #fafafa;
  --mi-panel-title-color: #8A94A6;
}

/* 🌙 Dark Theme */
:root[data-theme="dark"],
.highcharts-dark {
  --page-bg: #1A2433;
  --page-text: #e0e0e0;
  --page-text-secondary: #C8CED7;
  --page-text-disabled: #4C5B73;
  --page-text-muted: #4C5B73;
  --button-bg-disabled: #4C5B73;
  --button-text-disabled: #7788A3;
  --popover-bg-color: #090C11;
  --popover-text-color: #ffffff;
  --box-shadow: 0 0 0 2px #0F0F0F;
  /* --logo-bg: #ffffff; */

  --side-menu-bg: #121821;
  --side-menu-color: #F2F5F7;
  --active-side-menu-bg: #d4d4d4;
  --flyout-menu-border: #2E3C51;
  --flyout-menu-bg: #1E2938;

  --button-secondary-bg: #26344A;
  --button-secondary-color: #C8CED7;

  --panel-bg: #212E40;
  --surface-muted: #26344A;
  --border-soft: rgba(255, 255, 255, 0.09);
  --panel-shadow: 0 10px 30px -14px rgba(0, 0, 0, 0.6);

  --highcharts-background-color: #131C28;
  --highcharts-grid-line-color: #2E3C51;

  --highcharts-color-0: #00F6ED;
  --highcharts-color-1: #F2E863;
  --highcharts-color-2: #00CC66;
  --highcharts-color-3: #604ADA;
  --highcharts-color-4: #E55DED;
  --highcharts-color-5: #DD6031;
  --highcharts-color-6: #FAA4BD;
  --highcharts-color-7: #E85D75;
  --highcharts-color-8: #91e8e1;
  --highcharts-color-9: #ba87f7;
  --highcharts-color-10: #fd8899;
  --highcharts-color-11: #33af28;
  --highcharts-color-12: #7D80DA;

  --highcharts-text-color: #e0e0e0;
  --highcharts-text-color-1: #000000;

  --highcharts-axis-line-color: #d0d0d0;

  --icon-color: #74757c;
  --icon-active-color: var(--main-color);

  /* --ag-header-foreground-color: #ffffff; */
  --hover-orange: #fef2e7;

  --score-card-text-color: #000000;

  --ag-grid-budget-background-color: #ffaf64;
  --ag-grid-budget-text-color: #000000;
  --action-icon-color: #ffffff;
  --ag-grid-preset-btn-bg: #228be633;

  --snapshot-up-bg: #183541;
  --snapshot-down-bg: #3D2B3C;
  --snapshot-mid-bg: #767127;
  --snapshot-neutral-bg: #2B2F38;

  --snapshot-top-row-up: #ffffff;
  --snapshot-top-row-down: #ffffff;
  --snapshot-top-row-mid: #ffffff;
  --snapshot-card-value-color: #ffffff;

  --card-circle-up: #00CC66;
  --card-circle-down: #ED6A5A;
  --card-circle-mid: #F0B760;

  --snapshot-bar-color-1: #183541;
  --snapshot-bar-color-2: #1e263a;

  --custom-export-row-color: #121821;

  --snapshot-pie-color-0: var(--highcharts-color-0);
  --snapshot-pie-color-1: var(--highcharts-color-1);
  --snapshot-pie-color-2: var(--highcharts-color-2);
  --snapshot-pie-color-3: var(--highcharts-color-3);
  --snapshot-pie-color-4: var(--highcharts-color-4);
  --snapshot-pie-color-5: var(--highcharts-color-5);
  --snapshot-pie-color-6: var(--highcharts-color-6);
  --snapshot-pie-color-7: var(--highcharts-color-7);
  --snapshot-pie-color-8: var(--highcharts-color-8);

  --drilldown-set-a-color: #7D80DA;
  --drilldown-set-b-color: #F2E863;

  --tooltip-bg: #090C11;
  --tooltip-color: #e0e0e0;

  --ui-tooltip-bg: #F2F5F7;
  --ui-tooltip-color: #1A2433;
  --ui-tooltip-border: rgba(255, 255, 255, 0.15);

  --heading-color: #ffffff;
  --cadence-date-color: #C8CED7;

  --alert-input-card-bg: #131C28;

  --mi-card-bg: #151f2e;
  --mi-card-border-color: #27374B;
  --mi-item-list-bg: #1C2838;
  --mi-panel-title-color: #8A94A6;
}

:root[data-bs-theme="dark"] {
  --bs-body-bg: #1A2433;
}

:root[data-mantine-color-scheme="dark"] {
  --modal-primary-bottom-border: 1px solid #253447;
}
:root[data-mantine-color-scheme="light"] {
  --modal-primary-bottom-border: 1px solid #dde0e3;
  --input-border-color: #C4D1DB;
}

[data-bs-theme="dark"] .dropdown-menu .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-menu .dropdown-item:focus {
  background-color: #333;
  /* slightly lighter dark for hover */
  color: #fff;
  /* make text stand out */
}

/* Body styling */
body {
  background-color: var(--page-bg);
  color: var(--page-text);
  transition: background-color 0.3s, color 0.3s;
}

[data-mantine-color-scheme="dark"] .report-section-desc {
  color: #ffffff;
}

[data-mantine-color-scheme="dark"] .dark-desc-text {
  color: #ffffff !important;
}

#menu-dim-overlay {
  position: fixed;
  inset: 0;
  z-index: 150;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: opacity 0.03s ease;
}

#menu-dim-overlay.active {
  opacity: 1;
}