/*
Theme Name: ICRMA
Author: Zadro Web
Author URI: https://zadroweb.com
Description: Craft CMS Theme based on Bootstrap 5
Version: 2.0
*/


:root {
    /* Global Styles */
    --theme-body-color: #4A4A4A;
    --theme-color: #0f75bc;
    --theme-color-hover: #00aeef;
    --theme-color-cta: #ed7323;
    --theme-color-cta-hover: #ed7323;
    --theme-color-grey: #65686E;
    --theme-color-grey-light: #dee2e6;
    --theme-color-grey-lighter: #f8f9fa;
    --theme-color-heading: #32425F;
    --border-radius: 0rem;
    /* Navigation */
    --navbar-bg-color-start: transparent;
    --navbar-bg-color: white;
    --navbar-link-color: 255,255,255;
    --navbar-link-color-hover: white;
    --menu-link-color: #0f75bc;
    --menu-link-color-hover: #00aeef;
    --close-icon-color: #999;
    --close-icon-color-hover: #0f75bc;
    --collapse-bg-color: white;
    --collapse-border-color: #bbb;
    --collapse-link-color: #0f75bc;
    /* Footer */
    --bg-footer: #2E4061;
    --bg-footer-copyright: #47526f;
    --text-footer: white;
    --text-footer-hover: #00aeef;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: "Poppins", sans-serif;
  color: var(--theme-body-color)
}

header,
footer {flex: 0 0 auto;}
.content {flex: 1 0 auto;}

section,
.section {padding-top: 2.5rem;padding-bottom: 2.5rem;}
@media (min-width: 767px) {
    section,
    .section {padding-top: 3.75rem;padding-bottom: 3.75rem;}
}

a {color: var(--theme-color);text-decoration: none;}
a:hover {color: var(--theme-color-hover);}

a.link-sidebar {color: var(--theme-color-grey);}
a.link-sidebar.active {color: var(--theme-color);}
a.link-sidebar:hover {color: var(--theme-color-hover);}

th,
strong {font-weight: 500;}

h1,
h2,
h3,
h4,
h5,
h6 {font-family: "Rubik", sans-serif;}
.btn,
.breadcrumb {font-family: "Rubik", sans-serif;}
.fw-bold {font-weight: 500!important;}

.z-index-front {z-index: 1000;position: relative;}
.z-index-back {z-index: -1;position: relative;}
.overflow-x-clip {overflow-x: clip;}
.reset {all: revert;}

.heading-large {font-size: 1.5rem;}
.heading-xl {font-size: 1.75rem;}
.text-heading {color: var(--theme-color-heading);}
.card:hover .text-heading {color: var(--theme-color-hover);}
.text-theme {color: var(--theme-color);}
.text-theme-light {color: var(--theme-color-hover);}
.text-theme-grey {color: var(--theme-color-grey);}
.text-cta {color: var(--theme-color-cta);}


.text-white-opacity {color: rgba(255, 255, 255, 0.85);}
a.text-white-opacity:hover {color: rgba(255, 255, 255, 1);}
.breadcrumb.text-white-opacity .breadcrumb-item + .breadcrumb-item::before {color: rgba(255, 255, 255, 0.75);}

@media (min-width: 768px) {
  .heading-large {font-size: 2.5rem;}
  .heading-xl {font-size: 2.75rem;}
}

.bg-theme {background-color: var(--theme-color);}
.bg-theme-footer {background-color: var(--bg-footer);}
.bg-theme-hover {background-color: var(--theme-color-hover);}
.bg-cta {background-color: var(--theme-color-cta);}

.gradient-theme {
  background: rgb(15,117,188);
  background: linear-gradient(90deg, rgba(15,117,188,1) 0%, rgba(115,192,220,1) 100%);  
}
.gradient-theme-reverse {
  background: rgb(15,117,188);
  background: linear-gradient(90deg, rgba(115,192,220,1) 0%, rgba(15,117,188,1) 100%);  
}
.fa-gradient:before {
  background: linear-gradient(90deg, rgba(15,117,188,1) 0%, rgba(115,192,220,1) 100%);
  display: initial;
  background-clip: text;
  color: transparent;
}

a.bg-theme:hover {background-color: var(--theme-color-cta);}
a.bg-cta:hover {background-color: var(--theme-color);}

.arrow {text-decoration: none;}
.arrow a {color: var(--theme-color-grey);}
.arrow a:hover {/*color: var(--theme-color);*/}
.arrow .arrow-link {color: var(--theme-color-grey);display: inline-block;}
.arrow .arrow-link .arrow-icon {
  position: relative;
  top: 1px;
  transition: transform 0.3s ease;
}
.arrow:hover .arrow-link{color: var(--theme-color-hover);}
.arrow:hover .arrow-link .arrow-icon {
  transform: translate3d(5px, 0, 0);
  color: var(--theme-color-hover);
}

.btn,
.card,
.form-control,
.input-group>.form-control,
.input-group>.btn,
.form-control.custom-select,
.form-select,
.input-group-text {
    border-radius: var(--border-radius);
}
.form-control {
  appearance: auto;
  box-shadow: none!important;     
}
.form-label {margin-bottom: 0.2rem;margin-left: 0.1rem;font-weight:500;font-size: 1rem;}

.form-control::file-selector-button {
  background-color: var(--theme-body-color);
  color: white;
}
.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
  background-color: var(--theme-color-grey);
  color: white;
}

.card-header:first-child {border-radius: var(--border-radius) var(--border-radius) 0 0;}
.card-footer:last-child {border-radius: 0 0 var(--border-radius) var(--border-radius);}

.card-tall:hover img {opacity: 0.85;}


/* Buttons */
.btn {padding-right: 24px;padding-left: 24px;}
.btn:focus {box-shadow: none;}

.btn-theme,
.btn-theme:focus {background-color: var(--theme-color);border-color: var(--theme-color);}
.btn-theme:hover {background-color: var(--theme-color-hover);border-color: var(--theme-color-hover);}

.btn-theme-outline,
.btn-theme-outline:focus {background-color: transparent;border-color: white;}
.btn-theme-outline:hover {background-color: var(--theme-color-hover);border-color: var(--theme-color-hover);}

.btn-theme-outline-white,
.btn-theme-outline-white:focus {background-color: white;border-color: var(--theme-color-hover);color: var(--theme-color-hover);}
.btn-theme-outline-white:hover {background-color: var(--theme-color-hover);border-color: var(--theme-color-hover);}

.btn-cta,
.btn-cta:focus {background-color: var(--theme-color-cta);border-color: var(--theme-color-cta);}
.btn-cta:hover {background-color: var(--theme-color-cta-hover);border-color: var(--theme-color-cta-hover);}

.btn-default {
  color: #333;
  background-color: white;
  border-color: #ccc;
}
.btn-default:focus,
.btn-default.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
.btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

/* pagination */
.page-link {color: var(--theme-color-grey);}
.page-link:hover,
.page-link:focus {color: var(--theme-color-hover);box-shadow: none;}
.page-link .fa-sharp {font-size: 1.2rem;line-height: 1.25;}
.page-link .fa-sharp:first-child {margin-right: 0.25rem;margin-left: 0;}
.page-link .fa-sharp:last-child {margin-left: 0.25rem;margin-right: 0;}
.page-item.active .page-link {background-color: var(--bs-dark-bg-subtle);border-color: var(--bs-dark-bg-subtle);}
.page-item.active .page-link:hover {color: white;}
.page-item:first-child .page-link,
.page-item:last-child .page-link {border-radius: 0;}


.nav-tabs .nav-item .nav-link {color: var(--theme-color-grey);padding: 10px 15px;}
.nav-tabs .nav-item .nav-link.active {color: var(--theme-color);}
.nav-tabs .nav-item .nav-link:hover {color: var(--theme-color-hover);text-decoration: none;}


/* Hero */
.hero {position:relative;height: 540px;}
.hero-pages {position:relative;height: 400px;}
.hero-small {position:relative;height: 340px;}
.hero-callout {position:relative;height: 400px;}
.hero-overlay {
  position: absolute;
  inset: 0;
  mix-blend-mode: multiply;
  background: rgba(53, 93, 117, 0.85);
  z-index: 100;
}
.hero-overlay-gradient {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(37,44,56,0.84) 0%, rgba(52,125,209,0.84) 100%);
  z-index: 100;
}
.hero img,
.hero-pages img,
.hero-small img,
.hero-callout img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 99;
}
.hero-callout h2 {font-size: 1.5rem;}
.hero-content {
  position: absolute;
  display: block;
  width: 100%;
  top: 50%;
  left : 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  z-index: 102;
}
.hero-heading {font-size: 1.1rem;}
.hero-heading-large {font-size: 2rem;}
@media (min-width: 768px) {
  .hero {height: 680px;}
  .hero-pages {height: 500px;}
  .hero-small {height: 400px;}
  .hero-callout {height: 400px;}
  .hero-callout h2 {font-size: 2.5rem;}
  .hero-heading {font-size: 1.3rem;}
  .hero-heading-large {font-size: 3rem;}  
}

/* Sitewide */
.event {margin-bottom: 1rem;}
.event-line {border-left: 2px solid var(--theme-color-hover);padding-left: 0.5rem;margin-left: 0.1rem;}
.event-item {
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  color: var(--theme-color-hover);
  font-family: "Rubik", sans-serif;
}
a:hover .event-item {}
.event-item .month,
.event-item .day {line-height: 1.1;font-weight: 500;}
.event-item .month {font-size: 1rem;color: ;}
.event-item .day {font-size: 1.5rem;}
.event-item-heading {font-size: 1.15rem;line-height: 1;}
.event-list li {
  margin: 0.75rem 0;
  padding-bottom: 1rem;
  border-bottom: 1px solid #ccc;
}
.event-list li:first-of-type {
  margin-top: 0;
}
.event-list li:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

ul.quicklinks li {margin-bottom: 0.45rem;margin-left: 0.1rem;}
ul.quicklinks li:before{
  margin-right: 10px;
  margin-bottom: 2px;
  color: var(--theme-color-hover);
  display: inline-block;
  font-style: normal;
  font-weight: 300;
  font-size: 0.8rem;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: 'Font Awesome 6 Sharp';
  content:"\f324";
  vertical-align: middle;
}
ul.newslinks li {
  font-size: 1.2rem;
  margin-top: 0.35rem;
  margin-bottom: 0.35rem;
}
ul.sidelinks li {
  font-size: 1.1rem;
  font-weight: 300;
  margin-bottom: 0.75rem;
}
ul.sidelinks li:last-of-type {
  margin-bottom: 0px;;
}
ul.sidelinks .fa-sharp {font-size: 1.2rem;margin: auto 0;}

datalist option {font-size:1.3rem;font-style: italic;}


/* Home */
.callouts {margin-top: -3rem;}
.callouts .callout-heading {font-size: 1.2rem;}
.callouts a {color: white;}
.callouts a:hover {color: white; text-decoration: underline;}
@media (min-width: 768px) {
  .callouts {margin-top: -5rem;}
}




/* Entry */
.entry p,
.entry ul,
.entry ol,
.entry .table-font {font-weight: 300;font-size: 1.1rem;line-height: 1.65;}
.entry h1,
.entry h2,
.entry h3 {color: var(--theme-color);}
.entry h2 {margin: 1.5rem 0;}
.entry h2:first-of-type {margin-top: 0;}

.gradient-theme-reverse .entry h2,
.gradient-theme-reverse .entry h3 {color: white;}
.gradient-theme-reverse .entry h2 {margin: 1.5rem 0;}

.entry .blockquote {
  font-size: 1rem;
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  border: 1px solid #e9ecef;
  border-left-color: var(--theme-color);
  border-left-width: 0.25rem;
  border-radius: 0rem;
}
.entry .blockquote-left {
  font-size: 1.3rem;
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  border: none;
  border-left: 0.25rem solid var(--theme-color-hover);
  border-radius: 0rem;
}
.entry .blockquote-left p {font-size: 1.3rem;}

.callout p:last-of-type {margin-bottom: 0;}

.share-icons a {
  border: 1px solid var(--theme-color-grey-light);
  background: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-right: 0.75rem;
}
.share-icons a:hover,
.share-icons a:focus {
  color: white;
  background: var(--theme-color);
}

/* Autocomplete on Files/Masonry */
.autocomplete {position: relative;}
.autocomplete-items {
  position: absolute;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items > a {
  cursor: pointer;
  background-color: white;
  color: var(--theme-body-color);
}
/*when hovering an item:*/
.autocomplete-items > a:hover {
  background-color: var(--theme-color-hover);
  color: white;
}
.autocomplete-item.active {
  background-color: #f0f0f0; /* Light grey background for active item */
}
.autocomplete .icon-inside {
  position: absolute;
  right: 10px;
  top: calc(50% - 12px);
  pointer-events: none;
  font-size: 1.125rem;
  color: #aaa;
  z-index: 100;
  font-size: 1.2rem;
}


/* Iamge Aligns */
figure.image {position:relative;display:table;}
figure img {display: table-cell;max-width: 100%;height: auto;}
.image-style-align-left {float: left; margin-right: 0.75rem;}
.image-style-align-right {float: right; margin-left: 0.75rem;}
.image-style-align-center {margin: 0.75rem auto;display: block;}
figure figcaption {
  display: table-caption;
  caption-side: bottom;
  font-size: 0.8rem;
  padding: 0.65rem;
  background-color:#f3f5f6;
}


/* Tables */
.image-table {width: 100px;}
.btn-table {width: 140px;padding-right:0px;padding-left:0px;}

.table {margin: 1rem 0 2.5rem;}
.table ul {padding-left: 1rem;}

figure.table {
  overflow-x: auto;
}
figure.table table {
  width: 100%;
  margin: 1rem 0;
  vertical-align: top;
  border-color: var(--theme-color-grey-light);
}
figure.table th,
figure.table td {
  padding: 0.75rem;
  vertical-align: top;
  border-top: 1px solid var(--theme-color-grey-light);
}
figure.table thead th {
  vertical-align: bottom;
  border-bottom: 2px solid var(--theme-color-grey-light);
}
figure.table tbody + tbody {
  border-top: 2px solid var(--theme-color-grey-light);
}

@media only screen and (max-width: 992px) {
  thead th {display: none;}
  td, th {display: block;}
  td:not(:last-child) {border-bottom: none;}
  td:last-child {margin-bottom: 15px;padding-bottom: 15px;}
  td[data-th]:before  {
      content: attr(data-th);
      display: inline-block;
      font-weight: 500;
      margin-right: 20px;
      width: 120px;
  }
  td.large[data-th]:before {
    width: 260px;
  }
}

/* Accordions */
.accordion-panel {overflow: hidden;}
.accordion-panel .accordion-body {padding: 1rem;}
.accordion-panel .accordion-toggle {background-color: var(--theme-color);margin-bottom: 0;font-size: 1.5rem;padding: 0.75rem;cursor: pointer;color:white;}
.accordion-panel .accordion-toggle.collapsed {background-color: var(--theme-color-grey-lighter);color: var(--theme-body-color);}
.accordion-panel .accordion-toggle:hover {background-color: var(--theme-color-hover);color:white;}
.accordion-panel .accordion-toggle .arrow {transition: transform 0.3s;margin-left: 0.5rem;}
.accordion-panel .accordion-toggle.collapsed .arrow {transform: rotate(-180deg);}


/* Footer */
.footer {
  background-color: var(--bg-footer);
  color: var(--text-footer);
}
.footer .footer-main {
  padding-top: 4.5rem;
  padding-bottom: 3.5rem;
}
.footer .address {font-size: 1rem;}
.footer .copyright {background-color: var(--bg-footer-copyright);}
.footer .logo {filter: brightness(0) invert(1);margin-top: -1rem;}
.footer li {margin-bottom: 0.5rem;}
.footer li a,
.footer .address a,
.footer .copyright a {color:white;text-decoration:none;opacity: 0.85;}
.footer li a:hover,
.footer .address a:hover,
.footer .copyright a:hover {color:var(--text-footer-hover);opacity: 1;}


/* Navigation */
.navbar .has-subnav {position: relative;}
.navbar .sub-menu {
  position: absolute;
  z-index: 1000;
  padding: 0;
  margin-top: 10px;
  list-style: none;
  text-align: left;
  background: white;
  border-radius: var(--border-radius);
  box-shadow: 0 0 4px rgba(0,0,0,0.2);
  border-top: 3px solid var(--menu-link-color);
  box-sizing: border-box;
  visibility: hidden;
  opacity: 0;
  transition: max-height 0.3s ease-out, opacity 0.3s ease-in, margin 0.3s ease-out;
  min-width: 150px; /* for small flyouts */
}
.navbar .sub-menu.sub-menu-right {right:0;}
.navbar .sub-menu li {display: block;padding-right: 0.25rem;padding-left: 0.25rem;}
.navbar .sub-menu a {font-size: 1rem;white-space: nowrap;}
.navbar .sub-menu a:hover {}
.navbar li:hover > .sub-menu {margin-top: 0;visibility: visible;opacity: 1;}
.navbar .sub-menu .sub-menu {transition-property: none;position:absolute;}
.navbar .sub-menu li:hover > .sub-menu {left:100%;margin-left:-5px;margin-top: -40px;}

.scroll .navbar {background:var(--navbar-bg-color-start);transition: background-color 0.33s ease-in-out, border-color 0.33s ease;}
.navbar.nav-scroll,
.not-scroll .navbar {background:var(--navbar-bg-color);border-bottom: 2px solid var(--theme-color-grey-light);}
.navbar .nav-item {height:100%;}
.navbar .navbar-brand {position: relative;}
.navbar .navbar-brand img.hide {visibility: hidden;}
.scroll .navbar:not(.nav-scroll) .navbar-brand img {filter: brightness(0) invert(1);}

.navbar .has-subnav .dropdown-toggle:after {vertical-align: middle;}
.navbar .has-subnav .has-subnav .dropdown-toggle:after {transform: rotate(-90deg);}

/* custom to theme */
.navbar .nav-link {position: relative;text-decoration: none;font-size:1.1rem;font-family: "Poppins", sans-serif;font-weight: 300;}
.scroll .navbar:not(.nav-scroll) .navbar-nav > .nav-item > .nav-link {color: rgb(var(--navbar-link-color), 1);}
.scroll .navbar:not(.nav-scroll) .navbar-nav > .nav-item > .nav-link:hover,
.scroll .navbar:not(.nav-scroll) .navbar-nav > .nav-item > .nav-link:focus {color: var(--theme-color-hover);}
.scroll .navbar:not(.nav-scroll) .navbar-nav > .nav-item > .nav-link.active {color: var(--navbar-link-color-hover);}

.navbar.navbar-light .nav-item .nav-link.active {color: var(--theme-color);}
.navbar.navbar-light .nav-item .nav-link:hover,
.navbar.navbar-light .nav-item .nav-link:focus {color: var(--theme-color-hover);}

/* update breakpoint and ONLY do padding on nav here */
.navbar-expand-lg .navbar-nav > .nav-item > .nav-link {
  padding: 2.4rem 0.4rem;
  margin-right: 0.27rem;
  margin-left: 0.27rem;
}
@media (max-width: 768px) {
  .navbar .navbar-brand img {max-width: 100px;height: auto;}
}


/* 
 * Responsive Menu
 * Match breakpoint with navbar-expand-{sm,md,xl,xxl}
 * sm  575px
 * md  767px
 * lg  991px
 * xl  1199px
 * xxl 1399px
 */
@media (max-width: 991px) {

  .offcanvas-collapse {
    z-index: 1001;
    position: fixed;
    top: 0; /* set in script.js */
    bottom: 0;
    left: 100%;
    width: 310px; /* 100% or 287px for smaller canvas */
    padding-right: 1rem;
    padding-left: 1rem;
    padding-top: 2.75rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: var(--collapse-bg-color);
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    transform: translateX(-100%);
  }

  .close-icon {
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0.75rem;
    left: 1rem;
    width: 22px;
    height: 22px;
    cursor: pointer;
    z-index: 1001;
    background: var(--close-icon-color);
  }
  .close-icon:before,
  .close-icon:after {
    content: "";
    position: absolute;
    width: 13px;
    height: 2px;
    top: 50%;
    background: white;
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.5s ease;
  }
  .close-icon:after {transform: translateY(-50%) rotate(-45deg);}
  .close-icon:hover,
  .close-icon:focus {background:var(--close-icon-color-hover);}

  .navbar {} /* change navbar bg on mobile */
  .navbar .navbar-nav > li + li {border-top: 1px solid var(--collapse-border-color);}
  .navbar .dropdown-toggle:after {display: none;}
  .navbar .navbar-toggler:focus {box-shadow: none;}

  /* Customize for theme here */
  .navbar .navbar-nav a:not(.btn) {
    color: var(--menu-link-color)!important;
    font-size: 1rem!important;
    padding: 10px 0!important;
    margin-right: 0!important;
    margin-left: 0!important; 
  }
  .navbar .navbar-nav a:not(.btn):hover,
  .navbar .navbar-nav a:not(.btn):focus {color: var(--menu-link-color-hover)!important;}
  .navbar .navbar-nav a:not(.btn).active {color: var(--menu-link-color-hover)!important;}

  /* toggler icon */
  .navbar .navbar-toggler {outline:0;padding:0;font-size:2rem;}
  .scroll .navbar:not(.nav-scroll) .navbar-toggler .toggler-icon {filter: brightness(0) invert(1);}

  /* offcanvas overlay */
  .navbar .navbar-toggler.open:before {
    z-index: -1;
    content: "";
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(17,17,17,0.5);
    opacity:1;
    transition: opacity ease-in-out 0.2s;
  } 
  .navbar .navbar-toggler:before {width:0px;opacity:0;}

  .navbar li .sub-menu {
    overflow: hidden;
    margin-top: 0!important;
    padding: 0;
    background-color: var(--collapse-bg-color);
    opacity: 1;
    display: block;
    visibility: visible;
    max-height: 0;
    transition: none;
    width: 100%;
  }
  .navbar .sub-menu li .sub-menu {left: 0px!important;margin-left: 0px!important;}
  .navbar .sub-menu li:first-child > a {padding-top: 0!important;}
  .navbar .sub-menu li:last-child > a {padding-bottom: 15px!important;}
  .navbar .sub-menu .sub-menu li:last-child > a {padding-bottom: 5px!important;}

  .navbar li .sub-menu.active {
    max-height: 36rem;
    position: relative;
    z-index: 999;
    box-shadow: none;
    transition: max-height 1s ease-in-out;
  }
  .navbar li .sub-menu:not(.active) {
    position: relative;
    box-shadow: none;
    max-height: 0;
    transition: max-height 0.5s ease-out;
  }

  .navbar .sub-menu {border: none;}
  .navbar .sub-menu a {padding-left: 0.8em;font-size: 1.1rem;}
  .navbar .sub-menu a:hover {}

  .navbar .has-subnav .toggle-link {
    display: flex;
    justify-content: center;
    position: absolute;
    top: 4px;
    right: 0;
    width: 40px;
    height: 40px;
    cursor: pointer;
    z-index: 1001;
  }
  .navbar .has-subnav .toggle-link:before,
  .navbar .has-subnav .toggle-link:after {
    content: "";
    position: absolute;
    width: 16px;
    height: 2px;
    top: 50%;
    background: var(--collapse-link-color);
    transform: translateY(-50%) rotate(0);
    transition: transform 0.5s ease;
  }
  .navbar .has-subnav .toggle-link:not(.active):after {
    transform: translateY(-50%) rotate(270deg);
  }

}

.nav-search .search-toggle {
  position: relative;
  display: inline-block;
  line-height: 1.6;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  color: var(--theme-color);
  background-color: transparent;
  border: 1px solid transparent;
  z-index: 21;
}
.nav-search .search-toggle:before {
  display: inline-block;
  font-style: normal;
  font-weight: 300;
  font-size: 1.5rem;
  text-align: center;
  width: 1.5rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: 'Font Awesome 6 Sharp';
  content: "\f002";
}
.nav-search.active .search-toggle:before {
  display: inline-block;
  font-style: normal;
  font-weight: 300;
  font-size: 1.5rem;
  text-align: center;
  width: 1.5rem;
  color: var(--theme-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: 'Font Awesome 6 Sharp';
  content: "\f057";
}
.nav-search .search-toggle:hover {
  color: var(--theme-color-hover);
}
.scroll .navbar:not(.nav-scroll) .nav-search .search-toggle {filter: brightness(0) invert(1);}

.search-field.form-control {
  appearance: auto;
  box-shadow: none;
}

.nav-search form {
  position: absolute;
  left: -99999px;
  pointer-events: none;
  visibility: hidden;
  transition: opacity 200ms ease-in-out;
  opacity: 0;
  top: 0;
  bottom: 0;
  z-index: 20;
  background: var(--navbar-color); /* change to navbar bg color */
}
.nav-search.active form {
  left: 1rem;
  right: 3rem;
  pointer-events: auto;
  visibility: visible;
  opacity: 1;
}
.nav-search form > input {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

@media (max-width: 575px) {
  .nav-search.active form {
    left: 0.75rem;
    margin-right: 0.33rem;
  }
}
@media (max-width: 991px) {
  .nav-search.active form {
    right: 6.575rem;
  }
}