/* Custom styles for Guam AI Support website */

html {
  scroll-behavior: smooth;
}

/* Founders 50 Badge Styles */
.founder-badge {
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
  background: linear-gradient(135deg, #20c997, #0d6efd);
  color: white;
  font-weight: bold;
  font-size: 0.8rem;
  padding: 0.3rem 0.8rem;
  text-align: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  z-index: 10;
  display: none;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
  letter-spacing: 0.5px;
  border-radius: 0 0 0 4px;
  transform: translateY(-5px);
}

.founder-open .founder-badge {
  display: block !important;
}

.hidden.founder-open\:block {
  display: none;
}

.founder-open .hidden.founder-open\:block {
  display: block;
}

/* Enhanced Founders 50 card styles */
.founder-open .pricing-card {
  border: 2px solid #20c997;
  box-shadow: 0 8px 24px rgba(32, 201, 151, 0.15);
  transform: scale(1.02);
  transition: all 0.3s ease;
}

.founder-open .pricing-card:hover {
  transform: scale(1.04);
  box-shadow: 0 12px 28px rgba(32, 201, 151, 0.2);
}

.founder-open .countdown-banner {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(32, 201, 151, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(32, 201, 151, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(32, 201, 151, 0);
  }
}

/* Crossed out price */
.crossed-price {
  text-decoration: line-through;
  color: #6c757d;
  font-size: 1.1rem;
  margin-bottom: 0.25rem;
}

/* Countdown banner styles */
.countdown-banner {
  background: linear-gradient(90deg, #1864ab, #20c997);
  color: white;
  font-weight: bold;
  border-radius: 0.5rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  position: relative;
}

.countdown-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: repeating-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.1),
    rgba(255, 255, 255, 0.1) 10px,
    rgba(255, 255, 255, 0.2) 10px,
    rgba(255, 255, 255, 0.2) 20px
  );
}

/* FAQ Details/Summary Styles */
details {
  border-radius: 0.5rem;
  overflow: hidden;
}

details summary {
  position: relative;
  padding: 1rem 1.5rem;
  cursor: pointer;
  font-weight: bold;
  list-style: none;
}

details summary::after {
  content: "+";
  position: absolute;
  right: 1.5rem;
  font-weight: bold;
  transition: transform 0.2s ease;
}

details[open] summary::after {
  content: "−";
}

details summary::-webkit-details-marker {
  display: none;
}

/* Language Toggle Styles */
.language-toggle input[type="checkbox"] {
  height: 0;
  width: 0;
  visibility: hidden;
  position: absolute;
}

.language-toggle label {
  cursor: pointer;
  text-indent: -9999px;
  width: 50px;
  height: 25px;
  background: #d1d5db;
  display: block;
  border-radius: 25px;
  position: relative;
}

.language-toggle label:after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 21px;
  height: 21px;
  background: #fff;
  border-radius: 21px;
  transition: 0.3s;
}

.language-toggle input:checked + label {
  background: #1c7ed6;
}

.language-toggle input:checked + label:after {
  left: calc(100% - 2px);
  transform: translateX(-100%);
}

.language-toggle label:active:after {
  width: 30px;
}

/* Testimonial Slider Styles */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.testimonial-slide {
  display: none;
  animation: fadeIn 0.5s ease-in-out;
}

.testimonial-slide.active {
  display: block;
}

/* Focus styles for accessibility */
a:focus, button:focus, input:focus, select:focus, textarea:focus {
  outline: 2px solid #1c7ed6;
  outline-offset: 2px;
}

/* High contrast styles for better readability */
.text-primary {
  color: #1c7ed6;
}

.text-secondary {
  color: #20c997;
}

.text-neutral-dark {
  color: #343a40;
}

/* Form input focus styles */
input:focus, select:focus, textarea:focus {
  border-color: #1c7ed6;
  box-shadow: 0 0 0 2px rgba(28, 126, 214, 0.3);
}
