
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
    background-color: #FFFFFF;
    color: #111;  /* 苹果常用深色文字 */
    margin: 0;
    padding: 0;
}

.table-row {
  display: flex;
  gap: 40px;      /* 两个表格之间的间距，随意调整 */
  justify-content: center; 
  align-items: flex-start;
  margin-bottom: 40px;
}


.containerCountsLabels {

  max-width: 800px; /* 减小最大宽度为 600px */
  background-color: #ffffff;  /* 白色容器 */
  padding: 20px; /* 减小内边距 */
  border-radius: 12px; /* 圆角减小 */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);  /* 轻微的阴影 */
  margin-top: 15px;  /* 减小顶部外边距 */
  margin-left: 20px; /* 减小左侧外边距 */
  margin: 15px auto
}






/* 表格样式 */
table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 5px; /* 减小顶部间距 */
}

th, td {
  padding: 12px;  /* 减小单元格内边距 */
  text-align: left;
  border: 1px solid #d0d0d5;  /* 浅灰色边框 */
  font-size: 14px; /* 减小字体大小 */
  color: #333;
}

/* 标题行样式 */
th {
  background-color: #f9f9fa;  /* 浅灰色背景 */
  font-weight: 600;  /* 加粗字体 */
  text-align: center;  /* 表头文字居中 */
}
th.wideCountsLabels {
  width: 35%; /* 设定标签列为较宽 */
}

th.narrowCountsLabels {
  width: 10%; /* 设定数量列为较小 */
}

/* 数据行样式 */
td {
  background-color: #ffffff;  /* 白色背景 */
  text-align: center;
}



/* 每行交替背景 */
tr:nth-child(even) td {
  background-color: #f9f9fa;  /* 每行交替背景 */
}


/* 小细节优化 */
table {
  border-radius: 10px;  /* 圆角减小 */
  border: none;
}




.containerModelEvaluation {
  max-width: 700px; /* 减小最大宽度为 600px */
  background-color: #ffffff;  /* 白色容器 */
  padding: 20px; /* 减小内边距 */
  border-radius: 12px; /* 圆角减小 */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);  /* 轻微的阴影 */
  margin-top: 15px;  /* 减小顶部外边距 */
  margin-left: 20px; /* 减小左侧外边距 */
  margin: 15px auto
}
th.wideModelEvaluation {
  width: 40%; /* 设定标签列为较宽 */
}

th.narrowModelEvaluation {
  width: 4%; /* 设定数量列为较小 */
}

.title_red {
  font-size: 24px; /* 减小标题字体大小 */
  font-weight: 700;
  color: #c22d12;  /* 深灰色 */
  text-align: center;
  margin-bottom: 8px; /* 减小底部间距 */
  letter-spacing: 0.3px; /* 缩小字母间距 */
}









.images-wrapper {
  display: flex;        /* 水平排列两个图 */
  gap: 40px;            /* 两张图之间的间距 */
  margin-top: 20px;
}

.image-block {
  display: flex;
  flex-direction: column;   /* 图片 + 文字 竖直排列 */
  align-items: center;      /* 每个 block 内水平居中 */
}

.model-image {
  max-width: 900px;
  max-height: 1300px;
  border: 1px solid #ddd;
  padding: 10px;
}

.image-caption {
  margin-top: 10px;
  font-size: 20px;
  color: #000000;
  text-align: center;
}




#loadingOverlay {
    display: none;  /* 初始隐藏 */
    position: fixed;
    top:0; left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.3);  /* 更透明，苹果风格更柔和 */
    z-index: 9999;
    justify-content: center;
    align-items: center;
}

.loading-box {
    background: rgba(255, 255, 255, 0.95); /* 白色半透明 */
    padding: 25px 35px;
    border-radius: 20px;  /* 圆角更大 */
    text-align: center;
    color: #333;           /* 深灰文字，更苹果风格 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);  /* 柔和阴影 */
}

.loading-text { 
    margin-top: 15px;
    font-size: 16px;       /* 字稍微小一点，更简洁 */
    font-weight: 500;      /* 字重中等，更苹果风格 */
}

.spinner {
    border: 4px solid rgba(0,0,0,0.1);   /* 边框浅灰 */
    border-top: 4px solid #555;          /* 顶部深灰色，旋转时更柔和 */
    border-radius: 50%;
    width: 40px; 
    height: 40px;
    animation: spin 1s linear infinite;
    margin: 0 auto;
}

@keyframes spin { 
    0% { transform: rotate(0deg); } 
    100% { transform: rotate(360deg); } 
}






/* 容器垂直排列，居中 */
.upload-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 500px; 
    margin-top: 200px; 
}

/* 隐藏原生文件选择框 */
#fileInput {
    display: none;
}

/* 统一按钮样式（选择文件夹 + 上传） */
.upload-container button,
.custom-file-upload {
    width: 150px;           /* 固定宽度，保证一致 */
    padding: 10px 25px;     /* 内边距 */
    border-radius: 15px;    /* 圆角 */
    border: 1px solid #ccc;
    background: #f0f0f5;    /* 浅灰背景 */
    color: #333;             /* 字体颜色 */
    font-size: 16px;         /* 字体大小 */
    font-weight: 500;        /* 字体粗细 */
    cursor: pointer;
    text-align: center;
    box-shadow: 0 3px 8px rgba(0,0,0,0.08);
    transition: all 0.2s ease;
}

.upload-container button:hover,
.custom-file-upload:hover {
    background: #e0e0eb;
    box-shadow: 0 5px 15px rgba(0,0,0,0.12);
}

.upload-container button:active,
.custom-file-upload:active {
    transform: translateY(1px);
    box-shadow: 0 3px 8px rgba(0,0,0,0.08);
}
