/* Digipulse — professional loader + toast / alert feedback UI */

:root {
  --omx-green: #28a745;
  --omx-green-dark: #1e7e34;
  --omx-green-soft: #e8f8ee;
  --omx-danger: #dc3545;
  --omx-warning: #f59e0b;
  --omx-info: #0ea5e9;
  --omx-text: #1f2937;
  --omx-muted: #6b7280;
}

/* -------------------------------------------------------------------------- */
/* Loader / spinner (form processing overlay)                                 */
/* -------------------------------------------------------------------------- */

.lw-form-in-process {
  position: relative;
}

.lw-form-in-process .lw-spinner-box {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  z-index: 20 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column;
  width: 92px !important;
  height: 92px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  box-shadow:
    0 18px 40px rgba(15, 23, 42, 0.12),
    0 4px 12px rgba(15, 23, 42, 0.06) !important;
  color: var(--omx-green) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.lw-form-in-process .lw-spinner-box ~ * {
  filter: blur(1.5px) grayscale(0.15) !important;
  -webkit-filter: blur(1.5px) grayscale(0.15) !important;
  opacity: 0.72;
  transition: filter 0.2s ease, opacity 0.2s ease;
}

.lw-form-in-process .lw-spinner-box-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
}

.lw-form-in-process .lw-spinner-box-text {
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--omx-muted);
  max-width: 72px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Compact green ring spinner */
.lds-ring {
  display: inline-block;
  position: relative;
  width: 44px !important;
  height: 44px !important;
}

.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 36px !important;
  height: 36px !important;
  margin: 4px !important;
  border: 3.5px solid transparent !important;
  border-radius: 50%;
  animation: omx-lds-ring 0.9s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-top-color: var(--omx-green) !important;
  border-right-color: rgba(40, 167, 69, 0.2) !important;
}

.lds-ring div:nth-child(1) { animation-delay: -0.35s; }
.lds-ring div:nth-child(2) { animation-delay: -0.22s; }
.lds-ring div:nth-child(3) { animation-delay: -0.1s; }

@keyframes omx-lds-ring {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Modal / container spinner boxes (ajax content load) */
.lw-spinner-box {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 120px;
  padding: 1.5rem;
}

.lw-spinner-box .lds-ring div {
  border-top-color: var(--omx-green) !important;
  border-right-color: rgba(40, 167, 69, 0.2) !important;
  border-left-color: transparent !important;
  border-bottom-color: transparent !important;
}

/* DataTables processing indicator */
.dataTables_processing {
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.1) !important;
  color: var(--omx-text) !important;
  font-weight: 500 !important;
  padding: 1rem 1.5rem !important;
}

/* -------------------------------------------------------------------------- */
/* Toast notifications (mdtoast)                                              */
/* -------------------------------------------------------------------------- */

.mdtoast {
  align-items: center !important;
  min-height: 56px !important;
  max-width: min(420px, calc(100vw - 32px)) !important;
  padding: 14px 18px 14px 16px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: var(--omx-text) !important;
  font-family: Inter, "Nunito Sans", system-ui, -apple-system, sans-serif !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  border-left: 4px solid var(--omx-green) !important;
  box-shadow:
    0 12px 32px rgba(15, 23, 42, 0.12),
    0 2px 8px rgba(15, 23, 42, 0.05) !important;
  z-index: 100050 !important;
}

.mdtoast[data-position="bottom left"],
.mdtoast[data-position="bottom center"],
.mdtoast[data-position="bottom right"] {
  bottom: 28px !important;
}

.mdtoast[data-position="top left"],
.mdtoast[data-position="top center"],
.mdtoast[data-position="top right"] {
  top: 24px !important;
}

.mdtoast .mdt-message {
  color: inherit !important;
  font-size: inherit !important;
  padding: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.75rem !important;
}

.mdtoast .mdt-message::before {
  content: "";
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--omx-green-soft);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328a745' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  margin-top: 1px;
}

.mdtoast.mdt--success,
.mdtoast.mdt--default {
  border-left-color: var(--omx-green) !important;
  background: #ffffff !important;
  color: #14532d !important;
}

.mdtoast.mdt--success .mdt-message::before,
.mdtoast.mdt--default .mdt-message::before {
  background-color: var(--omx-green-soft);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328a745' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

.mdtoast.mdt--error {
  border-left-color: var(--omx-danger) !important;
  background: #ffffff !important;
  color: #7f1d1d !important;
}

.mdtoast.mdt--error .mdt-message::before {
  background-color: #fee2e2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc3545' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='15' y1='9' x2='9' y2='15'/%3E%3Cline x1='9' y1='9' x2='15' y2='15'/%3E%3C/svg%3E");
}

.mdtoast.mdt--warning {
  border-left-color: var(--omx-warning) !important;
  background: #ffffff !important;
  color: #78350f !important;
}

.mdtoast.mdt--warning .mdt-message::before {
  background-color: #fef3c7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E");
}

.mdtoast.mdt--info {
  border-left-color: var(--omx-info) !important;
  background: #ffffff !important;
  color: #0c4a6e !important;
}

.mdtoast.mdt--info .mdt-message::before {
  background-color: #e0f2fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230ea5e9' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E");
}

.mdtoast .mdt-action {
  color: var(--omx-muted) !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  font-size: 0.7rem !important;
  letter-spacing: 0.04em;
}

/* -------------------------------------------------------------------------- */
/* SweetAlert2 — confirm / alert popups                                       */
/* -------------------------------------------------------------------------- */

.swal2-container {
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  background: rgba(15, 23, 42, 0.35) !important;
}

.swal2-popup {
  border-radius: 16px !important;
  padding: 1.75rem 1.5rem 1.5rem !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18) !important;
  border: 1px solid rgba(15, 23, 42, 0.05) !important;
  font-family: Inter, "Nunito Sans", system-ui, sans-serif !important;
}

.swal2-title {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: var(--omx-text) !important;
}

.swal2-html-container,
.swal2-content {
  font-size: 0.95rem !important;
  color: var(--omx-muted) !important;
}

.swal2-icon.swal2-success {
  border-color: var(--omx-green) !important;
  color: var(--omx-green) !important;
}

/* Keep the ring as a thin outline — do NOT fill it solid green */
.swal2-icon.swal2-success .swal2-success-ring {
  background-color: transparent !important;
  border: 0.25em solid rgba(40, 167, 69, 0.3) !important;
}

/* Checkmark strokes (the white/green tick) */
.swal2-icon.swal2-success [class^=swal2-success-line] {
  background-color: var(--omx-green) !important;
}

.swal2-icon.swal2-success .swal2-success-line-tip,
.swal2-icon.swal2-success .swal2-success-line-long {
  background-color: var(--omx-green) !important;
}

.swal2-icon.swal2-success .swal2-success-circular-line-left,
.swal2-icon.swal2-success .swal2-success-circular-line-right,
.swal2-icon.swal2-success .swal2-success-fix-base {
  background-color: #fff !important;
}

.swal2-styled.swal2-confirm {
  background-color: var(--omx-green) !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 0.65rem 1.35rem !important;
  box-shadow: none !important;
}

.swal2-styled.swal2-confirm:hover {
  background-color: var(--omx-green-dark) !important;
}

.swal2-styled.swal2-cancel {
  background: #f3f4f6 !important;
  color: #374151 !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 0.65rem 1.35rem !important;
  box-shadow: none !important;
}

.swal2-styled.swal2-cancel:hover {
  background: #e5e7eb !important;
}
