/* ─── 布局 ──────────────────────────────────────── */

.app-layout {
    display: flex;
    min-height: 100vh;
}

/* ─── 侧边栏 ─────────────────────────────────────── */

.sidebar {
    width: 236px;
    min-width: 236px;
    background: #1a2332;
    color: #a4b7c6;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.sidebar-brand {
    padding: 1.25rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebar-brand a {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.brand-icon {
    width: 1.45rem;
    height: 1.45rem;
}

.sidebar-nav {
    padding: 0.75rem 0;
}

.sidebar-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nav-group {
    margin: 0.15rem 0.6rem;
}

.nav-group summary {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 42px;
    padding: 0.6rem 0.65rem;
    color: #d7e0e8;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
    border-radius: 0.35rem;
    user-select: none;
}

.nav-group summary::-webkit-details-marker {
    display: none;
}

.nav-group summary:hover,
.nav-group[open] summary {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

.nav-chevron {
    width: 1rem;
    height: 1rem;
    margin-left: auto;
    transition: transform 0.18s ease;
}

.nav-group[open] .nav-chevron {
    transform: rotate(180deg);
}

.nav-children {
    padding: 0.25rem 0 0.35rem !important;
}

.sidebar-nav .nav-item a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 38px;
    padding: 0.5rem 0.75rem 0.5rem 2.55rem;
    color: #a4b7c6;
    text-decoration: none;
    transition: all 0.15s ease;
    border-radius: 0.35rem;
}

.sidebar-nav .nav-item a:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

.sidebar-nav .nav-item.active a {
    background: #1769aa;
    color: #fff;
}

.nav-icon {
    width: 1.15rem;
    height: 1.15rem;
    flex: 0 0 auto;
}

.nav-item a svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
}

/* ─── 主内容区 ────────────────────────────────────── */

.main-content {
    flex: 1;
    background: #f0f2f5;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #fff;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.content-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a2332;
    margin: 0;
}

.content-body {
    padding: 1.5rem;
    flex: 1;
}

/* ─── 市场情报工作台 ──────────────────────────────── */

:root {
    --chart-color-0: #1769aa;
    --chart-color-1: #16827a;
    --chart-color-2: #d28a16;
    --chart-color-3: #c7524d;
    --chart-color-4: #667085;
    --chart-color-5: #7656a5;
    --chart-color-6: #2f855a;
    --chart-color-7: #a75d23;
}

.macro-toolbar {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 0 0.15rem;
}
.macro-toolbar.status-only { min-height: 32px; justify-content: flex-end; margin-bottom: .65rem; }

.macro-toolbar strong,
.macro-toolbar span {
    display: block;
}

.macro-toolbar strong {
    color: #1f2937;
    font-size: 1rem;
}

.macro-toolbar div > span {
    margin-top: 0.2rem;
    color: #667085;
    font-size: 0.8rem;
}

.data-status {
    display: inline-flex !important;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.6rem;
    color: #7a5a14;
    background: #fff8e8;
    border: 1px solid #ead69f;
    border-radius: 0.35rem;
    font-size: 0.75rem;
}

.data-status.ready { color: #17623e; background: #eefaf3; border-color: #b8dfc8; }
.source-links { display: flex; gap: .75rem; align-items: center; font-size: .75rem; }
.source-links a { color: #1769aa; text-decoration: none; }
.source-links svg, .pending-note svg, .availability-note svg, .freight-index-card svg { width: .85rem; height: .85rem; vertical-align: -2px; }
.index-analysis-layout { display: grid; grid-template-columns: minmax(210px, .58fr) minmax(500px, 1.8fr) minmax(260px, .78fr); gap: 1rem; padding: 1rem; align-items: stretch; }
.index-kpis { display: grid; grid-template-columns: 1fr; align-content: start; gap: .6rem; padding: 0; }
.index-kpi { min-width: 0; height: 61px; padding: .42rem .62rem; text-align: left; background: #f8fafb; border: 1px solid #e4e9ee; border-radius: .35rem; color: #475467; cursor: pointer; }
.index-kpi[aria-pressed="false"] { opacity: .45; }
.index-kpi-heading, .compact-index-title { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; }
.index-kpi-code, .compact-index-title strong { display: block; flex: 0 0 auto; color: #1769aa; font-size: .76rem; font-weight: 700; line-height: 1.3; }
.index-kpi-name, .compact-index-title span { display: block; min-width: 0; margin: 0; color: #667085; font-size: .66rem; line-height: 1.3; text-align: right; }
.index-kpi-name { max-width: 70%; }
.index-kpi-metric { display: flex; align-items: flex-end; justify-content: space-between; gap: .55rem; margin-top: .28rem; }
.index-kpi-metric strong { color: #1f2937; font-size: 1.18rem; line-height: 1; }
.index-kpi-metric small { color: #c2413b; font-size: .68rem; line-height: 1; white-space: nowrap; }
.index-kpi-metric small.negative, .compact-index-metric small.negative { color: #16805c; }
.index-chart-wrap { min-width: 0; min-height: 330px; height: 100%; align-self: stretch; padding: .3rem .2rem; }
.newbuilding-analysis-layout { --newbuilding-stack-height: calc(305px + 2.4rem); align-items: start; }
.newbuilding-analysis-layout .index-chart-wrap,
.newbuilding-analysis-layout .ai-analysis-panel { min-height: var(--newbuilding-stack-height); height: var(--newbuilding-stack-height); }
.newbuilding-analysis-layout .ai-analysis-panel { overflow: auto; }
.ai-analysis-panel { min-width: 0; padding: .85rem 1rem; border-left: 3px solid #1769aa; background: #f7fafc; }
.ai-analysis-heading { display: flex; align-items: center; gap: .4rem; margin-bottom: .65rem; }
.ai-analysis-heading svg { width: 1rem; height: 1rem; color: #1769aa; }
.ai-analysis-heading h3 { margin: 0; color: #1f2937; font-size: .88rem; }
.ai-analysis-list section { padding: .52rem 0; border-top: 1px solid #e4e9ee; }
.ai-analysis-list section:first-child { padding-top: 0; border-top: 0; }
.ai-analysis-list h4 { margin: 0 0 .18rem; color: #1769aa; font-size: .72rem; }
.ai-analysis-list p, .freight-ai-analysis > p { margin: 0; color: #5f6b78; font-size: .72rem; line-height: 1.55; }
.freight-panel { margin-top: 1rem; }
.shipping-index-panel { margin-top: 0; }
.pending-note { display: inline-flex !important; align-items: center; gap: .35rem; color: #7a5a14 !important; font-size: .73rem !important; }
.freight-markets { padding: 0 1rem; }
.freight-market-tabs { display: flex; flex-wrap: wrap; gap: .45rem; padding: 0 1rem; border-bottom: 1px solid #edf0f2; }
.freight-market-tabs button { padding: .5rem .75rem; color: #667085; background: transparent; border: 0; border-bottom: 2px solid transparent; font-size: .78rem; cursor: pointer; }
.freight-market-tabs button[aria-selected="true"] { color: #1769aa; border-bottom-color: #1769aa; font-weight: 700; }
.shipping-index-panel .freight-market-section { padding-top: 1rem; border-top: 0; }
.freight-market-section { padding: 1rem 0; border-top: 1px solid #edf0f2; }
.freight-market-section > h3 { margin: 0 0 .7rem; color: #344054; font-size: .9rem; }
.freight-market-content { display: grid; grid-template-columns: minmax(210px, .58fr) minmax(500px, 1.8fr) minmax(240px, .78fr); gap: 1rem; align-items: stretch; }
.freight-market-kpis { display: grid; grid-template-columns: 1fr; align-content: start; gap: .6rem; }
.freight-chart-wrap { position: relative; min-width: 0; height: 230px; padding: .45rem .6rem .2rem; border: 1px solid #edf0f2; background: #fcfdfe; }
.freight-chart-empty { display: grid; height: 220px; place-content: center; color: #98a2b3; border: 1px dashed #d7dde3; font-size: .78rem; }
.freight-index-card { min-width: 0; padding: .55rem .68rem; background: #f8fafb; border: 1px solid #e4e9ee; border-radius: .35rem; }
.freight-index-card[type="button"] { width: 100%; text-align: left; color: inherit; cursor: pointer; font: inherit; }
.freight-index-card[aria-pressed="false"] { opacity: .45; }
.compact-index-title strong { font-size: .78rem; }
.compact-index-title span { font-size: .67rem; }
.compact-index-metric { display: flex; align-items: flex-end; justify-content: space-between; gap: .55rem; margin-top: .38rem; }
.compact-index-metric strong { color: #1f2937; font-size: 1.18rem; line-height: 1; }
.compact-index-metric small { color: #c2413b; font-size: .67rem; line-height: 1; white-space: nowrap; }
.freight-ai-analysis { height: 190px; overflow: auto; }
.freight-index-card h3 { margin: .55rem 0 .35rem; color: #344054; font-size: .78rem; line-height: 1.4; }
.freight-index-value { display: block; margin: .65rem 0 .15rem; color: #123b5d; font-size: 1.35rem; line-height: 1.1; }
.freight-index-value.pending-value { color: #98a2b3; font-size: 1.05rem; }
.freight-index-change { display: block; margin-bottom: .55rem; color: #16805c; font-size: .7rem; }
.freight-index-range { display: block; margin-bottom: .55rem; color: #667085; font-size: .68rem; }
.freight-index-card p { margin: 0 0 .6rem; color: #7b8794; font-size: .7rem; }
.freight-index-card a { color: #1769aa; font-size: .7rem; text-decoration: none; }
.availability-note { display: flex; align-items: flex-start; gap: .45rem; margin: 0 1rem 1rem; padding: .65rem .75rem; color: #667085; background: #fffaf0; border: 1px solid #f0dfb2; border-radius: .3rem; font-size: .73rem; line-height: 1.5; }
.feed-meta { display: flex; justify-content: space-between; gap: .5rem; color: #7b8794; font-size: .7rem; }
.intelligence-list article a { text-decoration: none; }
.intelligence-list article h3 { color: #1f2937; }
.intelligence-list article h3:hover { color: #1769aa; }
.feed-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .5rem; }
.feed-tags span { padding: .16rem .35rem; color: #1769aa; background: #edf6fd; border-radius: .2rem; font-size: .66rem; }

.data-status svg,
.panel-icon {
    width: 1rem;
    height: 1rem;
}

.macro-index-grid,
.macro-feed-grid {
    display: grid;
    gap: 1rem;
}
.macro-index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.macro-feed-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 1rem; }
.shipbuilding-feed-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.shipping-news-panel { margin-top: 1rem; }

.macro-index-grid {
    margin-bottom: 1rem;
}

.macro-panel {
    min-width: 0;
    overflow: hidden;
}

.panel-icon {
    color: #1769aa;
}

.index-series,
.macro-empty {
    height: 250px;
}

.macro-empty {
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 0.45rem;
    padding: 1.5rem;
    color: #7b8794;
    text-align: center;
}

.macro-empty svg {
    width: 1.75rem;
    height: 1.75rem;
    color: #98a2b3;
}

.macro-empty strong {
    color: #475467;
    font-size: 0.9rem;
}

.macro-empty span {
    max-width: 340px;
    font-size: 0.78rem;
}

.feed-empty {
    height: 300px;
}

.intelligence-list article {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid #edf0f2;
}

.intelligence-list time {
    color: #7b8794;
    font-size: 0.72rem;
}

.intelligence-list h3 {
    margin: 0.25rem 0;
    color: #1f2937;
    font-size: 0.9rem;
}

.intelligence-list p {
    margin: 0;
    color: #667085;
    font-size: 0.78rem;
}

.market-dashboard {
    display: grid;
    grid-template-columns: minmax(380px, 0.95fr) minmax(460px, 1.25fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

.dashboard-panel {
    background: #fff;
    border: 1px solid #e2e7ec;
    border-radius: 0.45rem;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.panel-heading {
    min-height: 66px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid #edf0f2;
}

.panel-heading h2 {
    margin: 0;
    color: #1f2937;
    font-size: 1rem;
    font-weight: 650;
}

.panel-heading span {
    display: block;
    margin-top: 0.15rem;
    color: #7b8794;
    font-size: 0.75rem;
}

.panel-heading .btn span {
    margin: 0;
    color: inherit;
    font-size: inherit;
}

.panel-heading .btn svg,
.filter-actions .btn svg {
    width: 1rem;
    height: 1rem;
}

.overview-content {
    min-height: 260px;
    display: grid;
    grid-template-columns: minmax(135px, 0.75fr) minmax(220px, 1.25fr);
    align-items: center;
    padding: 1rem;
}

.kpi-block {
    padding: 0.5rem 1rem;
    border-right: 1px solid #edf0f2;
}

.kpi-label,
.kpi-unit {
    display: block;
    color: #667085;
    font-size: 0.8rem;
}

.kpi-value {
    display: block;
    margin: 0.35rem 0;
    color: #1769aa;
    font-size: 2.75rem;
    line-height: 1;
}

.chart-block {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-left: 1rem;
}

.donut-wrap {
    width: 138px;
    height: 138px;
    flex: 0 0 138px;
}

.chart-legend {
    min-width: 0;
    display: grid;
    gap: 0.45rem;
    font-size: 0.75rem;
    color: #475467;
}

.chart-legend span {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.chart-legend i {
    width: 0.55rem;
    height: 0.55rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--legend-color);
}

.empty-chart {
    width: 100%;
    color: #98a2b3;
    font-size: 0.85rem;
    text-align: center;
}

.analysis-panel {
    position: relative;
    min-width: 0;
}

.analysis-result {
    height: 260px;
    overflow-y: auto;
    padding: 1rem 1.1rem;
}

.analysis-placeholder {
    height: 100%;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 0.7rem;
    color: #98a2b3;
    font-size: 0.85rem;
}

.analysis-placeholder svg {
    width: 2rem;
    height: 2rem;
}

.analysis-loading {
    position: absolute;
    right: 1rem;
    bottom: 0.75rem;
    padding: 0.4rem 0.6rem;
    background: #fff;
    color: #1769aa;
    font-size: 0.75rem;
    border: 1px solid #d8e5f0;
    border-radius: 0.35rem;
}

.orders-panel {
    overflow: hidden;
}

.orders-heading {
    border-bottom: 0;
}

.order-filters {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr)) minmax(170px, 1.35fr) auto;
    align-items: end;
    gap: 0.65rem;
    padding: 0.75rem 1rem 1rem;
    background: #f8fafb;
    border-top: 1px solid #edf0f2;
    border-bottom: 1px solid #e4e9ee;
}

.order-filters label {
    min-width: 0;
}

.order-filters label > span {
    display: block;
    margin-bottom: 0.3rem;
    color: #5d6976;
    font-size: 0.75rem;
    font-weight: 600;
}

.order-filters .form-control,
.order-filters .form-select {
    width: 100%;
    height: 36px;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

.filter-actions {
    display: flex;
    gap: 0.4rem;
}

.filter-actions .btn {
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    white-space: nowrap;
}

.filter-actions .btn-primary {
    min-width: 76px;
}

#order-table .table {
    font-size: 0.83rem;
}

#order-table td,
#order-table th {
    padding: 0.7rem 0.75rem;
    vertical-align: middle;
}

/* ─── 克拉克森新造船订单 ─────────────────────────── */

.orders-page-status,
.source-badge,
.filter-panel-heading,
.orders-table-toolbar,
.view-switch,
.input-with-icon {
    display: flex;
    align-items: center;
}

.orders-page-status { gap: 0.55rem; }
.source-badge {
    gap: 0.35rem;
    padding: 0.4rem 0.6rem;
    color: #344054;
    background: #f8fafb;
    border: 1px solid #dfe5eb;
    border-radius: 0.35rem;
    font-size: 0.75rem;
}
.source-badge svg { width: 0.9rem; height: 0.9rem; color: #1769aa; }

.clarksons-filter-panel { position: relative; z-index: 5; margin-bottom: 1rem; overflow: visible; }
.filter-panel-heading {
    justify-content: space-between;
    gap: 1rem;
    min-height: 58px;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #edf0f2;
}
.filter-panel-heading h2,
.orders-table-toolbar h2 { margin: 0; color: #1f2937; font-size: 0.95rem; }
.filter-panel-heading > div:first-child > span,
.orders-table-toolbar > div > span { color: #7b8794; font-size: 0.72rem; }
.filter-panel-heading .filter-actions { margin-left: auto; }
.filter-panel-heading .btn { height: 34px; }
.filter-panel-heading .btn-primary span { color: #fff; }
.clarksons-filter-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(135px, 1fr));
    gap: 0.7rem;
    padding: 0.8rem 1rem 1rem;
    background: #fbfcfd;
}
.clarksons-filter-grid > label,
.clarksons-filter-grid > .filter-field { min-width: 0; }
.clarksons-filter-grid > label > span,
.filter-field > span {
    display: block;
    margin-bottom: 0.28rem;
    color: #5d6976;
    font-size: 0.7rem;
    font-weight: 600;
}
.clarksons-filter-grid .form-control,
.clarksons-filter-grid .form-select { height: 34px; padding-top: 0.3rem; padding-bottom: 0.3rem; font-size: 0.78rem; }
.filter-field { position: relative; }
.checkbox-select { position: relative; }
.checkbox-select[open] { z-index: 20; }
.checkbox-select summary {
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.35rem 0.6rem;
    color: #344054;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    cursor: pointer;
    list-style: none;
    font-size: 0.78rem;
}
.checkbox-select summary::-webkit-details-marker { display: none; }
.checkbox-select summary > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.checkbox-select summary svg { width: 0.9rem; height: 0.9rem; flex: 0 0 auto; color: #667085; transition: transform 0.15s ease; }
.checkbox-select[open] summary { border-color: #86b7d9; box-shadow: 0 0 0 0.18rem rgba(23, 105, 170, 0.12); }
.checkbox-select[open] summary svg { transform: rotate(180deg); }
.checkbox-select-menu {
    position: absolute;
    top: calc(100% + 0.35rem);
    right: 0;
    width: 100%;
    min-width: 240px;
    padding: 0.4rem;
    background: #fff;
    border: 1px solid #dfe5eb;
    border-radius: 0.4rem;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.14);
}
.checkbox-options { max-height: 230px; overflow-y: auto; }
.checkbox-options label { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.4rem 0.45rem; border-radius: 0.25rem; color: #475467; cursor: pointer; font-size: 0.75rem; line-height: 1.35; }
.checkbox-options label:hover { background: #f0f6fb; }
.checkbox-options label[hidden] { display: none; }
.checkbox-options input { flex: 0 0 auto; margin-top: 0.08rem; accent-color: #1769aa; }
.checkbox-options label > span { margin: 0; color: inherit; font-size: inherit; font-weight: 400; }
.checkbox-menu-search { position: relative; display: flex; align-items: center; margin-bottom: 0.35rem; }
.checkbox-menu-search svg { position: absolute; left: 0.48rem; width: 0.78rem; height: 0.78rem; color: #98a2b3; pointer-events: none; }
.checkbox-menu-search input { width: 100%; height: 30px; padding: 0.25rem 0.45rem 0.25rem 1.55rem; border: 1px solid #d8dee5; border-radius: 0.3rem; font-size: 0.72rem; outline: none; }
.checkbox-menu-search input:focus { border-color: #86b7d9; }
.input-with-icon { position: relative; }
.input-with-icon svg { position: absolute; left: 0.55rem; width: 0.85rem; height: 0.85rem; color: #98a2b3; pointer-events: none; }
.input-with-icon input { padding-left: 1.75rem; }

.order-kpi-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1rem;
    overflow: hidden;
}
.order-kpi { min-width: 0; padding: 0.85rem 1rem; border-left: 1px solid #edf0f2; }
.order-kpi:first-child { border-left: 0; }
.order-kpi span,
.order-kpi small { display: block; color: #7b8794; font-size: 0.7rem; }
.order-kpi strong { display: block; margin: 0.25rem 0 0.18rem; color: #153d5c; font-size: 1.45rem; line-height: 1; }

.orders-analysis-primary { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 0.8fr); gap: 1rem; margin-bottom: 1rem; }
.order-chart-panel,
.order-insight-panel,
.compact-order-chart { min-width: 0; overflow: hidden; }
.order-trend-chart { height: 300px; padding: 0.65rem 0.9rem 0.75rem; }
.order-insight-panel { position: relative; }
.icon-command {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    color: #1769aa;
    background: #eef6fc;
    border: 1px solid #cfe1ef;
    border-radius: 0.35rem;
    cursor: pointer;
}
.icon-command:hover { background: #dfedf8; }
.icon-command svg { width: 1rem; height: 1rem; }
.order-insights { height: 300px; overflow-y: auto; padding: 0.75rem 1rem; }
.order-insights p { display: grid; grid-template-columns: 22px 1fr; gap: 0.55rem; margin: 0; padding: 0.7rem 0; color: #566372; border-bottom: 1px solid #edf0f2; font-size: 0.76rem; line-height: 1.55; }
.order-insights p:last-child { border-bottom: 0; }
.order-insights p > span { width: 22px; height: 22px; display: grid; place-items: center; color: #1769aa; background: #eaf4fb; border-radius: 50%; font-size: 0.67rem; font-weight: 700; }
.order-analysis-loading { position: absolute; right: 0.75rem; bottom: 0.6rem; color: #1769aa; background: #fff; font-size: 0.7rem; }
.clarksons-ai-content { color: #566372; font-size: 0.76rem; line-height: 1.75; }
.order-analysis-message { min-height: 180px; display: grid; place-content: center; justify-items: center; gap: 0.5rem; padding: 1rem; color: #667085; text-align: center; font-size: 0.75rem; }
.order-analysis-message.error { color: #9f3a38; }
.order-analysis-message svg { width: 1.2rem; height: 1.2rem; }

.orders-analysis-secondary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.compact-order-chart .panel-heading { min-height: 58px; padding-top: 0.7rem; padding-bottom: 0.7rem; }
.compact-chart-body { height: 245px; padding: 0.55rem 0.75rem 0.75rem; }

.clarksons-table-panel { overflow: hidden; }
.orders-table-toolbar { justify-content: space-between; gap: 1rem; min-height: 62px; padding: 0.75rem 1rem; border-bottom: 1px solid #edf0f2; }
.view-switch { gap: 0.2rem; padding: 0.18rem; background: #eef2f5; border-radius: 0.35rem; }
.view-switch a { min-width: 78px; padding: 0.38rem 0.55rem; color: #667085; border-radius: 0.25rem; text-align: center; text-decoration: none; font-size: 0.73rem; }
.view-switch a[aria-selected="true"] { color: #1769aa; background: #fff; box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08); font-weight: 700; }
.clarksons-order-table { min-width: 1180px; font-size: 0.76rem; }
.clarksons-order-table th { padding: 0.65rem 0.7rem; background: #f8fafb; border-bottom-color: #dfe5eb; font-size: 0.7rem; }
.clarksons-order-table td { max-width: 185px; padding: 0.65rem 0.7rem; color: #475467; vertical-align: middle; }
.clarksons-order-table td small { display: block; margin-top: 0.15rem; color: #8a95a2; font-size: 0.65rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ship-category-label { display: block; color: #1769aa; font-weight: 700; }
.quantity-cell { color: #153d5c !important; text-align: center; font-weight: 700; }
.vessel-name { display: block; max-width: 170px; overflow: hidden; color: #344054; text-overflow: ellipsis; white-space: nowrap; font-size: 0.73rem; }
.table-empty-state { min-height: 120px; display: grid; place-content: center; justify-items: center; gap: 0.5rem; color: #98a2b3; }
.table-empty-state svg { width: 1.35rem; height: 1.35rem; }
.orders-pagination { display: flex; align-items: center; justify-content: center; gap: 0.25rem; min-height: 56px; padding: 0.6rem; border-top: 1px solid #edf0f2; }
.orders-pagination a { min-width: 30px; height: 30px; display: grid; place-items: center; padding: 0 0.35rem; color: #667085; border: 1px solid transparent; border-radius: 0.3rem; text-decoration: none; font-size: 0.73rem; }
.orders-pagination a:hover { background: #f0f6fb; }
.orders-pagination a[aria-current="page"] { color: #fff; background: #1769aa; }
.orders-pagination svg { width: 0.9rem; height: 0.9rem; }
.orders-pagination .disabled { opacity: 0.35; pointer-events: none; }

.batch-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #edf0f2; border-left: 1px solid #edf0f2; }
.batch-summary-item { padding: 0.8rem 1rem; border-right: 1px solid #edf0f2; border-bottom: 1px solid #edf0f2; }
.batch-summary-item span { display: block; margin-bottom: 0.25rem; color: #7b8794; font-size: 0.68rem; }
.batch-summary-item strong { color: #344054; font-size: 0.82rem; }
.batch-detail-actions { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; }

/* ─── 卡片 ────────────────────────────────────────── */

.card {
    border: none;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    border-radius: 0.5rem;
}

.card-header {
    background: #fff;
    border-bottom: 1px solid #e9ecef;
    font-weight: 600;
    padding: 0.75rem 1.25rem;
}

.stat-card {
    transition: transform 0.15s ease;
}

.stat-card:hover {
    transform: translateY(-2px);
}

.stat-number {
    font-size: 2rem;
    font-weight: 700;
    color: #1a2332;
}

.stat-label {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* ─── 表格 ────────────────────────────────────────── */

.table th {
    font-weight: 600;
    font-size: 0.85rem;
    color: #495057;
    white-space: nowrap;
}

.clickable-row {
    cursor: pointer;
}

.clickable-row:hover {
    background-color: #f0f7ff !important;
}

/* ─── 原文展示 ─────────────────────────────────────── */

.raw-text {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.875rem;
    line-height: 1.7;
    color: #333;
    max-height: 600px;
    overflow-y: auto;
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 0.375rem;
}

/* ─── 筛选栏 ──────────────────────────────────────── */

.form-select, .form-control {
    font-size: 0.875rem;
}

/* ─── HTMX 指示器 ──────────────────────────────────── */

.htmx-indicator {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.htmx-request .htmx-indicator {
    opacity: 1;
}

.htmx-request.htmx-indicator {
    opacity: 1;
}

/* ─── AI 分析报告 ──────────────────────────────────── */

.analysis-content {
    line-height: 1.8;
    font-size: 0.95rem;
}

.analysis-content br {
    display: block;
    content: "";
    margin-top: 0.5rem;
}

/* ─── 待开发模块 ──────────────────────────────────── */

.module-empty-state {
    min-height: 360px;
    display: grid;
    place-items: center;
    text-align: center;
    color: #667085;
}

.module-empty-state svg {
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 1rem;
    color: #1769aa;
}

@media (max-width: 768px) {
    .app-layout {
        flex-direction: column;
    }

    .sidebar {
        position: relative;
        width: 100%;
        min-width: 0;
        height: auto;
        max-height: none;
    }

    .content-body {
        padding: 1rem;
    }

    .order-filters {
        grid-template-columns: 1fr;
    }

    .filter-actions .btn-primary {
        flex: 1;
    }

    .orders-page-status { align-items: flex-end; flex-direction: column; }
    .clarksons-filter-grid { grid-template-columns: 1fr; }
    .filter-panel-heading { align-items: flex-start; }
    .order-kpi-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .order-kpi { border-bottom: 1px solid #edf0f2; }
    .orders-table-toolbar { align-items: flex-start; flex-direction: column; }
    .view-switch { width: 100%; }
    .view-switch a { flex: 1; }
    .batch-summary-grid { grid-template-columns: 1fr; }
}

@media (min-width: 769px) and (max-width: 1199px) {
    .order-filters {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }
    .clarksons-filter-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
}

@media (max-width: 1050px) {
    .market-dashboard,
    .macro-index-grid,
    .macro-feed-grid {
        grid-template-columns: 1fr;
    }
    .index-analysis-layout,
    .freight-market-content { grid-template-columns: 1fr; }
    .freight-market-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .freight-market-section:first-child .freight-market-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .orders-analysis-primary { grid-template-columns: 1fr; }
    .orders-analysis-secondary { grid-template-columns: 1fr; }
    .order-insights { height: auto; min-height: 200px; }
}

@media (max-width: 900px) {
    .index-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .overview-content {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .kpi-block {
        border-right: 0;
        border-bottom: 1px solid #edf0f2;
        padding-bottom: 1rem;
    }

    .order-filters {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
}

@media (max-width: 620px) {
    .index-kpis, .freight-market-kpis, .freight-market-section:first-child .freight-market-kpis { grid-template-columns: 1fr; }
    .source-links { display: none; }
    .freight-chart-wrap, .freight-chart-empty { height: 190px; }
    .content-header { align-items: flex-start; }
}
