/**
 * Theme Name:     awisto Child Theme
 * Author:         Brainstorm Force
 * Template:       astra
 * Text Domain:	   awisto-child-theme
 * Description:    The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
 * Theme URI:      https://www.awisto.de
 * Author URI:     https://www.awisto.de
 * Version:        1
 */

/* ::: ICON-LAUNCHER ::: */
.mega-menu-link:hover{
transition:0.3s;
}

/* Launcher Gruppe unten rechts */
.aw-contact-launchers {
  position: fixed;
  right: 1.75rem;
  bottom: 1.75rem;
  z-index: 9998;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: flex-end;
}

/* Alle Buttons im selben Stil */
.aw-contact-button {
  border: 4px solid #1c1e23;
  padding: 0;
  margin: 0;
  cursor: pointer;
  background: #FFFFFF;
  border-radius: 999px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  transition: box-shadow 0.15s ease;
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aw-contact-button:hover {
  background: #fff;
  border: 4px solid #1c1e23;
  transition: 0.5s;
}

/* Icons innen. */
.aw-contact-button img {
  display: block;
  width: 64px;
  height: 64px;
}

.aw-contact-button i {
  font-size: 30px;
  color: #2C2F37;
}

/* Kein Browser Fokus Rand */
.aw-contact-button:focus,
.aw-contact-button:active {
  outline: none;
}

/* Default Hover Stil für alle Buttons ohne Bounce */
.aw-contact-button:hover,
.aw-contact-button:focus-visible {
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.3);
  outline: none;
}

/* Bounce nur für den Chatbot Button */
.aw-contact-button--chat:hover,
.aw-contact-button--chat:focus-visible {
  animation: awContactBounce 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.aw-contact-button:not(.aw-contact-button--chat) i {
  transition: color 0.2s ease;
}

.aw-contact-button:not(.aw-contact-button--chat):hover i {
  color: #00B3D2;
}

/* Bounce Keyframes */
@keyframes awContactBounce {
  0% { transform: translateY(0); }
  40% { transform: translateY(-4px); }
  65% { transform: translateY(0); }
  85% { transform: translateY(-2px); }
  100% { transform: translateY(0); }
}

/* Modal Grundstruktur */
.aw-contact-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 0 1.75rem 6rem 1.75rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

.aw-contact-modal.aw-contact-modal-open {
  opacity: 1;
  pointer-events: auto;
}

/* Verdunkelung */
.aw-contact-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}

/* Fenster unten rechts */
.aw-contact-window {
  position: relative;
  max-width: 420px;
  width: 90vw;
  height: 500px;
  max-height: calc(100vh - 8rem);
  background: transparent;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-self: flex-end;
}

/* Fenster Einblend Animation */
.aw-contact-modal.aw-contact-modal-open .aw-contact-window {
  animation: awContactModalIn 0.25s cubic-bezier(0.22, 0.61, 0.36, 1);
}

@keyframes awContactModalIn {
  0% {
    transform: translateY(16px) scale(0.98);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

/* Rahmen und Inhalt */
.aw-contact-frame-wrapper {
  flex: 1;
  border-radius: 18px;
  overflow: hidden;
  background: #000;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
}

.aw-contact-frame-wrapper iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}

/* Standard Styling für Platzhalter Inhalte */
.aw-contact-content {
  padding: 1.5rem;
  color: #f5f5f5;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.aw-contact-content h2 {
  margin-top: 0;
  margin-bottom: 0.75rem;
  font-size: 1.3rem;
}

/* Schließen Button */
.aw-contact-close {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: none;
  background: #ffffff;
  color: #1c1e23;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.aw-contact-close:hover,
.aw-contact-close:focus-visible {
  outline: none;
  transform: translateY(-1px);
}

/* Tooltip wie Bootstrap 5 (Top) */
.aw-contact-launchers .aw-contact-button {
  position: relative;
}

.aw-contact-launchers .aw-contact-button::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.9);
  color: #ffffff;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.1;
  white-space: nowrap;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 10000;
  transition: opacity 0.12s ease, transform 0.12s ease;
}

.aw-contact-launchers .aw-contact-button::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: calc(100% + 2px);
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.9);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 10000;
  transition: opacity 0.12s ease, transform 0.12s ease;
}

.aw-contact-launchers .aw-contact-button:hover::after,
.aw-contact-launchers .aw-contact-button:focus-visible::after,
.aw-contact-launchers .aw-contact-button:active::after,
.aw-contact-launchers .aw-contact-button:hover::before,
.aw-contact-launchers .aw-contact-button:focus-visible::before,
.aw-contact-launchers .aw-contact-button:active::before {
  opacity: 1;
  visibility: visible;
}

.aw-contact-launchers .aw-contact-button:hover::after,
.aw-contact-launchers .aw-contact-button:focus-visible::after,
.aw-contact-launchers .aw-contact-button:active::after {
  transform: translateX(-50%) translateY(-2px);
}

/* Mobile Optimierung */
@media (max-width: 600px) {
  .aw-contact-launchers {
    flex-direction: row;
    gap: 0.5rem;
    right: 1rem;
    bottom: 1rem;
  }

  .aw-contact-button {
    width: 48px;
    height: 48px;
    border-width: 3px;
  }

  .aw-contact-button img {
    width: 48px;
    height: 48px;
  }

  .aw-contact-button i {
    font-size: 20px;
  }

  .aw-contact-modal {
    justify-content: center;
    align-items: flex-end;
    padding: 0 1rem 5rem;
  }

  .aw-contact-window {
    width: 100%;
    max-width: 420px;
    height: 70vh;
    max-height: calc(100vh - 6rem);
  }
}

/* Bootstrap-like Tooltip als echtes Element im body */
.aw-tooltip {
  position: fixed;
  z-index: 100000;
  pointer-events: none;

  background: rgba(0, 0, 0, 0.9);
  color: #fff;

  border-radius: 6px;
  padding: 6px 10px;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.1;
  white-space: no-wrap;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);

  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.12s ease, transform 0.12s ease;
}

.aw-tooltip.aw-tooltip--show {
  opacity: 1;
  transform: translateY(0);
}

/* Pfeil unten, zeigt nach unten zum Icon */
.aw-tooltip::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -6px;
  transform: translateX(-50%);

  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.9);
}
