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

/* ---------- login screen ---------- */
.login-shell{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(232,169,60,.3), transparent 55%),
    radial-gradient(ellipse at 100% 100%, rgba(201,24,74,.25), transparent 50%),
    linear-gradient(180deg, var(--wine-950), var(--purple-800));
  padding:2rem 1rem;
}
.login-card{
  width:min(400px, 100%);
  background:var(--cream-50);
  border-radius:10px;
  padding:2.4rem 2.2rem;
  box-shadow:var(--shadow-deep);
  text-align:center;
}
.login-card img{ height:52px; margin:0 auto 1rem; }
.login-card h1{ font-size:1.5rem; margin-bottom:.3rem; }
.login-card p.sub{ font-size:.85rem; color:#8a6b70; margin-bottom:1.6rem; }
.login-card .field{ text-align:left; }
.login-card .btn{ width:100%; justify-content:center; margin-top:.6rem; }
.login-err{ color:var(--magenta-600); font-size:.85rem; margin-top:.8rem; min-height:1.2em; }
.login-hint{ margin-top:1.4rem; font-size:.75rem; color:#a58a8e; }

/* ---------- dashboard shell ---------- */
.admin-shell{ display:none; min-height:100vh; }
.admin-shell.visible{ display:flex; }
.admin-side{
  width:230px; flex:0 0 230px;
  background:var(--wine-950); color:var(--cream-100);
  padding:1.6rem 1.1rem;
}
.admin-side .brand{ display:flex; gap:.6rem; align-items:center; margin-bottom:2rem; }
.admin-side .brand img{ height:36px; width:36px; }
.admin-side .brand span{ font-family:var(--serif); font-size:1.15rem; color:var(--cream-50); }
.admin-tab{
  display:block; width:100%; text-align:left; padding:.7rem .8rem; margin-bottom:.35rem;
  border-radius:5px; background:transparent; border:none; color:rgba(251,243,231,.75);
  font-size:.88rem; font-weight:500;
}
.admin-tab:hover{ background:rgba(251,243,231,.08); }
.admin-tab.active{ background:var(--magenta-600); color:#fff; }
.admin-side .logout{ margin-top:2rem; }

.admin-main{ flex:1; padding:2.2rem 2.6rem; max-width:1000px; }
.admin-panel{ display:none; }
.admin-panel.active{ display:block; }
.admin-panel h2{ font-size:1.6rem; margin-bottom:.3rem; }
.admin-panel > p.desc{ color:#5a4046; font-size:.9rem; margin-bottom:1.6rem; }

.admin-card{
  background:var(--cream-50); border:1px solid var(--line); border-radius:8px;
  padding:1.4rem 1.5rem; margin-bottom:1.2rem;
}
.admin-card h3{ font-size:1.05rem; margin-bottom:1rem; }

.item-row{
  display:flex; align-items:center; gap:1rem;
  padding:.7rem 0; border-bottom:1px solid var(--line);
}
.item-row:last-child{ border-bottom:none; }
.item-row img{ width:64px; height:64px; object-fit:cover; border-radius:5px; flex:0 0 64px; }
.item-row .meta{ flex:1; font-size:.85rem; }
.item-row .meta strong{ display:block; font-size:.92rem; color:var(--wine-900); }
.item-row .actions{ display:flex; gap:.5rem; }
.icon-btn{
  border:1px solid var(--line); background:var(--cream-100); border-radius:5px;
  padding:.4rem .65rem; font-size:.8rem; color:var(--wine-900);
}
.icon-btn.danger{ color:var(--magenta-600); border-color:var(--magenta-500); }
.icon-btn:hover{ background:var(--wine-900); color:#fff; }

.admin-form .field{ margin-bottom:.9rem; }
.admin-form .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.save-msg{ font-size:.82rem; color:#1a7a3c; margin-top:.6rem; min-height:1.1em; }

.storage-note{
  font-size:.78rem; color:#8a6b70; background:var(--marigold-100); border-radius:6px;
  padding:.7rem .9rem; margin-bottom:1.2rem;
}

@media (max-width: 800px){
  .admin-shell.visible{ flex-direction:column; }
  .admin-side{ width:100%; flex:none; display:flex; align-items:center; overflow-x:auto; gap:.5rem; padding:1rem; }
  .admin-side .brand{ margin:0 1rem 0 0; }
  .admin-main{ padding:1.4rem 1.2rem; }
  .admin-form .form-row{ grid-template-columns:1fr; }
}