/* Faetastic Entertainment - Elegant Rosegold Button Styles */
/* Inspired by the soft, premium aesthetic of the Faetastic brand */

/* Global Button Styles */
.elementor-button {
  background: rgba(247, 205, 192, 0.15) !important;
  color: #d38364 !important;
  border: 1.5px solid rgba(211, 131, 100, 0.3) !important;
  border-radius: 60px !important;
  padding: 12px 36px !important;
  box-shadow: 0 2px 12px rgba(211, 131, 100, 0.08) !important;
  transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  position: relative;
  overflow: hidden;
  font-weight: 400 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase;
  font-size: 13px !important;
  backdrop-filter: blur(10px);
}

/* Subtle shimmer effect */
.elementor-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(247, 205, 192, 0.3),
    transparent
  );
  transition: left 0.6s ease;
  z-index: 0;
}

.elementor-button-content-wrapper {
  position: relative;
  z-index: 1;
}

/* Hover State - Elegant Fill */
.elementor-button:hover,
.elementor-button:focus {
  background: linear-gradient(
    135deg,
    rgba(211, 131, 100, 0.12) 0%,
    rgba(247, 205, 192, 0.25) 100%
  ) !important;
  color: #d38364 !important;
  border-color: rgba(211, 131, 100, 0.5) !important;
  box-shadow: 0 4px 20px rgba(211, 131, 100, 0.15) !important;
  transform: translateY(-1px) !important;
}

.elementor-button:hover::before,
.elementor-button:focus::before {
  left: 100%;
}

/* Small Button Variant */
.elementor-button.elementor-size-sm {
  padding: 10px 28px !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
}

/* Large Button Variant */
.elementor-button.elementor-size-lg {
  padding: 16px 48px !important;
  font-size: 14px !important;
  letter-spacing: 1.5px !important;
}

/* Solid/Primary Button Variant */
.elementor-button.elementor-button-primary {
  background: linear-gradient(135deg, #d38364 0%, #e8b4a0 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 16px rgba(211, 131, 100, 0.25) !important;
}

.elementor-button.elementor-button-primary:hover,
.elementor-button.elementor-button-primary:focus {
  background: linear-gradient(135deg, #e8b4a0 0%, #f7cdc0 100%) !important;
  box-shadow: 0 6px 24px rgba(211, 131, 100, 0.35) !important;
  transform: translateY(-2px) !important;
}

/* Outline Button Variant - Ghost Style */
.elementor-button-link {
  background: transparent !important;
  color: #d38364 !important;
  border: 1.5px solid rgba(211, 131, 100, 0.4) !important;
  box-shadow: none !important;
}

.elementor-button-link:hover,
.elementor-button-link:focus {
  background: rgba(247, 205, 192, 0.1) !important;
  color: #d38364 !important;
  border-color: rgba(211, 131, 100, 0.6) !important;
  box-shadow: 0 2px 12px rgba(211, 131, 100, 0.1) !important;
}

/* Button with Icon */
.elementor-button svg {
  fill: currentColor !important;
  transition: all 0.4s ease !important;
  opacity: 0.9;
}

.elementor-button:hover svg {
  opacity: 1;
  transform: scale(1.05);
}

/* Disabled State */
.elementor-button:disabled,
.elementor-button.disabled {
  background: rgba(200, 200, 200, 0.1) !important;
  border-color: rgba(200, 200, 200, 0.3) !important;
  color: rgba(100, 100, 100, 0.5) !important;
  cursor: not-allowed;
  box-shadow: none !important;
  transform: none !important;
  opacity: 0.6;
}

/* Active/Pressed State */
.elementor-button:active {
  transform: translateY(0) scale(0.98) !important;
  box-shadow: 0 1px 6px rgba(211, 131, 100, 0.15) !important;
}

/* Special - Elegant Glow on Focus */
.elementor-button:focus-visible {
  outline: 2px solid rgba(211, 131, 100, 0.3);
  outline-offset: 3px;
}
