/* ── RockNET CRM — login page styles ────────────────────────────────────────── */
body {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
}
.card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 10px; width: 360px; max-width: 95vw;
  box-shadow: 0 12px 40px rgba(0,0,0,0.10); overflow: hidden;
}
.card-top {
  background: var(--ink); padding: 24px 28px;
  border-bottom: 3px solid var(--accent); text-align: center;
}
.card-top h1 { font-family: var(--serif); font-size: 26px; color: #fff; font-weight: 600; letter-spacing: -0.5px; }
.card-top p  { font-size: 11px; color: #888; margin-top: 5px; letter-spacing: 0.5px; }
.card-body { padding: 28px; }
.form-group { margin-bottom: 16px; }
label { display: block; font-size: 11px; color: var(--ink2); margin-bottom: 5px; letter-spacing: 0.5px; text-transform: uppercase; }
input[type=text], input[type=password] {
  width: 100%; background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius); font-family: var(--mono); font-size: 13px;
  color: var(--ink); padding: 9px 11px; outline: none; transition: border-color 0.15s;
}
input:focus { border-color: var(--accent); }
.error {
  background: var(--accent-soft); border: 1px solid #e8bdb3;
  border-radius: var(--radius); color: var(--accent);
  font-size: 12px; padding: 9px 12px; margin-bottom: 16px;
}
.expired-notice {
  background: var(--amber-soft); border: 1px solid #e8c96e;
  border-radius: var(--radius); color: var(--amber);
  font-size: 12px; padding: 9px 12px; margin-bottom: 16px;
}
button[type=submit] {
  width: 100%; background: var(--accent); color: #fff;
  border: none; border-radius: var(--radius);
  font-family: var(--mono); font-size: 13px; font-weight: 500;
  padding: 10px; cursor: pointer; transition: background 0.15s; letter-spacing: 0.5px;
}
button[type=submit]:hover { background: #a83820; }
.footer { margin-top: 20px; font-size: 11px; color: #aaa; }