:root {
  /* Ensure CSS variables are available */
  --ae-gold-50: #F9F7ED;
  --ae-gold-100: #F0E6CC;
  --ae-gold-200: #E1CE99;
  --ae-gold-300: #CFB566;
  --ae-gold-400: #BE9D33;
  --ae-gold-500: #B68A35;
  --ae-gold-600: #92722A;
  --ae-gold-700: #735B22;
  --ae-gold-800: #574419;
  --ae-gold-900: #3C2E11;
  --ae-gold-950: #361E12;
}

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 0;
  background-color: #f8f9fa;
}

/* Form styling fixes */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--ae-gold-400);
}

.form-floating > .form-control-plaintext::placeholder, 
.form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
}

.form-floating > .form-control-plaintext:focus::placeholder, 
.form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* Ajman Gold Button Styles */
.btn-ajman {
  background-color: var(--ae-gold-600);
  border-color: var(--ae-gold-600);
  color: white;
}

.btn-ajman:hover {
  background-color: var(--ae-gold-700);
  border-color: var(--ae-gold-700);
  color: white;
}

.btn-outline-ajman {
  border-color: var(--ae-gold-600);
  color: var(--ae-gold-700);
}

.btn-outline-ajman:hover {
  background-color: var(--ae-gold-600);
  border-color: var(--ae-gold-600);
  color: white;
}

/* Navbar fixes */
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.9);
  padding: 0.5rem 1rem;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 0.25rem;
}

.navbar-dark .navbar-toggler {
  border-color: rgba(255, 255, 255, 0.3);
}

/* Card improvements */
.card {
  border-radius: 0.5rem;
}

.card-header {
  border-radius: 0.5rem 0.5rem 0 0 !important;
}

/* Login/Register specific styles */
.login-card {
  max-width: 400px;
  margin: 0 auto;
}

.login-card .card-header {
  background: linear-gradient(135deg, var(--ae-gold-700) 0%, var(--ae-gold-600) 100%);
  color: white;
}

/* Footer positioning */
.gov-footer {
  margin-top: auto;
}

/* Text color utilities */
.text-ajman-gold {
  color: var(--ae-gold-600) !important;
}

.bg-ajman-gold {
  background-color: var(--ae-gold-600) !important;
}

/* Ensure main content takes available space */
.main-content {
  flex: 1 0 auto;
}

/* Fix for Bootstrap form-floating alignment */
.form-floating > label {
  text-align: left;
}

/* Alert customizations */
.alert {
  border-radius: 0.5rem;
}

/* Badge customizations */
.badge {
  font-weight: 500;
}

/* Table improvements */
.table th {
  font-weight: 600;
  border-top: none;
}

/* Progress bar customizations */
.progress {
  border-radius: 0.5rem;
  background-color: var(--ae-black-200);
}

/* Dropdown menu improvements */
.dropdown-menu {
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  border: 1px solid var(--ae-black-200);
}

.dropdown-item:hover {
  background-color: var(--ae-gold-50);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .gov-logo h5 {
    font-size: 1rem;
  }
  
  .header-actions {
    gap: 0.5rem;
  }
}
