/* Force fullscreen for calendar elements */
.fc, /* FullCalendar main container */
.calendar-container,
.simple-calendar,
.calendar, 
[data-controller="calendar"],
#calendar,
.calendar-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: auto !important;
}

/* Force table and grid elements to stretch */
.fc-view-container,
.fc-view,
.fc-time-grid,
.fc-slats,
.fc-content-skeleton,
table.calendar-table,
.calendar-grid,
.calendar-row,
.time-slot-container {
  width: 100% !important;
  max-width: 100% !important;
}

/* If there's a container around the calendar */
body > div.container,
main.container,
div.container-fluid,
.content-wrapper,
#main-content {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Fix for responsive issues */
@media (min-width: 768px) {
  .container, .container-md, .container-sm {
    max-width: 100% !important;
  }
}

@media (min-width: 992px) {
  .container, .container-lg, .container-md, .container-sm {
    max-width: 100% !important;
  }
}

@media (min-width: 1200px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 100% !important;
  }
}

/* Reset container constraints */
body.calendar {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body.calendar main {
  height: 100vh !important; /* Fix the 100vw typo in the layout */
  width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
}

/* Make the calendar container fill the space */
.w-full, .min-w-full {
  width: 100vw !important;
  max-width: 100vw !important;
}

div[data-controller="main-calendar"] {
  height: 100vh !important; /* Was 90vh */
  width: 100vw !important;
  padding: 0 !important;
  margin: 0 !important;
}

#main-calendar {
  width: 100% !important;
  height: 100% !important;
}

/* Toast UI Calendar specific fixes */
.toastui-calendar-layout, 
.toastui-calendar-week-view,
.toastui-calendar-panel,
.toastui-calendar-timegrid-container {
  width: 100% !important;
  max-width: 100% !important;
}

/* Remove unnecessary padding */
.container, .mx-auto {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100vw !important;
}

.flex.justify-between {
  padding: 0 1rem;
}