/* Dark/Light Mode Support Modifications
-------------------------------------------------- */
a, a:hover {
    color: var(--link-white-color);
}

nav {
    color: var(--link-white-color);
    background-color: var(--bg-color);
}

body {
    color: var(--link-white-color);
    background-color: var(--bg-color);
}

.dropdown-menu {
    background: var(--bg-color);
}

.dropdown-item {
    color: var(--link-white-color);
}

hr {
    background-color: var(--link-white-color);
    height: 1px;
    border: 0;
}

/* Dark/Light Mode Support
-------------------------------------------------- */
/*Light*/

  :root {
      --font-color: #000;
      --reverse-font-color: #fff;
      --link-color: #000;
      --link-white-color: rgb(57,57,57);
      --bg-color: rgb(255,255,255);
      --pagefind-ui-scale: 1;
      --pagefind-ui-primary: #034ad8;
      --pagefind-ui-text: #393939;
      --pagefind-ui-background: #ffffff;
      --pagefind-ui-border: #eeeeee;
      --pagefind-ui-tag: #eeeeee;
      --pagefind-ui-border-width: 2px;
      --pagefind-ui-border-radius: 8px;
      --pagefind-ui-image-border-radius: 8px;
      --pagefind-ui-image-box-ratio: 3 / 2;
      --pagefind-ui-font: sans-serif;
  }
  /*Dark*/
  [data-theme="dark"] {
      --font-color: #fff;
      --reverse-font-color: #000;
      --link-color: #0a86da;
      --link-white-color: #EBEBEB;
      --bg-color: #333;
      --pagefind-ui-primary: #fff;
      --pagefind-ui-text: #fff;
      --pagefind-ui-background: #fff;
      --pagefind-ui-border: #152028;
      --pagefind-ui-tag: #152028;
  }
  * {
    margin: 0;
    padding: 0;
    list-style-type: none;
    box-sizing: border-box;

  }

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

  p:first-letter {
    font-size: 20px;
    font-weight: bold;
  }
  p + p {
    margin-top: 10px;
  }

  input[type=radio] {
    display: none;
  }

  .input-radio-open:not(:checked) ~ .element__header .header__title--open {
    display: block;
  }
  .input-radio-open:not(:checked) ~ .element__header .header__title--close {
    display: none;
  }
  .input-radio-open:not(:checked) ~ .element__content {
    height: 0;
    opacity: 0;
    overflow: hidden;
  }
  .input-radio-open:checked ~ .element__header .header__title--open {
    display: none;
  }
  .input-radio-open:checked ~ .element__header .header__title--close {
    display: block;
  }
  .input-radio-open:checked ~ .element__content {
    height: 210px;
    opacity: 1;
    overflow: auto;
  }

  .accordeon {
    align: left;
    max-width: 320px;
    margin: 0 auto;
  }
  @media screen and (min-width: 640px) {
    .accordeon {
      max-width: 640px;
    }
  }
  @media screen and (min-width: 960px) {
    .accordeon {
      max-width: 960px;
    }
  }

  .accordeon__element {
    margin-top: 10px;
  }

  .header__title {
    background-color: var(--link-white-color);
    text-align: left;
    padding: 10px 10px;
    color: var(--reverse-font-color);
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.25s ease;
  }
  .header__title .fa {
    margin-right: 10px;
  }
  .header__title:hover {
    color: rgb(147,158,174);
    background-color: var(--link-white-color);
  }

  .element__content {
    padding: 0 10px;
    transition: height 0.25s ease, opacity 0.25s ease, padding 0s ease;
  }

  .content__wrapper {
    color: #888;
    margin-top: 10px;
    padding: 10px;
    border-left: 1px solid #ee875d;
  }

  span {
    color: var(--link-white-color);
  }

  h5 {
    text-transform: uppercase;
  }


.fancybox__container {
  --fancybox-color: #0d0c22;
  --fancybox-bg: #000;
  --f-spinner-color-1: rgba(48, 17, 17, 0.1);
  --f-spinner-color-2: rgba(17, 24, 28, 0.8);

  flex-direction: column-reverse;
}

.fancybox__toolbar {
  --f-button-bg: #f3f3f4;
  --f-button-hover-bg: #e7e7e9;
  --f-button-active-bg: #e7e7e9;
  --f-button-color: #0d0c22;
  --f-button-hover-color: #0d0c22;

  --f-button-border-radius: 8px;

  --f-button-svg-width: 20px;
  --f-button-svg-height: 20px;

  --f-button-svg-stroke-width: 1.5;
  --f-button-svg-filter: none;

  padding: 30px;
  z-index: 10;
}

.fancybox__slide {
  padding: 12px 0px;
}

.fancybox__thumbs.is-classic {
  --f-thumb-gap: 3px;
  --f-thumb-width: 88px;
  --f-thumb-height: 66px;
  --f-thumb-opacity: 1;
  --f-thumb-outline: 3px;
  --f-thumb-outline-color: #ea4c89;
  --f-thumb-border-radius: 6px;
  --f-thumb-offset: 4px;

  padding: 10px 100px 10px 26px;
  border-bottom: 2px solid #f3f3f4;
}

/* Align thumbnails on right side if not draggable */
.f-thumbs__viewport:not(.is-draggable) .f-thumbs__track {
  justify-content: flex-end;
}

.f-thumbs__slide__img {
  border-radius: 7px;
}
