:root[data-w-theme="dark"] .leaflet-tile-container > img {
  filter: invert(1) hue-rotate(180deg) brightness(0.85) contrast(0.9);
}

@media (prefers-color-scheme: dark) {
  :root[data-w-theme="system"] .leaflet-tile-container > img {
    filter: invert(1) hue-rotate(180deg) brightness(0.85) contrast(0.9);
  }
}

/* The following content is generated from Leaflet CSS. Regenerate them if Leaflet is updated. */

.leaflet-container {
  background-color: var(--w-surface-background);
  color: var(--w-content-default);
}

.leaflet-container a {
  color: var(--w-content-default);
  -webkit-tap-highlight-color: color-mix(in srgb, var(--w-states-on-light) 40%, transparent);
}

.leaflet-zoom-box {
  border-color: var(--w-border-active);
  background-color: color-mix(in srgb, var(--w-surface-layer-1) 50%, transparent);
}

.leaflet-bar,
.leaflet-control-layers {
  box-shadow: var(--w-shadow-component);
}

.leaflet-bar a {
  background-color: var(--w-surface-layer-1);
  border-bottom-color: var(--w-border-separator);
  color: var(--w-content-default);
}

.leaflet-bar a:hover,
.leaflet-bar a:focus {
  background-color: var(--w-surface-layer-2);
}

.leaflet-bar a.leaflet-disabled {
  background-color: var(--w-surface-layer-2);
  color: var(--w-content-disabled);
}

.leaflet-control-layers,
.leaflet-control-layers-expanded {
  background-color: var(--w-surface-layer-1);
  color: var(--w-content-default);
}

.leaflet-control-layers-separator {
  border-top-color: var(--w-border-separator);
}

.leaflet-container .leaflet-control-attribution,
.leaflet-control-scale-line {
  background-color: color-mix(in srgb, var(--w-surface-layer-1) 80%, transparent);
}

.leaflet-control-attribution,
.leaflet-control-scale-line {
  color: var(--w-content-default);
}

/* Match Leaflet's scale variants without changing which border sides are visible. */
.leaflet-control-scale-line,
.leaflet-control-scale-line:not(:first-child),
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
  border-color: var(--w-border-default);
}

.leaflet-control-scale-line {
  text-shadow: 1px 1px var(--w-surface-layer-1);
}

.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
  border-color: var(--w-border-subtle);
}

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background-color: var(--w-surface-layer-1);
  color: var(--w-content-default);
  box-shadow: var(--w-shadow-overlay);
}

.leaflet-container a.leaflet-popup-close-button {
  color: var(--w-content-subtle);
}

.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
  color: var(--w-content-default);
}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
  border-color: var(--w-border-default);
}

.leaflet-div-icon {
  background-color: var(--w-surface-layer-1);
  border-color: var(--w-border-default);
}

.leaflet-tooltip {
  background-color: var(--w-surface-layer-1);
  border-color: var(--w-surface-layer-1);
  color: var(--w-content-default);
  box-shadow: var(--w-shadow-component);
}

.leaflet-tooltip-top:before {
  border-top-color: var(--w-surface-layer-1);
}

.leaflet-tooltip-bottom:before {
  border-bottom-color: var(--w-surface-layer-1);
}

.leaflet-tooltip-left:before {
  border-left-color: var(--w-surface-layer-1);
}

.leaflet-tooltip-right:before {
  border-right-color: var(--w-surface-layer-1);
}