@media (max-width: 760px) {
  /*
   * ==================================================
   * DUPLIKAT WIATRU NA MAPIE
   * ==================================================
   *
   * Karta wiatru w nagłówku zostaje.
   * Usuwamy dokładnie kartę generowaną przez
   * racelab-map-controls.js.
   */

  #racelab-map-tools .racelab-wind-card {
    display: none !important;
  }

  /*
   * ==================================================
   * WIATR W GÓRNYM NAGŁÓWKU
   * ==================================================
   */

  .opti-mobile-header-wind {
    position: relative !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    flex: 0 1 clamp(142px, 28vw, 172px) !important;

    width: clamp(142px, 28vw, 172px) !important;
    min-width: 142px !important;
    max-width: 172px !important;

    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;

    margin: 0 4px 0 auto !important;
    padding: 5px 8px !important;

    gap: 7px !important;

    border: 1px solid #b8d1df !important;
    border-radius: 15px !important;

    background: #f8fcff !important;

    box-shadow: none !important;
    transform: none !important;
  }

  .opti-mobile-header-wind svg,
  .opti-mobile-header-wind img,
  .opti-mobile-header-wind canvas {
    width: 43px !important;
    min-width: 43px !important;
    max-width: 43px !important;

    height: 43px !important;
    min-height: 43px !important;
    max-height: 43px !important;

    object-fit: contain !important;
  }

  .opti-mobile-header-wind strong {
    font-size: 23px !important;
    line-height: 1 !important;
  }

  .opti-mobile-header-wind small,
  .opti-mobile-header-wind [class*="speed"] {
    font-size: 12px !important;
    line-height: 1.05 !important;
  }

  /*
   * ==================================================
   * OPENSTREETMAP — PRAWY GÓRNY RÓG MAPY
   * ==================================================
   */

  .leaflet-top.leaflet-right
  .leaflet-control-attribution {
    float: none !important;

    max-width: 168px !important;

    margin: 5px 10px 0 0 !important;
    padding: 1px 4px !important;

    border-radius: 4px !important;

    background:
      rgba(255, 255, 255, 0.82) !important;

    color: #526a79 !important;

    font-size: 7px !important;
    line-height: 11px !important;

    white-space: nowrap !important;

    opacity: 0.82 !important;
  }

  .leaflet-top.leaflet-right
  .leaflet-control-attribution a {
    font-size: 7px !important;
    line-height: 11px !important;
  }

  /*
   * ==================================================
   * TRACKERY
   * ==================================================
   */

  .opti-mobile-tracker-shell {
    position: fixed !important;

    top: 105px !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;

    z-index: 1500 !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: 155px !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
    transform: none !important;
  }

  .opti-mobile-tracker-button {
    position: static !important;

    width: auto !important;
    min-width: 124px !important;
    max-width: 148px !important;

    height: 43px !important;
    min-height: 43px !important;
    max-height: 43px !important;

    margin: 0 !important;
    padding: 6px 10px !important;

    border-radius: 12px !important;

    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    white-space: nowrap !important;

    transform: none !important;
  }

  /*
   * ==================================================
   * ANALIZA TRENERA / ANALIZA ODCINKÓW
   * ==================================================
   *
   * Dolna nawigacja zajmuje około 84 px.
   * Sterowanie znajduje się od 88 px.
   * Analizy są bezpośrednio nad sterowaniem.
   */

  .coach-analysis-launcher,
  .leg-analysis-launcher {
    position: fixed !important;

    top: auto !important;
    bottom: 130px !important;

    z-index: 1430 !important;

    width: 39vw !important;
    min-width: 0 !important;
    max-width: 220px !important;

    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;

    margin: 0 !important;
    padding: 2px 5px !important;

    border-radius: 9px !important;

    font-size: 8.5px !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    white-space: nowrap !important;

    box-shadow:
      0 3px 8px
      rgba(12, 42, 64, 0.15) !important;

    transform: none !important;
  }

  .coach-analysis-launcher {
    left: 8vw !important;
    right: auto !important;
  }

  .leg-analysis-launcher {
    right: 8vw !important;
    left: auto !important;
  }

  /*
   * ==================================================
   * PAUZA / x1 / x2 / x5
   * ==================================================
   *
   * Przesuwamy istniejący kontener jako całość.
   * Nie pozycjonujemy osobno każdego przycisku.
   */

  #racelab-map-tools .racelab-time-controls {
    position: fixed !important;

    top: auto !important;
    right: auto !important;
    bottom: 88px !important;
    left: 50% !important;

    z-index: 1450 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: 178px !important;

    height: 39px !important;
    min-height: 39px !important;
    max-height: 39px !important;

    margin: 0 !important;
    padding: 3px !important;

    gap: 3px !important;

    border-radius: 12px !important;

    background: #ffffff !important;

    box-shadow:
      0 3px 10px
      rgba(10, 39, 61, 0.18) !important;

    transform: translateX(-50%) !important;

    pointer-events: auto !important;
  }

  #racelab-map-tools
  .racelab-time-controls
  .racelab-control-button {
    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    flex: 0 0 31px !important;

    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;

    height: 31px !important;
    min-height: 31px !important;
    max-height: 31px !important;

    margin: 0 !important;
    padding: 0 !important;

    border-radius: 8px !important;

    font-size: 9px !important;
    font-weight: 900 !important;
    line-height: 29px !important;

    transform: none !important;
  }

  #racelab-map-tools
  .racelab-time-controls
  .racelab-run-button {
    flex-basis: 34px !important;

    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
  }

  #racelab-map-tools
  #racelab-control-message {
    display: none !important;
  }

  /*
   * ==================================================
   * OTWARTA ANALIZA
   * ==================================================
   */

  .coach-analysis-panel:not([hidden]) ~
  .coach-analysis-launcher,
  .leg-analysis-panel:not([hidden]) ~
  .leg-analysis-launcher {
    visibility: hidden !important;
  }

  .coach-analysis-panel,
  .leg-analysis-panel {
    bottom: 132px !important;
  }
}

/* OPTIWAKE MOBILE POPUP WIND FIX V4 START */

@media (max-width: 760px) {

  /*
   * ==================================================
   * KOLEJNOŚĆ WARSTW MAPY
   * ==================================================
   *
   * Popupy i podpowiedzi Leaflet zawsze muszą być
   * nad przyciskiem TRACKERY.
   */

  .opti-mobile-tracker-shell {
    z-index: 420 !important;
  }

  .opti-mobile-tracker-button {
    position: relative !important;
    z-index: 1 !important;
  }

  .leaflet-marker-pane {
    z-index: 600 !important;
  }

  .leaflet-tooltip-pane {
    z-index: 1150 !important;
  }

  .leaflet-popup-pane {
    z-index: 1200 !important;
  }

  .leaflet-popup {
    z-index: 1210 !important;
  }

  .leaflet-popup-content-wrapper,
  .leaflet-popup-tip,
  .leaflet-popup-close-button {
    position: relative !important;
    z-index: 2 !important;
  }

  /*
   * Gdy popup jest otwarty, tracker pozostaje widoczny,
   * ale znajduje się wyraźnie pod popupem.
   */
  body:has(.leaflet-popup-pane .leaflet-popup)
  .opti-mobile-tracker-shell {
    z-index: 300 !important;
  }

  /*
   * ==================================================
   * WIATR W NAGŁÓWKU
   * ==================================================
   *
   * Karta dopasowana do wysokości nagłówka.
   */

  .opti-mobile-header-wind {
    position: relative !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    flex:
      0 1
      clamp(126px, 29vw, 148px) !important;

    width:
      clamp(126px, 29vw, 148px) !important;

    min-width: 126px !important;
    max-width: 148px !important;

    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;

    margin: 0 4px 0 auto !important;
    padding: 3px 6px !important;

    gap: 5px !important;

    border-radius: 12px !important;

    align-self: center !important;

    overflow: hidden !important;

    transform: none !important;
  }

  /*
   * Ikona/kompas wiatru.
   */

  .opti-mobile-header-wind svg,
  .opti-mobile-header-wind img,
  .opti-mobile-header-wind canvas,
  .opti-mobile-header-wind
  [class*="compass"],
  .opti-mobile-header-wind
  [class*="wind-icon"] {
    flex: 0 0 30px !important;

    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;

    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;

    margin: 0 !important;

    object-fit: contain !important;
  }

  .opti-mobile-header-wind
  [class*="compass"] {
    border-radius: 50% !important;

    background:
      rgba(232, 244, 250, 0.72) !important;
  }

  .opti-mobile-header-wind
  [class*="arrow"] {
    font-size: 22px !important;
    line-height: 30px !important;
  }

  /*
   * Kierunek, prędkość i opis.
   */

  .opti-mobile-header-wind strong,
  .opti-mobile-header-wind
  [class*="direction"],
  .opti-mobile-header-wind
  [class*="degree"] {
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    white-space: nowrap !important;
  }

  .opti-mobile-header-wind small,
  .opti-mobile-header-wind
  [class*="speed"] {
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;

    white-space: nowrap !important;
  }

  .opti-mobile-header-wind
  [class*="label"] {
    font-size: 8px !important;
    line-height: 1 !important;
  }
}

/* OPTIWAKE MOBILE POPUP WIND FIX V4 END */
