/* 公园导览地图专用样式 - 使用map-前缀避免样式冲突 */

/* 地图容器样式 */
.map-container {
    max-width: 1200px;
    margin: 0 auto;
}

.map-header {
    text-align: center;
    margin-bottom: 20px;
}

.map-title {
    color: #2c3e50;
    margin-bottom: 10px;
    font-size: 24px;
}

.map-description {
    color: #7f8c8d;
    font-size: 14px;
}

.park-map {
    width: 100%;
    height: 63vh; float: left;
    border-radius: 0;
    box-shadow: 0 0px 0px rgba(0,0,0,0.1);
    margin-bottom: 0px;
    background-color: #d6f4fc;
}

/* 控制面板样式 */
.map-control-panel { display: none;
    background: white;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin-bottom: 20px;
}

.map-filter-title {
    font-weight: bold;
    margin-bottom: 10px;
    color: #2c3e50;
}

.map-filter-group {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.map-filter-item {
    display: flex;
    align-items: center;
}

.map-filter-item input {
    margin-right: 5px;
}

.map-filter-item label {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
}

.map-color-indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 5px;
    border: 1px solid #ddd;
}

.map-action-buttons {
    margin-top: 10px;
    display: flex;
    gap: 10px;
}

.map-action-button {
    background: #3498db;
    color: white;
    border: none;
    padding: 5px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
}

.map-action-button:hover {
    background: #2980b9;
}

/* 弹窗样式优化 */
.map-popup .leaflet-popup-content-wrapper {
background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, .7) 90%, rgba(255, 255, 255, .1));float: left; 
}
.leaflet-popup-content-wrapper {border-radius:0;}

.map-popup .leaflet-popup-content {
    margin: 0px; padding:30px 30px 35px 30px; float: left; width: 300px;
    font-family: "Microsoft YaHei", "SimHei", sans-serif;
}

.map-popup-title {
/*    font-size: 26px;
    font-weight: bold;
    color: #2c3e50;
    margin-bottom: 5px;
    border-bottom: 2px solid #3498db;
    padding-bottom: 5px;*/
	font-size: 22px; font-weight: 600;line-height: 1.5em; display: inline-block; background: linear-gradient(90deg, #008cd6, #009944); -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent; background-size: 100% auto; margin-bottom: 15px; 
}

.map-popup-english { 
    font-size: 14px;
    color: #7f8c8d;
    margin-bottom: 8px;
    border-bottom: 1px dashed #ecf0f1;
    padding-bottom: 5px;
}
.map-popup-title b { padding: 0 5px; font-weight: 600; }

.map-popup-image {
    width: 100%;
    height: 16vh;
    object-fit: cover;
    border-radius: 0px;
    margin-bottom: 10px;
}
.map-popup-no-image {
    margin-bottom: 10px;
}

.map-popup-description {
/*    color: #555;
    line-height: 1.5;
    font-size: 16px;
    max-height: 200px;
    overflow-y: auto;*/
	width: 100%; float: left; font-size: 16px; line-height: 1.8em; color:#666; margin-bottom: 20px; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 4; overflow:hidden;
}

.map-popup-category {
    display: none;
    background: #3498db;
    color: white;
    padding: 5px 10px;
    border-radius: 12px;
    font-size: 14px;
    margin-top: 8px;
}
/* 分类标签样式 */
.map-category-tag {
    display: inline-block;
    background: #3498db;
    color: white;
    padding: 5px 10px;
    border-radius: 12px;
    font-size: 14px;
    margin-top: 8px;
}

.map-popup .leaflet-container a.leaflet-popup-close-button {
    width:48px;
    height:48px;
    font: 48px/48px Tahoma, Verdana, sans-serif;
}

/* 自定义标记图标 - 包含名称 */
.map-custom-marker {
    position: relative;
    text-align: center;
    width: 60px;
    height: 40px;
}

.map-marker-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
    margin: 0 auto;
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
}

.map-marker-label {
    position: absolute;
    top: -2px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255,255,255,.8);
    padding:2px 6px 0 6px;
	border-radius:3px;
	box-shadow: 0 2px 6px rgba(0,0,0,.3);
    font-size: 1rem;
    line-height:1.5em;
    font-weight: bold;
    white-space: nowrap;
    color: #233f8a;
    z-index: 1000;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 隐藏Leaflet版权信息 */
.park-map .leaflet-control-attribution {
    display: none !important;
}
.map-popup-actions {
    margin-top: 10px;
    text-align: center;
}

.map-detail-button {
    display: inline-block;
    color:#fff;
    padding: 8px 16px;
    border-radius: 0px;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
 
}
.map-popup-actions a {color: #fff; background:linear-gradient(120deg, rgba(0,153,68,1), rgba(0,140,214,1)); transition: background-color 0.3s; font-size: 14px;
    font-weight: bold; display: inline-block;}
.map-popup-actions a:hover {  background: linear-gradient(to right, rgba(245, 164, 35, 1), rgba(236, 102, 82, 1)); }

.map-detail-button:hover {
    background: #c0392b;
    color: white;
    text-decoration: none;
}

.map-popup-footer {
/*    display: flex;
    justify-content: space-between;
    align-items: center;*/

}

/* 响应式设计 */
@media (max-width: 768px) {
    .park-map {
        height:70vh;
    }
    
    .map-title {
        font-size: 20px;
    }
    
    .map-filter-group {
        flex-direction: column;
        gap: 8px;
    }
    
    .map-marker-label {
        font-size: .85rem;
        padding: 1px 4px;

    }
    
    .map-popup .leaflet-popup-content {
 width: 250px;
padding:25px 25px 35px 25px; 
    }
    
    .map-popup-title {
width: 85%; float: left; font-size:1.05rem; font-weight: 600;line-height: 1.5em; display: inline-block;  margin-bottom: .7rem;
    }
	
	.map-popup-image {
    height: auto;
}

.map-popup-description {

width: 100%; float: left; font-size: .85rem; line-height: 1.8em; color:#666; margin-bottom: 1rem; display:-webkit-box; text-overflow:ellipsis;  -webkit-box-orient:vertical;  -webkit-line-clamp: 4; overflow:hidden;
}

	
	
	
    .map-popup-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .map-popup-actions {
/*        text-align: left;
        width: 100%;*/
    }
	
    .map-popup-actions a { font-size: .85rem; font-weight: normal;}


	
    .map-detail-button {
        display: block;
        text-align: center;
    }
}