/* 政策研究页专用：一条一行（覆盖 auto-fill 多列），并配序号便于查看 */
.pol-single {grid-template-columns: 1fr;}

.pol-no {display: inline-block; min-width: 26px; margin-right: 9px; padding: 1px 8px; background: var(--brand-soft); color: var(--ink); border: 1px solid rgba(52,211,153,.28); border-radius: 8px; font-size: 12.5px; font-weight: 700; font-family: var(--font-mono); text-align: center; vertical-align: middle;}

/* 两个分类 tab 移入大标题（替换原「国家 + 地方」标签）并行内排布；
   .pol-tabs 本体被 search.asp 共用，故用附加类覆盖，不改动原规则 */
.panel h2.pol-h2-tabs {margin-bottom: 16px;}

.pol-tabs-h2 {display: inline-flex; margin: 0 0 0 10px; vertical-align: middle;}

.pol-modal-list {display: grid; grid-template-columns: 1fr; gap: 12px;}

/* ===== 海外观察 oversea_v.asp ===== */
.ov-filter {display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0 0 14px; padding: 12px 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px;}

.ov-filter label {font-size: 12.5px; color: var(--text-3); display: inline-flex; align-items: center; gap: 6px;}

.ov-filter select, .ov-filter input {padding: 6px 10px; border: 1px solid var(--border-strong); border-radius: 8px; font-size: 13px; font-family: inherit; background: var(--surface); color: var(--text);}

.ov-filter input {min-width: 230px;}

.ov-filter select:focus, .ov-filter input:focus {outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft);}

.ov-count {margin-left: auto; font-size: 12.5px; color: var(--text-3);}

.ov-count b {color: var(--ink); font-size: 14px;}

.ov-chk {display: inline-flex; align-items: center; gap: 5px; cursor: pointer; user-select: none;}

.ov-chk input {width: auto; min-width: 0; margin: 0; padding: 0; box-shadow: none;}

.ov-mix {display: flex; flex-direction: column; gap: 9px;}

.ov-mix-row {display: flex; align-items: center; gap: 10px; font-size: 12.5px;}

.ov-mix-name {width: 66px; flex-shrink: 0; color: var(--text-2);}

.ov-mix-track {flex: 1; height: 14px; background: var(--surface-2); border-radius: 7px; overflow: hidden;}

.ov-mix-track i {display: block; height: 100%; border-radius: 7px;}

.ov-mix-val {width: 122px; flex-shrink: 0; text-align: right; color: var(--text-3); font-variant-numeric: tabular-nums;}

.ov-list {display: flex; flex-direction: column; gap: 10px;}

.ov-item {border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; background: var(--surface); transition: border-color .12s, box-shadow .12s;}

.ov-item:hover {border-color: var(--border-strong); box-shadow: var(--shadow-sm);}

.ov-top {display: flex; align-items: flex-start; gap: 9px;}

.ov-no {display: inline-block; min-width: 26px; padding: 1px 7px; background: var(--brand-soft); color: var(--ink); border: 1px solid rgba(52,211,153,.28); border-radius: 8px; font-size: 12px; font-weight: 700; text-align: center; font-family: var(--font-mono); flex-shrink: 0;}

.ov-cty {display: inline-block; padding: 1px 9px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 20px; font-size: 12px; color: var(--text-2); white-space: nowrap; flex-shrink: 0;}

.ov-top h3 {margin: 0; font-size: 14px; line-height: 1.5; color: var(--text); flex: 1; min-width: 0; font-weight: 600;}

.ov-dl {display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 11.5px; font-weight: 600; white-space: nowrap; flex-shrink: 0; background: var(--surface-2); color: var(--text-3);}

.ov-dl.hot {background: rgba(248,113,113,.16); color: #b91c1c;}

.ov-dl.warn {background: rgba(245,158,11,.16); color: #b45309;}

.ov-dl.over {background: rgba(148,163,184,.18); color: var(--text-3);}

.ov-meta {display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--text-3); margin-top: 7px;}

.ov-tags {margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px;}

/* 海外观察大盘：三个小模块并排（首列收窄、中列加宽防国别名换行） */
.ov-row-3 {display: flex; gap: 14px; align-items: stretch;}
.ov-row-3 .ov-col {flex: 1 1 0; min-width: 0; display: flex; flex-direction: column;}
.ov-row-3 .ov-col:nth-child(1) {flex: 0.8 1 0;}
.ov-row-3 .ov-col:nth-child(2) {flex: 1.5 1 0;}
.ov-row-3 .ov-col:nth-child(3) {flex: 1 1 0;}
.ov-row-3 .tr-chart-title {font-size: 13px; margin: 0 0 8px;}
.ov-row-3 .id-vchart {height: 130px; padding-top: 20px; gap: 6px;}
.ov-row-3 .id-vbar-fill {max-width: 38px; border-radius: 5px 5px 0 0;}
.ov-row-3 .id-vbar-label {white-space: nowrap; font-size: 11.5px;}
.ov-row-3 .ov-mix {gap: 7px;}
.ov-row-3 .ov-mix-row {gap: 8px; font-size: 11.5px;}
.ov-row-3 .ov-mix-name {width: 54px;}
.ov-row-3 .ov-mix-track {height: 11px;}
.ov-row-3 .ov-mix-val {width: 92px; font-size: 11.5px;}

/* 海外观察趋势：第一行折线图与光伏发电占比并排 */
.ov-row-2 {display: flex; gap: 18px; align-items: stretch;}
.ov-row-2 .ov-col-left {flex: 1 1 0; min-width: 0; display: flex; flex-direction: column;}
.ov-row-2 .ov-col-right {flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 0;}
/* 折线图：专业面积图（渐变填充 + 淡参考线 + 首尾大点），随右侧高度齐平，图内文字移出，年份/区间写全于图下 */
.ov-row-2 .tr-chart-title {font-size: 14px; margin: 0 0 6px;}
.ov-row-2 .tr-chart-title .tr-year {font-size: 11px;}
.ov-row-2 .id-line-chart {flex: 0 0 auto; min-height: 0; height: 200px; padding: 2px 0 0; overflow: visible;}
.ov-row-2 .id-line-chart svg {width: 100%; height: 100%; display: block; overflow: visible;}
.ov-row-2 .id-line-chart .ov-grid {stroke: var(--border); stroke-width: 1; opacity: .5;}
.ov-row-2 .id-line-chart .ov-y-label {font-size: 9px; fill: var(--text-3); text-anchor: start; font-variant-numeric: tabular-nums;}
.ov-row-2 .id-line-chart .ov-x-label {font-size: 9px; fill: var(--text-3); text-anchor: end; font-variant-numeric: tabular-nums;}
.ov-row-2 .id-line-chart .ov-val-label {font-size: 9px; fill: var(--ink); text-anchor: middle; font-weight: 600;}
.ov-row-2 .id-line-chart .ov-mean-line {stroke: #f59e0b; stroke-width: 1.2; stroke-dasharray: 4 3; opacity: .9;}
.ov-row-2 .id-line-chart .ov-mean-label {font-size: 9px; fill: #b45309; text-anchor: end; font-weight: 600;}
.ov-row-2 .id-line-chart .data-area {fill: url(#ovSparkGrad); stroke: none;}
.ov-row-2 .id-line-chart .data-line {stroke-width: 1.8;}
.ov-row-2 .id-line-chart .data-dot {stroke: var(--surface); stroke-width: 0;}
/* 右侧光伏发电占比：双列网格紧凑排布，填满宽度、减少空白，与左侧高度齐平 */
.ov-row-2 .ov-col-right .ov-mix {display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px 16px;}
.ov-row-2 .ov-col-right .ov-mix-row {gap: 6px; font-size: 11.5px;}
.ov-row-2 .ov-col-right .ov-mix-name {width: 40px; font-size: 11.5px;}
.ov-row-2 .ov-col-right .ov-mix-val {width: 44px; font-size: 11px;}

/* 海外观察趋势：第二行新兴市场电力覆盖率占满，条形双列排布 */
.ov-row-1 {display: flex; gap: 0;}
.ov-row-1 .ov-col {flex: 1 1 0; min-width: 0; display: flex; flex-direction: column;}
.ov-row-1 .ov-mix {display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px 24px;}

@media (max-width: 900px) {
.ov-row-3 {flex-direction: column; gap: 18px;}
.ov-row-3 .id-vchart {height: 150px;}
.ov-row-2 {flex-direction: column;}
.ov-row-2 .id-line-chart {min-height: 180px;}
.ov-row-1 .ov-mix {grid-template-columns: 1fr;}
}

@media (max-width: 640px) {
.ov-top {flex-wrap: wrap;}
.ov-top h3 {flex: 1 1 100%; order: 3;}
.ov-mix-val {width: auto;}
.ov-filter input {min-width: 160px;}
.ov-count {margin-left: 0;}
}
