/* assets/style.css */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:"Microsoft YaHei", sans-serif; background:#f8f9fa; line-height:1.6; }
.header { background:#2c3e50; color:white; padding:20px; text-align:center; }
.nav { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:10px; background:#ecf0f1; }
.nav a { padding:6px 12px; text-decoration:none; color:#2c3e50; border:1px solid #bdc3c7; border-radius:4px; }
.section { margin:20px; }
.section h2 { background:#3498db; color:white; padding:8px 15px; margin-bottom:10px; border-radius:4px; }
table { width:100%; border-collapse:collapse; background:white; box-shadow:0 1px 3px rgba(0,0,0,0.1); }
th, td { padding:12px; text-align:left; border-bottom:1px solid #eee; }
tr:hover { background:#f9f9f9; }
.pagination { text-align:center; padding:20px; }
.pagination a { margin:0 10px; text-decoration:none; color:#3498db; }
.footer { text-align:center; padding:20px; color:#7f8c8d; border-top:1px solid #eee; margin-top:30px; }

/* 移动端优化 */
@media (max-width: 600px) {
    .nav a { padding:4px 8px; font-size:14px; }
    table, thead, tbody, th, td, tr { display:block; }
    td { position:relative; padding-left:50% !important; }
    td:before {
        content:attr(data-label) ": ";
        position:absolute; left:6px; top:12px;
        font-weight:bold;
    }
    .detail-container { margin:10px !important; padding:15px !important; }
}

/* 网站设置页样式 */
.friend-link-item {
    display: flex;
    gap: 10px;
    margin-bottom: 8px;
}
.btn-add, .btn-remove {
    padding: 5px 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.btn-add { background: #2ecc71; color: white; }
.btn-remove { background: #e74c3c; color: white; }