*, *::before, *::after { box-sizing: border-box; margin:0; padding:0; }

:root {
  --bg:#0a0a0a; --fg:#f5f5f5; --card:#111111; --card2:#161616; --border:#242424;
  --primary:hsl(338,100%,45%); --accent:hsl(192,100%,50%); --destructive:hsl(0,80%,55%);
  --muted:#8c8c8c; --success:hsl(142,70%,45%); --warning:hsl(38,92%,50%);
}

body {
  font-family:'Rajdhani',sans-serif; background:var(--bg); color:var(--fg);
  min-height:100vh; -webkit-font-smoothing:antialiased; line-height:1.5;
}

a { color:inherit; }

/* ===== LOGIN ===== */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:1rem; position:relative; overflow:hidden; }
.login-wrap::before {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 50% 20%, hsla(338,100%,50%,0.18) 0%, transparent 55%),
    radial-gradient(ellipse at 50% 85%, hsla(192,100%,50%,0.1) 0%, transparent 50%);
}
.login-card {
  position:relative; z-index:1; width:100%; max-width:22rem;
  background:var(--card); border:1px solid var(--border); border-radius:1.25rem;
  padding:2.5rem 2rem; box-shadow:0 25px 80px rgba(0,0,0,0.6); text-align:center;
}
.login-logo {
  width:72px; height:72px; margin:0 auto 1rem; border-radius:18px;
  display:flex; align-items:center; justify-content:center;
  background:var(--card2); border:2px solid transparent; background-clip:padding-box;
  box-shadow:0 0 0 2px hsla(338,100%,50%,0.5), 0 0 24px hsla(338,100%,50%,0.4);
  font-family:'Orbitron',monospace; font-weight:900; color:var(--primary); font-size:1.1rem; letter-spacing:0.05em;
}
.login-title { font-family:'Orbitron',monospace; font-size:1.2rem; font-weight:900; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:0.25rem; }
.login-sub { font-size:0.8rem; color:var(--muted); margin-bottom:1.75rem; letter-spacing:0.1em; text-transform:uppercase; }
.form-group { text-align:left; margin-bottom:1rem; }
.form-label { display:block; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted); margin-bottom:0.4rem; }
.form-input {
  width:100%; padding:0.75rem 1rem; border-radius:0.625rem; border:1px solid var(--border);
  background:var(--bg); color:var(--fg); font-size:0.95rem; font-family:inherit; outline:none; transition:all 0.2s;
}
.form-input:focus { border-color:var(--primary); box-shadow:0 0 0 3px hsla(338,100%,50%,0.1); }
.login-btn {
  width:100%; padding:0.8rem; margin-top:0.5rem; border:none; border-radius:0.625rem;
  background:var(--primary); color:#fff; font-size:0.95rem; font-weight:800; font-family:inherit;
  cursor:pointer; transition:all 0.2s; letter-spacing:0.04em;
}
.login-btn:hover { background:hsl(338,100%,40%); box-shadow:0 4px 20px hsla(338,100%,50%,0.4); }
.login-error {
  display:none; margin-top:1rem; padding:0.65rem 0.9rem; border-radius:0.5rem;
  background:hsla(0,80%,55%,0.12); border:1px solid hsla(0,80%,55%,0.3); color:var(--destructive);
  font-size:0.85rem; font-weight:700;
}
.login-error.show { display:block; }
.login-back { display:inline-block; margin-top:1.5rem; font-size:0.8rem; color:var(--muted); text-decoration:none; }
.login-back:hover { color:var(--fg); }
.login-foot { margin-top:1.5rem; font-size:0.7rem; color:rgba(140,140,140,0.6); }

/* ===== ADMIN LAYOUT ===== */
.admin-nav {
  position:fixed; top:0; left:0; right:0; height:60px; z-index:100;
  background:rgba(10,10,10,0.97); border-bottom:1px solid var(--border);
  display:flex; align-items:center; padding:0 1.5rem; gap:1rem;
}
.admin-nav-brand { display:flex; align-items:center; gap:0.6rem; font-family:'Orbitron',monospace; font-weight:900; letter-spacing:0.05em; color:var(--primary); text-decoration:none; flex-shrink:0; }
.admin-nav-brand svg { width:20px; height:20px; }
.admin-nav-links { display:flex; gap:0.25rem; overflow-x:auto; }
.admin-nav-link {
  padding:0.45rem 0.9rem; border-radius:0.5rem; font-size:0.8rem; font-weight:800;
  color:var(--muted); text-decoration:none; text-transform:uppercase; letter-spacing:0.05em; white-space:nowrap; transition:all 0.2s;
}
.admin-nav-link:hover { color:var(--fg); background:var(--card2); }
.admin-nav-link.active { color:#fff; background:var(--primary); }
.admin-nav-spacer { flex:1; }
.admin-nav-user { font-size:0.75rem; color:var(--muted); display:none; }
@media (min-width:640px){ .admin-nav-user{display:block;} }
.admin-logout {
  display:flex; align-items:center; gap:0.4rem; padding:0.4rem 0.8rem; border-radius:0.5rem;
  border:1px solid hsla(0,80%,55%,0.4); background:hsla(0,80%,55%,0.1); color:var(--destructive);
  text-decoration:none; font-size:0.75rem; font-weight:800; transition:all 0.2s; white-space:nowrap;
}
.admin-logout:hover { background:var(--destructive); color:#fff; }

.admin-main { padding:80px 1.5rem 3rem; max-width:64rem; margin:0 auto; }
.admin-page-title { font-family:'Orbitron',monospace; font-size:1.1rem; font-weight:900; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:1.5rem; }
.admin-page-title span { color:var(--muted); font-weight:400; }

.admin-cards { display:grid; gap:0.75rem; grid-template-columns:repeat(2,1fr); margin-bottom:2rem; }
@media (min-width:768px){ .admin-cards{grid-template-columns:repeat(5,1fr);} }
.admin-card {
  background:var(--card); border:1px solid var(--border); border-radius:0.875rem; padding:1.25rem;
  text-align:center;
}
.admin-card-value { font-family:'Orbitron',monospace; font-size:1.6rem; font-weight:900; color:var(--primary); }
.admin-card-label { font-size:0.7rem; color:var(--muted); text-transform:uppercase; letter-spacing:0.06em; font-weight:700; }

.panel { background:var(--card); border:1px solid var(--border); border-radius:1rem; padding:1.5rem; margin-bottom:2rem; }
.panel-title { font-family:'Orbitron',monospace; font-size:0.85rem; font-weight:900; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:1.25rem; display:flex; align-items:center; gap:0.5rem; }
.panel-title svg { width:18px; height:18px; color:var(--primary); }

.form-grid { display:grid; gap:1rem; }
@media (min-width:640px){ .form-grid{grid-template-columns:repeat(2,1fr);} }
.form-grid .full { grid-column:1 / -1; }
.admin-form-group { text-align:left; }
.admin-label { display:block; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); margin-bottom:0.35rem; }
.admin-input, .admin-select, .admin-textarea {
  width:100%; padding:0.65rem 0.85rem; border-radius:0.5rem; border:1px solid var(--border);
  background:var(--bg); color:var(--fg); font-size:0.9rem; font-family:inherit; outline:none; transition:all 0.2s;
}
.admin-input:focus, .admin-select:focus, .admin-textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px hsla(338,100%,50%,0.1); }
.admin-textarea { resize:vertical; min-height:70px; }
.admin-select option { background:var(--bg); }
.check-row { display:flex; align-items:center; gap:0.5rem; margin-top:0.4rem; }
.check-row input { width:18px; height:18px; accent-color:var(--primary); }
.check-row label { font-size:0.85rem; font-weight:600; color:var(--fg); }
.admin-submit {
  padding:0.7rem 1.4rem; border:none; border-radius:0.5rem; background:var(--primary); color:#fff;
  font-size:0.9rem; font-weight:800; font-family:inherit; cursor:pointer; transition:all 0.2s;
}
.admin-submit:hover { background:hsl(338,100%,40%); box-shadow:0 4px 16px hsla(338,100%,50%,0.4); }
.admin-submit.accent { background:var(--accent); color:var(--accent-fg); }
.admin-submit.accent:hover { background:hsl(192,100%,45%); }

/* LISTA DE ITENS */
.item-list { display:flex; flex-direction:column; gap:0.625rem; }
.item-row {
  display:flex; align-items:center; gap:0.75rem; padding:0.75rem; border-radius:0.75rem;
  background:var(--card2); border:1px solid var(--border);
}
.item-thumb { width:48px; height:48px; flex-shrink:0; border-radius:0.5rem; overflow:hidden; background:var(--bg); display:flex; align-items:center; justify-content:center; }
.item-thumb img { width:100%; height:100%; object-fit:cover; }
.item-thumb svg { width:20px; height:20px; color:var(--muted); }
.item-info { flex:1; min-width:0; }
.item-name { font-size:0.9rem; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.item-meta { font-size:0.7rem; color:var(--muted); }
.item-actions { display:flex; gap:0.4rem; }
.item-btn {
  display:flex; align-items:center; justify-content:center; gap:0.3rem; padding:0.4rem 0.7rem;
  border-radius:0.5rem; border:1px solid var(--border); background:var(--bg); color:var(--muted);
  font-size:0.72rem; font-weight:800; cursor:pointer; text-decoration:none; transition:all 0.2s; font-family:inherit;
}
.item-btn svg { width:14px; height:14px; }
.item-btn.edit:hover { border-color:var(--accent); color:var(--accent); }
.item-btn.del:hover { border-color:var(--destructive); color:var(--destructive); background:hsla(0,80%,55%,0.1); }
.item-badge { padding:0.12rem 0.5rem; border-radius:9999px; font-size:0.6rem; font-weight:800; background:linear-gradient(135deg,var(--primary),#ff6eb4); color:#fff; }

.admin-msg { display:none; padding:0.75rem 1rem; border-radius:0.5rem; margin-bottom:1rem; font-size:0.85rem; font-weight:700; }
.admin-msg.success { display:block; background:hsla(142,70%,45%,0.12); border:1px solid hsla(142,70%,45%,0.3); color:var(--success); }
.admin-msg.error { display:block; background:hsla(0,80%,55%,0.12); border:1px solid hsla(0,80%,55%,0.3); color:var(--destructive); }

.file-hint { font-size:0.7rem; color:var(--muted); margin-top:0.3rem; }

/* ===== RESPONSIVO ADMIN (mobile & tablet) ===== */
@media (max-width: 920px) {
  .admin-cards { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .admin-main { padding: 72px 0.9rem 2.5rem; }
  .admin-cards { grid-template-columns: repeat(2, 1fr); gap: 0.6rem; margin-bottom: 1.6rem; }
  .admin-card { padding: 1rem; }
  .admin-card-value { font-size: 1.3rem; }
  .panel { padding: 1.1rem; }
  .item-row { flex-wrap: wrap; gap: 0.6rem; }
  .item-actions { width: 100%; flex-wrap: wrap; justify-content: flex-end; }
  .form-grid { gap: 0.8rem; }
  .item-btn { padding: 0.4rem 0.6rem; white-space: nowrap; }
}
@media (max-width: 640px) {
  .admin-nav { padding: 0 0.75rem; gap: 0.5rem; overflow-x: auto; }
  .admin-nav-link { padding: 0.4rem 0.55rem; font-size: 0.72rem; }
  .admin-nav-user { display: none; }
}
@media (max-width: 480px) {
  .admin-nav { height: 54px; }
  .admin-nav-brand svg { width: 18px; height: 18px; }
  .admin-nav-link { padding: 0.4rem 0.5rem; }
}
