.chart-date{
    font-size: 12px;
    color: #333;
    display: block;
    text-align: right;
    margin-top: 10px;
}
.chart-header-1{
    margin-bottom: 0px;
}
.chart-category{
    width: 100%;
    height: 260px;
    position: relative;
}

/* 表格部分样式 */
.table-container-wap {
    margin-top: 20px;
    background: #fff;
    border-radius: 6px;
    padding: 25px 35px;
    border: 1px solid #e0e0e0;
}


.table-subtitle {
    padding: 0 10px;
    padding-bottom: 10px;
    font-size: 12px;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 3px solid #be133d;
}

.table-date,.table-subtitle-text {
    font-size: 12px;
    color: #333;
}

.table-container {
    padding: 0;
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    min-width: 800px;
    background: #fff;
}

.data-table th {
 height: 50px;
 background: #fff;
 text-align: center;
 font-size: 12px;
 color: #333;
 font-weight: bold;
 border-bottom: 1px solid #e0e0e0;
}
.segmentedData-total-row{
    background: #f3f3f3;
    height: 50px;
    border-bottom: 2px solid #be133d;
    font-weight: bold;
    text-align: center;
    font-size: 12px;
}
.segmentedData-country-row td{
    height: 50px;
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    text-align: center;
    font-size: 12px;
    color: #333;
}

/* 2025财年各季度外籍劳工i-140 移民申请表 */
/* I-140表格筛选器样式 */

.filter-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.filter-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.filter-label {
    font-size: 14px;
    color: #333;
    font-weight: 500;
    white-space: nowrap;
}

.filter-select {
    width: 115px;
}
.filter-select-year{
    width: 80px;
}
.filter-select-quarter{
    width: 80px;
}

.query-btn{
    width: 70px;
    height: 31px;
    background: #002768;
    color: #fff;
    text-align: center;
    line-height: 32px;
    border-radius: 3px;
    font-size: 14px;
    cursor: pointer;
}

/* I-140数据表格样式 */
.segmentedData-i140-data-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    margin-top: 25px;
    border-top: 3px solid #be133d;
    table-layout: fixed; /* 固定表格布局，确保列宽稳定 */
}

.segmentedData-i140-data-table th {
    height: 50px;
    background: #fff;
    text-align: center;
    font-size: 12px;
    color: #333;
    font-weight: bold;
    /* border: 1px solid #e0e0e0; */
    vertical-align: middle;
}

/* 表头宽度平均分配 */
.segmentedData-i140-data-table th:first-child {
    width: 200px; /* 类别列宽度 */
}

.segmentedData-i140-data-table th:not(:first-child) {
    width: calc((100% - 200px) / 8); /* 其他8列平均分配剩余宽度 */
}

/* 季度和年份表头样式 */
.segmentedData-header-total,
.segmentedData-total-row-text,
.segmentedData-category-row-text,
.segmentedData-subcategory-row-text,
.segmentedData-category-row-2,
.segmentedData-subcategory-row-2
 {
    background: #ededed !important;
}
.segmentedData-year-header,
.segmentedData-total-row-2,
.segmentedData-i140-data-table-header-row th:nth-child(n + 5){
    background: #ededed !important;
    border-bottom: 1px solid #e0e0e0;
}

.segmentedData-quarter-header,
.segmentedData-total-row-1,
.segmentedData-category-row-1,
.segmentedData-subcategory-row-1,
.segmentedData-i140-data-table-header-row th:nth-child(-n + 4){
    background: #f3f3f3 !important;
    border-bottom: 1px solid #e0e0e0;
    position: relative;
}
.segmentedData-quarter-header:after,
.segmentedData-quarter-header:before,
.segmentedData-total-row td:nth-child(2):before,
.segmentedData-total-row td:nth-child(5):after,
.segmentedData-category-row td:nth-child(2):before,
.segmentedData-subcategory-row td:nth-child(2):before,
.segmentedData-category-row td:nth-child(5):before,
.segmentedData-subcategory-row td:nth-child(5):before,
.segmentedData-i140-data-table-header-row th:nth-child(4):after,
.segmentedData-i140-data-table-header-row th:nth-child(1):before{
    content: '';
    position: absolute;
    right: 0;
    top: 0px;
    height: 48px;
    width: 5px;
    background-color: #fff;

}
.segmentedData-quarter-header:before,
.segmentedData-total-row td:nth-child(2):before,
.segmentedData-category-row td:nth-child(2):before,
.segmentedData-subcategory-row td:nth-child(2):before,
.segmentedData-i140-data-table-header-row th:nth-child(1):before{
    left: 0;
}




.segmentedData-total-row {
    height: 50px;
    font-weight: bold;
    border-bottom: 2px solid #be133d;
}
.segmentedData-total-row-text{
    text-align: center;
    font-size: 12px;
    color: #333;
    font-weight: bold   ;
}
.segmentedData-category-row,.segmentedData-subcategory-row{
    height: 50px;
    border-bottom: 1px solid #e0e0e0;
    text-align: center;
    font-size: 12px;
    color: #333;
}


/* 表格单元格宽度平均分配 */
.i140-data-table td:first-child {
    width: 200px; /* 类别列宽度 */
}

.i140-data-table td:not(:first-child) {
    width: calc((100% - 200px) / 8); /* 其他8列平均分配剩余宽度 */
}

/* 新增图表样式 */
.round-cake-data{
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.round-cake-header{
    margin-bottom: 0;
}
.round-cake-header .chart-title{
   margin-bottom: 15px;
}
.round-cake-data-item{
    width: 100%;
    padding: 25px 30px;
    background: #fff;
    border-radius: 3px;
    border: 1px solid #e0e0e0;
    width: 49%;
}
.round-cake-chart{
    position: relative;
    padding-top: 15px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    /* border-top: 1px solid #e0e0e0; */
}
.round-cake-chart:after{
    content: '';
    position: absolute;
    transform: translate(-50%,-50%);
    top: 0%;
    left: 50%;
    height: 1px;
    width: 105%;
    background: #e0e0e0;
}
.round-chart{
    width: 80px;
}
.round-chart-select{
    width: 70px;
}
.chart-category {
    width: 100%;
    height: 230px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.no-data{
    font-size: 14px;
    color: #666;
    text-align: center;
    height: 230px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 趋势图样式 */
.trend-charts-container {
    display: flex;
    gap: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.trend-chart-item {
    flex: 1;
    background: #fff;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    padding: 25px 30px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.trend-chart-header {
    position: relative;
    margin-bottom: 15px;
}
.trend-chart-header:after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 105%;
    height: 1px;
    background: #e0e0e0;
}

.trend-chart-title {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    text-align: left;
    padding-bottom: 15px;
}

.trend-chart-content {
    margin-bottom: 10px;
}

.trend-chart-content .chart-category {
    height: 260px;
}

.trend-chart-description {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 45px;
}

.trend-chart-description p {
    font-size: 12px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 0px;
    text-align: justify;
    flex: 1;
}

.view-details {
    display: block;
    width: 76px;
    color: #0012ff;
    text-decoration: none;
    font-size: 12px;
    font-weight: 500;
    transition: color 0.3s;
}

.view-details:hover {
    color: #0012ff;
    text-decoration: none;
}

/* O类工作签证表格样式 */
.o-visa-table {
    margin-top: 20px;
}

.o-visa-table .chart-header {
  margin-bottom: 0px;
    /* border-bottom: 2px solid #be133d; */
}
.o-visa-table .chart-title{
    margin-bottom: 5px;
}
.o-visa-table-chart{
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
.o-visa-table-chart-chart{
    width: 80px;
}




.o-visa-data-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    margin-top: 10px;
    border-top: 3px solid #be133d;
}

.o-visa-data-table th {
    height: 50px;
    background: #fff;
    text-align: center;
    font-size: 12px;
    color: #333;
    font-weight: bold;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
}

.o-visa-data-table td {
    height: 50px;
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    text-align: center;
    font-size: 12px;
    color: #333;
    vertical-align: middle;
}

.o-visa-total-row {
    background: #f3f3f3 !important;
    font-weight: bold;
}

.o-visa-total-row td {
    background: #f3f3f3 !important;
    font-weight: bold;
}

.o-visa-note {
    margin-top: 12px;
    text-align: left;
}

.o-visa-note p {
    font-size: 12px;
    color: #666;
    margin: 0;
}

/* 家庭移民环形图样式 */
.family-immigra {
    margin-top: 20px;
   
}
.family-immigration{
    position: relative;
}
.family-immigration-header{
    position: relative;
    display: flex;
    padding-bottom: 10px;
    align-items: flex-end;
    justify-content: space-between
}
.family-immigration-header:after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 105%;
    height: 1px;
    background: #e0e0e0;
}
.family-immigration-title{
    font-size: 16px;
    font-weight: bold;
    color: #333;
    text-align: left;
    padding-bottom: 3px;
}
.family-immigration-date{
    font-size: 12px;
    color: #666;
    text-align: right;
}
.family-immigra-cake-chart{
    position: absolute;
    top: 75px;
    right: 30px;
}

.family-immigration .chart-category {
    height: 230px;
    margin-top: 50px;
}

/* 家庭签证总数分布表格样式 */
.family-visa-table {
    margin-top: 20px;
}

.family-visa-table-title{
    font-size: 16px;
    font-weight: bold;
    color: #333;
    padding-bottom: 20px;
}

.family-visa-table-subtitle {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.family-visa-table-subtitle-text, .family-visa-table-table-date{
    font-size: 14px;
    color: #666;
}


.family-visa-data-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    margin-top: 10px;
    border-top: 3px solid #be133d;
}

.family-visa-data-table th {
    height: 50px;
    background: #fff;
    text-align: center;
    font-size: 12px;
    color: #333;
    font-weight: bold;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
    padding: 0 8px;
}

.family-visa-data-table td {
    height: 50px;
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    text-align: center;
    font-size: 12px;
    color: #333;
    vertical-align: middle;
    padding: 0 8px;
}

.family-visa-total-row {
    background: #f3f3f3 !important;
    font-weight: bold;
    border-bottom: 2px solid #be133d !important;
}

.family-visa-total-row td {
    background: #f3f3f3 !important;
    font-weight: bold;
}

/* 移动端 */
@media (max-width: 1200px) {
   .chart-section{
    width: 100%;
   }
    .chart-date-employment,.segmentedData-i140-data-table{
        width: 1138px;
    }
    .table-container-wap{
        padding: 0 1.333rem;
        border: none;
    }
    .table-container-wap .chart-title{
        font-size: 0.960rem;
        padding-top: 1.6rem;
    }
    .table-container-wap .table-container .data-table{
        width: 1100px;
    }
    .filter-row{
        justify-content: flex-start;
        gap: 10px;
    }
    .filter-row .filter-select-category{
        width: 200px;
    }

    .filter-row .query-btn{
        width: 4rem;
        height: 1.860rem;
        line-height: 1.860rem;
        font-size: 0.853rem;
    }
    .segmentedData-table-container{
        overflow: auto;
        padding-bottom: 10px;
    }

    .round-cake-data{
        flex-direction: column;
    }
    .round-cake-data-item{
        width: 100%;
        padding: 0;
        border: none;
        padding-top: 20px;
        padding-left: 1.333rem;
        padding-right: 1.333rem;
    }
    
    /* 移动端图表样式优化 */
    .chart-category {
        width: 100% !important;
        height: 260px !important;
    }
    
    /* 移动端图例样式优化 */
    #global-country-chart .echarts-legend {
        font-size: 0.747rem !important;
    }
    .trend-charts-container{
        flex-direction: column;
        
    }
    .trend-chart-item{
        border:none;
        padding: 0 1.333rem;
        box-shadow: none;
    }
    .trend-chart-title,.chart-title{
        font-size: 0.960rem;
    }
    .trend-chart-title{
        margin-top: 20px;
    }
    .trend-chart-content-container{
        overflow: auto;
       
    }
    .trend-charts-container .trend-chart-item .trend-chart-content{
        width: 1100px;
    }
    .trend-chart-description{
        gap: 15px;
    }
    .table-container{
        overflow: auto;
    }
    .o-visa-data-table{
        width: 1100px;
    }
    .o-visa-table{
        padding-bottom: 15px;
    }
    .family-immigration-title{
        font-size: 0.960rem;
    }
    .family-immigration .chart-category{
        margin-top: 0;
    }
    .family-visa-table-title{
        font-size: 0.960rem;
        padding-top: 1.6rem;
    }
    .table-container{
        overflow: auto;
    }
    .family-visa-data-table{
        width: 1100px;
    }
}