/* AI Tribe — shared styles (AX / minimalist) */

:root {
  --navy: #001f3f;
  --gold: #b8860b;
  --canvas: #f7f8fa;
  --ink: #0a0f1a;
  --mist: #e8ecf1;
  --alert: #b45309;
}

body {
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

.glass-card {
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}

.btn-primary {
  background-color: var(--gold);
  color: #fff;
  transition: filter 0.15s ease, transform 0.15s ease;
}

.btn-primary:hover:not(:disabled) {
  filter: brightness(1.08);
}

.btn-primary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Login page — full-bleed video with dark gradient for text contrast */
.login-bg-video {
  filter: saturate(0.9) brightness(0.85);
}

.login-bg-video.video-missing {
  display: none;
}

.login-overlay {
  background:
    linear-gradient(160deg, rgba(0, 31, 63, 0.78) 0%, rgba(0, 31, 63, 0.55) 45%, rgba(0, 0, 0, 0.72) 100%);
}

.login-stage {
  background-color: #001f3f;
}

/* Alpine.js cloak — hide unbound templates until Alpine boots */
[x-cloak] {
  display: none !important;
}

.upload-zone {
  cursor: pointer;
}

.stage-spinner {
  animation: stage-spin 0.7s linear infinite;
}

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

.stage-row:last-child .stage-icon + div {
  display: none;
}

/* Calm contextual notices — light defaults, dark overrides for app shell */
.notice {
  border-radius: 0.75rem;
  border: 1px solid rgba(180, 83, 9, 0.25);
  background: #fffbeb;
  padding: 1rem 1.25rem;
}

.notice-title {
  font-size: 0.875rem;
  font-weight: 500;
  color: #451a03;
}

.notice-body {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.5;
  color: rgba(120, 53, 15, 0.85);
}

.notice-success {
  border-color: rgba(16, 185, 129, 0.25);
  background: #ecfdf5;
}

.notice-success .notice-title {
  color: #064e3b;
}

.notice-success .notice-body {
  color: rgba(6, 78, 59, 0.8);
}

/* Dark app shell — calm amber / soft emerald, not alarm red */
.dark .notice {
  border-color: rgba(251, 191, 36, 0.28);
  background: rgba(120, 53, 15, 0.22);
}

.dark .notice-title {
  color: #fde68a;
}

.dark .notice-body {
  color: rgba(254, 243, 199, 0.82);
}

.dark .notice-success {
  border-color: rgba(52, 211, 153, 0.28);
  background: rgba(6, 78, 59, 0.28);
}

.dark .notice-success .notice-title {
  color: #a7f3d0;
}

.dark .notice-success .notice-body {
  color: rgba(209, 250, 229, 0.82);
}

.btn-spinner {
  display: inline-block;
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 9999px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  animation: stage-spin 0.7s linear infinite;
  vertical-align: -0.1em;
  margin-right: 0.4rem;
}

/* HTMX request indicators — only visible while a request is in flight */
.htmx-indicator {
  display: none;
}

.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  display: inline-block;
}