/* Online трек v2: только отличия карты от SVG-варианта. */
/* Базовое оформление берётся из scoreboard.css. */

#scoreboard-app .scoreboard-main {
    position: relative;
}

#scoreboard-app .scoreboard-context-loader {
    position: absolute;
    inset: 0;
    z-index: 50;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(12, 16, 22, 0.52);
    backdrop-filter: blur(2px);
    pointer-events: all;
}

#scoreboard-app .scoreboard-context-loader.active {
    display: flex;
}

#scoreboard-app .scoreboard-context-loader-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 20px 28px;
    border-radius: 12px;
    background: rgba(28, 34, 44, 0.94);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

#scoreboard-app .scoreboard-context-loader-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid rgba(255, 255, 255, 0.18);
    border-top-color: #3a7afe;
    border-radius: 50%;
    animation: scoreboard-context-spin 0.65s linear infinite;
}

#scoreboard-app .scoreboard-context-loader-text {
    color: #e8edf5;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.01em;
}

@keyframes scoreboard-context-spin {
    to {
        transform: rotate(360deg);
    }
}

#scoreboard-app .scoreboard-map-container {
    padding: 0;
    display: block;
}

#scoreboard-app .scoreboard-yandex-map {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

/*
 * Серый режим карты.
 * data-map-grayscale ставится на #scoreboard-app из scoreboard-yandex.js.
 * Фильтр только на ground/layers pane — маркеры и линии в geo-objects не затрагиваются.
 */
#scoreboard-app[data-map-grayscale="1"] [class*="ymaps-"][class*="-ground-pane"],
#scoreboard-app[data-map-grayscale="1"] [class*="-ground-pane"],
#scoreboard-app[data-map-grayscale="1"] [class*="layers-pane"] {
    -webkit-filter: grayscale(100%) saturate(0.9) !important;
    filter: grayscale(100%) saturate(0.9) !important;
}

#scoreboard-app[data-map-grayscale="1"] img.rym-yandex-tile {
    -webkit-filter: grayscale(100%) saturate(0.9) !important;
    filter: grayscale(100%) saturate(0.9) !important;
}

#scoreboard-app .scoreboard-control-btn#scoreboardGrayscaleBtn.active {
    background: rgba(58, 122, 254, 0.28);
    border-color: #5d8dff;
}

/* Скрытие тайлов карты: тёмно-серый фон, маршрут и маркеры остаются. */
#scoreboard-app[data-map-blank="1"] .scoreboard-map-container {
    background: #2a3038;
    box-shadow: none;
}

#scoreboard-app[data-map-blank="1"] [class*="ymaps-"][class*="-ground-pane"],
#scoreboard-app[data-map-blank="1"] [class*="-ground-pane"],
#scoreboard-app[data-map-blank="1"] [class*="layers-pane"],
#scoreboard-app[data-map-blank="1"] #scoreboardYandexMap img[src*="core-renderer-tiles"],
#scoreboard-app[data-map-blank="1"] #scoreboardYandexMap img[src*="/tiles?"] {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

#scoreboard-app .scoreboard-control-btn#scoreboardBlankMapBtn.active {
    background: rgba(42, 47, 56, 0.95);
    border-color: #5c6573;
    color: #c8d0dc;
}

/* Кнопки управления картой и легенда поверх тайлов Яндекса. */
#scoreboard-app .scoreboard-map-toggle-btn,
#scoreboard-app .scoreboard-map-legend,
#scoreboard-app .scoreboard-finished-list {
    z-index: 1200;
}

/* Модалка участника — поверх карты Яндекса и элементов табло. */
#scoreboardParticipantModal.participant-modal {
    z-index: 20000;
}

#scoreboardParticipantModal.participant-modal .modal-content {
    background: var(--panel);
    border-radius: 16px;
    max-width: 760px;
    width: 95%;
    max-height: min(88vh, 920px);
    overflow: hidden;
}

#scoreboardParticipantModal.participant-modal .modal-body {
    overflow-y: auto;
    max-height: calc(min(88vh, 920px) - 120px);
}

/* ===== Таблица участников (Yandex v2): выровненная сетка колонок ===== */
#scoreboard-app.scoreboard-yandex-variant {
    --sb-table-gap: 6px;
    --sb-table-pad-x: 10px;
    --sb-col-vis: 28px;
    --sb-col-pos: 32px;
    --sb-col-num: 44px;
    --sb-col-crew: minmax(0, 1.6fr);
    --sb-col-time: 54px;
    --sb-col-start: minmax(44px, 0.8fr);
    --sb-col-finish: minmax(44px, 0.8fr);
    --sb-col-gap: 46px;
    --sb-col-progress: 76px;
}

#scoreboard-app.scoreboard-yandex-variant.map-hidden {
    --sb-col-gap: 64px;
    --sb-col-progress: 84px;
    --sb-col-start: minmax(58px, 0.9fr);
    --sb-col-finish: minmax(58px, 0.9fr);
}

#scoreboard-app.map-hidden .scoreboard-table-section {
    width: 100%;
    padding: 0 75px 0 0;
}

#scoreboard-app.scoreboard-no-mapvis-col {
    --sb-col-vis: 0;
}

/* Без колонки «глаз»: 8 колонок в разметке — отдельная сетка (иначе «Поз» попадает в 0px-трек). */
#scoreboard-app.scoreboard-yandex-variant.scoreboard-no-mapvis-col .scoreboard-table-header,
#scoreboard-app.scoreboard-yandex-variant.scoreboard-no-mapvis-col .scoreboard-row {
    grid-template-columns:
        var(--sb-col-pos)
        var(--sb-col-num)
        var(--sb-col-crew)
        var(--sb-col-time)
        var(--sb-col-start)
        var(--sb-col-finish)
        var(--sb-col-gap)
        var(--sb-col-progress);
}

#scoreboard-app.scoreboard-no-mapvis-col .map-vis,
#scoreboard-app.scoreboard-no-mapvis-col .scoreboard-mapvis-header {
    display: none !important;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-table-header,
#scoreboard-app.scoreboard-yandex-variant .scoreboard-row {
    grid-template-columns:
        var(--sb-col-vis)
        var(--sb-col-pos)
        var(--sb-col-num)
        var(--sb-col-crew)
        var(--sb-col-time)
        var(--sb-col-start)
        var(--sb-col-finish)
        var(--sb-col-gap)
        var(--sb-col-progress);
    gap: var(--sb-table-gap);
    width: 100%;
    min-width: 100%;
    box-sizing: border-box;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-table-section {
    overflow-x: hidden;
    overflow-y: auto;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-table-header {
    padding: 8px var(--sb-table-pad-x);
    font-size: 10px;
    letter-spacing: 0.3px;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-table-body {
    /* справа запас под hover-сдвиг translateX(4px) */
    padding: 4px 14px 8px var(--sb-table-pad-x);
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-row {
    padding: 7px 8px 7px 0;
    margin-left: 0;
    cursor: pointer;
    position: relative;
    isolation: isolate;
    overflow: visible;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-row::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: transparent;
    pointer-events: none;
    transition: background-color 0.2s ease;
    z-index: 0;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-row > * {
    position: relative;
    z-index: 1;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-row:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 8px var(--shadow-lg);
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-row:hover::before {
    background-color: rgba(255, 255, 255, 0.07);
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-row.selected-multi:hover::before {
    background-color: rgba(255, 255, 255, 0.1);
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-table-header-cell,
#scoreboard-app.scoreboard-yandex-variant .scoreboard-row > * {
    min-width: 0;
}

#scoreboard-app.scoreboard-yandex-variant .pos {
    font-size: 14px;
    padding-right: 6px;
}

#scoreboard-app.scoreboard-yandex-variant .num {
    font-size: 13px;
    padding-left: 2px;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-pos-header {
    padding-right: 6px;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-num-header {
    padding-left: 2px;
}

#scoreboard-app.scoreboard-yandex-variant .crew {
    font-size: 12px;
    gap: 6px;
    min-width: 0;
    overflow: hidden;
}

#scoreboard-app.scoreboard-yandex-variant .time {
    font-size: 13px;
}

#scoreboard-app.scoreboard-yandex-variant .time-sm {
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#scoreboard-app.scoreboard-yandex-variant .gap {
    font-size: 12px;
    white-space: nowrap;
}

#scoreboard-app.scoreboard-yandex-variant .progress-cell {
    min-width: 0;
    padding: 0 3px;
    overflow: visible;
}

#scoreboard-app.scoreboard-yandex-variant .progress-text {
    font-size: 10px;
    margin-top: 2px;
    white-space: nowrap;
    overflow: visible;
}

#scoreboard-app.scoreboard-yandex-variant .map-vis {
    display: flex;
    align-items: center;
    justify-content: center;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin: 0;
    cursor: pointer;
    user-select: none;
    flex-shrink: 0;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle input.scoreboard-mapvis-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-icon {
    font-size: 16px;
    line-height: 1;
    pointer-events: none;
    flex-shrink: 0;
    transition: color 0.15s ease, opacity 0.15s ease;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-icon--on {
    color: #ffffff;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-icon--off {
    color: #9aa7b8;
    opacity: 0.85;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle:has(input:checked) .scoreboard-mapvis-icon--on {
    display: inline-block;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle:has(input:checked) .scoreboard-mapvis-icon--off {
    display: none;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle:has(input:not(:checked)) .scoreboard-mapvis-icon--on {
    display: none;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle:has(input:not(:checked)) .scoreboard-mapvis-icon--off {
    display: inline-block;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle--master:has(input:indeterminate) .scoreboard-mapvis-icon--on {
    display: inline-block;
    opacity: 0.75;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-toggle--master:has(input:indeterminate) .scoreboard-mapvis-icon--off {
    display: none;
}

#scoreboard-app.scoreboard-yandex-variant .scoreboard-mapvis-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

#scoreboard-app.scoreboard-yandex-variant .progress-bar-container {
    width: 80%;
    height: 5px;
}

@media (max-width: 1400px) {
    #scoreboard-app.scoreboard-yandex-variant {
        --sb-col-time: 54px;
        --sb-col-gap: 48px;
        --sb-col-progress: 62px;
    }
}

@media (max-width: 1024px) {
    #scoreboard-app.scoreboard-yandex-variant {
        --sb-table-gap: 8px;
        --sb-col-pos: 32px;
        --sb-col-num: 44px;
        --sb-col-time: 50px;
        --sb-col-gap: 44px;
        --sb-col-progress: 58px;
    }

    #scoreboard-app.scoreboard-yandex-variant .crew {
        font-size: 11px;
    }
}
