/* ============================================================
   登录页 / 管理后台 专用样式
   沿用主站配色变量（style.css 已定义），此处只补页面级布局
   ============================================================ */

/* ---------- 登录页 ---------- */
.login-body{
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  padding: 24px;
  background:
    radial-gradient(1100px 520px at 12% -8%, var(--primary-soft), transparent 62%),
    radial-gradient(900px 480px at 92% 108%, var(--accent-soft), transparent 58%),
    var(--bg);
}

.login-wrap{ width:100%; max-width: 420px; }

.login-card{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-3);
  padding: 34px 30px 26px;
}

.login-brand{
  display:flex; align-items:center; gap:10px;
  margin-bottom: 26px;
}
.login-brand .brand-mark{
  width:38px; height:38px; border-radius:11px;
  background: linear-gradient(135deg, var(--primary), var(--primary-ink));
  color:#fff; font-weight:800; font-size:21px; line-height:1;
  display:grid; place-items:center;
  box-shadow: 0 3px 10px var(--primary-ring);
  flex:none;
}
.login-brand .brand-text{ display:flex; flex-direction:column; line-height:1.2; min-width:0; }
.login-brand .brand-text strong{ font-size:14px; letter-spacing:.01em; }
.login-brand .brand-text em{
  font-style:normal; font-size:10.5px; color:var(--ink-3); letter-spacing:.14em;
}

.login-title{
  font-size:21px; font-weight:750; letter-spacing:-.01em;
  margin: 0 0 6px;
}
.login-sub{
  margin:0 0 22px;
  font-size:13px; color:var(--ink-2); line-height:1.65;
}

.login-form .field{ margin-bottom: 15px; }
.login-form .field label{
  display:block; font-size:12px; font-weight:650; color:var(--ink-2); margin-bottom:6px;
}
.login-form .field input{
  width:100%; height:42px;
  padding: 0 13px;
  border:1px solid var(--line-2);
  border-radius: var(--r-md);
  background: var(--surface-2);
  color: var(--ink);
  font-size:14px;
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.login-form .field input::placeholder{ color: var(--ink-3); }
.login-form .field input:focus{
  outline:none;
  border-color: var(--primary);
  background: var(--surface);
  box-shadow: 0 0 0 3px var(--primary-ring);
}

.btn-block{
  width:100%; height:44px;
  margin-top: 20px;
  font-size:14px; font-weight:650;
}
.btn-block:disabled{ opacity:.6; cursor:not-allowed; }

.login-msg{
  padding:10px 12px;
  border-radius: var(--r-sm);
  font-size:12.5px; line-height:1.6;
  margin-top: 4px;
}
.login-msg.is-err{
  background: var(--none-soft);
  color: var(--none);
  border:1px solid rgba(191,59,47,.2);
}
.login-msg.is-ok{
  background: var(--done-soft);
  color: var(--done);
  border:1px solid rgba(30,132,73,.2);
}

.login-foot{
  margin-top: 22px; padding-top: 16px;
  border-top:1px solid var(--line);
  text-align:center;
}
.login-foot p{
  margin:0 0 4px;
  font-size:11.5px; color:var(--ink-3); line-height:1.6;
}
.login-admin-link a{
  color: var(--primary);
  text-decoration:none;
  font-size:11.5px;
  border-bottom:1px dotted var(--primary);
}
.login-admin-link a:hover{ opacity:.75; }

@media (max-width: 480px){
  .login-body{ padding: 16px; align-items:flex-start; padding-top: 40px; }
  .login-card{ padding: 26px 20px 20px; border-radius: var(--r-lg); }
}

/* ============================================================
   管理后台
   ============================================================ */
.admin-body{
  min-height:100vh;
  background: var(--bg);
  padding: 0 0 60px;
}

.admin-top{
  position: sticky; top:0; z-index: 30;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  box-shadow: var(--shadow-1);
}
.admin-top-inner{
  max-width: 1180px; margin: 0 auto;
  padding: 13px 22px;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.admin-top .brand{
  display:flex; align-items:center; gap:10px; margin-right:auto;
}
.admin-top .brand-mark{
  width:32px; height:32px; border-radius:9px;
  background: linear-gradient(135deg, var(--primary), var(--primary-ink));
  color:#fff; font-weight:800; font-size:17px; line-height:1;
  display:grid; place-items:center; flex:none;
  box-shadow: 0 2px 8px var(--primary-ring);
}
.admin-top .brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.admin-top .brand-text strong{ font-size:14px; }
.admin-top .brand-text em{
  font-style:normal; font-size:10.5px; color:var(--ink-3); letter-spacing:.12em;
}
.admin-who{
  font-size:12px; color:var(--ink-3);
  padding:4px 10px; border-radius:99px;
  background: var(--surface-3);
}
.admin-who b{ color: var(--ink-2); font-weight:650; }

.admin-main{
  max-width: 1180px; margin: 0 auto; padding: 22px;
}

/* 统计卡 */
.stat-row{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap:12px; margin-bottom:18px;
}
.stat{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius: var(--r-md);
  padding:14px 16px;
  box-shadow: var(--shadow-1);
}
.stat .s-num{
  display:block; font-size:24px; font-weight:750; line-height:1.1;
  letter-spacing:-.02em;
}
.stat .s-label{
  display:block; margin-top:5px;
  font-size:11.5px; color:var(--ink-3);
}
.stat.is-on .s-num{ color: var(--primary); }
.stat.is-warn .s-num{ color: var(--none); }

/* 面板 */
.panel{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
  margin-bottom:16px;
  overflow:hidden;
}
.panel-head{
  padding:14px 18px;
  border-bottom:1px solid var(--line);
  background: var(--surface-2);
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
}
.panel-head h3{ margin:0; font-size:14px; font-weight:700; }
.panel-head .ph-sub{ font-size:11.5px; color:var(--ink-3); }
.panel-head .ph-right{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }
.panel-body{ padding:18px; }

/* 筛选栏 */
.filters{
  display:flex; gap:9px; flex-wrap:wrap; align-items:center;
}
.filters input[type="text"], .filters select{
  height:34px; padding:0 11px;
  border:1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-2); color: var(--ink);
  font-size:12.5px; font-family: inherit;
}
.filters input[type="text"]{ min-width: 190px; }
.filters input:focus, .filters select:focus{
  outline:none; border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-ring);
}

/* 表格 */
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
table.wl{
  width:100%; border-collapse:collapse; font-size:12.5px;
  min-width: 760px;
}
table.wl th, table.wl td{
  padding:9px 12px; text-align:left;
  border-bottom:1px solid var(--line);
  vertical-align:middle;
}
table.wl th{
  background: var(--surface-3);
  font-weight:650; color:var(--ink-2); font-size:11.5px;
  white-space:nowrap;
}
table.wl tbody tr:hover{ background: var(--surface-2); }
table.wl td.col-name{ font-weight:650; }
table.wl td.col-time{ color:var(--ink-3); font-size:11.5px; white-space:nowrap; }
table.wl td.col-act{ text-align:right; white-space:nowrap; }

.tag{
  display:inline-block;
  padding:2px 8px; border-radius:99px;
  font-size:11px; font-weight:650;
}
.tag.on{ background: var(--done-soft); color: var(--done); }
.tag.off{ background: var(--none-soft); color: var(--none); }
.tag.cls{
  background: var(--primary-soft); color: var(--primary);
  font-weight:600;
}

/* 行内按钮 */
.mini{
  height:26px; padding:0 9px;
  border-radius:6px;
  border:1px solid var(--line-2);
  background: var(--surface);
  color: var(--ink-2);
  font-size:11.5px; font-weight:600;
  cursor:pointer; font-family:inherit;
}
.mini:hover{ border-color: var(--primary); color: var(--primary); }
.mini.danger:hover{ border-color: var(--none); color: var(--none); }
.mini.solid{
  background: var(--primary); border-color: var(--primary); color:#fff;
}
.mini.solid:hover{ opacity:.88; color:#fff; }

/* 表单行 */
.form-row{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap:12px; align-items:end;
}
.form-row .field label{
  display:block; font-size:11.5px; font-weight:650; color:var(--ink-2); margin-bottom:5px;
}
.form-row .field input, .form-row .field textarea{
  width:100%; min-height:36px;
  padding:8px 11px;
  border:1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-2); color: var(--ink);
  font-size:13px; font-family:inherit;
}
.form-row .field textarea{ min-height: 96px; resize: vertical; line-height:1.65; }
.form-row .field input:focus, .form-row .field textarea:focus{
  outline:none; border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-ring);
}

.admin-msg{
  margin-top:12px; padding:9px 12px;
  border-radius: var(--r-sm); font-size:12px; line-height:1.6;
  display:none;
}
.admin-msg.show{ display:block; }
.admin-msg.is-err{ background: var(--none-soft); color: var(--none); }
.admin-msg.is-ok{ background: var(--done-soft); color: var(--done); }

/* 登录卡片（管理后台未登录时） */
.admin-login{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:24px;
  background:
    radial-gradient(1000px 480px at 15% -10%, var(--primary-soft), transparent 60%),
    var(--bg);
}
.admin-login .login-card{ max-width:380px; }

/* 详情弹层里的行 */
.edit-form .field{ margin-bottom:12px; }
.edit-form .field label{
  display:block; font-size:12px; font-weight:650; color:var(--ink-2); margin-bottom:5px;
}
.edit-form .field input{
  width:100%; height:36px; padding:0 11px;
  border:1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-2); color:var(--ink); font-size:13px; font-family:inherit;
}

@media (max-width: 720px){
  .admin-main{ padding: 14px; }
  .admin-top-inner{ padding: 11px 14px; }
  .panel-body{ padding: 14px; }
  .filters input[type="text"]{ min-width: 0; flex:1; }
  .filters{ width:100%; }
}