.litm.litm--story-tags {
	min-width: 300px;
	max-width: 600px;
	min-height: 250px;
	border-radius: 0px;
	overflow: hidden;
	overflow: clip;

	&:not(.minimized) {
		outline: 2px solid var(--litm-color);
		outline-offset: -10px;
	}

	& .window-header {
		background: url(../../assets/media/origin-theme-alt-bg-top.webp) no-repeat
			bottom / cover;
		padding-block-end: var(--litm-space-4);
		flex-wrap: nowrap;
		align-items: baseline;

		& .window-title {
			display: inline;
			font-size: var(--font-size-14);
			text-transform: uppercase;
		}
	}

	& form {
		position: relative;
		overflow: hidden;
		overflow: clip;
		display: flex;
		flex-direction: column;
		height: 100%;
	}

	& fieldset {
		border: none;
		margin: 0px;
		padding: 0px;
	}

	& .window-content form section {
		display: flex;
		flex-direction: column;
		margin-block-start: var(--litm-space-2);
		overflow-y: auto;
		flex: 1;

		&:last-of-type {
			height: 100%;
		}
	}

	& hr {
		border: none;
		min-height: 16px;
		background: url(../../assets/media/separator.webp) no-repeat center /
			contain;
		width: 95%;
	}

	& .litm--story-tags-main,
	& .litm--story-tags-actor {
		border: none;
		display: flex;
		flex-direction: column;

		& .litm--story-tags-section-header {
			display: flex;
			justify-content: space-between;
			align-items: center;
			gap: var(--litm-space-1);

			& legend {
				flex: 1 0 auto;
				margin-inline-start: -2px;
				padding: 0.4em 20px 0.4em 6px;
				background: url(../../assets/media/section-bg.webp) no-repeat center /
					auto;
				background-position: left;
				background-size: cover;
				color: var(--litm-color-primary-bg);
				font-family: var(--litm-font-primary);
				font-size: var(--font-size-16);
				line-height: var(--font-size-16);

				& img {
					aspect-ratio: 1 / 1;
					max-width: 25px;
					flex: none;
				}
			}

			& button {
				border: none;
				background: none;
				color: var(--litm-color-weakness);
				font-size: var(--font-size-20);
				margin-inline-end: var(--litm-space-2);
				flex: none;
				width: auto;

				&:hover,
				&:focus,
				&:active {
					box-shadow: none;
					text-shadow: 0 0 4px var(--litm-color-weakness);
				}
			}
		}

		& ul {
			display: flex;
			flex-direction: column;
			list-style: none;
			padding: 0 var(--litm-space-2);
			gap: var(--litm-space-1);

			& li {
				display: flex;
				align-items: center;
				border: none;
				padding-block: var(--litm-space-1);
				gap: var(--litm-space-2);

				& .litm--tag-item-name {
					background: transparent;
					border: none;
					font-family: var(--litm-font-text);
					font-size: var(--font-size-15);
					color: var(--litm-color-primary);
					min-width: 10px;
					padding: 0px;
				}

				& .litm--burn-label {
					height: var(--font-size-18);
					& .litm--burn {
						height: var(--font-size-18);
					}
				}

				& .litm--active-label {
					font-size: var(--font-size-11);
					line-height: 1;
					color: var(--litm-color-weakness);
				}

				& .litm--tag-item-status {
					flex: none;
					margin-inline: auto 0;
					display: flex;
					align-items: center;
					gap: var(--litm-space-1);

					& [type="checkbox"] {
						flex: none;
						appearance: none;
						background: white;
						cursor: pointer;
						margin: 0;
						padding: 0;
						width: 0.9em;
						height: 0.9em;
						border-radius: 4px;
						border: 1px solid var(--litm-color);

						&:checked {
							background: var(--litm-color);
						}
					}
				}
			}
		}
	}

	& .litm--story-tags-no-actors {
		display: grid;
		place-content: center;
		text-align: center;
		color: var(--litm-color);
		margin: var(--litm-space-3);
		border-radius: 8px;
		padding: var(--litm-space-3);

		& img {
			aspect-ratio: 1 / 1;
			max-width: 75px;
			margin-inline: auto;
		}
	}
}
