#map {height:100%; width:100%;}
.performance-notice div::before {content:"⚠️"; margin-right:8px; font-size:16px; vertical-align:middle;}

/* 指数速查日期输入框 */
.qckqry {background:rgba(0, 40, 80, 0.7); border-radius:12px; padding:5px; margin:5px auto;
	max-width:800px; box-shadow:0 5px 25px rgba(0, 0, 0, 0.4); border:1px solid rgba(0, 150, 255, 0.3);
}
.qckqry::before {content:"🗓️"; font-size:1.8rem; display:block; text-align:center; margin-bottom:15px;}
.date-container {display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:15px;}
.date-input-wrapper {position:relative; flex:1; min-width:120px; max-width:200px;}
.date-input {width:100%; padding:8px 10px; background:rgba(0, 20, 40, 0.8); border:1px solid #0288d1; border-radius:8px;
    color:#e1f5fe; font-size:1.1rem; text-align:center; transition:all 0.3s ease; outline:none; box-shadow:0 0 10px rgba(2, 136, 209, 0.3);
}
.date-input:focus {border-color:#4fc3f7; box-shadow:0 0 15px rgba(79, 195, 247, 0.5);}
.date-divider {font-size:1.8rem; color:#4fc3f7; font-weight:bold;}

.info-icon-container {position:absolute; bottom:4px; left:4px; z-index:1000; background:rgba(0, 40, 80, 0.8);
    border-radius:50%; width:32px; height:32px; display:flex; align-items:center; justify-content:center;
    cursor:pointer; box-shadow:0 0 15px rgba(0, 0, 0, 0.5); border:1px solid rgba(0, 150, 255, 0.5); transition:all 0.3s ease;
}
.info-icon-container:hover {transform:scale(1.1); background:rgba(0, 60, 120, 0.9); box-shadow:0 0 20px rgba(79, 195, 247, 0.7);}
.info-icon {font-size:28px; color:#4fc3f7; font-weight:bold; text-shadow:0 0 10px rgba(79, 195, 247, 0.7);}
/* 覆盖层样式 */
#info-overlay {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 20, 40, 0.7);
    z-index:2000; display:none; overflow:hidden; padding:30px; backdrop-filter:blur(5px);
}
.overlay-content {max-width:1200px; margin:0 auto; background:rgba(0, 30, 60, 0.8); border-radius:20px; padding:30px;
    box-shadow:0 15px 50px rgba(0, 0, 0, 0.5); border:1px solid rgba(0, 150, 255, 0.3); position: relative; overflow:hidden;
}
.close-btn {position:absolute; top:2px; right:2px; width:40px; height:40px; background:rgba(207, 0, 15, 0.8);
    border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:bold;
    cursor:pointer; transition:all 0.3s ease; box-shadow:0 0 10px rgba(255, 0, 0, 0.5); border:1px solid rgba(255, 100, 100, 0.5);
}
.close-btn:hover {transform:rotate(90deg); background:rgba(255, 0, 0, 0.9);}
.info-cards {
	-webkit-overflow-scrolling:touch; overscroll-behavior:contain; /* 防止滚动传播到父元素 */
	overflow-y:auto; padding:0 20px 20px; max-height:52vh !important;
 	-webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;     /* 防止滚动穿透 */
}
       
.info-cards:hover {transform:translateY(-5px); border-color:#4fc3f7;}
.info-card {margin-bottom:20px;}
.header {text-align:center; margin-bottom:40px; padding:8px;}
p.card-content {text-align:left;}
.section-title {font-size:2.8rem; margin-bottom:15px; color:#fff; text-shadow:0 2px 10px rgba(0, 100, 255, 0.5);}
.section-sub-title {font-size:2.2rem; margin-bottom:10px; /*color:#4fc3f7;*/}
.section-sub-title i {/*color:#ffcc80;*/ font-style:normal; font-weight:normal; text-shadow:0 0 10px rgba(255, 204, 128, 0.5);}
.section-sub-title span {color:#81c784; font-size:1.8rem;}
.subtit {font-size:1.4rem; max-width:800px; margin:0 auto 20px; color:#e0e0e0; font-weight:300; line-height:1.8;}

.info {padding:0; font:14px/16px Arial, Helvetica, sans-serif; background:white; background:rgba(255,255,255,0.8);
	color:#f00; box-shadow:0 0 15px rgba(0,0,0,0.2); border-radius:5px; line-height:1.6em; white-space: nowrap;
}
.info h4 {margin:0 0 5px; color:#777; white-space:nowrap;}
.info .geo {color:#0070e0; margin-bottom:4px;}
.info .geo b {font-size:1.5em; line-height:1.2em;}
.info .jceri {font-size:1.2em;}
.info .jceri b {font-size:1.4em;}
.info .follow {margin-top:10px; color:#0070e0; font-weight:bold; cursor:pointer; font-size:1.06rem;}
.info .followtip {color:#3080f0; margin-bottom:0px;}
.info-default .guide {line-height:22px; color:#0020a0; text-align:left; max-width:240px; padding:10px 5px; word-break:break-all; white-space: normal; overflow-wrap:break-word;}

.info-tabs {font-family:Arial, sans-serif;}
.tab-header {display:flex; border-bottom:1px solid #ddd; margin:0; padding:0;}
.tab-link {flex:1; padding:8px 12px; text-align:center; min-width:0; cursor:pointer; background:#f5f5f5; border:none; position:relative;
    border-bottom:2px solid transparent; font-size:14px; color:#555; transition:all 0.3s; overflow:hidden; text-overflow:ellipsis}
.tab-link:hover {background:#e9e9e9;}
.tab-link.active {background:#fff; color:#1a2980; border-bottom:2px solid #1a2980; font-weight:bold;}
.tab-pane {display:none; padding:5px;}
.tab-pane.active {display:block;}
.geo h4 {margin:0; color:#1a2980; font-size:18px;}
.geo p {margin:1px 0; font-size:14px;}
.jceri-value {background:#f8f9ff; padding:8px; border-radius:8px; margin:10px 0; text-align:center;}
.risk-level {font-size:15px; color:#555;}
.risk-number {font-size:28px; font-weight:bold; color:#e74c3c; margin:2px 0;}
.risk-explanation {font-size:14px; color:#777;}
.follow {text-align:center; margin:8px 0;}
.follow a {display:inline-block; padding:8px 20px; background:#1a2980; color:white;
    text-decoration:none; border-radius:4px; font-weight:bold; transition:background 0.3s;}
.follow a:hover {background:#0d1a5e;}
.follow-tip {text-align:center; font-size:12px; color:#888; margin-top:0px;}
.no-data {text-align:center; padding:20px; color:#666; font-style:italic;}
.alert {color:#c0392b; font-weight:bold; margin-bottom:10px;}
.member-alert {color:#2980b9; font-weight:bold; margin-bottom:10px;}
.member-link {text-align:center; margin:15px 0;}
.login-link {text-align:center; margin-top:15px;}
.earthquake-content {max-height:300px; overflow-y:auto; padding:5px;}
.loading {text-align:center; padding:20px; color:#666;}
.spinner {border:4px solid rgba(0, 0, 0, 0.1); border-left:4px solid #1a2980; border-radius:50%;
    width:30px; height:30px; animation:spin 1s linear infinite; margin:0 auto 15px;}
@keyframes spin { to { transform: rotate(360deg); }	}
.earthquake-list {padding:5px;}
.earthquake-item {display:flex; align-items:center; padding:10px; border-bottom:1px solid #eee;}
.earthquake-item:last-child {border-bottom:none;}
.magnitude {width:50px; height:50px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    font-weight:bold; font-size:18px; color:white; margin-right:10px; flex-shrink:0;}
.magnitude-1 { background: #f9dc12; }
.magnitude-2 { background: #f6bc12; }
.magnitude-3 { background: #f39c12; }
.magnitude-4 { background: #e74c3c; }
.magnitude-5 { background: #c0392b; }
.magnitude-6 { background: #c83026; }
.magnitude-7 { background: #d02920; }
.magnitude-8 { background: #e0201b; }
.magnitude-9 { background: #f01910; }
.earthquake-details {flex-grow:1;}
.location {font-weight:bold; margin-bottom:3px;}
.time {font-size:13px; color:#666; margin-bottom:3px;}
.depth {font-size:13px; color:#777;}
.no-earthquakes {text-align:center; padding:20px; color:#666; font-style:italic;}

/* 最小化状态 */
.info-container {display:flex; flex-direction:column; height:100%;}
.info-header {background:#2c3e50; color:white; padding:2px 10px; font-weight:bold; display:flex;
    justify-content:space-between; align-items:center; cursor:pointer; transition:background 0.3s;}
.info-header:hover {background:#1a2b3c;}
.minimize-btn {background:none; border:none; color:white; font-size:24px; width:30px;
    height:30px; line-height:24px; text-align:center; cursor:pointer; transition:transform 0.3s;}		
.info-body {transition:all 0.3s ease; overflow:hidden;}
.info.minimized {width:200px !important; cursor:pointer;}
.info.minimized .info-body {height:0; opacity:0; padding:0;}
.info.minimized .minimize-btn {transform:rotate(0deg);}


.label-text, .city-label {
  color:black; font-size:18px; font-weight:bold;
  text-shadow:-1px -1px 0 white, 0px -1px 0 white, 1px -1px 0 white, -1px  0px 0 white,
  			  1px  0px 0 white, -1px  1px 0 white, 0px  1px 0 white, 1px  1px 0 white;
}
.city-label {font-size:14px;}

.region-info-panel {background:white; border-radius:4px; box-shadow:0 1px 5px rgba(0,0,0,0.4); transition:all 0.3s ease; 
	overflow:hidden; width:42px; height:42px; align-items:center; border:1px solid #d9d9d9;}
.region-info-panel.expanded {width:170px; height:auto;}
.panel-header {background:linear-gradient(135deg, #1e5799, #207cca); color:white; padding-left:4px; cursor:pointer; display:flex; 
	align-items:center; height:42px; width:100%; justify-content:center; position:relative; transition:all 0.3s ease;}
.panel-header i {font-size:24px; margin-right:10px;}
.panel-header #openedRgnum {font-size:15px; font-style:normal; margin-right:2px;}
.panel-title {font-size:14px; font-weight:bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.panel-content {padding:8px; display:none; background:#fff; width:100%;}
.region-info-panel.expanded .panel-content {display:block;}
.region-list {max-height:170px; overflow-y:auto; padding:8px 12px; margin-bottom:4px; display:flex; flex-direction:column; gap:6px;}
.region-item {padding:2px 4px; margin:0; border-radius:4px; background:#f8f9fa; cursor:pointer; display:flex; align-items:center; transition:all 0.2s;}
.region-item .region-name {color:#333;}
.region-item:hover {background:#e9ecef;}
.region-item.active {background:#e3f2fd; border-left:3px solid #2196f3;}
.color-swatch {width:12px; height:12px; border-radius:50%; margin-right:8px; display:inline-block;}
.controls {display:flex; flex-direction:column; gap:5px;}
.controls button {padding:6px 10px; background:#4a76d0; color:white; border:none; border-radius:4px; cursor:pointer; font-size:12px; transition:background 0.2s;}
.controls button:hover {background:#3a5db0;}

.legend {background:white; padding:10px; border-radius:5px; line-height:1.5;}
.legend i {display:inline-block; width:20px; height:3px; margin-right:8px;}
.label-text {color:#fff;}
.geo.hline {line-height:30px;}

.evtlist {background-color:#fff; color:#304990; padding:20px; border:#000 1px solid; margin:auto; display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.event {padding:10px; border-bottom:1px solid #ddd; display:flex; justify-content:space-between; align-items:center;}
.event h3 {margin:0; font-size:1.2em; color:#304990;}
.event p {margin:0; font-size:0.9em;}
@media (max-width: 800px) {
	.evtlist {grid-template-columns:1fr;}
	.close-btn {width:32px; height:32px;}
	.header {padding:5px 2px;}
}
@media (max-width: 600px) { .close-btn {width:28px; height:28px;}}

/* 详情框样式 */
.jceri-detail-overlay {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255, 255, 255, 0.2);
    backdrop-filter:blur(2px); z-index:1002; display:flex; justify-content:center; align-items:center;}
.jceri-detail-content {background:white; border-radius:8px; box-shadow:0 5px 25px rgba(0,0,0,0.3);
    min-width:300px; max-width:90%; position:relative; color:#333; font-family:Arial, sans-serif;
    line-height:1.5; overflow:hidden;}
.detail-header {background:#2c3e50; color:white; padding:15px 20px; display:flex;
    justify-content:space-between; align-items:center; position:relative;}
.detail-title {font-size:18px; font-weight:bold; letter-spacing:0.5px;}
.jceri-detail-close {background:none; border:none; font-size:28px; cursor:pointer; color:white;
    width:40px; height:40px; display:flex; align-items:center; justify-content:center;
    transition:all 0.3s; position:absolute; top:50%; right:10px; transform:translateY(-50%);}
.jceri-detail-close:hover {color:#e74c3c; transform:translateY(-50%) scale(1.2);}
.detail-body {padding:25px;}
.detail-item {margin:15px 0; font-size:18px; color:#1a2980; font-weight:bold; padding:0 10px;}
.detail-tip {margin-top:25px; padding:15px; background:#fff8e6; border:1px solid #ffc107;
    border-radius:6px; color:#333; font-weight:normal; font-size:16px; line-height:1.6;}
.link-tip {display:block; color:#666; font-size:14px; margin-top:15px; padding-top:15px;
	border-top:1px dashed #bbb; font-style:italic; text-align:center;}

/* 详情提示中的链接样式 */
.detail-tip a {color:#1a2980; text-decoration:underline; font-weight:bold; display:inline-block; margin:0 3px;}
.detail-tip a:hover {color:#e74c3c; text-decoration:none;}
@media (max-width: 768px) {
    .jceri-detail-content {width:85%;}    
    .detail-header {padding:12px 15px;}    
    .detail-title {font-size:16px;}    
    .detail-body {padding:20px 15px;}    
    .detail-item {font-size:16px;}    
    .detail-tip {padding:12px; font-size:14px;}    
    .jceri-detail-close {font-size:24px; width:36px; height:36px;}
}
.date-range {margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #eee;
    font-size:14px; color:#666; display:flex; justify-content:space-between;
}
.detail-item {margin:12px 0; font-size:16px; color:#1a2980; font-weight:bold; padding:0 10px;}
.detail-item:nth-child(2) {color:#e74c3c; font-size:18px;}
#map #eqdate-info {position:absolute; top:10px; left:50%; transform:translateX(-50%); text-align:center; z-index:9000; background:rgba(255, 10, 20, 0.8); padding:5px; border-radius:3px; font-size:16px;}