/* ── Themed #modalAjax (2FA setup, and other system modals) ── */
#modalAjax .modal-content {
  background: #14091f;
  color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 14px;
}
#modalAjax .modal-header {
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: transparent;
}
#modalAjax .modal-header .modal-title,
#modalAjax .modal-title {
  color: #fff;
  font-weight: 700;
}
#modalAjax .modal-header .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: .6;
}
#modalAjax .modal-header .btn-close:hover { opacity: 1; }

#modalAjax .modal-body {
  color: rgba(255,255,255,.8);
  font-size: 14.5px;
  line-height: 1.6;
}
#modalAjax .modal-body p { color: rgba(255,255,255,.75); }
#modalAjax .modal-body strong { color: #fff; }

#modalAjax .modal-footer {
  border-top: 1px solid rgba(255,255,255,.08);
  background: transparent;
}

/* Method-selection rows (twofa-module) */
#modalAjax .twofa-module {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  transition: border-color .2s, background .2s;
}
#modalAjax .twofa-module:hover { border-color: rgba(143,52,255,.4) !important; }
#modalAjax .twofa-module.active {
  border-color: #8f34ff !important;
  background: rgba(143,52,255,.12);
}
#modalAjax .twofa-module .col-description strong { color: #fff; }
#modalAjax .twofa-module .col-description { color: rgba(255,255,255,.6); }

/* Inputs inside the modal (auth code, etc.) */
#modalAjax input[type="text"],
#modalAjax input[type="number"],
#modalAjax input[type="tel"] {
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  color: #fff !important;
  border-radius: 8px !important;
}
#modalAjax input::placeholder { color: rgba(255,255,255,.35) !important; }

/* QR code needs a light card behind it to stay scannable */
#modalAjax img[src*="qr"],
#modalAjax .modal-body > img {
  background: #fff;
  padding: 12px;
  border-radius: 10px;
  display: block;
  margin: 12px auto;
}

/* Buttons */
#modalAjax .btn-primary,
#modalAjax input[type="button"].btn-primary,
#modalAjax input[value="Почати »"] {
  background: linear-gradient(90deg, #7c2fe0, #9d3cff) !important;
  border: none !important;
}
#modalAjax .btn-primary:hover {
  background: linear-gradient(90deg, #6d28d9, #8b34ff) !important;
}
#modalAjax .btn-secondary,
#modalAjax .btn-default {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  color: rgba(255,255,255,.8) !important;
}

/* Backdrop a touch darker to match theme mood */
.modal-backdrop.show { opacity: .65; }