/**
 * Styles for accordions
 *
 * These styles attempt to unify the appearance of different types of accordions we use
 * on our sites, including the CKEditor Accordion plugin and TabPanelWidget displays
 * for QuickTabs, Views, and wherever else they may be used.
 */
/**
 * Default Variables.
 *
 * Modify this file to provide default Bootstrap Framework variables. The
 * Bootstrap Framework will not override any variables defined here because it
 * uses the `!default` flag which will only set their default if not already
 * defined here.
 *
 * You can copy existing variables directly from the following file:
 * ./meric/bootstrap/assets/stylesheets/bootstrap/_variables.scss
 */
@import url(https://fonts.googleapis.com/css?family=Francois+One|Merriweather:400,700&display=swap);
/* font-size for accordion headers */
/* color for accordion headers */
/* background color for accordion content */
/* background color for accordion headers */
/* width and height of the icons */
/* DO NOT include "#" */
/* square | round */
/* for the chevron's transition */
/**
 * Begin actual styles
 *
 * Using Classy subtheme identifier for specificity. Maintain indentation below here.
 */
.base-theme--classy {
  /**
   * TabPanelWidget style overrides
   *
   * Comments from original styles are included.
   *
   * https://github.com/tabpanelwidget/tabpanelwidget/blob/master/src/tabpanelwidget.scss
   */
  /**
   * HEADERS
   * MAKE SURE to style these HEADERs when they get focus since "outline" has been disabled
   * You may want to style the text in the HEADERs as the same color as your links
   */
  /**
   * PANEL
   */
  /**
   * ICONS on ALL HEADERS
   */
  /**
   * CKEditor Accordion style overrides
   *
   * https://git.drupalcode.org/project/ckeditor_accordion/-/blob/8.x-1.x/css/ckeditor-accordion.css
   */
}

.base-theme--classy .tpw-tabpanel h2:not(.tpw-selected) .tpw-tab:hover {
  cursor: pointer;
}

.base-theme--classy .tpw-accordion .tpw-header {
  font-size: calc(1em * 1.3);
  background-color: #4a87b5;
  border-color: #4a87b5;
  color: #ffffff;
  padding: 0.65rem 1rem;
}

.base-theme--classy .tpw-accordion .tpw-header:hover {
  cursor: pointer;
  text-decoration: underline;
}

.base-theme--classy .tpw-disconnected .tpw-header,
.base-theme--classy .tpw-disconnected .tpw-panel {
  border-radius: 0 !important;
}

.base-theme--classy .tpw-accordion [aria-expanded=true] {
  color: #ffffff;
}

.base-theme--classy .tpw-accordion .tpw-shim:not([hidden]) .tpw-panel {
  background-color: #D7E7F0;
}

.base-theme--classy .tpw-disconnected.tpw-accordion .tpw-panel {
  border-radius: 0;
}

.base-theme--classy .tpw-accordion .tpw-header::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' stroke-width='5' stroke='%23ffffff' fill='none' stroke-linecap='square' stroke-linejoin='square'%3E%3Cpath stroke='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpolyline points='6 15 12 9 18 15'%3E%3C/polyline%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' stroke-width='5' stroke='%23ffffff' fill='none' stroke-linecap='square' stroke-linejoin='square'%3E%3Cpath stroke='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpolyline points='6 15 12 9 18 15'%3E%3C/polyline%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' stroke-width='5' stroke='%23ffffff' fill='none' stroke-linecap='square' stroke-linejoin='square'%3E%3Cpath stroke='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpolyline points='6 15 12 9 18 15'%3E%3C/polyline%3E%3C/svg%3E");
}

.base-theme--classy .ckeditor-accordion-container > dl dt > a {
  padding-left: 1rem;
}

.base-theme--classy .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' stroke-width='5' stroke='%23ffffff' fill='none' stroke-linecap='square' stroke-linejoin='square'%3E%3Cpath stroke='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpolyline points='6 15 12 9 18 15'%3E%3C/polyline%3E%3C/svg%3E") 50% 50% no-repeat;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' stroke-width='5' stroke='%23ffffff' fill='none' stroke-linecap='square' stroke-linejoin='square'%3E%3Cpath stroke='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpolyline points='6 15 12 9 18 15'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: contain;
  width: 1em;
  height: 1em;
  margin-top: calc(-0.5 * 1em);
  margin-left: calc(100% - 3rem);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  transform-origin: 50% 50%;
  -webkit-transition: none;
  transition: all 300ms cubic-bezier(0.655, -0.315, 0.515, 1.365);
}

.base-theme--classy .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:before,
.base-theme--classy .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:after {
  content: none;
}

.base-theme--classy .ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle {
  transform: rotate(0deg);
}
