/* ================================================================
   Sailing Tracks Map — stm-style.css — V2.5
   ================================================================ */

/* Wrapper & Karte */
.stm-map-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.stm-map {
    width: 100%;
    height: 400px;
}

/* Vollbild */
.stm-map-wrapper.stm-fullscreen-active {
    width: 100vw;
    height: 100vh;
}

.stm-map-wrapper.stm-fullscreen-active .stm-map {
    height: 100%;
    flex: 1;
    min-height: 0;
}

/* ----------------------------------------------------------------
   Steuerleiste (enthält ab V2.5 KEINE Checkboxen mehr)
   ---------------------------------------------------------------- */
.stm-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid #ddd;
    border-top: none;
    background: #fff;
}

.stm-map-wrapper.stm-fullscreen-active .stm-controls {
    background: rgba(30, 30, 30, 0.88);
    border-color: transparent;
    color: #fff;
}

/* Slider */
.stm-slider-row {
    display: flex;
    align-items: center;
    flex: 1 1 200px;
    min-width: 0;
}

.stm-slider {
    width: 100%;
    cursor: pointer;
}

/* Autoplay-Controls */
.stm-autoplay-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.stm-speed-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    cursor: default;
    white-space: nowrap;
}

/* Vollbild-Row */
.stm-fullscreen-row {
    display: flex;
    align-items: center;
}

/* ----------------------------------------------------------------
   Buttons (V2.4 Redesign, unverändert)
   ---------------------------------------------------------------- */
.stm-btn-play,
.stm-btn-fullscreen {
    height: 30px;
    border-radius: 4px;
    border: none;
    padding: 0 12px;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
}

.stm-btn-play {
    background: #1a6fc4;
    color: #fff;
}

.stm-btn-play:hover {
    background: #155a9e;
}

.stm-btn-fullscreen {
    background: #fff;
    border: 1px solid #aaa;
    color: #333;
}

.stm-btn-fullscreen:hover {
    background: #f0f0f0;
}

.stm-map-wrapper.stm-fullscreen-active .stm-btn-fullscreen {
    background: #444;
    border-color: #666;
    color: #fff;
}

/* ----------------------------------------------------------------
   Marker-Tooltip (V2.4, unverändert)
   ---------------------------------------------------------------- */
.stm-marker-tooltip {
    background-color: rgba(26, 26, 46, 0.88) !important;
    border: none !important;
    color: #ffffff !important;
    font-family: monospace !important;
    font-size: 12px !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    white-space: nowrap;
}

.stm-marker-tooltip::before {
    border-top-color: rgba(26, 26, 46, 0.88) !important;
}

/* ----------------------------------------------------------------
   V2.5 — L.Control-Panel (Track-Checkboxen auf der Karte)
   ---------------------------------------------------------------- */

/* V2.5: .stm-checkboxes entfernt */

.stm-track-control {
    background: rgba(255, 255, 255, 0.92);
    border-radius: 6px;
    padding: 8px 10px;
    min-width: 160px;
    max-width: 220px;
    max-height: 200px;
    overflow-y: auto;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Vollbildmodus — Panel dunkel */
.stm-map-wrapper.stm-fullscreen-active .stm-track-control {
    background: rgba(30, 30, 30, 0.88);
}

.stm-map-wrapper.stm-fullscreen-active .stm-track-control .stm-track-label {
    color: #fff;
}

/* Track-Label (V2.4 Swatch-Layout, unverändert) */
.stm-track-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 14px;
    user-select: none;
}

/* Farbswatch (V2.4, unverändert) */
.stm-swatch {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    flex-shrink: 0;
}