/* FullCalendar style overrides for Opass Calendar */
/* Do NOT use Tailwind @apply here — plain CSS only */

/* Ensure all events are visible (no truncation) */
.opass-calendar-front .fc .fc-daygrid-day-events {
  overflow: visible !important;
}

/* Event bar compact styling */
.opass-calendar-front .fc .fc-daygrid-event {
  border-radius: 0 9999px 9999px 0;
  padding: 0;
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
  border: none;
  overflow: hidden;
}

/* Gap between events (single-day) */
.opass-calendar-front .fc .fc-daygrid-event-harness {
  margin-bottom: 2px;
}

/* Gap for multi-day (absolute positioned) events — pad the harness so bars don't touch */
.opass-calendar-front .fc .fc-daygrid-event-harness-abs {
  padding-bottom: 2px;
}

/* Highlight selected date on mobile */
.opass-calendar-front .fc .fc-day.opass-selected {
  background-color: rgba(59, 130, 246, 0.08);
}

/* Header styling */
.opass-calendar-front .fc .fc-toolbar-title {
  font-size: 17px;
  font-weight: 600;
}

.opass-calendar-front .fc .fc-button {
  padding: 4px 10px;
  font-size: 14px;
}

/* Day number styling */
.opass-calendar-front .fc .fc-daygrid-day-number {
  font-size: 13px;
  padding: 4px 6px;
}

/* Week view: hide time grid, show only all-day */
.opass-calendar-front .fc-timegrid-slots,
.opass-calendar-front .fc-timegrid-axis {
  display: none !important;
}

/* Mobile: make day cells clickable even when covered by events */
@media (max-width: 768px) {
  /* Day cells need higher z-index tap target */
  .opass-calendar-front .fc .fc-daygrid-day-frame {
    position: relative;
    z-index: 1;
    min-height: 60px;
  }

  /* Make day number area a larger tap target */
  .opass-calendar-front .fc .fc-daygrid-day-top {
    position: relative;
    z-index: 3;
    cursor: pointer;
  }

  /* Selected date highlight */
  .opass-calendar-front .fc .fc-day.fc-day-today {
    background-color: rgba(59, 130, 246, 0.05);
  }
}

/* Slide-in animation for DayAgenda */
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}