/* Elementor Compatibility Styles */

/* New file for Elementor-specific styling */

/* Override Elementor default colors with theme colors */
.elementor-kit-default {
  --e-global-color-primary: hsl(0, 85%, 50%);
  --e-global-color-secondary: hsl(0, 0%, 15%);
  --e-global-color-text: hsl(0, 0%, 98%);
  --e-global-color-accent: hsl(0, 85%, 50%);
}

/* Elementor buttons */
.elementor-button {
  background-color: hsl(0, 85%, 50%) !important;
  color: white !important;
  transition: all 0.3s ease;
}

.elementor-button:hover {
  background-color: hsl(0, 85%, 45%) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
}

/* Elementor headings */
.elementor-heading-title {
  color: hsl(0, 0%, 98%);
}

/* Elementor sections with dark background */
.elementor-section {
  background-color: hsl(0, 0%, 7%);
}

/* Elementor cards and widgets */
.elementor-widget-wrap {
  color: hsl(0, 0%, 98%);
}

/* Product grid compatibility */
.elementor-posts-container .elementor-post {
  background-color: hsl(0, 0%, 10%);
  border: 1px solid hsl(0, 0%, 20%);
  border-radius: 0.5rem;
  transition: all 0.3s ease;
}

.elementor-posts-container .elementor-post:hover {
  border-color: hsl(0, 85%, 50%);
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

/* Elementor forms */
.elementor-field-group input,
.elementor-field-group textarea,
.elementor-field-group select {
  background-color: hsl(0, 0%, 10%);
  border: 1px solid hsl(0, 0%, 20%);
  color: hsl(0, 0%, 98%);
}

.elementor-field-group input:focus,
.elementor-field-group textarea:focus,
.elementor-field-group select:focus {
  border-color: hsl(0, 85%, 50%);
  outline: none;
}

/* Elementor navigation menu */
.elementor-nav-menu a {
  color: hsl(0, 0%, 98%);
}

.elementor-nav-menu a:hover {
  color: hsl(0, 85%, 50%);
}

/* Ensure full-width sections work properly */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 1280px;
}

/* Elementor testimonials and reviews */
.elementor-testimonial {
  background-color: hsl(0, 0%, 10%);
  border: 1px solid hsl(0, 0%, 20%);
  padding: 2rem;
  border-radius: 0.5rem;
}

/* Elementor pricing tables */
.elementor-price-table {
  background-color: hsl(0, 0%, 10%);
  border: 1px solid hsl(0, 0%, 20%);
}

.elementor-price-table__ribbon {
  background-color: hsl(0, 85%, 50%);
}

/* Icon boxes */
.elementor-icon-box-icon {
  color: hsl(0, 85%, 50%);
}

/* Progress bars */
.elementor-progress-bar {
  background-color: hsl(0, 85%, 50%);
}

/* Counter widgets */
.elementor-counter-number-wrapper {
  color: hsl(0, 85%, 50%);
}