/*
Theme Name: Kolibri TwentyFiveee
Version: 2025
Author: done in house
*/
/* ------ RESET ------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

ul,
ol[role="list"] {
  list-style: none;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smooth: never;
}

html:focus-within {
  scroll-behavior: smooth;
}

img,
picture,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

input,
button,
textarea,
select {
  font: inherit;
}

/* ------ RESET END ------- */
/* =======================================================================
// DESIGN SYSTEM
// =====================================================================*/
/* REFERENCE VARIABLES */
:root {
  --k-col-accent: var(--k-col-sienna);
}

/* COLORS */
:root {
  /* Theme Colors */
  --k-col-paper: var(--wp--preset--color--paper);
  --k-col-ink: var(--wp--preset--color--ink);
  --k-col-dark: var(--wp--preset--color--dark);
  --k-col-medium: var(--wp--preset--color--medium);
  --k-col-light: var(--wp--preset--color--light);
  --k-col-light-a: #49452c1f;
  --k-col-shadow: var(--wp--preset--color--shadow);
  --k-col-shadow-a: #49452c0d;
  --k-col-highlight: var(--wp--preset--color--highlight);
  --k-col-overlay: #ffffff;
  --k-col-zero: #ffffff00;
  --k-col-fade-a: #f6f6f3cc;
  /* Brand Colors */
  --k-col-orange: var(--wp--preset--color--orange);
  --k-col-tuerkis: var(--wp--preset--color--tuerkis);
  --k-col-blau: var(--wp--preset--color--blau);
  --k-col-violett: var(--wp--preset--color--violett);
  --k-col-gelb: var(--wp--preset--color--gelb);
  --k-col-rot: var(--wp--preset--color--rot);
  --k-col-lavender: var(--wp--preset--color--lavender);
  --k-col-gruen: var(--wp--preset--color--gruen);
  --k-col-sienna: var(--wp--preset--color--sienna);
  --k-col-kobalt: var(--wp--preset--color--kobalt);
  --k-col-petrol: var(--wp--preset--color--petrol);
  --k-col-himmel: var(--wp--preset--color--himmel);
}

/* TYPOGRAPHY */
/* Size */
:root {
  --k-display-huge: var(--wp--preset--font-size--xxxx-large);
  --k-display-xlarge: var(--wp--preset--font-size--xxx-large);
  --k-display-large: 55px;
  --k-text-huge: var(--wp--preset--font-size--xx-large);
  --k-text-xlarge: var(--wp--preset--font-size--x-large);
  --k-text-large: var(--wp--preset--font-size--large);
  --k-text-default: var(--wp--preset--font-size--text);
  --k-text-medium: var(--wp--preset--font-size--medium);
  --k-text-small: var(--wp--preset--font-size--small);
  --k-text-xsmall: var(--wp--preset--font-size--extra-small);
}

/* Fonts */
:root {
  --k-font-display: var(--wp--preset--font-family--display);
  --k-font-serif: var(--wp--preset--font-family--serif);
}

/* Decoration */
:root {
  --k-font-u-off: 0.17em;
  --k-font-u-thick: 0.093em;
}

/* POSITION */
/* Width*/
:root {
  --k-sitewidth-wide: var(--wp--style--global--wide-size);
  --k-sitewidth-narrow: var(--wp--style--global--content-size);
}
/* Padding*/
:root {
  --k-padding-page: clamp(30px, -136.7px + 16.67vw, 80px);
  --k-padding-section: 100px;
  --k-padding-section-xl: 200px;
}

/* Horizontal Scroll*/
:root {
  --k-padding-scroll-wide: calc((100% - var(--k-sitewidth-wide)) / 2);
}


/* z index */
:root {
  --k-z-overlay: 10;
  --k-z-menu: 100;
  --k-z-float: 500;
  --k-z-popover: 1000;
}

/* STYLE */
/* Border Radius */
:root {
  --k-rad-s: 5px;
  --k-rad-m: 8px;
  --k-rad-inf: 10000px;
}

/* Shadow */
:root {
  --k-shad-float: 0 3px 11px 0 rgba(0, 0, 0, 0.09),
    0 0 2px 0 rgba(0, 0, 0, 0.12);
}

/* =======================================================================
// COMPONENTS
// =====================================================================*/

/* TEXT STYLES */

.k-prehead {
  font-style: normal;
  font-weight: 600;
  font-size: var(--k-text-default);
  letter-spacing: 0.2px;
  text-transform: uppercase;
  color: var(--k-col-dark);
}

/* BUTTON */

button {
  all: unset;
  cursor: pointer;
}

.k-button {
  all: unset;
  cursor: pointer;
  color: var(--k-col-accent);
  text-align: center;
  font-family: var(--k-text-smallerif);
  font-size: var(--k-text-default);
  letter-spacing: var(--k-text-default-ls);
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  justify-content: center;
  width: fit-content;
}


.k-button.primary {
  padding: 7px 18px;
  border-radius: var(--k-rad-inf);
  background-color: var(--k-col-accent);
  color: var(--k-col-paper);

}
.k-button.primary:hover {
  background-color: color-mix(in srgb, var(--k-col-accent) 90%, black 10%);
}

.k-button.secondary {
  padding: 7px 18px;
  border-radius: var(--k-rad-inf);
  box-shadow: inset 0 0 0 2px var(--k-col-accent);
}
.k-button.secondary:hover {
  box-shadow: inset 0 0 0 3px var(--k-col-accent);
}

.k-button.tertiary {
  padding: 7px 18px;
  font-style: italic;
  border-radius: unset;
  background: var(--k-col-zero);
  border-radius: var(--k-rad-inf);
  box-shadow: inset 0 0 0 0px var(--k-col-accent);
}
.k-button.tertiary span {
  text-decoration: none;
  text-underline-offset: var(--k-font-u-off);
  text-decoration-thickness: var(--k-font-u-thick);
}
.k-button.tertiary i {
  text-decoration: none;
}

.k-button.small {
  font-style: italic;
  font-weight: 400;
  padding: 7px 0px;
}
.k-button.tertiary.small:hover {
  background: unset;
}
.k-button.small span {
  text-decoration: underline;
  text-underline-offset: var(--k-font-u-off);
  text-decoration-thickness: var(--k-font-u-thick);
}
.k-button.small i {
  text-decoration: none;
}

.k-button.large.tertiary {
  font-size: var(--k-text-medium);
  font-style: italic;
  font-weight: 400;
  padding: 7px 0px;
}
.k-button.large.tertiary:hover {
  background: unset;
}
.k-button.large.tertiary span {
  text-decoration: underline;
  text-underline-offset: var(--k-font-u-off);
  text-decoration-thickness: var(--k-font-u-thick);
}
.k-button.large.tertiary i {
  text-decoration: none;
}


/* LINK */

.k-link {
  font-size: var(--k-text-default);
  color: var(--k-col-accent);
  display: inline-flex;
  align-items: end;
  gap: 2px;
}
.k-link i::before {

}
.k-link span {
  font-style: italic;
  text-decoration: underline;
  text-underline-offset: var(--k-font-u-off);
  text-decoration-thickness: var(--k-font-u-thick);
}
.k-link i {
  line-height: 1.2;
}



.k-link.small {
  font-size: var(--k-text-small);
  color: var(--k-col-dark);
}
.k-link.small i::before {

}


/* INPUT: Text Field */

.woocommerce-form-row, #loginform p {
  display: flex;
  flex-direction: column;
}
.woocommerce-form-row label, #loginform p label, label {
  font-size: var(--k-text-small);
  color: var(--k-col-dark);
}

input[type=text], input[type=email], input[type=password] {
  background-color: var(--k-col-light-a);
  border: none;
  border-radius: 5px;
  font-family: system-ui;
  padding: 8px 6px;
  font-size: 1rem !important;
  width: 100%;
}

fieldset {
  border: 0;
}

/* INPUT: Select */

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: var(--k-col-light-a);
  border: none;
  border-radius: 5px;
  font-family: system-ui;
  padding: 8px 6px;
  font-size: 1rem !important;
  width: 100%;
}

/* INPUT: Checkbox */

input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 18px !important;
  height: 18px !important;
  border: none;
  border-radius: 3px;
  background: var(--k-col-light-a);
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
}
input[type="checkbox"]::after {
  content: "\e943";
  font-family: 'kolibri';
  font-size: 16px;
  color: var(--k-col-ink);
  position: absolute;
  top: -4px;
  left: 1px;
  opacity: 0;
  pointer-events: none;
}
input[type="checkbox"]:checked::after {
  opacity: 1;
}

.woocommerce-form__label-for-checkbox{
  font-size: var(--k-text-small);
  color: var(--k-col-ink);
  display: flex;
  align-items: flex-start;
  gap: 5px;
}

.registration-form-mailpoet > label {
  font-size: var(--k-text-small);
  color: var(--k-col-ink);
  display: flex;
  align-items: flex-start;
  gap: 5px;
}

.woocommerce-form__label-for-checkbox input{
  top: 2px;
}

/* CHIP */


.k-chip{
    padding-top: 5px; padding-bottom: 5px;
    padding-left: 13px; padding-right: 13px;
    border-radius: var(--k-rad-inf);
    background-color: var(--k-col-light);
    color: var(--k-col-ink);
    font-size: 1.06em;
    font-weight: 400;
    display: flex;
    gap: 4px;
}

.k-chip.secondary{
    background-color: unset;
    border: 1.5px solid var(--k-col-ink);
}

.k-chip.tertiary{
    background-color: unset;
    border: unset;
    padding-left: unset; padding-right: unset;
}




/* HORIZONTAL SCROLL CAROUSEL */

.carousel-scroll-container {
  overflow: scroll;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scroll-padding:  var(--k-padding-scroll-wide);
  scrollbar-width: none;
}
.carousel-scroll-container::-webkit-scrollbar {
  display: none;
}
.carousel-scroll-container ul {
  display: inline-flex;
  gap: 50px;
  padding-left: var(--k-padding-scroll-wide);
  padding-right: var(--k-padding-scroll-wide);
}

@media only screen and (max-width: 1650px) {
  .carousel-scroll-container ul {
    padding-left: var(--k-padding-page);
    padding-right: var(--k-padding-page);
  }

}



/* =======================================================================
// GLOBAL STRUCTURE
// =====================================================================*/

/* GLOBAL LAYOUT */

.regular-size {
  max-width: var(--k-sitewidth-narrow);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--k-padding-page);
  padding-right: var(--k-padding-page);
  box-sizing: content-box !important;
}
.wide-size {
  max-width: var(--k-sitewidth-wide);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--k-padding-page);
  padding-right: var(--k-padding-page);
  box-sizing: content-box !important;
}
.full-size {
  max-width: none;
}

.section {
  margin-top: var(--k-padding-section);
  margin-bottom: var(--k-padding-section);
}

/* WP SUPPORT */

.wp-site-blocks > * {
  max-width: var(--k-sitewidth-narrow);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--k-padding-page);
  padding-right: var(--k-padding-page);
  box-sizing: content-box !important;
}
.wp-site-blocks > .alignwide {
  max-width: var(--k-sitewidth-wide);
}
.wp-site-blocks > .alignfull {
  max-width: none;
}
.wp-site-blocks > .alignleft {
  float: left;
  margin-right: 2em;
}
.wp-site-blocks > .alignright {
  float: right;
  margin-right: 2em;
}


/* HEADER */
#global-header-spacer {
  height: 65px;
  margin-bottom: 40px;
}

header.global {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: var(--k-z-menu);
  display: block;
  margin: 0;
  background-color: var(--k-col-paper);
  border-bottom: 1.5px solid var(--k-col-light-a);
  transition: all 0.1s ease;
}

header.global .container {
  padding-left: var(--k-padding-page);
  padding-right: var(--k-padding-page);
  max-width: 2000px;
  margin: 0 auto;
  height: 70px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

header.global #logo {
  width: 36px;
  position: absolute;
  left: 50%;
  margin-left: -18px;
  z-index: 3;
  transition: all 0.3s;
}

header.global .button-nav-main {
  display: none;
}

header.global #nav-main {
  list-style: none;
  font-size: var(--k-text-default);
  align-self: start;
  display: flex;
  gap: 30px;
}

header.global #nav-main > li {
  display: flex;
  align-items: center;
  height: 70px;
}

#nav-main > li > a {
  position: relative;
  cursor: pointer;
}

header.global #nav-main > li > a::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 1.5px;
  bottom: -1px;
  left: 0;
  background-color: var(--k-col-accent);
  transform: scaleX(0);
  transform-origin: top left;
  transition: transform 0.3s;
}

header.global #nav-main > li > a:hover::before {
  transform: scaleX(1);
}

header.global #nav-main > .current-menu-ancestor > a,
header.global #nav-main > .current-menu-item > a {
  border-bottom: 1.5px var(--k-col-accent) solid;
}

.global-header-action {
  list-style: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
}

header.global .menu.shrink {
  display: none;
}

.global-header-action .account-action .shrink {
  display: none;
}

.global-header-action .book-action .shrink {
  display: none;
}

@media only screen and (max-width: 1050px) {

  /* Shrink Navigation */
  header.global #nav-main {
    display: none;
  }

  header.global .menu.shrink {
    display: block;
  }
}

@media only screen and (max-width: 900px) {

  /* Shrink Account Button */
  .global-header-action .account-action .full {
    display: none;
  }

  .global-header-action .account-action .shrink {
    display: block;
  }
}

@media only screen and (max-width: 620px) {

  /* Shrink Book Button */
  .global-header-action .book-action .full {
    display: none;
  }

  .global-header-action .book-action .shrink {
    display: block;
  }
}

.menu-dropdown {
  background-color: #fff;
  position: absolute;
  left: 0;
  right: 0;
  z-index: -1000;
  padding-top: 70px;
  top: 0px;
  transform: translateX(0);
  transition: all 0.4s ease;
  opacity: 1;
}

li.dropdown-hidden .menu-dropdown {
  transform: translateY(-100px);
  opacity: 0;
  visibility: hidden;
}

.menu-dropdown-wrapper {
  position: relative;
  padding-left: var(--k-padding-page);
  padding-right: var(--k-padding-page);
  padding-bottom: 50px;
}

.menu-item-description {
  margin-bottom: 20px;
  font-size: var(--k-text-medium);
  font-style: italic;
  color: var(--k-col-dark);
}

ul.sub-menu {
  display: flex;
  gap: 12px;
}

ul.sub-menu li {
  display: block;
  flex-grow: 1;
  max-width: 280px;
}

span.sub-menu-head {
  letter-spacing: 0.01em;
  font-size: var(--k-text-small);
  color: var(--k-col-medium);
  margin-bottom: 10px;
  display: block;
  font-weight: 500;
  text-transform: uppercase;
}

ul.sub-menu .primary-item {
  font-size: var(--k-text-medium);
}

ul.sub-menu .current-menu-item > a {
  border-bottom: 1.5px var(--k-col-accent) solid;
}

.menu-dropdown-wrapper ul.sub-menu > li > ul {
  flex-direction: column;
}

/* FOOTER */
footer.global {
  width: 100%;
  bottom: 0;
  margin-top: var(--k-padding-section);
}

footer.global #logo {
  width: 36px;
  position: absolute;
  left: 50%;
  margin-left: -18px;
  margin-top: -60px;
}

footer.global .container {
  padding-left: var(--k-padding-page);
  padding-right: var(--k-padding-page);
  max-width: 2000px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

footer.global .container .accessory-footer {
  list-style: none;
  font-size: var(--k-text-default);
  align-self: start;
  display: flex;
  gap: 10px;
}

footer.global .container #nav-sec {
  list-style: none;
  font-size: var(--k-text-small);
  font-weight: 500;
  align-self: start;
  display: flex;
  column-gap: 20px;
  flex-wrap: wrap;
}

footer.global .container #nav-sec > li > a {
  position: relative;
  cursor: pointer;
}

footer.global .container #nav-sec li > a::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 1.5px;
  bottom: -1px;
  left: 0;
  background-color: var(--k-col-accent);
  transform: scaleX(0);
  transform-origin: top left;
  transition: transform 0.3s;
}

footer.global .container #nav-sec li > a:hover::before {
  transform: scaleX(1);
}

footer.global .container #nav-sec > .current-menu-ancestor > a,
footer.global .container #nav-sec > .current-menu-item > a {
  border-bottom: 1.5px var(--k-col-accent) solid;
}

@media only screen and (max-width: 950px) {

  /* Footer Menu Stacked */
  footer.global .container {
    flex-direction: column;
    gap: 10px;
  }
}

/* ACTION CARDS */
.action-card {
  position: fixed;
  top: 0;
  bottom: 0;
  background-color: var(--k-col-overlay);
  width: 400px;
  overflow-y: auto;
  z-index: var(--k-z-float);
  transform: translateX(0);
  transition: all 0.4s ease;
}

.action-card.left {
  left: 0;
}

.action-card.right {
  right: 0;
}

.action-card.card-hidden.left {
  transform: translateX(-400px);
  visibility: hidden;
}

.action-card.card-hidden.right {
  transform: translateX(400px);
  visibility: hidden;
}

@media only screen and (max-width: 480px) {

  /* Fullscreen Card on Small Screens */
  .action-card {
    width: 100% !important;
  }
}

.action-card .close {
  position: absolute;
  top: 10px;
  z-index: 10000;
}

.action-card .card-header {
  padding: 30px 20px 20px 20px;
  position: sticky;
  top: 0;
  background-color: var(--k-col-overlay);
}

.action-card .card-body {
  padding: 30px 20px 20px 20px;
}

/* Nav Card */
#nav-card .card-body {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

#nav-card #nav-main-card {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

#nav-card #nav-main-card li > a {
  font-size: var(--k-text-large);
}

#nav-card #nav-sec {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

#nav-card .accessory-footer {
  display: flex;
  gap: 10px;
}

#nav-card .menu-slidein {
  position: absolute;
  background-color: var(--k-col-overlay);
  top: 90px;
  bottom: 0;
}

#nav-card .menu-slidein-wrapper {
  padding-bottom: 50px;
  padding-right: 20px;
}

li.slidein-hidden .menu-slidein {
  transform: translateX(-100px);
  opacity: 0;
  visibility: hidden;
}

#nav-card .current_page_item .menu-slidein {
  display: block;
  z-index: 1;
}

#nav-card .menu-slidein .back {
  display: block;
  font-size: var(--k-text-default);
  cursor: pointer;
}

#nav-card .menu-slidein .menu-item-title {
  font-size: var(--k-font-h1);
  margin-top: 10px;
  display: block;
}

#nav-card .menu-slidein .menu-item-description {
  font-size: var(--k-text-default);
}

#nav-card .menu-slidein .sub-menu-head {
  font-size: var(--k-text-default);
  letter-spacing: 0;
  margin: 20px 0 0px 0;
}

#nav-card .menu-slidein .sub-menu {
  display: flex;
  gap: 12px;
  flex-direction: column;
}

#nav-card .menu-slidein .sub-menu li a {
  font-size: var(--k-text-medium);
}



#account-card {
  .woocommerce-MyAccount-navigation li {
    padding: 10px 0;
    font-size: var(--k-text-default);
    display: flex;
    align-items: center;
    gap: 10px;
  }
}

.woocommerce-MyAccount-navigation-link:before {
  font-family: 'kolibri' !important;
  font-size: 24px !important;
}
.woocommerce-MyAccount-navigation-link--buchungen:before {
  content: "\e91e";
}

.woocommerce-MyAccount-navigation-link--orders:before {
  content: "\e921";
}

.woocommerce-MyAccount-navigation-link--meine-retreats:before {
  content: "\e923";
}

.woocommerce-MyAccount-navigation-link--kotodetails:before {
  content: "\e91f";
}

.woocommerce-MyAccount-navigation-link--customer-logout:before {
  content: "\e926";
}
.woocommerce-MyAccount-navigation-link--studiomanager:before {
  content: "\e927";
}

.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--wpf-delete-account {
  display: none !important;
}

#account-card .disabled-nav-wrapper {
  opacity: 0.5;
  cursor: not-allowed !important;
}

#account-card .disabled-nav-wrapper a {
  pointer-events: auto;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* MODALS */


/* Pop Up Modal */

.modal {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
  z-index: 999999999;
  transition: background-color 0.3s;
  overflow: auto; /* Allow the modal to scroll if needed */
}
.modal.active {
  background-color: var(--k-col-fade-a);
}

.modal .modal-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 90%; /* Adjust the maximum width as needed */
  max-height: 90vh; /* Limit the height to 90% of viewport height */
  padding: 30px;
  background-color: var(--k-col-overlay);
  overflow-y: auto; /* Add vertical scroll when needed */
  box-shadow: var(--k-shad-float);
  border-radius: var(--k-rad-m);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0s 0.3s;
  animation: fadeIn 0.3s ease-in-out;
}

.modal .modal-content .modal-icon {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}
.modal .modal-title {
  text-align: center;
  font-style: italic;
}
.modal .modal-description ul{
  max-width: 500px;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 20px 0;
}
.modal .modal-description li {
  display: flex;
  align-items: center;
  gap: 30px;
}
.modal .modal-description li .modallist-icon {
  font-size: 25px;
}
.modal .modal-description li h3 {
  font-size: 22px;
}

.modal .modal-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.modal .k-button.small {
  color: var(--k-col-medium);
}

/* Media query for small screens */
@media (max-width: 900px) {
  .modal-content {
    width: 90%; /* Set width to 100% for full-width modal on small screens */
    max-width: none; /* Remove max-width */
  }
}
@media (max-width: 450px) {
  .modal-content {
    width: 100%; /* Set width to 100% for full-width modal on small screens */
    max-width: none; /* Remove max-width */
  }
}

.modal.active .modal-content {
  opacity: 1; /* When active, the opacity becomes 1, making it visible */
  visibility: visible;
  transition: opacity 0.3s, visibility 0s;
}

/* Styling for the close (x) button */
.close {
  position: absolute;
  top: 5px;
  right: 17px;
  font-size: 30px;
  cursor: pointer;
}

@keyframes fadeIn {
  0% {
    top: 52%; /* Initial position during fade-in */
    opacity: 0;
  }
  100% {
    top: 50%; /* Final position during fade-in */
    opacity: 1;
    visibility: visible;
  }
}

@keyframes fadeOut {
  0% {
    top: 50%; /* Initial position during fade-out */
    opacity: 1;
    visibility: visible;
  }
  100% {
    top: 52%; /* Final position during fade-out */
    opacity: 0;
    visibility: hidden;
  }
}

.modal.active .modal-content {
  animation: fadeIn 0.3s ease-in-out;
}

.modal:not(.active) .modal-content {
  animation: fadeOut 0.3s ease-in-out;
}


/* Newsletter Component */

.newsletter-signup {
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.newsletter-signup #custom-mailpoet-signup {
  display: flex;
  gap: 10px;
}
.newsletter-signup #custom-mailpoet-signup input {
  border: none;
  border-bottom: 2px solid var(--k-col-medium);
  background: transparent;
  padding: 4px 0px;
  font-size: var(--k-text-medium);
  width: 100%;
  outline: none;
}

.newsletter-signup #custom-mailpoet-signup .mailpoet-response{
  font-size: var(--k-text-default);
}

.newsletter-signup small {
  font-size: var(--k-text-xsmall);
  color: var(--k-col-medium);
  display: block;
}

/* Knowledgebase Section Component */

.knowledgebase-section h2 {
  text-align: center;
}

.accordion-item {
  margin: 20px 0;
}

.accordion-title {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
.accordion-title h3 {
  font-size: var(--k-text-medium);
}

.accordion-item .arrow {
  transition: transform 0.3s ease;
  display: inline-block;
  transform: rotate(45deg); /* default closed (X shape) */
}

.accordion-item.open .arrow {
  transform: rotate(0deg); /* becomes + shape */
}

.accordion-content {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, opacity 0.3s ease;
  padding-left: 42px;
}

.accordion-item.open .accordion-content {
  opacity: 1;
  max-height: 500px; /* Set high enough for your content */
}


/* =======================================================================
// PAGES
// =====================================================================*/

/* LANDING PAGE */


.test-background {
  width: 1000px;
  height: 335px;
  background: url('media/test.jpg') no-repeat top left;
  background-size: cover;
}

#landing-intro {
  margin-top: var(--k-padding-section-xl);
  font-size: var(--k-text-large);
}


#landing-intro #brand {
  position: relative;
}

#landing-intro #brand #kolibri {
  margin-left: -10px;
}
#landing-intro #brand .definition {
  text-align: justify;
  font-weight: normal;
  margin-top: 25px;
  font-size: clamp(0px, 4.44vw + 0.12rem, 28px);
  width: 17.77em;
  line-height: 1.25;
}
@media (max-width: 485px) {
  #landing-intro #brand .definition {
    position: relative;
    width: 14em;
    font-size: 1.51rem;
  }
}
@media (max-width: 385px) {
  #landing-intro #brand .definition {
    width: 14em;
    font-size: 1.42rem !important;
  }
}
#landing-intro .definition #dashes::before {
  content: "|";
  font-weight: 400;
}
#landing-intro .definition #dashes::after {
  content: "|";
  font-weight: 400;
}
#landing-intro .definition #word {
  font-weight: bold;
  text-transform: lowercase;
  letter-spacing: 0.03em;
}
#landing-intro .definition #brackets:before {
  content: " [";
}
#landing-intro .definition #brackets:after {
  content: "]";
}
#landing-intro .definition #origin:after {
  content: "karib.-fr.";
  font-style: italic;
}
#landing-intro .definition #article:after {
  content: " der";
  font-style: italic;
}


#landing-list {
  overflow: hidden !important;
}
#landing-list{
  padding-top: var(--k-padding-section-xl) !important;
}
#landing-list .landing-list-item {
  padding-top: var(--k-padding-section);
  padding-bottom: var(--k-padding-section);
  position: relative;
}
.landing-list-content {
  max-width: 810px;
}
.list-patches {
  position: absolute;
  left: clamp(520px, 353.3px + 16.67vw, 570px);
  top: 0;
  bottom: 0;
  z-index: -100;
}
#landing-list h2, #landing-info h2, #landing-newsletter h2 {
  font-size: var(--k-text-large);
  line-height: 1.3;
  margin-bottom: 8px;
}
#landing-list h3 {
  font-size: var(--k-text-medium);
  font-style: italic;
  color: var(--k-col-medium);
}
#landing-list .landing-list-item .calltoaction {
  display: flex;
  column-gap: 30px;
  flex-wrap: wrap;
}
@media (max-width: 540px) {
  #landing-list .landing-list-item .calltoaction {
    flex-direction: column;
    align-items: start;
  }
}


#landing-info {
  background-color: var(--k-col-highlight);
  padding: 4.5rem 0;
  margin: 3em 0;
}
#landing-info article > * {
  max-width: 850px;
}
#landing-info h2 {
  margin: 5px 0;
}



#landing-newsletter h2{
  max-width: 850px;
}



/* RETREAT PAGE */

.hero-retreat {
  max-width: 1100px;
}

.hero-retreat-item {
  display: flex;
  gap: 50px;
  margin-top: var(--k-padding-section);
  margin-bottom: var(--k-padding-section);
}
.hero-retreat-item.even {
  flex-direction: row-reverse !important;
}
.hero-retreat-item.odd {
  flex-direction: row !important;
}
.hero-retreat-item .header-section-left {
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: center;
  row-gap: 15px;
  max-width: 600px;
}
.hero-retreat-item .header-section-right {
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: center;
}
.hero-retreat-item .header-section-left .k-prehead {
  color: var(--k-col-dark);
}
.hero-retreat-item .header-section-left h2 {
  font-size: var(--k-display-xlarge);
  font-family: var(--k-font-display);
  color: var(--k-col-accent);
  font-style: italic;
  font-weight: 400;
  line-height: 1;
  z-index: 10;
}
.hero-retreat-item.even .header-section-left h2 {
  margin-right: -20%;
}

.hero-retreat-item .header-section-left .post-subtitle {
  font-weight: 500;
  font-size: var(--k-text-medium);
  text-transform: uppercase;
  color: var(--k-col-dark);
}
.hero-retreat-item .header-section-left .post-subtitle-divider {
  font-weight: 500;
  font-style: italic;
  font-size: var(--k-text-default) !important;
  text-transform: lowercase !important;
}
.retreat-content {
}
.retreat-arch {
  mask-repeat: no-repeat;
  mask-size: 100%;
  mask-position: top center;
}
.retreat-arch img {
  width: 100%;
  height: 100%;
}



.retreat-band {
  background-color: var(--k-col-highlight);
  padding-top: 50px;
  padding-bottom: 50px;
  margin-top: 100px;
  margin-bottom: 100px;
}
.retreat-band ul {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  list-style: none;
  row-gap: 40px;
}
.retreat-band ul li{
  display: flex;
  justify-content: end;
  flex-direction: column;
  align-items: center;
}
.retreat-band ul li h4 {
  max-width: 220px;
  text-align: center;
  font-size: var(--k-text-default);
  font-weight: 400;
  color: var(--k-col-ink);
}
.retreat-band ul li figure {
  background-size: cover;
  background-position: center;
}
.retreat-band ul #professional figure {
  background-image: url('media/professional.jpg');
  width: 94px;
  height: 121px;
}
.retreat-band ul #holistic figure {
  background-image: url('media/holistic.jpg');
  width: 76px;
  height: 111px;
}
.retreat-band ul #catering figure {
  background-image: url('media/catering.jpg');
  width: 110px;
  height: 119px;
}
.retreat-band ul #acommodation figure {
  background-image: url('media/acommodation.jpg');
  width: 128px;
  height: 127px;
}



.all-retreats-carousel .title-section {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}


.all-retreats-carousel .carousel-scroll-container ul {
  gap: 60px;
}
.all-retreats-carousel .carousel-scroll-container ul li {
  max-width: 230px;
  scroll-snap-align: start;
}
.all-retreats-carousel .carousel-scroll-container ul li .item-image {
  width: 230px;
  height: 360px;
}
.all-retreats-carousel .carousel-scroll-container ul li .item-info {
  margin-top: 10px;
}
.all-retreats-carousel .carousel-scroll-container ul li .item-info span{
  font-size: var(--k-text-small);
  font-weight: 500;
}
.all-retreats-carousel .carousel-scroll-container ul li .item-info h3{
  font-size: var(--k-text-medium);
}


.retreat-cooperation .k-button {
  margin: -80px auto 0;
  display: block;
}

.retreats-partnership .partners-logo {
  margin: 30px auto;
}

.retreats-partnership p {
  max-width: 590px;
  margin: 0 auto;
  text-align: center;
}


.retreat-newsletter h3 {
  max-width: 850px;
}

/* DIGITAL PAGE */

.carousel-section.section {
  margin-top: 50px;
  margin-bottom: 50px;
}

.carousel-section.digital .title-section {
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
}
.carousel-section.digital .title-section h2 {
  font-size: var(--k-text-large);
}
.carousel-section.digital .title-section .k-button {
  color: var(--k-col-dark)
}
.carousel-section.digital .carousel-item {
  position: relative;
}
.carousel-section.digital .carousel-item .fullitem-link {
  position: absolute;
  top: 0; bottom: 0; left: 0; right: 0;
  z-index: 10;
}


.carousel-section.digital.hero .carousel-item {
  width: var(--k-sitewidth-wide);
  height: 450px;
  background-color: var(--k-col-light);
  background-size: cover;
  background-position: center;
  padding: 0 50px;
}
.carousel-section.digital.hero .digital-start {
  background-image: url('media/digital-start-hero.jpg');
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.carousel-section.digital.hero .digital-start h1 {
  font-family: var(--k-font-display);
  font-weight: 400;
  font-style: italic;
  font-size: var(--k-font-xxxl);
}
.carousel-section.digital.hero .digital-start h4 {
  font-size: var(--k-text-medium);
  font-weight: 400;
  max-width: 700px;
}


.carousel-section.digital.video ul .item-image {
  width: 290px;
  height: 162px;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.carousel-section.digital.video ul .item-info {
}
.carousel-section.digital.video ul .item-info span{
  font-size: var(--k-text-small);
}
.carousel-section.digital.video ul .item-info h3{
  font-size: var(--k-text-default);
}

.carousel-section.digital.categories ul .item-image {
  width: 540px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.carousel-section.digital.categories ul .item-image h3{
  position: absolute;
  font-style: italic;
  font-family: var(--k-font-display);
  font-size: var(--k-text-huge);
  color: var(--k-col-accent);
}

.carousel-section.digital.teacher ul .item-image {
  width: 250px;
}
.carousel-section.digital.teacher ul li{
  position: relative;
}
.carousel-section.digital.teacher ul li h3{
  position: absolute;
  bottom: 20px;
  left: 20px;
  font-size: var(--k-text-large);
  color: var(--k-col-overlay);
}

.carousel-section.digital.buttons ul{
  display: flex;
  gap: 15px;
  margin-bottom: 20px;
}
.carousel-section.digital.buttons ul li{
  flex-shrink: 0;
}



/* AUTHOR PAGE */

.hero-author {
  display: flex;
  gap: 50px;
  margin-top: var(--k-padding-section);
  margin-bottom: var(--k-padding-section);
}
.hero-author .header-section-left {
  flex-grow: 1;
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: center;
  row-gap: 15px;
}
.hero-author .header-section-right {
  flex-grow: 2;
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: center;
}




/* SINGLE PAGE COMMON */


.single-info {
  background-color: var(--k-col-highlight);
  padding: 4.5rem 0;
  margin: 3em 0;
}
.single-info article > * {
  max-width: 850px;
}
.single-info h3 {
  margin: 5px 0;
}



.single-newsletter h3{
  max-width: 850px;
}

/* SINGLE PAGE RETREAT */


.single-retreat .arch-wrapper {
  margin: 0 auto;
}
.single-retreat .retreat-arch{
  max-width: 450px !important;
  mask-repeat: no-repeat;
  mask-size: 100%;
  mask-position: top center;
  margin: 0 auto;
}
.single-retreat .retreat-arch img {
  width: 100%;
  height: 100%;
}

.single-retreat .arch-wrapper {
  margin: 15px auto -40px auto !important;
}

.single-retreat h1 {
  text-align: center;
  font-family: var(--k-font-display);
  font-size: var(--k-display-huge);
  color: var(--k-col-accent);
  line-height: 1;
  position: relative;
  z-index: 1000;
}

.single-retreat .post-subtitle {
  list-style: none !important;
  margin: 15px 0 25px 0;
  font-weight: 500;
  text-transform: uppercase;
  color: var(--wp--preset--color--dark);
  font-size: var(--k-text-medium);
  text-align: center;
}
.single-retreat .post-subtitle-divider {
  font-weight: 600;
  font-size: var(--k-text-small);
}

.single-retreat .book-retreat-info {
  max-width: 400px;
  margin: 50px auto;
  position: relative;
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.single-retreat .book-retreat-info .accentcolorbg {
  position: absolute;
  display: block;
  top: 0; bottom: 0; left: 0; right: 0;
  background-color: var(--k-col-accent);
  opacity: 0.2;
  z-index: -100;
}
.single-retreat .book-retreat-info .dates{
  color: var(--k-col-dark);
  font-size: var(--k-text-medium);
}
.single-retreat .book-retreat-info .bullets{
  font-size: var(--k-text-default);
}
.single-retreat .book-retreat-info .bullets ul{
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.single-retreat .book-retreat-info .price{
  color: var(--k-col-dark);
  font-size: var(--k-text-large);
}
.single-retreat .book-retreat-info .price span{
  font-size: var(--k-text-small);
}

.single-retreat .book-buttons {
  list-style: none !important;
}
.single-retreat .book-buttons li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin: 0;
  font-size: var(--k-text-small);
}


/* BLOG */

.post-title {
  font-family: var(--k-font-display);
  text-align: center;
  font-style: italic;
  line-height: 1;
  color: var(--k-col-accent);
  margin-bottom: 20px;
}

.post-title .pretitle {
  display: block;
  font-family: var(--k-font-serif) !important;
  font-size: var(--k-text-medium);
  text-transform: uppercase;
  font-style: normal;
  font-weight: 500;
  color: var(--k-col-dark);
  margin-bottom: 20px;
}

.single-blog .post-title{
  font-size: var(--k-display-xlarge);
}

.archive-blog .post-title {
  font-size: var(--k-display-large);
}


/* =======================================================================
// ACCOUNT
// =====================================================================*/


/* ID PAGES (login/signup etc) */

body.woocommerce-account-id header.global #nav-main, body.woocommerce-account-id header.global .global-header-action, body.woocommerce-account-id footer.global #logo {
  display: none;
}

body.woocommerce-account-id h1 {
  font-size: var(--k-display-xlarge);
  letter-spacing: -2%;
  font-family: var(--k-font-display);
  font-style: italic;
  text-align: center;
  color: var(--k-col-sienna);
}

body.woocommerce-account-id form {
  max-width: 330px;
  margin: 0 auto;
}

body.woocommerce-account-id .idpage-info {
  max-width: 330px;
  margin: 0 auto;
}

/* ACCOUNT PAGES */

body.woocommerce-account .post-title {
  display: none;
}

body.woocommerce-account article .woocommerce-MyAccount-navigation {
  display: none;
}

body.woocommerce-account .woocommerce h2 {
  font-size: var(--wp--preset--font-size--large);
}

/* Booking */

body.woocommerce-account .buchungen-menu {
  display: flex;
  gap: 10px;
}

body.woocommerce-account .buchungen-menu .buchungen-tab {
  padding: 5px 0px;
  margin-bottom: 20px;
}

body.woocommerce-account .buchungen-menu .buchungen-tab.active {
  border-bottom: 2px solid var(--k-col-sienna);
}


/* =======================================================================
// GENERAL WOOCOMMERCE
// =====================================================================*/


/* Toasts */

.woocommerce-notices-wrapper {
  position: fixed;
  top: 70px;
  display: block;
  z-index: var(--k-z-overlay);
  left: 0;
  right: 0;
  padding: 20px 0;
  background-color: var(--k-col-overlay);
  pointer-events: none;
  opacity: 0;
  transform: translateY(-30px);
  animation: slideToast 6s ease forwards;
}

.woocommerce-error {
  max-width: 750px;
  margin: 0 auto;
  color: var(--k-col-sienna);
}

@keyframes slideToast {
0% {
  opacity: 0;
  transform: translateY(-30px);
}
5% {
  opacity: 1;
  transform: translateY(0);
}
90% {
  opacity: 1;
  transform: translateY(0);
}
95% {
  opacity: 0;
  transform: translateY(-30px);
}
}

/* Rows*/

.form-row {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.form-row.form-row-first {
  float: left;
  width: 50%;
  padding-right: 5px;
}
.form-row.form-row-last {
  float: right;
  width: 50%;
  padding-left: 5px;
}
.form-row.form-row-last::after {
  content: "";
  clear: both;
}

.clear {
  clear: both;
}


/* CHECKOUT PAGE */

body.woocommerce-checkout .post-title {
  display: none;
}

body.woocommerce-checkout article.regular-size, .wp-site-blocks > * {
  max-width: var(--k-sitewidth-wide) !important;
}

body.woocommerce-checkout form.checkout {
  display: flex;
  gap: 60px;
}

body.woocommerce-checkout .checkout_content {
  width: 50%;
}
body.woocommerce-checkout .checkout_sidebar {
  width: 50%;
}

body.woocommerce-checkout .wc_payment_methods {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
body.woocommerce-checkout .wc_payment_methods li input {
  display: none;
}
body.woocommerce-checkout .wc_payment_methods li label {
  background-color: var(--k-col-shadow-a);
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 15px 15px;
  border-radius: 8px;
  font-size: unset;
  color: unset;
  font-style: unset;
  transition: all 0.2s ease;
  cursor: pointer;
}
body.woocommerce-checkout .wc_payment_methods li:hover label {
  background-color: var(--k-col-light-a);
}

body.woocommerce-checkout .wc_payment_methods li input:checked + label {
  background-color: var(--k-col-overlay);
  border: 3px solid var(--k-col-sienna);
  box-shadow: var(--k-shad-float);
}

body.woocommerce-checkout .wc_payment_methods li .payment_box {
  padding: 10px 0;
}

body.woocommerce-checkout .wc-gzd-heading-moved {
  display: none !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order {
  position: sticky;
  top: 100px;
}

body.woocommerce-checkout .shop_table {
  width: 100%;
  border-radius: 6px;
  background-color: var(--k-col-overlay);
  margin: 10px 0;
  padding: 5px;
  border-collapse: collapse;
}
body.woocommerce-checkout .shop_table thead tr {
  border-bottom: 1px solid var(--k-col-light);
  font-size: var(--k-text-small);
  text-transform: uppercase;
  font-weight: 400;
  color: var(--k-col-medium);
}

body.woocommerce-checkout .shop_table tr {
  border-bottom: 1px solid var(--k-col-light);
}
body.woocommerce-checkout .shop_table .order-total {
  border-bottom: 0;
}

body.woocommerce-checkout .shop_table th,
body.woocommerce-checkout .shop_table td {
  padding: 0.75em 1em;
}

body.woocommerce-checkout .shop_table thead th,
body.woocommerce-checkout .shop_table tbody .product-name,
body.woocommerce-checkout .shop_table tfoot th {
  text-align: left;
}

body.woocommerce-checkout .shop_table thead .product-total,
body.woocommerce-checkout .shop_table tbody .product-total,
body.woocommerce-checkout .shop_table tfoot td {
  text-align: right;
}

body.woocommerce-checkout .shop_table tfoot th {
  font-size: var(--k-text-small);
  font-weight: 400;
  color: var(--k-col-dark);
}

body.woocommerce-checkout .shop_table tfoot .order-total th {
  font-size: var(--k-text-regular);
  font-weight: 600;
  color: var(--k-col-ink);
}



/* =======================================================================
// AMELIA OVERWRITE
// =====================================================================*/


/* Manage Bookings */

.buchungen-panel .amelia-v2-booking #amelia-container.am-cap__wrapper {
  margin: 0 !important;
}

.buchungen-panel .amelia-v2-booking #amelia-container .am-fs-sb.am-collapsed {
  display: none !important;
}

.buchungen-panel .amelia-v2-booking #amelia-container .am-caph__main {
  display: none !important;
}

.buchungen-panel .amelia-v2-booking #amelia-container.am-cap__wrapper {
  box-shadow: none !important;
}

.buchungen-panel .amelia-v2-booking #amelia-container .am-fs__main {
  background-color: transparent !important;
}

.buchungen-panel .amelia-v2-booking #amelia-container .am-fs__main-content {
  padding: 0 !important;
}