#donate-modal {
  	position: fixed;
  	top: 0;
  	left: 0;
  	width: 100vw;
  	height: 100vh;
  	background: var(--overlay);
  	display: none;
  	align-items: center;
  	justify-content: center;
  	z-index: 999999;
  	font-family: Arial, sans-serif;
  }

  #donate-modal .modal-content {
		color: var(--text);
  	background: var(--bg-header);
  	padding: 20px 30px;
  	max-width: 400px;
  	border-radius: 8px;
  	text-align: center;
  	box-shadow: 0 4px 16px var(--shadow);
  }

  #donate-modal h2 {
  	margin-top: 0;
  }

  #donate-modal p {
  	margin: 15px 0;
  }

  #donate-modal button {
		color: var(--text);
  	cursor: pointer;
  	margin: 10px 8px 0 8px;
  	padding: 10px 20px;
  	border: solid 1px var(--bg-thinking);
  	border-radius: 4px;
  	font-weight: bold;
  	font-size: 14px;
		background-color: var(--bg-header);
  	transition: background-color 0.2s;
  }

  #donate-modal button:hover {
  	background-color: var(--hover-button);
  }


.modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: var(--overlay);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 999999;
	font-family: Arial, sans-serif;
}

.modal .title{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.modal .modal-content {
	color: var(--text);
	background: var(--bg-header);
	padding: 20px 30px;
	max-width: 400px;
	border-radius: 8px;
	text-align: center;
	box-shadow: 0 4px 16px var(--shadow);
}

.modal h2 {
	margin-top: 0;
}

.modal p {
	margin: 15px 0;
}

.modal button {
	color: var(--text);
	cursor: pointer;
	margin: 10px 8px 0 8px;
	padding: 10px 20px;
	border: solid 1px var(--bg-thinking);
	border-radius: 4px;
	font-weight: bold;
	font-size: 14px;
	background-color: var(--bg-header);
	transition: background-color 0.2s;
}

.modal button:hover {
	background-color: var(--hover-button);
}