/* ════════════════════════════════════════════════════════════════════
   EPDB Ügyfélkapu — "Modern Light" design réteg
   A Velzon + epdb.css UTÁN töltődik; csak felülír, layoutot nem bont.
   Paletta a logóból: bordó #89022B · zöld #005126/#4CB748 · mályva #AD6569
   ════════════════════════════════════════════════════════════════════ */

:root {
  --m-burgundy: #89022B;
  --m-burgundy-600: #6E0223;
  --m-burgundy-soft: #F7E6EB;
  --m-green: #005126;
  --m-green-bright: #4CB748;
  --m-green-soft: #E4F4E1;
  --m-mauve: #AD6569;
  --m-ink: #1F2937;
  --m-muted: #6F7787;
  --m-paper: #FAF9F7;
  --m-surface: #FFFFFF;
  --m-line: #ECE8E1;
  --m-radius: 14px;
  --m-radius-sm: 10px;
  --m-shadow-sm: 0 1px 2px rgba(31, 41, 55, .05);
  --m-shadow: 0 1px 2px rgba(31, 41, 55, .04), 0 10px 30px -12px rgba(31, 41, 55, .12);
  --m-shadow-lift: 0 2px 4px rgba(31, 41, 55, .05), 0 18px 40px -16px rgba(137, 2, 43, .18);
  --m-gradient: linear-gradient(90deg, var(--m-burgundy) 0%, var(--m-mauve) 55%, var(--m-green-bright) 100%);
}

/* ── Alap felület ─────────────────────────────────────────────────── */
body {
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(76, 183, 72, .05), transparent 60%),
    radial-gradient(900px 420px at -10% 0%, rgba(137, 2, 43, .04), transparent 55%),
    var(--m-paper);
  color: var(--m-ink);
}
.main-content { background: transparent; }

/* ── Topbar: üveghatás + brand-csík ──────────────────────────────── */
#page-topbar {
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: none;
  border-bottom: 1px solid var(--m-line);
}
#page-topbar::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 2px;
  background: var(--m-gradient);
  opacity: .85;
}

/* ── Sidebar: sötétzöldből világos ───────────────────────────────── */
.app-menu {
  background: var(--m-surface) !important;
  border-right: 1px solid var(--m-line);
}
.app-menu .navbar-brand-box { background: transparent; }
/* világos háttéren a sötét logó-változat látszódjon */
.app-menu .logo-light { display: none !important; }
.app-menu .logo-dark { display: block !important; }

.app-menu .menu-title,
.app-menu .menu-title span,
.app-menu .menu-title i { color: var(--m-muted) !important; letter-spacing: .08em; }
.app-menu .nav-link.menu-link,
.app-menu .nav-link.menu-link i,
.app-menu .nav-sm .nav-link {
  color: #3D4452 !important;
  transition: color .18s ease, background-color .18s ease, transform .18s ease;
  border-radius: var(--m-radius-sm);
}
.app-menu .nav-link.menu-link { margin: 2px 10px; padding: .55rem .85rem; }
.app-menu .nav-link.menu-link:hover,
.app-menu .nav-sm .nav-link:hover {
  color: var(--m-ink) !important;
  background: #F3F1ED;
}
.app-menu .nav-link.menu-link:hover i { color: var(--m-ink) !important; }
.app-menu .nav-link.menu-link.active,
.app-menu .nav-sm .nav-link.active {
  color: var(--m-green) !important;
  background: var(--m-green-soft);
  font-weight: 600;
}
.app-menu .nav-link.menu-link.active i { color: var(--m-green) !important; }
#vertical-hover { color: var(--m-muted); }
.sidebar-background { display: none; }

/* ── Kártyák ─────────────────────────────────────────────────────── */
.card {
  border: 1px solid var(--m-line);
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow-sm);
  transition: box-shadow .22s ease, transform .22s ease;
  overflow: hidden;
}
.card:hover { box-shadow: var(--m-shadow); }
.card-header {
  background: transparent;
  border-bottom: 1px solid var(--m-line);
  padding: .9rem 1.15rem;
}
.card-header .card-title { font-weight: 600; letter-spacing: .01em; }

/* KPI kártyák a vezérlőpulton — finom emelkedés */
.card .fs-22 { font-variant-numeric: tabular-nums; }

/* ── Oldalcím ────────────────────────────────────────────────────── */
.page-title-box h4 {
  font-weight: 700;
  letter-spacing: .01em;
}

/* ── Táblázatok ──────────────────────────────────────────────────── */
.table thead th, .table-light th {
  background: #FBFAF8 !important;
  color: var(--m-muted) !important;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .07em;
  border-bottom: 1px solid var(--m-line) !important;
}
.table-hover > tbody > tr:hover > * { background: #FBF6F2; }
.table td, .table th { border-color: var(--m-line); }

/* ── Gombok ──────────────────────────────────────────────────────── */
.btn { border-radius: var(--m-radius-sm); transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease; }
.btn:active { transform: translateY(1px) scale(.99); }
.btn-primary {
  background: linear-gradient(180deg, #99113B 0%, var(--m-burgundy) 60%);
  border-color: var(--m-burgundy-600);
}
.btn-primary:hover {
  background: var(--m-burgundy-600);
  border-color: var(--m-burgundy-600);
  box-shadow: 0 8px 18px -8px rgba(137, 2, 43, .5);
  transform: translateY(-1px);
}
.btn-soft-primary:hover, .btn-soft-success:hover, .btn-soft-secondary:hover, .btn-soft-danger:hover {
  transform: translateY(-1px);
}
.btn-danger:hover { box-shadow: 0 8px 18px -8px rgba(220, 38, 38, .5); transform: translateY(-1px); }

/* ── Badge-ek ────────────────────────────────────────────────────── */
.badge { border-radius: 999px; font-weight: 600; letter-spacing: .02em; padding: .35em .7em; }

/* ── Űrlapok ─────────────────────────────────────────────────────── */
.form-control, .form-select {
  border-radius: var(--m-radius-sm);
  border-color: var(--m-line);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus, .form-select:focus {
  border-color: var(--m-burgundy);
  box-shadow: 0 0 0 .2rem rgba(137, 2, 43, .12);
}
.form-check-input:checked { background-color: var(--m-burgundy); border-color: var(--m-burgundy); }

/* ── Idővonal ikonok ─────────────────────────────────────────────── */
.bg-primary-subtle { background-color: var(--m-burgundy-soft) !important; }
.text-primary { color: var(--m-burgundy) !important; }

/* ── Login / auth oldalak: világos brand-háttér ──────────────────── */
.auth-page-wrapper { position: relative; }
.auth-one-bg-position { position: absolute; inset: 0; height: 100%; }
.auth-one-bg {
  background:
    radial-gradient(900px 480px at 80% 8%, rgba(76, 183, 72, .14), transparent 60%),
    radial-gradient(820px 460px at 12% 18%, rgba(137, 2, 43, .12), transparent 58%),
    linear-gradient(180deg, #FDFCFB 0%, #F4F1EC 100%);
}
.auth-one-bg .bg-overlay { background: transparent; opacity: 1; }
.auth-one-bg .shape { display: none; }
#auth3d-canvas {
  position: fixed; inset: 0;
  width: 100vw !important; height: 100vh !important;
  pointer-events: none;
  z-index: 1;
}
.auth-page-wrapper { background: transparent !important; }
.auth-page-wrapper .text-white-50 { color: var(--m-muted) !important; }
.auth-page-wrapper .text-white-50 p { color: var(--m-ink) !important; font-weight: 600; }
.auth-page-content { position: relative; z-index: 2; }
.auth-page-wrapper .card {
  border: 1px solid rgba(255, 255, 255, .7);
  background: rgba(255, 255, 255, .86);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--m-shadow-lift);
  border-radius: 18px;
}
footer.footer { background: transparent; border-top: 1px solid var(--m-line); }

/* ── Mozgás-érzékenység: minden átmenet kikapcsol ────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}
