
/* default element take all space on each line
*/
#chat_box .chat_item form {
	margin: 0px auto;
}
#chat_box .chat_item form * {
	margin: 0px;
}


/* radio elements style check
*/
#chat_box .chat_item form input[type=radio] {
	display: none;
}
#chat_box .chat_item form label._radio {
	margin: 0px 0px 0px auto;
	padding-right: 10px;
	cursor: pointer;
}
#chat_box .chat_item form label._radio::after {
	content: "";
	position: absolute;
	top: calc(50% - 6px);
	right: 0px;
	width: 12px;
	height: 12px;
	border-radius: 6px;
	border: 2px solid rgb(150, 150, 150);
	box-sizing: border-box;
	cursor: pointer;
}
#chat_box .chat_item form input[type=radio]:checked
+ label._radio::after {
	background-color: rgb(200, 200, 200);
}


/* change next element on check
*/
#chat_box form ._check_change_next:checked ~ ._is_hidden {
	display: flex;
}
#chat_box form ._check_change_next:checked ~ ._is_not_gray {
	pointer-events: none;
	color: rgb(100, 100, 100);
}
#chat_box form ._is_hidden {
	display: none;
}


/* submit button
		https://www.fileformat.info/info/unicode/category/So/list.htm
		U+21AA 	RIGHTWARDS ARROW WITH HOOK 	↪
		U+21B3 	DOWNWARDS ARROW WITH TIP RIGHTWARDS 	↳
		U+2BA1 	DOWNWARDS TRIANGLE-HEADED ARROW WITH LONG TIP RIGHTWARDS 	⮡
		U+2BB1 	RIBBON ARROW DOWN RIGHT 	⮱
		U+2BA9 	BLACK CURVED DOWNWARDS AND RIGHTWARDS ARROW 	⮩
*/
#chat_box .chat_item form input[type=submit] {
	padding: 0px 10px;
	border: none;
	margin: 10px 0px 0px auto;
	cursor: pointer;
	background-color: rgb(220, 220, 220);
}
#chat_box .chat_item form input[type=submit]:hover {
	background-color: rgb(200, 200, 200);
}


/* select
*/
#chat_box .chat_item form label._select {
	flex-direction: row;
	margin-left: auto;
}
#chat_box .chat_item form select {
	margin: auto 0px;
	background-color: rgb(220, 220, 220);
	border: none;
	padding: 5px;
	cursor: pointer;
}
#chat_box .chat_item form select:hover {
	background-color: rgb(200, 200, 200);
}


/* checkbox
		<input  id="chat_mute_forever" type="checkbox" class="_checkbox"></input>
		<label for="chat_mute_forever">forever</label>
*/
#chat_box .chat_item form input[type=checkbox] {
	display: none;
}
#chat_box .chat_item form label._checkbox {
	margin: 0px 0px 0px auto;
	padding-right: 10px;
	cursor: pointer;
}
#chat_box .chat_item form label._checkbox::after {
	content: "";
	position: absolute;
	top: calc(50% - 6px);
	right: 0px;
	width: 12px;
	height: 12px;
	border: 2px solid rgb(150, 150, 150);
	box-sizing: border-box;
	cursor: pointer;
}
#chat_box .chat_item form input[type=checkbox]:checked
+ label._checkbox::after {
	background-color: rgb(200, 200, 200);
}


