/* ========== Variables ========== */
:root {
  --bs-primary: #00235b !important;  /* Azul Oscuro */
  --bs-danger: #B22222;  /* Rojo Degradado */
  --bs-light: #D3D3D3;  /* Gris Claro */
  --bs-dark: #2F4F4F;  /* Gris Oscuro */
  --bs-white: #FFFFFF;  /* Blanco */
  --bs-navbar-bg: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-primary) 70%, var(--bs-light) 100%);
  --bs-btn-primary: #00235b !important;
  --bs-btn-primary-hover: #00235b !important;
  --red-dark: #4d101b !important;  /* Rojo Oscuro */
  --bs-light-rgb: 240, 248, 255;  /* AliceBlue */
  --fda-red-light: #bc0d0d !important;  /* Rojo Claro */
  --fda-red-dark: #631624 !important;  /* Rojo Oscuro */
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

#why_choose_us {
  background: linear-gradient(180deg, #fff, #f8f9fa);
}
/* Custom styles for the resource cards */
.resource-card .card-body {
  padding: 2rem; /* Increase padding inside the card */
}

.resource-card {
  min-height: 250px; /* Increase the minimum height of the cards */
}

.resource-card .card-title {
  font-size: 1.5rem; /* Increase the font size of the card titles */
}

.resource-card .card-text {
  font-size: 1.1rem; /* Increase the font size of the card text */
}



/* ========== Banner ========== */
.banner-image {
  filter: blur(2px);
}

.service-banner {
  position: relative;
  overflow: hidden;
  height: 300px;
  width: 90%;
  margin: 0 auto;
}

.service-banner .container {
  position: relative;
  z-index: 2;
}

.service-banner .container h3,
.service-banner .container p {
  color: #000; /* Dark text */
}

/* ========== Buttons ========== */
#button_get_started {
  background-color: var(--fda-red-light) !important;
  border-color: var(--fda-red-light) !important;
}

#button_get_started:hover, #button_get_started:focus, #button_get_started:active {
  background-color: var(--red-dark) !important;
  border-color: var(--red-dark) !important;
  opacity: 0.8;
}

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

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--bs-btn-primary) !important;
  border-color: var(--bs-btn-primary) !important;
}

.btn-outline-primary {
  color: var(--bs-btn-primary);
  border-color: var(--bs-btn-primary) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  color: var(--bs-white) !important;
  background-color: var(--bs-btn-primary) !important;
  border-color: var(--bs-btn-primary) !important;  
}

.custom-btn {
  background-color: var(--fda-red-light) !important;
  color: var(--bs-white) !important;
  border: none;
  padding: 0.2rem 0.75rem;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 0.9rem;
  border-radius: 0.25rem;
}

.custom-btn:hover {
  background-color: var(--red-dark) !important;
  color: var(--bs-white) !important;
}

/* ========== Navbar ========== */
.main-navbar {
  background: linear-gradient(to bottom, var(--bs-btn-primary) 40%, var(--bs-white) 40%);
}

.navbar-brand {
  background-color: var(--bs-btn-primary);
  padding: 0.5rem 1.5rem 0.7rem;
}

.navbar-top {
  font-size: 0.9rem;
  height: 30px !important;
  padding: 0;
}

.navbar-top .nav-link {
  color: var(--bs-white);
}

.navbar-bottom .nav-link {
  color: black !important;
}

.navbar-bottom .nav-link:hover,
.navbar-bottom .nav-link:focus,
.navbar-bottom .nav-link:active {
  color: var(--bs-white) !important;
  background-color: var(--bs-btn-primary) !important;
  border-color: var(--bs-btn-primary) !important;
}

.navbar-top-gradient {
  background: var(--bs-navbar-bg) !important;
  background-size: cover;
}

/* ========== Miscellaneous ========== */
body {
  overflow-y: scroll; /* always show scrolling y */
}

.contact {
  background-color: rgba(248,249,250) !important;
}

.resources i {
  font-size: 2.5rem;
  color: var(--bs-btn-primary);
}

.services i {
  color: var(--bs-btn-primary);
}

.custom-divider {
  height: 2px;
  background-color: var(--bs-primary);
  margin: 2rem 0;
}

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

.form-group {
  position: relative;
}

.invalid-feedback {
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  display: none;
}

.was-validated .form-control:invalid ~ .invalid-feedback,
.was-validated .form-check-input:invalid ~ .invalid-feedback {
  display: block;
}

.was-validated .form-control:valid ~ .invalid-feedback,
.was-validated .form-check-input:valid ~ .invalid-feedback {
  display: none;
}