/* ============================================================
   OpenClaw Main Site — brand.css (A-Group: Tech Blue)
   Imports shared design system + A-group brand color overrides
   ============================================================ */


/* ---------- A-Group Brand Colors ---------- */
:root {
  --color-primary: var(--indigo-500);
  --color-primary-hover: var(--indigo-600);
  --color-primary-light: var(--indigo-400);
  --color-accent: var(--blue-500);
  --color-accent-light: var(--blue-400);
  --color-accent-dark: var(--blue-600);
  --gradient-primary: linear-gradient(135deg, var(--indigo-500) 0%, var(--blue-500) 100%);
  --gradient-hover: linear-gradient(135deg, var(--indigo-400) 0%, var(--blue-400) 100%);
  --gradient-accent: linear-gradient(135deg, var(--blue-500) 0%, var(--indigo-500) 100%);

  /* Brand identity */
  --brand-name: "星枢 · XingShu";
  --brand-icon: "";
  --brand-gradient: linear-gradient(135deg, var(--indigo-500) 0%, var(--blue-500) 100%);
}

/* ---------- Backward-compatible mappings ---------- */
/* Map old Nebula variables to new system for existing CSS */
:root {
  --bg-dark: var(--color-bg-base);
  --bg-primary: var(--color-bg-base);
  --bg-secondary: var(--color-bg-elevated);
  --bg-card: var(--color-bg-elevated);
  --bg-glass: var(--glass-bg);
  --bg-hover: var(--color-bg-hover);
  --bg-input: var(--color-bg-input);
  --text-primary: var(--color-text-primary);
  --text-secondary: var(--color-text-secondary);
  --text-muted: var(--color-text-muted);
  --primary: var(--color-primary);
  --primary-dark: var(--color-primary-hover);
  --primary-light: var(--color-primary-light);
  --accent: var(--color-accent);
  --accent-light: var(--color-accent-light);
  --border: var(--color-border-subtle);
  --border-light: var(--color-border-default);
  --border-glow: var(--color-border-strong);
  --error: var(--status-error);
  --warning: var(--status-warn);
  --success: var(--status-success);
  --info: var(--status-info);
  /* 仅保留异名映射（旧名 → 新名）；同名自引用会使变量失效，故删除 */
  --shadow: var(--shadow-card);
}

/* ---------- Theme transition ---------- */
*, *::before, *::after {
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.15s ease;
}

/* ---------- Animated background orbs (login pages) ---------- */
.bg-mesh {
  position: fixed;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}

.bg-mesh .orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  opacity: 0.4;
  animation: float 22s infinite ease-in-out;
}

:root[data-theme="dark"] .bg-mesh .orb { opacity: 0.5; }
:root[data-theme="light"] .bg-mesh .orb { opacity: 0.25; }

.bg-mesh .orb:nth-child(1) {
  width: 520px; height: 520px;
  background: radial-gradient(circle, var(--indigo-500), transparent 70%);
  top: -12%; left: -10%;
}
.bg-mesh .orb:nth-child(2) {
  width: 420px; height: 420px;
  background: radial-gradient(circle, var(--blue-500), transparent 70%);
  bottom: -12%; right: -6%;
  animation-delay: -7s;
}
.bg-mesh .orb:nth-child(3) {
  width: 360px; height: 360px;
  background: radial-gradient(circle, var(--rose-500), transparent 70%);
  top: 45%; left: 48%;
  animation-delay: -14s;
  opacity: 0.3;
}

@keyframes float {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(60px, -40px) scale(1.1); }
  66% { transform: translate(-40px, 50px) scale(0.92); }
}