:root { --brand: #0d6efd; }

.auth-body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, #1d3a8a 0%, #0d6efd 100%);
}
.auth-wrap {
  width: 100%;
  max-width: 420px;
  margin: 2rem auto;
  padding: 1rem;
}
.auth-card { border: none; border-radius: 1rem; box-shadow: 0 10px 40px rgba(0,0,0,.25); }
.auth-card .card-body { padding: 2rem; }
.auth-logo { font-size: 2.5rem; color: var(--brand); }

.app-body { background: #f4f6fa; }

.table-records td, .table-records th { vertical-align: middle; white-space: nowrap; }
.flag-badge { cursor: default; font-weight: 500; }
.records-toolbar .form-control, .records-toolbar .form-select { max-width: 100%; }
.sortable { cursor: pointer; user-select: none; }
.sortable .bi { opacity: .4; }
.sortable.active .bi { opacity: 1; }

.totp-secret {
  font-family: monospace; font-size: .95rem; letter-spacing: 1px;
  background: #f1f3f5; padding: .4rem .6rem; border-radius: .4rem;
  display: inline-block; max-width: 100%;
  word-break: break-all; white-space: normal; line-height: 1.5;
}
#qrcode { display: inline-block; padding: .5rem; background: #fff; border-radius: .5rem; }

.code-input {
  letter-spacing: .5rem; font-size: 1.5rem; text-align: center; font-weight: 600;
}

/* Hosszú űrlapnál a modal törzse görgessen, a gombok mindig látszódjanak */
.modal-dialog-scrollable .modal-body { max-height: calc(100vh - 12rem); overflow-y: auto; }