/* RyeBlog 后台管理样式 —— 绿色主题
   配色变量由 themes.css 提供 */
* { box-sizing: border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; background:var(--g-025); color:var(--ink); line-height:1.6; }

.admin-shell {
    display: grid;
    grid-template-columns: 230px 1fr;
    grid-template-rows: 1fr auto;
    grid-template-areas: "side main" "foot foot";
    min-height: 100vh;
}
.admin-side  { grid-area: side; }
.admin-main  { grid-area: main; }
.admin-foot  { grid-area: foot; }
@media (max-width:760px){
    .admin-shell{ grid-template-columns:1fr; grid-template-areas:"side" "main" "foot"; }
    .admin-foot { grid-area: foot; }
}

.admin-side {
    background:linear-gradient(180deg,var(--g-900),var(--g-700)); color:#dff0e2;
    padding:22px 18px; position:sticky; top:0; height:100vh; overflow:auto;
}
.admin-side .logo { font-size:1.3rem; font-weight:700; color:#fff; margin-bottom:6px; }
.admin-side .logo small { display:block; font-weight:400; opacity:.7; font-size:.75rem; }
.admin-side nav { margin-top:18px; display:flex; flex-direction:column; gap:4px; }
.admin-side nav a { color:#cfe6d2; padding:10px 12px; border-radius:10px; font-weight:500; }
.admin-side nav a:hover, .admin-side nav a.active { background:rgba(255,255,255,.14); color:#fff; }

.admin-main { padding:28px 32px; }
.admin-main h1 { margin:0 0 18px; color:var(--g-900); }

.panel { background:var(--white); border:1px solid var(--line); border-radius:14px; padding:22px; box-shadow:0 6px 22px rgba(46,107,53,.08); margin-bottom:22px; }
.panel h2 { margin:0 0 14px; font-size:1.1rem; color:var(--g-700); }

label { display:block; font-weight:600; margin:12px 0 5px; color:var(--g-900); }
input[type=text], input[type=email], input[type=url], input[type=password], textarea, select {
    width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:10px; font:inherit; outline:none; background:#fff;
}
input:focus, textarea:focus, select:focus { border-color:var(--g-500); }
textarea { min-height:160px; resize:vertical; }
/* SEO 设置区块：摘要/描述/关键词改为单行紧凑高度，覆盖全局 textarea min-height:160px */
.seo-box .seo-field { min-height:0; }
.seo-box textarea.seo-field { height:2.6em; line-height:1.4; padding:6px 12px; resize:vertical; }
.seo-box input.seo-field { height:38px; padding:6px 12px; }
.row { display:flex; gap:14px; flex-wrap:wrap; }
.row > div { flex:1; min-width:200px; }

.btn { display:inline-block; background:var(--g-600); color:#fff; border:none; padding:10px 22px; border-radius:999px; cursor:pointer; font-weight:600; font-size:1rem; transition:background .15s; }
.btn:hover { background:var(--g-700); }
.btn-ghost { background:transparent; color:var(--g-700); border:1px solid var(--g-500); }
.btn-danger { background:#c0392b; }
.btn-sm { padding:6px 14px; font-size:.85rem; }

table.data { width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 4px 16px rgba(46,107,53,.08); }
table.data th, table.data td { padding:12px 14px; text-align:left; border-bottom:1px solid var(--line); }
table.data th { background:var(--g-050); color:var(--g-700); font-size:.9rem; }
table.data tr:hover td { background:var(--g-025); }
table.data-table { width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 4px 16px rgba(46,107,53,.08); }
table.data-table th, table.data-table td { padding:10px 12px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
table.data-table th { background:var(--g-050); color:var(--g-700); font-size:.88rem; }
table.data-table tr:hover td { background:var(--g-025); }
table.data-table input[type=text] { font-size:11px; padding:4px 6px; }
.tag { background:var(--g-050); color:var(--g-700); padding:2px 10px; border-radius:999px; font-size:.8rem; }
.status-draft { color:#b9770e; } .status-published { color:var(--g-700); }

.notice { padding:12px 16px; border-radius:10px; margin-bottom:16px; }
.notice-ok { background:var(--g-050); color:var(--g-700); border:1px solid var(--g-200); }
.notice-err { background:#fdecea; color:#b3261e; border:1px solid #f5c2bd; }

.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; }
.stat { background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; box-shadow:0 4px 16px rgba(46,107,53,.08); }
.stat .n { font-size:1.8rem; font-weight:700; color:var(--g-600); }
.stat .l { color:var(--muted); font-size:.85rem; }

.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--g-700),var(--g-500)); }
.login-box { background:#fff; border-radius:18px; padding:34px; width:min(380px,92vw); box-shadow:0 18px 50px rgba(0,0,0,.25); }
.login-box h1 { margin:0 0 4px; color:var(--g-900); text-align:center; }
.login-box p.sub { text-align:center; color:var(--muted); margin:0 0 22px; }
.muted { color:var(--muted); }
a { color:var(--g-700); }

/* Markdown 编辑器 */
.md-toolbar { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.md-toolbar button {
    border:1px solid var(--line); background:var(--g-050); color:var(--g-700);
    border-radius:8px; padding:6px 12px; cursor:pointer; font-size:.85rem; font-weight:600;
}
.md-toolbar button:hover { background:var(--g-100); }
.md-preview {
    border:1px dashed var(--line); border-radius:10px; padding:16px 20px; margin-top:8px;
    background:var(--g-025); min-height:120px;
}
.md-preview h1,.md-preview h2,.md-preview h3 { color:var(--g-900); }
.md-preview pre { background:#0f2413; color:#d7f5db; padding:14px; border-radius:10px; overflow:auto; }
.md-preview code { background:var(--g-050); padding:2px 6px; border-radius:5px; }
.md-preview blockquote { border-left:4px solid var(--g-500); margin:1em 0; padding:4px 14px; color:var(--muted); }

/* 即时上传（无需保存即可插入正文） */
.md-upload-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:8px 0; padding:8px 12px; background:var(--g-050); border:1px dashed var(--g-200); border-radius:10px; }
.md-upload-bar .muted { font-size:.8rem; }
.md-upload-bar .btn { padding:6px 14px; font-size:.85rem; border-radius:999px; }
#content-input.drop-target { outline:2px dashed var(--g-500); outline-offset:-4px; background:var(--g-050); }
.upload-progress { margin:6px 0; padding:8px 14px; border-radius:8px; background:var(--g-050); color:var(--g-700); border:1px solid var(--g-200); font-size:.88rem; display:flex; align-items:center; gap:8px; }
.upload-progress.up-ok { background:var(--g-050); color:var(--g-700); border-color:var(--g-500); }
.upload-progress.up-err { background:#fdecea; color:#b3261e; border-color:#f5c2bd; }
.up-spin { display:inline-block; width:14px; height:14px; border:2px solid var(--g-200); border-top-color:var(--g-500); border-radius:50%; animation: ryeblog-spin 0.8s linear infinite; }
@keyframes ryeblog-spin { to { transform: rotate(360deg); } }

/* 封面图选择器 */
.cover-picker { margin:6px 0 12px; }
.cover-picker-grid { display:flex; flex-wrap:wrap; gap:10px; }
.cover-picker-empty { padding:10px 0; font-size:.85rem; }
.cover-option { width:100px; cursor:pointer; border:2px solid var(--line); border-radius:8px; overflow:hidden; text-align:center; background:#fff; transition:border-color .15s, box-shadow .15s; }
.cover-option:hover { border-color:var(--g-300); }
.cover-option.selected { border-color:var(--g-500); box-shadow:0 0 0 2px var(--g-200); }
.cover-option-thumb { width:100%; height:70px; overflow:hidden; background:var(--g-050); display:flex; align-items:center; justify-content:center; }
.cover-option-thumb img { width:100%; height:100%; object-fit:cover; }
.cover-option-thumb.cover-none { font-size:22px; color:var(--g-300); }
.cover-option-label { display:block; font-size:.72rem; color:var(--muted); padding:3px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cover-option.selected .cover-option-label { color:var(--g-700); font-weight:600; }

/* 仪表盘顶部「重要文档」醒目横幅 */
.doc-banner {
    display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    background:linear-gradient(135deg,var(--g-050),#fff7e6);
    border:1px solid var(--g-200); border-left:5px solid var(--g-500);
    border-radius:12px; padding:14px 18px; margin-bottom:22px;
}
.doc-banner-tag { font-weight:700; color:var(--g-900); background:var(--g-100); padding:3px 10px; border-radius:999px; font-size:.85rem; }
.doc-banner-text { color:var(--muted); font-size:.9rem; }

/* 琥珀色按钮（授权协议等强调） */
.btn-amber { background:#f59e0b; color:#3a2a00; }
.btn-amber:hover { background:#d98806; }

/* 后台全局页脚：帮助文档 / 授权协议 常驻入口 */
.admin-foot {
    grid-area: foot;
    grid-column: 1 / -1;
    display:flex; align-items:center; gap:18px; flex-wrap:wrap;
    padding:12px 32px; margin-top:0;
    border-top:1px solid var(--line);
    background:var(--g-025);
    font-size:.82rem; color:#6b7c70;
}
.admin-foot-brand { font-weight:700; color:var(--g-700); margin-right:4px; }
.admin-foot a {
    color:#6b7c70;
    text-decoration:none;
    font-weight:500;
    padding:2px 6px;
    border-radius:6px;
}
.admin-foot a:hover { color:var(--g-900); background:rgba(46,107,53,.08); text-decoration:none; }
.admin-foot .sep { color:#c4d0c6; }

/* 后台界面语言切换 */
.admin-lang { margin-top:14px; padding:10px 14px; font-size:13px; border-top:1px solid var(--line); display:flex; align-items:center; gap:6px; }
.admin-lang .muted { color:var(--g-500); }
.admin-lang a { padding:2px 9px; border-radius:6px; color:var(--g-600); text-decoration:none; border:1px solid var(--line); }
.admin-lang a.active { background:var(--accent); color:#fff; border-color:var(--accent); }

/* 文章「已译 / 仅中文」徽章 */
.badge { display:inline-block; padding:1px 9px; border-radius:999px; font-size:12px; background:var(--g-100); color:var(--g-600); }
.badge-ok { background:rgba(46,107,53,.12); color:var(--g-700); }

/* 页面内中/英版本切换（编辑页顶部） */
.lang-tabs { display: inline-flex; gap: 0; border: 1px solid var(--line); border-radius: 999px; padding: 3px; background: var(--g-025); }
.lang-tab { border: none; background: none; padding: 4px 16px; border-radius: 999px; cursor: pointer; font-size: 13px; font-weight: 500; color: var(--g-600); }
.lang-tab:hover { color: var(--g-800); }
.lang-tab.active { background: var(--accent, var(--g-600)); color: #fff; }
