.content-universal-block-overflow .static-map-distances-container {
    border-radius: 5px 5px 0 0;

}

.static-map-distances-container.static-map-distances-container-full {
    border: 1px solid rgba(241, 241, 241, 1) !important;
    border-radius: 10px;
    background-color: #fff;
    overflow: hidden;
}

.static-map-distances-container.static-map-distances-container-full .static-map-container {
    border-radius: 10px 10px 0 0;
}
.static-map-container {
    position: relative;
    width: 100%;
    height: 300px;
    background: #f0f0f0;
    overflow: hidden;
    border-radius: 5px 5px 0 0;
    cursor: move;
    touch-action: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.static-map-container::after {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid #ccc;
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
    transition: opacity 0.3s;
    opacity: 0;
}
.static-map-container.map-passthrough::after {
    opacity: 1;
}
.static-map-container.map-passthrough #mapDiv {
    pointer-events: none;
}
.map-top-left-info {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 6;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    pointer-events: none;
}
.map-top-left-info .status-bar {
    position: static;
    top: auto;
    left: auto;
    z-index: auto;
}
.map-button-container {
    position: absolute;
    bottom: 10px; /* Position near the bottom */
    left: 50%; /* Center horizontally */
    transform: translateX(-50%); /* Offset to center */
    display: flex;
    gap: 16px; /* Space between buttons */
    z-index: 1;
}
.static-map-container > img {
    position: absolute;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}
.static-map-container.dragging {
    cursor: grabbing;
}
.status-bar {
    background: rgba(255,255,255,0.8);
    padding: 0 8px;
    display: flex;
    align-items: center;        /* Vertically centers items */
    justify-content: center;    /* Horizontally centers items */
    border-radius: 5px;
    position: absolute;
    gap:8px;
    top: 10px;
    left: 10px;
    z-index: 1;
    font-size: 14px;
    line-height: 27px;
    border: 1px solid #ddd;
    color: #279400;
}
.status-bar-inaccurate {
    color:#F1A13E;
}
.status-bar img {
    display: inline-block;
    vertical-align: middle;
}
.map-button, .gallery-map-button {
    background: rgba(255,255,255,0.8);
    padding: 8px 0;
    border: 1px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 14px;
    z-index: 1;
    min-width: 90px;
    text-align: center;
    color:#777;
    line-height: 20px;
    width:135px;
}

.gallery-map-button {
    width: 120px;
    height: 85px;
    min-width: 120px;
    min-height: 85px;
    border: 1px solid rgba(221, 221, 221, 1);
    border-radius: 5px;
    opacity: 0.9;
    background-color: rgba(255, 255, 255, 1);
}

.no-map-background .gallery-map-button {
    background-image: url('/static/img/object/gallery-button-background.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 403px auto;
    width:250px;
}

.map-button-icon {
    width: 24px; /* Set a consistent size for the icons */
    height: 24px;
}
.distances-grid {
    display: flex;
    align-items: stretch;
    padding: 0;
    border-bottom: 1px solid #eee;
    position: relative;
}

.distances-tabs-wrapper {
    display: flex;
    overflow-x: auto;
    flex: 1;
    min-width: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.distances-tabs-wrapper::-webkit-scrollbar {
    display: none;
}

.distances-scroll-btn {
    display: none;
    flex-shrink: 0;
    width: 30px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: #fff;
    border: none;
    border-bottom: 1px solid #ddd;
    padding: 0;
    z-index: 1;
}

.distances-scroll-btn.visible {
    display: flex;
}

.distances-scroll-btn img {
    width: 10px;
    height: 19px;
}

.distances-scroll-btn--back img {
    transform: scaleX(-1);
}

.distance-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px;
    cursor: pointer;
    text-align: center;
    position: relative;
    white-space: nowrap;
    flex: 1 0 0;
    min-width: 88px;
    border-bottom: 1px solid #ddd;
}

.static-map-distances-container-mobile .distance-item {
    text-align: center;
    justify-content: center;
}

.distance-item.active {
    border-bottom: 2px solid #D9111B;
}

.distance-item.active::after {
    display: none;
}

.static-map-distances-container-mobile .distance-item.active::after {
    display: none;
}

.distance-icon {
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
}

.distance-icon--active {
    display: none;
}

.distance-icon--passive {
    display: inline-block;
}

.distance-item.active .distance-icon--active {
    display: inline-block;
}

.distance-item.active .distance-icon--passive {
    display: none;
}

.distance-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

.distance-label {
    font-size: 11px;
    color: #999;
    margin-bottom: 0;
}

.static-map-distances-container-mobile .distance-label {
    font-size: 13px;
}

.distance-value {
    font-size: 14px;
    color: #999;
    font-weight: bold;
}

.static-map-distances-container-mobile .distance-value {
    font-size: 13px;
}

.distance-item.active .distance-label {
    color: #333;
}

.distance-item.active .distance-value {
    font-size: 14px;
    color: #333;
    font-weight: bold;
}


.static-map-distances-container-mobile .distance-item.active  .distance-value {
    font-size: 13px;
}

/* Default (inactive) icons */
.distance-item[data-category="darzeliai"] .distance-icon {
    background-image: url('/static/svg/object/icon_kinder_grey.svg');
}

.distance-item[data-category="mokyklos"] .distance-icon {
    background-image: url('/static/svg/object/icon_school_grey.svg');
}

.distance-item[data-category="aukstosios_mokyklos"] .distance-icon {
    background-image: url('/static/svg/object/icon_school_grey.svg');
}

.distance-item[data-category="parduotuves"] .distance-icon {
    background-image: url('/static/svg/object/icon_store_grey.svg');
}

.distance-item[data-category="stoteles"] .distance-icon {
    background-image: url('/static/svg/object/icon_bus_grey.svg');
}

/* Active icons */
.distance-item.active[data-category="darzeliai"] .distance-icon {
    background-image: url('/static/svg/object/icon_kinder_red.svg');
}

.distance-item.active[data-category="mokyklos"] .distance-icon {
    background-image: url('/static/svg/object/icon_school_red.svg');
}

.distance-item.active[data-category="aukstosios_mokyklos"] .distance-icon {
    background-image: url('/static/svg/object/icon_school_red.svg');
}

.distance-item.active[data-category="parduotuves"] .distance-icon {
    background-image: url('/static/svg/object/icon_store_red.svg');
}

.distance-item.active[data-category="stoteles"] .distance-icon {
    background-image: url('/static/svg/object/icon_bus_red.svg');
}

/* Default (inactive) icons - new categories */
.distance-item[data-category="parks"] .distance-icon {
    background-image: url('/static/svg/object/icon_park_grey.svg');
}

.distance-item[data-category="pharmacies"] .distance-icon {
    background-image: url('/static/svg/object/icon_pharmacy_grey.svg');
}

.distance-item[data-category="sports"] .distance-icon {
    background-image: url('/static/svg/object/icon_sport_grey.svg');
}

/* Active icons - new categories */
.distance-item.active[data-category="parks"] .distance-icon {
    background-image: url('/static/svg/object/icon_park_red.svg');
}

.distance-item.active[data-category="pharmacies"] .distance-icon {
    background-image: url('/static/svg/object/icon_pharmacy_red.svg');
}

.distance-item[data-category="medical"] .distance-icon {
    background-image: url('/static/svg/object/icon_medical_institution_grey.svg');
}

.distance-item.active[data-category="medical"] .distance-icon {
    background-image: url('/static/svg/object/icon_medical_institution_red.svg');
}

.distance-item.active[data-category="sports"] .distance-icon {
    background-image: url('/static/svg/object/icon_sport_red.svg');
}

.locations-list {
    padding: 20px;
}
.location-item {
    display: flex;
    align-items: baseline;
    padding: 6px 0;
    font-size: 14px;
    line-height: 20px;
    color:#333;
    position: relative;
    gap: 0;
}
.location-item .cell-small-info {
    font-size: 14px;
    line-height: 20px;
    color: #333;
}
.location-name {
    font-size: 14px;
    color:#333;
    padding-right: 16px;
}
.location-distance {
    font-size: 14px;
    color:#333;
    font-weight: bold;
    white-space: nowrap;
    min-width: 72px;
    flex-shrink: 0;
}

.routes-container {
    display: inline-block;
    white-space: normal;
    overflow: visible;
}

.location-item .route-title {
    left:-32px;
}

.location-item .route-type-2 {
    background: #0073ac;
    border-color: #0073ac;
    color: #fff;
}

.location-item .route-type-private {
    background: #999;
    border-color: #999;
    color: #fff;
}

.location-item .route-type-1 {
    background: green;
    border-color: green;
    color: #fff;
}

.location-item .route-type-4 {
    background: #303030;
    border-color: #303030;
    color: #fff;
}

.location-item .route-type-3 {
    background: #dc3131;
    border-color: #dc3131;
    color: #fff;
}

.location-item .route-type-5 {
    background: green;
    border-color: green;
    color: #fff;
}

.location-item > a {
    color:#333;
}

.distance-info-mobile {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center; /* This ensures text is centered under the icon */
}

.static-map-distances-container-mobile .distances-grid {
    padding: 0;
}

.static-map-distances-container-mobile .distance-info {
    align-items: center;
}

.static-map-distances-container-mobile .distance-label {
    font-size: 13px; /* or inherit from existing */
    color: #999;
    margin-bottom: 0px; /* Spacing between label and value */
}

.static-map-distances-container-mobile .distance-value {
    font-size: 13px; /* Adjust as needed for mobile */
    font-weight: bold;
    color: #999;
}

.static-map-distances-container-mobile .distance-item.active .distance-label {
    color:#333;
    font-weight: bold;
}


.statistic-container-full {
    border: 1px solid rgba(221, 221, 221, 1);
    border-radius: 10px;
    margin-bottom:30px;
}

.statistic-container-full .distances-grid {
    padding: 0;
}

.statistic-container-full .distance-item {
    padding-top: 0;
}

/* 1. Hide the actual radio buttons */
.tab-state {
    display: none;
}

/* 2. Hide all content sections by default */
.stats-tab-content {
    display: none;
}

.stats-tab-small-title {
    line-height: 16px;
    color: rgba(51, 51, 51, 1);
    font-size: 14px;
    font-weight: 400;
}

.stats-tab-statistic-info-row {
    display: flex;
    flex-wrap: wrap;
    gap:3px;
    margin-top:16px;
}

.stats-tab-info-item {
    flex: 1 1 calc(50% - 3px);
    box-sizing: border-box;
}

.stats-tab-info-num {
    display: inline-block;
    min-width: 30px;
    line-height: 25px;
    text-align: center;
    border-radius: 15px;
    padding:0 10px;
    background-color: rgba(242, 242, 242, 1);
    margin-right: 5px;

    color: rgba(51, 51, 51, 1);
    font-size: 14px;
    font-weight: bold;
}

.stats-tab-info-num-sub {
    color: rgba(153, 153, 153, 1);
    font-size: 12px;
    font-weight: 400;
}

.stats-tab-chart-info {
    line-height: 16px;
    color: rgba(51, 51, 51, 1);
    font-size: 14px;
    font-weight: 400;
    margin:20px 0;
}

.stats-tab-chart-info-sub {
    line-height: 14px;
    color: rgba(153, 153, 153, 1);
    font-size: 12px;
    font-weight: 400;
}

/* 3. LOGIC: Show content based on which radio is checked */
#tab-heating:checked ~ .locations-list #content-heating,
#tab-crime:checked ~ .locations-list #content-crime,
#tab-air:checked ~ .locations-list #content-air,
#tab-prices:checked ~ .locations-list #content-prices {
    display: block;
}

#tab-heating:checked ~ .distances-grid label[for="tab-heating"]:after,
#tab-crime:checked ~ .distances-grid label[for="tab-crime"]:after,
#tab-air:checked ~ .distances-grid label[for="tab-air"]:after,
#tab-prices:checked ~ .distances-grid label[for="tab-prices"]:after {
    content: '';
    position: absolute;
    bottom: -18px;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #D9111B;
}

.distance-item[data-category="heating"] .distance-icon {
    background-image: url('/static/svg/object/icon_heating_grey.svg');
}

.distance-item[data-category="crime"] .distance-icon {
    background-image: url('/static/svg/object/icon_crime_grey.svg');
}

.distance-item[data-category="air"] .distance-icon {
    background-image: url('/static/svg/object/air_pollution_icon_grey.svg');
}

#tab-heating:checked ~ .distances-grid .distance-item[data-category="heating"] .distance-icon {
    background-image: url('/static/svg/object/icon_heating.svg');
}

#tab-crime:checked ~ .distances-grid .distance-item[data-category="crime"] .distance-icon {
    background-image: url('/static/svg/object/icon_crime.svg');
}

#tab-air:checked ~ .distances-grid .distance-item[data-category="air"] .distance-icon {
    background-image: url('/static/svg/object/air_pollution_icon.svg');
}

.statistic-container-full .air-pollution__tip {
    display: none;
}
.statistic-container-full .air-pollution__graph__item:hover .air-pollution__tip {
    display: inline-block;
}

.locations-list.stats-content-container {
    padding-bottom: 0;
}

.statistic-container-full .statistic-info-row {
    margin-bottom: 0;
}

.statistic-container-full .air-pollution__wrapper {
    gap: 16px;
}

.statistic-container-full .air-pollution__column {
    width: 100%;
}

.statistic-container-full .air-pollution__graph {
    width: 100%;
}

.statistic-container-full .air-pollution__graph__item {
    width: 25%;
}

/* Custom SVG map markers */
.map-marker {
    cursor: pointer;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.map-marker__icon {
    filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.25));
    cursor: pointer;
    display: block;
}

/* Tooltip is rendered as an overlay on #mapDiv via JS */

@media print {
    .static-map-container {
        overflow: hidden !important;
    }
}
