:root {
  --brand-primary: #6f42c1;
  --brand-primary-dark: #5a32a3;
  --brand-success: #198754;
  --brand-bg: #f7f6fb;
}

html, body {
  overflow-x: hidden;
  max-width: 100%;
}

body {
  font-family: 'Noto Sans Devanagari', 'Segoe UI', sans-serif;
  background-color: var(--brand-bg);
}

@media (max-width: 767.98px) {
  body.has-sticky-cta { padding-bottom: 70px; }
}

.navbar.bg-primary {
  background-color: var(--brand-primary) !important;
}
.navbar.bg-primary .navbar-brand,
.navbar.bg-primary .nav-link {
  color: #e9ecef !important;
}
.navbar.bg-primary .navbar-brand:hover,
.navbar.bg-primary .nav-link:hover,
.navbar.bg-primary .nav-link:focus,
.navbar.bg-primary .nav-link.active {
  color: #ffffff !important;
}
.navbar.bg-primary .navbar-toggler {
  border-color: rgba(255, 255, 255, 0.5);
}
.navbar.bg-primary .navbar-toggler-icon {
  filter: invert(1) grayscale(100%) brightness(200%);
}

/* Footer */
footer.bg-dark a.footer-link { transition: color .15s ease; }
footer.bg-dark a.footer-link:hover,
footer.bg-dark a.footer-link:focus {
  color: var(--bs-warning) !important;
  text-decoration: underline !important;
}
footer.bg-dark hr.border-secondary { opacity: .35; }

/* Campaign list rows: prevent title overflow */
.campaign-row strong.text-truncate {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.campaign-row .flex-grow-1 { min-width: 0; }

/* Cards in main content always fill their column */
main .card { width: 100%; }
main .col-lg-7 > .card,
main .col-lg-5 > .card { width: 100%; }

.btn-primary {
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--brand-primary-dark);
  border-color: var(--brand-primary-dark);
}

.stat-card {
  border: none;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  transition: transform .15s ease;
}
.stat-card:hover { transform: translateY(-3px); }

.stat-card .stat-icon {
  width: 52px; height: 52px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
}

.campaign-card { border-radius: 14px; overflow: hidden; border: none; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.campaign-card img { height: 180px; object-fit: cover; width: 100%; }

.qr-box {
  border: 3px dashed var(--brand-primary);
  border-radius: 16px;
  padding: 1.25rem;
  background: #fff;
  text-align: center;
}
.qr-box img { max-width: 260px; width: 100%; border-radius: 8px; }

.status-badge-pending { background: #ffc107; color: #212529; }
.status-badge-approved { background: #198754; }
.status-badge-rejected { background: #dc3545; }

.table-responsive { border-radius: 10px; overflow: hidden; }

.sidebar {
  min-height: calc(100vh - 56px);
  background: #212529;
}
.sidebar .nav-link { color: #adb5bd; padding: .65rem 1rem; border-radius: 8px; margin: 2px 8px; }
.sidebar .nav-link.active, .sidebar .nav-link:hover { background: var(--brand-primary); color: #fff; }

@media (max-width: 767.98px) {
  .navbar-nav { padding-top: .5rem; }
  .stat-card { margin-bottom: 1rem; }
}

.toast-container { z-index: 1080; }

/* Sticky bottom CTA bar — mobile only (<768px) */
.sticky-bottom-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1070;
  background: #ffffff;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
  padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom)) .75rem;
}
.sticky-bottom-cta .btn {
  font-size: .9rem;
  padding: .4rem .75rem;
}

/* ============== Mobile-friendly admin tables ============== */
/* On phones, table cells have generous padding that overflows narrow screens.
   These tweaks keep the responsive cards list clean. */
@media (max-width: 767.98px) {
  .d-md-none .card-body { padding: .9rem; }
  .d-md-none .badge { font-size: .75rem; padding: .35em .55em; }
  .d-md-none .btn { font-size: .875rem; }

  /* Modal: keep inside the viewport on small screens */
  .modal-dialog { margin: .5rem; max-width: calc(100% - 1rem); }
  .modal-content { border-radius: 12px; }
}
