/* Style for the pricing options */
.pricing-option {
  border: 1px solid #ccc; /* Default border */
  border-radius: 5px;
  padding: 15px;
  margin-bottom: 10px; /* Adjusted space between options */
  cursor: pointer; /* Makes the entire option look clickable */
  position: relative; /* Allows positioning of the radio button */
}

/* Hover effect and selected state */
.pricing-option.selected,
.pricing-option:hover {
  border-color: #999;
  background-color: #fff0b850; /* Hover effect background color */
}

/* Additional styles for selected state */
.pricing-option.selected {
  margin-top: 30px; /* Extra space above */
  margin-bottom: 30px; /* Extra space below */
  border-radius: 5px; /* Ensure corners stay rounded */
}

.pricing-option .big-radio-switch.selected {
  border: 1px solid #F3F3F3;
}

.places-left {
  color: #9A9A9A;
  display: block;
  font-weight: 300;
  padding: 5px;
}

/* Spinner styles */
   .spinner {
       border: 16px solid #f3f3f3; /* Light grey */
       border-top: 16px solid #ffeca5; /* Blue */
       border-radius: 50%;
       width: 60px;
       height: 60px;
       animation: spin 2s linear infinite;
       margin: 20px auto; /* Center the spinner */
   }

   @keyframes spin {
       0% { transform: rotate(0deg); }
       100% { transform: rotate(360deg); }
   }

   .btn.disabled,
.btn[disabled] {
    pointer-events: none;
    opacity: 0.5; /* Adjust opacity to indicate the button is disabled */
}

/* Disabled state without opacity */
.pricing-option.disabled {
  pointer-events: none;
  position: relative; /* To contain the pseudo-element */
}

/* Add the semi-transparent overlay */
.pricing-option.disabled::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5); /* Adjust the color and alpha as needed */
  pointer-events: none; /* Ensure overlay doesn't block interactions */
}

/* Ensure .footnote appears above the overlay and is fully opaque */
.pricing-option.disabled .footnote {
  position: relative; /* Bring above the overlay */
}