.islands__ai_chat_box__button {
	color: var(--_font-color);
	border: var(--_border-size) solid transparent;
	outline: none;
	background-color: transparent;

	&:active,
	&:focus-visible {
		border-color: currentColor;
	}
}

.islands__ai_chat_box__dialog {
	justify-content: center;
	align-content: end;
	width: 80%;
	height: 80%;
	border: var(--_border-size) solid currentColor;
	background: var(--_background-image) repeat top left / 800px;
	background-color: var(--_background-color);

	&[open] {
		display: grid;
	}
}

.islands__ai_chat_box__dialog__content {
	overflow-y: scroll;
	display: grid;
	align-content: end;
	gap: var(--_gap);
	max-height: 100%;
	overscroll-behavior: contain;

	& div {
		display: block;
	}
}

.islands__ai_chat_box__history__user {
	justify-self: right;
}

.islands__ai_chat_box__history__bot {
	justify-self: left;
}

.islands__ai_chat_box__dialog__form {
	display: flex;
	gap: var(--_gap);
	color: var(--_font-color);

	& > * {
		background-color: var(--_translucent);
		outline: none;
		padding: var(--_gap-half);
		border: var(--_border-size) solid transparent;
	}

	& > *:active,
	& > *:focus-visible {
		border-color: currentColor;
	}
}