/*
Theme Name: enovetic
Author: Antonia Sensen & Jan Ole Wiedenroth
Description: Personalisiertes Theme für die eNovetic AG. 
Tags: custom
Version: 1.2 Staging
Requires PHP: 8.0
Text Domain: enovetic

enovetic WordPress Theme © 2023 Antonia Sensen & Jan Ole Wiedenroth
*/

@font-face {
  font-family: "Stolzl";
  src: url(./styles/fonts/Stolzl-Light.otf) format("opentype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Stolzl";
  src: url(./styles/fonts/regular/font.woff) format("woff");
  src: url(./styles/fonts/regular/font.woff2) format("woff2");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Stolzl";
  ssrc: url(./styles/fonts/medium/font.woff) format("woff");
  src: url(./styles/fonts/medium/font.woff2) format("woff2");
  font-weight: bold;
  font-style: normal;
}


b,
strong {
  font-weight: bolder;
}

#wpadminbar {
  position: relative;
}

html {
  margin-top: 0 !important;
}

.bg-eNavigationMobil {
  background: linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.14) 0.55%,
      rgba(255, 255, 255, 0.27) 70.58%,
      rgba(255, 255, 255, 0.31) 96.59%
    ),
    rgba(0, 0, 0, 0.2);
}

.rotate {
  transform: rotate(-180deg);
  /*transform: rotate(180deg);*/
  transition: 0.3s;
}

.rotate-reset {
  transform: rotate(0deg);
  transition: 0.3s;
}

.carousel-container {
  max-width: 600px; /* Ändere die Breite des Containers nach Bedarf */
  margin: 0 auto;
}

.alertbuttonprimary {
  color: white !important;
  background: #86b927 !important;
  border-radius: 0.5rem !important;
  border: none !important;
}

.alertbuttonsecondary {
  color: #86b927 !important;
  border-radius: 0.5rem !important;
  border: #86b927 2px solid !important;
  background: #ffffff !important;
}

div:where(.swal2-icon).swal2-info {
  border-color: #86b927 !important;
  color: #86b927 !important;
}

.swal2-title {
  font-size: medium !important;
  font-weight: 400 !important;
}

.fade-up.in {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}

.fade-up {
  -webkit-transition: 0.5s ease-out;
  transition: 0.5s ease-out;
  -webkit-transform: translateY(30px);
  transform: translateY(30px);
  opacity: 0;
}

.selectcontainer:after {
  content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.29289 8.04289C3.68342 7.65237 4.31658 7.65237 4.70711 8.04289L12 14.3358L19.2929 8.04289C19.6834 7.65237 20.3166 7.65237 20.7071 8.04289C21.0976 8.43342 21.0976 9.06658 20.7071 9.45711L12.7071 16.4571C12.3166 16.8476 11.6834 16.8476 11.2929 16.4571L3.29289 9.45711C2.90237 9.06658 2.90237 8.43342 3.29289 8.04289Z" fill="%2386B927"/></svg>');
  color: #86b927;
  right: 11px;
  top: 0px;
  height: 34px;
  padding: 6px 0px 0px 8px;
  position: absolute;
  pointer-events: none;
}

select::-ms-expand {
  display: none;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.text-editor h1 {
  font-size: 40px;
  font-style: normal;
  font-weight: bolder !important;
  line-height: 140%;
  /* 84px */
  letter-spacing: 1.2px;
  margin-bottom: 30px;
}

.text-editor h2 {
  font-size: 28px !important;
  font-style: normal;
  font-weight: bolder !important;
  line-height: 140%;
  letter-spacing: 1.04px;
  margin-bottom: 25px;
}

.text-editor h3 {
  font-size: 22px !important;
  font-style: normal;
  font-weight: bolder !important;
  line-height: 140%;
  letter-spacing: 0.64px;
  margin-bottom: 20px;
}

.text-editor h4 {
  font-size: 14px !important;
  font-style: normal;
  font-weight: bolder !important;
  line-height: 140%;
  letter-spacing: 0.64px;
  margin-bottom: 20px;
}

.text-editor h5 {
  font-size: 18px !important;
  font-style: normal;
  font-weight: bold !important;
  line-height: 140%;
  letter-spacing: 0.56px;
  margin-bottom: 20px;
}

.text-editor h6 {
  font-size: 12px !important;
  font-style: normal;
  font-weight: bold !important;
  line-height: 150%;
  letter-spacing: 0.6px;
  margin-bottom: 20px;
}

.text-editor p {
  margin-bottom: 20px;
}

.text-editor b,
strong {
  font-weight: bolder;
}

.text-editor ul,
ol {
  list-style: revert !important;
  margin-bottom: 15px !important;
  margin-left: 20px !important;
}

.text-editor-blog p {
  margin-bottom: 10px !important;
}

.carousel-container {
  position: relative;
  width: 80%;
  margin: auto;
  overflow: hidden;
  display: flex;
  /* Add this line */
}

.carousel {
  transition: transform 0.5s ease-in-out;
  display: flex;
}

.carousel-image {
  width: 100%;
  object-fit: cover;
  flex: 0 0 auto;
  /* Add this line */
}

.indicators {
  text-align: center;
  margin-top: 10px;
}

.indicator {
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: #d9d9d9;
  border-radius: 50%;
  margin: 0 5px;
  cursor: pointer;
}

.indicator.active {
  background-color: #86b927;
}

.prevBtn,
.nextBtn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  cursor: pointer;
  z-index: 2;
}

.prevBtn {
  left: 0px;
}

.nextBtn {
  right: 0px;
}

input:focus,
textarea:focus,
select:focus,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: none;
  box-shadow: 0px 0px 2px 2px #86b927;
  border: 2px solid #738a53;
}

.navbar-animation {
  transition: padding 0.3s ease, height 0.3s ease;
}

.arbeit,
.vorsorge,
.gesundheit {
  transition: transform 0.3s ease, opacity 0.2s ease-in-out;
}

.arbeit {
  transform-origin: 0% 66.66%;
}

.vorsorge {
  transform-origin: 100% 66.66%;
}

.gesundheit {
  transform-origin: top center;
}

/* ---JS image fade--- */

.arbeit:hover,
.vorsorge:hover,
.gesundheit:hover {
  /* z-index: 1; */
  transform: scale(1.05, 1.05);
}

.arbeit,
.vorsorge,
.gesundheit {
  animation: scaleAnimation 6s infinite ease-in-out;
}

.gesundheit {
  transform-origin: top center;
}

.arbeit {
  animation-delay: 0s;
}

.gesundheit {
  animation-delay: 2s;
}

.vorsorge {
  animation-delay: 4s;
}

@keyframes scaleAnimation {
  45%,
  75% {
    transform: scale(1, 1);
  }

  60% {
    transform: scale(1.05, 1.05);
  }
}

.no-animation {
  animation: none;
}

/* Änderungen bis hier auf enovetic .ch / .com */

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background-color: #f1f1f1;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb {
  background-color: #c1c1c1;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #a8a8a8;
}

html {
  scrollbar-color: #c1c1c1 #f1f1f1;
  scrollbar-width: thin;
}

.swal2-title {
  position: relative !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0.8em 1em 0 !important;
  color: inherit !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  text-align: center !important;
  text-transform: none !important;
  word-wrap: break-word !important;
}

.swal2-confirm:focus {
  box-shadow: unset !important;
}

article a {
  color: rgb(134, 185, 39);
}

.enovetic-menu-item a,
footer a {
  color: inherit !important;
}

.enovetic-menu-item {
  hyphens: auto;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  language: de;
}

input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #ffffff;
  border: 2px solid gray;
  width: 20px;
  min-width: 20px;
  height: 20px;
  border-radius: 4px;
  cursor: pointer;
  display: inline-block;
  position: relative;
}

input[type="checkbox"]:checked {
  background-color: #55742a;
  border-color: #55742a;
}

input[type="checkbox"]:checked:after {
  content: "";
  background-image: url('data:image/svg+xml;utf8,<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="%23ffffff"><g id="SVGRepo_bgCarrier" stroke-width="0"/><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/><g id="SVGRepo_iconCarrier"> <path fill-rule="evenodd" clip-rule="evenodd" d="M20.6097 5.20743C21.0475 5.54416 21.1294 6.17201 20.7926 6.60976L10.7926 19.6098C10.6172 19.8378 10.352 19.9793 10.0648 19.9979C9.77765 20.0166 9.49637 19.9106 9.29289 19.7072L4.29289 14.7072C3.90237 14.3166 3.90237 13.6835 4.29289 13.2929C4.68342 12.9024 5.31658 12.9024 5.70711 13.2929L9.90178 17.4876L19.2074 5.39034C19.5441 4.95258 20.172 4.87069 20.6097 5.20743Z" fill="%23ffffff"/> </g></svg>');
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

input[type="checkbox"]:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(85, 116, 42, 0.5);
}

input[type="checkbox"]::-ms-check {
  display: none;
}

input[type="checkbox"] {
  -webkit-appearance: none;
}

input[type="checkbox"] {
  -moz-appearance: none;
}

.wp-block-image,
.wp-block-media-text {
  margin: 25px 0;
}

@media only screen and (max-width: 600px) {
  .wp-block-media-text__content {
    padding: 0 !important;
    margin-top: 25px;
  }
}

@media only screen and (min-width: 600px) {
  .has-media-on-the-right .wp-block-media-text__content {
    padding-left: 0px !important;
  }
  .has-media-on-the-left .wp-block-media-text__content {
    padding-right: 0px !important;
  }
}

.php-error #adminmenuback,
.php-error #adminmenuwrap {
  margin-top: 0 !important;
}

.mb-0-important {
  margin-bottom: 0 !important;
}

.wp-element-caption {
  font-size: 12px;
}

article .wp-block-button__link {
  color: white;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  background-color: rgb(134 185 39) !important;
  border-radius: 1.5rem !important;
  gap: 0.5rem !important;
  justify-content: center !important;
  align-items: center !important;
  display: inline-flex !important;
}

article .wp-block-button__link:hover {
  background-color: rgb(115 138 83) !important;
}

article .wp-block-button__link:active {
  --tw-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.24) inset,
    -4px -4px 8px 0px #fff inset;
  --tw-shadow-colored: inset 4px 4px 8px 0px var(--tw-shadow-color),
    inset -4px -4px 8px 0px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

article .wp-block-button__link:focus {
  --tw-ring-opacity: 0.5;
}

.post-password-form {
  max-width: 520px;
  margin: 6rem auto;
  padding: 2.25rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;                 /* feine Linie */
  border-radius: 16px;                        /* runde Ecken */
  box-shadow: 0 10px 30px rgba(2, 6, 23, .08);/* softer Shadow */
}

/* Überschrift/Einleitung (der erste Absatz kommt von WP) */
.post-password-form p:first-child {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 1.25rem;
  line-height: 1.35;
  color: #0b1220;
  font-weight: 600;
}

/* Label & Felder */
.post-password-form label {
  display: block;
  font-size: 0.85rem;
  color: #4b5563;
  letter-spacing: .02em;
  text-transform: none;
  margin: .5rem 0 .35rem;
}

.post-password-form input[type="password"] {
  display: block;
  width: 100%;
  height: 44px;
  padding: 0 .9rem;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #fff;
  color: #0f1724;
  font-size: 1rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.post-password-form input[type="password"]::placeholder { color: #9aa3af; }

.post-password-form input[type="password"]:focus {
  outline: none;
  border-color: #0ea5a4;                                /* EasyTemp Akzent */
  box-shadow: 0 0 0 4px rgba(14,165,164,.15);           /* Fokus-Ring */
}

/* Submit-Button im EasyTemp-Stil (türkis → grün) */
.post-password-form input[type="submit"] {
  background: #fff;                    /* weißer Hintergrund */
  border: 2px solid #8bc34a;           /* frisches Grün (angepasst an dein Screenshot) */
  color: #8bc34a;                      /* grüne Schrift */
  border-radius: 8px;                  /* leicht abgerundet */
  font-weight: 600;
  font-size: 1rem;
  padding: 0.75rem 1.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: none;
margin-top: 20px;
}

.post-password-form input[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(14,165,164,.28);
}

.post-password-form input[type="submit"]:active {
  transform: translateY(0);
  box-shadow: 0 4px 10px rgba(14,165,164,.22);
}

/* Hilfstext(e) unter dem Button */
.post-password-form p {
  color: #6b7280;
  font-size: .92rem;
  margin-top: 1rem;
}

/* Optionales Lock-Icon als dezentes Brand-Detail 
.post-password-form::before {
  content: "";
  display: block;
  font-size: 1.6rem;
  line-height: 1;
  margin-bottom: .75rem;
}
*/

/* Card in der Mitte halten, auch wenn es Header/Topbar gibt */
@media (min-width: 1024px) {
  .post-password-form { margin: 8rem auto; }
}

/* Mobile Feintuning */
@media (max-width: 640px) {
  .post-password-form {
    margin: 4rem 1rem;
    padding: 1.5rem;
    border-radius: 14px;
  }
}


/* Button Black Border */
.button-border-black .button-liste .normal {
  border-color: #000;
  color: #000;
  transition: all .3s ease;
}

.button-border-black .button-liste .normal:hover {
  border-color: #88BF20;
  color: #88BF20;
}


/* Button Black */
.black-button.text-ePrimary {
  background-color: #000;
  border-color: #000;
  color: #fff;
  transition: all .3s ease;
}

.black-button.text-ePrimary:hover {
  background-color: rgb(134 185 39 / var(--tw-text-opacity));
  border-color: rgb(134 185 39 / var(--tw-text-opacity));
  color: #fff;
}


/* Button Grün mit Hacken */
.button-liste .button-green-check {
  background-color: #88BF20;
  border-radius: 10px;
  max-width: 480px;
  width: 100%;
  color: #fff;
}

.left-side .button-liste {
  width: auto;
  float: left;
  margin-right: 20px;
}

/*.button-liste .button-green-check > div {
  width: 75%;
  justify-content: flex-start;
}*/


/* Akkordeon */
.faqtoggle {
  cursor: pointer;
}

.akkordeon {
  border-radius: 10px;
}

.titel-akkordeon {
  justify-content: space-between;
}

.titel-akkordeon.hover\:bg-eHoverGray:hover {
  border-radius: 10px;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity));
}

.titel-akkordeon h2 {
  color: #738A53;
  font-size: 2rem;
}

.check-icon svg {
  max-width: 48px;
  height: auto;
}


/* Invertieren */

.invert-text p,
.invert-text h1, 
.invert-text h2, 
.invert-text he {
  color: #fff;
}


/* Neue Headline & Texte */

.sub-headlines h2 {
  color: #738A53;
}

.sub-headlines .text-editor h3 {
  color: #88BF20;
  font-size: 18px !important;
  letter-spacing: 0;
  margin-bottom: 10px;
}

.sub-headlines .text-editor.titel h3 {
  color: #738A53;
}

.kleiner-text {
  font-size: .8rem;
}

.kleiner-text h3 {
  font-size: 1rem !important;
  margin-bottom: 5px;
}

#post-9731 .text-editor p {
  font-weight: 300;
}


/* Reihenfolge Spalten wechseln */

.order-img-right > div > div:first-child {
  order: 2;
}


/* Container Features */

.container-features.py-20 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.container-features.py-20.last-child {
  padding-top: 1rem;
  padding-bottom: 5rem;
}

.container-features > div {
  background-color: #fff;
  border-radius: 10px;
  padding: 3rem;
}

.container-features h3 {
  color: #738A53;
  margin-bottom: 10px;
}


/* Submenu New */

.new-menu.menu-item {
  color: #fff;
}

.new-menu.menu-item .grid {
  max-width: 1536px;
}

.menu-item-description {
  color: #fff;
  font-size: 1rem;
  display: block;
  font-weight: 300;
}

.new-submenu {
  position: relative;
  border-top: 1px solid #88BF20;
  width: 100%;
  color: #88BF20;
  font-size: 1.6rem;
}

.new-submenu.hover\:bg-white:hover {
  background-color: rgb(255, 255, 255, .1);
}

a.new-submenu:after {
  position: absolute;
  height: 27px;
  width: 15px;
  content: '';
  background: url('./svg/submenu-arrow-right.svg');
  background-size: 15px 27px;
  background-repeat: no-repeat;
  display: inline-block;
  padding-right: 1.25rem;
  padding-top: 0.125rem;
  cursor: pointer;
  vertical-align: middle;
  top: 24px;
  right: 4px;
}

.new-navigation.bg-eNavigation {
  background: rgba(65, 65, 65, 1);
}

.submenu-title {
  font-size: 1.6rem;
  max-width: 1536px;
  margin-left: auto;
  margin-right: auto;
}

#mobile-menu.bg-eNavigationMobil {
  background: rgba(65, 65, 65, 1);
}

.wrapper-eplix-suite {
  border: 1px solid #88BF20;
  border-radius: 10px;
}

.wrapper-eplix-suite .w-full.flex.suite .new-submenu {
  border-right: 1px solid rgba(255, 255, 255, .25);
  border-left: 1px solid rgba(255, 255, 255, .25);
  background-color: rgba(80, 80, 80, 1);
}

.wrapper-eplix-suite .w-full.flex.suite:first-child .new-submenu {
  border-top: 0;
  border-right: 0;
  border-left: 0;
  background-color: rgba(65, 65, 65, 1);
}

.wrapper-eplix-suite .w-full.flex.suite:last-child .new-submenu {
  border-right: 1px solid rgba(255, 255, 255, .25);
  border-left: 1px solid rgba(255, 255, 255, .25);
  border-bottom: 1px solid rgba(255, 255, 255, .25);
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color: rgba(80, 80, 80, 1);
}

.wrapper-eplix-suite .w-full.flex.suite:first-child .new-submenu:hover {
  border-radius: 10px;
  background-color: rgb(255, 255, 255, .1);
}

.wrapper-eplix-suite .w-full.flex.suite:nth-child(2) .new-submenu:hover,
.wrapper-eplix-suite .w-full.flex.suite:nth-child(3) .new-submenu:hover,
.wrapper-eplix-suite .w-full.flex.suite:nth-child(4) .new-submenu:hover,
.wrapper-eplix-suite .w-full.flex.suite:nth-child(5) .new-submenu:hover {
  background-color: rgba(95, 95, 95, 1);
}

.wrapper-eplix-suite .w-full.flex.suite:nth-child(2),
.wrapper-eplix-suite .w-full.flex.suite:nth-child(3),
.wrapper-eplix-suite .w-full.flex.suite:nth-child(4),
.wrapper-eplix-suite .w-full.flex.suite:nth-child(5) {
  margin-bottom: 0;
  padding-right: 10px;
  padding-left: 10px;
}

.wrapper-eplix-suite .w-full.flex.suite:last-child {
  margin-bottom: 1rem;
  padding-right: 10px;
  padding-left: 10px;
}

.wrapper-eplix-suite .w-full.flex.suite:nth-child(2):before {
  content: 'Unsere Apps aus der eplix suite';
  width: 100%;
  padding: 10px 20px;
  color: #1B1B1B;
  background-color: #88BF20;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}

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

  .new-submenu {
    font-size: 1.3rem;
  }

  .menu-item-description {
    font-size: 0.8rem;
  }

  a.new-submenu:after {
    position: absolute;
    height: 20px;
    width: 11px;
    content: '';
    background: url('./svg/submenu-arrow-right.svg');
    background-size: 11px 20px;
    background-repeat: no-repeat;
    display: inline-block;
    padding-right: 1.25rem;
    padding-top: 0.125rem;
    cursor: pointer;
    vertical-align: middle;
    top: 22px;
    right: 0;
  }

}