/* ============================================================================
   FIX PARA CALENDÁRIO (DatePicker) CORTADO/SOBREPOSTO
   Autor: Claude Code
   Data: 2025-10-07
   Problema: Popover do calendário fica atrás de cards e tem bordas cortadas
   ============================================================================ */

/* 1. EVITAR QUE CARDS "CORTEM" POPOVERS */
.card, 
.card-body, 
.dash-card, 
.section, 
.panel,
.dbc-card,
.dbc-card-body {
  overflow: visible !important;
  /* Importante: Permite que elementos filhos (como calendário) ultrapassem os limites do card */
}

/* 2. ELEVAR O POPOVER DO REACT-DATES (usado pelo dcc.DatePickerRange/Single) */
.DateRangePicker_picker, 
.SingleDatePicker_picker,
.CalendarMonth_caption,
.DayPicker,
.DayPicker_weekHeaders,
.DayPickerNavigation {
  z-index: 3000 !important;
  position: relative !important;
  /* Garante que o calendário sempre fique acima de outros elementos */
}

/* 3. ELEVAR OS WRAPPERS DO DATEPICKER */
.DateRangePicker, 
.SingleDatePicker, 
.DateInput, 
.DateInput_input,
.DateRangePickerInput,
.SingleDatePickerInput {
  z-index: 2500 !important;
  position: relative !important;
}

/* 4. REMOVER BORDAS/OUTLINES INDESEJADOS (linha vermelha/dashed) */
.DateRangePicker_picker,
.SingleDatePicker_picker,
.DayPicker,
.CalendarMonth {
  outline: none !important;
  border: none !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important; /* Sombra suave para destacar */
}

/* 5. GARANTIR QUE BOTÕES DE NAVEGAÇÃO DO MÊS SEJAM CLICÁVEIS */
.DayPickerNavigation_button {
  z-index: 3100 !important;
  position: relative !important;
  cursor: pointer !important;
}

/* 6. ELEVAR DROPDOWNS (Select) QUE TAMBÉM PODEM FICAR ATRÁS */
.Select, 
.Select-menu-outer, 
.VirtualizedSelectFocusedOption,
.dropdown-menu {
  z-index: 2800 !important;
  position: relative !important;
}

/* 7. FIX PARA SIDEBAR STICKY - GARANTIR QUE NÃO CORTE CALENDÁRIO */
.sidebar-sticky,
[style*="position: sticky"],
[style*="position:sticky"] {
  overflow: visible !important;
  /* Permite que calendário "escape" da sidebar sem ser cortado */
}

/* 8. AJUSTE RESPONSIVO - EM TELAS MENORES, CALENDÁRIO VERTICAL */
@media (max-width: 768px) {
  .DateRangePicker_picker,
  .SingleDatePicker_picker {
    left: 0 !important;
    right: 0 !important;
    max-width: 100vw !important;
    margin: 0 auto !important;
  }
  
  .CalendarMonth {
    padding: 10px !important;
  }
}

/* 9. GARANTIR QUE CONTAINER DO CALENDÁRIO NÃO SEJA CLIPADO */
.date-picker-container,
.date-selector-wrapper,
[class*="date-picker"] {
  overflow: visible !important;
  contain: none !important; /* Remove contenção que pode causar clipping */
}

/* 10. FIX PARA MODAIS E TOASTS - ESCALA DE Z-INDEX CONSISTENTE */
.modal {
  z-index: 4000 !important;
}

.toast,
.notification,
.alert-toast {
  z-index: 5000 !important;
}

/* 11. AJUSTE FINO - CALENDÁRIO COM PORTAL (se usar with_portal=True) */
.DateRangePicker_picker__portal,
.SingleDatePicker_picker__portal {
  z-index: 9999 !important;
  position: fixed !important;
}

/* 12. MELHORAR VISUAL DO CALENDÁRIO (BÔNUS) */
.CalendarDay__selected,
.CalendarDay__selected:hover {
  background: #007bff !important;
  color: white !important;
  border-radius: 4px !important;
}

.CalendarDay__hovered_span {
  background: rgba(0, 123, 255, 0.1) !important;
  border-radius: 4px !important;
}

/* 13. GARANTIR QUE CARDS COM SHADOW NÃO CRIEM STACKING CONTEXT PROBLEMÁTICO */
.shadow,
.shadow-sm,
.shadow-md,
.shadow-lg {
  contain: layout paint !important;
  /* Reduz efeitos colaterais de clipping mas mantém sombra */
}

/* ============================================================================
   FIM DAS CORREÇÕES
   ============================================================================ */