/* =====================================================
   UTILITIES.CSS
   -----------------------------------------------------
   PURPOSE:
   - Small, single-purpose helper classes
   - Spacing, alignment, display helpers
   - No layout systems or components
===================================================== */

/* utilities.css */

.center-flex {
  display: flex;
  justify-content: center;
}

.mt-20 {
  margin-top: 20px;
}


/* EYEBROW TEXT */

.eyebrow {
  font-size: 0.8rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  opacity: 0.7;
}

/* HERO LEAD */

.hero-lead {
  font-size: 1.2rem;
  max-width: 100%;
}

/* =====================================================
   GLOBal TEXT ssize helpers
===================================================== */

.text80 { font-size: 0.8rem; }
.text90 { font-size: 0.9rem; }
.text100 { font-size: 1rem; }
.text110 { font-size: 1.1rem; }

/* =====================================================
   UTILITIES.CSS
===================================================== */

/* TAG SYSTEM */

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
}

.tags--row {
  flex-wrap: nowrap;
}

.tags--equal > * {
  flex: 1 1 0;
  min-width: 0;
}

/* BAR WRAPPER POSITION FIX */

#barGuests {
  position: relative;
  z-index: 9999;
}

#barGuests .tab-btn {
  position: relative;
  z-index: 10;
}

/* GENERIC HELPERS */

.full-width {
  width: 100%;
}

.text-center {
  text-align: center;
}

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.package-desc { text-align: left; }
.package-details li { color: #555; }

.gold-card.is-active *,
.option-card.is-active *,
.tab-btn.is-active * {
  color: #fff !important;
} 

.option-card.popular::after {
  z-index: 10;
}

/* =====================================
   UTILITIES.CSS
===================================== */

/* PACKAGE TEXT HELPERS */
.package-desc {
  font-weight: 400;
  font-size: 0.9rem;
  color: #555;
  line-height: 1.4;
  text-align: left;
}

.package-details {
  margin-top: 8px;
  padding-left: 18px;
  color: #555;
}

.package-details li {
  font-size: 0.9rem;
  margin-bottom: 4px;
}



/* Mobile fixes */
@media (max-width: 768px) {
  body, html {
    overflow-x: hidden;
  }

  .guest-table-styling .option-card ul.package-details {
    display: none;
  }

  .guest-table-styling .option-card.is-active ul.package-details {
    display: block;
  }
}

/* Bar estimator overrides */
#bar-estimator .tab-btn {
  transition: all 0.25s ease;
}

#bar-estimator .tab-btn:hover {
  background: #fff7e6;
  border-color: #C19A6B;
}

#bar-estimator .tab-btn.active {
  background: linear-gradient(135deg, #b8860b, #d4af37);
  color: #fff;
}

/* Safety overrides for stacking */
.option-card.popular::after {
  z-index: 10;
}

.section {
  padding: var(--space-section) 0;
}