/* ==========================================================
   GENMIND – CUSTOM FULLCALENDAR UI
   Palette: #DDF4E7, #67C090, #26667F, #124170
   Namespace: #gm-booking
========================================================== */

#gm-booking {
  --c-bg: #DDF4E7;
  --c-accent: #67C090;
  --c-primary: #26667F;
  --c-dark: #124170;

  font-family: "Inter", system-ui, sans-serif;
}

/* ---------- Calendar Container ---------- */
#gm-booking .fc {
  background: var(--c-bg);
  border-radius: 16px;
  padding: 1rem;
  box-shadow: 0 10px 30px rgba(18, 65, 112, 0.15);
}

/* ---------- Header ---------- */
#gm-booking .fc-toolbar-title {
  color: var(--c-dark);
  font-weight: 700;
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
}

#gm-booking .fc-button {
  background: var(--c-primary);
  border: none;
  border-radius: 10px;
  padding: 0.4rem 0.8rem;
  font-size: 0.85rem;
  transition: all 0.2s ease;
}

#gm-booking .fc-button:hover {
  background: var(--c-dark);
}

#gm-booking .fc-button:disabled {
  background: #9bbec9;
}

/* ---------- Day Cells ---------- */
#gm-booking .fc-daygrid-day {
  transition: background 0.2s ease;
}

#gm-booking .fc-daygrid-day:hover {
  background: rgba(103, 192, 144, 0.15);
  cursor: pointer;
}

#gm-booking .fc-daygrid-day-number {
  color: var(--c-dark);
  font-weight: 600;
  padding: 6px;
}

/* ---------- Today ---------- */
#gm-booking .fc-day-today {
  background: rgba(38, 102, 127, 0.12) !important;
}

/* ---------- Disabled / Past ---------- */
#gm-booking .fc-day-past {
  opacity: 0.4;
  pointer-events: none;
}

/* ---------- Appointment Icons ---------- */
#gm-booking .appointment-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}

#gm-booking .appointment-icons i {
  color: var(--c-primary);
  font-size: clamp(0.7rem, 1.5vw, 1.1rem);
}

/* ---------- Event Wrapper (we hide default bg) ---------- */
#gm-booking .fc-event {
  background: transparent;
  border: none;
  padding: 0;
}

/* ---------- Mobile Optimization ---------- */
@media (max-width: 768px) {
  #gm-booking .fc {
    padding: 0.5rem;
  }

  #gm-booking .fc-toolbar {
    flex-direction: column;
    gap: 0.5rem;
  }

  #gm-booking .fc-button {
    font-size: 0.75rem;
  }
}

/* ---------- Smooth Animations ---------- */
#gm-booking .fc-daygrid-day-frame {
  transition: transform 0.15s ease;
}

#gm-booking .fc-daygrid-day-frame:hover {
  transform: scale(1.02);
}