@use "@automattic/jetpack-base-styles/gutenberg-base-styles" as gb;

.no-videopress-media-placeholder {

	.components-placeholder__fieldset {
		flex-direction: row-reverse;
		align-items: flex-start;
		justify-content: flex-end;

		button {
			display: none;
		}

		.block-editor-media-placeholder__url-input-container button,
		.no-videopress-disabled-button {
			display: inline-flex;
		}

		.no-videopress-disabled-button:last-child {
			margin-right: 12px;
		}
	}
}

.videopress-block-hide {
	display: none;
}

.seekbar-color-settings__panel {

	.components-panel__body.is-opened {
		padding: 0;
	}

	.components-panel__body {
		border-top: none;
	}
}

.videopress-block-tracks-editor > .components-popover__content {
	width: 360px;
}

.videopress-block-tracks-editor__track-list-track {
	display: flex;
	place-content: space-between;
	align-items: center;
	padding: gb.$grid-unit-05 0 gb.$grid-unit-05 gb.$grid-unit-15;
	min-height: 23px;
}

.videopress-block-tracks-editor__track-list-track-delete {
	display: flex;
	align-items: center;
}

.videopress-block-tracks-editor__single-track-editor-label-language {
	display: flex;
	margin-top: gb.$grid-unit-15;

	> .components-base-control {
		width: 50%;
	}

	> .components-base-control:first-child {
		margin-right: gb.$grid-unit-20;
	}
}

.videopress-block-tracks-editor__single-track-editor-kind-select {
	max-width: 240px;
}

.videopress-block-tracks-editor__single-track-editor-buttons-container {
	display: flex;
	place-content: space-between;
	margin-top: gb.$grid-unit-40;
	min-height: 36px;
}

.videopress-block-tracks-editor__single-track-editor-upload-file-help {
	font-size: 12px;
	color: gb.$gray-700;
	margin-top: gb.$grid-unit-15;
}

.videopress-block-tracks-editor__single-track-editor-label {
	color: gb.$gray-700;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: 500;
	display: block;
	margin-top: gb.$grid-unit-05;
	margin-bottom: gb.$grid-unit-15;
}

.videopress-block-tracks-editor > .components-popover__content > div {
	padding: 0;
}

.videopress-block-tracks-editor__track-list,
.videopress-block-tracks-editor__add-tracks-container {

	.components-menu-group__label {
		padding: 0;
	}
}

.videopress-block-tracks-editor__single-track-editor,
.videopress-block-tracks-editor__track-list,
.videopress-block-tracks-editor__add-tracks-container {
	padding: gb.$grid-unit-15;
}

.videopress-block-tracks-editor__single-track-editor .components-base-control {

	.components-base-control__label {
		margin-bottom: gb.$grid-unit-05;
	}

	.components-base-control__field {
		margin-bottom: gb.$grid-unit-15;
	}

	.components-text-control__input {
		margin-left: 0;
	}

	.components-input-control__label {
		margin-bottom: gb.$grid-unit-05;
	}
}

.videopress-block-tracks-editor__single-track-editor-upload-file-label {
	display: flex;

	.components-form-file-upload,
	.videopress-block-tracks-editor__single-track-editor-upload-file-label-name {
		margin-inline-start: gb.$grid-unit;
	}
}

.videopress-block-tracks-editor__single-track-editor-error {
	padding: gb.$grid-unit-15 0;
	color: gb.$alert-red;
}

.uploader-block__logo {
	display: flex;
	flex-direction: row;
	align-items: center;
	font-size: 24px;
	line-height: 29px;
	margin-bottom: gb.$grid-unit-15;
	padding: 0 20px;
}

.uploader-block__logo-text {
	margin-left: 10px;
}

.uploader-block__upload-complete {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	padding: 20px 20px 0;
	border-top: 1px solid gb.$gray-200;
	box-sizing: border-box;
	margin-top: gb.$grid-unit-30;
}
