:root { --red:#d71920; --yellow:#ffc400; --black:#111; --paper:#f3f4f5; --border:#dedede; --muted:#6f7378; --green:#198b4b; }
* { box-sizing: border-box; }
body { margin:0; background:var(--paper); color:#202124; font-family:Inter,system-ui,sans-serif; letter-spacing:0; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
.login-screen { min-height:100vh; display:grid; place-items:center; padding:20px; background:#121212 url("/assets/hero-food.png") center/cover; position:relative; }
.login-screen::before { content:""; position:absolute; inset:0; background:rgba(0,0,0,.78); }
.login-box { position:relative; width:min(400px,100%); padding:34px; background:white; border-radius:7px; box-shadow:0 20px 60px #0008; border-top:5px solid var(--red); }
.mini-brand { display:flex; align-items:center; color:inherit; text-decoration:none; }
.mini-brand img { width:136px; height:82px; object-fit:contain; object-position:left center; display:block; }
.login-box p { margin:30px 0 4px;color:var(--red);font-size:12px;font-weight:900;text-transform:uppercase; }
.login-box h1 { margin:0 0 24px;font-size:34px; }
.login-box label,.product-form label { display:block;font-size:12px;font-weight:800;margin-bottom:14px; }
.login-box input,.product-form input,.product-form textarea,.product-form select,.inline-form input { display:block;width:100%;margin-top:6px;border:1px solid #c8c8c8;border-radius:4px;padding:11px;background:white; }
.login-box button,.product-form button,.inline-form button,.primary-action { width:100%;border:0;border-radius:4px;padding:12px;background:var(--red);color:white;font-weight:900; }
.login-box small { display:block;min-height:20px;margin-top:10px;color:var(--red); }
.admin-app { min-height:100vh; }
.sidebar { position:fixed;inset:0 auto 0 0;width:230px;background:var(--black);color:white;padding:22px 16px;display:flex;flex-direction:column;z-index:10; }
.sidebar nav { display:grid;gap:6px;margin-top:50px; }
.nav-item,.logout { border:0;background:transparent;color:#bbb;text-align:left;padding:13px;border-radius:4px;font-weight:700; }
.nav-item.active { background:#2a2a2a;color:white;border-left:3px solid var(--yellow); }
.logout { margin-top:auto; }
.admin-main { margin-left:230px;padding:38px clamp(20px,4vw,60px); }
.admin-main header { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px; }
.admin-main header p { margin:0;color:var(--red);font-size:12px;font-weight:900;text-transform:uppercase; }
.admin-main header h1 { margin:4px 0 0;font-size:38px; }
.primary-action { width:auto;padding:12px 18px; }
.view { display:none; }
.view.active { display:block; }
.table-wrap { overflow:auto;background:white;border:1px solid var(--border);border-radius:6px; }
table { width:100%;border-collapse:collapse;min-width:700px; }
th,td { text-align:left;padding:15px;border-bottom:1px solid #ececec; }
th { color:var(--muted);font-size:11px;text-transform:uppercase;background:#fafafa; }
.product-cell { display:flex;align-items:center;gap:12px;font-weight:800; }
.thumb { width:46px;height:46px;display:grid;place-items:center;border-radius:4px;background:#222;font-size:24px;overflow:hidden; }
.thumb img { width:100%;height:100%;object-fit:cover; }
.status { display:inline-block;padding:5px 8px;border-radius:3px;font-size:11px;font-weight:800;background:#eee; }
.status.active { color:var(--green);background:#e6f5ed; }
.row-actions { display:flex;gap:6px;justify-content:flex-end; }
.row-actions button,.category-list button { border:1px solid #ccc;background:white;border-radius:4px;padding:7px 10px; }
.row-actions .danger,.category-list .danger { color:var(--red); }
.inline-form { display:flex;gap:10px;background:white;padding:18px;border:1px solid var(--border);border-radius:6px; }
.inline-form input { margin:0; }
.inline-form button { width:auto;white-space:nowrap; }
.category-list { margin-top:16px;background:white;border:1px solid var(--border);border-radius:6px; }
.category-row { display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid #eee; }
.order-list { display:grid;gap:12px; }
.order-card { background:white;border:1px solid var(--border);border-left:4px solid var(--yellow);border-radius:5px;padding:18px; }
.order-head { display:flex;justify-content:space-between;gap:20px; }
.order-head h3 { margin:0 0 5px; }
.order-head strong { font-size:20px; }
.order-card p { color:var(--muted);margin:7px 0;font-size:14px; }
.order-items { margin-top:12px;padding-top:12px;border-top:1px solid #eee; }
.admin-modal { position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:20px;background:#000b;opacity:0;visibility:hidden;transition:.2s; }
.admin-modal.open { opacity:1;visibility:visible; }
.product-form { width:min(760px,100%);max-height:90vh;overflow:auto;background:white;border-radius:7px;padding:26px; }
.form-heading { display:flex;align-items:center;justify-content:space-between;margin-bottom:22px; }
.form-heading h2 { margin:0;font-size:28px; }
.form-heading button { width:38px;height:38px;padding:0;border-radius:50%;background:#eee;color:#222;font-size:24px; }
.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:0 16px; }
.form-grid .wide { grid-column:1/-1; }
.product-form small { display:block;color:var(--muted);margin-top:5px; }
.table-note { display:block;color:var(--muted);font-size:11px;margin-top:4px;font-weight:700; }
.image-preview { min-height:150px;border:1px dashed #bbb;border-radius:5px;background:#fafafa;display:grid;place-items:center;margin:0 0 14px;color:var(--muted);font-size:13px;font-weight:800;overflow:hidden; }
.image-preview img { width:100%;height:210px;object-fit:cover;display:block; }
.pizza-panel { border:1px solid #e0e0e0;border-radius:6px;background:#fafafa;padding:14px;margin-bottom:14px; }
.panel-title { display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px; }
.panel-title strong { font-size:16px; }
.panel-title small { margin:0;text-align:right;max-width:320px; }
.price-matrix { display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:8px;align-items:end; }
.price-matrix > strong { color:var(--muted);font-size:11px;text-transform:uppercase; }
.price-matrix label { margin:0;font-size:12px;font-weight:900; }
.price-matrix input { margin-top:6px; }
.check { display:flex!important;gap:8px;align-items:center; }
.check input { width:auto;margin:0; }
.form-actions { display:flex;justify-content:flex-end;gap:10px;margin-top:18px; }
.form-actions button { width:auto; }
.form-actions .muted { background:#ddd;color:#333; }
.admin-toast { position:fixed;right:24px;bottom:24px;z-index:50;background:#111;color:white;padding:12px 18px;border-radius:4px;opacity:0;transform:translateY(20px);transition:.2s; }
.admin-toast.show { opacity:1;transform:none; }
@media(max-width:720px){
  .sidebar { position:sticky;top:0;width:100%;height:auto;flex-direction:row;align-items:center;padding:10px 12px;overflow:auto; }
  .sidebar nav { display:flex;margin:0 0 0 auto; }
  .nav-item { padding:10px;white-space:nowrap; }
  .logout { display:none; }
  .admin-main { margin-left:0;padding:24px 14px; }
  .admin-main header { align-items:flex-start; }
  .admin-main header h1 { font-size:29px; }
  .primary-action { padding:10px 12px; }
  .form-grid { grid-template-columns:1fr; }
  .form-grid .wide { grid-column:auto; }
  .panel-title { display:block; }
  .panel-title small { text-align:left;margin-top:4px; }
  .price-matrix { grid-template-columns:1fr; }
  .price-matrix > span,.price-matrix > strong { display:none; }
  .inline-form { flex-direction:column; }
}
