/* @import url('https://stackpath.bootstrapcdn.com/font-awesome/6.1.1/css/font-awesome.min.css'); */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css');
@import url('./alerts.css');
@import url('./badges.css');
@import url('./borders.css');
@import url('./box-shadow.css');
@import url('./buttons.css');
@import url('./calendar.css');
@import url('./cards.css');
@import url('./colours.css');
@import url('./form.css');
@import url('./governance.css');
@import url('./headers.css');
@import url('./icons.css');
@import url('./layout.css');
@import url('./list-group.css');
@import url('./nav.css');
@import url('./tables.css');

:root {
  --black: #162319;
  --white: #ffffff;
  --neutral-lightest: #f3f3f3;
  --neutral-light: #e2e5eb;
  --neutral: #d1d5db;
  --neutral-dark: #5e656c;
  --green: #00C670;
  --green-light: #ccf4e2;
  --green-lightest: #e7f1ec;
  --blue: #00ccf7;
  --blue-light: #eef6fc;
  --gray-light: #f3f3f3;
  --sea-blue: #0078ce;
  --deep-sea-blue: #00588f;
  --ocean-floor: #3a4c52;
  --error-red: #ef2840;
  --error-red-light: #ffeaed;
  --gray: #666666;
  --gray-light: #999999;
  --warning: #efc128;
  --warning-light: #fffaea;
}

* {
  transition: color 300ms ease-in-out, background-color 300ms ease-in-out, border-color 300ms ease-in-out;
}

hr {
  color: var(--neutral)
}

/* paragraphs */

.text-primary,
.text-secondary {
  color: var(--black) !important;
}

.text-1 {
  font-size: 1.25rem;
  line-height: 1.5;
}

.text-2 {
  font-size: 1.125rem;
  line-height: 1.5;
}

.text-3 {
  font-size: 1rem;
  line-height: 1.5;
}

.text-4 {
  font-size: 0.875rem;
  line-height: 1.5;
}

.text-5 {
  font-size: 0.75rem !important;
  line-height: 1.5;
}

.a-primary {
  color: var(--black);
  font-weight: 700;
  text-underline-offset: 0.25rem;
  text-decoration: underline var(--green);
}

.a-primary:hover {
  text-decoration: underline var(--black);
  color: var(--black);
}

.a-navigation {
  /* color: var(--black); */
  color: var(--gray-light);
  font-weight: 700;
  text-underline-offset: 0.25rem;
  text-decoration: none;
  margin: 8px 0;
}

.a-navigation:hover {
  text-decoration: underline var(--black);
  color: var(--black);
}

.a-navigation.is-active {
  color: var(--black);
  text-decoration: none;
}

a {
  color: var(--sea-blue);
  font-weight: 700;
  text-underline-offset: 0.25rem;
  text-decoration: underline var(--sea-blue);
}

a:hover {
  text-decoration: underline var(--deep-sea-blue);
  color: var(--sea-blue);
}

.btn-primary {
  background-color: var(--black) !important;
  border-color: #cccccc !important;
  color: var(--white) !important;
}

.btn-nav {
  background-color: var(--white) !important;
  border-color: #cccccc !important;
  color: var(--black) !important;
}

.btn-nav:hover,
.btn-nav:focus,
.btn-nav:active {
  background-color: var(--black) !important;
  color: var(--white) !important;
}

.btn-outline-secondary {
  background-color: var(--white) !important;
  border-color: #cccccc !important;
  color: var(--black) !important;
}

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

.border-primary {
  border-color: #cccccc !important;
}

.highlight:hover,
.highlight:focus,
.highlight:active {
  cursor: pointer !important;
  color: #295be7 !important;
}

.manager-hero {
  border-radius: 1rem;
  width: 100%;
  max-height: 6.1875rem;
}

.manager-hero-icon {
  max-width: 29.875rem;
  width: 75%;
  height: auto;
}

.manager-header {
  margin-bottom: 2.5rem;
}

.manager-header div h3 {
  margin-bottom: 0.75rem;
}

.manager-dropdown-btn {
  max-width: 187px;
  max-height: 40px;
  width: 100%;
  height: 100%;
}

.manager-dropdown-btn-mobile {
  max-width: 173px;
  max-height: 33px;
  width: 100%;
  height: 100%;
}

.manager-dropdown-btn:hover,
.manager-dropdown-btn:focus {
  border-color: var(--black) !important;
}

.breadcrumbs {
  /*  */
}

.manager-header>div>.manager-title {
  margin-bottom: 0.75rem;
}

.manager-card,
.pharmacy-card {
  text-align: left;
  border-radius: 0.5rem;
  border: 1px solid var(--neutral);
  background-color: var(--white);
}

.manager-card-body,
.pharmacy-card-body {
  padding: 1.5rem;
  border-radius: 0.4rem;
}

/*******************/
  /* Styles Index */
  
  /* body */
  /* links */
  /* paragraphs */
  /* spacers */
  /* breakpoints */
  /* dropdowns */
  /* font weights */
  /* list groups */

/*******************/

/* body */

body {
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  color: var(--black);
  background-color: var(--white) !important;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}


/* links */

.custom-link {
  color: #5E646C;
  /* text-decoration: none; */
}

.custom-link:hover {
  color: #00C670;
  /* text-decoration: none; */
}

/* Spacers */

.spacer-S {
  height: .75rem; 
}

.spacer-M {
  height: 1rem;
}

.space-L {
  height: 1.5rem;
}

.spacer-XL {
  height: 2rem;
}

.spacer-XXL {
  height: 3rem;
}

.spacer-XXXL {
  height: 5rem;
}

/*  breakpoints */

/* large devices */
@media (max-width: 992px) {}

/* medium devices */
@media (max-width: 768px) {}

/* small devices */
@media (max-width: 576px) {}

/* x-large devices */
@media (max-width: 1200px) {

  .custom-nav-item {
    max-width: 70%;
  }

}

/* dropdowns */

.btn-dropdown {
  border-radius: 0.25rem;
  border: 1px solid var(--neutral);
  padding: 0.375rem;
  color: var(--black);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.99;
  outline: none;
  box-shadow: none;
}

.btn-dropdown:hover,
.btn-dropdown:focus,
.btn-dropdown:active {
  color: var(--black);
  border-color: var(--black);
}

.btn-dropdown.no-focus:focus {
  border-color: var(--neutral) !important;
  color: var(--black) !important;
  box-shadow: none !important;
}

.dropdown-menu {
  max-width: 131px;
  padding: 0 0;
}

.dropdown-menu>li:first-child>.dropdown-item {
  border-top-left-radius: 0.2rem;
  border-top-right-radius: 0.2rem;
}

.dropdown-menu>li:last-child>.dropdown-item {
  border-bottom-left-radius: 0.2rem;
  border-bottom-right-radius: 0.2rem;
}

.dropdown-item {
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--gray);
  padding: 0.5rem 0.375rem;
  font-weight: 600;
  cursor: pointer;
}

.dropdown-item:hover {
  color: var(--gray);
  background-color: var(--neutral-lightest);
  text-decoration: none;
}

/* font weights */

.fw-semibold {
  font-weight: 600;
}

/* custom */

.border-left-md-top {
  border-top: 1px solid var(--neutral);
}

@media (min-width: 768px) {
  .border-left-md-top {
    border-top: none;
    border-left: 1px solid var(--neutral);
  }
}