/* Databee theme — used with Bootstrap 5.3 */
:root {
  --db-primary: #0d1b2a;
  --db-accent: #e8a317;
  --db-surface: #f8f9fc;
}

body {
  background: var(--db-surface);
  min-height: 100vh;
}

.navbar-databee {
  background: linear-gradient(135deg, var(--db-primary) 0%, #1b263b 100%);
  box-shadow: 0 2px 12px rgba(13, 27, 42, 0.15);
}

.navbar-databee .navbar-brand {
  font-weight: 600;
  letter-spacing: 0.02em;
}

.brand-accent {
  color: var(--db-accent);
}

.db-card {
  border: none;
  border-radius: 0.75rem;
  box-shadow: 0 4px 24px rgba(13, 27, 42, 0.08);
}

/* Scroll wide tables horizontally on small screens (do not clip overflow). */
.db-table-wrap {
  border-radius: 0.5rem;
  border: 1px solid #e9ecef;
}

.db-table-wrap.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.db-table-wrap thead th {
  white-space: nowrap;
}

.db-table-wrap td {
  vertical-align: middle;
}

.db-table-wrap .btn-group {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.navbar-tabs-scroll {
  max-width: 100%;
  min-height: 2.5rem;
}

@media (max-width: 991.98px) {
  .navbar-databee .navbar-collapse {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    padding-top: 0.5rem;
  }
}

.badge-flag-0 { background: #6c757d; }
.badge-flag-1 { background: #198754; }
.badge-flag-2 { background: #dc3545; }

.premium-hero {
  background: linear-gradient(120deg, rgba(13, 27, 42, 0.04) 0%, rgba(232, 163, 23, 0.06) 100%);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}

.tab-panel-hidden {
  display: none;
}

.tab-panel-visible {
  display: block;
}

#main-tabs .nav-link {
  color: rgba(255, 255, 255, 0.78);
  border-radius: 0.375rem;
  padding: 0.35rem 0.75rem;
}

#main-tabs .nav-link:hover {
  color: #fff;
}

#main-tabs .nav-link.active {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}