/* ===========================
 * File: assets/loader.css
 * =========================== */

/* Always-on-top overlay */
.mvw-loader-overlay {
  position: fixed !important;
  left: 0; right: 0; top: 0; bottom: 0;
  width: 100%;
  height: 100vh; /* legacy fallback */
  background: var(--mvw-loader-bg, #fff) !important;
  z-index: var(--mvw-loader-z, 2147480000) !important;
  pointer-events: none !important;
  opacity: 1 !important;
  backface-visibility: hidden !important;
  transform: translateZ(0) !important;
}

/* Prefer modern viewport units */
@supports (height: 100dvh) {
  .mvw-loader-overlay { height: 100dvh; }
}
@supports (height: 100lvh) {
  .mvw-loader-overlay { height: 100lvh; }
}

/* Patch for iOS translucent bottom toolbar */
.mvw-loader-overlay::after {
  content: "";
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: env(safe-area-inset-bottom, 0);
  background: var(--mvw-loader-bg, #fff);
  pointer-events: none;
}

/* Show overlay while active */
html.mvw-loader-active .mvw-loader-overlay {
  display: flex;
  opacity: 1 !important;
}

/* Loader content container */
.mvw-loader-inner {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  pointer-events: none !important;
}

/* Optional loading message */
.mvw-loader-message {
  font: 500 14px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: var(--mvw-loader-color, #176f8e);
  text-align: center;
  padding: 0 16px;
}

/* Spinner (default) */
.mvw-loader-spinner {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid rgba(0, 0, 0, .1);
  border-top-color: var(--mvw-loader-color, #176f8e);
  animation: mvwspin .8s linear infinite;
}

@keyframes mvwspin {
  to { transform: rotate(360deg); }
}

/* Progress bar variant */
.mvw-loader-spinner.is-bar {
  width: 180px;
  height: 6px;
  border-radius: 999px;
  border: none;
  background: rgba(0, 0, 0, .08);
  overflow: hidden;
}
.mvw-loader-spinner.is-bar:before {
  content: "";
  display: block;
  width: 40%;
  height: 100%;
  background: var(--mvw-loader-color, #176f8e);
  animation: mvwbar 1.2s ease-in-out infinite;
}

@keyframes mvwbar {
  0%   { transform: translateX(-100%); }
  50%  { transform: translateX(60%); }
  100% { transform: translateX(200%); }
}