/* Custom Theme for Vạn An Admin */
/* Override primary color to match Vạn An branding */

:root,
[data-bs-theme=light] {
  /* Primary color - Golden yellow to match Vạn An logo */
  --bs-primary: #d4af37;
  --bs-primary-rgb: 212, 175, 55;
  --bs-primary-text-emphasis: #5a4a16;
  --bs-primary-bg-subtle: #f9f4e6;
  --bs-primary-border-subtle: #e8d478;
}

[data-bs-theme=dark] {
  /* Primary color for dark theme */
  --bs-primary: #d4af37;
  --bs-primary-rgb: 212, 175, 55;
  --bs-primary-text-emphasis: #f0d866;
  --bs-primary-bg-subtle: #4a3f1a;
  --bs-primary-border-subtle: #8a7530;
}

/* Apex charts dark variant */
.apexcharts-theme-dark {
  --bs-primary: #d4af37;
}

/* Custom styles for logo */
.app-brand-logo img {
  max-height: 40px;
  width: auto;
  object-fit: contain;
}

/* Sidebar brand styling */
.menu .app-brand.demo {
  padding: 0.75rem 1.5rem;
}

/* Login page logo styling */
.authentication-wrapper .app-brand-logo img {
  max-height: 60px;
  width: auto;
}

/* Ensure text color works well with golden primary */
.text-primary {
  color: var(--bs-primary) !important;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}

.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.btn-primary:hover {
  background-color: #b8941f;
  border-color: #b8941f;
}

.btn-primary:focus, .btn-primary.focus {
  box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25);
}

/* Badge primary styling */
.badge.bg-primary {
  background-color: var(--bs-primary) !important;
}

/* Link primary color */
.link-primary {
  color: var(--bs-primary) !important;
}

.link-primary:hover, .link-primary:focus {
  color: #b8941f !important;
}

/* Form control focus */
.form-control:focus {
  border-color: rgba(212, 175, 55, 0.5);
  box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25);
}

/* Navigation active states */
.nav-pills .nav-link.active {
  background-color: var(--bs-primary);
}

/* Progress bar */
.progress-bar {
  background-color: var(--bs-primary);
}

/* Alert primary */
.alert-primary {
  color: var(--bs-primary-text-emphasis);
  background-color: var(--bs-primary-bg-subtle);
  border-color: var(--bs-primary-border-subtle);
}