/* Light mode styling for theme toggle button */
[data-mantine-color-scheme="light"] #color-scheme-toggle {
  border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-cool_gray-3);
}

/* Dark mode styling for theme toggle button */
[data-mantine-color-scheme="dark"] #color-scheme-toggle {
  border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-cool_gray-9);
}

/* Ag Grid Alpine theme customization for light mode */
[data-mantine-color-scheme="light"] .ag-theme-alpine {
  --ag-background-color: #ffffff;
  --ag-foreground-color: #000000;
  --ag-border-color: #e0e0e0;
  --ag-header-background-color: #f5f5f5;
  --ag-row-hover-color: #f5f5f5;
  --ag-selected-row-background-color: #e3f2fd;
  --ag-grid-size: 4px;
}

/* Ag Grid Alpine theme customization for dark mode */
[data-mantine-color-scheme="dark"] .ag-theme-alpine {
  --ag-background-color: #1a1b1e;
  --ag-foreground-color: #c1c2c5;
  --ag-border-color: #373A40;
  --ag-header-background-color: #25262b;
  --ag-row-hover-color: #2c2e33;
  --ag-selected-row-background-color: #2c3e50;
  --ag-odd-row-background-color: #1a1b1e;
  --ag-grid-size: 4px;
  --headwind-alert-color: #ffd8a8; /* Open Colors orange-2 for dark mode */
}

/* Headwind alert icon color (matches Mantine Alert title) */
[data-mantine-color-scheme="light"] .ag-theme-alpine {
  --headwind-alert-color: #f76707; /* Open Colors orange-7 for light mode */
}

/* Mobile subtitle alternating animation */
@keyframes fadeAlternate {
  0%, 45% { opacity: 1; }
  50%, 95% { opacity: 0; }
  100% { opacity: 1; }
}

/* Container for overlapping alternate content */
.mobile-subtitle-container {
  position: relative;
  display: flex;
  align-items: center;
}

/* First item (subtitle) - visible first half of cycle, defines container height */
.fade-alternate-primary {
  animation: fadeAlternate 10s ease-in-out infinite;
  /* No position: absolute - stays in normal flow for height calculation */
}

/* Second item (NBM status) - visible second half of cycle, overlays primary */
.fade-alternate-secondary {
  animation: fadeAlternate 10s ease-in-out infinite;
  animation-delay: 5s;  /* Start halfway through 10s cycle */
  position: absolute;
  opacity: 0;  /* Start hidden until animation begins */
  top: 0;
  left: 0;
  right: 0;
  pointer-events: none;  /* Prevent blocking clicks when invisible */
}
