/* =========================================================
   BlockUI — CoreUI Theme (FINAL)
   ========================================================= */

/* ===============================
   Base (shared)
   =============================== */

.block-ui {
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: all;
}

/* Overlay */
.block-ui-overlay {
  position: absolute;
  inset: 0;
  background-color: var(--cui-backdrop-bg, rgba(0, 0, 0, 0.5));
  backdrop-filter: blur(2px);
  cursor: wait;
}

/* Dialog / Message */
.block-ui-message {
  position: relative;
  min-width: 280px;
  max-width: 90%;
  padding: 1.25rem 1.5rem;

  background-color: var(--cui-body-bg);
  color: var(--cui-body-color);

  border-radius: var(--cui-border-radius);
  border: 1px solid var(--cui-border-color);

  box-shadow: var(--cui-box-shadow-lg);

  font-family: var(--cui-font-sans-serif);
  font-size: var(--cui-body-font-size);

  z-index: 1;
}

/* Focus (accessibility) */
.block-ui-message:focus {
  outline: 0;
  box-shadow:
    0 0 0 0.25rem rgba(var(--cui-primary-rgb), 0.25),
    var(--cui-box-shadow-lg);
}

/* Optional header style */
.block-ui-message h1,
.block-ui-message h2,
.block-ui-message h3 {
  margin-top: 0;
  margin-bottom: 0.75rem;
  font-weight: 600;
  font-size: 1.1rem;
}

/* Spinner */
.block-ui-message .spinner-border,
.block-ui-message .spinner-grow {
  margin-right: 0.5rem;
  vertical-align: middle;
}

/* ===============================
   PAGE BLOCK MODE
   =============================== */

.block-ui.page {
  position: fixed;
  inset: 0;
  z-index: 1080; /* above CoreUI modal backdrop */
}

/* ===============================
   ELEMENT BLOCK MODE  ⭐⭐
   =============================== */

.block-ui.element {
  position: absolute;      /* ⬅️ INI KUNCI */
  inset: 0;
  z-index: 10;             /* lokal */
}