/* ==========================================================================
   TABLE OF CONTENTS
   1.  Resets & Base
   2.  WordPress Site Structure & Layout
   3.  Gutenberg Block Overrides
   4.  Utility Classes
   5.  Header
   6.  Navigation
   7.  Language Switcher
   8.  SVGs
   9.  Theme Components (felusch)
   10. Tabs Block
   11. Plugin – Complianz (Cookie Banner)
   12. Plugin – Download Manager
   13. Plugin – Event Manager
   14. Plugin – Newsletter
   15. Plugin – Testimonials (Pagination & Form)
   16. Profile Picture Preview
   ========================================================================== */


/* ==========================================================================
   1. Resets & Base
   ========================================================================== */

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

html,
body {
  overflow-x: clip;
}

html {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
  min-height: 100vh; /* Fallback */
  min-height: 100dvh; /* Preferred for modern mobile browsers */
  display: flex;
  flex-direction: column;
}

a,
a:visited {
  color: inherit;
  text-decoration: inherit;
}


/* ==========================================================================
   2. WordPress Site Structure & Layout
   ========================================================================== */

/* Flexbox setup to push the footer to the bottom */
.wp-site-blocks {
  display: flex;
  flex-direction: column;
  min-height: inherit;
}

main {
  flex: 1;
}


/* ==========================================================================
   3. Gutenberg Block Overrides
   ========================================================================== */

.wp-block-button:hover {
  opacity: 0.7;
}

.custom-button a {
  text-decoration: none;
  color: inherit;
}

.custom-button p {
  font-family: var(--wp--preset--font-family--nunito);
  font-size: var(--wp--preset--font-size--body-normal);
}

.flex-block .wp-block-image,
.flex-block .wp-block-image img {
  width: 100%;
}


/* ==========================================================================
   4. Utility Classes
   ========================================================================== */

.textBalance {
  text-wrap: balance;
}

.wide-divider {
  max-width: 1068px !important;
  margin-inline: auto !important;
}

.hide {
  display: none !important;
}

@media (max-width: 640px) {
  .display-none-mobile {
    display: none;
  }
}


/* ==========================================================================
   5. Header
   ========================================================================== */

/* Global backdrop – hidden by default, triggered by open navigation */
body::before {
  content: "";
  position: fixed;
  inset: 0;

  background-color: rgba(0, 0, 0, 0.2);

  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);

  opacity: 0;
  visibility: hidden;

  transition: opacity 0.3s ease;

  z-index: 900;
  pointer-events: none;
}

body:has(
    .nav_item_wrapper.is-open,
    .wp-block-navigation
      .has-child
      .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  )::before {
  opacity: 1;
  visibility: visible;
}

/* FIX: make sticky Group actually stick */
header:has(> .is-position-sticky) {
  position: sticky;
  top: calc(0px + var(--wp-admin--admin-bar--height, 0px));
}

header {
  position: relative;
  z-index: 1000;
}

.nav_item_wrapper {
  position: static;
}

/* Hamburger button */
.nav-toggle {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);

  width: 32px;
  height: 24px;

  display: none;
  flex-direction: column;
  justify-content: space-between;

  background: transparent;
  border: 0;
  cursor: pointer;
  z-index: 1101;
}

.nav-toggle span {
  height: 3px;
  background: #ffffff;
  display: block;
  transition: 0.3s;
}

@media (max-width: 1024px) {
  .nav-toggle {
    display: flex;
  }

  /* Mobile dropdown panel */
  .nav_item_container {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;

    background: var(--wp--preset--color--bg-dark-neutral);

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wp--preset--spacing--md-32);

    padding: 40px 20px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateY(-8px) scale(0.98);

    transition:
      opacity 0.25s ease,
      transform 0.25s ease,
      visibility 0s linear 0.25s;

    z-index: 999;
  }

  .nav_item_wrapper.is-open .nav_item_container {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    padding-block: 24px;
    padding-inline: 32px;
    border-bottom: 1px solid var(--wp--preset--color--muted);
    transform: translateY(0) scale(1);
    z-index: 950;
    transition:
      opacity 0.25s ease,
      transform 0.25s ease;
  }

  .nav_item_container li {
    text-align: center;
  }

  .nav_item_container a {
    display: block;
    text-align: center;
  }

  .wp-block-navigation__container {
    flex-direction: column;
  }
}

/* Hamburger → X animation */
.nav-toggle.active span:nth-child(1) {
  transform: translateY(10px) rotate(45deg);
}

.nav-toggle.active span:nth-child(2) {
  opacity: 0;
}

.nav-toggle.active span:nth-child(3) {
  transform: translateY(-11px) rotate(-45deg);
}


/* ==========================================================================
   6. Navigation
   ========================================================================== */

/*
  WP Navigation HTML structure reference:
  nav.wp-block-navigation
    ul.wp-block-navigation__container
      li.wp-block-navigation-item.wp-block-navigation-submenu  (with sub-menu)
        button.wp-block-navigation-item__content.wp-block-navigation-submenu__toggle
          span.wp-block-navigation-item__label
        span.wp-block-navigation__submenu-icon
          span::before  (custom icon)
          svg           (default icon – hidden)
        ul.wp-block-navigation__submenu-container
      li.wp-block-navigation-item.wp-block-navigation-link  (plain link)
        a.wp-block-navigation-item__content
*/

/* Backdrop when sub-menu is open (but NOT when mobile nav panel is open) */
body:has(
    .wp-block-navigation
      .has-child
      .wp-block-navigation-submenu__toggle[aria-expanded="true"]
      ~ ul.wp-block-navigation-submenu.wp-block-navigation__submenu-container
  ):not(.nav_menu.nav_menu.navOpen)::before {
  opacity: 1;
}

.wp-block-group:has(.wp-block-ermisch-block-custom-header) {
  opacity: unset;
  z-index: 999;
}

li.wp-block-navigation-item.wp-block-navigation-link {
  cursor: pointer;
}

/* Open sub-menu container */
.wp-block-navigation
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ ul.wp-block-navigation-submenu.wp-block-navigation__submenu-container {
  border: none;
  white-space: nowrap;
  padding: var(--wp--preset--spacing--md-32);
  gap: var(--wp--preset--spacing--sm-16);
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  color: var(--wp--preset--color--primary);
}

/* Toggle button turns primary when sub-menu is open */
.wp-block-navigation
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"] {
  color: var(--wp--preset--color--primary);
}

/* Hover color for nav items */
li.wp-block-navigation-item.wp-block-navigation-link:hover,
li.wp-block-navigation-item.wp-block-navigation-submenu:hover {
  transition: color 200ms ease-in-out;
  color: var(--wp--preset--color--primary);
}

li.wp-block-navigation-item.wp-block-navigation-submenu
  button.wp-block-navigation-item__content.wp-block-navigation-submenu__toggle {
  padding-right: unset;
}

/* Chevron icon turns primary on hover */
li.wp-block-navigation-item.wp-block-navigation-link:hover
  button.wp-block-navigation-item__content
  ~ span.wp-block-navigation__submenu-icon::before,
li.wp-block-navigation-item.wp-block-navigation-submenu:hover
  button.wp-block-navigation-item__content
  ~ span.wp-block-navigation__submenu-icon::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><polyline points="208 96 128 176 48 96" fill="none" stroke="%230F6DBF" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>');
}

/* Chevron icon – container sizing */
ul.wp-block-navigation.wp-block-navigation__container
  li.wp-block-navigation-item.wp-block-navigation-submenu
  span.wp-block-navigation__submenu-icon,
.wp-block-navigation
  .wp-block-navigation-item.wp-block-navigation-submenu
  span.wp-block-navigation__submenu-icon {
  margin-left: var(--wp--preset--spacing--xxs-6);
  width: fit-content;
  height: fit-content;
}

/* Hide default WP chevron SVG */
li.wp-block-navigation-item.wp-block-navigation-submenu
  span.wp-block-navigation__submenu-icon
  svg,
.wp-block-navigation-item.wp-block-navigation-submenu
  span.wp-block-navigation__submenu-icon
  svg {
  display: none;
}

/* Custom chevron icon via ::before */
span.wp-block-navigation__submenu-icon::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  transition:
    transform 200ms ease-in-out,
    background-image 200ms ease-in-out;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><polyline points="208 96 128 176 48 96" fill="none" stroke="%23FFFFFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>');
}

/* Chevron rotates and turns primary when sub-menu is open */
button.wp-block-navigation-item__content.wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ span.wp-block-navigation__submenu-icon::before {
  transform: rotate(180deg);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><polyline points="208 96 128 176 48 96" fill="none" stroke="%230F6DBF" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>');
}

/* Mobile nav panel – items left-aligned */
.nav_item_wrapper.is-open
  ul.wp-block-navigation.wp-block-navigation__container {
  align-items: flex-start;
}

.nav_item_wrapper.is-open nav.wp-block-navigation {
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
}

/* Mobile nav panel – sub-menu item border */
.nav_item_wrapper.is-open
  li.wp-block-navigation-item.wp-block-navigation-submenu {
  border: 1px solid var(--wp--preset--color--primary-foreground);
  border-radius: 8px;
  padding-inline: var(--wp--preset--spacing--sm-16);
  padding-block: var(--wp--preset--spacing--xs-12);
}

/* Mobile nav panel – sub-menu item grid layout */
.nav_item_wrapper.is-open
  li.wp-block-navigation-item.wp-block-navigation-submenu {
  display: grid;
  grid-template-columns: auto auto 1fr;
  grid-template-rows: auto auto;
  align-items: center;
}

/* Mobile nav panel – open sub-menu container */
.nav_item_wrapper.is-open
  .wp-block-navigation
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ .wp-block-navigation__submenu-container,
.nav_item_wrapper.is-open
  .wp-block-navigation
  .has-child:not(.open-on-click):hover
  > .wp-block-navigation__submenu-container,
.nav_item_wrapper.is-open
  .wp-block-navigation
  .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within
  > .wp-block-navigation__submenu-container {
  position: unset !important;
  grid-column: span 3;
  grid-row: 2 / 3;
  white-space: normal;
  width: 100%;
  padding-top: var(--wp--preset--spacing--xs-12) !important;
  padding-block: unset;
  padding-inline: unset;
  gap: var(--wp--preset--spacing--xs-12);
}

.nav_item_wrapper.is-open
  .wp-block-navigation
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ .wp-block-navigation__submenu-container
  .wp-block-navigation-item__label {
  text-align: start;
}

/* links-for-members variant */
nav.wp-block-navigation.links-for-members {
  width: fit-content;
  border-radius: 8px;
  padding-inline: var(--wp--preset--spacing--sm-16);
  padding-block: var(--wp--preset--spacing--xxs-6);
}

.links-for-members ul.wp-block-navigation.wp-block-navigation__container {
  border-radius: inherit;
}

.links-for-members li.wp-block-navigation-item.wp-block-navigation-submenu {
  border-radius: inherit;
}

.links-for-members
  li.wp-block-navigation-item.wp-block-navigation-submenu
  span.wp-block-navigation__submenu-icon {
  border-radius: inherit;
}

.nav_item_wrapper.is-open nav.wp-block-navigation.links-for-members {
  padding: 0;
}

/* links-for-members – smaller dark chevron */
.links-for-members span.wp-block-navigation__submenu-icon::before {
  width: 16px;
  height: 16px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><polyline points="208 96 128 176 48 96" fill="none" stroke="%233A3A3A" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>');
}

/* links-for-members – open sub-menu positioning */
nav.wp-block-navigation.links-for-members
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ ul.wp-block-navigation-submenu.wp-block-navigation__submenu-container {
  top: calc(100% - 2px);
  white-space: normal;
  width: calc(100% + 2 * var(--wp--preset--spacing--sm-16));
  transform: translateX(calc(-1 * var(--wp--preset--spacing--sm-16)));
  padding: var(--wp--preset--spacing--sm-16);
}

/* links-for-members – mobile nav panel overrides */
.nav_item_wrapper.is-open
  .links-for-members
  li.wp-block-navigation-item.wp-block-navigation-submenu {
  border: unset;
  border-radius: inherit;
  padding-block: var(--wp--preset--spacing--xs-12);
}

.nav_item_wrapper.is-open
  .wp-block-navigation.links-for-members
  .has-child
  .wp-block-navigation-submenu__toggle[aria-expanded="true"]
  ~ .wp-block-navigation__submenu-container,
.nav_item_wrapper.is-open
  .wp-block-navigation.links-for-members
  .has-child:not(.open-on-click):hover
  > .wp-block-navigation__submenu-container,
.nav_item_wrapper.is-open
  .wp-block-navigation.links-for-members
  .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within
  > .wp-block-navigation__submenu-container {
  padding-bottom: unset;
}


/* ==========================================================================
   7. Language Switcher
   ========================================================================== */

div.wp-block-ermisch-block-custom-language-switcher:hover {
  background-color: var(--wp--preset--color--background) !important;
  color: var(--wp--preset--color--foreground) !important;
}

div.wp-block-ermisch-block-custom-language-switcher
  .dropdown-options
  a.language-link {
  padding: var(--wp--preset--spacing--xs-12-r);
}

/* Position language switcher normally when mobile nav is open */
header
  .nav_item_wrapper.is-open
  div.wp-block-ermisch-block-custom-language-switcher {
  display: flex;
  flex-direction: column;
}

header
  .nav_item_wrapper.is-open
  div.wp-block-ermisch-block-custom-language-switcher:hover,
header
  .nav_item_wrapper.is-open
  div.wp-block-ermisch-block-custom-language-switcher:focus-within {
  border-bottom-right-radius: var(
    --borderRadius-bottomRight-desktop
  ) !important;
  border-bottom-left-radius: var(--borderRadius-bottomLeft-desktop) !important;
}

header
  .nav_item_wrapper.is-open
  div.wp-block-ermisch-block-custom-language-switcher
  .dropdown-options {
  position: unset;
  border-top: inherit;
  border-top-right-radius: inherit;
  border-top-left-radius: inherit;
}

@media (max-width: 1024px) {
  header
    .nav_item_wrapper.is-open
    div.wp-block-ermisch-block-custom-language-switcher:hover,
  header
    .nav_item_wrapper.is-open
    div.wp-block-ermisch-block-custom-language-switcher:focus-within {
    border-bottom-right-radius: var(
      --borderRadius-topRight-tablet,
      var(--borderRadius-topRight-desktop)
    ) !important;
    border-bottom-left-radius: var(
      --borderRadius-topLeft-tablet,
      var(--borderRadius-topLeft-desktop)
    ) !important;
  }
}

@media (max-width: 640px) {
  header
    .nav_item_wrapper.is-open
    div.wp-block-ermisch-block-custom-language-switcher:hover,
  header
    .nav_item_wrapper.is-open
    div.wp-block-ermisch-block-custom-language-switcher:focus-within {
    border-bottom-right-radius: var(
      --borderRadius-topRight-mobile,
      var(--borderRadius-topRight-tablet, var(--borderRadius-topRight-desktop))
    ) !important;
    border-bottom-left-radius: var(
      --borderRadius-topLeft-mobile,
      var(--borderRadius-topLeft-tablet, var(--borderRadius-topLeft-desktop))
    ) !important;
  }
}


/* ==========================================================================
   8. SVGs
   ========================================================================== */

.stroke-width-1.wp-block-outermost-icon-block .icon-container svg {
  stroke-width: 1;
}
.stroke-width-1.wp-block-outermost-icon-block .icon-container svg > * {
  stroke-width: inherit;
}
.stroke-width-4.wp-block-outermost-icon-block .icon-container svg {
  stroke-width: 4;
}
.stroke-width-4.wp-block-outermost-icon-block .icon-container svg > * {
  stroke-width: inherit;
}


/* ==========================================================================
   9. Theme Components (felusch)
   ========================================================================== */

/* Seminar grid – single column on tablet */
@media screen and (max-width: 1024px) {
  .felusch-seminar-grid {
    grid-template-columns: 1fr !important;
    max-width: 100%;
    justify-content: stretch;
  }
}

/* Call to action – two-column grid */
.felusch-call-to-action {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--wp--preset--spacing--sm-16-r, 1rem);
  max-width: 100%;
  justify-content: stretch;
}

@media screen and (max-width: 640px) {
  .felusch-call-to-action {
    grid-template-columns: 1fr;
  }

  .felusch-inhouse-card .felusch-call-to-action {
    width: 100%;
  }
}

/* References list */
.referencesList {
  list-style: none;
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  gap: var(--wp--preset--spacing--sm-16-r);
}

.referencesList .block-editor-rich-text__editable.rich-text {
  white-space: nowrap !important;
}

.referencesList li {
  background-color: var(--wp--preset--color--background);
  border: 1px solid var(--wp--preset--color--accent);
  border-radius: 8px;
  padding-block: var(--wp--preset--spacing--xxs-6);
  padding-inline: var(--wp--preset--spacing--xs-12-r);
  user-select: none;
}

/* Hover effects – Teilnehmer Link Cards */
.felusch-teilnehmer-link {
  transition:
    background 0.3s,
    color 0.3s;
}
.felusch-teilnehmer-link-icon .icon-container path {
  transition: fill 0.3s;
}
.felusch-teilnehmer-link button {
  transition:
    color 0.3s,
    background-color 0.3s,
    border-color 0.3s;
}
.felusch-teilnehmer-link .icon-container {
  transition: color 0.3s;
}
.felusch-teilnehmer-link button:hover {
  transition: opacity 0.3s;
}

.felusch-teilnehmer-link:hover {
  background: linear-gradient(180deg, #0f6dbf 0%, #0f7a95 100%);
  color: var(--wp--preset--color--primary-foreground, white);
}

.felusch-teilnehmer-link:hover .felusch-teilnehmer-link-icon .icon-container path {
  stroke: var(--wp--preset--color--primary-foreground, white) !important;
}

.felusch-teilnehmer-link:hover button,
.felusch-teilnehmer-link:hover a {
  color: var(--wp--preset--color--primary-foreground, white) !important;
  background-color: transparent !important;
  border-color: var(--wp--preset--color--primary-foreground, white) !important;
}

.felusch-teilnehmer-link:hover .icon-container {
  color: var(--wp--preset--color--primary-foreground, white) !important;
}

.felusch-teilnehmer-link:hover button:hover,
.felusch-teilnehmer-link:hover a:hover,
.felusch-teilnehmer-link:hover .wp-block-ermisch-block-custom-button {
  opacity: 1;
}

/* Feature list (Seminar-Liste mit Checkmarks) */
.felusch-seminar-list,
.wp-block-list.felusch-seminar-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--sm-16);
}

.felusch-seminar-list li,
.felusch-seminar-list .wp-block-list-item li {
  margin-bottom: 0;
  padding-left: 2rem;
  position: relative;
  display: flex;
  align-items: center;
}

.felusch-seminar-list li::before,
.felusch-seminar-list .wp-block-list-item li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1.625rem;
  height: 1.625rem;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><circle cx="128" cy="128" r="96" fill="none" stroke="%23084d86" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/><line x1="88" y1="128" x2="168" y2="128" fill="none" stroke="%23084d86" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/><polyline points="136 96 168 128 136 160" fill="none" stroke="%23084d86" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
}

ul.felusch-seminar-list,
.block-editor-block-list__block ul.felusch-seminar-list {
  padding-left: 0;
  margin-left: 0;
}

@media (max-width: 640px) {
  .felusch-seminar-list {
    flex-direction: column;
    gap: var(--wp--preset--spacing--xxs-6);
  }
}

/* Learnings list (Accordion checkmarks) */
.wp-block-list.felusch-learnings-list {
  list-style: none;
  padding-left: 1rem;
}

.wp-block-list.felusch-learnings-list li,
.wp-block-list.felusch-learnings-list .wp-block-list-item li {
  margin-bottom: 0.375rem;
  padding-left: 1.5rem;
  position: relative;
}

.wp-block-list.felusch-learnings-list li::before,
.wp-block-list.felusch-learnings-list .wp-block-list-item li::before {
  content: '✓ ';
  color: var(--wp--preset--color--secondary, #084d86);
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 300;
}

/* Kursinhalte */
.felusch-kurs-inhalte .tab-label {
  white-space: nowrap;
}

/* Modul-Liste */
.felusch-module {
  align-items: stretch;
}

.felusch-modul-list {
  list-style: none;
}

.felusch-modul-list li,
.felusch-modul-list .wp-block-list-item li {
  margin-bottom: 1.5rem;
  padding-left: 0;
  margin-left: 0;
}

ul.felusch-modul-list,
.block-editor-block-list__block ul.felusch-modul-list {
  padding-left: 0 !important;
  margin-left: 0;
}

/* External link with icon */
.felusch-external-link a {
  display: inline-flex;
  align-items: top;
  justify-content: top;
  gap: 0.2em;
  text-decoration: none;
}

.felusch-external-link a::after {
  content: '';
  display: inline-block;
  width: 1.375em;
  height: 1.375em;
  background-color: currentColor;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path d="M220,104a4,4,0,0,1-8,0V49.66l-73.16,73.17a4,4,0,0,1-5.66-5.66L206.34,44H152a4,4,0,0,1,0-8h64a4,4,0,0,1,4,4Zm-36,28a4,4,0,0,0-4,4v72a4,4,0,0,1-4,4H48a4,4,0,0,1-4-4V80a4,4,0,0,1,4-4h72a4,4,0,0,0,0-8H48A12,12,0,0,0,36,80V208a12,12,0,0,0,12,12H176a12,12,0,0,0,12-12V136A4,4,0,0,0,184,132Z"/></svg>')
    no-repeat center / contain;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path d="M220,104a4,4,0,0,1-8,0V49.66l-73.16,73.17a4,4,0,0,1-5.66-5.66L206.34,44H152a4,4,0,0,1,0-8h64a4,4,0,0,1,4,4Zm-36,28a4,4,0,0,0-4,4v72a4,4,0,0,1-4,4H48a4,4,0,0,1-4-4V80a4,4,0,0,1,4-4h72a4,4,0,0,0,0-8H48A12,12,0,0,0,36,80V208a12,12,0,0,0,12,12H176a12,12,0,0,0,12-12V136A4,4,0,0,0,184,132Z"/></svg>')
    no-repeat center / contain;
}

.felusch-external-link:hover {
  color: var(--wp--preset--color--primary);
}

/* Link collection grid */
.felusch-link-collection {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--wp--preset--spacing--sm-16-r, 1.5rem);
}

@media (max-width: 1024px) {
  .felusch-link-collection {
    grid-template-columns: 1fr;
  }
}

/* "Read more" excerpt link */
.wp-block-post-excerpt__more-link {
  position: relative;
  display: inline-block;
  border: 1px var(--wp--preset--color--foreground, #333333) solid;
  border-radius: 10px;
  padding-block: 0.5rem;
  margin-top: 32px;
  padding-left: 2.8rem;
  padding-right: 1.7rem;
  text-decoration: none;
  color: var(--wp--preset--color--foreground, #333333);
}

.wp-block-post-excerpt__more-link::before {
  content: '';
  position: absolute;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
  width: 1.625rem;
  height: 1.625rem;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><line x1="40" y1="128" x2="216" y2="128" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/><polyline points="144 56 216 128 144 200" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
}

@media (max-width: 640px) {
  .wp-block-post-excerpt__more-text {
    text-align: right;
  }
  .wp-block-post-featured-image {
    min-height: 0px;
    min-width: 100%;
  }
  .attachment-full.size-full.wp-post-image {
    height: 100%;
  }
}

/* Card micro-animations (no effect when contact form inside card is open) */
.felusch-modul-card-container:hover:not(:has(.kontaktformular-dialog-popup:is(:hover, .open))),
.ermisch-seminar-card:hover:not(:has(.kontaktformular-dialog-popup:is(:hover, .open))),
.felusch-inhouse-card:hover:not(:has(.kontaktformular-dialog-popup:is(:hover, .open))) {
  filter: brightness(1.03);
  transform: translateY(-4px);
  transition:
    transform 0.3s ease,
    filter 0.3s ease;
}

/* Datenschutz heading spacing */
.felusch-datenschutz h3,
.felusch-datenschutz h4 {
  margin-top: var(---wp--preset--spacing--sm-24-r, 1.5rem);
}

.felusch-datenschutz ul {
  padding-left: 1.5rem;
}

/* Lists in singular posts */
.wp-singular .wp-block-list {
  padding-left: 1.75rem;
}

/* Bildergalerie – Schriften */
.vp-portfolio__item-meta {
  font-size: var(--wp--preset--font-size--body-small, clamp(0.688rem, 0.598rem + 0.446vw, 1rem));
}

.vp-portfolio__item-popup-title {
  font-size: var(--wp--preset--font-size--body-small, clamp(0.688rem, 0.598rem + 0.446vw, 1rem));
}

.vp-portfolio__item-popup-description {
  display: none;
}

.block-preview-picture img {
  max-height: 200px;
}

@media (max-width: 640px) {
  .block-preview-picture-image img {
    object-fit: contain !important;
  }
}


/* ==========================================================================
   10. Tabs Block
   ========================================================================== */

.wp-block-ermisch-block-tabs-block {
  margin-top: var(--wp--preset--spacing--xl-128-r, inherit) !important;
  margin-bottom: var(--wp--preset--spacing--xl-128-r, inherit) !important;
  padding-top: var(--wp--preset--spacing--md-48-r, inherit) !important;
  padding-bottom: var(--wp--preset--spacing--md-48-r, inherit) !important;
}

.wp-block-ermisch-block-tabs-block .tab-title {
  --tab-title-font:
    Nunito, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans,
    Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  --tab-title-font-size: clamp(0.875rem, 0.699rem + 0.751vw, 1.375rem);
  --tab-title-font-weight: 300;
  --tab-title-text-transform: uppercase;
  --tab-title-line-height: 1.1;
  background-color: var(--tab-title-bg-color, inherit);
  color: var(--tab-title-text-color, inherit);
  font-family: var(--tab-title-font, inherit);
  font-size: var(--tab-title-font-size, inherit);
  font-weight: var(--tab-title-font-weight, inherit);
  line-height: var(--tab-title-line-height, inherit);
  text-transform: var(--tab-title-text-transform, inherit);
}

.wp-block-ermisch-block-tabs-block .tab-heading {
  --heading-font:
    --tab-title-font: Nunito, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  --heading-font-size: clamp(2.25rem, 1.986rem + 1.127vw, 3rem);
  --heading-font-weight: 300;
  --heading-text-transform: uppercase;
  --heading-line-height: 1.1;
  --heading-text-color: #0f6dbf;
  background-color: var(--heading-bg-color, inherit);
  color: var(--wp--preset--color--primary, #0f6dbf);
  display: flex;
  font-family: var(--heading-font, inherit);
  font-size: var(--heading-font-size, inherit);
  font-weight: var(--heading-font-weight, inherit);
  justify-content: var(--justifyContentHeading-desktop, initial);
  line-height: var(--heading-line-height, inherit);
  text-transform: var(--heading-text-transform, inherit);
}

.wp-block-ermisch-block-tabs-block .tab-sidebar {
  --sidebarMobile-bg-color: var(--wp--preset--color--background);
  align-self: flex-start;
  background-color: var(
    --sidebarMobile-bg-color,
    var(--sidebar-bg-color, inherit)
  );
  gap: var(
    --gapHeadingTab-right-mobile,
    var(
      --gapHeadingTab-right-tablet,
      var(--gapHeadingTab-right-desktop, initial)
    )
  );
  max-height: 100vh;
  top: var(
    --gapTop-right-mobile,
    var(--gapTop-right-tablet, var(--gapTop-right-desktop, initial))
  );
  z-index: 4;
}

@media (max-width: 640px) {
  .wp-block-ermisch-block-tabs-block .tab-header-buttons {
    align-items: center;
  }
}

/* Tabs – active and hover state */
.wp-block-ermisch-block-tabs-block .tab-header-buttons button:hover {
  color: var(--wp--preset--color--primary, #0f6dbf);
}

.wp-block-ermisch-block-tabs-block .tab-header-buttons button.active:hover {
  color: var(--wp--preset--color--foreground, #333333);
}

.wp-block-ermisch-block-tabs-block
  .tab-header-buttons
  button.active
  .tab-title {
  font-weight: 600;
}

/* Tab button arrow (desktop only) */
@media (min-width: 641px) {
  .wp-block-ermisch-block-tabs-block .tab-header-buttons button:not(.active) .tab-title::before {
    content: '';
    display: inline-flex;
    width: 1.375rem;
    height: 1.375rem;
    margin-right: 0.2rem;
    vertical-align: sub;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><line x1="40" y1="128" x2="216" y2="128" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><polyline points="144 56 216 128 144 200" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
  }

  .wp-block-ermisch-block-tabs-block
    .tab-header-buttons
    button:not(.active):hover
    .tab-title::before {
    filter: brightness(0) saturate(100%) invert(20%) sepia(96%) saturate(1352%) hue-rotate(211deg)
      brightness(118%) contrast(101%);
  }
}

/* Smooth transitions for sticky sidebar state */
.wp-block-ermisch-block-tabs-block .tab-heading,
.wp-block-ermisch-block-tabs-block
  .tab-sidebar.is-stuck
  .tab-header
  .tab-header-buttons
  .tab-title,
.wp-block-ermisch-block-tabs-block
  .tab-sidebar.is-stuck
  .tab-header
  .tab-header-buttons
  .tab-label {
  transition: font-size 0.2s ease-in-out;
}

.wp-block-ermisch-block-tabs-block .tab-sidebar {
  transition: gap 0.1s ease-in-out;
  transition: padding 0.1s ease-in-out;
}

.wp-block-ermisch-block-tabs-block .tab-sidebar.is-stuck {
  padding-top: 1.5rem;
}

@media (max-width: 640px) {
  .wp-block-ermisch-block-tabs-block .tab-sidebar.is-stuck .tab-heading {
    font-size: 1rem;
  }

  .wp-block-ermisch-block-tabs-block
    .tab-sidebar.is-stuck
    .tab-header
    .tab-header-buttons
    .tab-title,
  .wp-block-ermisch-block-tabs-block
    .tab-sidebar.is-stuck
    .tab-header
    .tab-header-buttons
    .tab-label {
    font-size: 0.8rem !important;
  }

  .wp-block-ermisch-block-tabs-block .tab-sidebar.is-stuck {
    gap: 1rem;
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
    opacity: 0.98;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
}


/* ==========================================================================
   11. Plugin – Complianz (Cookie Banner)
   ========================================================================== */

.cookie-menu:hover {
  color: var(--wp--preset--color--primary);
  cursor: pointer;
}

.cookie-statement {
  display: none;
}

.cmplz-links a {
  text-decoration: none !important;
}

.cmplz-link {
  text-transform: uppercase;
}

.cmplz-manage-third-parties,
.cmplz-document-eu {
  display: inline !important;
}


/* ==========================================================================
   12. Plugin – Download Manager
   ========================================================================== */

.wpdm-download-button a {
  text-decoration: none !important;
}

.w3eden .btn-primary,
.w3eden .btn-info,
.w3eden .btn-danger,
.w3eden .btn-success {
  border-style: solid !important;
  border-radius: 8px !important;
  padding: 4px 12px !important;
  border-width: 1px !important;
  font-weight: 500 !important;
  font-size: var(--wp--preset--font-size--body-small, 0.875rem) !important;

  &:hover,
  &:focus,
  &:active {
    opacity: 0.8 !important;
    box-shadow: none !important;
  }
}

.w3eden .btn-primary,
.w3eden .btn-info {
  border-color: var(--wp--preset--color--primary, #0f6dbf) !important;
  color: var(--wp--preset--color--primary, #0f6dbf) !important;
  background-color: transparent !important;
}

.w3eden .btn-danger {
  border-color: var(--wp--preset--color--warning, #fb0c0c) !important;
  color: var(--wp--preset--color--warning, #fb0c0c) !important;
  background-color: transparent !important;
}

.w3eden .btn-success {
  background-color: transparent !important;
  background-image: var(--wp--preset--gradient--blue-to-turquoise) !important;
  border-color: var(--wp--preset--color--border, #dee6e6) !important;
  color: var(--wp--preset--color--primary-foreground, #ffffff) !important;
}

.w3eden .btn .label-price {
  background-color: transparent !important;
}

.w3eden .card-purchases .item .btn-group a.btn-success .fa.fa-arrow-down.white {
  width: 22px !important;
  height: 22px !important;
}

.w3eden .card-purchases .item .btn-group a.btn-success .fa.fa-arrow-down.white::before {
  content: '' !important;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2732%27%20height%3D%2732%27%20fill%3D%27%23ffffff%27%20viewBox%3D%270%200%20256%20256%27%3E%3Cpath%20d%3D%27M248,128a87.34,87.34,0,0,1-17.6,52.81,8,8,0,1,1-12.8-9.62A71.34,71.34,0,0,0,232,128a72,72,0,0,0-144,0,8,8,0,0,1-16,0,88,88,0,0,1,3.29-23.88C74.2,104,73.1,104,72,104a48,48,0,0,0,0,96H96a8,8,0,0,1,0,16H72A64,64,0,1,1,81.29,88.68,88,88,0,0,1,248,128Zm-69.66,42.34L160,188.69V128a8,8,0,0,0-16,0v60.69l-18.34-18.35a8,8,0,0,0-11.32,11.32l32,32a8,8,0,0,0,11.32,0l32-32a8,8,0,0,0-11.32-11.32Z%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E') !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  background-size: 22px 22px !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  width: 22px !important;
  height: 22px !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Download card layout */
.felusch-download-card {
  border: solid 1px var(--wp--preset--color--border, #e5e5e5);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: var(--wp--preset--spacing--sm-16-r, 1rem);
}

.felusch-download-card-body {
  display: flex;
  justify-content: space-between;
  gap: var(--wp--preset--spacing--md-48-r, 1rem);
}

.felusch-download-card-media {
  display: flex;
  gap: var(--wp--preset--spacing--sm-16, 1rem);
}

.felusch-download-card-description {
  color: var(--wp--preset--color--muted, #6c757d);
}

.felusch-download-card-meta {
  display: flex;
  align-items: flex-start;
  gap: var(--wp--preset--spacing--sm-16, 1rem);
  color: var(--wp--preset--color--muted, #6c757d);
}

@media screen and (max-width: 640px) {
  .felusch-download-card-body {
    flex-direction: column;
  }
  .felusch-download-card-meta {
    flex-direction: column;
    gap: 6px;
  }
  .felusch-download-card-link {
    display: flex;
    justify-content: flex-end;
  }
}

.felusch-download-card-meta-entry {
  display: flex;
  align-items: stretch;
  gap: 6px;
}

.felusch-download-card-link .wpdm_cart_form {
  margin: 0px 0px;
}

.w3eden .felusch-download-card-link .btn {
  text-wrap: nowrap;
}

.w3eden h3.felusch-download-card-title {
  font-size: var(--wp--preset--font-size--body-emphasized, 1.375rem);
  color: var(--wp--preset--color--foreground, #333333);
}

.w3eden .link-template-default .card-body {
  display: flex;
  gap: 1rem;
}

/* Pay what you want */
.w3eden .felusch-pwyw .wpdm_cart_form {
  margin-left: 64px;
}

.w3eden .custom-pwyw-container .price-and-button {
  display: flex;
  align-items: center;
  gap: 12px;
}

.w3eden .custom-pwyw-container .price-and-button .form-control {
  width: auto;
  max-width: 6.25rem;
}

@media screen and (max-width: 640px) {
  .w3eden .custom-pwyw-container .price-and-button {
    flex-direction: column;
    align-items: start;
    margin-bottom: var(--wp--preset--spacing--sm-16-r, 1rem);
  }
}

.w3eden .card-purchases #od-fullwidth-view {
  display: none;
}

/* Single Product – Premium Package */
.felusch-premium-package-image {
  max-width: 100%;
}

.felusch-premium-package-image img {
  max-width: 100%;
}

.felusch-premium-package-image-and-description {
  display: flex;
  flex-direction: row;
  gap: var(--wp--preset--spacing--sm-24-r, 1.5rem);
  align-items: flex-start;
}

.felusch-premium-package-buttons hr {
  display: none;
}

.felusch-premium-package {
  padding: var(--wp--preset--spacing--sm-24-r, 1.5rem);
  border: var(--wp--preset--color--border, #e5e5e5) solid 1px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--sm-24-r, 1.5rem);
}

.felusch-premium-package-content {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--sm-24-r, 1.5rem);
}

.felusch-premium-package .__wpdmpp_buy_now_zone_4396 {
  display: none;
}

.felusch-premium-package .wpdm_cart_form {
  margin: 0px !important;
}

.felusch-premium-package .wpdmpp-product-price::before {
  content: 'Preis: ';
}

.felusch-premium-package-buttons {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--wp--preset--spacing--sm-16-r, 1.375rem);
}

.felusch-premium-package-buttons .input-group-asyoupay .iwanttopay {
  width: auto !important;
  max-width: 7rem !important;
}

.w3eden .felusch-download-card .custom-pwyw-container label {
  font-style: italic;
  font-size: smaller;
}

@media screen and (max-width: 640px) {
  .felusch-premium-package-image-and-description {
    flex-direction: column;
    gap: var(--wp--preset--spacing--md-32-r, 2rem);
  }

  .felusch-premium-package-buttons {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Modal login logo */
#wpdm_modal_login_logo::before {
  content: url('../../assets/logo_black_110x110.png');
  display: block;
}

#wpdm_modal_login_logo img {
  display: none !important;
}

#modalloginform {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--wp--preset--spacing--sm-16-r, 1rem) !important;
}

.wpdm-checkbox {
  margin-right: 6px !important;
}

.wpdm-logged-in-actions,
.wpdm-auth-welcome-text {
  display: none !important;
}

.modal-backdrop {
  z-index: 999 !important;
}

#wpdmloginmodal .modal-content {
  background: white;
}

/* WordPress login form */
.felusch-login #loginform {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--sm-16-r, 1rem);
}

.felusch-login .login-username,
.felusch-login .login-password {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--xxs-6, 0.375rem);
}

.felusch-login .login-username input,
.felusch-login .login-password input {
  padding: 8px 12px !important;
  border: solid 1px var(--wp--preset--color--border, #e5e5e5) !important;
  border-radius: 4px !important;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
}

.felusch-login .login-remember label {
  display: flex;
  align-items: center;
  gap: 6px;
}

.felusch-login .login-remember input {
  margin-right: 6px;
  width: 1rem;
  height: 1rem;
  border: solid 1px var(--wp--preset--color--border, #e5e5e5) !important;
}

.felusch-login .login-submit input {
  border-style: solid;
  border-radius: 8px;
  padding: 12px 24px;
  border-width: 1px;
  font-weight: 500;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
  line-height: 1;
  border-color: var(--wp--preset--color--foreground, #333333);
  color: var(--wp--preset--color--primary-foreground, #ffffff);
  background-color: var(--wp--preset--color--foreground, #333333);

  &:hover,
  &:focus,
  &:active {
    opacity: 0.8 !important;
    box-shadow: none !important;
    cursor: pointer;
  }
}

.felusch-login.logged-in {
  border-style: solid;
  border-radius: 8px;
  padding: 12px 24px;
  border-width: 1px;
  font-weight: 500;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
  line-height: 1;
  border-color: var(--wp--preset--color--foreground, #333333);
  background-color: var(--wp--preset--color--primary-foreground, #ffffff);

  &:hover,
  &:focus,
  &:active {
    opacity: 0.8 !important;
    box-shadow: none !important;
    cursor: pointer;
  }
}

.login-form-meta-text {
  font-size: var(--wp--preset--font-size--body-small, 0.875rem) !important;
}

.felusch-downloads .__wpdm_gb_signup_form {
  width: 100% !important;
}

.felusch-downloads #wpdmlogin {
  background-color: transparent !important;
  width: 100% !important;
  padding: 0px !important;
  margin-inline: 0px !important;
  border: none !important;
}

.felusch-downloads #wpdmlogin .form-control {
  font-size: var(--wp--preset--font-size--body-small) !important;
}

.felusch-downloads .login-form {
  margin-top: 0px !important;
}

.felusch-downloads .alert {
  background-color: #ffffff !important;
}

.felusch-downloads .login-form-meta-text .color-blue {
  color: var(--wp--preset--color--foreground, #333333) !important;
}

.felusch-downloads .btn-block.btn-primary {
  border-color: var(--wp--preset--color--foreground, #333333) !important;
  background-color: var(--wp--preset--color--foreground, #333333) !important;
  color: var(--wp--preset--color--primary-foreground, #ffffff) !important;
}


/* ==========================================================================
   13. Plugin – Event Manager
   ========================================================================== */

.em-item-single {
  margin-block: var(--wp--preset--spacing--xl-128-r, 96px);
  max-width: 740px;
  margin-inline: auto;
}

.em-item-header {
  border-top: 1px solid var(--wp--preset--color--border);
  border-bottom: 1px solid var(--wp--preset--color--border);
  padding-top: var(--wp--preset--spacing--sm-24-r, 1.5rem) !important;
}

.em-event-bookings
  .em-booking-form-section-confirm
  .em-booking-form-buttons
  .em-form-submit.em-booking-submit.em-button {
  background: var(--wp--preset--gradient--blue-to-turquoise) !important;
  color: var(--wp--preset--color--background) !important;
  border: var(--wp--preset--color--border) !important;
  font-size: var(
    --wp--preset--font-size--body-normal,
    clamp(0.875rem, 0.787rem + 0.376vw, 1.125rem)
  ) !important;
  font-weight: 400 !important;
  text-transform: none !important;
  border-radius: 8px !important;
  padding-block: var(--wp--preset--spacing--xs-12-r, 12px) !important;
  font-family: var(--wp--preset--font-family--nunito);
  height: max-content !important;
}

.em-event-bookings
  .em-booking-form-section-confirm
  .em-booking-form-buttons
  .em-form-submit.em-booking-submit.em-button:hover,
.em-event-bookings
  .em-booking-form-section-confirm
  .em-booking-form-buttons
  .em-form-submit.em-booking-submit.em-button:active,
.em-event-bookings
  .em-booking-form-section-confirm
  .em-booking-form-buttons
  .em-form-submit.em-booking-submit.em-button:focus {
  color: var(--wp--preset--color--primary--foreground, white) !important;
}

.em-event-bookings
  .em-booking-form-section-confirm
  .em-booking-form-buttons
  .em-form-submit.em-booking-submit.em-button:hover {
  opacity: 0.8 !important;
}


/* ==========================================================================
   14. Plugin – Newsletter
   ========================================================================== */

/* Reset native select arrow */
select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  background-color: white;
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
}

select:focus {
  outline: none;
  border-color: #007aff;
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.2);
}

.tnp-subscription {
  width: 100%;
}

.tnp-field input,
.tnp-field select {
  width: 100%;
}

.tnp-privacy-field {
  align-self: left;
  line-height: 1.1;
}

.tnp-privacy-field label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: inherit;
}

.tnp-privacy-field label input[type='checkbox'] {
  border-width: 0px;
  padding-inline: 0 !important;
  margin: 0;
  flex-shrink: 0;
  width: auto;
}

.felusch-footer-waitlist .tnp-field input,
.felusch-footer-waitlist .tnp-lists select {
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
}

/* Reactivate / Unsubscribe button */
.tnp-reactivate .tnp-submit,
.tnp-unsubscribe .tnp-submit {
  background-color: var(--wp--preset--color--foreground, #333333);
  font-family: var(--wp--preset--font-family--nunito);
  font-size: var(--wp--preset--font-size--body-normal);
  color: var(--wp--preset--color--foreground-foreground, white);
  border-radius: 8px;
  padding: var(--wp--preset--spacing--xs-12, 12px) var(--wp--preset--spacing--xs-24, 24px);
}

/* Footer waitlist */
.felusch-footer-waitlist .tnp-field-firstname,
.felusch-footer-waitlist .tnp-field-surname,
.felusch-footer-waitlist .tnp-field-email,
.felusch-footer-waitlist .tnp-privacy-field,
.felusch-footer-waitlist .tnp-lists {
  margin-bottom: 8px;
}

.felusch-footer-waitlist .tnp-field input,
.felusch-footer-waitlist .tnp-lists select {
  padding: 4px 8px;
  border-radius: 4px;
  border-width: 0px;
}

.felusch-footer-waitlist .tnp-field label {
  font-size: small;
}

.felusch-footer-waitlist .tnp-field-button input {
  padding: 8px 16px;
  width: max-content !important;
  border-width: 0px;
  border-radius: 8px;
  background-color: var(--wp--preset--color--primary, #0f6dbf);
  color: var(--wp--preset--color--primary-foreground, white);
  margin-top: 1rem;
}

.tnp-subscription input.tnp-submit:hover,
.tnp-subscription-minimal input.tnp-submit:hover,
.tnp-submit:hover {
  opacity: 0.8;
  cursor: pointer;
}

/* Regular waitlist */
.felusch-waitlist .tnp-field-firstname,
.felusch-waitlist .tnp-field-surname,
.felusch-waitlist .tnp-field-email,
.felusch-waitlist .tnp-privacy-field,
.felusch-waitlist .tnp-lists {
  display: flex;
  gap: auto;
  justify-content: left;
  margin-bottom: var(--wp--preset--spacing--sm-16, 1rem);
}

.felusch-waitlist .tnp-field-firstname label,
.felusch-waitlist .tnp-field-surname label,
.felusch-waitlist .tnp-field-email label,
.felusch-waitlist .tnp-lists label {
  min-width: 7rem;
  font-weight: 600;
  margin-right: 8px;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
}

.felusch-waitlist .tnp-field input,
.felusch-waitlist .tnp-lists select {
  padding: 4px;
  border-radius: 4px;
  border-width: 0px;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
  padding: var(--wp--preset--spacing--xxs-6, 6px) var(--wp--preset--spacing--sm-24, 24px);
}

.felusch-waitlist .tnp-field-button input {
  margin-top: var(--wp--preset--spacing--sm-24, 24px);
  margin-bottom: 0;
  background-color: var(--wp--preset--color--foreground, #333333);
  border-radius: 8px;
  font-weight: 600;
  padding: var(--wp--preset--spacing--xs-12, 12px) var(--wp--preset--spacing--xs-24, 24px);
  color: var(--wp--preset--color--primary-foreground, white);
  width: max-content !important;
}

.felusch-waitlist .tnp-privacy-field a,
.felusch-waitlist .tnp-privacy-field a:visited {
  color: var(--wp--preset--color--foreground, #333333);
}

.felusch-waitlist .tnp-privacy-field input {
  transform: scale(1.25);
  -webkit-transform: scale(1.25);
  transform-origin: center;
}

/* Honeypot field – visually hidden */
.tnp-field.tnp-field-company {
  position: absolute !important;
  left: -9999px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

@media (max-width: 640px) {
  .felusch-waitlist .tnp-field-firstname,
  .felusch-waitlist .tnp-field-surname,
  .felusch-waitlist .tnp-field-email,
  .felusch-waitlist .tnp-privacy-field,
  .felusch-waitlist .tnp-lists {
    flex-direction: column;
    gap: 8px;
  }
}


/* ==========================================================================
   15. Plugin – Testimonials (Pagination & Form)
   ========================================================================== */

/* Pagination */
.ermisch_testimonials ~ .glsr-pagination {
  background-color: var(--wp--preset--color--primary-foreground);
  box-shadow: var(--wp--preset--shadow--card);
  margin-block: var(--wp--preset--spacing--md-48-r) !important;
  width: 100%;

  .pagination {
    width: 100%;

    .navigation {
      .nav-links {
        display: flex;
        font-size: 0;
        justify-content: center;
        padding: 24px;
        border: 1px solid var(--wp--preset--color--border);
        border-radius: 8px;
        flex-direction: row;
        gap: var(--wp--preset--spacing--xs-12-r);

        .page-numbers {
          font-size: var(--wp--preset--font-size--body-normal);
          display: block;
        }
      }
    }
  }
}

@media (max-width: 1024px) {
  .ermisch_testimonials ~ .glsr-pagination {
    margin-block: var(--wp--preset--spacing--md-32-r) !important;
  }
}

/* Review form */
.testimonial-form {
  width: 100%;
  border: 1px solid var(--wp--preset--color--border, #e1e1e1) !important;
  border-radius: 8px;
  padding: var(--wp--preset--spacing--md-32-r);
}

.testimonial-form .glsr-review-form.glsr-form {
  display: grid;
  grid-template-columns: 0.2fr 1fr;
  row-gap: var(--wp--preset--spacing--sm-24-r);
  column-gap: var(--wp--preset--spacing--sm-24-r);
}

.testimonial-form .glsr-field {
  display: contents;
}

.testimonial-form .glsr-field .glsr-label {
  grid-column: 1 / 2;
  margin: 0;
}

.testimonial-form .glsr-field-choice .glsr-field-subgroup {
  grid-column: 1 / -1;
}

/* field-sizing:content from the plugin makes textarea single-line when empty */
.testimonial-form .glsr-textarea {
  height: auto !important;
  min-height: unset !important;
  field-sizing: fixed !important;
}

/* Custom Phosphor star icon */
form.glsr-form.testimonial-form .glsr-star-rating--stars[class*=' s'] > span {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><path d="M128,189.09l54.72,33.65a8.4,8.4,0,0,0,12.52-9.17l-14.88-62.79,48.7-42A8.46,8.46,0,0,0,224.27,94L160.36,88.8,135.74,29.2a8.36,8.36,0,0,0-15.48,0L95.64,88.8,31.73,94a8.46,8.46,0,0,0-4.79,14.83l48.7,42L60.76,213.57a8.4,8.4,0,0,0,12.52,9.17Z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/></svg>');
}

form.glsr-form.testimonial-form .glsr-star-rating--stars[class*=' s'] > span.gl-active,
form.glsr-form.testimonial-form .glsr-star-rating--stars[class*=' s'] > span.gl-active.gl-selected {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><path d="M128,189.09l54.72,33.65a8.4,8.4,0,0,0,12.52-9.17l-14.88-62.79,48.7-42A8.46,8.46,0,0,0,224.27,94L160.36,88.8,135.74,29.2a8.36,8.36,0,0,0-15.48,0L95.64,88.8,31.73,94a8.46,8.46,0,0,0-4.79,14.83l48.7,42L60.76,213.57a8.4,8.4,0,0,0,12.52,9.17Z" fill="%2347D3EF" stroke="%2347D3EF" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/></svg>');
}

form.glsr-field.glsr-field-choice {
  margin-left: 1.5ch;
}

form.glsr-form.testimonial-form
  .glsr-field-is-invalid
  .glsr-star-rating--stars[class*=' s']
  > span {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><path d="M128,189.09l54.72,33.65a8.4,8.4,0,0,0,12.52-9.17l-14.88-62.79,48.7-42A8.46,8.46,0,0,0,224.27,94L160.36,88.8,135.74,29.2a8.36,8.36,0,0,0-15.48,0L95.64,88.8,31.73,94a8.46,8.46,0,0,0-4.79,14.83l48.7,42L60.76,213.57a8.4,8.4,0,0,0,12.52,9.17Z" fill="none" stroke="%23e02424" stroke-linecap="round" stroke-linejoin="round" stroke-width="8"/></svg>');
}

.testimonial-form .glsr-form > :last-child {
  grid-column: 1 / -1;
}

.glsr-default .testimonial-form button.glsr-button {
  border-radius: 8px;
  background-color: var(--wp--preset--color--foreground);
  color: var(--wp--preset--color--primary-foreground);
  padding-inline: var(--wp--preset--spacing--sm-24-r);
  padding-block: var(--wp--preset--spacing--xs-12-r);
}

/* Honeypot field */
.testimonial-form div.glsr-field.glsr-field-text[data-field='website_confirm'] label,
.testimonial-form div.glsr-field.glsr-field-text[data-field='website_confirm'] input {
  position: absolute !important;
  left: -9999px !important;
  top: auto;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.testimonial-form .glsr-review-form.glsr-form .glsr-form-message.glsr-form-failed {
  grid-column: 1 / -1;
}

.testimonial-form .glsr-review-form.glsr-form .glsr-field-error {
  grid-column: 2 / 3;
}

.testimonial-form .glsr-review-form.glsr-form .glsr-form-message.glsr-form-success {
  grid-column: 1 / -1;
}

.testimonial-form .glsr-review-form.glsr-form .profile-picture-container {
  grid-column: 1 / -1;
  margin: 0;
}

.testimonial-form .glsr-review-form.glsr-form .profile-picture-container .crop-container {
  grid-column: 2 / 3;
  margin: 0;
}

.testimonial-form .glsr-review-form.glsr-form .profile-picture-container > :last-child {
  grid-column: 2 / 3;
}

@media (max-width: 640px) {
  .glsr.glsr-default.glsr-ltr.testimonial-form {
    border: none !important;
    padding: unset;
  }

  .testimonial-form .glsr-review-form.glsr-form {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--sm-16-r);
  }

  .testimonial-form .glsr-field {
    display: block;
  }

  .testimonial-form .glsr-field .glsr-label {
    margin-bottom: var(--wp--preset--spacing--xxs-6);
  }
}


/* ==========================================================================
   16. Profile Picture Preview
   ========================================================================== */

.profile-picture-container {
  display: none;
}

.crop-container {
  margin-bottom: var(--wp--preset--spacing--sm-16-r);
  border: 2px dashed var(--wp--preset--color--border);
  border-radius: 8px;
  padding: var(--wp--preset--spacing--sm-16-r);
  background: var(--wp--preset--color--bg-2);
}

.crop-instruction {
  font-size: var(--wp--preset--font-size--body-small);
  color: var(--wp--preset--color--muted);
  padding: var(--wp--preset--spacing--xs-12-r);
  background: var(--wp--preset--color--card-background);
  border-radius: inherit;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.preview-container {
  display: none;
  text-align: center;
  flex-direction: column;
  gap: var(--wp--preset--spacing--xs-12-r);
}

.preview-image {
  max-width: 150px;
  max-height: 150px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.preview-label {
  text-align: left;
  font-size: var(--wp--preset--font-size--body-small);
  font-weight: bold;
  color: var(--wp--preset--color--foreground);
}

.controls-container {
  display: flex;
  gap: var(--wp--preset--spacing--xs-12-r);
  flex-wrap: wrap;
  margin-top: var(--wp--preset--spacing--sm-16-r);
}

.btn-crop,
.btn-reset,
.btn-remove {
  font-family: var(--wp--preset--font-family--nunito);
  font-size: var(--wp--preset--font-size--body-small);
  border: none;
  padding: var(--wp--preset--spacing--xxs-6) var(--wp--preset--spacing--sm-24-r);
  border-radius: 8px;
  cursor: pointer;
  font-weight: 500;
}

.btn-crop {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--primary-foreground);
}

.btn-reset {
  background: var(--wp--preset--color--muted);
  color: var(--wp--preset--color--primary-foreground);
}

.btn-remove {
  background: var(--wp--preset--color--warning);
  color: var(--wp--preset--color--primary-foreground);
}

.cropper-canvas {
  display: block;
  max-width: 100%;
  min-height: 350px;
}