/* Custom enhancements for tisc.dev CTA buttons */

/* Enhanced "Get Started" button styling with brighter color */
a[data-testid="nav-get-started"],
a[href*="calendar.app.google"].inline-flex.items-center.gap-2.px-6.py-3,
button[data-testid*="get-started"],
.cta-button,
a.inline-flex.items-center.gap-2.px-6.py-3.bg-primary {
  background: linear-gradient(135deg, #FF6B35 0%, #FF8C42 100%) !important;
  color: white !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Subtle hover effect with elevation and brightness */
a[data-testid="nav-get-started"]:hover,
a[href*="calendar.app.google"].inline-flex.items-center.gap-2.px-6.py-3:hover,
button[data-testid*="get-started"]:hover,
.cta-button:hover,
a.inline-flex.items-center.gap-2.px-6.py-3.bg-primary:hover {
  background: linear-gradient(135deg, #FF8C42 0%, #FFA552 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(255, 107, 53, 0.45) !important;
}

/* Shimmer effect on hover */
a[data-testid="nav-get-started"]::before,
a[href*="calendar.app.google"].inline-flex.items-center.gap-2.px-6.py-3::before,
button[data-testid*="get-started"]::before,
.cta-button::before,
a.inline-flex.items-center.gap-2.px-6.py-3.bg-primary::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent) !important;
  transition: left 0.5s ease !important;
}

a[data-testid="nav-get-started"]:hover::before,
a[href*="calendar.app.google"].inline-flex.items-center.gap-2.px-6.py-3:hover::before,
button[data-testid*="get-started"]:hover::before,
.cta-button:hover::before,
a.inline-flex.items-center.gap-2.px-6.py-3.bg-primary:hover::before {
  left: 100% !important;
}

/* Active state for better feedback */
a[data-testid="nav-get-started"]:active,
a[href*="calendar.app.google"].inline-flex.items-center.gap-2.px-6.py-3:active,
button[data-testid*="get-started"]:active,
.cta-button:active,
a.inline-flex.items-center.gap-2.px-6.py-3.bg-primary:active {
  transform: translateY(0px) !important;
  box-shadow: 0 3px 10px rgba(255, 107, 53, 0.35) !important;
}

/* Ensure primary CTA buttons throughout the page get the enhanced styling */
.bg-primary.text-primary-foreground.rounded-lg {
  background: linear-gradient(135deg, #FF6B35 0%, #FF8C42 100%) !important;
  box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.bg-primary.text-primary-foreground.rounded-lg:hover {
  background: linear-gradient(135deg, #FF8C42 0%, #FFA552 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(255, 107, 53, 0.45) !important;
}
