body{

margin:0;

font-family:
Arial,
"Microsoft Yahei";

background:#f5f6fa;

}


/* =====================
顶部
===================== */

.header{

height:70px;

background:#1677ff;

color:white;

display:flex;

justify-content:space-between;

align-items:center;

padding:0 40px;

}





button{

border:0;

padding:8px 15px;

border-radius:5px;

cursor:pointer;

}







/* =====================
统计卡片
===================== */


.cards{

display:flex;

gap:30px;

padding:30px;

}



.card{

background:white;

width:220px;

padding:20px;

border-radius:12px;

box-shadow:
0 5px 20px #ddd;

}



.card p{

font-size:35px;

color:#1677ff;

}









/* =====================
表格
===================== */


table{

width:90%;

margin:auto;

background:white;

border-collapse:collapse;

}



th,td{

padding:15px;

border-bottom:
1px solid #eee;

text-align:center;

}






/* =====================
登录
===================== */


.login-box{


width:350px;

margin:150px auto;

background:white;

padding:40px;

border-radius:15px;

box-shadow:
0 5px 30px #ddd;

}



.login-box input{


width:100%;

padding:12px;

margin:10px 0;

box-sizing:border-box;


}



.login-box button{


width:100%;

background:#1677ff;

color:white;

}






h2{

padding-left:40px;

}







/* =====================
编辑页面
===================== */


.edit-box{


width:600px;

margin:40px auto;

background:white;

padding:30px;

border-radius:15px;


}



.edit-box input{


width:100%;

padding:15px;

margin-bottom:20px;

box-sizing:border-box;


}



.edit-box textarea{


width:100%;

height:300px;

padding:15px;

box-sizing:border-box;

margin-bottom:20px;


}



.edit-box button{


background:#1677ff;

color:white;

padding:12px 30px;


}







/* =====================
管理员认证区域
===================== */


.admin-box{

width:900px;

margin:50px auto;

background:white;

padding:40px;

border-radius:20px;

box-shadow:
0 10px 30px rgba(0,0,0,.08);

}







.auth-card{


display:flex;

align-items:center;

gap:25px;

padding:20px;

margin-top:20px;

border-radius:20px;

background:#f8faff;

box-shadow:
0 5px 15px rgba(0,0,0,.05);


transition:.3s;

cursor:pointer;


}



.auth-card:hover{

transform:translateY(-5px);

}







/* =====================
学生证图片
===================== */


/* 卡片里面 */

.student-img{


width:150px;


height:100px;


object-fit:cover;


border-radius:12px;


border:1px solid #ddd;


cursor:pointer;


}





/* 表格里面 */

.card-img{


width:120px;


height:80px;


object-fit:cover;


border-radius:8px;


border:1px solid #ddd;


cursor:pointer;


}







/* =====================
认证信息
===================== */


.info{

font-size:18px;

}



.info button{


padding:12px 25px;

border:none;

border-radius:25px;

background:#4b8cff;

color:white;

cursor:pointer;

margin-right:15px;


}



.reject{

background:#ff5e62!important;

}







/* =====================
菜单
===================== */


.menu{

display:flex;

gap:20px;

margin:20px 0;

}



.menu button{


padding:15px 25px;

border:none;

border-radius:15px;

background:#4b8cff;

color:white;

font-size:16px;

cursor:pointer;

}



.menu button:hover{

opacity:.85;

}







/* =====================
图片预览
===================== */


#viewer{

display:none;

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:

rgba(0,0,0,.75);

justify-content:center;

align-items:center;

z-index:999;


}




#viewer img{


max-width:90%;


max-height:90%;


object-fit:contain;


border-radius:12px;


}






/* =====================
手机适配
===================== */


@media(max-width:768px){


.admin-box{


width:90%;

padding:20px;


}



.auth-card{


flex-direction:column;


align-items:flex-start;


}



.student-img{


width:200px;

height:130px;


}


}