/* ===== Shared overlay + spinner + toast styles ===== */
/* Used by: console.html (via CDN) + docs/index.html (local) */

/* ---- Overlay mask (loading + translation) ---- */
.trans-overlay,
#overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  display: none; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, .85); z-index: 1090;
  flex-direction: column; gap: 1rem;
}
.trans-overlay.show,
#overlay.d-flex { display: flex; }

/* ---- Spinner (self-contained — works with or without Bootstrap) ---- */
@keyframes spinner-rotate { to { transform: rotate(1turn); } }

.trans-overlay .spinner-border,
#overlay .spinner-border {
  width: 3rem; height: 3rem;
  color: #fff;
  border: .3em solid currentColor;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  animation: spinner-rotate .75s linear infinite;
}

/* ---- Overlay text ---- */
.trans-overlay p,
#overlay p {
  color: #fff;
  font-size: 1.25rem;
  font-weight: 500;
  margin: 0;
}

/* ---- Toast notification ---- */
.toast-container { z-index: 1100; }
.toast { min-width: 240px; }
.toast .toast-body { font-size: .9rem; }