/**
 * EliteGas Core — панель «Маршрут через заправки» на карте GazMap (модуль gazmap_route).
 * Кнопку «Открыть в Картах», логотип и ссылку на условия Яндекса на карте не перекрываем:
 * панель стоит под картой, а не поверх неё; карта — во всю ширину.
 */
.gm-route-layout { display: flex; flex-direction: column; gap: 12px; margin: 15px 0; }
.gm-route-layout__map { min-width: 0; }
.gm-route-layout__map #gazmap-map { margin: 0 !important; }

.gm-route-panel {
    box-sizing: border-box; padding: 14px 14px 12px; background: #fafafa;
    border: 1px solid #e5e5e7; border-radius: 6px; font-size: 14px; line-height: 1.4;
}
.gm-route-panel h3 { margin: 0 0 6px; font-size: 17px; }
.gm-route-hint { margin: 0 0 10px; color: #8a8a8e; font-size: 13px; }

.gm-route-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px;
    margin: 0 0 10px; padding: 0; list-style: none;
}
.gm-route-list:empty { display: none; }
.gm-route-item {
    display: flex; gap: 8px; align-items: flex-start; padding: 8px; margin: 0;
    background: #fff; border: 1px solid #e5e5e7; border-radius: 6px;
}
.gm-route-item.is-drag { opacity: .4; }
.gm-route-item.is-over { border-color: #1a1a1a; }
.gm-route-num {
    flex: none; width: 22px; height: 22px; border-radius: 50%; background: #da4453; color: #fff;
    font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}
/* «Моё местоположение» — первая точка маршрута */
.gm-route-item--me { background: #f3f8ff; border-color: #cfe0f7; }
.gm-route-item--me .gm-route-num { background: #1e88e5; }
.gm-route-locate {
    margin-top: 4px; padding: 3px 10px; border: 1px solid #1e88e5; border-radius: 4px;
    background: #fff; color: #1e88e5; font-size: 12px; cursor: pointer;
}
.gm-route-body { flex: 1; min-width: 0; }
.gm-route-title { display: block; font-weight: 600; color: #1a1a1a; overflow-wrap: anywhere; }
.gm-route-addr { display: block; color: #8a8a8e; font-size: 12px; overflow-wrap: anywhere; }
.gm-route-dist { display: block; color: #555; font-size: 12px; margin-top: 2px; }
.gm-route-tools { flex: none; display: flex; flex-direction: column; gap: 2px; }
.gm-route-tools button {
    width: 26px; height: 22px; padding: 0; border: 1px solid #ddd; border-radius: 4px;
    background: #fff; color: #333; font-size: 12px; line-height: 1; cursor: pointer;
}
.gm-route-tools button:hover:not(:disabled) { border-color: #1a1a1a; }
.gm-route-tools button:disabled { opacity: .35; cursor: default; }

.gm-route-opts { display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 0 0 8px; font-size: 13px; }
.gm-route-opts label { display: flex; gap: 6px; align-items: center; margin: 0; cursor: pointer; }
.gm-route-total { margin: 0 0 8px; font-size: 13px; color: #555; }
.gm-route-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.gm-route-btn {
    display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 0 12px;
    border: 1px solid #ddd; border-radius: 4px; background: #fff; color: #1a1a1a !important;
    font-size: 13px; text-decoration: none !important; cursor: pointer;
}
.gm-route-btn--main { background: #da4453; border-color: #da4453; color: #fff !important; font-weight: 600; }
.gm-route-btn--main:hover { background: #c23744; }
.gm-route-btn[aria-disabled="true"] { opacity: .45; pointer-events: none; }
.gm-route-note { margin: 8px 0 0; color: #8a8a8e; font-size: 12px; }

.gm-route-start { margin: 2px 0 4px; }
/* «Ближайшие к вам заправки» — быстрый старт маршрута */
.gm-route-near { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; }
.gm-route-near .gm-route-near__btn { margin: 0; padding: 6px 10px; font-size: 13px; text-align: left; }
.gm-route-near__btn span { color: #8a8a8e; }

/* Кнопка в подсказке заправки на карте */
.gm-route-add {
    margin-top: 6px; padding: 4px 10px; border: 1px solid #da4453; border-radius: 4px;
    background: #fff; color: #da4453; font-size: 12px; cursor: pointer;
}
.gm-route-add.is-in { border-color: #2e7d32; color: #2e7d32; }

@media (max-width: 600px) {
    .gm-route-list { grid-template-columns: 1fr; }
    .gm-route-btn--main { flex: 1 1 100%; }
}
