:root{
  --brand:#245FAD;
  --brand-dark:#1F4F90;
  --brand-soft: rgba(36,95,173,.12);
  --text:#111;
  --muted:#4B5563;
  --border: rgba(17,17,17,.10);
  --white:#fff;

  --primary: var(--brand);
  --primary2: var(--brand-dark);
  --line: var(--border);
  --line2: var(--border);
}

body,
.app-shell,
.app-body{
  color: var(--text);
}

a{
  color: var(--brand);
}

a:hover{
  color: var(--brand-dark);
}

.btn.primary,
.btn-primary,
.auth-btn,
.dash-btn.primary,
.manager-btn{
  background: var(--brand);
  color: var(--white);
  border-color: var(--brand);
}

.btn.primary:hover,
.btn-primary:hover,
.auth-btn:hover,
.dash-btn.primary:hover,
.manager-btn:hover{
  background: var(--brand-dark);
  border-color: var(--brand-dark);
}

.btn.primary:focus-visible,
.btn-primary:focus-visible,
.auth-btn:focus-visible,
.dash-btn.primary:focus-visible,
.manager-btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px var(--brand-soft);
}