:root {
  --brand: #6f5bf6;
  --brand-2: #22d3ee;
  --bg: #0f1117;
  --bg-soft: #161927;
  --border-soft: #262b3d;
}

* {
  font-family: 'Vazirmatn', system-ui, sans-serif !important;
}

body {
  background: radial-gradient(circle at top, #171a26 0%, var(--bg) 55%);
  color: #e6e8ef;
  min-height: 100vh;
}

.app-navbar {
  background: rgba(15, 17, 23, 0.85);
  backdrop-filter: blur(8px);
  border-color: var(--border-soft) !important;
}

.navbar-brand {
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}

.card {
  background: var(--bg-soft);
  border: 1px solid var(--border-soft);
  border-radius: 1rem;
}

.card.package-card {
  transition: transform .15s ease, border-color .15s ease;
}

.card.package-card:hover {
  transform: translateY(-4px);
  border-color: var(--brand);
}

.btn-primary {
  background: linear-gradient(90deg, var(--brand), #8b5cf6);
  border: none;
}

.btn-primary:hover, .btn-primary:focus {
  background: linear-gradient(90deg, #7c67ff, #9d6bff);
}

.flash-message {
  word-break: break-word;
  white-space: pre-line;
}

.auth-wrapper {
  max-width: 420px;
  margin: 3rem auto;
}

.auth-wrapper .card {
  padding: 2rem;
}

.otp-input {
  letter-spacing: .6rem;
  text-align: center;
  font-size: 1.4rem;
}

.badge-status-active { background: #16a34a; }
.badge-status-pending { background: #ca8a04; }
.badge-status-failed, .badge-status-expired, .badge-status-disabled, .badge-status-blocked { background: #dc2626; }

.progress { background-color: #21263a; }

.table {
  --bs-table-bg: transparent;
  color: #e6e8ef;
}

.form-control, .form-select {
  background-color: #12141d;
  border-color: var(--border-soft);
  color: #e6e8ef;
}

.form-control:focus, .form-select:focus {
  background-color: #12141d;
  color: #fff;
  border-color: var(--brand);
  box-shadow: 0 0 0 .25rem rgba(111, 91, 246, .25);
}

.form-control::placeholder { color: #5b6072; }

a { text-decoration: none; }

.stat-card {
  border-radius: 1rem;
  padding: 1.25rem 1.5rem;
  background: var(--bg-soft);
  border: 1px solid var(--border-soft);
}

.sidebar {
  min-height: calc(100vh - 56px);
  background: var(--bg-soft);
  border-left: 1px solid var(--border-soft);
}

.sidebar .nav-link {
  color: #c3c7d9;
  border-radius: .6rem;
  margin-bottom: .25rem;
}

.sidebar .nav-link.active, .sidebar .nav-link:hover {
  background: rgba(111, 91, 246, .15);
  color: #fff;
}

code.sub-link {
  display: block;
  word-break: break-all;
  background: #12141d;
  border: 1px solid var(--border-soft);
  border-radius: .5rem;
  padding: .75rem 1rem;
  color: var(--brand-2);
}