/* Import Poppins font */
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');

/* Root variables */
:root {
    --bs-primary: #223d72;
    --bs-secondary: #60779b;
    --bs-font-sans-serif: 'Poppins', sans-serif;
}

/* Global font */
body {
  font-family: var(--bs-font-sans-serif);
}

/* Utility class overrides */
.bg-primary {
  background-color: var(--bs-primary) !important;
}
.text-primary {
  color: var(--bs-primary) !important;
}
.btn-primary {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.bg-secondary {
  background-color: var(--bs-secondary) !important;
}
.text-secondary {
  color: var(--bs-secondary) !important;
}
.btn-secondary {
  background-color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
}

/* Navbar customization */
.navbar {
    background-color: #ffffff !important; /* Set navbar background to white */
    border-bottom: 5px solid var(--bs-primary); /* Add 5px bottom border in secondary color */
}

    .navbar .navbar-brand,
    .navbar .nav-link {
        color: var(--bs-primary) !important; /* Set text color to primary */
    }

        .navbar .nav-link:hover,
        .navbar .nav-link:focus {
            color: var(--bs-secondary) !important; /* Hover/focus color to secondary */
        }

.navbar-toggler {
    border-color: var(--bs-secondary); /* Toggler border in secondary color */
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%2360779b' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    /* Custom toggler icon in secondary color */
}


.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
   color: #fff;
}
.navbar > .container-fluid,
.navbar > .container-lg,
.navbar > .container-md,
.navbar > .container-sm,
.navbar > .container-xl,
.navbar > .container-xxl {
    justify-content: unset;
}