/*!
Theme Name: Engage School of Education
Description: Child theme for Engage Theme
Author: Noodle
Template: Engage
*/

:root {
  /*===========*/
  /* VARIABLES */
  /*===========*/
  --blue-100: #6995dd;
  --blue-200: #004fa2;
  --blue-300: #182449;
  --purple-100: #3c208c;
  --gray-100: #f1f1f5;
  --gray-200: #edeff3;
  --red-200: #e0263c;
  --white: #fff;
  --black: #000;
  --lato: "Lato", Helvetica, Arial, sans-serif;
  --au-gradient: linear-gradient(97deg, #e0263c 3.5%, #3c208c 92.27%);
}

/*=======*/
/* RESET */
/*=======*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1.5;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

strong {
  font-weight: 600;
}

/*======*/
/* BASE */
/*======*/
html {
  /* Temp: Remove when published */
  margin: 0 !important;
}

*:is(:hover, :focus) {
  transition: ease-out 0.2s;
}

#wpadminbar {
  /* Temp: Remove when published */
  display: none !important;
}

body {
  font-family: var(--lato);
  font-size: 16px;
  padding: 0 !important;
}

/*============*/
/* TYPOGRAPHY */
/*============*/
/*---------*/
/* Heading */
/*---------*/
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--lato);
  font-weight: 800 !important;
  text-wrap: balance;
  color: inherit;
  margin: 0 0 1.5rem;
}

h1 {
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  line-height: 1.1;
  margin-bottom: 2rem;
}

h2 {
  font-size: clamp(2.25rem, 5vw, 2.5rem);
  line-height: 1.2;
  margin: 0 0 2rem !important;
}

h3 {
  font-size: clamp(1.875rem, 5vw, 2rem);
  line-height: 1.2;
  margin-bottom: 1.125rem;
}

h4 {
  font-size: 1.5rem;
  line-height: 1.4;
  margin-bottom: 1rem;
}

h5 {
  font-size: clamp(1.125rem, 5vw, 1.5rem);
  line-height: 1.5;
}

h6 {
  font-size: clamp(1rem, 5vw, 1.125rem);
  line-height: 1.5;
}

/* Superscript */
h1 > sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

h2 > sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

h3 > sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

h4 > sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

h5 > sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

h6 > sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

p sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

sup {
  font-size: 0.5em !important;
  vertical-align: super !important;
}

.text-sm sup {
  font-size: 0.875em !important;
  vertical-align: super !important;
}

.kicker {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  text-wrap: balance !important;
  margin-bottom: 0 !important;
}

.subtext {
  font-size: clamp(1.25rem, 5vw, 1.5rem) !important;
  font-weight: 700 !important;
}

.lato {
  font-family: var(--lato);
}

p {
  color: inherit;
  text-wrap: pretty;
  margin: 0 0 20px;
}

em {
  font-style: italic;
}

strong {
  font-weight: 600;
}

a:is(:link, :visited):not(.nav-link, .dropdown-item, .btn) {
  color: var(--blue-200, #004fa2);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

a:is(:hover, :focus):not(.nav-link, .dropdown-item, .btn) {
  color: var(--blue-300, #182449);
}

a:has(img) {
  line-height: 0;
}

header a[target="_blank"]:not(.share-link, .btn)::after,
main a[target="_blank"]:not(.share-link, .btn)::after,
footer a[target="_blank"]:not(.share-link, .btn)::after {
  content: "\f08e";
  display: inline-block;
  font-family: var(--fa-version);
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: none !important;
  margin-left: 3px;
  margin-right: 3px;
  vertical-align: middle;
  text-wrap: balance;
}

.has-theme-light-color,
.text-light,
.text-mb-light {
  color: var(--white) !important;
}
.has-theme-light-color a:is(:link, :visited),
.text-light a:is(:link, :visited),
.text-mb-light a:is(:link, :visited) {
  color: inherit;
  text-decoration-color: inherit;
}
.has-theme-light-color a:is(:hover, :focus),
.text-light a:is(:hover, :focus),
.text-mb-light a:is(:hover, :focus) {
  color: var(--gray-200);
  text-decoration-color: var(--gray-200);
}

.text-dark,
.has-theme-dark-color {
  color: var(--black) !important;
}

@media (max-width: 991px) {
  .text-mb-light {
    color: var(--white) !important;
  }
  .text-mb-dark {
    color: var(--black) !important;
  }
}
/*----------------*/
/* Text Alignment */
/*----------------*/
@media (max-width: 600px) {
  .text-xs-center {
    text-align: center;
  }
}
@media (max-width: 991px) {
  .text-mb-center {
    text-align: center;
  }
}
/*-----------*/
/* Text Size */
/*-----------*/
.text-xxlg,
.text-xlg,
.text-lg {
  line-height: 1.5;
}

.text-md,
.text-reg,
.text-sm,
.text-xs {
  margin-bottom: 1.5rem;
  line-height: 1.5;
}

.text-xxlg {
  font-size: 2rem !important;
}

.text-xlg {
  font-size: 1.75rem !important;
}

.text-lg {
  font-size: 1.5rem !important;
}

.text-md {
  font-size: 1.25rem !important;
}

.text-reg {
  font-size: 1rem !important;
}

.text-sm {
  font-size: 0.75rem !important;
}

.text-xs {
  font-size: 0.5rem !important;
}

@media (max-width: 991px) {
  .text-mb-sm {
    font-size: 1.75rem;
  }
}
/*-------------*/
/* Font Weight */
/*-------------*/
.fw-100 {
  font-weight: 100 !important;
}

.fw-200 {
  font-weight: 200 !important;
}

.fw-300 {
  font-weight: 300 !important;
}

.fw-400 {
  font-weight: 400 !important;
}

.fw-500 {
  font-weight: 500 !important;
}

.fw-600 {
  font-weight: 600 !important;
}

.fw-700 {
  font-weight: 700 !important;
}

.fw-800 {
  font-weight: 800 !important;
}

.fw-900 {
  font-weight: 900 !important;
}

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Lato", Helvetica, Arial, sans-serif;
  padding: 0 !important;
}

/* Bootstrap Container */
@media (min-width: 1400px) {
  .container-fluid {
    max-width: 1320px !important;
  }
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  font-weight: 900;
  margin-bottom: 1.5rem;
}

p {
  font-weight: normal;
}

/* Font Size */
.fs-xlg {
  font-size: clamp(2.5rem, 4vw, 5rem) !important;
}

.fs-lg {
  font-size: clamp(2.5rem, 4vw, 4rem) !important;
}

.fs-1 {
  font-size: clamp(2.5rem, 4vw, 3rem) !important;
}

.fs-2 {
  font-size: clamp(2rem, 4vw, 2.875rem) !important;
}

.fs-3 {
  font-size: clamp(1.875rem, 4vw, 2.5rem) !important;
}

.fs-4 {
  font-size: clamp(1.5rem, 4vw, 1.75rem) !important;
}

.fs-5 {
  font-size: 1.25rem !important;
}

.fs-6 {
  font-size: 1rem !important;
}

.fs-7 {
  font-size: 0.875rem !important;
}

ol,
ul {
  list-style: initial;
  padding-inline-start: 2rem;
}

/*--------------*/
/* Font Awesome */
/*--------------*/
.fa,
.far,
.fas {
  padding: 4px;
  /* Add padding around icon */
}

label {
  font-size: 0.75rem !important;
  font-weight: normal !important;
}

.sticky-content nav li {
  font-weight: bold;
  margin: 0;
}

/* Form */
.plato .f_text,
.plato .f_select,
.plato .f_textarea {
  padding: 0.75rem 1rem;
}

.button-olive-green {
  border-radius: 5px;
}

.color-dark-green {
  background-color: #324347;
}

.color-dark-green-light {
  background-color: #406b72;
}

.color-grey {
  background-color: #6e7878;
}

.border-bottom-light-grey {
  border-bottom: 1px solid #e3e3e4;
}

.w-20 {
  width: 20%;
}

/* For Colored green grid cards */
.cards-grid-layout {
  display: flex;
  flex-wrap: wrap;
  justify-items: center;
  justify-content: center;
}

.card {
  color: white;
  text-align: center;
  border-radius: 0px;
  flex: 0 0 30%;
  margin: 10px;
}

.card-title {
  font-size: 1.25rem;
  margin-top: 1.5rem;
  font-weight: bold;
}

.card-body {
  padding: 10px;
  align-items: center;
  justify-content: center;
}

.card-text {
  font-size: 18px;
  margin-top: 1.5rem;
}

/* For Colored green grid cards - finish */

.btn,
.f_button,
.cta-btns .button-primary {
  padding: 10px 16px;
  text-decoration: none !important;
}

a.nav-link.dropdown-toggle,
.nav-bar-item {
  color: #003670 !important;
  font-weight: 700;
  text-decoration: none;
}

.dropdown-item:link,
.dropdown-item:visited {
  color: #003670;
}

.m-0-auto {
  margin: 0 auto;
}

.center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.menu-item:hover,
.dropdown-item:hover,
.nav-link:hover,
.nav-bar-item:hover,
.no-decoration > a,
.no-decoration:hover > a {
  text-decoration: none;
}

.dropdown-toggle.dropdown-item::after {
  transform: rotate(270deg);
}

.btn-accordion {
  background-color: #e3e3e4;
  border-bottom: none;
  display: flex;
  align-items: center;
  padding: 15px 45px 15px 15px;
}

.btn-accordion.collapsed {
  border: 1px solid #ddd;
}

[class*="text-light"] a:is(:link, :visited) {
  color: inherit;
  text-decoration-color: inherit;
}

[class*="text-light"] a:is(:hover, :focus) {
  color: #8a95a5;
  text-decoration-color: #8a95a5;
}

/*=====================*/
/* Components / Blocks */
/*=====================*/
/* Collapsible Content Block */
/*---------------------------*/
.block-collapse .card-body {
  background-color: #fff;
  border: 1px solid #ddd;
  border-top: none;
}

.block-collapse .card-body p {
  color: #232323;
}

.block-collapse .card-body a:is(:link, :visited) {
  color: #232323;
  text-decoration: underline;
}

.block-collapse .card-body a:is(:hover, :focus) {
  color: #0a58ca;
}

/*-------------*/
/* CTA Builder */
/*-------------*/
.cta-banner-link {
  text-decoration: none !important;
}

/*----------------------------*/
/* Half Hero Section (Legacy) */
/*----------------------------*/
.half-hero__bg {
  height: 100%;
  position: absolute;
  width: calc(50% - 25px);
}

@media (max-width: 992px) {
  .half-hero__bg {
    position: static;
    width: 100%;
    height: 265px;
  }

  .half-hero__banner {
    display: flex;
    flex-direction: column;
  }
}
/* End Components / Blocks */

.partners-collapse,
.mt-32 {
  margin-top: 32px;
}

.bc-light-blue-sticky-nav {
  background-color: #f2f6fa;
}

.bc-gray-translucent {
  background-color: #e3e3e466;
}

[class*="bc-dark"],
[class*="bc-dark"] a:is(:link, :visited) {
  color: #fff;
}

[class*="bc-dark"] a:is(:hover, :focus) {
  color: #8a95a5;
}

.bc-dark-blue-translucent {
  background-color: #0f2846cc;
  color: #fff;
  width: 100%;
}

.bc-dark-blue {
  background-color: #0f2846;
}

.bc-dark-blue-opacity-nine {
  background-color: #0f2846;
  opacity: 0.9;
}

.bc-dark-blue-opacity-eight {
  background-color: #0f2846;
  opacity: 0.8;
}

.bc-dark-blue-opacity-seven {
  background-color: #0f2846;
  opacity: 0.7;
}

.bc-light-grey {
  background-color: #e3e3e4;
}

.mt-18 {
  margin-top: 18px;
}

.mb-32 {
  margin-bottom: 32px;
}

.mb-16 {
  margin-bottom: 16px;
}

.text-align-center {
  text-align: center;
}

.pt-0 {
  padding-top: 0;
}

.h-101 {
  height: 101px;
}

.faculty-container-mobile {
  width: 100%;
}

.tuition-overview-nav,
.admissions-overview-nav,
.online-edd-education-policy-leadership-nav {
  position: sticky;
  top: calc(var(--stickyoffset) - 0px);
  z-index: 20;
  color: #003670;
  border-top: 1px solid #003670;
  border-bottom: 1px solid #003670;
}

@media (max-width: 992px) {
  .tuition-overview-nav,
  .admissions-overview-nav,
  .online-edd-education-policy-leadership-nav {
    top: calc(var(--stickyoffset) - 52px);
  }
}

.wp-block-navigation__container {
  justify-content: space-between;
}

.sticky-bottom {
  position: sticky;
  /* bottom: calc(var(--stickyoffset) - 125px); */
}

.tuition-overview-nav-container,
.admissions-overview-nav-container,
.online-edd-education-policy-leadership-nav-container {
  padding: 25px;
}

.table-tuition-financial-overview-header {
  background-color: #063670;
  color: white;
  border: 2px solid #f2f6fa;
}

.table-tuition-financial-overview-cells {
  background-color: #c3cfde;
  color: #232323;
  border: 2px solid #f2f6fa;
}

.table-deadlines-admissions-overview-header {
  background-color: #324347;
  color: white;
  border: 1px solid #afafb2;
  font-size: 24px;
}

.table-deadlines-admissions-overview-cells {
  background-color: #e3e3e4;
  color: #232323;
  border: 1px solid #afafb2;
  font-size: 24px;
}

.deadlines-admissions-overview-tab {
  background-color: transparent;
  border: 0;
  color: #232323;
  font-weight: 700;
  padding: 8px;
  font-size: 24px;
}

.deadlines-admissions-overview-tab.active {
  background-color: transparent !important;
  /* !Important added to override default styles */
  color: #406b72 !important;
  border-bottom: 3px solid #406b72 !important;
  border: 0;
  font-weight: 700;
  padding: 8px;
}

.button-olive-green-center {
  position: relative;
  top: -1.2rem;
}

.learn-more-white-btn {
  border-bottom: 1px solid #000;
  padding: 10px 0;
}

.learn-more-white-btn:is(:hover, :focus) {
  color: #e81333;
  border-color: #e81333;
}

.learn-more-white-btn::after {
  content: "\27F6";
  position: relative;
  top: -1px;
  left: 8px;
}

.button-olive-green-middle-bottom {
  padding: 4px 45px;
}

.card-with-hover {
  position: relative;
  width: 20rem;
  height: 15rem;
  background-color: #324347;
  color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.card-with-hover h1 {
  font-size: 1.39rem;
  margin: 0;
}

.card-with-hover-content {
  background-color: #324347;
  color: #fff;
  position: absolute;
  padding: 2rem;
  z-index: 1;
  opacity: 0;
  transition: all 0.4s ease 0s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-with-hover:hover .card-with-hover-content {
  opacity: 1;
}

.btn-accordion.collapsed {
  background-color: #e3e3e4;
  color: #232323;
  border: 1px solid #ddd;
  margin: 0 !important;
}

.collapse-item {
  margin-bottom: 1rem;
}

.collapse-item .collapse .card-body {
  background-color: #fff !important;
  color: #232323;
}

.grouped-images-images {
  position: relative;
}

@media screen and (min-width: 800px) {
  .grouped-images-images {
    flex-basis: 33.33333333%;
  }

  .grouped-image-wrapper:first-of-type {
    height: 230px;
    width: 230px;
  }

  .grouped-image-wrapper:nth-of-type(2) {
    bottom: -5rem;
    height: 215px;
    margin: auto;
    position: absolute;
    right: 2rem;
    width: 215px;
  }
}

@media screen and (min-width: 1000px) {
  .grouped-image-wrapper:nth-of-type(2) {
    bottom: -3rem;
    height: 215px;
    margin: auto;
    position: absolute;
    right: -6rem;
    width: 215px;
  }
}

.r-block-faculty .img-top,
.img-top,
.btn-r-action {
  filter: grayscale(100%);
  transition: all 0.2s linear;
  color: #ffffff;
}

.r-block-faculty .img-top:hover,
.img-top:hover {
  filter: grayscale(0%);
}

.r-block-faculty .img-top img,
.img-top img {
  border-radius: 50%;
  height: 14rem;
  width: 14rem;
}

.r-block-faculty .result-list .img-top {
  gap: 1rem;
  text-align: center;
}

.footer-links > p > a {
  text-decoration: none;
}

.flex {
  display: flex;
}

/* Footer Form (green one) */
.field-box {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.field-box > div {
  width: 49%;
}

.field-box > div.submit,
.field-box > div.disclaimer {
  width: 100%;
  margin-top: 1.5rem;
}

.field-box > div.submit > input {
  background-color: #003670;
  color: white;
  padding: 10px 60px;
  border-radius: 5px;
}

.field-box > div.field > label {
  color: white !important;
  width: 100% !important;
  font-size: 1rem;
  margin-left: 0px !important;
  padding-bottom: 5px;
}

.field-box > div.field > input,
.field-box > div.field > select {
  color: black;
}

.footer-img-col > div {
  top: -50%;
  position: relative;
}

/* Header Form (blue one) */
.blue-header-form {
  padding: 0px;
}

.blue-header-form .field {
  width: 100%;
}

/* Modal Form */
.modal-body .modal-form-content .form-container .field-box .field label {
  color: #232323 !important;
}

.modal-body .modal-form-content .form-container .field-box > div.submit > input,
.form-step .field-box .disclaimer {
  color: inherit;
}

.modal-body .modal-form-content .form-container .field-box > div.submit {
  color: #fff;
}

.modal-body .modal-form-content .form-container .field-box > div {
  width: 98%;
}

.modal-body .form-wrapper {
  padding: 10px;
}

.r-archive-blog .result-list .img-top img {
  border-radius: 0px;
  width: 100%;
  height: 100%;
}

.r-archive-blog .result-list .img-top img:hover {
  cursor: pointer;
}

.r-archive-blog .result-list .img-top .r-hero {
  height: 15rem;
}

.r-archive-blog .result-list .img-top {
  gap: 0px;
  filter: grayscale(0%);
  border: 1px solid rgba(35, 35, 35, 0.1);
  box-shadow: 0 2px 4px 0 rgb(35 35 35 / 10%);
}

.r-content > ul > li > a,
.r-content > p > a {
  color: white;
}

.r-archive-blog .result-list .img-top .r-content-block {
  color: #232323;
  padding: 15px;
}

.r-archive-blog .result-list .img-top .r-content-block .r-excerpt {
  font-size: 18px;
}

.r-archive-blog .result-list .img-top .r-content-block .r-meta {
  font-size: 0.75rem;
  order: 2;
}

.r-archive-blog .result-list .img-top .r-content-block .r-headline h3 a {
  text-decoration: none;
  font-size: 1.25rem;
  color: #232323;
}

.r-archive-blog .result-list .img-top .r-content-block .r-headline h3 a:hover {
  text-decoration: underline;
}

.r-archive-blog .result-list .img-top:hover {
  cursor: pointer;
}

.r-pagination .container {
  padding-bottom: 0px;
  margin-top: 100px;
  margin-bottom: 100px;
}

.r-pagination .pagination {
  justify-content: start;
}

.r-pagination .pagination .page-numbers.current {
  background-color: #232323;
  font-size: 0.75rem;
  color: white;
}

.r-pagination .pagination .page-numbers.btn-secondary,
.r-pagination .pagination .dots,
.r-pagination .pagination .page-numbers.next {
  background-color: #f5f5f5;
  color: #232323;
}

.r-pagination .pagination .dots {
  padding: 16px 22px;
}

/* Blog - finish*/
/* Blogs posts */
.category-link {
  display: none;
}

.text-bc-red {
  background-color: #9d0e25;
  padding: 10px;
  text-align: center;
  color: white;
  border-radius: 5px;
}

.block-dark-green {
  background-color: #aabdbe;
  padding: 10px;
  border-radius: 5px;
}

.block-dark-beige {
  background-color: #d0c4b6;
  padding: 10px;
  border-radius: 5px;
}

.container-yellow h3 {
  background-color: #b4870b;
  color: white;
  width: 75%;
  margin-bottom: 0px;
}

.container-yellow p {
  border: 3px solid #b4870b;
  margin-top: 0px;
}

.container-mint h3 {
  background-color: #3ba3a3;
  color: white;
  width: 75%;
  margin-bottom: 0px;
}

.container-mint p {
  border: 3px solid #3ba3a3;
  margin-top: 0px;
}

.veteran-table thead,
.veteran-table tbody tr:nth-child(even) {
  background-color: #004fa31a;
}

.veteran-table tbody tr:nth-child(odd) {
  background-color: #004fa30d;
}

.veteran-table thead tr th {
  border: 0px;
  border-bottom: 1px solid #e0e0e0;
}

.veteran-table tbody tr td {
  border: 0px;
  border-bottom: 1px solid #e0e0e0;
}

.veteran-table table thead {
  border: 0px;
}

/*------------*/
/* Salary Bar */
/*------------*/
.bar {
  height: 15px;
}

/* EdD Degree in Education Policy | Median Annual Salary: Min-40k / Max-140k */
.edd-job-line-graph .bar-light-green {
  width: 35%;
  background-color: #62b13a;
}

.edd-job-line-graph .bar-dark-green {
  width: 45%;
  background-color: #3b711f;
}

.edd-job-line-graph .bar-light-blue {
  width: 63%;
  background-color: #5ed4f8;
}

.edd-job-line-graph .bar-dark-blue {
  width: 65%;
  background-color: #4390a7;
}

.edd-job-line-graph .bar-light-purple {
  width: 66%;
  background-color: #8661d8;
}

.edd-job-line-graph .bar-dark-purple {
  width: 85%;
  background-color: #6242a7;
}

.edd-job-line-graph .bar-complete {
  width: 100%;
  background-color: #00000026;
}

/* MAT Job/Average salary line graph*/
.mat-job-line-graph .bar-complete {
  width: 100%;
  background-color: #00000026;
}

.mat-job-line-graph .bar-dark-green {
  width: 100%;
  background-color: #3b711f;
}

.mat-job-line-graph .bar-light-green {
  width: 66%;
  background-color: #62b13a;
}

.mat-job-line-graph .bar-dark-blue {
  width: 66%;
  background-color: #4390a7;
}

.mat-job-line-graph .bar-light-blue {
  width: 64%;
  background-color: #5ed4f8;
}

.mat-job-line-graph .bar-dark-purple {
  width: 63%;
  background-color: #6242a7;
}

.mat-job-line-graph .bar-light-purple {
  width: 41%;
  background-color: #8661d8;
}

/* MAT-2 Job/Average salary line graph*/
.mat-2-job-line-graph .bar-complete {
  width: 100%;
  background-color: #00000026;
}

.mat-2-job-line-graph .bar-light-green {
  width: 90%;
  background-color: #62b13a;
}

.mat-2-job-line-graph .bar-dark-green {
  width: 80%;
  background-color: #3b711f;
}

.mat-2-job-line-graph .bar-light-blue {
  width: 60%;
  background-color: #5ed4f8;
}

.mat-2-job-line-graph .bar-dark-blue {
  width: 48%;
  background-color: #4390a7;
}

.mat-2-job-line-graph .bar-light-purple {
  width: 34%;
  background-color: #8661d8;
}

.mat-2-job-line-graph .bar-dark-purple {
  width: 32%;
  background-color: #6242a7;
}

.mat-2-job-line-graph .bar-dark-purple-2 {
  width: 28%;
  background-color: #6242a7;
}

/* MED Job/Average salary line graph*/
.med-job-line-graph .bar-complete {
  width: 100%;
  background-color: #00000026;
}

.med-job-line-graph .bar-dark-green {
  width: 38%;
  background-color: #3b711f;
}

.med-job-line-graph .bar-light-green {
  width: 62%;
  background-color: #62b13a;
}

.med-job-line-graph .bar-dark-yellow {
  width: 66%;
  background-color: #c1cd22;
}

.med-job-line-graph .bar-powder-blue {
  width: 80%;
  background-color: #7ea9ae;
}

.med-job-line-graph .bar-dark-blue {
  width: 82%;
  background-color: #4390a7;
}

.med-job-line-graph .bar-light-blue {
  width: 83%;
  background-color: #5ed4f8;
}

.med-job-line-graph .bar-dark-purple {
  width: 86%;
  background-color: #6242a7;
}

.med-job-line-graph .bar-light-purple {
  width: 100%;
  background-color: #8661d8;
}

/* Online Masters in Education Policy Leadership Job/Average salary line graph*/
.ed-policy-leader-job-line-graph .bar-complete {
  width: 100%;
  background-color: #00000026;
}

.ed-policy-leader-job-line-graph .bar-dark-green {
  width: 18.75%;
  background-color: #3b711f;
}

.ed-policy-leader-job-line-graph .bar-light-green {
  width: 23.68%;
  background-color: #62b13a;
}

.ed-policy-leader-job-line-graph .bar-dark-yellow {
  width: 29.47%;
  background-color: #c1cd22;
}

.ed-policy-leader-job-line-graph .bar-powder-blue {
  width: 29.81%;
  background-color: #7ea9ae;
}

.ed-policy-leader-job-line-graph .bar-dark-blue {
  width: 30.24%;
  background-color: #4390a7;
}

.ed-policy-leader-job-line-graph .bar-light-blue {
  width: 35.79%;
  background-color: #5ed4f8;
}

.ed-policy-leader-job-line-graph .bar-dark-purple {
  width: 55.76%;
  background-color: #6242a7;
}

.ed-policy-leader-job-line-graph .bar-light-purple {
  width: 56.67%;
  background-color: #8661d8;
}

.ed-policy-leader-job-line-graph .bar-light-purple-2 {
  width: 98.86%;
  background-color: #8151eb;
}

@media (max-width: 991px) {
  .edd-job-line-graph,
  .mat-job-line-graph,
  .mat-2-job-line-graph,
  .med-job-line-graph,
  .ed-policy-leader-job-line-graph {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .edd-job-line-graph .col-4,
  .mat-job-line-graph .col-4,
  .mat-2-job-line-graph .col-4,
  .med-job-line-graph .col-4,
  .ed-policy-leader-job-line-graph .col-6,
  .edd-job-line-graph .col-6,
  .mat-job-line-graph .col-6,
  .mat-2-job-line-graph .col-6,
  .med-job-line-graph .col-6,
  .ed-policy-leader-job-line-graph .col-6,
  .edd-job-line-graph .col-2,
  .mat-job-line-graph .col-2,
  .mat-2-job-line-graph .col-2,
  .med-job-line-graph .col-2,
  .ed-policy-leader-job-line-graph .col-2 {
    width: 100%;
  }

  /* Salary Heading */
  .wp-bootstrap-blocks-row.row.border-bottom-light-grey.mb-20.pb-10 {
    display: none;
  }
}

/* MED Job/Average salary line graph*/
/* .green-collapse-items>.collapse-item>.collapse>.card-body.collapse-body>p,
.green-collapse-items>.collapse-item>.collapse>.card-body.collapse-body>p>a,
.white-collapse-items>.collapse-item>.collapse>.card-body.collapse-body>p,
.white-collapse-items>.collapse-item>.collapse>.card-body.collapse-body>p>a {
  color: white;
} */

.online-events-cards > .result-list > .r-item > .r-content-block {
  justify-content: space-around;
}

.online-events-cards > .result-list > .r-item {
  border: 1px solid #e3e3e4;
  padding: 10px;
  text-align: center;
}

.r-block-faculty .img-top,
.img-top,
.btn-r-action {
  margin: 0 auto;
}

.online-events-cards > .result-list > .r-item > .r-content-block > .r-headline {
  font-size: 1.75rem;
  font-weight: 400;
}

.online-events-cards > .result-list > .r-item > .r-content-block > .r-action {
  justify-content: center;
}

.whitespace-nowrap {
  white-space: nowrap;
}

@media (max-width: 683px) {
  .past_webinar_card {
    display: flex;
  }

  #block_634f14047752c .col-1.col-lg-1 {
    flex: 0 0 auto;
    width: 59.333333%;
  }

  #block_634f14047752c .col-2.col-lg-2 {
    flex: 0 0 auto;
    width: 38.666667%;
  }

  .button_container {
    display: flex;
    flex-direction: column;
  }

  #block_634f14047752c .col-8.col-lg-8 {
    flex: 0 0 auto;
    width: 90%;
  }

  #block_634f14047752c #block_634f16e07752e {
    margin-left: 23px !important;
  }
}

.r-pagination {
  position: relative;
  /* background-image: var(--section-bg-img); */
  overflow: auto;
}

@media (max-width: 991px) {
  #edd-in-education-policy-leadership .row {
    margin-right: 0px !important;
    margin: 0 auto;
  }

  .w-20 {
    width: 100%;
  }

  #block_632de5481cfa6 .wp-bootstrap-blocks-row.row {
    display: flex;
    flex-direction: column;
  }

  /* #block_632de5481cfa6 .wp-bootstrap-blocks-row.row div {
    width: 100%;
  } */
  #block_63484ac0c915e .wp-bootstrap-blocks-row.row div {
    width: 100%;
  }

  #block_632de5481cfa8 .center {
    width: 100%;
  }

  #block_6330ef72c5d96 .center {
    width: 100%;
  }

  #block_633102fb5f5b6 .center {
    width: 100%;
  }

  #block_63484ac0c915e .wp-bootstrap-blocks-row.row .iti__selected-flag {
    width: 3rem !important;
  }

  .plato-form-1 .wp-bootstrap-blocks-row.row .iti__selected-flag {
    width: 3rem !important;
  }

  form .field-box {
    display: flex;
    flex-direction: column;
  }

  form .field-box div:not(.iti__flag) {
    width: 100%;
  }

  form .field-box .iti__selected-flag {
    width: 3rem;
  }

  form .field-box .iti__arrow {
    width: 0% !important;
  }

  .cards-grid-layout {
    display: flex;
    flex-wrap: wrap;
    justify-items: center;
    justify-content: center;
    flex-direction: column;
  }

  .bc-dark-blue-translucent {
    background-color: #0f2846cc;
    width: 100%;
    margin: 0 auto;
  }

  .bottom-banner {
    overflow-x: auto;
    white-space: nowrap;
  }

  .r-pagination .pagination .dots {
    padding: 1px 25px;
  }

  .pagination {
    padding-right: 0px;
  }

  /* #block_63484ac0c915e .col-12.col-lg-12.pt-4 {
    padding-left: 42px;
  } */

  #block_632b1b96c83c8 .col-6 {
    flex: 0 0 auto;
    width: 100%;
  }

  #block_634857ada5c86 .wp-bootstrap-blocks-row.row {
    margin-right: -25px !important;
  }

  #block_6331d09f6ba4e .wp-bootstrap-blocks-row.row {
    row-gap: 0px;
  }

  .footer-img-col > div {
    top: 30px;
    position: relative;
  }

  #block_6334c9c2cb57f .r-hero {
    display: flex;
    justify-content: center;
  }

  #block_63484ac0c915e .wp-bootstrap-blocks-row.row {
    margin-right: 25px !important;
    padding-left: 20px;
  }

  .program_pillars {
    display: flex;
    flex-direction: column !important;
  }

  .program_singlePillar {
    width: 100% !important;
  }

  .header_text {
    width: 100%;
  }

  .headerRFI {
    width: 100%;
  }

  .headerRFI_container {
    display: flex;
    flex-direction: column !important;
  }

  .g-col.r-item.d-flex.flex-column.flex-lg-row.img-side.img-left {
    margin: 0px;
    padding: 0px;
    overflow: scroll;
  }

  .g-col.r-item.d-flex.flex-column.flex-lg-row.img-side.img-left .wp-image {
    width: 69%;
  }

  .bc-dark-blue {
    background-color: #0f2846;
    width: 100%;
  }

  .r-block-faculty
    .g-col.r-item.d-flex.flex-column.flex-lg-row.img-side.img-left {
    inline-size: 100%;
    overflow-wrap: break-word;
  }

  #block_6334c9c2cb57f .wp-image.wp-post-image {
    width: 100%;
  }

  .footer-links {
    width: 100%;
  }

  .footer-img-col {
    top: 23%;
    position: relative;
  }

  #block_6331dc036ba64 h3 {
    width: auto !important;
  }

  .online-unique-cards .cards-grid-layout {
    display: flex;
    flex-direction: column;
  }

  .footer-mobile .wp-bootstrap-blocks-row.row {
    display: flex;
    flex-direction: column !important;
    margin: 0 auto;
    width: 100%;
  }

  .navbar .depth_0,
  .depth_1 {
    display: block;
  }
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/*online-masters-in-education-policy-leadership: Online MEd Alumni & Outcomes */
.online-med-alum a {
  color: white;
  text-decoration-color: white;
}

.online-med-alum a:visited {
  color: white;
  text-decoration-color: white;
}

footer a {
  color: #003670;
  text-decoration-color: #003670;
}

/*----------------*/
/* Calendly Modal */
/*----------------*/
/** SETUP
* 1. Build Calendly Form
*   a. WP Admin -> Form -> Add New Post: Calendly
*
* 2. Build Calendly Modal
*   a. WP Admin -> Website Settings -> Modals -> Add New Post: Calendly Modal -> Edit
*   b. Editor -> Embed Form block -> Fill out relevant fields
*   c. Select Form block -> Block panel -> Additional CSS class(es) field -> Add "calendly-modal"
*
* 3. Enable Calendly Modal Button
*   a. WP Admin -> Website Settings -> Floating CTA Settings
*   b. Floating CTA Settings -> Enable Page and Landing Page
*   c. Floating CTA Settings -> Button Modal: Calendly Modal
*
* 4. Local Directory -> Add "img/calendar-icon.svg"
*/
.modal-content:has(#calendly-modal) {
  border-radius: 1.125rem;
  border: 1px solid #003670;
  max-width: 500px;
  width: 100%;
}

.modal-content:has(#calendly-modal) .btn-close {
  display: block;
  margin-left: auto !important;
  width: 1em;
  height: 1em;
  padding: 0;
  margin: -0.5rem -0.5rem 0 1rem;
}

.modal-content:has(#calendly-modal) .modal-body {
  padding: clamp(1.25rem, 2vw, 2rem);
}

#calendly-modal .form-headline {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-size: 1.875rem;
  font-weight: 900;
  margin-bottom: 1rem;
}

#calendly-modal .form-headline::before {
  content: "";
  display: block;
  width: 33px;
  height: 33px;
  background-image: url("img/calendar-icon.svg");
  background-size: contain;
  margin-right: 0.5rem;
  background-repeat: no-repeat;
}

#calendly-modal .form-subheadline {
  margin-bottom: 2rem;
}

#calendly-modal label {
  color: #333 !important;
  font-size: 1rem !important;
}

#calendly-modal .field-box > div {
  width: 100%;
}

#calendly-modal input[name="phone"] {
  padding-left: 50px;
}

#calendly-modal input[type="button"] {
  background-color: #e81333;
  color: #fff;
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 1rem;
  text-transform: none;
  font-size: 1.125rem;
  border-radius: 8px;
}

#calendly-modal input[type="button"]:hover {
  background-color: #a30d23;
}

#calendly-modal .f_text,
#calendly-modal .f_select,
#calendly-modal .f_textarea {
  padding: 0.75rem;
  border-radius: 4px;
}

#calendly-modal .f_text:is(:hover, :focus, :focus-visible),
#calendly-modal .f_select:is(:hover, :focus, :focus-visible),
#calendly-modal .f_textarea:is(:hover, :focus, :focus-visible) {
  border-color: #a30d23;
  outline: 0;
  transition: ease-in-out 175ms;
}

#calendly-modal .disclaimer {
  font-size: 14px;
}

/*--------------------------------*/
/* Thank You page (with Calendly) */
/*--------------------------------*/
/* Add "ty-section-calendly" class to parent "Container", "Wrapper" or "N: Hero" block */
.ty-section-calendly.n-section-hero {
  position: relative;
}

.ty-section-calendly.n-section-hero::before {
  content: "";
  background-image: url("/wp-content/uploads/sites/2/2022/09/au-thank-you-page-image.jpeg");
  background-position: 34% 50%;
}

.ty-section-calendly.n-section-hero::after {
  content: "";
  position: absolute;
  background-color: rgba(0, 54, 112, 0.9);
  width: 50%;
  transform: translateX(100%);
  height: 100%;
  top: 0;
  z-index: 1;
}

.ty-content,
.calendly-content {
  padding: 2rem;
}

.calendly-content {
  position: relative;
  z-index: 2;
}

@media (max-width: 768px) {
  .calendly-content {
    top: 50px;
  }

  .ty-section-calendly.ty-section-calendly.n-section-hero:not(
      .has-end
    )::before {
    top: 50%;
  }

  .ty-section-calendly.n-section-hero::after {
    width: 100%;
    transform: translateY(100%);
    height: 50%;
  }
}

/*--------*/
/* Header */
/*--------*/
@media (max-width: 991px) {
  /* Hamburger Menu */
  button.navbar-toggler {
    border: 0;
    padding: 1rem 0 1rem 1rem;
    box-shadow: none;
    position: relative;
    left: 0;
    display: flex;
    align-items: center;
  }

  button.navbar-toggler::after {
    content: "";
    color: #fff;
    font-weight: 600;
    position: relative;
    top: 3px;
  }

  button.navbar-toggler:is(:hover, :focus) {
    box-shadow: none;
  }

  button.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before,
  button.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
    top: 0;
    translate: 50%;
    right: 50%;
  }

  button.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
    background-color: transparent;
  }

  button.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
    rotate: -45deg;
  }

  button.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
    rotate: 45deg;
  }

  .navbar-toggler-icon {
    display: block;
    position: relative;
    background-image: none;
    background-color: #fff;
    height: 3px;
    width: 26px;
    border-radius: 15px;
    box-shadow: none;
    outline: 0;
    transition: ease-in-out 175ms;
  }

  .navbar-toggler-icon::before,
  .navbar-toggler-icon::after {
    content: "";
    display: block;
    position: absolute;
    background-color: #fff;
    height: 3px;
    width: 26px;
    border-radius: 15px;
    transition: ease-in-out 175ms;
  }

  .navbar-toggler-icon::before {
    top: -10px;
  }

  .navbar-toggler-icon::after {
    top: 10px;
  }
}

@media (min-width: 992px) {
  .header .inner-navbar {
    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.05);
  }

  #navbarMain > .navbar-nav > .current-menu-item.nav-item,
  #navbarMain > .navbar-nav > .current-menu-ancestor.menu-item-has-children {
    border-bottom-color: #e81333 !important;
  }

  #navbarMain .navbar-nav .menu-item {
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
  }

  #navbarMain > .navbar-nav > li:is(:hover, :focus) {
    border-bottom: 4px solid #e81333;
  }
}

.has-theme-light-color a:is(:hover, :focus) {
  color: #8a95a5;
}

/* Dates Block */
.block-dates {
  margin-bottom: 50px;
}

.block-dates .dates-layout-line .date-item {
  border-color: #003670;
}

.block-dates .dates-layout-line .date-item::before {
  background-color: #003670;
}

.block-dates .dates-layout-line .date-label {
  font-size: 1.125rem;
  font-weight: 600;
}

/* Collapse Content Block */
.block-collapse {
  margin-top: 35px;
  margin-bottom: 35px;
}

/* Dropdown Menu */
.dropdown-menu {
  margin-top: -6px;
}

a[target="_blank"]:not(.share-link, .btn)::after {
  content: "\f08e";
  font-family: var(--fa-version);
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: none !important;
  margin-left: 3px;
  margin-right: 3px;
  vertical-align: top;
}

.bg-secondary {
  background-color: transparent !important;
}

/*---------*/
/* Chatbot */
/*---------*/
:root {
  --cbPrimary: var(--blue-200);
  --cbTextAreaMaxHeight: 127px;
  --cbWidth: 450px;
  --cbHeight: 450px;
  --cbPosRight: 96px;
  --cbPosBottom: -9px;
  --cbBorderRadius: 10px;
}
@media (max-width: 991px) {
  :root {
    --cbWidth: 100vw;
    --cbHeight: 100%;
    --cbPosRight: 0;
    --cbPosBottom: -25px;
    --cbBorderRadius: 0;
  }
}

/* CHATBOX
=============== */
.chatbox {
  position: fixed;
  bottom: var(--cbPosBottom);
  right: var(--cbPosRight);
  max-height: 70vh;
  max-width: 100vw;
  height: var(--cbHeight);
  width: var(--cbWidth);
  margin: 0 !important;
  opacity: 0;
  background-color: transparent !important;
  border-radius: var(--cbBorderRadius);
  box-shadow: 0px 10px 15px 5px rgba(0, 0, 0, 0.125) !important;
  transition: all 0.3s ease-in-out;
  z-index: -1;
  overflow: hidden;
  font-family: var(--lato);
}
.chatbox--active {
  transform: translateY(-25px);
  opacity: 1;
  z-index: 99999;
}
.chatbox:not(.chatbox--active) {
  pointer-events: none;
}
.chatbox * {
  box-sizing: border-box;
}

@media (max-width: 992px) {
  .chatbox {
    box-shadow: 0 -20px 35px 20px rgba(0, 0, 0, 0.125) !important;
  }
}

/* CHATBOX CONTENT */
.chatbox__support {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Close Button */
.btn-close {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: 0.25em 0.25em;
  color: transparent !important;
  background: transparent
    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e")
    center / 1em auto no-repeat !important;
  border: 0;
  border-radius: 0.25rem;
  opacity: 0.5;
  cursor: pointer;
}
.btn-close:focus {
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.btn-close-white {
  filter: invert(1) grayscale(100%) brightness(200%);
}
.chatbox-close {
  position: absolute !important;
  top: calc(50% - 11px);
  right: 20px;
  width: 20px !important;
  height: 20px !important;
  padding: 0 !important;
  opacity: 1 !important;
}

/* Chatbox Input */
.cb-send-container {
  display: flex;
  flex-wrap: wrap;
  margin: 6px;
  border-radius: 0 0 10px 10px;
}
.cb-send-container:focus-within {
  outline: 1px solid #8790a1 !important;
}
#cbTextarea {
  flex: 1;
  padding: 15px;
  width: 100%;
  max-height: var(--cbTextAreaMaxHeight);
  font-size: 16px;
  line-height: 1.5;
  border: none;
  border-radius: 0 0 10px 10px;
  overflow-y: hidden;
  resize: none;
}
#cbTextarea::placeholder {
  color: var(--fontcolordark);
  opacity: 1;
}
#cbTextarea:focus-visible {
  outline: none;
}

/* BUTTON */
.chatbox__button {
  position: fixed;
  right: 16px;
  bottom: 16px;
  text-align: right;
}
.send__button {
  padding: 0 6px;
  line-height: 1;
  background-color: #fff !important;
  border: none;
  outline: none;
  cursor: pointer;
}
.send__button svg {
  width: 33px;
  height: 33px;
}
.send__button .cb-submit-circle {
  fill: var(--red-200) !important;
  transition: 0.2s ease-out;
}
.send__button .cb-submit-arrow {
  fill: #fff;
}
.send__button:is(:hover, :focus) .cb-submit-circle {
  fill: rgb(82, 128, 60);
}
.chatbox-input-error {
  display: none;
  flex-basis: 100%;
  margin: 5px 0 0 0;
  padding: 5px 15px;
  font-size: 12px;
  color: red;
  border-top: 1px solid #eee;
}

/* HEADER */
.chatbox__header {
  position: relative;
  background: var(--cbPrimary);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  padding: 10px 35px 10px 11px;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.15);
}

.chatbox__image--header {
  margin-right: 10px;
}
.chatbox__image--header img {
  display: none;
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.chatbox__content--header {
  color: #fff;
}
.chatbox__content--header p {
  margin: 0 !important;
  font-size: 0.875rem !important;
  color: inherit;
  line-height: 1.5;
}
.chatbox__heading--header {
  color: inherit;
  font-weight: 700;
  margin: 0;
}

.chatbox__description--header {
  font-size: 0.9rem;
  color: white;
}

/* MESSAGES */
.chatbox__messages {
  margin-top: auto;
  padding: 0 20px;
  height: 100%;
  display: flex;
  overflow-y: scroll;
  font-size: 0.9rem;
  flex: 1;
  flex-direction: column-reverse;
  background-color: #fff;
}
.chatbox__messages > ul {
  flex: 1;
  margin: 0 0 20px 0;
  padding: 0;
  width: 100%;
  list-style-type: none;
}

.messages__item {
  margin-top: 10px;
  background: var(--gray-200);
  font-size: 1rem;
  padding: 16px 25px;
  width: fit-content;
  max-width: 90%;
}

.messages__item--user {
  margin-left: auto;
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  border-bottom-left-radius: 24px;
  background: var(--blue-200);
  color: white;
  word-break: break-word;
}

.messages__item--chatbot {
  margin-right: auto;
}
.messages__item--chatbot,
.messages__item--typing {
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  border-bottom-right-radius: 24px;
}
.messages__item--chatbot a:is(:hover, :focus) {
  color: #2a6984;
}
.cb-message-container {
  position: relative;
  flex: 1;
  overflow: hidden;
}
.cb-scroll-bottom {
  position: absolute;
  bottom: 12.5px;
  left: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 35px;
  min-height: 35px;
  border-radius: 50%;
  background-color: #fff;
  opacity: 0.5;
  transition: all 0.3s linear;
}
.cb-scroll-bottom:is(:hover, :focus) {
  opacity: 1;
}
.cb-scroll-bottom svg {
  width: 15px;
  height: 15px;
}

/* FOOTER */
.chatbox__footer {
  overflow-y: auto;
  max-height: 100%;
  background-color: #fff;
  border-radius: 0 0 15px 15px;
  box-shadow: 0px -10px 15px rgba(0, 0, 0, 0.1);
  z-index: 1;
}
.chatbox__footer .disclaimer {
  padding: 20px 20px;
  font-size: 0.8rem;
  color: #000;
  background: var(--gray-200) !important;
}
.chatbox__footer .disclaimer p {
  padding: 10px 0;
}
.chatbox__footer .disclaimer a {
  color: #000;
}

.chatbox__button button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 62px;
  padding: 10px;
  background: white !important;
  border: 3px solid #fff;
  outline: none;
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
  border-bottom-left-radius: 50px;
  box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: all 0.3s linear;
}
.chat-icon path {
  fill: var(--cbPrimary);
  transition: all 0.3s linear;
}
.chatbox--active + .chatbox__button > button,
.chatbox__button > button:hover {
  background: var(--cbPrimary) !important;
  border: 3px solid var(--cbPrimary);
}
.chatbox--active + .chatbox__button > button .chat-icon path,
.chatbox__button > button:hover .chat-icon path {
  fill: #ffffff;
}

.disclaimer__button {
  background-color: var(--red-200);
  color: white;
  border: 0;
  border-radius: 5px;
  padding: 10px 25px;
  font-size: 0.8rem;
  cursor: pointer;
  font-weight: bold;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.3s linear;
  width: 100%;
  outline: none;
}
.disclaimer__button:is(:hover, :focus) {
  background-color: var(--blue-200);
}

@keyframes blink {
  50% {
    fill: transparent;
  }
}
.dot {
  animation: 1s blink infinite;
  fill: grey;
}
.dot:nth-child(2) {
  animation-delay: 250ms;
}
.dot:nth-child(3) {
  animation-delay: 500ms;
}
.dots .loader {
  color: grey;
}
.cb-message-container .dots {
  padding: 0 20px;
}

/* Chat btn notification */
.has-notification {
  position: relative;
}
.has-notification:before {
  content: "!";
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -4px;
  right: -4px;
  width: 15px;
  height: 15px;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  background-color: rgb(242, 84, 125);
  border: 1px solid white;
  border-radius: 50%;
  box-shadow: white 0px 0px 0px 1px;
}

@media (max-width: 991px) {
  .chatbox-open {
    overflow: hidden;
  }
}