.error-modal {
	&__trigger {
		width: fit-content;
		display: flex;
		align-items: center;
		gap: 4px;
		border-radius: 20px;
		background: rgba(229, 72, 77, 0.2);
		padding-left: 3px;
		padding-right: 8px;
		cursor: pointer;
		span {
			color: var(--bg-cherry-500);
			font-size: 10px;
			font-weight: 500;
			line-height: 20px; /* 200% */
			letter-spacing: 0.4px;
			text-transform: uppercase;
		}
	}
	&__wrap {
		background: linear-gradient(
			180deg,
			rgba(11, 12, 14, 0.12) 0.07%,
			rgba(39, 8, 14, 0.24) 50.04%,
			rgba(106, 29, 44, 0.36) 75.02%,
			rgba(197, 57, 85, 0.48) 87.51%,
			rgba(242, 71, 105, 0.6) 100%
		);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);

		.ant-modal {
			bottom: 40px;
			top: unset;
			position: absolute;
			width: 520px;
			left: 0px;
			right: 0px;
			margin: auto;
		}
	}
	&__body {
		padding: 0;
		background: var(--bg-ink-400);
		overflow: hidden;
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
	}
	&__header {
		background: none !important;
		.ant-modal-title {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
		.key-value-label {
			padding: 0;
			border: none;
			border-radius: 4px;
			overflow: hidden;
			&__key,
			&__value {
				padding: 4px 8px;
				font-size: 12px;
				font-style: normal;
				font-weight: 500;
				line-height: 16px;
				letter-spacing: 0.48px;
			}
			&__key {
				text-transform: uppercase;
				&,
				&:hover {
					color: var(--bg-vanilla-100);
				}
			}
			&__value {
				color: var(--bg-vanilla-400);
				pointer-events: none;
			}
		}
		.close-button {
			padding: 3px 7px;
			background: var(--bg-ink-400);
			display: inline-flex;
			align-items: center;
			border-radius: 4px;
			border: 1px solid var(--bg-slate-500);
			box-shadow: none;
		}
	}
	&__footer {
		margin: 0 !important;
		height: 6px;
		background: var(--bg-sakura-500);
	}
	&__content {
		padding: 0 !important;
		border-radius: 4px;
		overflow: hidden;
		background: none !important;
	}
}

.lightMode {
	.error-modal {
		&__body,
		&__header .close-button {
			background: var(--bg-vanilla-100);
		}
		&__header .close-button {
			svg {
				fill: var(--bg-vanilla-100);
			}
		}
	}
}
