/* 全局样式 */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
    background: #f0f2f5;
    color: #333;
    line-height: 1.6;
}

a { color: #1677ff; text-decoration: none; }
a:hover { text-decoration: underline; }

/* 顶部导航 */
.topbar {
    background: linear-gradient(90deg, #1677ff, #4096ff);
    color: #fff;
    padding: 14px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.topbar h1 { font-size: 20px; font-weight: 600; }
.topbar .nav-links a { color: #fff; margin-left: 18px; opacity: 0.95; }
.topbar .user-info { font-size: 14px; opacity: 0.95; }

/* 容器 */
.container { max-width: 1100px; margin: 24px auto; padding: 0 20px; }

/* 卡片 */
.card {
    background: #fff;
    border-radius: 10px;
    padding: 22px 26px;
    margin-bottom: 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.card h2 {
    font-size: 17px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f0f0f0;
    color: #1d2129;
}

/* 表单 */
.form-row { margin-bottom: 14px; }
.form-row label {
    display: block;
    font-size: 14px;
    color: #4e5969;
    margin-bottom: 6px;
}
.form-row input, .form-row select, .form-row textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #d9d9d9;
    border-radius: 6px;
    font-size: 14px;
    transition: border-color 0.2s;
    font-family: inherit;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus {
    outline: none;
    border-color: #1677ff;
    box-shadow: 0 0 0 2px rgba(22,119,255,0.1);
}
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.form-grid .full { grid-column: 1 / -1; }

/* 按钮 */
.btn {
    display: inline-block;
    padding: 9px 20px;
    background: #1677ff;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: inherit;
}
.btn:hover { background: #4096ff; }
.btn:active { background: #0958d9; }
.btn-block { width: 100%; }
.btn-sm { padding: 5px 12px; font-size: 13px; }
.btn-danger { background: #ff4d4f; }
.btn-danger:hover { background: #ff7875; }
.btn-success { background: #52c41a; }
.btn-success:hover { background: #73d13d; }
.btn-outline {
    background: #fff;
    color: #1677ff;
    border: 1px solid #1677ff;
}
.btn-outline:hover { background: #e6f4ff; }
.btn:disabled { background: #d9d9d9; cursor: not-allowed; }

/* 表格 */
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 11px 12px; text-align: left; border-bottom: 1px solid #f0f0f0; }
th { background: #fafafa; color: #4e5969; font-weight: 600; }
tr:hover { background: #fafbfc; }
td .btn { margin-right: 6px; }

/* 统计 */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.stat-box {
    background: linear-gradient(135deg, #1677ff, #4096ff);
    color: #fff;
    padding: 22px;
    border-radius: 10px;
    text-align: center;
}
.stat-box .num { font-size: 32px; font-weight: 700; }
.stat-box .label { font-size: 14px; opacity: 0.9; margin-top: 4px; }

/* 提示 */
.msg { padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; font-size: 14px; }
.msg.error { background: #fff2f0; color: #cf1322; border: 1px solid #ffccc7; }
.msg.success { background: #f6ffed; color: #389e0d; border: 1px solid #b7eb8f; }

/* 登录卡片 */
.login-wrap { max-width: 400px; margin: 60px auto; }
.login-wrap .card { padding: 30px; }

/* 二维码与门店管理 */
.store-item {
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 14px;
    background: #fafbfc;
}
.store-item .store-head {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 12px; flex-wrap: wrap; gap: 8px;
}
.store-item .qr-img {
    width: 180px; height: 180px; display: block;
    border: 1px solid #f0f0f0; border-radius: 6px;
}
.store-item .qr-wrap { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.store-item .store-meta { font-size: 13px; color: #4e5969; }
.store-item .store-meta div { margin-bottom: 4px; }
.store-item .store-meta strong { color: #1d2129; }
.editable-input {
    border: 1px dashed transparent; padding: 4px 8px; border-radius: 4px;
    background: transparent; font-family: inherit; font-size: 14px;
}
.editable-input:focus { border-color: #1677ff; background: #fff; outline: none; }

/* 视频库 */
.video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.video-card {
    border: 1px solid #f0f0f0; border-radius: 8px; overflow: hidden; background: #fff;
}
.video-card video { width: 100%; max-height: 220px; background: #000; display: block; }
.video-card .vc-body { padding: 12px; }
.video-card .vc-copy {
    font-size: 13px; color: #4e5969; margin: 8px 0;
    max-height: 80px; overflow: auto; white-space: pre-wrap; word-break: break-all;
}
.video-card .vc-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* 农户页 */
.nonghu-wrap { max-width: 600px; margin: 0 auto; padding: 20px; }
.platform-grid {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 16px 0;
}
.platform-btn {
    padding: 16px; border-radius: 10px; color: #fff; text-align: center;
    font-size: 15px; font-weight: 600; cursor: pointer; border: none;
    transition: transform 0.1s, opacity 0.2s; font-family: inherit;
}
.platform-btn:hover { opacity: 0.9; }
.platform-btn:active { transform: scale(0.97); }
.pf-douyin { background: #000; }
.pf-pyq { background: #07c160; }
.pf-sph { background: #fa5151; }
.pf-kuaishou { background: #ff5000; }
.pf-other { background: #8c8c8c; }

.empty { text-align: center; color: #999; padding: 30px; font-size: 14px; }
.muted { color: #999; font-size: 13px; }
.flex-between { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }

@media (max-width: 600px) {
    .topbar { flex-direction: column; gap: 8px; align-items: flex-start; }
    .topbar .nav-links a { margin-left: 0; margin-right: 14px; }
    .platform-grid { grid-template-columns: 1fr; }
}