/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 */

@import url("/assets/flatpickr-f87cc8cb.css");

.hidden {
  display: none;
}

.btn {
  cursor: pointer;
}

button {
  cursor: pointer;
}

/*.btn-link {*/
/*  background: none;*/
/*  border: none;*/
/*  padding: 0;*/
/*  color: blue;*/
/*  text-decoration: none;*/
/*  text-align: left;*/
/*  width: 100%;*/
/*  cursor: pointer;*/
/*}*/

.flash {
  padding: 10px;
  margin: 10px 0;
  border-radius: 3px;
}

.flash.notice {
  background-color: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}

.flash.alert {
  background-color: #f8d7da;
  border-color: #f5c6cb;
  color: #721c24;
}

.toast {
  /*transform: translateX(100%);*/
  transition: transform 300ms ease-in-out;
}

.toast-message {
  /*transform: translateX(100%);*/
  transition: transform 300ms ease-in-out, top 300ms ease-in-out;
}

.modal-open {
  overflow: hidden;
}

#toast-container > div {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}

/*.toast.translate-x-0 {*/
/*  transform: translateX(0);*/
/*}*/

/*.toast.translate-x-full {*/
/*  transform: translateX(100%);*/
/*}*/

.nested-fields.pending-removal {
  opacity: 0.5;
  transition: opacity 0.3s ease;
}

/*@keyframes fadeIn {*/
/*  from { opacity: 0; transform: translateY(-2px); }*/
/*  to { opacity: 1; transform: translateY(0); }*/
/*}*/

.group:hover svg {
  animation: fadeIn 0.2s ease-out;
}

/* Hide browser's default clear button across browsers */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
}

input[type="search"]::-ms-clear,
input[type="search"]::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}

#modal_confirm_dialog_frame:empty,
#modal_confirm_dialog_frame:empty {
  display: none;
}

.toggle-no-mark {
  background-image: none;
}

.fade-element {
  transition: opacity 0.4s ease-in-out,
  max-height 0.5s ease-in-out,
  transform 0.4s ease-in-out,
  margin 0.5s ease-in-out,
  padding 0.5s ease-in-out;
  opacity: 1;
  max-height: 1000px;
  transform: translateY(0);
  overflow: hidden;
}

.fade-element.hidden {
  opacity: 0;
  max-height: 0;
  transform: translateY(-10px);
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  pointer-events: none;
}

/* Flatpickr Dark Mode Theme */

/* Light mode - default theme */
.flatpickr-calendar {
  background-color: #f9fafb !important;
  border-color: #d1d5db !important;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1) !important;
  color: #111827 !important;
}

.flatpickr-calendar.flatpickr-open {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  color: #4b5563 !important;
}

.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  background-color: #f3f4f6 !important;
}

.flatpickr-months .flatpickr-month {
  background-color: transparent !important;
  color: #1f2937 !important;
}

.flatpickr-weekdays {
  background-color: #f9fafb !important;
  color: #6b7280 !important;
}

.flatpickr-days {
  background-color: #f9fafb !important;
}

.flatpickr-day {
  color: #374151 !important;
}

.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day.today:hover {
  background-color: #e5e7eb !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
  background-color: #00853e !important;
  border-color: #00853e !important;
  color: #ffffff !important;
}

.flatpickr-day.today {
  border-color: #9ca3af !important;
}

.flatpickr-day.inRange {
  background-color: #dbeafe !important;
  color: #374151 !important;
}

.flatpickr-day.disabled,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: #d1d5db !important;
}

.flatpickr-time {
  background-color: #f9fafb !important;
  border-top-color: #d1d5db !important;
}

.flatpickr-time input {
  background-color: transparent !important;
  color: #374151 !important;
}

.flatpickr-time input::placeholder {
  color: #9ca3af !important;
}

.flatpickr-time.hasSeconds .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm {
  color: #4b5563 !important;
}

/* Dark mode */
.dark .flatpickr-calendar {
  background-color: #1f2937 !important;
  border-color: #374151 !important;
  color: #f3f4f6 !important;
}

.dark .flatpickr-calendar.flatpickr-open {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5) !important;
}

.dark .flatpickr-months .flatpickr-prev-month,
.dark .flatpickr-months .flatpickr-next-month {
  color: #d1d5db !important;
}

.dark .flatpickr-months .flatpickr-prev-month:hover,
.dark .flatpickr-months .flatpickr-next-month:hover {
  background-color: #374151 !important;
}

.dark .flatpickr-months .flatpickr-month {
  background-color: transparent !important;
  color: #f3f4f6 !important;
}

.dark .flatpickr-weekdays {
  background-color: #1f2937 !important;
  color: #9ca3af !important;
}

.dark .flatpickr-days {
  background-color: #1f2937 !important;
}

.dark .flatpickr-day {
  color: #d1d5db !important;
}

.dark .flatpickr-day:hover,
.dark .flatpickr-day.prevMonthDay:hover,
.dark .flatpickr-day.nextMonthDay:hover,
.dark .flatpickr-day.today:hover {
  background-color: #374151 !important;
}

.dark .flatpickr-day.selected,
.dark .flatpickr-day.startRange,
.dark .flatpickr-day.endRange {
  background-color: transparent !important;
  border-color: #66bd8d !important;
  color: #66bd8d !important;
}

.dark .flatpickr-day.today {
  border-color: #6b7280 !important;
}

.dark .flatpickr-day.inRange {
  background-color: #1e40af !important;
  color: #93c5fd !important;
}

.dark .flatpickr-day.disabled,
.dark .flatpickr-day.prevMonthDay,
.dark .flatpickr-day.nextMonthDay {
  color: #4b5563 !important;
}

.dark .flatpickr-time {
  background-color: #1f2937 !important;
  border-top-color: #374151 !important;
}

.dark .flatpickr-time input {
  background-color: transparent !important;
  color: #f3f4f6 !important;
}

.dark .flatpickr-time input::placeholder {
  color: #6b7280 !important;
}

.dark .flatpickr-time.hasSeconds .flatpickr-time-separator,
.dark .flatpickr-time .flatpickr-am-pm {
  color: #d1d5db !important;
}

.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background-color: #e6f4ec !important;
  color: #006432 !important;
}

.dark .flatpickr-time input:hover,
.dark .flatpickr-time .flatpickr-am-pm:hover,
.dark .flatpickr-time input:focus,
.dark .flatpickr-time .flatpickr-am-pm:focus {
  background-color: rgba(102, 189, 141, 0.15) !important;
  color: #66bd8d !important;
}

.dialog-centered {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
}