/* Kerep shared interaction layer: loaders, skeletons and async states. */
:root {
  --kerep-brand-river: #0ea5e9;
  --kerep-brand-mountain: #10b981;
  --kerep-action-primary: var(--ga-primary, #0a5f8f);
  --kerep-action-accent: var(--ga-teal, #12808a);
  --kerep-loader-track: color-mix(in srgb, var(--kerep-action-primary) 14%, transparent);
  --kerep-skeleton-base: #e6ecf0;
  --kerep-skeleton-highlight: #f7fafb;
  --kerep-motion-standard: cubic-bezier(0.4, 0, 0.2, 1);
}

[data-theme="dark"] {
  --kerep-loader-track: color-mix(in srgb, var(--kerep-action-primary) 26%, transparent);
  --kerep-skeleton-base: #1c2731;
  --kerep-skeleton-highlight: #2a3742;
}

.kerep-loader {
  --kerep-loader-size: 3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.7rem;
  color: var(--kerep-action-primary);
}

.kerep-loader--xs { --kerep-loader-size: 1.25rem; }
.kerep-loader--sm { --kerep-loader-size: 2rem; }
.kerep-loader--md { --kerep-loader-size: 3rem; }
.kerep-loader--lg { --kerep-loader-size: 4.5rem; flex-direction: column; gap: 0.85rem; }

.kerep-loader__mark {
  width: var(--kerep-loader-size);
  height: var(--kerep-loader-size);
  overflow: visible;
  flex: 0 0 auto;
}

.kerep-loader__track,
.kerep-loader__ring {
  fill: none;
  stroke-width: 2.6;
}

.kerep-loader__track { stroke: var(--kerep-loader-track); }

.kerep-loader__ring {
  stroke: currentColor;
  stroke-linecap: round;
  stroke-dasharray: 24 76;
  transform-origin: center;
  animation: kerep-loader-spin 1.05s linear infinite;
}

.kerep-loader__mountain,
.kerep-loader__river {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.kerep-loader__mountain { stroke-width: 1.8; opacity: 0.34; }
.kerep-loader__river { stroke-width: 2.8; }

.kerep-loader__label {
  color: var(--ga-text-secondary, #5f6f7a);
  font-size: var(--ga-text-sm, 0.8125rem);
  font-weight: 600;
  line-height: 1.35;
}

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

.kerep-button-spinner {
  width: 1rem;
  height: 1rem;
  border: 2px solid color-mix(in srgb, currentColor 28%, transparent);
  border-top-color: currentColor;
  border-radius: 50%;
  flex: 0 0 auto;
  animation: kerep-loader-spin 0.8s linear infinite;
}

.kerep-is-loading {
  cursor: progress !important;
}

button.kerep-is-loading,
.btn.kerep-is-loading {
  pointer-events: none;
}

.login-brand-description {
  max-width: 30ch;
  margin: 0.25rem 0 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: var(--ga-text-sm, 0.8125rem);
  line-height: 1.6;
}

/* Authentication controls remain comfortably tappable on compact screens. */
@media (max-width: 991.98px), (pointer: coarse) {
  .login-theme-toggle {
    width: 2.75rem;
    height: 2.75rem;
  }

  .login-field-head .login-forgot {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
  }

  .login-input > .login-input-toggle {
    right: 0;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .login-input:has(.login-input-toggle) .form-control {
    padding-right: 3rem;
  }
}

@media (max-width: 991.98px) {
  button,
  .btn,
  .page-link,
  .dropdown-item,
  .nav-link[role="tab"],
  [role="button"] {
    min-height: 2.75rem;
  }

  .btn-icon,
  .page-link,
  .dropdown-toggle {
    min-width: 2.75rem;
  }

  .form-control,
  .form-select {
    min-height: 2.75rem;
  }

  input[type="checkbox"],
  input[type="radio"],
  input[type="color"],
  input[type="file"] {
    min-height: initial;
  }
}

#modal-profile-selector .profile-item {
  width: 100%;
  margin-bottom: 0.5rem;
  border: 1px solid var(--ga-border, rgba(15, 23, 42, 0.1));
  border-radius: var(--ga-radius-sm, 8px) !important;
  background: var(--ga-card-bg, #fff);
  color: var(--ga-text, #0f172a);
  text-align: left;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

#modal-profile-selector .profile-item:hover,
#modal-profile-selector .profile-item:focus-visible {
  transform: translateY(-1px);
  border-color: var(--ga-primary, #0a5f8f);
  background: var(--ga-primary-light, #e0eef5);
}

#modal-profile-selector .profile-item:disabled { cursor: progress; }

#modal-profile-selector .profile-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: var(--ga-radius-sm, 8px);
  background: var(--ga-primary-light, #e0eef5);
  color: var(--ga-primary, #0a5f8f);
  font-size: 1.25rem;
}

.ga-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-inline: 1.5rem;
  text-align: center;
  color: var(--ga-text-secondary, #64748b);
}

.ga-empty-state-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  margin-bottom: 0.875rem;
  border-radius: 1rem;
  background: var(--ga-primary-light, #e0eef5);
  color: var(--ga-primary, #0a5f8f);
  font-size: 1.6rem;
}

.ga-empty-state-title {
  margin: 0 0 0.35rem;
  color: var(--ga-text, #0f172a);
  font-size: var(--ga-text-lg, 1rem);
  font-weight: 700;
}

.ga-empty-state-text {
  max-width: 34rem;
  font-size: var(--ga-text-sm, 0.8125rem);
}

[data-kerep-loading-compact].kerep-is-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Normalize legacy Bootstrap indicators while views migrate to KerepLoader. */
.spinner-border {
  border-width: 0.14em;
  animation-duration: 0.8s;
}

.spinner-border.text-primary,
.text-primary > .spinner-border {
  color: var(--kerep-action-primary) !important;
}

.spinner-border-sm {
  width: 1rem;
  height: 1rem;
}

.kerep-busy-surface {
  position: relative;
}

.kerep-busy-surface[aria-busy="true"] {
  cursor: progress;
}

.kerep-page-loader {
  position: fixed;
  inset: 0;
  z-index: 11000;
  display: grid;
  place-items: center;
  padding: 1.5rem;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,0.12), transparent 34%),
    linear-gradient(145deg, #07416a 0%, #0a5f8f 58%, #0e566f 100%);
  color: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity 180ms ease, visibility 180ms ease;
}

html.kerep-page-is-loading,
html.kerep-page-is-loading body {
  overflow: hidden;
}

.kerep-page-loader[hidden] { display: none; }

.kerep-page-loader.is-visible {
  opacity: 1;
  visibility: visible;
}

.kerep-page-loader__surface {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: center;
}

.kerep-page-loader .kerep-loader { color: #fff; }
.kerep-page-loader .kerep-loader__track { stroke: rgba(255,255,255,0.18); }
.kerep-page-loader .kerep-loader__label { color: rgba(255,255,255,0.82); }

.kerep-page-loader__brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
}

.kerep-page-loader__brand strong {
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: -0.04em;
}

.kerep-page-loader__brand span {
  color: rgba(255,255,255,0.64);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.24em;
}

.kerep-skeleton,
.ga-skeleton {
  position: relative;
  overflow: hidden;
  color: transparent !important;
  background: linear-gradient(
    100deg,
    var(--kerep-skeleton-base) 28%,
    var(--kerep-skeleton-highlight) 50%,
    var(--kerep-skeleton-base) 72%
  );
  background-size: 220% 100%;
  animation: kerep-skeleton-shimmer 1.35s linear infinite;
  border-radius: var(--ga-radius-sm, 8px);
}

.kerep-skeleton--text { width: min(16rem, 72%); height: 0.75rem; }
.kerep-skeleton--title { width: min(22rem, 56%); height: 1.25rem; }
.kerep-skeleton--avatar { width: 2.5rem; height: 2.5rem; border-radius: 50%; }
.kerep-skeleton--button { width: 7.5rem; height: 2.5rem; border-radius: 999px; }
.kerep-skeleton--card { width: 100%; min-height: 6rem; border-radius: var(--ga-radius-xl, 1rem); }

@keyframes kerep-skeleton-shimmer {
  from { background-position: 220% 0; }
  to { background-position: -220% 0; }
}

.htmx-request.kerep-busy-surface,
.kerep-busy-surface.htmx-request {
  opacity: 0.76;
  transition: opacity 160ms ease;
}

@media (max-width: 575.98px) {
  .kerep-page-loader { padding-bottom: max(1.5rem, env(safe-area-inset-bottom)); }
  .kerep-loader--lg { --kerep-loader-size: 4rem; }
}

@media (prefers-reduced-motion: reduce) {
  .kerep-loader__ring,
  .kerep-button-spinner,
  .kerep-skeleton,
  .ga-skeleton,
  .flow-anim,
  .ring,
  .mountain-highlight,
  .waterfall-line {
    animation: none !important;
  }

  .spinner-border {
    animation: none !important;
  }

  .import-spin,
  .progress-bar-animated {
    animation: none !important;
  }

  .kerep-loader__ring { stroke-dasharray: 38 62; }
  .kerep-page-loader { transition: none; }
}