/* ========== 管理后台样式（登录页 + 管理界面） ========== */
* { margin:0; padding:0; box-sizing:border-box; }

/* ---------- 登录页 ---------- */
.login-body{
    min-height:100vh; display:flex; align-items:center; justify-content:center;
    font-family:"Microsoft YaHei",-apple-system,system-ui,sans-serif;
    background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
}
.login-box{ background:#fff; padding:40px 35px; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.18); width:360px; }
.login-box h2{ text-align:center; margin-bottom:25px; color:#1f2733; font-size:21px; }
.login-err{ color:#e74c3c; text-align:center; margin-bottom:15px; font-size:14px; }
.login-input{ width:100%; padding:12px 14px; border:1px solid #e0e3e8; border-radius:8px; font-size:14px; outline:none; transition:.2s; }
.login-input:focus{ border-color:#667eea; box-shadow:0 0 0 3px rgba(102,126,234,.12); }
.login-btn{ width:100%; padding:12px; margin-top:16px; background:linear-gradient(135deg,#667eea,#764ba2); color:#fff; border:none; border-radius:8px; font-size:15px; cursor:pointer; transition:.2s; }
.login-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(102,126,234,.4); }
.back-link{ display:block; text-align:center; margin-top:18px; color:#8a93a3; font-size:13px; text-decoration:none; }
.back-link:hover{ color:#667eea; }

/* ---------- 管理界面整体 ---------- */
.admin-body{ height:100vh; overflow:hidden; color:#2d3748;
    font-family:"Microsoft YaHei",-apple-system,system-ui,sans-serif; }
.admin-top{ height:54px; background:linear-gradient(90deg,#667eea 0%,#764ba2 100%); color:#fff;
    display:flex; align-items:center; justify-content:space-between; padding:0 18px; box-shadow:0 2px 8px rgba(0,0,0,.12); }
.admin-top-left{ display:flex; align-items:center; gap:14px; }
.admin-logo{ font-size:16px; font-weight:600; letter-spacing:.5px; white-space:nowrap; }
.a-view{ color:#fff; font-size:13px; padding:6px 12px; border-radius:7px; background:rgba(255,255,255,.16); text-decoration:none; white-space:nowrap; }
.a-view:hover{ background:rgba(255,255,255,.28); }
.admin-top-right a{ color:#fff; font-size:13px; text-decoration:none; opacity:.92; }
.admin-top-right a:hover{ opacity:1; text-decoration:underline; }
.a-menu-toggle{ display:none; background:transparent; border:none; color:#fff; font-size:20px; cursor:pointer; padding:4px 8px; border-radius:6px; }
.a-menu-toggle:hover{ background:rgba(255,255,255,.2); }

.admin-main{ display:flex; height:calc(100vh - 54px); position:relative; }
.admin-mask{ display:none; position:fixed; top:54px; left:0; right:0; bottom:0; background:rgba(0,0,0,.42); z-index:90; }

/* ---------- 左侧管理树 ---------- */
.admin-sidebar{ width:300px; flex-shrink:0; background:#fafbff; border-right:1px solid #e7e9f2; overflow-y:auto; padding:12px; }
.admin-sidebar ul{ list-style:none; padding-left:18px; }
.admin-sidebar > ul{ padding-left:0; }
.a-cate{ display:flex; align-items:center; gap:6px; margin:4px 0; padding:7px 8px; border-radius:8px; cursor:pointer; transition:.15s; }
.a-cate:hover{ background:#eef0ff; }
.a-toggle{ width:18px; flex-shrink:0; text-align:center; color:#8a93a3; font-size:14px; font-weight:bold; user-select:none; }
.a-cate-text{ flex:1; font-size:14px; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.a-opts{ display:flex; flex-shrink:0; gap:2px; opacity:0; transition:.15s; }
.a-cate:hover .a-opts{ opacity:1; }
.a-opts a{ font-size:12px; color:#8a93a3; text-decoration:none; padding:2px 5px; border-radius:5px; }
.a-opts a:hover{ background:#667eea; color:#fff; }
.a-child{ overflow:hidden; }
.a-child.hidden{ display:none; }

.a-note{ font-size:13.5px; }
.a-note-row{ display:flex; align-items:center; gap:4px; padding:4px 8px; border-radius:7px; transition:.15s; }
.a-note-row:hover{ background:#f0f2ff; }
.a-note.active .a-note-row{ background:#e8ebff; }
.a-note-row > a{ flex:1; min-width:0; color:#555; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.a-note.active .a-note-row > a{ color:#667eea; font-weight:600; }
.a-note-row .a-opts{ opacity:0; }
.a-note-row:hover .a-opts{ opacity:1; }

.a-add-cate{ width:100%; margin-top:16px; padding:11px 12px; background:#f4f6ff; border:1px dashed #c5cbe9; border-radius:9px; color:#667eea; font-size:13px; cursor:pointer; transition:.2s; }
.a-add-cate:hover{ border-color:#667eea; transform:translateY(-1px); }

/* ---------- 右侧内容 ---------- */
.admin-content{ flex:1; min-width:0; overflow-y:auto; padding:30px 42px 80px; background:#fff; }
.a-empty{ color:#94a0b0; margin-top:90px; text-align:center; }
.a-empty h2{ color:#5b6573; margin-bottom:10px; }
.a-empty p{ font-size:14px; }

/* 工具栏 */
.a-toolbar{ display:flex; gap:10px; margin-bottom:22px; flex-wrap:wrap; }
.a-btn{ display:inline-block; padding:8px 20px; border:none; border-radius:8px; background:linear-gradient(135deg,#667eea,#764ba2); color:#fff; font-size:13.5px; cursor:pointer; text-decoration:none; transition:.2s; }
.a-btn:hover{ transform:translateY(-1px); box-shadow:0 5px 14px rgba(102,126,234,.35); }
.a-btn.light{ background:#fff; color:#667eea; border:1px solid #e0e4f0; }
.a-btn.light:hover{ border-color:#667eea; }
.a-btn.danger{ background:linear-gradient(135deg,#e74c3c,#c0392b); }
.a-btn.danger:hover{ box-shadow:0 5px 14px rgba(231,76,60,.35); }

.a-view-title{ font-size:25px; font-weight:700; padding-bottom:15px; border-bottom:2px solid #f0f2ff; color:#1a1a2e; }
.a-meta{ display:flex; gap:12px; margin:14px 0 22px; flex-wrap:wrap; }
.a-meta span{ font-size:12px; color:#94a0b0; background:#f5f7ff; padding:4px 11px; border-radius:12px; }

/* 编辑表单 */
.a-title-input{ width:100%; padding:11px 13px; border:1px solid #e0e3e8; border-radius:8px; font-size:18px; font-weight:600; outline:none; margin-bottom:14px; transition:.2s; }
.a-title-input:focus{ border-color:#667eea; box-shadow:0 0 0 3px rgba(102,126,234,.12); }
#tinymce-editor{ min-height:calc(100vh - 280px); }
.a-edit-bar{ display:flex; gap:12px; margin-top:14px; }
.a-save{ padding:10px 26px; border:none; border-radius:8px; background:linear-gradient(135deg,#667eea,#764ba2); color:#fff; font-size:14px; cursor:pointer; }
.a-save:hover{ box-shadow:0 5px 14px rgba(102,126,234,.35); }
.a-cancel{ padding:10px 26px; border:1px solid #e0e3e8; border-radius:8px; background:#f5f7fa; color:#667; font-size:14px; cursor:pointer; }
.a-cancel:hover{ background:#e8ecf1; }

/* ---------- 富文本查看排版 ---------- */
.note-content{ font-size:15px; color:#2d3748; line-height:1.8; }
.note-content p{ margin:12px 0; }
.note-content h1{ font-size:22px; margin:28px 0 12px; border-bottom:1px solid #eee; padding-bottom:8px; }
.note-content h2{ font-size:19px; margin:24px 0 10px; }
.note-content h3{ font-size:17px; margin:20px 0 8px; }
.note-content ul,.note-content ol{ padding-left:24px; margin:12px 0; }
.note-content li{ margin:6px 0; }
.note-content img{ max-width:min(680px,100%); height:auto; margin:16px 0; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.08); cursor:zoom-in; }
.note-content a{ color:#667eea; text-decoration:none; }
.note-content a:hover{ text-decoration:underline; }
.note-content pre{ background:#1e1e2e; color:#cdd6f4; padding:18px; border-radius:9px; overflow-x:auto; margin:16px 0; font-size:13.5px; line-height:1.6; }
.note-content code{ font-family:Consolas,monospace; font-size:13px; }
.note-content blockquote{ border-left:4px solid #667eea; padding:12px 20px; margin:16px 0; background:#f8f9ff; border-radius:0 8px 8px 0; color:#4a5568; }
.note-content table{ border-collapse:collapse; width:100%; margin:16px 0; font-size:14px; }
.note-content th,.note-content td{ border:1px solid #e2e8f0; padding:8px 12px; text-align:left; }
.note-content th{ background:#f8f9ff; font-weight:600; }
.note-content tr:nth-child(even){ background:#fcfcff; }

/* ---------- 模态框 ---------- */
.a-modal{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); justify-content:center; align-items:center; z-index:100; }
.a-modal-box{ background:#fff; padding:28px; border-radius:14px; width:360px; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.a-modal-box h3{ margin-bottom:20px; font-size:17px; color:#1a1a2e; }
.a-modal-input{ width:100%; padding:11px 14px; margin-bottom:8px; border:1px solid #e0e3e8; border-radius:8px; font-size:14px; background:#fafbfc; outline:none; }
.a-modal-input:focus{ border-color:#667eea; background:#fff; }
.a-modal-btns{ display:flex; gap:10px; justify-content:flex-end; margin-top:14px; }

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-thumb{ background:#d1d5db; border-radius:6px; }
::-webkit-scrollbar-thumb:hover{ background:#9ca3af; }
::-webkit-scrollbar-track{ background:transparent; }

/* ---------- 响应式 ---------- */
@media (max-width:768px){
    .a-menu-toggle{ display:block; }
    .admin-sidebar{ position:fixed; top:54px; left:0; bottom:0; z-index:95; width:280px;
        transform:translateX(-100%); transition:transform .3s ease; box-shadow:2px 0 12px rgba(0,0,0,.15); }
    .admin-sidebar.open{ transform:translateX(0); }
    .admin-mask.show{ display:block; }
    .admin-content{ padding:20px 16px 80px; }
    .a-opts{ opacity:1; }
    .a-view-title{ font-size:20px; }
}
@media (max-width:480px){
    .admin-top{ padding:0 12px; }
    .admin-logo{ font-size:14px; }
    .a-modal-box{ width:90%; }
}
