/* WCTE XV 2027 - Custom Styles */

:root {
  --gold: #C9A66B;           /* Luxurious warm gold */
  --gold-light: #E8D5A3;
  --accent: #C9A66B;
}

/* Smooth focus states - luxury gold */
input:focus, select:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201, 166, 107, 0.15);
}

/* Luxury gold accents */
.gold-text {
  color: var(--gold);
}

.gold-border {
  border-color: var(--gold);
}

.gold-button {
  background-color: var(--gold);
  color: #111111;
  transition: all 0.2s ease;
}

.gold-button:hover {
  background-color: var(--gold-light);
  transform: translateY(-1px);
}

/* Dates list hover improvement */
#dates-list > div:hover {
  background-color: #27272a;
}

/* Form polish */
#interest-form input,
#interest-form select {
  transition: all 0.2s ease;
}

/* Subtle animation for stats */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.grid > div {
  animation: fadeUp 0.4s ease backwards;
}

.grid > div:nth-child(2) { animation-delay: 60ms; }
.grid > div:nth-child(3) { animation-delay: 120ms; }
.grid > div:nth-child(4) { animation-delay: 180ms; }

/* Elegant section dividers */
.luxury-divider {
  border-top: 1px solid rgba(201, 166, 107, 0.2);
}

/* More refined form styling */
#interest-form select,
#interest-form input {
  background-color: #111113;
  border: 1px solid rgba(255,255,255,0.15);
}

#interest-form select option {
  background-color: #111113;
}

/* ============================================
   TOUR DATES — Rich textured list rows
   ============================================ */

/* Extra depth + subtle texture on the dates container */
#dates-list {
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04),
              0 10px 30px -15px rgba(0,0,0,0.6);
}

/* Regular rows get a subtle gold inner glow on hover for extra depth */
#dates-list > div:not(.nationals-row):hover {
  box-shadow: 0 8px 20px -4px rgba(0,0,0,0.35),
              inset 0 0 0 1px rgba(201, 166, 107, 0.12);
}

/* Nationals rows — strong luxurious treatment + lift */
#dates-list .nationals-row {
  box-shadow: 0 12px 32px -8px rgba(0,0,0,0.6),
              inset 0 1px 0 rgba(255,255,255,0.1),
              0 0 0 1px rgba(201, 166, 107, 0.12);
}

#dates-list .nationals-row:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 44px -8px rgba(0,0,0,0.65),
              0 0 0 1px rgba(201, 166, 107, 0.45),
              inset 0 1px 0 rgba(255,255,255,0.12);
}
