/* Elementor counterpart of Genotyp's enhanced Core File presentation. */
.elementor-widget-sggw-files {
	inline-size: 100%;
}

.sggw-elementor-files__list {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--10, 8px);
	inline-size: 100%;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sggw-elementor-file {
	align-items: center;
	background-color: var(--sggw-surface-current);
	border-radius: var(--wp--custom--radius--small, 4px);
	box-sizing: border-box;
	color: var(--sggw-text);
	column-gap: var(--wp--preset--spacing--30, 16px);
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	grid-template-rows: auto auto;
	inline-size: 100%;
	min-block-size: 72px;
	min-inline-size: 0;
	padding: var(--wp--preset--spacing--20, 12px);
	row-gap: 0;
}

.sggw-elementor-file:not(.has-sggw-file-surface) {
	--sggw-surface-current: var(--sggw-module-default-surface);
	--sggw-surface-alternating: var(--sggw-module-default-alternating);
	--sggw-link-foreground: var(--sggw-module-default-link-foreground);
}

.sggw-elementor-file.has-download-action {
	grid-template-columns: 48px minmax(0, 1fr) 48px;
}

.sggw-elementor-file__icon {
	align-items: center;
	align-self: center;
	background-color: var(--sggw-surface-alternating);
	block-size: 48px;
	border-radius: var(--wp--custom--radius--x-small, 2px);
	box-sizing: border-box;
	color: var(--sggw-text);
	display: inline-flex;
	font-size: var(--sggw-icon-size-medium, 24px);
	grid-column: 1;
	grid-row: 1 / span 2;
	inline-size: 48px;
	justify-content: center;
	line-height: 1;
	padding: 12px;
}

.sggw-elementor-file__icon > i,
.sggw-elementor-file__download > i {
	color: currentColor;
	display: block;
	font-size: inherit;
	line-height: 1;
}

.sggw-elementor-file__title {
	align-self: end;
	color: var(--sggw-text);
	font-family: var(--wp--preset--font-family--body, inherit);
	font-size: var(--wp--preset--font-size--medium, 16px);
	font-style: normal;
	font-weight: var(--wp--custom--typography--font-weight--semibold, 600);
	grid-column: 2;
	grid-row: 1;
	line-height: var(--wp--custom--typography--line-height--medium, 1.5);
	min-inline-size: 0;
	overflow-wrap: anywhere;
	text-decoration: none;
}

.sggw-elementor-file__title:visited {
	color: var(--sggw-text);
}

.sggw-elementor-file.has-no-file-size .sggw-elementor-file__title {
	align-self: center;
	grid-row: 1 / span 2;
}

.sggw-elementor-file__size {
	align-self: start;
	color: var(--sggw-text-muted);
	display: block;
	font-family: var(--wp--preset--font-family--body, inherit);
	font-size: var(--wp--preset--font-size--small, 14px);
	font-style: normal;
	font-weight: var(--wp--custom--typography--font-weight--regular, 400);
	grid-column: 2;
	grid-row: 2;
	line-height: var(--wp--custom--typography--line-height--supporting, 1.4);
	min-inline-size: 0;
	overflow-wrap: anywhere;
}

.sggw-elementor-file__download {
	align-items: center;
	align-self: center;
	background-color: transparent;
	block-size: 48px;
	border: var(--wp--custom--line--width, 1px) solid transparent;
	border-radius: var(--wp--custom--radius--small, 4px);
	box-shadow: none;
	box-sizing: border-box;
	color: var(--sggw-text);
	display: inline-flex;
	font-size: var(--sggw-icon-size-medium, 24px);
	grid-column: 3;
	grid-row: 1 / span 2;
	inline-size: 48px;
	justify-content: center;
	line-height: 1;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

.sggw-elementor-file__title:focus:not(:focus-visible),
.sggw-elementor-file__download:focus:not(:focus-visible) {
	outline: none;
}

.sggw-elementor-file__title:focus-visible,
.sggw-elementor-file__download:focus-visible {
	outline: var(--wp--custom--line--focus-ring-width, 2px) solid var(--sggw-line-focus);
	outline-offset: var(--wp--custom--line--focus-ring-offset, 2px);
}

.sggw-elementor-file__title:focus-visible {
	border-radius: var(--wp--custom--radius--x-small, 2px);
}

.sggw-elementor-file__download:focus-visible {
	background-color: color-mix(
		in srgb,
		var(--sggw-text) var(--wp--custom--state-layer--hover, 8%),
		transparent
	);
}

.sggw-elementor-file__download:active {
	background-color: color-mix(
		in srgb,
		var(--sggw-text) var(--wp--custom--state-layer--pressed, 12%),
		transparent
	);
	color: var(--sggw-text);
}

.sggw-elementor-files__editor-placeholder {
	border: 1px dashed var(--sggw-line-functional, currentColor);
	border-radius: var(--wp--custom--radius--small, 4px);
	color: var(--sggw-text-muted, currentColor);
	font-family: var(--wp--preset--font-family--body, inherit);
	padding: var(--wp--preset--spacing--20, 12px);
}

@media (hover: hover) {
	.sggw-elementor-file:hover {
		box-shadow: var(--wp--custom--shadow--small);
	}

	.sggw-elementor-file__title:hover {
		color: var(--sggw-text);
		text-decoration: underline;
		text-decoration-thickness: var(--wp--custom--line--width, 1px);
		text-underline-offset: .16em;
	}

	.sggw-elementor-file__download:hover {
		background-color: color-mix(
			in srgb,
			var(--sggw-text) var(--wp--custom--state-layer--hover, 8%),
			transparent
		);
		color: var(--sggw-text);
		text-decoration: none;
	}
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.sggw-elementor-file {
		transition: box-shadow 150ms ease;
	}
}

@media (forced-colors: active) {
	.sggw-elementor-file {
		background: Canvas !important;
		border: 1px solid CanvasText;
		color: CanvasText;
		forced-color-adjust: none;
	}

	.sggw-elementor-file__icon,
	.sggw-elementor-file__download {
		background: ButtonFace;
		border-color: ButtonBorder;
		color: ButtonText;
	}

	.sggw-elementor-file__download:is(:hover, :focus-visible, :active) {
		background: Highlight;
		border-color: Highlight;
		color: HighlightText;
	}
}
