/* Estilos Google Agenda Style para FullCalendar */

/* Container principal */
#calendar {
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  font-family: 'Google Sans', 'Roboto', Arial, sans-serif;
}

/* Header do calendário */
.fc-header-toolbar {
  background: #f8f9fa;
  border-bottom: 1px solid #e0e0e0;
  padding: 12px 16px;
  border-radius: 8px 8px 0 0;
}

.fc-toolbar-title {
  font-size: 22px;
  font-weight: 400;
  color: #202124;
}

.fc-button {
  background: #ffffff;
  border: 1px solid #dadce0;
  color: #5f6368;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
  padding: 8px 16px;
  margin: 0 2px;
  transition: all 0.2s ease;
}

.fc-button:hover {
  background: #f8f9fa;
  border-color: #c0c4cc;
  color: #202124;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.fc-button-active {
  background: #e8f0fe;
  border-color: #1967d2;
  color: #1967d2;
}

/* Grid do calendário */
.fc-view {
  background: #ffffff;
}

.fc-daygrid {
  border: 1px solid #e0e0e0;
}

.fc-col-header {
  background: #f8f9fa;
}

.fc-col-header-cell {
  border-right: 1px solid #e0e0e0;
  padding: 8px 4px;
}

.fc-col-header-cell-cushion {
  color: #5f6368;
  font-weight: 500;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Slots de tempo */
.fc-timegrid-slot {
  border-bottom: 1px solid #f1f3f4;
}

.fc-timegrid-slot-label {
  color: #5f6368;
  font-size: 12px;
  font-weight: 500;
}

/* Linha do horário atual */
.fc-now-indicator {
  background: #ea4335;
  height: 2px;
}

.fc-now-indicator-arrow {
  border-top-color: #ea4335;
}

/* Eventos - Estilo Google Agenda */
.evento-agendamento {
  border-radius: 4px;
  border-left: 4px solid;
  margin: 1px 2px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  padding: 2px 6px;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.evento-agendamento:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
  z-index: 10;
}

/* Cores por tipo de serviço (nova lógica) */
.servico-1 {
  background: #e91e63 !important;  /* Manicure */
  border-left-color: #c2185b !important;
}

.servico-2 {
  background: #2196f3 !important;  /* Pedicure */
  border-left-color: #1976d2 !important;
}

.servico-3 {
  background: #4caf50 !important;  /* Alongamento */
  border-left-color: #388e3c !important;
}

.servico-4 {
  background: #ff9800 !important;  /* Manutenção */
  border-left-color: #f57c00 !important;
}

.servico-5 {
  background: #9c27b0 !important;  /* Tratamento */
  border-left-color: #7b1fa2 !important;
}

.servico-6 {
  background: #795548 !important;  /* Depilação */
  border-left-color: #5d4037 !important;
}

.servico-7 {
  background: #607d8b !important;  /* Design */
  border-left-color: #455a64 !important;
}

.servico-8 {
  background: #00bcd4 !important;  /* Massagem */
  border-left-color: #00acc1 !important;
}

/* Cores genéricas para serviços não mapeados */
.evento-agendamento:not([class*="servico-"]) {
  background: #78909c !important;  /* Cinza padrão */
  border-left-color: #546e7a !important;
}

/* Eventos de bloqueio */
.evento-bloqueio {
  background: #5f6368 !important;
  border-left-color: #3c4043 !important;
  border-radius: 4px;
  margin: 1px 2px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  padding: 2px 6px;
  cursor: not-allowed;
  opacity: 0.8;
}

/* Status dos eventos */
.status-agendado {
  opacity: 1;
}

.status-confirmado {
  opacity: 1;
}

.status-cancelado {
  opacity: 0.6;
  text-decoration: line-through;
}

.status-pendente {
  opacity: 0.8;
}

/* Business hours */
.fc-business-hours {
  background: rgba(26, 115, 232, 0.05);
}

/* Weekend */
.fc-day-sat,
.fc-day-sun {
  background: #fafafa;
}

/* Tooltip personalizado */
.fc-event {
  position: relative;
}

.fc-event .fc-event-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Responsividade */
@media (max-width: 768px) {
  .fc-toolbar {
    flex-direction: column;
    gap: 8px;
  }
  
  .fc-header-toolbar {
    padding: 8px;
  }
  
  .fc-toolbar-title {
    font-size: 18px;
  }
  
  .fc-button {
    font-size: 12px;
    padding: 6px 12px;
  }
}

/* Animações */
.fc-event {
  transition: all 0.2s ease;
}

.fc-event:hover {
  z-index: 100;
}

/* Scrollbar personalizada */
.fc-scroller {
  scrollbar-width: thin;
  scrollbar-color: #dadce0 transparent;
}

.fc-scroller::-webkit-scrollbar {
  width: 6px;
}

.fc-scroller::-webkit-scrollbar-track {
  background: transparent;
}

.fc-scroller::-webkit-scrollbar-thumb {
  background: #dadce0;
  border-radius: 3px;
}

.fc-scroller::-webkit-scrollbar-thumb:hover {
  background: #c0c4cc;
}