/**
 * Mobile Button Fix
 * Fixes the button padbottommobile blue w-button styling issues on mobile
 */

/* Fix button styling on all screen sizes */
.button.padbottommobile.blue.w-button {
  /* Solid blue background for all viewports */
  background-image: none !important;
  background-color: var(--blue-accent-darkest) !important;
  
  /* Light glow shadow */
  box-shadow: 0 0 15px 2px var(--primary-light) !important;
  
  /* Proper text sizing */
  font-size: 1rem !important;
  font-weight: 600 !important;
  
  /* Consistent padding */
  padding: 12px 24px !important;
  
  /* Proper button styling */
  border: none !important;
  border-radius: 8px !important;
  
  /* Text styling */
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  text-decoration: none !important;
  
  /* Layout */
  display: inline-block !important;
  text-align: center !important;
  
  /* Transitions */
  transition: all 0.3s ease !important;
  
  /* Font */
  font-family: 'Gluten', sans-serif !important;
}

/* Hover state */
.button.padbottommobile.blue.w-button:hover {
  background-image: none !important;
  background-color: var(--blue-accent-darkest) !important;
  box-shadow: 0 0 20px 4px var(--primary-light) !important;
  transform: translateY(-2px) !important;
  color: #ffffff !important;
}

/* Active state */
.button.padbottommobile.blue.w-button:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 10px rgba(79, 118, 255, 0.2) !important;
}

/* Tablet adjustments */
@media screen and (max-width: 768px) {
  .button.padbottommobile.blue.w-button {
    font-size: 0.95rem !important;
    padding: 10px 20px !important;
  }
}

/* Mobile adjustments */
@media screen and (max-width: 479px) {
  .button.padbottommobile.blue.w-button {
    font-size: 0.85rem !important;
    padding: 8px 18px !important;
    letter-spacing: 0.3px !important;
    
    /* Ensure text doesn't break */
    white-space: nowrap !important;
    
    /* Maintain minimum width for readability */
    min-width: 120px !important;
  }
  
  /* Hover state for mobile - slightly less movement */
  .button.padbottommobile.blue.w-button:hover {
    transform: translateY(-1px) !important;
  }
}

/* Very small mobile adjustments */
@media screen and (max-width: 375px) {
  .button.padbottommobile.blue.w-button {
    font-size: 0.8rem !important;
    padding: 8px 16px !important;
    min-width: 110px !important;
  }
}

/* Override any conflicting Webflow styles */
.w-button {
  background-image: none;
  background-color: transparent;
}

/* Specific fix for the "Click Here" button in swap section */
.button.padbottommobile.blue.w-button[onclick*="simpleHandleBuyNow"] {
  margin-bottom: 12px !important;
}

/* Ensure consistent styling across all instances */
a.button.padbottommobile.blue.w-button {
  display: inline-block !important;
  text-decoration: none !important;
  cursor: pointer !important;
}