/* Import default styles
----------------------------------------*/
@import "../../../../wabs_sitepackage_park/Resources/Private/Scss/fonts";
@import "../../../../wabs_sitepackage_park/Resources/Private/Scss/variables";
@import "fonts";
@import "variables";
@import "../../../../wabs_sitepackage_park/Resources/Private/Scss/park-styles";

/* Imports
----------------------------------------*/

@import "base";
@import "form-elements";
@import "navigations";
@import "mega-menu";
@import "header";
@import "cards";
@import "multiselect";
@import "newsletter";
@import "slider";
@import "info-popup";
@import "social";
@import "feature-items";
@import "filter-elements";
@import "events";
@import "reviews";
@import "badge";
@import "button";
@import "weatherinfo";
@import "attraction-details";


.news .news-body p {
  font-weight: 400;
  font-family: "Gotham", sans-serif;
}

li.text-center {
  font-family: "Gotham", sans-serif;
}

.form-text {
  color: #000000;
}

.form-label {
  margin-bottom: 10px;
}

.actions nav.form-navigation .submit .btn {
  border-radius: 0;
}

#languageLightbox .row .ff-round.ff-md:focus-visible {
  outline: none;
}

#languageLightbox .lightbox {
  overflow: visible !important;
}

.feature-items .container {
  @include media-breakpoint-down(md) {
    margin-top: 0;
  }
}

.content-main {
  @include media-breakpoint-down(md) {
    padding-top: 0;
  }
}

/* FAQ Accordion */
.accordion .accordion-element.card {
  background: none;

  .card-header {
    background: $tertiary-color;
    position: relative;

    .card-title {
      color: $primary-color;
      font-weight: $font-weight-bold;
      padding-top: 10px;
      padding-bottom: 10px;
      padding-right: 25px;
      position: initial;

      a:hover {
        text-decoration: none;
      }
    }
  }

  .card-body {
    margin-top: 0 !important;
    border: 3px solid $tertiary-color;
  }
}

/* Cookies */
#klaro {
  .klaro.we_cookie_consent {

    .cookie-notice,
    .cookie-modal {

      .cn-body,
      .cm-modal.cm-klaro,
      .cm-modal.cm-klaro .cm-footer {
        background: $tertiary-color;

        p {
          color: $black;

          a {
            color: $black;
          }
        }

        .cm-header h1 {
          color: $black;
        }
      }
    }
  }
}

header h1 {
  color: $secondary-color;
  font-weight: 700;
}

.container.twocol-50-50 .row.col2-grid.frame-space-before- .col-sm-12.col-md-6.col-lg-6:first-child {
  margin-bottom: 0px;
}

.events-cont .events-highlights ul {
  display: flex;
  flex-wrap: wrap;
}

.events-cont .events-highlights ul li {
  color: #000000;
  flex: 0 0 auto;
  width: calc(50% - 17px);
  font-size: 0.875rem;
}

section.frame-bg-blue {
  background: #009CDE;
  padding: 40px 0px;

  >.container {
    padding-bottom: 0px;
  }

  header h2 {
    color: #ffffff;
  }

  .image-slider {
    .owl-carousel {
      .owl-dots {
        button.owl-dot {
          background: #ffffff;

          &.active {
            background: #FFB718;
            box-shadow: #FFB718 0 0 0 3px;
          }
        }
      }

      .owl-nav {

        .owl-prev,
        .owl-next {

          &::before,
          &::before {
            box-shadow: inset #FFB718 0 0 0 2px !important;
            background: url(../../Images/Gruppe_119-yellow.svg) no-repeat center center !important;
          }
        }
      }
    }
  }
}

.image-wall {
  .col.col-6 {
    .figure {
      padding-bottom: 20px;

      span.image-title {
        display: block;
        margin-top: 10px;
        max-width: 200px;
      }
    }
  }
}

.copy-rights {
  background: #454548;

  &>.container {
    border-top: 1px solid #e5e5e5;
    padding-top: 15px;
  }
}

.footer-main .copy-rights {
  width: 100%;
  float: left;
  background: #454548;
  padding: 25px 0;
  text-align: center;
  text-decoration: none !important;
}

.footer-logo {
  max-height: 40px;
  margin-right: 15px;
}

.footer-text {
  color: #ffffff;
}

.event-card {
  .row {
    .col-sm-6.col-md-6.col-lg-4 {
      @include media-breakpoint-down(lg) {
        width: 100%;
      }
    }
  }

  .item {
    padding-bottom: 0px !important;

    .card {
      background: #ffffff;
      border: 1px solid #000000;

      .content {
        padding: 15px 20px;

        @include media-breakpoint-down(lg) {
          padding: 5px 15px 5px 15px;
        }

        .title {
          h3 {
            display: none;
          }

          p {
            text-align: left;
            font-size: 18px;
            line-height: 24px;

            @include media-breakpoint-down(md) {
              font-size: 16px;
              line-height: 20px;
              padding-top: 0px;
            }
          }
        }
      }
    }
  }
}

.owl-carousel .owl-item .item.h-100 {
  height: auto !important;
}

.sticky-form {
  .frame-type-form_formframework {
    form {
      margin: 0px 0px;
      border: 1px solid #000000;
      font-family: "Roboto";
      padding-bottom: 20px;

      h2 {
        font-size: 1rem;
        background: #FFB718;
        padding: 5px 10px;
        margin-bottom: 10px;
      }

      p {
        padding: 0px 10px;
        margin-bottom: 10px;
        font-size: 0.8rem;
        line-height: 1rem;
      }

      .form-group {
        padding: 0 10px 10px 10px;

        label.form-label {
          display: none;
        }

        input {
          height: 28px;
        }

        input,
        .form-control {
          border-radius: 0;
          padding: 5px 10px;
          font-size: 0.7rem;
          background: #e3e3e4;
          border: none;
        }

        .input.checkbox {
          position: relative;

          .form-text {
            font-weight: 400;
            font-size: 0.6rem;
            line-height: 1.3;
            padding-left: 17px;
            height: 36px;
            overflow-y: scroll;
          }

          .form-check {
            padding-left: 0px;
            position: absolute;
            left: 0;
            top: -6px;

            label {
              margin-bottom: 0px;

              input.add-on {
                top: 0px;
                height: 12px;
                width: 12px;
                margin-right: 0px;
              }
            }
          }
        }

        textarea.form-control {
          height: 80px;
        }
      }

      .actions {
        nav.form-navigation {
          span.next.submit button {
            font-size: 0.8rem;
            padding: 6px 10px;
            margin-top: 5px;
            min-width: auto;
          }

          * {
            width: 100%;
            display: block;
          }

          .btn-toolbar {
            padding-right: 15px;

            .btn-group {
              margin-top: 0px;
            }
          }
        }
      }
    }
  }

  figure.table {
    table {
      tbody {
        tr {
          background: transparent;

          td {
            font-size: 20px;
            line-height: 28px;
            font-family: "Roboto";
          }

          figure.table {
            table {
              width: 100%;
              margin-top: 20px;

              tbody {
                tr {
                  display: flex;
                  padding: 0;
                  gap: 20px;

                  @include media-breakpoint-down(lg) {
                    flex-wrap: wrap;
                  }

                  td {
                    display: flex;
                    padding-right: 0px !important;
                    font-size: 14px;
                    line-height: 22px;
                    flex-direction: column;
                    position: relative;
                    padding-left: 70px;
                    padding-top: 5px;
                    flex: 0 0 auto;
                    width: 50%;

                    @include media-breakpoint-down(lg) {
                      width: 100%;
                    }

                    br {
                      display: none;
                    }

                    span {
                      &:nth-of-type(2) {
                        position: absolute;
                        left: 0;
                        top: 0;
                        background: #e3e3e4;
                        width: 54px;
                        height: 54px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        border-radius: 50%;

                        .fa-solid,
                        .fas {
                          font-weight: 900;
                          font-size: 24px;
                          color: #FFB718;
                        }
                      }
                    }

                    a {
                      color: #000000;
                      font-size: 18px;
                      font-weight: 500;
                    }
                  }
                }
              }
            }

          }
        }
      }
    }
  }

  .nav-link-first {
    background-color: #fcb813; 
    color: #000;  
    font-weight: bold; 
    padding: 0px 16px; 
    display: inline-flex;
    align-items: center;
    text-decoration: none; 
    border: none;  
    margin-right: 11px; 
    position: none; 

    &::before {
      background: none;
    }
  }

  .frame-type-news_categorylist {
    .news {
      ul.nav.nav-list {
        flex-direction: row !important;
        row-gap: 9px;

        li.nav-item {
          float: none;
          padding: 0;
          margin-right: 10px;

          &::before {
            display: none;
          }

          &:last-child {
            order: 1;
          }

          a.nav-link {
            font-size: 0.9rem;
            border: 0.05em solid #727277;
            padding: 6px 10px;
            transition: 0.3s all;

            &:hover {
              background: #eee;
            }

            &.active {
              background: #727277;
              border-color: #727277;
              color: #ffffff;
            }
          }
        }
      }
    }
  }

  .frame-type-news_newsliststicky {
    .news {
      .news-list-view {
        display: flex;
        flex-wrap: wrap;
        --bs-gutter-x: 20px;
        --bs-gutter-y: 20px;
        margin-top: calc(-1 * var(--bs-gutter-y));
        margin-right: calc(-.5 * var(--bs-gutter-x));
        margin-left: calc(-.5 * var(--bs-gutter-x));

        .article {
          flex: 0 0 auto;
          width: 50%;
          margin-bottom: 0px;
          padding-right: calc(var(--bs-gutter-x) * .5);
          padding-left: calc(var(--bs-gutter-x) * .5);
          margin-top: var(--bs-gutter-y);
          margin-bottom: 0px;
          padding-bottom: 0px;

          @include media-breakpoint-down(sm) {
            width: 100%;
          }

          .footer {
            display: none;
          }

          .press-card {
            border: 1px solid #727277;
            padding: 15px;
            height: 100%;
            font-family: "Roboto";
            font-size: 14px;
            transition: 0.3s all;

            &:hover {
              background: #727277;
              color: #eee;
              h3{
                color: #eee;
              }
            }

            .header {
              h3 {
                padding-bottom: 8px;
                font-size: 22px;

                a:hover{
                  color: #fff;
                } 
              }
            }

            .media-image {
              margin-bottom: 15px;

              img {
                width: 100%;
              }
            }
          }
        }
      }
    }
  }


  .frame-type-form_formframework {
    background: #fff;
    z-index: 1000;

    @include media-breakpoint-down(md) {
      position: static;
    }

    &.fixed-top {
      position: fixed;
      top: 90px;
      right: auto;
      left: auto;
      z-index: 1030;
      @include media-breakpoint-down(md) {
        position: static;
        max-width: 100%;
      }
    }
  }

  .item {
    .figure .row {
      --bs-gutter-x: 1.3rem;
      --bs-gutter-y: 1.3rem;
    }
  }
}

.frame-type-news_newsdetail {
  .news.news-single {
    .article {
      .media-image {
        margin-bottom: 40px;

        >a {
          >img {
            width: 100%;
            height: auto;
          }
        }
      }

      .tab-wrapper {
        .nav-tabs {
          gap: 15px;

          .nav-item {
            border-radius: 0px 0px 0 0;
            background-color: transparent !important;

            .nav-link {
              border-radius: 0px 0px 0 0;
              background-color: transparent !important;
              border: 1px solid #FFB718;
              font-size: 16px;
              padding: 10px 12px;
              color: #000;
              transition: 0.3s all;
              margin-bottom: 0;

              &.active,
              &:hover {
                background-color: #FFB718 !important;
              }
            }
          }
        }

        .tab-content {
          background-color: transparent !important;
          padding: 0px !important;
          border-radius: 0px 0px 0 0;

          .item {
            .figure .row {
              --bs-gutter-x: 1.3rem;
              --bs-gutter-y: 1.3rem;
            }

            &.h-100 {
              height: auto !important;
            }
          }

          .tab-pane {
            >.container {
              padding: 0px !important;
            }
          }
        }
      }
    }
  }
}

@media screen and (max-width: 767px) {
  .owl-carousel .owl-dots button.owl-dot {
    width: 13px;
    height: 13px;
    margin: 5px;
  }

}