/* 地铁线路颜色样式 - 根据上海地铁官方色彩标准 */

/* 1号线 - 正红色 */
.metro-line-1,
.metro-1号线 {
    color: rgb(234, 27, 57) !important;
    background-color: rgb(234, 27, 57) !important;
}

/* 2号线 - 翠绿色 */
.metro-line-2,
.metro-2号线 {
    color: rgb(139, 196, 63) !important;
    background-color: rgb(139, 196, 63) !important;
}

/* 3号线 - 明黄色 */
.metro-line-3,
.metro-3号线 {
    color: rgb(251, 210, 8) !important;
    background-color: rgb(251, 210, 8) !important;
}

/* 4号线 - 薰衣草紫色 */
.metro-line-4,
.metro-4号线 {
    color: rgb(81, 45, 141) !important;
    background-color: rgb(81, 45, 141) !important;
}

/* 5号线 - 紫红色 */
.metro-line-5,
.metro-5号线 {
    color: rgb(144, 86, 163) !important;
    background-color: rgb(144, 86, 163) !important;
}

/* 6号线 - 品红色 */
.metro-line-6,
.metro-6号线 {
    color: rgb(214, 24, 112) !important;
    background-color: rgb(214, 24, 112) !important;
}

/* 7号线 - 橙色 */
.metro-line-7,
.metro-7号线 {
    color: rgb(244, 113, 33) !important;
    background-color: rgb(244, 113, 33) !important;
}

/* 8号线 - 蓝色 */
.metro-line-8,
.metro-8号线 {
    color: rgb(0, 158, 219) !important;
    background-color: rgb(0, 158, 219) !important;
}

/* 9号线 - 天蓝色 */
.metro-line-9,
.metro-9号线 {
    color: rgb(121, 201, 238) !important;
    background-color: rgb(121, 201, 238) !important;
}

/* 10号线 - 淡紫色 */
.metro-line-10,
.metro-10号线 {
    color: rgb(189, 168, 211) !important;
    background-color: rgb(189, 168, 211) !important;
}

/* 11号线 - 棕色 */
.metro-line-11,
.metro-11号线 {
    color: rgb(127, 33, 49) !important;
    background-color: rgb(127, 33, 49) !important;
}

/* 12号线 - 深绿色 */
.metro-line-12,
.metro-12号线 {
    color: rgb(1, 124, 103) !important;
    background-color: rgb(1, 124, 103) !important;
}

/* 13号线 - 粉色 */
.metro-line-13,
.metro-13号线 {
    color: rgb(232, 149, 193) !important;
    background-color: rgb(232, 149, 193) !important;
}

/* 14号线 - 橄榄绿色 */
.metro-line-14,
.metro-14号线 {
    color: rgb(94, 92, 41) !important;
    background-color: rgb(94, 92, 41) !important;
}

/* 15号线 - 香槟金色 */
.metro-line-15,
.metro-15号线 {
    color: rgb(187, 167, 134) !important;
    background-color: rgb(187, 167, 134) !important;
}

/* 16号线 - 水绿色 */
.metro-line-16,
.metro-16号线 {
    color: rgb(142, 209, 192) !important;
    background-color: rgb(142, 209, 192) !important;
}

/* 17号线 - 浅棕色 */
.metro-line-17,
.metro-17号线 {
    color: rgb(184, 121, 116) !important;
    background-color: rgb(184, 121, 116) !important;
}

/* 18号线 - 土黄色 */
.metro-line-18,
.metro-18号线 {
    color: rgb(186, 160, 81) !important;
    background-color: rgb(186, 160, 81) !important;
}

/* 浦江线 - 灰色 */
.metro-line-pujiang,
.metro-浦江线 {
    color: rgb(128, 128, 128) !important;
    background-color: rgb(128, 128, 128) !important;
}

/* 磁浮线 - 黄绿组合色（显示为金黄色） */
.metro-line-maglev,
.metro-磁浮线 {
    color: rgb(255, 215, 0) !important;
    background-color: rgb(255, 215, 0) !important;
}

/* 地铁标签样式 */
.metro-tag {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: bold;
    color: white !important;
    margin: 2px;
    text-decoration: none;
}

/* 地铁线路圆形标签 */
.metro-circle {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    font-size: 10px;
    font-weight: bold;
    color: white !important;
    margin: 2px;
}

/* 地铁线路矩形标签 */
.metro-rect {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    color: white !important;
    margin: 2px;
    text-decoration: none;
}

/* 仅文字颜色，不设置背景 */
.metro-text-only {
    background: none !important;
    padding: 0 !important;
    margin: 0 2px !important;
    font-weight: bold;
}

/* 列表页地铁图标和悬浮提示 */
.metro-icon-container {
    display: inline-block;
    position: relative;
    margin-left: 8px;
    vertical-align: middle;
}

.metro-icon {
    display: inline-block !important;
    width: 18px !important;
    height: 18px !important;
    background: #666 !important;
    border-radius: 50% !important;
    text-align: center !important;
    line-height: 18px !important;
    font-size: 11px !important;
    color: white !important;
    cursor: pointer !important;
    font-weight: bold !important;
}

.metro-arrow {
    display: inline-block !important;
    margin-left: 6px !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 5px solid #666 !important;
    border-top: 4px solid transparent !important;
    border-bottom: 4px solid transparent !important;
    cursor: pointer !important;
}

/* 悬浮提示框 */
.metro-tooltip {
    position: absolute !important;
    bottom: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: rgba(255, 255, 255, 0.95) !important;
    color: #333 !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    z-index: 1000 !important;
    margin-bottom: 5px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    pointer-events: none !important;
    height: auto !important;
}

.metro-icon-container:hover .metro-tooltip,
.metro-tooltip.tooltip-visible {
    opacity: 1 !important;
    visibility: visible !important;
}

/* 地铁线路项目样式 */
.metro-line-item {
    display: inline-block !important;
    padding: 3px 8px !important;
    margin: 0 3px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    color: white !important;
    background: #666 !important;
    font-weight: bold !important;
    text-align: center !important;
    min-width: 40px !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
}

/* 详情页地铁线路样式 */
.metro-line {
    display: inline-block !important;
    padding: 3px 8px !important;
    margin: 0 2px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    color: white !important;
    background: #666 !important;
    font-weight: bold !important;
    text-align: center !important;
    min-width: 40px !important;
    max-width: 80px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
}

/* 地铁线路官方颜色优先级 */
.metro-tooltip .metro-line-item[class*="metro-"] {
    color: white !important;
}

/* 确保官方颜色能够覆盖默认样式 */
.metro-tooltip .metro-line-item.metro-1号线,
.metro-tooltip .metro-line-item.metro-line-1 {
    background-color: rgb(234, 27, 57) !important;
}

.metro-tooltip .metro-line-item.metro-2号线,
.metro-tooltip .metro-line-item.metro-line-2 {
    background-color: rgb(139, 196, 63) !important;
}

.metro-tooltip .metro-line-item.metro-3号线,
.metro-tooltip .metro-line-item.metro-line-3 {
    background-color: rgb(251, 210, 8) !important;
}

.metro-tooltip .metro-line-item.metro-4号线,
.metro-tooltip .metro-line-item.metro-line-4 {
    background-color: rgb(81, 45, 141) !important;
}

.metro-tooltip .metro-line-item.metro-5号线,
.metro-tooltip .metro-line-item.metro-line-5 {
    background-color: rgb(144, 86, 163) !important;
}

.metro-tooltip .metro-line-item.metro-6号线,
.metro-tooltip .metro-line-item.metro-line-6 {
    background-color: rgb(214, 24, 112) !important;
}

.metro-tooltip .metro-line-item.metro-7号线,
.metro-tooltip .metro-line-item.metro-line-7 {
    background-color: rgb(244, 113, 33) !important;
}

.metro-tooltip .metro-line-item.metro-8号线,
.metro-tooltip .metro-line-item.metro-line-8 {
    background-color: rgb(0, 158, 219) !important;
}

.metro-tooltip .metro-line-item.metro-9号线,
.metro-tooltip .metro-line-item.metro-line-9 {
    background-color: rgb(121, 201, 238) !important;
}

.metro-tooltip .metro-line-item.metro-10号线,
.metro-tooltip .metro-line-item.metro-line-10 {
    background-color: rgb(189, 168, 211) !important;
}

.metro-tooltip .metro-line-item.metro-11号线,
.metro-tooltip .metro-line-item.metro-line-11 {
    background-color: rgb(127, 33, 49) !important;
}

.metro-tooltip .metro-line-item.metro-12号线,
.metro-tooltip .metro-line-item.metro-line-12 {
    background-color: rgb(1, 124, 103) !important;
}

.metro-tooltip .metro-line-item.metro-13号线,
.metro-tooltip .metro-line-item.metro-line-13 {
    background-color: rgb(232, 149, 193) !important;
}

.metro-tooltip .metro-line-item.metro-14号线,
.metro-tooltip .metro-line-item.metro-line-14 {
    background-color: rgb(94, 92, 41) !important;
}

.metro-tooltip .metro-line-item.metro-15号线,
.metro-tooltip .metro-line-item.metro-line-15 {
    background-color: rgb(187, 167, 134) !important;
}

.metro-tooltip .metro-line-item.metro-16号线,
.metro-tooltip .metro-line-item.metro-line-16 {
    background-color: rgb(142, 209, 192) !important;
}

.metro-tooltip .metro-line-item.metro-17号线,
.metro-tooltip .metro-line-item.metro-line-17 {
    background-color: rgb(184, 121, 116) !important;
}

.metro-tooltip .metro-line-item.metro-18号线,
.metro-tooltip .metro-line-item.metro-line-18 {
    background-color: rgb(186, 160, 81) !important;
}

/* 提示框箭头 */
.metro-tooltip::after {
    content: '' !important;
    position: absolute !important;
    bottom: -5px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 5px solid transparent !important;
    border-right: 5px solid transparent !important;
    border-top: 5px solid rgba(255, 255, 255, 0.95) !important;
}

/* 详情页地铁线路颜色样式 */
.metro-line.metro-1号线,
.metro-line.metro-line-1 {
    background-color: rgb(234, 27, 57) !important;
}

.metro-line.metro-2号线,
.metro-line.metro-line-2 {
    background-color: rgb(139, 196, 63) !important;
}

.metro-line.metro-3号线,
.metro-line.metro-line-3 {
    background-color: rgb(251, 210, 8) !important;
}

.metro-line.metro-4号线,
.metro-line.metro-line-4 {
    background-color: rgb(81, 45, 141) !important;
}

.metro-line.metro-5号线,
.metro-line.metro-line-5 {
    background-color: rgb(144, 86, 163) !important;
}

.metro-line.metro-6号线,
.metro-line.metro-line-6 {
    background-color: rgb(214, 24, 112) !important;
}

.metro-line.metro-7号线,
.metro-line.metro-line-7 {
    background-color: rgb(244, 113, 33) !important;
}

.metro-line.metro-8号线,
.metro-line.metro-line-8 {
    background-color: rgb(0, 158, 219) !important;
}

.metro-line.metro-9号线,
.metro-line.metro-line-9 {
    background-color: rgb(121, 201, 238) !important;
}

.metro-line.metro-10号线,
.metro-line.metro-line-10 {
    background-color: rgb(189, 168, 211) !important;
}

.metro-line.metro-11号线,
.metro-line.metro-line-11 {
    background-color: rgb(127, 33, 49) !important;
}

.metro-line.metro-12号线,
.metro-line.metro-line-12 {
    background-color: rgb(1, 124, 103) !important;
}

.metro-line.metro-13号线,
.metro-line.metro-line-13 {
    background-color: rgb(232, 149, 193) !important;
}

.metro-line.metro-14号线,
.metro-line.metro-line-14 {
    background-color: rgb(94, 92, 41) !important;
}

.metro-line.metro-15号线,
.metro-line.metro-line-15 {
    background-color: rgb(187, 167, 134) !important;
}

.metro-line.metro-16号线,
.metro-line.metro-line-16 {
    background-color: rgb(142, 209, 192) !important;
}

.metro-line.metro-17号线,
.metro-line.metro-line-17 {
    background-color: rgb(184, 121, 116) !important;
}

.metro-line.metro-18号线,
.metro-line.metro-line-18 {
    background-color: rgb(186, 160, 81) !important;
}