/* ===================================================================
   AuroraWAF — Tasarım Katmanı
   ------------------------------------------------------------------
   Bu dosya EN SON yüklenir ve Bootstrap + Dashtic temasının üzerine
   tutarlı bir "güvenlik konsolu" görünümü giydirir.

   İlkeler:
   - Tek bir tasarım token seti (renk, yarıçap, gölge, aralık)
   - Karanlık, düşük gürültülü yüzeyler + aurora aksan
   - Sayısal veriler (IP, port, sayaç) tabular/mono ile hizalı
   - Yoğun tablolar okunur satır yüksekliği ve net hover
   - Her yerde aynı kart/badge/buton dili

   NOT: Renkler doğrudan seçicilere yazılmaz; hepsi aşağıdaki
   değişkenlerden gelir. Tema değişikliği tek yerden yapılır.
   =================================================================== */

/* ── Tipografi ──────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* Yüzeyler (koyudan açığa) */
  --au-bg:          #0b1120;   /* sayfa zemini */
  --au-surface:     #111a2e;   /* kart */
  --au-surface-2:   #16203a;   /* kart içi vurgulu alan */
  --au-surface-3:   #1c2947;   /* hover */
  --au-border:      #223154;
  --au-border-soft: #1a2540;

  /* Metin */
  --au-text:        #e6edf7;
  --au-text-2:      #a9b6cd;
  --au-text-3:      #6f7f9b;

  /* Aurora aksan */
  --au-primary:     #6366f1;
  --au-primary-2:   #818cf8;
  --au-cyan:        #22d3ee;
  --au-violet:      #a78bfa;
  --au-magenta:     #e879f9;

  /* Durum renkleri */
  --au-ok:          #34d399;
  --au-warn:        #fbbf24;
  --au-danger:      #f87171;
  --au-info:        #38bdf8;

  /* Geometri */
  --au-r-sm: 8px;
  --au-r:    12px;
  --au-r-lg: 16px;
  --au-r-pill: 999px;

  /* Gölge: koyu temada gölge yerine kenar + hafif iç ışık */
  --au-shadow:    0 1px 2px rgba(0,0,0,.35), 0 8px 24px -12px rgba(0,0,0,.55);
  --au-shadow-lg: 0 2px 4px rgba(0,0,0,.4), 0 24px 48px -24px rgba(0,0,0,.7);
  --au-ring: 0 0 0 3px rgba(99,102,241,.28);

  --au-grad: linear-gradient(135deg, var(--au-cyan) 0%, var(--au-primary-2) 48%, var(--au-magenta) 100%);
}

/* ── Temel ──────────────────────────────────────────────────────── */
body {
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif !important;
  background: var(--au-bg) !important;
  color: var(--au-text) !important;
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.005em;
}

/* Sayfa zemininde çok hafif aurora ışıması — düz siyah hissini kırar */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(60rem 30rem at 12% -8%, rgba(34,211,238,.07), transparent 60%),
    radial-gradient(50rem 26rem at 88% -4%, rgba(232,121,249,.06), transparent 60%);
}
.page, .main-content, .app-content { position: relative; z-index: 1; }

h1,h2,h3,h4,h5,h6 { color: var(--au-text) !important; letter-spacing: -0.02em; font-weight: 650; }
a { color: var(--au-primary-2); }
a:hover { color: var(--au-cyan); }
hr { border-color: var(--au-border-soft) !important; opacity: 1; }

.text-muted { color: var(--au-text-3) !important; }
.text-default { color: var(--au-text) !important; }
.fs-11 { font-size: 11px !important; }
.fs-12 { font-size: 12px !important; }
.fs-13 { font-size: 13px !important; }

/* Sayısal veriler hizalı olsun */
.table td, .table th, .badge, .progress, code, pre, .font-mono { font-variant-numeric: tabular-nums; }
code, pre, .code-block, .mono {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: .86em;
}
code { color: var(--au-cyan); background: rgba(34,211,238,.08); padding: .12em .4em; border-radius: 6px; }
pre.code-block, .code-block {
  background: #0a0f1d !important;
  border: 1px solid var(--au-border) !important;
  border-radius: var(--au-r) !important;
  color: #cbd5e1 !important;
  padding: 14px 16px !important;
  overflow: auto;
}

/* ── Sayfa başlığı ──────────────────────────────────────────────── */
.page-header-breadcrumb {
  padding: 4px 0 18px;
  margin-bottom: 4px !important;
  border-bottom: 1px solid var(--au-border-soft);
}
.page-title {
  font-size: 21px !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em;
}
.breadcrumb { font-size: 12.5px; }
.breadcrumb-item, .breadcrumb-item a { color: var(--au-text-3) !important; text-decoration: none; }
.breadcrumb-item a:hover { color: var(--au-cyan) !important; }
.breadcrumb-item.active { color: var(--au-text-2) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--au-text-3) !important; opacity: .5; }

/* ── Kartlar ────────────────────────────────────────────────────── */
.card, .custom-card {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-border) !important;
  border-radius: var(--au-r-lg) !important;
  box-shadow: var(--au-shadow) !important;
  margin-bottom: 20px;
  overflow: hidden;
}
.card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--au-border-soft) !important;
  padding: 15px 20px !important;
  min-height: 0 !important;
  display: flex;
  align-items: center;
  gap: 10px;
}
.card-title {
  font-size: 14.5px !important;
  font-weight: 650 !important;
  color: var(--au-text) !important;
  margin: 0 !important;
  letter-spacing: -0.01em;
}
.card-body { padding: 20px !important; }
.card-body.p-0 { padding: 0 !important; }
.card-footer {
  background: rgba(255,255,255,.015) !important;
  border-top: 1px solid var(--au-border-soft) !important;
  padding: 13px 20px !important;
}

/* İstatistik kartlarındaki büyük sayı */
.card-body h4.fw-semibold {
  font-size: 26px !important;
  font-weight: 700 !important;
  letter-spacing: -0.035em;
  line-height: 1.15;
  margin-bottom: 2px !important;
}

/* Vurgu çerçeveli kart (uyarı/tehlike durumları) */
.card.border-danger  { border-color: rgba(248,113,113,.5) !important; }
.card.border-warning { border-color: rgba(251,191,36,.45) !important; }
.card.border-success { border-color: rgba(52,211,153,.45) !important; }

/* ── Avatar / ikon kutusu ───────────────────────────────────────── */
.avatar {
  border-radius: var(--au-r) !important;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--au-text) !important;
}
.avatar-md { width: 44px; height: 44px; }
.bg-primary-transparent   { background: rgba(99,102,241,.14)  !important; color: var(--au-primary-2) !important; }
.bg-secondary-transparent { background: rgba(167,139,250,.14) !important; color: var(--au-violet) !important; }
.bg-success-transparent   { background: rgba(52,211,153,.14)  !important; color: var(--au-ok) !important; }
.bg-danger-transparent    { background: rgba(248,113,113,.14) !important; color: var(--au-danger) !important; }
.bg-warning-transparent   { background: rgba(251,191,36,.14)  !important; color: var(--au-warn) !important; }
.bg-info-transparent      { background: rgba(56,189,248,.14)  !important; color: var(--au-info) !important; }
.bg-light                 { background: rgba(255,255,255,.05) !important; color: var(--au-text-2) !important; }

/* ── Badge ──────────────────────────────────────────────────────── */
.badge {
  font-weight: 600 !important;
  font-size: 11px !important;
  letter-spacing: .01em;
  padding: .34em .68em !important;
  border-radius: var(--au-r-pill) !important;
  line-height: 1.45;
}
.badge.bg-light { border: 1px solid var(--au-border); }
.badge.bg-light.text-muted { color: var(--au-text-2) !important; }

/* ── Tablolar ───────────────────────────────────────────────────── */
.table {
  color: var(--au-text-2) !important;
  margin-bottom: 0 !important;
  --bs-table-bg: transparent;
}
.table > thead > tr > th {
  background: rgba(255,255,255,.022) !important;
  color: var(--au-text-3) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-bottom: 1px solid var(--au-border) !important;
  padding: 11px 16px !important;
  white-space: nowrap;
}
.table > tbody > tr > td {
  border-bottom: 1px solid var(--au-border-soft) !important;
  padding: 12px 16px !important;
  vertical-align: middle;
  font-size: 13.2px;
}
.table > tbody > tr:last-child > td { border-bottom: 0 !important; }
.table > tbody > tr { transition: background .13s ease; }
.table > tbody > tr:hover > td { background: var(--au-surface-2) !important; }
.table-sm > tbody > tr > td, .table-sm > thead > tr > th { padding: 8px 14px !important; }
.table .fw-medium, .table .fw-semibold { color: var(--au-text) !important; }
.table-responsive { border-radius: 0; }

/* Boş durum bloğu */
.card-body .text-center.text-muted i.fs-2,
.card-body .text-center.text-muted i.fs-1 { opacity: .22 !important; }

/* ── Butonlar ───────────────────────────────────────────────────── */
.btn {
  font-weight: 600 !important;
  font-size: 13px !important;
  border-radius: var(--au-r-sm) !important;
  padding: .5rem .95rem !important;
  letter-spacing: -0.005em;
  transition: transform .1s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
  border-width: 1px;
}
.btn:active { transform: translateY(1px); }
.btn:focus-visible { box-shadow: var(--au-ring) !important; outline: 0; }
.btn-sm { padding: .32rem .68rem !important; font-size: 12px !important; }

.btn-primary {
  background: var(--au-primary) !important;
  border-color: var(--au-primary) !important;
  color: #fff !important;
}
.btn-primary:hover { background: #4f46e5 !important; border-color: #4f46e5 !important; }

.btn-outline-primary {
  border-color: var(--au-border) !important;
  color: var(--au-text-2) !important;
  background: transparent !important;
}
.btn-outline-primary:hover {
  background: rgba(99,102,241,.12) !important;
  border-color: var(--au-primary) !important;
  color: var(--au-primary-2) !important;
}
.btn-light {
  background: rgba(255,255,255,.055) !important;
  border-color: var(--au-border) !important;
  color: var(--au-text-2) !important;
}
.btn-light:hover { background: rgba(255,255,255,.1) !important; color: var(--au-text) !important; }

.btn-primary-light { background: rgba(99,102,241,.15) !important; border-color: transparent !important; color: var(--au-primary-2) !important; }
.btn-primary-light:hover { background: rgba(99,102,241,.26) !important; }
.btn-danger-light  { background: rgba(248,113,113,.14) !important; border-color: transparent !important; color: var(--au-danger) !important; }
.btn-danger-light:hover  { background: rgba(248,113,113,.24) !important; }
.btn-success-light { background: rgba(52,211,153,.14) !important; border-color: transparent !important; color: var(--au-ok) !important; }
.btn-success-light:hover { background: rgba(52,211,153,.24) !important; }
.btn-danger  { background: var(--au-danger) !important; border-color: var(--au-danger) !important; color: #1a0a0a !important; }
.btn-success { background: var(--au-ok) !important; border-color: var(--au-ok) !important; color: #062b1e !important; }

.btn-group .btn { border-radius: 0 !important; }
.btn-group .btn:first-child { border-top-left-radius: var(--au-r-sm) !important; border-bottom-left-radius: var(--au-r-sm) !important; }
.btn-group .btn:last-child  { border-top-right-radius: var(--au-r-sm) !important; border-bottom-right-radius: var(--au-r-sm) !important; }

.btn-list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ── Formlar ────────────────────────────────────────────────────── */
.form-label { color: var(--au-text-2) !important; font-size: 12.5px !important; font-weight: 600 !important; margin-bottom: 6px; }
.form-control, .form-select {
  background: var(--au-surface-2) !important;
  border: 1px solid var(--au-border) !important;
  color: var(--au-text) !important;
  border-radius: var(--au-r-sm) !important;
  padding: .55rem .8rem !important;
  font-size: 13.5px !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control::placeholder { color: var(--au-text-3) !important; opacity: 1; }
.form-control:focus, .form-select:focus {
  background: var(--au-surface-2) !important;
  border-color: var(--au-primary) !important;
  box-shadow: var(--au-ring) !important;
  color: var(--au-text) !important;
}
.form-control:disabled, .form-control[readonly] { background: rgba(255,255,255,.03) !important; color: var(--au-text-3) !important; }
.form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236f7f9b' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important; }
.input-group-text {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid var(--au-border) !important;
  color: var(--au-text-3) !important;
  border-radius: var(--au-r-sm) 0 0 var(--au-r-sm) !important;
}
.input-group > .form-control { border-radius: 0 var(--au-r-sm) var(--au-r-sm) 0 !important; }

.form-check-input {
  background-color: var(--au-surface-3) !important;
  border-color: var(--au-border) !important;
  width: 1.05em; height: 1.05em;
}
.form-check-input:checked { background-color: var(--au-primary) !important; border-color: var(--au-primary) !important; }
.form-check-input:focus { box-shadow: var(--au-ring) !important; border-color: var(--au-primary) !important; }
.form-check-label { color: var(--au-text-2) !important; font-size: 13.5px; }
.form-switch .form-check-input { width: 2.1em; border-radius: var(--au-r-pill) !important; }

/* ── Uyarı blokları ─────────────────────────────────────────────── */
.alert {
  border-radius: var(--au-r) !important;
  border: 1px solid transparent !important;
  padding: 13px 16px !important;
  font-size: 13.4px;
  margin-bottom: 18px;
}
.alert-info    { background: rgba(56,189,248,.1)  !important; border-color: rgba(56,189,248,.28) !important; color: #bae6fd !important; }
.alert-warning { background: rgba(251,191,36,.1)  !important; border-color: rgba(251,191,36,.3)  !important; color: #fde68a !important; }
.alert-danger  { background: rgba(248,113,113,.1) !important; border-color: rgba(248,113,113,.3) !important; color: #fecaca !important; }
.alert-success { background: rgba(52,211,153,.1)  !important; border-color: rgba(52,211,153,.3)  !important; color: #a7f3d0 !important; }
.alert code { background: rgba(255,255,255,.08); color: inherit; }

/* ── Progress ───────────────────────────────────────────────────── */
.progress {
  background: rgba(255,255,255,.06) !important;
  border-radius: var(--au-r-pill) !important;
  height: 7px;
  overflow: hidden;
}
.progress-sm { height: 6px; }
.progress-bar { border-radius: var(--au-r-pill); }
.progress-bar.bg-primary   { background: var(--au-grad) !important; }
.progress-bar.bg-secondary { background: linear-gradient(90deg, var(--au-violet), var(--au-magenta)) !important; }
.progress-bar.bg-success   { background: linear-gradient(90deg, #10b981, var(--au-ok)) !important; }
.progress-bar.bg-warning   { background: linear-gradient(90deg, #f59e0b, var(--au-warn)) !important; }

/* ── Kenar çubuğu ───────────────────────────────────────────────── */
.app-sidebar {
  background: #0a1022 !important;
  border-right: 1px solid var(--au-border) !important;
}
.app-sidebar .main-sidebar-header {
  background: #0a1022 !important;
  border-bottom: 1px solid var(--au-border-soft) !important;
  border-right: 1px solid var(--au-border) !important;
}
.slide__category {
  color: var(--au-text-3) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .12em;
  padding: 18px 22px 7px !important;
}
.slide__category .category-name { color: inherit !important; opacity: .85; }

.side-menu__item {
  color: var(--au-text-2) !important;
  border-radius: 10px !important;
  margin: 2px 12px !important;
  padding: 9px 12px !important;
  font-size: 13.5px !important;
  font-weight: 550 !important;
  display: flex; align-items: center; gap: 11px;
  transition: background .14s ease, color .14s ease;
  position: relative;
}
.side-menu__item:hover { background: rgba(255,255,255,.055) !important; color: var(--au-text) !important; }
.side-menu__item.active {
  background: rgba(99,102,241,.16) !important;
  color: #fff !important;
  font-weight: 650 !important;
}
/* Aktif öğede aurora şeridi */
.side-menu__item.active::before {
  content: '';
  position: absolute; left: -12px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 62%;
  border-radius: 0 3px 3px 0;
  background: var(--au-grad);
}
.side-menu__icon { width: 18px; text-align: center; font-size: 15px !important; color: inherit !important; opacity: .9; }
.side-menu__item.active .side-menu__icon { opacity: 1; }
.side-menu__label { color: inherit !important; }

/* ── Üst bar ────────────────────────────────────────────────────── */
.app-header {
  background: rgba(11,17,32,.82) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--au-border) !important;
  box-shadow: none !important;
}
.app-header .header-link, .app-header .header-link i { color: var(--au-text-2) !important; }
.app-header .header-link:hover { color: var(--au-text) !important; }

.dropdown-menu {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-border) !important;
  border-radius: var(--au-r) !important;
  box-shadow: var(--au-shadow-lg) !important;
  padding: 6px !important;
}
.dropdown-item { color: var(--au-text-2) !important; border-radius: var(--au-r-sm) !important; padding: 8px 12px !important; font-size: 13.3px; }
.dropdown-item:hover { background: var(--au-surface-3) !important; color: var(--au-text) !important; }
.dropdown-divider { border-color: var(--au-border-soft) !important; }

/* ── Modal ──────────────────────────────────────────────────────── */
.modal-content {
  background: var(--au-surface) !important;
  border: 1px solid var(--au-border) !important;
  border-radius: var(--au-r-lg) !important;
  box-shadow: var(--au-shadow-lg) !important;
}
.modal-header, .modal-footer { border-color: var(--au-border-soft) !important; padding: 16px 20px !important; }
.modal-body { padding: 20px !important; }
.modal-title { font-size: 15px !important; font-weight: 650 !important; }
.btn-close { filter: invert(1) grayscale(1) brightness(1.6); opacity: .55; }
.btn-close:hover { opacity: 1; }

/* ── Footer ─────────────────────────────────────────────────────── */
.footer {
  background: transparent !important;
  border-top: 1px solid var(--au-border-soft) !important;
  color: var(--au-text-3) !important;
  font-size: 12.5px;
  box-shadow: none !important;
}

/* ── Grafik kapsayıcı ───────────────────────────────────────────── */
canvas { max-width: 100%; }

/* ── Yardımcılar ────────────────────────────────────────────────── */
.op-3 { opacity: .3; }
.au-grad-text {
  background: var(--au-grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.au-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.au-dot--ok    { background: var(--au-ok);    box-shadow: 0 0 0 3px rgba(52,211,153,.18); }
.au-dot--warn  { background: var(--au-warn);  box-shadow: 0 0 0 3px rgba(251,191,36,.18); }
.au-dot--down  { background: var(--au-danger);box-shadow: 0 0 0 3px rgba(248,113,113,.18); }

/* Canlı veri nabzı */
@keyframes auPulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.au-live { animation: auPulse 1.9s ease-in-out infinite; }

/* Kaydırma çubuğu */
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: #263352; border-radius: var(--au-r-pill); border: 2px solid var(--au-bg); }
*::-webkit-scrollbar-thumb:hover { background: #34446b; }

/* SweetAlert koyu tema uyumu */
.swal2-popup {
  background: var(--au-surface) !important;
  color: var(--au-text) !important;
  border: 1px solid var(--au-border) !important;
  border-radius: var(--au-r-lg) !important;
}
.swal2-title, .swal2-html-container { color: var(--au-text) !important; }

/* ── Mobil ──────────────────────────────────────────────────────── */
@media (max-width: 991.98px) {
  .card-body { padding: 16px !important; }
  .page-title { font-size: 18px !important; }
  .card-body h4.fw-semibold { font-size: 22px !important; }
  .table > tbody > tr > td, .table > thead > tr > th { padding: 10px 12px !important; }
  .page-header-breadcrumb { flex-direction: column; align-items: flex-start; gap: 10px; }
  .btn-list { width: 100%; }
}
@media (max-width: 575.98px) {
  .btn-group.btn-group-sm { width: 100%; }
  .btn-group.btn-group-sm .btn { flex: 1; }
}

/* Yazdırma: rapor çıktısı okunur olsun */
@media print {
  body { background: #fff !important; color: #000 !important; }
  body::before, .app-sidebar, .app-header, .footer, .btn-list, .scrollToTop { display: none !important; }
  .card { border: 1px solid #ccc !important; box-shadow: none !important; break-inside: avoid; }
  .card, .card-header, .table { background: #fff !important; color: #000 !important; }
  .table > thead > tr > th, .table > tbody > tr > td { color: #000 !important; border-color: #ddd !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   Kimlik doğrulama sayfaları (giriş / 2FA)
   ═════════════════════════════════════════════════════════════════ */
body.authentication-page {
  background: var(--au-bg) !important;
  color: var(--au-text) !important;
}
body.authentication-page::before { display: none; }

/* Sol marka paneli */
.auth-hero {
  flex: 0 0 46%;
  max-width: 46%;
  background:
    radial-gradient(120% 90% at 20% 0%, #17204a 0%, transparent 60%),
    radial-gradient(100% 80% at 90% 100%, #2a1140 0%, transparent 62%),
    #080d1a;
  border-inline-end: 1px solid var(--au-border);
}
.auth-hero-bg { position: absolute; inset: 0; overflow: hidden; }
.auth-hero-bg .blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(64px);
  opacity: .5;
  animation: au-float 18s ease-in-out infinite;
}
.auth-hero-bg .b1 { width: 380px; height: 380px; top: -80px; left: -60px;  background: var(--au-cyan);    animation-delay: 0s; }
.auth-hero-bg .b2 { width: 320px; height: 320px; top: 30%;   right: -70px; background: var(--au-violet);  animation-delay: -4s; }
.auth-hero-bg .b3 { width: 300px; height: 300px; bottom: 8%;  left: 12%;   background: var(--au-magenta); animation-delay: -8s; }
.auth-hero-bg .b4 { width: 240px; height: 240px; bottom: -60px; right: 18%; background: var(--au-primary); animation-delay: -12s; }
@keyframes au-float {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  33%      { transform: translate3d(26px, -22px, 0) scale(1.08); }
  66%      { transform: translate3d(-20px, 18px, 0) scale(.94); }
}
.auth-hero-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(80% 60% at 50% 40%, #000 0%, transparent 78%);
  -webkit-mask-image: radial-gradient(80% 60% at 50% 40%, #000 0%, transparent 78%);
}
.auth-hero-vignette {
  position: absolute; inset: 0;
  background: radial-gradient(90% 70% at 50% 45%, transparent 30%, rgba(4,7,15,.72) 100%);
}
.auth-hero-title {
  font-size: 30px !important;
  line-height: 1.2;
  background: var(--au-grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent !important;
}

/* Ortadaki kalkan + halkalar */
.login-shield { position: relative; width: 260px; height: 260px; display: grid; place-items: center; }
.login-shield .ring {
  position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.14);
  animation: au-pulse 4.5s ease-out infinite;
}
.login-shield .r1 { inset: 22%;  animation-delay: 0s; }
.login-shield .r2 { inset: 10%;  animation-delay: .9s; }
.login-shield .r3 { inset: 0;    animation-delay: 1.8s; }
@keyframes au-pulse {
  0%   { transform: scale(.86); opacity: .9; }
  100% { transform: scale(1.18); opacity: 0; }
}
.login-shield .shield-glow {
  position: absolute; width: 190px; height: 190px; border-radius: 50%;
  background: var(--au-grad); filter: blur(46px); opacity: .55;
}
.login-shield .shield-core {
  position: relative; z-index: 2;
  width: 128px; height: 128px;
  display: grid; place-items: center;
  border-radius: 34px;
  background: rgba(12,18,35,.72);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 24px 60px -20px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter: blur(8px);
}
.login-shield .shield-core img { width: 84px; height: 84px; display: block; }

/* Sağ form paneli */
.auth-form-pane {
  background: var(--au-surface) !important;
  border-inline-start: 1px solid var(--au-border);
}
.auth-form-pane .form-control,
.auth-form-pane .input-group-text {
  background: var(--au-surface-2) !important;
  border-color: var(--au-border) !important;
  color: var(--au-text) !important;
}
.auth-form-pane .form-control::placeholder { color: var(--au-text-3) !important; }
.auth-form-pane .form-control:focus {
  border-color: var(--au-primary) !important;
  box-shadow: var(--au-ring) !important;
}
.auth-form-pane .btn-light {
  background: var(--au-surface-2) !important;
  border-color: var(--au-border) !important;
  color: var(--au-text-2) !important;
}
.auth-form-pane .btn-light:hover { background: var(--au-surface-3) !important; color: var(--au-text) !important; }
.auth-form-pane .btn-primary {
  background: var(--au-grad) !important;
  border: 0 !important;
  color: #08101f !important;
  font-weight: 700;
  padding: 11px 18px;
  border-radius: var(--au-r) !important;
}
.auth-form-pane .btn-primary:hover { filter: brightness(1.08); }
.auth-form-pane .form-label { color: var(--au-text-2) !important; }
.auth-form-pane .alert-info {
  background: rgba(56,189,248,.10) !important;
  border: 1px solid rgba(56,189,248,.28) !important;
  color: #bae6fd !important;
  border-radius: var(--au-r) !important;
}

@media (max-width: 767.98px) {
  .auth-hero { display: none !important; }
  .auth-form-pane { border-inline-start: 0; background: var(--au-bg) !important; }
}

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
  .auth-hero-bg .blob, .login-shield .ring { animation: none !important; }
}
