/*
 * DESKTOP TRACKER MAP TOOLS — FINAL
 * Wyłącznie panel PC.
 */

@media (min-width: 821px) {
  .desktop-trackers-popover {
    width:
      300px !important;

    min-width:
      300px !important;

    max-width:
      min(
        300px,
        calc(100vw - 20px)
      ) !important;

    max-height:
      min(
        440px,
        calc(100dvh - 165px)
      ) !important;

    padding:
      7px 9px !important;

    overflow-x:
      hidden !important;

    overflow-y:
      auto !important;

    border-radius:
      13px !important;

    box-sizing:
      border-box !important;

    overscroll-behavior:
      contain !important;

    scrollbar-gutter:
      stable !important;
  }

  .desktop-trackers-popover
  .tracker-legend {
    width:
      100% !important;

    min-width:
      0 !important;

    margin:
      0 !important;

    padding:
      0 !important;
  }

  .desktop-trackers-popover
  .tracker-legend-title {
    display:
      flex !important;

    align-items:
      center !important;

    justify-content:
      space-between !important;

    min-height:
      28px !important;

    margin:
      0 !important;

    padding:
      4px 2px 6px !important;

    border-bottom:
      1px solid #dce7ed !important;

    color:
      #0b1d3a !important;

    font-size:
      14px !important;

    font-weight:
      900 !important;

    line-height:
      1.1 !important;
  }

  .desktop-trackers-popover
  .tracker-legend-count {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    min-width:
      22px !important;

    height:
      21px !important;

    padding:
      0 5px !important;

    border-radius:
      12px !important;

    background:
      #e5f7f7 !important;

    color:
      #0066b3 !important;

    font-size:
      9px !important;

    font-weight:
      900 !important;
  }

  .desktop-trackers-popover
  .ow-desktop-tracker-controls {
    display:
      grid !important;

    gap:
      4px !important;

    margin:
      5px 0 4px !important;

    padding:
      5px 6px !important;

    border:
      1px solid #c9dfe9 !important;

    border-radius:
      8px !important;

    background:
      #f4fafc !important;
  }

  .desktop-trackers-popover
  .ow-tracker-options-row {
    display:
      grid !important;

    grid-template-columns:
      minmax(0, 1fr)
      auto !important;

    align-items:
      center !important;

    gap:
      5px !important;
  }

  .desktop-trackers-popover
  .ow-tracker-label-switch {
    display:
      inline-flex !important;

    align-items:
      center !important;

    gap:
      5px !important;

    margin:
      0 !important;

    color:
      #29485e !important;

    font-size:
      10px !important;

    font-weight:
      900 !important;

    cursor:
      pointer !important;
  }

  .desktop-trackers-popover
  .ow-tracker-label-switch input {
    width:
      14px !important;

    min-width:
      14px !important;

    height:
      14px !important;

    min-height:
      14px !important;

    margin:
      0 !important;

    accent-color:
      #0066b3 !important;
  }

  .desktop-trackers-popover
  .ow-tracker-show-all,

  .desktop-trackers-popover
  .ow-tracker-action-button {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    flex:
      0 0 auto !important;

    width:
      28px !important;

    min-width:
      28px !important;

    max-width:
      28px !important;

    height:
      28px !important;

    min-height:
      28px !important;

    max-height:
      28px !important;

    margin:
      0 !important;

    padding:
      0 !important;

    border:
      1px solid #b9d0de !important;

    border-radius:
      7px !important;

    background:
      #ffffff !important;

    color:
      #31526c !important;

    box-sizing:
      border-box !important;

    cursor:
      pointer !important;
  }

  .desktop-trackers-popover
  .ow-tracker-show-all svg,

  .desktop-trackers-popover
  .ow-tracker-action-button svg {
    display:
      block !important;

    width:
      14px !important;

    height:
      14px !important;

    pointer-events:
      none !important;
  }

  .desktop-trackers-popover
  .ow-tracker-show-all:hover:not(:disabled),

  .desktop-trackers-popover
  .ow-tracker-action-button:hover:not(:disabled) {
    border-color:
      #0066b3 !important;

    background:
      #edf7fc !important;

    color:
      #0066b3 !important;
  }

  .desktop-trackers-popover
  .ow-tracker-action-button.active {
    border-color:
      #0066b3 !important;

    background:
      #0066b3 !important;

    color:
      #ffffff !important;
  }

  .desktop-trackers-popover
  .ow-tracker-show-all:disabled,

  .desktop-trackers-popover
  .ow-tracker-action-button:disabled {
    opacity:
      0.35 !important;

    cursor:
      default !important;
  }

  .desktop-trackers-popover
  .ow-tracker-view-mode {
    padding:
      3px 2px 0 !important;

    border-top:
      1px solid #dce8ee !important;

    color:
      #0066b3 !important;

    font-size:
      8px !important;

    font-weight:
      900 !important;

    line-height:
      1.2 !important;

    overflow:
      hidden !important;

    text-overflow:
      ellipsis !important;

    white-space:
      nowrap !important;
  }

  .desktop-trackers-popover
  .tracker-legend-row {
    display:
      grid !important;

    grid-template-columns:
      minmax(0, 1fr)
      auto
      auto !important;

    align-items:
      center !important;

    gap:
      5px !important;

    min-height:
      34px !important;

    height:
      34px !important;

    margin:
      0 !important;

    padding:
      3px 1px !important;

    border-bottom:
      1px solid #e2ebf0 !important;

    box-sizing:
      border-box !important;
  }

  .desktop-trackers-popover
  .tracker-legend-name {
    display:
      flex !important;

    align-items:
      center !important;

    gap:
      5px !important;

    min-width:
      0 !important;

    color:
      #273f55 !important;

    font-size:
      10px !important;

    font-weight:
      900 !important;
  }

  .desktop-trackers-popover
  .tracker-legend-name
  > span:last-child {
    overflow:
      hidden !important;

    text-overflow:
      ellipsis !important;

    white-space:
      nowrap !important;
  }

  .desktop-trackers-popover
  .tracker-legend-color {
    width:
      10px !important;

    min-width:
      10px !important;

    height:
      10px !important;

    min-height:
      10px !important;

    border-radius:
      50% !important;
  }

  .desktop-trackers-popover
  .tracker-legend-state {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    height:
      18px !important;

    min-height:
      18px !important;

    padding:
      0 5px !important;

    border-radius:
      9px !important;

    font-size:
      7px !important;

    font-weight:
      900 !important;

    line-height:
      1 !important;
  }

  .desktop-trackers-popover
  .ow-tracker-row-actions {
    display:
      flex !important;

    align-items:
      center !important;

    gap:
      3px !important;

    margin:
      0 !important;

    padding:
      0 !important;
  }

  .ow-visually-hidden {
    position:
      absolute !important;

    width:
      1px !important;

    height:
      1px !important;

    padding:
      0 !important;

    margin:
      -1px !important;

    overflow:
      hidden !important;

    clip:
      rect(0, 0, 0, 0) !important;

    white-space:
      nowrap !important;

    border:
      0 !important;
  }

  .leaflet-tooltip.tracker-label {
    display:
      block !important;

    visibility:
      visible !important;

    opacity:
      1 !important;

    padding:
      3px 6px !important;

    border:
      1px solid rgba(11, 29, 58, 0.18) !important;

    border-radius:
      7px !important;

    background:
      rgba(255, 255, 255, 0.97) !important;

    color:
      #0b1d3a !important;

    box-shadow:
      0 3px 9px
      rgba(11, 29, 58, 0.14) !important;

    font-size:
      9px !important;

    font-weight:
      900 !important;

    line-height:
      1.1 !important;

    white-space:
      nowrap !important;
  }

  body.ow-desktop-tracker-labels-hidden
  .leaflet-tooltip.tracker-label,

  .leaflet-tooltip.tracker-label
  .ow-tracker-label-hidden,

  .leaflet-tooltip
  .ow-tracker-label-hidden {
    display:
      none !important;

    visibility:
      hidden !important;

    opacity:
      0 !important;
  }
}

/* TRACKER TOOLS SHARED V2 START */

/*
 * Wspólne elementy.
 */

#tracker-legend.ow-tracker-tools-v2 {
  box-sizing:
    border-box !important;
}

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-show-all,

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-action-button {
  position:
    relative !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  flex:
    0 0 auto !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    1px solid #b9d0de !important;

  background:
    #ffffff !important;

  color:
    #234d6b !important;

  box-sizing:
    border-box !important;

  font-family:
    inherit !important;

  font-size:
    0 !important;

  line-height:
    1 !important;

  cursor:
    pointer !important;
}

/*
 * Ukrywamy wcześniejsze SVG oraz tekst,
 * a ikonę rysujemy stabilnym symbolem.
 */

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-show-all > *,

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-action-button > * {
  display:
    none !important;
}

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-show-all::before,

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-action-button::before {
  display:
    block !important;

  color:
    currentColor !important;

  font-family:
    Arial, sans-serif !important;

  font-size:
    17px !important;

  font-weight:
    900 !important;

  line-height:
    1 !important;
}

#tracker-legend.ow-tracker-tools-v2
[data-ow-tracker-action="show-all"]::before {
  content:
    "⊞";
}

#tracker-legend.ow-tracker-tools-v2
[data-ow-tracker-action="isolate"]::before {
  content:
    "◉";
}

#tracker-legend.ow-tracker-tools-v2
[data-ow-tracker-action="follow"]::before {
  content:
    "⌖";
}

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-action-button.active {
  border-color:
    #0066b3 !important;

  background:
    #0066b3 !important;

  color:
    #ffffff !important;
}

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-show-all:disabled,

#tracker-legend.ow-tracker-tools-v2
.ow-tracker-action-button:disabled {
  opacity:
    0.42 !important;
}

/*
 * Etykiety na mapie.
 */

.leaflet-tooltip.tracker-label {
  display:
    block !important;

  visibility:
    visible !important;

  opacity:
    1 !important;

  padding:
    3px 7px !important;

  border:
    1px solid rgba(11, 29, 58, 0.2) !important;

  border-radius:
    7px !important;

  background:
    rgba(255, 255, 255, 0.97) !important;

  color:
    #0b1d3a !important;

  box-shadow:
    0 3px 10px
    rgba(11, 29, 58, 0.16) !important;

  font-size:
    10px !important;

  font-weight:
    900 !important;

  line-height:
    1.1 !important;

  white-space:
    nowrap !important;
}

body.ow-desktop-tracker-labels-hidden
.leaflet-tooltip.tracker-label,

.leaflet-tooltip.tracker-label.ow-tracker-label-hidden {
  display:
    none !important;

  visibility:
    hidden !important;

  opacity:
    0 !important;
}

/*
 * Widok komputerowy.
 */

@media (min-width: 821px) {
  .desktop-trackers-popover.ow-trackers-popover-v2 {
    width:
      330px !important;

    min-width:
      330px !important;

    max-width:
      min(
        330px,
        calc(100vw - 20px)
      ) !important;

    height:
      auto !important;

    min-height:
      0 !important;

    max-height:
      min(
        480px,
        calc(100dvh - 165px)
      ) !important;

    padding:
      8px 9px !important;

    overflow-x:
      hidden !important;

    overflow-y:
      auto !important;

    scrollbar-gutter:
      auto !important;

    box-sizing:
      border-box !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-title {
    display:
      flex !important;

    align-items:
      center !important;

    justify-content:
      space-between !important;

    min-height:
      31px !important;

    margin:
      0 !important;

    padding:
      3px 2px 7px !important;

    border-bottom:
      1px solid #dce7ed !important;

    font-size:
      15px !important;

    line-height:
      1.1 !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-count {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    min-width:
      23px !important;

    height:
      23px !important;

    padding:
      0 6px !important;

    border-radius:
      12px !important;

    background:
      #e5f7f7 !important;

    color:
      #0066b3 !important;

    font-size:
      10px !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .ow-desktop-tracker-controls {
    display:
      grid !important;

    gap:
      4px !important;

    margin:
      6px 0 4px !important;

    padding:
      5px 6px !important;

    border:
      1px solid #c9dfe9 !important;

    border-radius:
      8px !important;

    background:
      #f4fafc !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-options-row {
    display:
      grid !important;

    grid-template-columns:
      minmax(0, 1fr)
      auto !important;

    align-items:
      center !important;

    gap:
      6px !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-label-switch {
    display:
      inline-flex !important;

    align-items:
      center !important;

    gap:
      6px !important;

    margin:
      0 !important;

    font-size:
      10px !important;

    font-weight:
      900 !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-label-switch input {
    width:
      14px !important;

    min-width:
      14px !important;

    height:
      14px !important;

    min-height:
      14px !important;

    margin:
      0 !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-show-all,

  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-action-button {
    width:
      29px !important;

    min-width:
      29px !important;

    max-width:
      29px !important;

    height:
      29px !important;

    min-height:
      29px !important;

    max-height:
      29px !important;

    border-radius:
      7px !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-row {
    display:
      grid !important;

    grid-template-columns:
      minmax(0, 1fr)
      auto
      auto !important;

    align-items:
      center !important;

    gap:
      5px !important;

    width:
      100% !important;

    min-height:
      38px !important;

    height:
      38px !important;

    margin:
      0 !important;

    padding:
      4px 1px !important;

    border-bottom:
      1px solid #e2ebf0 !important;

    box-sizing:
      border-box !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-name {
    display:
      flex !important;

    align-items:
      center !important;

    gap:
      6px !important;

    min-width:
      0 !important;

    font-size:
      11px !important;

    font-weight:
      900 !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-state {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    height:
      19px !important;

    min-height:
      19px !important;

    padding:
      0 6px !important;

    border-radius:
      10px !important;

    font-size:
      8px !important;

    line-height:
      1 !important;
  }

  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-row-actions {
    display:
      flex !important;

    align-items:
      center !important;

    gap:
      4px !important;

    width:
      auto !important;

    height:
      29px !important;

    margin:
      0 !important;

    padding:
      0 !important;
  }
}

/*
 * Telefon — wykorzystuje istniejący
 * mobilny panel trackerów.
 */

@media (max-width: 820px) {
  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2 {
    width:
      100% !important;

    min-width:
      0 !important;

    max-height:
      min(
        62dvh,
        520px
      ) !important;

    padding:
      10px !important;

    overflow-x:
      hidden !important;

    overflow-y:
      auto !important;

    box-sizing:
      border-box !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-title {
    display:
      flex !important;

    align-items:
      center !important;

    justify-content:
      space-between !important;

    min-height:
      36px !important;

    padding:
      3px 2px 8px !important;

    font-size:
      15px !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .ow-desktop-tracker-controls {
    margin:
      6px 0 !important;

    padding:
      7px !important;

    border:
      1px solid #c9dfe9 !important;

    border-radius:
      9px !important;

    background:
      #f4fafc !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-options-row {
    display:
      grid !important;

    grid-template-columns:
      minmax(0, 1fr)
      auto !important;

    align-items:
      center !important;

    gap:
      8px !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-row {
    display:
      grid !important;

    grid-template-columns:
      minmax(0, 1fr)
      auto
      auto !important;

    align-items:
      center !important;

    gap:
      6px !important;

    min-height:
      49px !important;

    height:
      49px !important;

    padding:
      5px 1px !important;

    border-bottom:
      1px solid #e2ebf0 !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-name {
    min-width:
      0 !important;

    font-size:
      12px !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .tracker-legend-state {
    height:
      20px !important;

    padding:
      0 6px !important;

    font-size:
      8px !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-show-all,

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-action-button {
    width:
      36px !important;

    min-width:
      36px !important;

    max-width:
      36px !important;

    height:
      36px !important;

    min-height:
      36px !important;

    max-height:
      36px !important;

    border-radius:
      9px !important;
  }

  body.mobile-ui-active
  #tracker-legend.ow-tracker-tools-v2
  .ow-tracker-row-actions {
    display:
      flex !important;

    gap:
      5px !important;
  }
}

/* TRACKER TOOLS SHARED V2 END */