span.wpcf7-files{
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0 0 20px;

	&::after{
		content: '';
		pointer-events: none;
		position: absolute;
		z-index: 100;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		border: 1px dashed var(--wp--preset--color--darkblue);
		opacity: 0;
		transition: opacity .3s ease;
	}
	&.dragging::after{
		opacity: 1;
	}
}

.wpcf7-files-wrapper-outer{
	position: relative;
	padding: 12px;
	background: #fff;
}
.wpcf7-files-wrapper{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.wpcf7-files-placeholder,
.wpcf7-files-button,
.wpcf7-files-helptext{
	max-width: 305px;
	margin: 0 auto;
	text-align: center;
}
.wpcf7-files-helptext{
	color: var(--wp--preset--color--yellow);
}

.wpcf7-files-list{
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin: 20px 0 0;
}

.wpcf7-files-item{
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 2px 20px;
	padding: 10px 40px;
	background: #fff;

	@media (max-width: 767px){
		padding: 10px 14px;
	}
}
.wpcf7-files-item-size{
	grid-column: 1/2;
	grid-row: 2/3;
	color: var(--wp--preset--color--lila-75);
}
.wpcf7-files-item-remove{
	grid-row: span 2;
	display: flex;

	&::after{
		content: '';
		--icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6.17647h16M9 3h6m-5 13.7647v-6.3529m4 6.3529v-6.3529M15.5 21h-7c-1.10457 0-2-.9481-2-2.1176L6.0434 7.27937c-.02367-.60154.43052-1.1029.99913-1.1029h9.91497c.5686 0 1.0228.50136.9991 1.1029L17.5 18.8824c0 1.1695-.8954 2.1176-2 2.1176z"/></svg>');
		content: '';
		width: 24px;
		aspect-ratio: 1;
		-webkit-mask: var(--icon) no-repeat center/contain;
		mask: var(--icon) no-repeat center/contain;
		background: #000;
		transition: background-color .3s ease;
	}
	&:hover::after{
		background-color: var(--wp--preset--color--fehlermeldung);
	}
}

.wpcf7-files-vr,
.wpcf7-files-item-ext,
.wpcf7-files-list.empty[data-nofiles=""]{
	display: none;
}
.wpcf7-files-fake-input{
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
input.wpcf7-files{
	overflow: hidden;
	position: absolute;
	z-index: 2;
	bottom: 0;
	left: 0;
	width: 1px;
	height: 1px;
	opacity: 0;
	clip-path: circle(0);
}
span.wpcf7-files .wpcf7-not-valid-tip{
	display: block !important;
	margin: 10px 0 0;
	font-size: 12px;
}