/* Custom CSS for TailAdmin - Pure HTML Version */
/* This file contains custom styles not covered by Tailwind CDN */

/* Override @tailwindcss/forms default blue focus colors */
[type='text']:focus,
[type='email']:focus,
[type='url']:focus,
[type='password']:focus,
[type='number']:focus,
[type='date']:focus,
[type='datetime-local']:focus,
[type='month']:focus,
[type='search']:focus,
[type='tel']:focus,
[type='time']:focus,
[type='week']:focus,
input:where(:not([type])):focus,
[multiple]:focus,
textarea:focus,
select:focus {
  border-color: #52b788;
  --tw-ring-color: #52b788;
}

[type='checkbox']:focus,
[type='radio']:focus {
  --tw-ring-color: #52b788;
}

[type='checkbox']:checked,
[type='radio']:checked {
  background-color: #52b788;
  border-color: #52b788;
}

[type='checkbox']:checked:hover,
[type='radio']:checked:hover {
  background-color: #40916c;
  border-color: #40916c;
}

/* Base styles */
body {
  font-family: 'Outfit', sans-serif;
  position: relative;
  z-index: 1;
}

/* Default border color compatibility (Tailwind v4 uses currentColor) */
*,
::after,
::before,
::backdrop,
::file-selector-button {
  border-color: #e4e7ec;
}

.dark *,
.dark ::after,
.dark ::before {
  border-color: #344054;
}

button:not(:disabled),
[role="button"]:not(:disabled) {
  cursor: pointer;
}

/* For Remove Date Icon */
input[type="date"]::-webkit-inner-spin-button,
input[type="time"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}

/* No Scrollbar utility */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Custom Scrollbar */
.custom-scrollbar::-webkit-scrollbar {
  width: 0.375rem;
  height: 0.375rem;
}
.custom-scrollbar::-webkit-scrollbar-track {
  border-radius: 9999px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  border-radius: 9999px;
  background-color: #e4e7ec;
}
.dark .custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: #344054;
}

/* Sidebar hover behavior */
.sidebar:hover {
  width: 290px;
}
.sidebar:hover .logo {
  display: block;
}
.sidebar:hover .logo-icon {
  display: none;
}
.sidebar:hover .sidebar-header {
  justify-content: space-between;
}
.sidebar:hover .menu-item-text {
  display: inline;
}
.sidebar:hover .menu-item-arrow {
  display: block;
}
.sidebar:hover .menu-dropdown {
  display: flex;
}

/* Sidebar menu item states */
.menu-item-active {
  color: #52b788;
  background-color: #f0faf4;
}
.menu-item-inactive {
  color: #344054;
}
.menu-item-inactive:hover {
  background-color: #f2f4f7;
}
.menu-item-icon-active {
  fill: #52b788;
}
.menu-item-icon-inactive {
  fill: #98a2b3;
}

/* Table Checkbox */
.tableCheckbox:checked ~ span span {
  opacity: 1;
}
.tableCheckbox:checked ~ span {
  border-color: #52b788;
  background-color: #52b788;
}

/* Form Check Input */
.form-check-input:checked ~ span {
  border-color: #52b788;
  border-width: 6px;
}
.dark .form-check-input:checked ~ span {
  border-color: #52b788;
}

/* Task Checkbox */
.taskCheckbox:checked ~ .box span {
  opacity: 1;
}
.taskCheckbox:checked ~ p {
  color: #98a2b3;
  text-decoration: line-through;
}
.taskCheckbox:checked ~ .box {
  border-color: #52b788;
  background-color: #52b788;
}
.dark .taskCheckbox:checked ~ .box {
  border-color: #52b788;
}

/* Task drag and drop */
.task {
  transition: all 0.2s ease;
}
.task.is-dragging {
  border-radius: 0.75rem;
  box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1), 0px 1px 2px 0px rgba(16, 24, 40, 0.06);
  opacity: 0.8;
  cursor: grabbing;
}

/* Date input icon */
.input-date-icon::-webkit-inner-spin-button,
.input-date-icon::-webkit-calendar-picker-indicator {
  opacity: 0;
  -webkit-appearance: none;
}

/* ===== ApexCharts Styles ===== */
.apexcharts-legend-text {
  color: #344054 !important;
  padding-left: 1.25rem !important;
}
.dark .apexcharts-legend-text {
  color: #98a2b3 !important;
}

.apexcharts-text {
  fill: #344054 !important;
}
.dark .apexcharts-text {
  fill: #98a2b3 !important;
}

.apexcharts-tooltip.apexcharts-theme-light {
  box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1), 0px 1px 2px 0px rgba(16, 24, 40, 0.06) !important;
  gap: 0.25rem;
  border-radius: 0.5rem !important;
  border-color: #e4e7ec !important;
  padding: 0.75rem;
}
.dark .apexcharts-tooltip.apexcharts-theme-light {
  border-color: #1d2939 !important;
  background-color: #101828 !important;
}

.apexcharts-tooltip-marker {
  margin-right: 0.375rem !important;
  height: 0.375rem !important;
  width: 0.375rem !important;
}

.apexcharts-tooltip-series-group,
.apexcharts-tooltip-y-group {
  padding: 0 !important;
}

.apexcharts-tooltip-title {
  margin-bottom: 0 !important;
  border-bottom-width: 0 !important;
  background-color: transparent !important;
  padding: 0 !important;
  font-size: 10px !important;
  line-height: 1rem !important;
  color: #1d2939 !important;
}
.dark .apexcharts-tooltip-title {
  color: rgba(255, 255, 255, 0.9) !important;
}

.apexcharts-tooltip-text {
  font-size: 12px !important;
  line-height: 18px !important;
  color: #344054 !important;
}
.dark .apexcharts-tooltip-text {
  color: rgba(255, 255, 255, 0.9) !important;
}

.apexcharts-tooltip-text-y-value {
  font-weight: 500 !important;
}

.apexcharts-gridline {
  stroke: #f2f4f7 !important;
}
.dark .apexcharts-gridline {
  stroke: #1d2939 !important;
}

#chartTwo .apexcharts-datalabels-group {
  transform: translateY(-6rem) !important;
}
#chartTwo .apexcharts-datalabels-group .apexcharts-text {
  fill: #1d2939 !important;
  font-weight: 600 !important;
}
.dark #chartTwo .apexcharts-datalabels-group .apexcharts-text {
  fill: rgba(255, 255, 255, 0.9) !important;
}

#chartSixteen .apexcharts-legend {
  padding: 0 !important;
  padding-left: 1.5rem !important;
}

/* ===== jsVectorMap Styles ===== */
.jvm-container {
  background-color: #f9fafb !important;
}
.dark .jvm-container {
  background-color: #101828 !important;
}

.jvm-region.jvm-element {
  fill: #d0d5dd !important;
}
.jvm-region.jvm-element:hover {
  fill: #52b788 !important;
}
.dark .jvm-region.jvm-element {
  fill: #344054 !important;
}
.dark .jvm-region.jvm-element:hover {
  fill: #52b788 !important;
}

.jvm-marker.jvm-element {
  stroke: #e4e7ec !important;
}
.dark .jvm-marker.jvm-element {
  stroke: #1d2939 !important;
}

/* ===== Swiper Styles ===== */
.swiper-button-prev svg,
.swiper-button-next svg {
  height: auto !important;
  width: auto !important;
}

.stocks-slider-outer .swiper-button-next:after,
.stocks-slider-outer .swiper-button-prev:after {
  display: none;
}

.stocks-slider-outer .swiper-button-next,
.stocks-slider-outer .swiper-button-prev {
  position: static !important;
  margin-top: 0;
  height: 2rem;
  width: 2.25rem;
  border-radius: 9999px;
  border: 1px solid #e4e7ec;
  color: #344054 !important;
  transition: all 0.15s;
}
.stocks-slider-outer .swiper-button-next:hover,
.stocks-slider-outer .swiper-button-prev:hover {
  background-color: #f2f4f7;
}
.dark .stocks-slider-outer .swiper-button-next,
.dark .stocks-slider-outer .swiper-button-prev {
  border-color: #1d2939;
  background-color: #1d2939;
  color: #98a2b3 !important;
}
.dark .stocks-slider-outer .swiper-button-next:hover,
.dark .stocks-slider-outer .swiper-button-prev:hover {
  background-color: #101828;
}

.stocks-slider-outer .swiper-button-next.swiper-button-disabled,
.stocks-slider-outer .swiper-button-prev.swiper-button-disabled {
  background-color: white;
  opacity: 1;
}
.dark .stocks-slider-outer .swiper-button-next.swiper-button-disabled,
.dark .stocks-slider-outer .swiper-button-prev.swiper-button-disabled {
  background-color: #101828;
}

.carouselTwo .swiper-button-next:after,
.carouselTwo .swiper-button-prev:after,
.carouselFour .swiper-button-next:after,
.carouselFour .swiper-button-prev:after {
  display: none;
}

.carouselTwo .swiper-button-next.swiper-button-disabled,
.carouselTwo .swiper-button-prev.swiper-button-disabled,
.carouselFour .swiper-button-next.swiper-button-disabled,
.carouselFour .swiper-button-prev.swiper-button-disabled {
  background-color: rgba(255, 255, 255, 0.6);
  opacity: 1 !important;
}

.carouselTwo .swiper-button-next,
.carouselTwo .swiper-button-prev,
.carouselFour .swiper-button-next,
.carouselFour .swiper-button-prev {
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.1), 0px 1px 3px 0px rgba(16, 24, 40, 0.1);
  height: 2.5rem;
  width: 2.5rem;
  border-radius: 9999px;
  border: 0.5px solid rgba(255, 255, 255, 0.1);
  background-color: rgba(255, 255, 255, 0.9);
  color: #344054 !important;
  backdrop-filter: blur(10px);
}

.carouselTwo .swiper-button-prev,
.carouselFour .swiper-button-prev {
  left: 0.75rem !important;
}
@media (min-width: 640px) {
  .carouselTwo .swiper-button-prev,
  .carouselFour .swiper-button-prev {
    left: 1rem !important;
  }
}

.carouselTwo .swiper-button-next,
.carouselFour .swiper-button-next {
  right: 0.75rem !important;
}
@media (min-width: 640px) {
  .carouselTwo .swiper-button-next,
  .carouselFour .swiper-button-next {
    right: 1rem !important;
  }
}

.carouselThree .swiper-pagination,
.carouselFour .swiper-pagination {
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.1), 0px 1px 3px 0px rgba(16, 24, 40, 0.1);
  bottom: 0.75rem !important;
  left: 50% !important;
  display: inline-flex;
  width: auto !important;
  transform: translateX(-50%);
  align-items: center;
  gap: 0.375rem;
  border-radius: 40px;
  border: 0.5px solid rgba(255, 255, 255, 0.1);
  background-color: rgba(255, 255, 255, 0.6);
  padding: 0.5rem 0.375rem;
  backdrop-filter: blur(10px);
}
@media (min-width: 640px) {
  .carouselThree .swiper-pagination,
  .carouselFour .swiper-pagination {
    bottom: 1.25rem !important;
  }
}

.carouselThree .swiper-pagination-bullet,
.carouselFour .swiper-pagination-bullet {
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  margin: 0 !important;
  height: 0.625rem;
  width: 0.625rem;
  background-color: white;
  opacity: 1;
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;
}

.carouselThree .swiper-pagination-bullet-active,
.carouselFour .swiper-pagination-bullet-active {
  width: 1.625rem;
  border-radius: 0.75rem;
}

/* ===== Flatpickr Styles ===== */
.flatpickr-wrapper {
  width: 100%;
}

.flatpickr-calendar {
  margin-top: 0.5rem;
  border-radius: 0.75rem !important;
  padding: 1.25rem !important;
  color: #667085 !important;
}
.dark .flatpickr-calendar {
  background-color: #1a2231 !important;
  box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03) !important;
  color: #98a2b3 !important;
}
@media (min-width: 375px) {
  .flatpickr-calendar {
    width: auto !important;
  }
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  stroke: #52b788;
  fill: none !important;
}

.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
  display: none;
}

.flatpickr-current-month .cur-month,
.flatpickr-current-month input.cur-year {
  height: auto !important;
  padding-top: 0 !important;
  font-size: 1.125rem !important;
  font-weight: 500 !important;
  color: #1d2939 !important;
}
.dark .flatpickr-current-month .cur-month,
.dark .flatpickr-current-month input.cur-year {
  color: rgba(255, 255, 255, 0.9) !important;
}

.flatpickr-prev-month,
.flatpickr-next-month {
  padding: 0 !important;
}

.flatpickr-weekdays {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  height: auto;
}

.flatpickr-weekday {
  font-size: 14px !important;
  line-height: 20px !important;
  font-weight: 500 !important;
  color: #667085 !important;
}
.dark .flatpickr-weekday {
  color: #98a2b3 !important;
}

.flatpickr-day {
  font-size: 14px !important;
  line-height: 20px !important;
  display: flex !important;
  align-items: center !important;
  font-weight: 500 !important;
  color: #1d2939 !important;
}
.dark .flatpickr-day {
  color: rgba(255, 255, 255, 0.9) !important;
}
.dark .flatpickr-day:hover {
  border-color: #d0d5dd !important;
  background-color: #101828 !important;
}

.flatpickr-day.nextMonthDay,
.flatpickr-day.prevMonthDay {
  color: #98a2b3 !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  top: 1.75rem !important;
}
.dark .flatpickr-months .flatpickr-prev-month,
.dark .flatpickr-months .flatpickr-next-month {
  fill: white !important;
  color: white !important;
}

.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
  left: 1.75rem !important;
}

.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
  right: 1.75rem !important;
}

span.flatpickr-weekday,
.flatpickr-months .flatpickr-month {
  color: inherit !important;
}
.dark span.flatpickr-weekday,
.dark .flatpickr-months .flatpickr-month {
  fill: white !important;
  color: white !important;
}

.flatpickr-day.inRange {
  box-shadow: -5px 0 0 #f9fafb, 5px 0 0 #f9fafb !important;
}
.dark .flatpickr-day.inRange {
  box-shadow: -5px 0 0 #262d3c, 5px 0 0 #262d3c !important;
}

.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  border-color: #f9fafb !important;
  background-color: #f9fafb !important;
}
.dark .flatpickr-day.inRange,
.dark .flatpickr-day.prevMonthDay.inRange,
.dark .flatpickr-day.nextMonthDay.inRange,
.dark .flatpickr-day.today.inRange,
.dark .flatpickr-day.prevMonthDay.today.inRange,
.dark .flatpickr-day.nextMonthDay.today.inRange,
.dark .flatpickr-day:hover,
.dark .flatpickr-day.prevMonthDay:hover,
.dark .flatpickr-day.nextMonthDay:hover,
.dark .flatpickr-day:focus,
.dark .flatpickr-day.prevMonthDay:focus,
.dark .flatpickr-day.nextMonthDay:focus {
  border-width: 0 !important;
  border-color: rgba(255, 255, 255, 0.05) !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
  color: white !important;
}
.dark .flatpickr-day.selected,
.dark .flatpickr-day.startRange,
.dark .flatpickr-day.endRange {
  color: white !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: #52b788;
  border-color: #52b788 !important;
  background-color: #52b788 !important;
}
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover {
  border-color: #52b788 !important;
  background-color: #52b788 !important;
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n + 1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n + 1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n + 1)) {
  box-shadow: -10px 0 0 #52b788;
}

.flatpickr-calendar.static {
  right: 0;
}

@media screen and (max-width: 525px) {
  .flatpickr-calendar.static {
    margin-right: -60px !important;
  }
}

/* ===== FullCalendar Styles ===== */
.fc .fc-view-harness {
  max-width: 100%;
  overflow-x: auto;
}
.fc .fc-view-harness::-webkit-scrollbar {
  width: 0.375rem;
  height: 0.375rem;
}
.fc .fc-view-harness::-webkit-scrollbar-track {
  border-radius: 9999px;
}
.fc .fc-view-harness::-webkit-scrollbar-thumb {
  border-radius: 9999px;
  background-color: #e4e7ec;
}

.fc-dayGridMonth-view.fc-view.fc-daygrid {
  min-width: 718px;
}

.fc .fc-scrollgrid-section > * {
  border-right-width: 0;
  border-bottom-width: 0;
}

.fc .fc-scrollgrid {
  border-left-width: 0;
}

.fc .fc-toolbar.fc-header-toolbar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 1.5rem;
}
@media (min-width: 640px) {
  .fc .fc-toolbar.fc-header-toolbar {
    flex-direction: row;
  }
}

.fc-button-group {
  gap: 0.5rem;
}

.fc-button-group .fc-button {
  display: flex;
  height: 2.5rem;
  width: 2.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem !important;
  border: 1px solid #e4e7ec;
  background-color: transparent;
}
.fc-button-group .fc-button:hover {
  border-color: #e4e7ec;
  background-color: #f9fafb;
}
.fc-button-group .fc-button:focus {
  box-shadow: none;
}
.fc-button-group .fc-button:active {
  border-color: #e4e7ec !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
.dark .fc-button-group .fc-button {
  border-color: #1d2939;
}
.dark .fc-button-group .fc-button:hover {
  border-color: #1d2939;
  background-color: #101828;
}
.dark .fc-button-group .fc-button:active {
  border-color: #1d2939 !important;
}

.fc-button-group .fc-button.fc-prev-button:before {
  margin-top: 0.25rem;
  display: inline-block;
  content: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.0068 6L9.75684 12.25L16.0068 18.5' stroke='%23344054' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.fc-button-group .fc-button.fc-next-button:before {
  margin-top: 0.25rem;
  display: inline-block;
  content: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.50684 19L15.7568 12.75L9.50684 6.5' stroke='%23344054' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.dark .fc-button-group .fc-button.fc-prev-button:before {
  content: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.0068 6L9.75684 12.25L16.0068 18.5' stroke='%2398A2B3' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.dark .fc-button-group .fc-button.fc-next-button:before {
  content: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.50684 19L15.7568 12.75L9.50684 6.5' stroke='%2398A2B3' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.fc-button-group .fc-button .fc-icon {
  display: none;
}

.fc-addEventButton-button {
  background-color: #52b788 !important;
  border-radius: 0.5rem !important;
  border-width: 0 !important;
  padding: 0.625rem 1rem !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
}
.fc-addEventButton-button:hover {
  background-color: #40916c !important;
}
.fc-addEventButton-button:focus {
  box-shadow: none !important;
}

.fc-toolbar-title {
  font-size: 1.125rem !important;
  font-weight: 500 !important;
  color: #1d2939;
}
.dark .fc-toolbar-title {
  color: rgba(255, 255, 255, 0.9);
}

.fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child {
  border-radius: 0.5rem;
  background-color: #f2f4f7;
  padding: 0.125rem;
}
.dark .fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child {
  background-color: #101828;
}

.fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child .fc-button {
  height: auto !important;
  width: auto !important;
  border-radius: 0.375rem;
  border-width: 0 !important;
  background-color: transparent;
  padding: 0.5rem 1.25rem !important;
  font-size: 0.875rem;
  font-weight: 500;
  color: #667085;
}
.fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child .fc-button:hover {
  color: #344054;
}
.fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child .fc-button:focus {
  box-shadow: none !important;
}
.dark .fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child .fc-button {
  color: #98a2b3;
}

.fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child .fc-button.fc-button-active {
  background-color: white;
  color: #101828;
}
.dark .fc-header-toolbar.fc-toolbar .fc-toolbar-chunk:last-child .fc-button.fc-button-active {
  background-color: #1d2939;
  color: white;
}

.fc-theme-standard th {
  border-left-width: 0 !important;
  border-right-width: 0 !important;
  border-top-width: 1px;
  border-color: #e4e7ec !important;
  background-color: #f9fafb;
  text-align: left !important;
}
.dark .fc-theme-standard th {
  border-color: #1d2939 !important;
  background-color: #101828;
}

.fc-theme-standard td,
.fc-theme-standard .fc-scrollgrid {
  border-color: #e4e7ec !important;
}
.dark .fc-theme-standard td,
.dark .fc-theme-standard .fc-scrollgrid {
  border-color: #1d2939 !important;
}

.fc .fc-col-header-cell-cushion {
  padding: 1rem 1.25rem !important;
  font-size: 0.875rem;
  font-weight: 500;
  text-transform: uppercase;
  color: #98a2b3;
}

.fc .fc-daygrid-day.fc-day-today {
  background-color: transparent;
}

.fc .fc-daygrid-day {
  padding: 0.5rem;
}

.fc .fc-daygrid-day.fc-day-today .fc-scrollgrid-sync-inner {
  border-radius: 0.125rem;
  background-color: #f2f4f7;
}
.dark .fc .fc-daygrid-day.fc-day-today .fc-scrollgrid-sync-inner {
  background-color: rgba(255, 255, 255, 0.03);
}

.fc .fc-daygrid-day-number {
  padding: 0.75rem !important;
  font-size: 0.875rem;
  font-weight: 500;
  color: #344054;
}
.dark .fc .fc-daygrid-day-number {
  color: #98a2b3;
}

.fc .fc-daygrid-day-top {
  flex-direction: row !important;
}

.fc .fc-day-other .fc-daygrid-day-top {
  opacity: 1;
}

.fc .fc-day-other .fc-daygrid-day-top .fc-daygrid-day-number {
  color: #98a2b3;
}
.dark .fc .fc-day-other .fc-daygrid-day-top .fc-daygrid-day-number {
  color: rgba(255, 255, 255, 0.3);
}

.event-fc-color {
  border-radius: 0.5rem;
  padding: 0.625rem 0.75rem 0.625rem 1rem;
}

.event-fc-color .fc-event-title {
  padding: 0;
  font-size: 0.875rem;
  font-weight: 400;
  color: #344054;
}

.fc-daygrid-event-dot {
  margin-right: 0.75rem;
  margin-left: 0;
  height: 1.25rem;
  width: 0.25rem;
  border-radius: 0.125rem;
  border: none;
}

.fc-event {
  outline: none;
}
.fc-event:focus {
  box-shadow: none;
}

.fc-daygrid-event.fc-event-start {
  margin-left: 0.75rem !important;
}

.event-fc-color.fc-bg-success {
  border-color: #ecfdf3;
  background-color: #ecfdf3;
}

.event-fc-color.fc-bg-danger {
  border-color: #fef3f2;
  background-color: #fef3f2;
}

.event-fc-color.fc-bg-primary {
  border-color: #ecf3ff;
  background-color: #ecf3ff;
}

.event-fc-color.fc-bg-warning {
  border-color: #fff6ed;
  background-color: #fff6ed;
}

.event-fc-color.fc-bg-success .fc-daygrid-event-dot {
  background-color: #12b76a;
}

.event-fc-color.fc-bg-danger .fc-daygrid-event-dot {
  background-color: #f04438;
}

.event-fc-color.fc-bg-primary .fc-daygrid-event-dot {
  background-color: #52b788;
}

.event-fc-color.fc-bg-warning .fc-daygrid-event-dot {
  background-color: #fb6514;
}

.fc-direction-ltr .fc-timegrid-slot-label-frame {
  padding: 0.375rem 0.75rem;
  text-align: left;
  font-size: 0.875rem;
  font-weight: 500;
  color: #667085;
}
.dark .fc-direction-ltr .fc-timegrid-slot-label-frame {
  color: #98a2b3;
}

.fc .fc-timegrid-axis-cushion {
  font-size: 0.875rem;
  font-weight: 500;
  color: #667085;
}
.dark .fc .fc-timegrid-axis-cushion {
  color: #98a2b3;
}

/* Bottom padding on the scrollable main area so content (e.g. pagination)
   stays above mobile browser chrome. Defined here because the pre-built
   tailwind-output.css doesn't include the large pb-* utilities. */
#main-content {
  padding-bottom: 6rem;
}
@media (min-width: 768px) {
  #main-content {
    padding-bottom: 1.5rem;
  }
}

/* 4-column grid at the lg breakpoint, used by the history filter row.
   Defined here because the pre-built tailwind-output.css only ships
   .sm\:grid-cols-2 and .lg\:grid-cols-3 — no grid-cols-4 variant exists. */
@media (min-width: 1024px) {
  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Keeps the history filter panel open from the md breakpoint up, where the
   mobile collapse toggle is hidden. Defined here because the pre-built
   tailwind-output.css ships .md\:hidden but not .md\:block. */
@media (min-width: 768px) {
  .md\:block {
    display: block;
  }
}
