/* PSL - Bootstrap Overwrites */
/* say goodbye to bootstrap build */

/* you should only need to change these variables */
:root {
  --primary: oklch(0.43 0.12 255.97);
  --primary-200: oklch(0.5 0.12 255.97);
  --primary-50: oklch(98.1% 0 0);
  --link-color: var(--primary);
  --footer-link-color: oklch(1 0 0);
}

/* basic bootstrap overrides */
a {
  color: var(--link-color);
  font-weight: 700;

  &:hover {
    color: var(--link-color) !important;
    text-decoration: underline !important;
  }
}

.banner {
  background: #acc854;
  background: linear-gradient(
    106deg,
    rgba(172, 200, 84, 1) 27%,
    rgba(99, 173, 191, 1) 45%,
    rgba(27, 79, 144, 1) 66%
  );
}
.banner .d-flex {
  gap: 4rem;
}

.banner img {
  max-width: 400px;
}
.bg-primary {
  background-color: var(--primary) !important;
}

.text-primary {
  color: var(--primary) !important;
}

.btn-primary,
.psl-prov-info .btn-secondary {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  color: var(--white) !important;
  &:hover {
    background-color: var(--primary-200) !important;
    border-color: var(--primary-200) !important;
    color: var(--white) !important;
    text-decoration: none !important;
  }
}

.btn-outline-primary {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
}

.btn-outline-primary:hover {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  color: var(--white) !important;
}

/* brand specific overrides and additions */
.bg-primary-50 {
  background-color: var(--primary-50) !important;
}

footer a,
header a {
  color: var(--footer-link-color) !important;
  font-weight: 700 !important;
  text-transform: uppercase;

  &:hover {
    color: var(--footer-link-color) !important;
    text-decoration: underline !important;
  }
}

/* STYLES FOR RETURNED DATA */
/* ------------------------------------------------------------ */
/* data header */
.card-header {
  background-color: var(--primary) !important;
  color: var(--white) !important;
}
.card-header a {
  color: var(--primary-50) !important;
  &:hover {
    color: var(--white) !important;
  }
}
/* ------------------------------------------------------------ */
