/* ──────────────────────────────
   PRODUKTSEITEN – LAYOUT & DESIGN
   (Hello Theme + Elementor Free)
────────────────────────────── */

/* Produktseite: Grundlayout */
.single-product .site-main {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
}

/* Produktbild-Galerie */
.woocommerce div.product div.images {
  width: 45%;
  float: left;
  margin-right: 5%;
}

.woocommerce div.product div.images img {
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

/* Produktdetails */
.woocommerce div.product div.summary {
  width: 50%;
  float: left;
}

/* Produkt-Titel */
.woocommerce div.product .product_title {
  font-size: 1.8rem;
  font-weight: 600;
  color: #111;
  margin-bottom: 15px;
}

/* Preisgestaltung */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: #00aa5b; /* Celexx Grün */
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 20px;
}

/* Varianten-Dropdown */
.woocommerce div.product form.cart .variations select {
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 1rem;
}

/* Warenkorb-Button */
.single_add_to_cart_button,
button.single_add_to_cart_button {
  background-color: #00aa5b !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 12px 25px !important;
  font-weight: 600;
  transition: all 0.2s ease;
}

.single_add_to_cart_button:hover {
  background-color: #008b4b !important;
}

/* Tabs ("Beschreibung", "Produktkennzeichnung" usw.) */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 2px solid #e5e5e5;
  margin-top: 50px;
  padding-left: 0;
  text-align: left;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  display: inline-block;
  margin-right: 20px;
  list-style: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: #333;
  text-transform: uppercase;
  font-weight: 500;
  padding: 10px 0;
  border-bottom: 3px solid transparent;
  transition: border-color 0.3s;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
  border-bottom: 3px solid #00aa5b;
  color: #00aa5b;
}

/* Tab-Inhalte */
.woocommerce-Tabs-panel {
  padding-top: 20px;
  color: #333;
  line-height: 1.6;
  font-size: 1rem;
}

/* Abstände & Layout Cleanup */
.woocommerce div.product:after {
  content: "";
  display: block;
  clear: both;
}

.woocommerce div.product .summary.entry-summary {
  padding-top: 10px;
}

.woocommerce div.product .woocommerce-tabs {
  margin-top: 60px;
}

/* PayPal Buttons gleichmäßig */
.woocommerce div.product .wc-proceed-to-checkout,
.woocommerce div.product .paypal-buttons {
  margin-top: 20px;
}

/* Ähnliche Produkte */
.related.products h2 {
  font-size: 1.4rem;
  font-weight: 600;
  margin-top: 60px;
  color: #111;
}

/* Einheitliche Karten für Produktübersicht */
.woocommerce ul.products li.product {
  border: 1px solid #eee;
  border-radius: 10px;
  transition: box-shadow 0.3s;
  background-color: #fff;
}

.woocommerce ul.products li.product:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

/* Buttons auf Produktübersicht */
.woocommerce ul.products li.product .button {
  background-color: #00aa5b;
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  padding: 10px 18px;
  transition: background-color 0.3s;
}

.woocommerce ul.products li.product .button:hover {
  background-color: #008b4b;
}


/* ===============================================
   CELEXX SYSTEMS – Einheitliches Menü-Design
   =============================================== */

/* Hintergrundbalken über gesamte Breite */
.elementor-element-2323 {
  background-color: #f5f5f5 !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid #e0e0e0 !important;
  box-shadow: none !important;
  z-index: 99 !important;
}

/* Menü-Container auf mittlere Breite begrenzen */
.elementor-element-2323 .elementor-container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Menü-Links anpassen */
.elementor-element-2323 a {
  color: #2b2b2b !important;
  font-family: "Open Sans", sans-serif !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  transition: all 0.2s ease-in-out;
}

.elementor-element-2323 a:hover,
.elementor-element-2323 .current-menu-item a {
  color: #00936e !important; /* Celexx-Grün */
}

/* Abstand nach unten */
.elementor-element-2323 {
  margin-bottom: 20px !important;
}

/* Mobile Menü */
@media (max-width: 1024px) {
  .elementor-element-2323 {
    background-color: #f5f5f5 !important;
  }

  .elementor-element-2323 ul {
    background-color: #f5f5f5 !important;
  }
}