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

body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background: #0f172a;
  min-height: 100vh;
  color: #e2e8f0;
}

.bg-pattern {
  position: fixed; inset: 0; z-index: 0; overflow: hidden;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(59,130,246,0.12) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(99,102,241,0.10) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 90%, rgba(14,165,233,0.08) 0%, transparent 50%);
}

.container { max-width: 1100px; margin: 0 auto; padding: 40px 20px; position: relative; z-index: 1; }
.container-sm { max-width: 440px; margin: 0 auto; padding: 40px 20px; position: relative; z-index: 1; }

.header { text-align: center; margin-bottom: 32px; }
.header h1 { font-size: 1.7rem; font-weight: 700; color: #f8fafc; letter-spacing: -0.02em; }
.header p { font-size: 0.95rem; color: #94a3b8; margin-top: 6px; }

.card {
  background: rgba(30, 41, 59, 0.6);
  border: 1px solid rgba(148,163,184,0.1);
  border-radius: 14px;
  padding: 28px;
  backdrop-filter: blur(6px);
}

label { display: block; font-size: 0.85rem; color: #94a3b8; margin: 14px 0 6px; }
label:first-of-type { margin-top: 0; }

input[type="text"], input[type="password"], input[type="email"] {
  width: 100%; padding: 11px 14px; border-radius: 9px;
  background: rgba(15,23,42,0.7); border: 1px solid rgba(148,163,184,0.2);
  color: #f8fafc; font-size: 0.95rem; outline: none;
}
input:focus { border-color: #6366f1; }

.checkbox-row { display: flex; align-items: center; gap: 8px; margin-top: 16px; }
.checkbox-row input { width: auto; }
.checkbox-row label { margin: 0; }

button.btn {
  margin-top: 22px; width: 100%; padding: 12px 16px; border: none; border-radius: 9px;
  background: linear-gradient(135deg, #6366f1, #3b82f6);
  color: white; font-size: 0.95rem; font-weight: 600; cursor: pointer;
  transition: opacity 0.15s;
}
button.btn:hover { opacity: 0.92; }
button.btn.secondary { background: rgba(148,163,184,0.15); }
button.btn:disabled { opacity: 0.5; cursor: not-allowed; }

.btn-link {
  display: inline-block; margin-top: 16px; text-align: center; width: 100%;
  color: #93c5fd; font-size: 0.85rem; text-decoration: none; cursor: pointer; background: none; border: none;
}
.btn-link:hover { text-decoration: underline; }

.msg { margin-top: 14px; font-size: 0.85rem; padding: 10px 12px; border-radius: 8px; display: none; }
.msg.error { display: block; background: rgba(239,68,68,0.12); color: #fca5a5; border: 1px solid rgba(239,68,68,0.25); }
.msg.success { display: block; background: rgba(34,197,94,0.12); color: #86efac; border: 1px solid rgba(34,197,94,0.25); }

.top-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; flex-wrap: wrap; gap: 12px; }
.top-bar h1 { font-size: 1.5rem; color: #f8fafc; }
.top-bar .user-info { font-size: 0.85rem; color: #94a3b8; }

table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 12px 14px; font-size: 0.9rem; }
thead th { color: #64748b; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid rgba(148,163,184,0.15); }
tbody tr { border-bottom: 1px solid rgba(148,163,184,0.08); }
tbody tr:hover { background: rgba(99,102,241,0.06); }

.badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.75rem; font-weight: 600; }
.badge.ativo { background: rgba(34,197,94,0.15); color: #86efac; }
.badge.inativo { background: rgba(239,68,68,0.15); color: #fca5a5; }
.badge.admin { background: rgba(99,102,241,0.18); color: #a5b4fc; margin-left: 6px; }

a.btn-edit { color: #93c5fd; font-size: 0.85rem; text-decoration: none; }
a.btn-edit:hover { text-decoration: underline; }

.btn-novo {
  padding: 10px 18px; border: none; border-radius: 9px; text-decoration: none;
  background: linear-gradient(135deg, #6366f1, #3b82f6); color: white;
  font-size: 0.9rem; font-weight: 600; display: inline-block;
}

.voltar { color: #94a3b8; font-size: 0.85rem; text-decoration: none; }
.voltar:hover { color: #e2e8f0; }