@use '../assets';

#app-mount {
	.main-jX9p1r {
		padding: var(--spacing-double);
		justify-content: center;
		.close-hZ94c6 {
			background: var(--text-muted);
			width: 16px;
			height: 16px;
			top: var(--spacing-double);
			right: var(--spacing-double);
			mask: url(assets.$icon_close) center/contain no-repeat;
			transition: none;
			opacity: 1;
			&:hover {
				background: var(--text-normal);
			}
			svg {
				display: none;
			}
		}
		.guildIcon-1cwo09 {
			margin: var(--spacing-double) 0;
			foreignObject {
				mask: none;
				.iconActiveLarger-2EZc1b {
					width: var(--avatar-size-xl);
					height: var(--avatar-size-xl);
					border-radius: var(--border-radius);
				}
			}
		}
		.header-14DAzy {
			color: var(--text-normal);
			font-size: var(--font-size-xl);
			font-weight: var(--font-weight-light);
			margin-bottom: var(--spacing);
			strong {
				font-weight: inherit;
			}
			.headerGuildBadge-2JPeTX {
				position: absolute;
				margin: 0;
				margin-top: -11px;
				margin-left: -11px;
				top: calc(var(--spacing) * 4 + var(--avatar-size-xl));
				left: calc(50% + 32px);
				transform: scale(1.25);
			}
		}
		.guildDescription-3rVNje {
			margin: 0;
			padding: 0;
		}
		.choiceHeader-i-BNuj {
			margin-top: 0;
			width: 100%;
			text-align: center;
			color: var(--text-muted);
		}
		.options-3Wncp7 {
			margin: 0;
			.optionContainer-yOpaLq {
				margin-top: var(--spacing);
				font-size: var(--font-size);
				font-weight: var(--font-weight-normal);
				cursor: var(--cursor);
				box-sizing: border-box;
				line-height: normal;
				transition: none;
				padding: var(--spacing);
				border-radius: var(--button-border-radius);
				color: var(--text-normal);
				background: var(--background-light);
				border: 1px solid var(--base-border);
				box-shadow: none !important;
				&:hover {
					border: 1px solid currentColor;
				}
				&:focus {
					box-shadow: 0 0 0 1px currentColor !important;
					border: 1px solid currentColor !important;
				}
				.channelDescription-3n9Tua {
					line-height: normal;
				}
				.optionTextContainer-28Yb8N {
					margin: 0 var(--spacing);
				}
				.optionArrow-1kVloh {
					color: var(--text-normal);
				}
			}
		}
		.skip-3yoN6g {
			margin-top: var(--spacing-double);
		}
	}
}

// Light Mode
html.theme-light #app-mount .main-jX9p1r .options-3Wncp7 .optionContainer-yOpaLq {
	&:hover {
		background: var(--background);
		border: 1px solid var(--secondary-border);
	}
	&:focus {
		box-shadow: 0 0 0 2px rgb(0, 0, 0, 0.05) !important;
		border: 1px solid var(--secondary-border) !important;
	}
}
