@charset "utf-8"; /* 指定文件编码为utf-8，防止中文乱码 */
/* ============================================================
   红星中学成绩管理系统 · 全站统一样式表
   所有页面只引用本文件，不再各写一套内联样式。
   ✅ 修改需求：所有按钮（蓝色主按钮、绿色导入导出、红色删除、灰色普通按钮）全部统一外观，不再区分色彩
   常用调整：
   · 整站标题距顶部距离 —— 改 :root 里的 --page-pad-top
   · 表格宽度           —— 改 :root 里的 --content-w
   · 按钮统一底色        —— 改 :root 里的 --btn-main
   ============================================================ */

:root{ /* CSS根变量定义区域，全局都可以调用 */
  --text:#333;          /* 正文颜色 */
  --title:#222;         /* 标题颜色 */
  --muted:#666;         /* 次要文字，说明文字 */
  --faint:#999;         /* 页脚等弱化文字 */
  --border:#e5e7eb;     /* 统一边框色 */
  --head-bg:#f4f7fa;    /* 表头 / 标签背景 */
  --zebra:#f9fafb;      /* 斑马纹背景，表格隔行变色 */
  --hover:#f4f7fa;      /* 旧按钮悬浮背景（当前按钮已统一，该变量保留给其他地方使用） */
  --accent:#2563eb;     /* 强调色（仅用于链接、标题标识线，不再用于主按钮） */
  --danger:#c0392b;     /* 错误提示文字颜色 */
  --ok:#1f7a45;         /* 成功提示文字颜色 */
  --radius:4px;         /* 统一圆角大小 */
  --page-pad-top:120px; /* 页面顶部留白（改这里全站一起变） */
  --content-w:1180px;   /* 表格默认宽度 */
  --btn-main:#e5e7eb;  /* 【新增】统一按钮底色，中性深灰 */
  --btn-hover:#d1d5db;  /* 【新增】按钮悬浮加深色 */
color:#222; /* 统一文字黑色 */
}

/* ---------- 基础重置 ---------- */
*{ /* 选中页面全部元素 */
  margin:0;             /* 清除浏览器默认外边距 */
  padding:0;            /* 清除浏览器默认内边距 */
  box-sizing:border-box; /* 盒模型：内边距、边框算进元素宽度内 */
  font-family:"Microsoft YaHei","PingFang SC",sans-serif; /* 字体优先微软雅黑、苹方，兜底无衬线字体 */
}

body{ /* 页面主体 */
  background:#fff;                      /* 页面背景白色 */
  color:var(--text);                    /* 文字颜色使用变量正文色 */
  padding:var(--page-pad-top) 20px 40px;/* 上、左右、下内边距，顶部留白由变量控制 */
}

/* ---------- 页面标题 ---------- */
.title-main, /* 主大标题 */
.page-title{ /* 页面标题 */
  text-align:center;    /* 文字居中 */
  font-size:50px;       /* 字号50px */
  font-weight:normal;   /* 字体不加粗 */
  color:var(--title);   /* 颜色调用标题变量 */
  letter-spacing:2px;   /* 字间距2px */
  line-height:1.15;     /* 行高 */
}

.title-sub, /* 主标题副标题 */
.page-sub{  /* 页面副标题 */
  text-align:center;    /* 居中 */
  font-size:14px;       /* 字号14 */
  color:var(--muted);   /* 次要灰色文字 */
  margin:10px 0 34px;   /* 外边距：上10px，左右0，下34px */
}

.page-head{ /* 页面头部容器 */
  margin:0 auto 30px;   /* 左右自动居中，底部外边距30px */
}

/* import / create_db 页的卡片式页头 */
h1{ /* 一级标题 */
  font-size:34px;       /* 字号34 */
  font-weight:normal;   /* 不加粗 */
  color:var(--title);   /* 标题色 */
  letter-spacing:2px;   /* 字间距 */
  margin-bottom:10px;   /* 底部外边距 */
  text-align:center;    /* 居中 */
}
table{ /* 表格基础 */
  width:100%;           /* 宽度100% */
  border-collapse:collapse; /* 合并边框，消除双边框缝隙 */
}
.head{ /* 头部容器 */
  text-align:center;    /* 内部内容居中 */
  margin-bottom:26px;   /* 底部外边距 */
}
.head h1{ /* head容器里面的h1 */
  font-size:34px;
  font-weight:normal;
  color:var(--title);
  letter-spacing:2px;
  margin-bottom:10px;
}
.head .sub{ /* head里面的副标题 */
  font-size:13px;
  color:var(--muted);
  letter-spacing:1px;
}
.head .line{ /* 标题下方装饰横线 */
  width:58px;
  height:3px;
  background:var(--accent);
  border-radius:2px;
  margin:14px auto 0; /* 上边距14，左右居中 */
}

/* ---------- 容器 ---------- */
.page{ /* 页面容器 */
  max-width:1100px;     /* 最大宽度限制 */
  margin:0 auto;        /* 居中 */
}
.page-shell{ /* 宽版页面容器 */
  max-width:1320px;
  margin:0 auto;
}
.wrap{ /* 小容器，登录类页面外层 */
  width:520px;
  max-width:100%;
  margin:0 auto;
  padding:20px;
}
/* 添加 / 修改成绩的表单外框 */
.box{ /* 表单盒子 */
  width:880px;
  max-width:100%;
  margin:0 auto;
  border:1px solid var(--border);
  border-radius:8px;
  padding:24px;
}
/* 登录 / 注册 / 找回密码卡片 */
.login-card{ /* 登录卡片 */
  width:420px;
  max-width:100%;
  margin:14px auto 0;
  padding:28px 26px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
}
.login-card h3{ /* 登录卡片内标题 */
  text-align:center;
  font-size:17px;
  font-weight:normal;
  color:var(--title);
  margin-bottom:18px;
}
.card{ /* 通用卡片 */
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  padding:20px 22px;
  margin-bottom:16px;
}
.card h3{ /* 卡片标题 */
  font-size:15px;
  font-weight:600;
  color:var(--title);
  margin-bottom:14px;
  padding-left:10px;
  border-left:3px solid var(--accent); /* 左侧竖线标识 */
  line-height:1.2;
}

/* ---------- 输入框与下拉 ---------- */
input[type="text"], /* 文本输入框 */
input[type="password"], /* 密码框 */
input[type="number"], /* 数字输入框 */
select, /* 下拉选择框 */
textarea{ /* 多行文本域 */
  font-family:inherit;  /* 继承父元素字体 */
  font-size:14px;
  color:var(--text);
  background:#fff;
  border:1px solid #d1d5db;
  border-radius:var(--radius);
  padding:6px 8px;
  outline:none;         /* 去掉浏览器默认聚焦外轮廓 */
}
input[type="text"]:focus, /* 输入框聚焦状态 */
input[type="password"]:focus,
input[type="number"]:focus,
select:focus,
textarea:focus{
  border-color:#a9b6c6; /* 聚焦时边框变色 */
}
select{ /* 下拉框文字居中 */
  text-align:center;
}

/* 登录页：一行一个输入项 */
.form-item{ /* 登录表单行 */
  display:flex;         /* 弹性布局横向排列 */
  align-items:center;   /* 垂直居中 */
  margin-bottom:16px;
}
.form-item label{ /* 表单标签 */
  width:64px;
  font-size:14px;
  color:var(--text);
  white-space:nowrap;   /* 文字不换行 */
}
.form-item input{ /* 表单输入框 */
  flex:1;               /* 自动占满剩余宽度 */
  height:38px;
  text-align:center;
}

/* 自动填充时保持白底，覆盖浏览器自动填充黄色背景 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0px 1000px #fff inset !important;
  -webkit-text-fill-color:#333 !important;
}

/* 密码框伪装成文本框，避免浏览器弹"保存密码" */
.pwd{
  -webkit-text-security:disc;
  text-security:disc;
}

/* 表格式表单（添加 / 修改成绩） */
.formtab{ /* 表单表格 */
  border-collapse:collapse;
  width:100%;
}
.formtab td{ /* 表单单元格 */
  border:1px solid var(--border);
  padding:10px;
  background:#fff;
}
.formtab td.label{ /* 表单标签单元格 */
  background:var(--head-bg);
  text-align:right;
  width:120px;
  font-size:14px;
  color:var(--text);
}
.formtab input, /* 表单内输入框 */
.formtab select{
  width:100%;
}
.formtab input[readonly]{ /* 只读输入框 */
  background:var(--head-bg);
  color:var(--muted);
}

/* 查询条件条 */
.search-box{ /* 查询区域 */
  margin:0 0 24px;
  text-align:center;
}
.search-box label{ /* 查询标签 */
  font-size:14px;
  color:var(--text);
  margin:0 6px;
}
.search-box select, /* 查询下拉、输入框 */
.search-box input[type="text"]{
  width:200px;
  margin:0 6px;
}
.selbox{ /* 选择框容器 */
  margin:0 auto 18px;
  text-align:center;
  font-size:14px;
  color:var(--muted);
}
.selbox select{ /* 选择下拉 */
  font-size:14px;
  padding:6px 10px;
  margin-left:8px;
  text-align:left;
}
.exam-select-box{ /* 考试选择容器 */
  text-align:center;
  margin-bottom:15px;
}
.exam-select-box select{ /* 考试下拉 */
  padding:6px 8px;
  font-size:14px;
}
.bar{ /* 按钮操作栏 */
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:14px;
}
.bar span{ /* 操作栏文字 */
  font-size:13px;
  color:var(--text);
}

/* ---------- 按钮【核心修改：全站所有按钮统一一套样式，取消蓝/红/绿/灰区分】 ---------- */
button{ /* 原生button标签 */
  padding:6px 14px;
  font-size:13px;
  line-height:1.6;
  color:#222;               /* 按钮文字白色 */
  background:var(--btn-main);/* 统一深灰底色 */
  border:1px solid var(--btn-main);
  border-radius:var(--radius);
  cursor:pointer;            /* 鼠标悬浮变成手型 */
  font-family:inherit;
}
button:hover{ /* button悬浮 */
  background:var(--btn-hover);
  border-color:var(--btn-hover);
  color:#222;
}
.btn, /* 基础按钮class */
.page-box a,
.nav a,
.btn-row a,
.btn-row button,
.search-box button{
  display:inline-block;
  padding:6px 14px;
  font-size:13px;
  line-height:1.6;
  color:#222;
  background:var(--btn-main);
  border:1px solid var(--btn-main);
  border-radius:var(--radius);
  text-decoration:none; /* a标签去掉下划线 */
  cursor:pointer;
  font-family:inherit;
  white-space:nowrap;   /* 按钮文字不换行 */
}
.btn:hover,
.page-box a:hover,
.nav a:hover,
.btn-row a:hover,
.btn-row button:hover,
.search-box button:hover{
  background:var(--btn-hover);
  border-color:var(--btn-hover);
  color:#fff;
}
.btn-row{ /* 按钮行容器 */
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:20px;
  text-align:center;
}

/* ========== 原来的各色按钮类，全部覆盖重写，不再有颜色差异 ========== */
.btn-primary,
.btn-blue,
.btn-del,
.btn-red,
.btn-exp,
.btn-green,
.btn-outline,
.btn-gray,
.btn-success,
.btn-warning,
.btn-info,
.btn-default,
.btn-normal
{
  background:var(--btn-main);
  border-color:var(--btn-main);
  color:#222;
}
.btn-primary:hover,
.btn-blue:hover,
.btn-del:hover,
.btn-red:hover,
.btn-exp:hover,
.btn-green:hover,
.btn-outline:hover,
.btn-gray:hover,
.btn-success:hover,
.btn-warning:hover,
.btn-info:hover,
.btn-default:hover,
.btn-normal:hover
{
  background:var(--btn-hover);
  border-color:var(--btn-hover);
  color:#222;
}
/* 登录卡片提交按钮，同步统一样式 */
.login-card button[type="submit"]{
  display:block;
  width:100%;
  padding:8px 14px;
  font-size:14px;
  color:#fff;
  background:var(--btn-main);
  border:1px solid var(--btn-main);
}
.login-card button[type="submit"]:hover{
  background:var(--btn-hover);
  border-color:var(--btn-hover);
}
.login-card > div{ /* 登录卡片底部区域 */
  text-align:center;
  margin-top:14px;
}
.login-card a{ /* 登录卡片内链接 */
  color:var(--accent);
  font-size:13px;
  text-decoration:none;
  margin:0 6px;
}
.login-card a:hover{ /* 链接悬浮 */
  text-decoration:underline;
}

/* 导入页上传条 */
.toolbar{ /* 工具栏 */
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.toolbar input[type="file"]{ /* 文件选择框 */
  padding:5px 10px;
  border:1px dashed #b9c6d6;
  border-radius:8px;
  background:#fbfdff;
  font-size:13px;
  color:var(--muted);
  cursor:pointer;
  font-family:inherit;
}

/* ---------- 表格 ---------- */
.table1{ /* 主成绩表格 */
  width:var(--content-w);
  max-width:100%;
  margin:0 auto;
  border-collapse:collapse;
  font-size:14px;
  text-align:center;
  background:#fff;
}
th{ /* 表头单元格 */
  font-size:14px;
  padding:9px 6px;
  border:1px solid var(--border);
  background:var(--head-bg);
  color:var(--text);
  font-weight:normal;
  white-space:nowrap;
}
td{ /* 普通单元格 */
  font-size:14px;
  padding:8px 6px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text);
  text-align:center;
}
.table1 tr:nth-child(even) td, /* 偶数行斑马纹 */
.tbl tr:nth-child(even) td,
.sheet tr:nth-child(even) td{
  background:var(--zebra);
}
/* 当前学生高亮行 */
.table1 .hl td,
tr.hl td{
  background:#eef6ff !important;
  color:var(--accent);
  font-weight:bold;
}
.table1 td a, /* 表格内链接 */
.tbl a{
  color:var(--text);
  text-decoration:none;
}
.table1 td a:hover,
.tbl a:hover{
  text-decoration:underline;
}
.table1 caption{ /* 表格标题说明 */
  font-size:14px;
  color:var(--muted);
  padding-bottom:10px;
}

/* 数据浏览表（导入页 / 建库页） */
.tbl,
.sheet{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.sheet-wrap{ /* 表格外层滚动容器 */
  overflow-x:auto;        /* 超出宽度横向滚动 */
  border:1px solid var(--border);
  border-radius:8px;
  background:#fff;
}
.sheet th{
  position:sticky;
  top:0;                  /* 表头吸顶，滚动时固定 */
}
.sheet td input,
.sheet td select{
  width:100%;
}

/* ---------- 提示信息 ---------- */
.msg{ /* 默认提示 */
  text-align:center;
  font-size:14px;
  color:var(--danger);
  min-height:24px;
  margin-bottom:12px;
}
.msg-ok,
.msg.ok{ /* 成功提示 */
  padding:10px 14px;
  border-radius:8px;
  background:#effaf3;
  border:1px solid #bfe7cf;
  color:var(--ok);
  font-weight:600;
}
.msg-err,
.msg.err{ /* 错误提示 */
  padding:10px 14px;
  border-radius:8px;
  background:#fff2f0;
  border:1px solid #ffd7d2;
  color:var(--danger);
  font-weight:600;
  white-space:pre-wrap;
  overflow-x:auto;
}
.tip{ /* 小字提示 */
  font-size:13px;
  color:var(--muted);
  line-height:1.9;
  margin:10px 0;
}
.info{ /* 信息提示块 */
  display:table;
  margin:0 auto 22px;
  text-align:left;
  padding:10px 16px;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
  background:var(--zebra);
  border:1px solid var(--border);
  border-radius:6px;
}
.info span{
  color:var(--text);
}
.pick{ /* 选择提示 */
  text-align:center;
  font-size:14px;
  color:var(--muted);
  margin:0 0 20px;
}
.pick a{
  display:inline-block;
  margin:0 6px;
  font-size:14px;
  color:var(--accent);
  text-decoration:none;
}
.pick a:hover{
  text-decoration:underline;
}
.sum{ /* 汇总文字 */
  font-size:13px;
  color:var(--muted);
  line-height:1.8;
  margin-bottom:12px;
}
.empty{ /* 空数据提示 */
  color:var(--faint);
  font-size:13px;
  padding:6px 0;
}
.stepbox{ /* 步骤信息盒子 */
  background:var(--zebra);
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px 14px;
  font-size:13px;
  line-height:1.85;
  color:var(--muted);
  margin-bottom:14px;
}
.conn{ /* 数据库连接提示 */
  text-align:center;
  color:var(--accent);
  font-size:13px;
  margin-bottom:16px;
}
.subtitle{ /* 副标题 */
  text-align:center;
  color:var(--muted);
  font-size:13px;
  margin-bottom:8px;
}
.tag{ /* 通用标签 */
  display:inline-block;
  padding:1px 9px;
  border-radius:20px;
  font-size:12px;
  background:#f2f4f7;
  color:#64748b;
}
.tag-sys{ /* 系统标签 */
  background:#f8fafc;
  color:#94a3b8;
}
.tag-score{ /* 分数标签 */
  background:#eaf3ff;
  color:#1d4ed8;
}
.dbtitle{ /* 数据库标题栏 */
  font-size:14px;
  font-weight:600;
  color:var(--title);
  margin:14px 0 6px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.dbg{ /* debug调试信息框 */
  background:var(--zebra);
  border:1px solid var(--border);
  border-radius:8px;
  padding:12px 14px;
  max-height:520px;
  overflow:auto;
  white-space:pre-line;
  font-size:12px;
  line-height:1.85;
  color:var(--muted);
  font-family:Consolas,"Microsoft YaHei",monospace;
}
pre{ /* 代码预格式化块 */
  margin-top:6px;
  text-align:left;
  font-size:12px;
  line-height:1.7;
  background:#fff;
  padding:8px;
  border:1px solid var(--border);
  border-radius:6px;
  white-space:pre-wrap;
  overflow-x:auto;
}

/* ---------- 分页 ---------- */
.page-box{ /* 分页容器 */
  margin:22px auto 0;
  text-align:center;
}
.page-box .pgs{ /* 分页统计文字 */
  font-size:13px;
  color:var(--muted);
  margin-right:10px;
}
.pager{ /* 分页按钮组 */
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:center;
  margin-top:16px;
}
.nav{ /* 底部导航 */
  margin:26px 0 0;
  text-align:center;
}

/* ---------- 页脚 ---------- */
.foot{ /* 页脚 */
  text-align:center;
  font-size:12px;
  color:var(--faint);
  letter-spacing:1px;
  margin-top:24px;
}
.foot a{ /* 页脚链接 */
  color:var(--muted);
  text-decoration:none;
}
.foot a:hover{
  color:var(--title);
  text-decoration:underline;
}

/* ---------- 遮罩弹窗（留言给管理员） ---------- */
.modal{ /* 弹窗遮罩层 */
  display:none; /* 默认隐藏 */
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,.4);
  z-index:999; /* 层级置顶 */
}
.modal-box{ /* 弹窗内容盒子 */
  width:480px;
  max-width:92%;
  background:#fff;
  margin:160px auto;
  padding:26px;
  border-radius:8px;
}
.modal-box h3{ /* 弹窗标题 */
  text-align:center;
  font-size:16px;
  font-weight:normal;
  margin-bottom:18px;
  color:var(--title);
}
.modal-item{ /* 弹窗表单项 */
  margin-bottom:14px;
}
.modal-item label{ /* 弹窗标签 */
  display:block;
  font-size:14px;
  margin-bottom:4px;
  color:var(--text);
}
.modal-item input, /* 弹窗输入框 */
.modal-item textarea{
  width:100%;
}
.modal-item textarea{ /* 弹窗文本域 */
  height:120px;
  resize:none; /* 禁止拖动缩放 */
}
.modal-btn{ /* 弹窗按钮组 */
  display:flex;
  gap:10px;
  justify-content:center;
  margin-top:10px;
}

/* 注册框默认隐藏（index.php 用） */
#regbox{display:none;}

/* ---------- 建库 / 导入页专用字段宽度 ---------- */
.bar input[type="text"],
.bar input[type="password"]{width:150px;}
.bar input[name="port"]{width:72px;}
.bar input[name="tablename"]{width:180px;}
.bar input[name="imp_db_new"]{width:160px;}
.card table input[type="text"],
.card table select{width:100%;}

/* ---------- 小屏适配 ---------- */
@media (max-width:1240px){ /* 视口宽度小于等于1240px时生效 */
  body{padding-left:12px;padding-right:12px;}
  .title-main,.page-title{font-size:36px;}
  .head h1{font-size:26px;}
}