/* ==========================================================
   GENMIND – CUSTOM FULLCALENDAR UI (supplemental)
   Palette: #DDF4E7, #67C090, #26667F, #124170
   Scoped to #appointment-app (active) and legacy #gm-booking
========================================================== */

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

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

#gm-booking .fc-toolbar-title,
#appointment-app .fc-toolbar-title {
  color: var(--c-dark);
  font-weight: 700;
  font-size: clamp(1.05rem, 2.5vw, 1.45rem);
}

#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;
}

#gm-booking .fc-daygrid-day,
#appointment-app .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;
}

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

#gm-booking .fc-day-past,
#appointment-app .fc-day-past {
  opacity: 0.4;
}

#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);
}

#gm-booking .fc-event {
  background: transparent;
  border: none;
  padding: 0;
}

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

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

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

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

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

/* Soft hover for active calendar (avoid layout jump on mobile) */
@media (hover: hover) and (pointer: fine) {
  #appointment-app .fc-daygrid-day-frame {
    transition: transform 0.15s ease;
  }

  #appointment-app .fc-daygrid-day-frame:hover {
    transform: scale(1.015);
  }
}