:root {
  --cz-loader-bg: #f4f7fb;
  --cz-loader-panel: #ffffff;
  --cz-loader-text: #13213c;
  --cz-loader-muted: #71809b;
  --cz-loader-border: #dfe7f1;
  --cz-loader-accent: #ff6b18;
}

html.cz-page-loading {
  overflow: hidden;
}

#cz-page-loader {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  background: var(--cz-loader-bg);
  opacity: 1;
  visibility: visible;
  transition: opacity 180ms ease, visibility 180ms ease;
}

#cz-page-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.cz-page-loader__content {
  display: grid;
  justify-items: center;
  gap: 12px;
  min-width: 170px;
  padding: 22px 26px;
  color: var(--cz-loader-text);
  background: var(--cz-loader-panel);
  border: 1px solid var(--cz-loader-border);
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(24, 39, 75, 0.08);
}

.cz-page-loader__mark {
  position: relative;
  width: 34px;
  height: 34px;
  border: 3px solid rgba(255, 107, 24, 0.2);
  border-top-color: var(--cz-loader-accent);
  border-radius: 50%;
  animation: cz-loader-spin 700ms linear infinite;
}

.cz-page-loader__label {
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0;
}

.cz-page-loader__track {
  width: 112px;
  height: 3px;
  overflow: hidden;
  background: var(--cz-loader-border);
  border-radius: 2px;
}

.cz-page-loader__track::after {
  content: "";
  display: block;
  width: 42%;
  height: 100%;
  background: var(--cz-loader-accent);
  animation: cz-loader-progress 900ms ease-in-out infinite;
}

.cz-reveal {
  opacity: 0;
  transform: translateY(7px);
  transition: opacity 260ms ease, transform 260ms ease;
  transition-delay: var(--cz-reveal-delay, 0ms);
}

.cz-reveal.cz-visible {
  opacity: 1;
  transform: translateY(0);
}

.card,
.app-clean-card,
.report-card,
.report-kpi-card,
.widget-stat,
.panel-link,
.btn,
button,
input,
select,
textarea {
  transition: border-color 160ms ease, background-color 160ms ease,
    color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.btn:not(:disabled):active,
button:not(:disabled):active {
  transform: translateY(1px);
}

.modal.show .modal-dialog,
.popup-modal.is-open .popup-modal__dialog {
  animation: cz-dialog-in 180ms ease-out both;
}

html[data-theme="dark"],
html.dark-mode,
body.dark-mode,
body[data-theme="dark"] {
  --cz-loader-bg: #111215;
  --cz-loader-panel: #202126;
  --cz-loader-text: #f7f8fa;
  --cz-loader-muted: #a4abba;
  --cz-loader-border: #34363d;
}

@keyframes cz-loader-spin {
  to { transform: rotate(360deg); }
}

@keyframes cz-loader-progress {
  0% { transform: translateX(-120%); }
  50% { transform: translateX(70%); }
  100% { transform: translateX(250%); }
}

@keyframes cz-dialog-in {
  from { opacity: 0; transform: translateY(8px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .cz-reveal {
    opacity: 1;
    transform: none;
  }
}

