/* ============================================================
   _chips.css — CHIP / EYEBROW COMPONENT (site-wide)

   Usage:
     <span class="bee-chip bee-chip--gold">Dive into Adventure</span>

   Variants:
     .bee-chip--gold   primary brand eyebrow
     .bee-chip--blue   accent eyebrow (services, packages)
     .bee-chip--ghost  neutral, for muted contexts
   ============================================================ */

.bee-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: var(--bee-space-2xs);
  padding: 0.5em 1.25em !important;
  border-radius: var(--bee-radius-pill) !important;
  font-family: inherit;
  font-size: var(--bee-text-sm);
  font-weight: 600;
  letter-spacing: var(--bee-tracking-widest);
  line-height: 1;
  text-transform: uppercase;
      width: fit-content !important;

  /* Glassy backdrop */
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  /* Default border + subtle glow */
  border: 1px solid var(--bee-gold-border);
  box-shadow:
    0 0 0 1px rgba(255, 219, 27, 0.08),
    0 4px 24px var(--bee-gold-glow),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

/* Decorative dot on the left of every chip */
.bee-chip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ============================================
   GOLD VARIANT
   ============================================ */
.bee-chip--gold {
  background: var(--bee-gradient-glass-gold);
  color: var(--bee-gold);
  border-color: var(--bee-gold-border);
}

.bee-chip--gold::before {
  background: var(--bee-gold);
  box-shadow: 0 0 8px rgba(255, 219, 27, 0.8);
}

/* ============================================
   BLUE VARIANT
   ============================================ */
.bee-chip--blue {
  background: linear-gradient(
    135deg,
    rgba(127, 212, 255, 0.18),
    rgba(93, 202, 165, 0.08)
  );
  color: var(--bee-blue);
  border-color: rgba(127, 212, 255, 0.35);
  box-shadow:
    0 0 0 1px rgba(127, 212, 255, 0.08),
    0 4px 24px rgba(127, 212, 255, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.bee-chip--blue::before {
  background: var(--bee-blue);
  box-shadow: 0 0 8px rgba(127, 212, 255, 0.8);
}

.bee-chip--dark-blue{
    color:var(--bee-dark-soft);
    background: rgba(24, 95, 165, 0.06);
    border-color: rgba(24, 95, 165, 0.18);
    box-shadow:none !important;
}

/* ============================================
   GHOST VARIANT (neutral)
   ============================================ */
.bee-chip--ghost {
  background: var(--bee-surface-glass);
  color: rgba(255, 255, 255, 0.9);
  border-color: var(--bee-surface-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.bee-chip--ghost::before {
  background: rgba(255, 255, 255, 0.9);
}
