/* Axxon Germany — static site additions */

/* Floating social buttons */
#ax-social-float {
  position: fixed;
  left: 25px;
  bottom: 25px;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ax-float-btn {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  text-decoration: none;
}

.ax-float-btn:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.ax-float-btn--facebook {
  background: #1877f2;
}

.ax-float-btn--facebook svg {
  width: 28px;
  height: 28px;
}

.ax-float-btn--whatsapp {
  background: #49e670;
}

#ax-whatsapp-btn svg {
  width: 32px;
  height: 32px;
}

/* Contact page — WhatsApp icon buttons */
.ax-whatsapp-contact {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  margin-top: 0.5rem;
}

.ax-whatsapp-contact__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-width: 140px;
  padding: 1.5rem 1.25rem;
  background: #fff;
  border: 2px solid #2db34a;
  border-radius: 12px;
  text-decoration: none;
  color: #333;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  font-family: Almarai, Cairo, sans-serif;
}

.ax-whatsapp-contact__item:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(45, 179, 74, 0.25);
  background: #f0fdf4;
}

.ax-whatsapp-contact__icon {
  display: flex;
  width: 64px;
  height: 64px;
}

.ax-whatsapp-contact__icon svg {
  width: 100%;
  height: 100%;
}

.ax-whatsapp-contact__label {
  font-size: 1rem;
  font-weight: 700;
  color: #2db34a;
}

.ax-whatsapp-contact__number {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1a1a1a;
  direction: ltr;
}

.ax-whatsapp-contact__item--single {
  width: 100%;
  max-width: 280px;
}

@media (max-width: 480px) {
  .ax-whatsapp-contact {
    flex-direction: column;
  }

  .ax-whatsapp-contact__item {
    width: 100%;
    flex-direction: row;
    justify-content: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
  }

  .ax-whatsapp-contact__icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
  }

  .ax-whatsapp-contact__label,
  .ax-whatsapp-contact__number {
    text-align: right;
  }
}

/* Site theme — green primary (inherited from brand logo) */
:root {
  /* Brand colors from the German Pest Control logo */
  --e-global-color-primary: #2db34a;
  --e-global-color-secondary: #1a1a1a;
  --e-global-color-accent: #39c95a;
  --brand-green: #2db34a;
  --brand-dark: #1a1a1a;
  --brand-green-light: #39c95a;
}

.elementor-nav-menu--dropdown a.elementor-item-active,
.elementor-nav-menu--dropdown a.highlighted {
  color: #ffffff !important;
}

/* Main Navigation Menu Active/Hover Colors (Green) */
.elementor-nav-menu--main a.elementor-item-active,
.elementor-nav-menu--main a.elementor-item:hover {
  color: #2db34a !important;
}

.elementor-nav-menu--main.e--pointer-underline .elementor-item-active:after,
.elementor-nav-menu--main.e--pointer-underline .elementor-item-active:before,
.elementor-nav-menu--main.e--pointer-underline .elementor-item:hover:after,
.elementor-nav-menu--main.e--pointer-underline .elementor-item:hover:before,
.elementor-nav-menu--main .e--pointer-underline .elementor-item-active:after,
.elementor-nav-menu--main .e--pointer-underline .elementor-item-active:before,
.elementor-nav-menu--main .e--pointer-underline .elementor-item:hover:after,
.elementor-nav-menu--main .e--pointer-underline .elementor-item:hover:before {
  background-color: #2db34a !important;
}

.elementor-widget-divider.elementor-view-stacked .elementor-icon {
  color: #ffffff;
  fill: #ffffff;
}

/* ══════════════════════════════════════════════════════
   BRAND ICON COLORS — inherited from the logo palette
   Primary green : #2db34a  |  Dark charcoal: #1a1a1a
   ══════════════════════════════════════════════════════ */

/* 1. Base rule — all Elementor SVG icons default to brand green */
.e-font-icon-svg,
.elementor-icon svg,
.elementor-icon-list-icon svg {
  fill: #2db34a !important;
  color: #2db34a !important;
}

/* 2. Icons inside explicitly dark-background Elementor sections stay white
      (e.g. dark header strip, CTA band with background-color set inline) */
[data-settings*="background_background"] > .e-con-inner .e-font-icon-svg,
[data-settings*="background_background"] > .e-con-inner .elementor-icon svg,
[data-settings*="background_background"] > .e-con-inner .elementor-icon-list-icon svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* 3. Header nav icons (burger / close) — keep white against the dark header */
.elementor-location-header .e-font-icon-svg,
.elementor-location-header .elementor-icon svg,
.elementor-menu-toggle .e-font-icon-svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* 4. Footer icons — brand green (light footer background) */
.elementor-location-footer .e-font-icon-svg,
.elementor-location-footer .elementor-icon svg,
.elementor-location-footer .elementor-icon-list-icon svg {
  fill: #2db34a !important;
  color: #2db34a !important;
}

/* 5. Check-circle / tick icons in feature lists — brand green */
.e-far-check-circle,
.elementor-icon-list-item .e-font-icon-svg {
  fill: #2db34a !important;
  color: #2db34a !important;
}

/* 6. Stacked icon boxes (the badge-style icon widgets) —
      icon itself stays brand green; the box background handles contrast */
.elementor-view-stacked .elementor-icon svg,
.elementor-view-stacked .e-font-icon-svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* 7. Mobile floating CTA buttons always white */
.mobile-floating-btn svg,
.ax-float-btn svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* 8. Make stacked icon wrapper background use brand green */
.elementor-view-stacked .elementor-icon {
  background-color: #2db34a !important;
  border-color: #2db34a !important;
}

/* 9. Framed icon wrapper uses brand green border */
.elementor-view-framed .elementor-icon {
  border-color: #2db34a !important;
}
.elementor-view-framed .elementor-icon svg,
.elementor-view-framed .e-font-icon-svg {
  fill: #2db34a !important;
  color: #2db34a !important;
}

/* 10. Arrow icons in service cards — brand green */
.e-fas-arrow-left,
.e-fas-arrow-right {
  fill: #2db34a !important;
  color: #2db34a !important;
}

/* Contracting page — trust badges (ISO, Ministry of Health) on light background */
.elementor-element-b80877a .elementor-view-default .elementor-icon svg,
.elementor-element-b80877a .elementor-view-default .e-font-icon-svg {
  fill: #2db34a !important;
  color: #2db34a !important;
}

/* Contracting page — feature cards grid + 4-year warranty card */
.elementor-967 .elementor-element.elementor-element-329f836,
.elementor-967 .elementor-element.elementor-element-a6eef23 {
  flex-direction: column;
  gap: 16px;
}

.elementor-967 .elementor-element.elementor-element-b80877a {
  margin-top: 8px;
  padding-top: 20px;
  border-top: 1px solid rgba(45, 179, 74, 0.15);
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y {
  padding: 24px;
  background-color: #ffffff;
  border: solid;
  border-width: 0 4px 0 0;
  border-color: var(--brand-green, #2db34a);
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(26, 26, 26, 0.04);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y:hover {
  transform: translateY(-7px);
  box-shadow: 0 10px 24px rgba(45, 179, 74, 0.12);
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y .elementor-icon-box-wrapper {
  align-items: flex-start;
  gap: 15px;
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y .elementor-icon {
  font-size: 20px;
  padding: 9px;
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y.elementor-view-stacked .elementor-icon {
  background-color: #ebf1f1 !important;
  border-color: #ebf1f1 !important;
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y.elementor-view-stacked .elementor-icon svg,
.elementor-967 .elementor-element.elementor-element-ax-warranty-4y.elementor-view-stacked .e-font-icon-svg {
  fill: #2db34a !important;
  color: #2db34a !important;
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y .elementor-icon-box-title {
  font-family: "Almarai", sans-serif;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 6px;
}

.elementor-967 .elementor-element.elementor-element-ax-warranty-4y .elementor-icon-box-description {
  font-family: "Almarai", sans-serif;
  font-weight: 400;
  line-height: 1.65;
  color: #475569;
}

@media (max-width: 767px) {
  .elementor-967 .elementor-element.elementor-element-329f836,
  .elementor-967 .elementor-element.elementor-element-a6eef23 {
    width: 100% !important;
    max-width: 100% !important;
    --width: 100% !important;
  }

  .elementor-967 .elementor-element.elementor-element-ax-warranty-4y {
    padding: 20px;
  }

  .elementor-967 .elementor-element.elementor-element-b80877a {
    margin-top: 4px;
    padding-top: 16px;
  }
}

/* Hero backgrounds — single image, no tiling */
.elementor-element-1c54aa6:not(.elementor-motion-effects-element-type-background),
.elementor-element-1c54aa6 > .elementor-motion-effects-container > .elementor-motion-effects-layer,
.elementor-element-4403910:not(.elementor-motion-effects-element-type-background),
.elementor-element-4403910 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}


/* Contact page — contact info descriptions share one style */
.elementor-23 .elementor-element-cb422b5 .elementor-icon-box-description,
.elementor-23 .elementor-element-6fa12f9 .elementor-icon-box-description,
.elementor-23 .elementor-element-e8f2b33 .elementor-icon-box-description,
.elementor-23 .elementor-element-63927c7 .elementor-icon-box-description {
  font-family: "Almarai", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--e-global-color-text, #475569);
  margin: 0;
}

/* Make Home Hero Background White */
.elementor-14 .elementor-element.elementor-element-4403910,
.elementor-14 .elementor-element.elementor-element-4403910 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-color: #ffffff !important;
    background-image: none !important;
}

.elementor-14 .elementor-element.elementor-element-4403910::before,
.elementor-14 .elementor-element.elementor-element-4403910 > .elementor-background-video-container::before,
.elementor-14 .elementor-element.elementor-element-4403910 > .e-con-inner > .elementor-background-video-container::before,
.elementor-14 .elementor-element.elementor-element-4403910 > .elementor-background-slideshow::before,
.elementor-14 .elementor-element.elementor-element-4403910 > .e-con-inner > .elementor-background-slideshow::before,
.elementor-14 .elementor-element.elementor-element-4403910 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before {
    background-color: transparent !important;
}

/* Ensure text is readable if it was white */
.elementor-14 .elementor-element.elementor-element-4403910 .elementor-heading-title,
.elementor-14 .elementor-element.elementor-element-4403910 .elementor-widget-text-editor {
    color: #1a1a1a;
}

.elementor-element-8b0a10c > .e-con-inner { max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }
.elementor-element-8b0a10c { padding: 0 !important; margin: 0 !important; }

/* Mobile off-canvas menu — static site fallback */
.e-off-canvas[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
