/* Dark theme overrides for loading indicators and map popups.
   Scoped to data-theme or data-bs-theme = dark so theme.js switching works. */

[data-theme="dark"] .loading-indicator,
[data-bs-theme="dark"] .loading-indicator {
  color: #e5e7eb; /* text */
  transition: background 160ms ease, color 160ms ease;
}

/* Bootstrap spinner */
[data-theme="dark"] .loading-indicator .spinner-border,
[data-bs-theme="dark"] .loading-indicator .spinner-border {
  color: #ffffff; /* spinner color */
}

/* Generic custom spinner fallback */
[data-theme="dark"] .loading-indicator .spinner,
[data-bs-theme="dark"] .loading-indicator .spinner {
  width: 2rem;
  height: 2rem;
  border: 0.25rem solid rgba(255,255,255,0.12);
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: spinner-rotate 0.75s linear infinite;
}

@keyframes spinner-rotate { to { transform: rotate(360deg); } }


/* Map popup content (Azure Maps or custom popup) */
[data-theme="dark"] .map-popup-content,
[data-bs-theme="dark"] .map-popup-content,
[data-theme="dark"] .popup,
[data-bs-theme="dark"] .popup,
[data-theme="dark"] .popup-content,
[data-bs-theme="dark"] .popup-content {
    background-color: #0b1220; /* very dark */
    color: #e6eef8; /* light text */
    border: 1px solid rgba(255,255,255,0.06);
    box-shadow: 0 8px 20px rgba(0,0,0,0.7);
    border-radius: 6px;
    transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}


/* Links / buttons inside popup */
[data-theme="dark"] .map-popup-content a,
[data-bs-theme="dark"] .map-popup-content a,
[data-theme="dark"] .popup a,
[data-bs-theme="dark"] .popup a {
  color: #90cdf4; /* blue-ish for contrast */
}

/* Popup close/controls */
[data-theme="dark"] .map-popup-content .popup-close,
[data-bs-theme="dark"] .map-popup-content .popup-close,
[data-theme="dark"] .popup .close,
[data-bs-theme="dark"] .popup .close {
  color: #cbd5e1;
  opacity: 0.95;
}

/* If popup triangles/arrows exist, tint them to match */
[data-theme="dark"] .popup .popup-arrow,
[data-bs-theme="dark"] .popup .popup-arrow,
[data-theme="dark"] .map-popup-content::after,
[data-bs-theme="dark"] .map-popup-content::after {
  filter: brightness(0.95) contrast(0.95);
}

/* Small accessibility tweak: ensure text on spinner overlays is readable */
[data-theme="dark"] .loading-indicator .loading-text,
[data-bs-theme="dark"] .loading-indicator .loading-text {
  color: #e6eef8;
  text-shadow: 0 1px 0 rgba(0,0,0,0.55);
}





/* ion rangeslider */

[data-theme="dark"] .irs--round .irs-line,
[data-bs-theme="dark"] .irs--round .irs-line {
    background-color: #2f3338;
}

[data-theme="dark"] .irs--round .irs-grid-pol,
[data-bs-theme="dark"] .irs--round .irs-grid-pol {
    background-color: #495057;
}

[data-theme="dark"] .irs--round .irs-grid-text,
[data-bs-theme="dark"] .irs--round .irs-grid-text {
    color: #6c757d;
}

[data-theme="dark"] .irs--round .irs-handle.state_hover, .irs--round .irs-handle:hover,
[data-bs-theme="dark"] .irs--round .irs-handle.state_hover, .irs--round .irs-handle:hover {
    background-color: #2a3037;
}

[data-theme="dark"] .irs--round .irs-handle,
[data-bs-theme="dark"] .irs--round .irs-handle {
    background-color: #212529;
}