/* Custom Color Scheme - Dark Navy Blue & Light Blue Theme */

/* Color Variables */
:root {
  --dark-navy: #1e3a8a;      /* Dark navy blue */
  --light-blue: #dbeafe;     /* Light blue */
  --white: #ffffff;          /* White */
  --gray: #6b7280;           /* Gray */
  --black: #000000;          /* Black */
  --dark-gray: #374151;      /* Dark gray */
  --light-gray: #f3f4f6;     /* Light gray */
  
  /* Logo Colors - Exact colors from logos */
  --peterson-orange: #F7941D;  /* Peterson Funding logo orange */
  --solamere-blue: #21275A;    /* Solamere Mortgage logo dark blue */
}

/* Primary Button Style - Dark Navy Blue with White Text (Solamere Mortgage Logo Blue) */
.btn-primary {
  background-color: var(--solamere-blue) !important;
  color: var(--white) !important;
  border: 2px solid var(--solamere-blue) !important;
}

.btn-primary:hover {
  background-color: #1a1f47 !important; /* Slightly darker for hover */
  border-color: #1a1f47 !important;
  color: var(--white) !important;
}

/* Secondary Button Style - Light Blue with Dark Navy Text */
.btn-secondary {
  background-color: var(--light-blue) !important;
  color: var(--dark-navy) !important;
  border: 2px solid var(--dark-navy) !important;
}

.btn-secondary:hover {
  background-color: #bfdbfe !important;
  color: var(--dark-navy) !important;
  border-color: var(--dark-navy) !important;
}

/* Orange Button Style - Orange with White Text (Peterson Funding Logo Orange) */
.btn-orange {
  background-color: var(--peterson-orange) !important;
  color: var(--white) !important;
  border: 2px solid var(--peterson-orange) !important;
}

.btn-orange:hover {
  background-color: #e0851a !important; /* Slightly darker for hover */
  border-color: #e0851a !important;
  color: var(--white) !important;
}

/* Gradient Primary Override */
.gradient-primary {
  background: linear-gradient(135deg, var(--dark-navy) 0%, #1e40af 100%) !important;
  color: var(--white) !important;
}

.gradient-primary:hover {
  background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 100%) !important;
  color: var(--white) !important;
}

/* Text Colors */
.text-primary {
  color: var(--dark-navy) !important;
}

.text-secondary {
  color: var(--gray) !important;
}

.text-light {
  color: var(--light-blue) !important;
}

/* Background Colors */
.bg-primary {
  background-color: var(--dark-navy) !important;
}

.bg-secondary {
  background-color: var(--light-blue) !important;
}

.bg-light {
  background-color: var(--light-gray) !important;
}

/* Border Colors */
.border-primary {
  border-color: var(--dark-navy) !important;
}

.border-secondary {
  border-color: var(--light-blue) !important;
}

/* Navigation Active States */
.nav-active {
  color: var(--dark-navy) !important;
  border-bottom-color: var(--dark-navy) !important;
}

.nav-hover:hover {
  color: var(--dark-navy) !important;
}

/* Card Styles */
.card-primary {
  background-color: var(--white);
  border: 1px solid var(--light-blue);
  box-shadow: 0 4px 6px -1px rgba(30, 58, 138, 0.1);
}

.card-secondary {
  background-color: var(--light-blue);
  border: 1px solid var(--dark-navy);
  color: var(--dark-navy);
}

/* Form Elements */
.form-input {
  border: 2px solid var(--light-blue);
  background-color: var(--white);
  color: var(--dark-navy);
}

.form-input:focus {
  border-color: var(--dark-navy);
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

/* Rate Cards */
.rate-card {
  background-color: var(--light-blue);
  border: 1px solid var(--dark-navy);
  color: var(--dark-navy);
}

.rate-card:hover {
  background-color: #bfdbfe;
  border-color: var(--dark-navy);
}

/* Footer Override */
.footer-dark {
  background-color: var(--dark-navy) !important;
  color: var(--white) !important;
}

.footer-dark a {
  color: var(--light-blue) !important;
}

.footer-dark a:hover {
  color: var(--white) !important;
}

/* Apple Shadow Override */
.apple-shadow {
  box-shadow: 0 4px 6px -1px rgba(30, 58, 138, 0.1), 0 2px 4px -1px rgba(30, 58, 138, 0.06) !important;
}

.apple-shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(30, 58, 138, 0.1), 0 4px 6px -2px rgba(30, 58, 138, 0.05) !important;
}

/* Responsive Design */
@media (max-width: 768px) {
  .btn-primary,
  .btn-secondary {
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
  }
}

/* Custom Utilities */
.text-navy {
  color: var(--solamere-blue) !important; /* Solamere Mortgage logo dark blue */
}

/* Peterson Funding Orange Text */
.text-logo-orange {
  color: var(--peterson-orange) !important;
}

/* Override Tailwind orange-500 to use logo orange */
.text-orange-500 {
  color: var(--peterson-orange) !important;
}

.bg-navy {
  background-color: var(--dark-navy) !important;
}

.text-light-blue {
  color: var(--light-blue) !important;
}

.bg-light-blue {
  background-color: var(--light-blue) !important;
}

/* Override Tailwind's cyan colors with our custom colors */
.text-cyan-800 {
  color: var(--dark-navy) !important;
}

.bg-cyan-50 {
  background-color: var(--light-blue) !important;
}

.border-cyan-800 {
  border-color: var(--dark-navy) !important;
}

.hover\:text-cyan-800:hover {
  color: var(--dark-navy) !important;
}

.hover\:bg-cyan-50:hover {
  background-color: var(--light-blue) !important;
}

/* Gradient backgrounds */
.bg-gradient-to-br {
  background: linear-gradient(to bottom right, var(--light-blue), #bfdbfe) !important;
}

.from-cyan-50 {
  --tw-gradient-from: var(--light-blue) !important;
}

.to-blue-50 {
  --tw-gradient-to: #bfdbfe !important;
}

/* About Us Stats Box Width Fix */
@media (min-width: 768px) {
  [data-md-width="450px"] {
    width: 450px !important;
    max-width: 450px !important;
  }
}