/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps.
 * Custom styles and overrides for third-party components.
 */

/* Notyf toast notifications - essential styles only */
.notyf {
  max-width: 100vw !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

.notyf__toast {
  max-width: calc(100vw - 2rem) !important;
  margin: 0 1rem !important;
  box-sizing: border-box !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  overflow-x: hidden !important;
  background-color: inherit !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.notyf__wrapper {
  width: 100% !important;
  height: 100% !important;
  min-height: 60px !important;
  display: flex !important;
  align-items: center !important;
  padding: 12px 16px !important;
  box-sizing: border-box !important;
}

.notyf__ripple {
  border-radius: 8px !important;
}

/* Toast type backgrounds */
.notyf__toast--success {
  background-color: #3dc763 !important;
}

.notyf__toast--error {
  background-color: #ed3d3d !important;
}

.notyf__toast[style*="background: rgb(245, 158, 11)"],
.notyf__toast[style*="background:#f59e0b"] {
  background-color: #f59e0b !important;
}

.notyf__toast[style*="background: rgb(59, 130, 246)"],
.notyf__toast[style*="background:#3b82f6"] {
  background-color: #3b82f6 !important;
}

/* Mobile responsive adjustments */
@media (max-width: 767px) {
  .notyf__toast {
    max-width: calc(100vw - 1rem) !important;
    margin: 0 0.5rem !important;
    font-size: 14px !important;
  }

  .notyf__wrapper {
    min-height: 56px !important;
    padding: 10px 14px !important;
  }
}

.ts-control {
  border: none !important;
  z-index: auto !important;
}
.user-form .ts-control > .item {
  display: none;
}
.daterangepicker .drp-buttons .btn {
  padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4) !important;
}
.daterangepicker td.in-range {
  background-color:  #eeebf6 !important;
}
.daterangepicker td.active, .daterangepicker td.active:hover {
  background-color: #8755FF !important;
}