.logez-glossary-wrapper {
	details {
		--border: 2px solid var( --e-global-color-accent );
		--transition-duration: .5s;
		--padding-left: 65px;
		--height-icon: 25px;
		--padding-summary: 15px 0;
		--gap-summary: 10px;
		--color-summary: var( --e-global-color-accent );
		--justify-summary: flex-start;
		--direction-summary: row;
		border-top: var( --border );
		overflow: hidden;
		transition: grid-template-rows var( --transition-duration );

		&, * {
			transition-duration: var( --transition-duration );
		}

		:not( .glossary-content ) > &:last-of-type {
			border-bottom: var( --border );
		}

		.glossary-title, .glossary-content {
			font-family: var( --e-global-typography-text-font-family );
			font-size:var( --e-global-typography-text-font-size );
			font-style:var( --e-global-typography-text-font-style );
			font-weight:var( --e-global-typography-text-font-weight );
			line-height:var( --e-global-typography-text-line-height );
			text-transform: var( --e-global-typography-text-text-transform );
			text-decoration: var( --e-global-typography-text-text-decoration );
		}

		.glossary-title {
			color: inherit;
			display: inline-block;
			margin: 0;
		}

		> .glossary-content {
			padding-left: var( --padding-left );
			padding-bottom: 10px;
		}

		summary {
			padding: var( --padding-summary );
			gap: var( --gap-summary );
			color: var( --color-summary );
			list-style: none;
			display: flex;
			line-height: 0;
			align-items: center;
			justify-content: var( --justify-summary );
			flex-direction: var( --direction-summary );

			&:hover {
				--color-summary: var( --e-global-color-primary );
				cursor: pointer;
			}

			.glossary-title-icon svg {
				height: var( --height-icon );

				#Plus #line-vertical {
					transform: scaleY( 1 );
					transform-origin: center;
				}
			}
		}

		&[open] {
			> summary {
				.glossary-title-icon #Plus #line-vertical {
					transform: scaleY( 0 );
				}
			}
		}
	}
}
