/* Jukin TV — tokens alinhados ao Referee Jukin (Flutter AppColors) */
:root {
  --jukin-bg: #032f4e;
  --jukin-bg-2: #005c8d;
  --jukin-primary: #00a7e1;
  --jukin-primary-dark: #0089b8;
  --jukin-secondary: #ffc300;
  --jukin-accent: #ff3bc7;
  --jukin-success: #40c463;
  --jukin-surface: #04385b;
  --jukin-elevated: #0b4e77;
  --jukin-text: #ffffff;
  --jukin-text-muted: #d2ebff;
}

.jukin-gradient-bg {
  background: linear-gradient(180deg, var(--jukin-bg-2) 0%, var(--jukin-bg) 100%);
}

.jukin-auth-card {
  background-color: color-mix(in srgb, var(--jukin-surface) 92%, transparent);
  border: 1px solid color-mix(in srgb, var(--jukin-primary) 35%, transparent);
  border-radius: 20px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

.nav-link:focus,
.nav-link.active {
  background-color: var(--jukin-primary) !important;
}

.jukin-btn-primary {
  background-color: var(--jukin-primary);
  color: var(--jukin-text);
  border-radius: 14px;
  font-weight: 700;
  transition: background-color 0.15s ease;
}

.jukin-btn-primary:hover {
  background-color: var(--jukin-primary-dark);
}

.jukin-input {
  background-color: var(--jukin-elevated);
  color: var(--jukin-text);
  border-radius: 14px;
}

.jukin-input:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--jukin-primary);
}