﻿
.dashboard {
    width: 100%;
}

/* 顶部导航条 — 仿图片中的“搜索... Q” */
.top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    background: white;
    padding: 0.8rem 1.8rem;
    border-radius: 60px;
    box-shadow: 0 8px 18px rgba(0,20,40,0.04);
    border: 1px solid #e6ecf5;
}

.search-area {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #5a6f91;
}

    .search-area span:first-child {
        font-size: 1.1rem;
        font-weight: 500;
        color: #2b3d5c;
    }

    .search-area .q-icon {
        background: #eef3fb;
        border-radius: 40px;
        padding: 0.3rem 1.2rem;
        font-size: 0.95rem;
        color: #2f4870;
        border: 1px solid #ccd9ec;
    }

.company-mini {
    display: flex;
    align-items: center;
    gap: 2rem;
}

    .company-mini .name {
        font-weight: 600;
        color: #1d3a6f;
        font-size: 1.1rem;
    }

    .company-mini .badge {
        background: #eef2f9;
        border-radius: 40px;
        padding: 0.3rem 1.2rem;
        color: #1d3a6f;
        font-size: 0.9rem;
        border: 1px solid #c7d7f0;
    }

/* 卡片通用样式 */
.card {
    background: #ffffff;
    border-radius: 10px;
    padding: 1.5rem 1.8rem;
    box-shadow: 0 20px 35px -10px rgba(0, 30, 60, 0.08);
    border: 1px solid #e9eef6;
    transition: 0.2s;
}

.card-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #132c4a;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    letter-spacing: 0.2px;
}

    .card-title .light {
        font-weight: 400;
        color: #61799e;
        font-size: 0.9rem;
    }

/* 第一行：企业信息 + pulanka + 今日AI达标分布图 (三列) */
.row-corporate {
    display: grid;
    grid-template-columns: 1fr 1fr 1.4fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

/* 企业信息卡片 (左侧) */
.corp-info {
    background: white;
    border-radius: 10px;
    padding: 1.5rem 1.8rem;
    border: 1px solid #e9eef6;
    box-shadow: 0 20px 35px -10px rgba(0, 30, 60, 0.08);
}

.corp-name-large {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1b3d6b;
    margin-bottom: 0.5rem;
}

.corp-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem 2rem;
    margin: 1.2rem 0 1.5rem;
    color: #2f4870;
    font-size: 0.95rem;
}

.corp-meta-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .corp-meta-item .label {
        color: #657eaa;
    }

    .corp-meta-item .value {
        font-weight: 600;
        color: #0b2b52;
        background: #f0f6ff;
        padding: 0.2rem 0.8rem;
        border-radius: 40px;
        border: 1px solid #d5e2fa;
    }

/* 柱状图模拟 (企业信息内的柱) */
.bar-chart-simple {
    align-items: baseline;
    gap: 1.8rem;
    margin-top: 1.2rem;
}

.bar-item {
    flex: 1;
}

.bar-label {
    font-size: 0.85rem;
    color: #556f97;
    margin-bottom: 0.3rem;
}

.bar-bg {
    background: #e7eefb;
    height: 12px;
    border-radius: 10px;
    width: 100%;
    overflow: hidden;
}

.bar-fill {
    background: linear-gradient(90deg, #ff9900, #ffb347);
    height: 12px;
    border-radius: 10px;
    width: 75%; /* 模拟数据 */
}

.fill-60 {
    width: 60%;
}

.fill-45 {
    width: 45%;
}

/* pulanka 卡片 (中间) */
.pulanka-card {
    background: white;
    border-radius: 10px;
    padding: 1.5rem 1.8rem;
    border: 1px solid #e9eef6;
    flex-direction: column;
    justify-content: center;
}

.pulanka-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1b3d6b;
    margin-bottom: 0.5rem;
}

.pulanka-stats {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    margin-top: 10%;
}

.stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dashed #d0dff5;
    padding-bottom: 0.5rem;
}

    .stat-row .label {
        color: #3a577b;
    }

    .stat-row .number {
        font-weight: 700;
        font-size: 1.4rem;
        color: #1f3f73;
    }

.small-note {
    color: #809bc2;
    font-size: 0.9rem;
    margin-top: 0.5rem;
    text-align: right;
}

/* 今日AI达标分布图 (右侧卡片) */
.tdg-card {
    background: white;
    border-radius: 10px;
    padding: 1.5rem 1.8rem;
    border: 1px solid #e9eef6;
}

.tdg-title {
    font-size: 1.2rem;
    font-weight: 600;
    color: #132c4a;
    margin-bottom: 1.2rem;
}

.tdg-grid {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.donut-placeholder {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: conic-gradient(#ffaa33 0deg 210deg, #e0eaff 210deg 360deg);
    border: 4px solid white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    flex-shrink: 0;
}

.tdg-labels {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .tdg-labels .item {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: #3b557b;
    }

.dot-orange {
    width: 12px;
    height: 12px;
    background: #ffaa33;
    border-radius: 4px;
}

.dot-blue {
    width: 12px;
    height: 12px;
    background: #98b9f0;
    border-radius: 4px;
}

/* 第二行：四个指标卡片 (120,114,100,80) */
.kpi-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.kpi-card {
    background: white;
    border-radius: 10px;
    padding: 1.3rem 1.5rem;
    border: 1px solid #e9eef6;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.kpi-left .label {
    font-size: 0.95rem;
    color: #61799e;
}

.kpi-left .value {
    font-size: 2.3rem;
    font-weight: 700;
    color: #17325c;
    line-height: 1.2;
}

.kpi-icon {
    font-size: 2rem;
    opacity: 0.6;
    color: #fe9800;
}

/* 第三行：Google Gemini + rock drilling tools + 外链条数 */
.row-gemini {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 0.8fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.gemini-card, .drill-card, .chain-card {
    background: white;
    border-radius: 10px;
    padding: 1.3rem 1.5rem;
    border: 1px solid #e9eef6;
}

.gemini-header {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.8rem;
}

    .gemini-header span:first-child {
        font-weight: 600;
        color: #1c3d70;
    }

    .gemini-header .value-badge {
        background: #f0f6ff;
        padding: 0.2rem 1rem;
        border-radius: 40px;
        font-weight: 600;
        color: #12428b;
    }

.drill-card .main-key {
    font-size: 1.5rem;
    font-weight: 600;
    color: #0b2d56;
    margin: 0.5rem 0;
}

.drill-card .sub {
    color: #7089b5;
    font-size: 0.9rem;
}

.chain-card .number-large {
    font-size: 2.5rem;
    font-weight: 700;
    color: #1b3f76;
}

/* 第四行：Top Hammer / Down The Hole 等 (两列) */
.row-hammer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.hammer-card {
    background: white;
    border-radius: 10px;
    padding: 1.3rem 1.5rem;
    border: 1px solid #e9eef6;
}

.hammer-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem 1.5rem;
    margin-top: 0.8rem;
}

.hammer-tag {
    background: #f2f8ff;
    border: 1px solid #ccdffa;
    border-radius: 40px;
    padding: 0.3rem 1.2rem;
    font-size: 0.9rem;
    color: #1a3f72;
}

/* 第五行：媒体数据 + Google AI Overview + Google Gemini + ChatGPT + Copilot (五列) */
.row-media {
    display: grid;
    grid-template-columns: 0.9fr 0.9fr 0.9fr 0.9fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.media-card {
    background: white;
    border-radius: 10px;
    padding: 1.2rem;
    border: 1px solid #e9eef6;
    text-align: center;
}

    .media-card .label {
        color: #55709b;
        font-size: 0.9rem;
    }

    .media-card .value {
        font-size: 1.8rem;
        font-weight: 700;
        color: #1b3e74;
    }

.small-badge {
    background: #eef4fe;
    padding: 0.2rem 0.8rem;
    border-radius: 30px;
    font-size: 0.8rem;
    color: #2d5390;
}

/* 第六行：主要产品 + 平台排名占比（PRR）+ 收录统计（IS）三列 */
.row-product-prr-is {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.product-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.product-item {
    background: #f7fbff;
    border-radius: 40px;
    padding: 0.5rem 1.2rem;
    border: 1px solid #dae6fd;
    color: #12315e;
}

.prr-card, .is-card {
    background: white;
    border-radius: 10px;
    padding: 1.3rem;
    border: 1px solid #e9eef6;
}

.prr-big {
    font-size: 2.2rem;
    font-weight: 700;
    color: #004080;
    margin: 0.5rem 0;
}

.progress-bar {
    background: #e3ebf9;
    height: 10px;
    border-radius: 10px;
    width: 100%;
    margin: 1rem 0;
}

.progress-fill {
    background: #ff9900;
    height: 10px;
    border-radius: 10px;
    width: 30.37%;
}

/* 第七行：最近7天达标趋势（7DT）大卡片 */
.trend-card {
    background: white;
    border-radius: 10px;
    padding: 1.8rem 2rem;
    border: 1px solid #e9eef6;
    margin-top: 0.5rem;
}

.trend-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

    .trend-header .title {
        font-size: 1.3rem;
        font-weight: 600;
        color: #12305c;
    }

.trend-numbers {
    display: flex;
    gap: 2rem;
    color: #2f4d82;
}

    .trend-numbers span {
        font-weight: 700;
        font-size: 1.2rem;
    }

.trend-bars {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.8rem;
    margin: 2rem 0 0.5rem;
}

.trend-day {
    flex: 1;
    text-align: center;
    color: #5b739b;
}

.bar-graph {
    height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
}

    .bar-graph .bar {
        width: 100%;
        background: #ffaa33;
        border-radius: 12px 12px 4px 4px;
        min-height: 6px;
    }

    .bar-graph .day-label {
        margin-top: 0.4rem;
        font-size: 0.8rem;
    }

/* 辅助 */
hr {
    border: 1px solid #e1eaf5;
    margin: 1rem 0;
}

.hjkj {
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 300px;
    overflow: hidden;
}
@media(max-width:1600px) {
    .nav-header .brand-logo {
        height: 6.2rem;
    }
}

    @media(max-width:1200px) {
        .row-corporate {
        display: block;
    }

    .corp-info {
        margin-bottom: 1.5rem;
    }
    .pulanka-card {
        margin-bottom: 1.5rem;
    }

}
@media(max-width:1000px) {
    .row-media {
        grid-template-columns: 0.9fr 0.9fr ;
    }
}
@media(max-width:800px) {
    .row-product-prr-is {
        display: block;
    }
    .prr-card {
        margin-bottom: 1.5rem;
    }
    .corp-info {
        margin-top: 1.5rem;
    }
    [data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .header {
        padding-left: 0;
     
    }
        [data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .header .header-content {
            
        }
    .header-right {
    display:none;}
    .header {
   }
    .logoimg {
    width:auto;}
        .logoimg img {
        height:40px;}
        .nav-header .brand-logo {
            height: 5.2rem;
            background-color: #040d7c;
        }

    .dlabnav {
        background-color: #040d7c;
        margin-top: -10px !important;
    }
}