/* Add custom CSS rules here */
.form-control-multiline {
    min-height: 150px; /* Provide a good default size for multiline text */
}

.module-header {
    cursor: pointer;
}
/* --- Schedule Calendar Enhancements --- */

/* The calendar is now in a card, so we don't need margin on the calendar element itself. */
/* The card provides the container styling. */

.fc-event {
  cursor: pointer !important; /* Ensure pointer for clickable events */
}

/* Custom styles for event content, making it richer and more readable */
.fc-event-custom-content {
  overflow: hidden;
  line-height: 1.4;
  font-size: var(--tblr-font-size-sm);
  white-space: normal; /* Allow text to wrap */
}

/* Fix for clickable calendar events in different views */
.fc-event a.fc-event-custom-content,
.fc-event a.fc-event-custom-content:hover {
  text-decoration: none; /* Remove underline globally */
}

/* Time-based grid views (week, day) have colored backgrounds, need white text */
.fc-timegrid-event a.fc-event-custom-content {
  color: #fff;
}

/* Day-grid (month) and list views have light backgrounds, inherit default (dark) text color */
.fc-daygrid-event a.fc-event-custom-content,
.fc-list-event a.fc-event-custom-content {
  color: inherit;
}

.fc-event-title-line, .fc-event-employees-line {
  display: flex;
  align-items: flex-start;
  text-align: left;
}

.fc-event-employees-line {
  margin-top: 0.25rem;
  opacity: 0.9;
}

.fc-event-custom-content .bi {
  /* Vertically align icons with the first line of text */
  position: relative;
  top: 2px;
  margin-right: 0.3rem;
  flex-shrink: 0;
}

/* --- Tom Select Dropdown Z-Index Fix --- */
/* This ensures that Tom Select dropdowns, especially when dropdownParent is 'body',
   appear above other elements like modals or other form rows. */
.ts-dropdown {
    z-index: 9999;
    background-color: var(--tblr-bg-surface, #ffffff); /* Ensure solid background */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); /* Add shadow for better visibility */
}

/* Additional specificity for dropdowns in table contexts */
.table .ts-dropdown,
.ts-dropdown.dropdown-menu {
    z-index: 10000; /* Even higher for table contexts */
    background-color: var(--tblr-bg-surface, #ffffff) !important;
}

/* Ensure the dropdown content is also properly styled */
.ts-dropdown-content {
    background-color: var(--tblr-bg-surface, #ffffff);
    position: relative;
    z-index: 1;
}
/* --- Vertical Sidebar --- */
/* Dropdown styling in vertical navbar */
.navbar-vertical .dropdown-menu {
  position: static;
  border: 0;
  padding-left: 1rem;
  background-color: transparent;
  box-shadow: none;
}

.navbar-vertical .dropdown-item {
  padding: 0.5rem 1rem;
  border-radius: 4px;
  color: var(--tblr-navbar-color, #c6cddb);
}

.navbar-vertical .dropdown-item:hover,
.navbar-vertical .dropdown-item:focus {
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--tblr-navbar-hover-color, #ffffff);
}

.navbar-vertical .dropdown-item.active, .navbar-vertical .dropdown-item:active {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--tblr-navbar-active-color, #ffffff);
}
/* --- User Initials Avatar --- */
.avatar-initials {
  background-color: var(--tblr-secondary-lt); /* Match Tabler's default avatar bg */
  color: var(--tblr-secondary); /* Match Tabler's default avatar text color */
  font-weight: 600;
  display: inline-flex; /* For easy centering */
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.avatar-initials::before {
  content: attr(data-initials);
  text-transform: uppercase;
  line-height: 1;
}

/* The navbar uses avatar-sm, which is 2rem. 0.8rem is a good font size for that. */
.avatar-sm.avatar-initials::before {
  font-size: 0.8rem;
}