/* Admin panel — reuses the site's CSS variables (see ../style.css) */

body.admin-body{ background:var(--paper); }

.admin-shell{ display:flex; min-height:100vh; }

.admin-sidebar{
  width:230px;
  flex:0 0 auto;
  background:linear-gradient(180deg,var(--teal-900),var(--teal-800));
  color:rgba(255,255,255,.85);
  padding:24px 16px;
  position:sticky;
  top:0;
  height:100vh;
}
.admin-sidebar .brand{
  color:var(--white);
  font-family:'Source Serif 4',serif;
  font-weight:700;
  font-size:1.05rem;
  margin-bottom:4px;
  display:block;
}
.admin-sidebar .brand small{
  display:block;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:.7rem;
  color:var(--gold-500);
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:22px;
}
.admin-nav a{
  display:block;
  padding:10px 12px;
  border-radius:6px;
  font-size:.88rem;
  font-weight:600;
  color:rgba(255,255,255,.78);
  margin-bottom:4px;
}
.admin-nav a:hover{ background:rgba(255,255,255,.08); color:var(--white); }
.admin-nav a.active{ background:rgba(255,255,255,.14); color:var(--white); }
.admin-nav .divider{ height:1px; background:rgba(255,255,255,.14); margin:14px 0; }

.admin-main{ flex:1 1 auto; padding:32px 40px 60px; max-width:1100px; }
.admin-topline{ display:flex; justify-content:space-between; align-items:center; margin-bottom:28px; flex-wrap:wrap; gap:12px; }
.admin-topline h1{ font-size:1.5rem; margin-bottom:2px; }
.admin-topline p{ margin-bottom:0; color:var(--ink-soft); font-size:.88rem; }

.admin-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:24px;
  margin-bottom:22px;
}

.admin-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:28px; }
.admin-stat{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); padding:20px; }
.admin-stat b{ font-family:'Source Serif 4',serif; font-size:1.8rem; color:var(--teal-800); display:block; }
.admin-stat span{ font-size:.82rem; color:var(--ink-soft); }

table.admin-table{ width:100%; border-collapse:collapse; font-size:.88rem; }
table.admin-table th{ text-align:left; font-size:.76rem; text-transform:uppercase; letter-spacing:.03em; color:#7C8988; padding:10px 12px; border-bottom:1px solid var(--line); }
table.admin-table td{ padding:12px; border-bottom:1px solid var(--line); vertical-align:top; color:var(--ink); }
table.admin-table tr:last-child td{ border-bottom:none; }

.pill{ display:inline-block; font-size:.72rem; font-weight:700; padding:4px 10px; border-radius:20px; background:var(--paper-dim); color:var(--teal-800); }
.pill.new{ background:var(--gold-100); color:#8C6A1E; }
.pill.review{ background:#E7EEF6; color:var(--teal-700); }
.pill.done{ background:#E4F3E9; color:#1F7A45; }

.icon-btn{
  border:1px solid var(--line);
  background:var(--white);
  border-radius:6px;
  padding:6px 12px;
  font-size:.8rem;
  font-weight:600;
  color:var(--ink-soft);
  cursor:pointer;
}
.icon-btn:hover{ border-color:var(--gold-600); color:var(--teal-900); }
.icon-btn.danger:hover{ border-color:#C0453D; color:#C0453D; }

.thumb-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.thumb{ position:relative; border-radius:8px; overflow:hidden; aspect-ratio:4/3; border:1px solid var(--line); }
.thumb img{ width:100%; height:100%; object-fit:cover; }
.thumb .grad{ width:100%; height:100%; }
.thumb .meta{ position:absolute; inset:auto 0 0 0; background:rgba(10,46,92,.72); color:#fff; font-size:.72rem; padding:6px 8px; }
.thumb form{ position:absolute; top:6px; right:6px; }

.login-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg,var(--teal-900),var(--teal-800)); padding:20px; }
.login-card{ width:100%; max-width:380px; background:var(--white); border-radius:var(--radius-md); padding:34px; }
.login-card .mark{ width:44px; margin-bottom:14px; }

@media (max-width:860px){
  .admin-shell{ flex-direction:column; }
  .admin-sidebar{ width:100%; height:auto; position:static; }
  .admin-nav{ display:flex; flex-wrap:wrap; gap:6px; }
  .admin-main{ padding:24px 18px 48px; }
  .admin-stats{ grid-template-columns:1fr; }
}