/* MDM Portal Custom Styles */

body {
  background-color: #f8f9fa;
}

.navbar-brand {
  font-weight: 600;
}

.card {
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  border: none;
}

.card-header {
  background-color: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.table th {
  font-weight: 600;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #6c757d;
}

.btn-group-sm > .btn {
  padding: 0.25rem 0.5rem;
}

/* Dashboard Cards */
.card.bg-primary,
.card.bg-success,
.card.bg-info {
  transition: transform 0.2s ease-in-out;
}

.card.bg-primary:hover,
.card.bg-success:hover,
.card.bg-info:hover {
  transform: translateY(-2px);
}

/* QR Code Container */
#qrContainer img {
  border: 1px solid #dee2e6;
  padding: 1rem;
  background: #fff;
}

/* Empty State */
.text-muted i {
  opacity: 0.5;
}

/* Form Switches */
.form-check-input:checked {
  background-color: #198754;
  border-color: #198754;
}

/* Loading Spinner */
.spinner-border {
  width: 3rem;
  height: 3rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .display-4 {
    font-size: 2rem;
  }

  .btn-group {
    flex-direction: column;
  }

  .btn-group .btn {
    border-radius: 0.375rem !important;
    margin-bottom: 0.25rem;
  }
}

/* Navbar active state */
.nav-link.active {
  font-weight: 600;
}

/* Alert styling */
.alert {
  border: none;
  border-radius: 0.5rem;
}

/* Code styling */
code {
  background-color: #f8f9fa;
  padding: 0.2rem 0.4rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
}