.youtube-transcript-shortcode {
	--yts-surface: var(--wp--preset--color--base, #ffffff);
	--yts-text: var(--wp--preset--color--contrast, #18181b);
	--yts-muted-surface: #f6f7f8;
	--yts-border: #e5e7eb;
	--yts-action: #ff0000;
	--yts-action-hover: #cc0000;
	--yts-action-text: #ffffff;
	--yts-focus: #b91c1c;
	--yts-fallback-surface: #fff8ed;
	--yts-fallback-border: #fed7aa;
	--yts-font-size: 16px;
	--yts-label-font-size: 16px;
	--yts-transcript-font-size: 16px;
	--yts-line-height: 1.6;
	--yts-max-width: 860px;
	--yts-margin-vertical: 24px;
	--yts-padding: 32px;
	--yts-border-width: 1px;
	--yts-radius: 14px;
	--yts-button-radius: 8px;
	--yts-button-height: 42px;
	--yts-input-padding-y: 10px;
	--yts-input-padding-x: 13px;
	--yts-transcript-padding: 16px;
	--yts-transcript-max-height: 544px;
	--yts-shadow: 0 8px 28px rgba(24, 24, 27, 0.07);
	box-sizing: border-box;
	max-width: var(--yts-max-width);
	margin: var(--yts-margin-vertical) auto;
	padding: var(--yts-padding);
	color: var(--yts-text);
	font-size: var(--yts-font-size);
	line-height: var(--yts-line-height);
	background: var(--yts-surface);
	border: var(--yts-border-width) solid var(--yts-border);
	border-radius: var(--yts-radius);
	box-shadow: var(--yts-shadow);
}

.youtube-transcript-shortcode *,
.youtube-transcript-shortcode *::before,
.youtube-transcript-shortcode *::after {
	box-sizing: border-box;
}

.youtube-transcript-shortcode p,
.youtube-transcript-shortcode fieldset {
	margin-top: 0;
}

.youtube-transcript-shortcode__form > p:last-child,
.youtube-transcript-shortcode__controls > p:last-child {
	margin-bottom: 0;
}

.youtube-transcript-shortcode label,
.youtube-transcript-shortcode legend {
	font-size: var(--yts-label-font-size);
	font-weight: 600;
}

.youtube-transcript-shortcode__url,
.youtube-transcript-shortcode__own-key-input {
	display: block;
	width: 100%;
	min-height: var(--yts-button-height);
	margin-top: 0.45rem;
	padding: var(--yts-input-padding-y) var(--yts-input-padding-x);
	font: inherit;
	color: inherit;
	background: var(--yts-muted-surface);
	border: var(--yts-border-width) solid var(--yts-border);
	border-radius: var(--yts-button-radius);
}

.youtube-transcript-shortcode__url:focus,
.youtube-transcript-shortcode__own-key-input:focus,
.youtube-transcript-shortcode button:focus-visible,
.youtube-transcript-shortcode__timestamps:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--yts-focus) 30%, transparent);
	outline-offset: 2px;
}

.youtube-transcript-shortcode__form > p:nth-child(2) {
	margin-bottom: 1.25rem;
	font-size: 0.9em;
	opacity: 0.78;
}

.youtube-transcript-shortcode button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--yts-button-height);
	padding: var(--yts-input-padding-y) var(--yts-input-padding-x);
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	color: var(--yts-action-text);
	cursor: pointer;
	background: var(--yts-action);
	border: var(--yts-border-width) solid var(--yts-action);
	border-radius: var(--yts-button-radius);
	transition: background-color 160ms ease, border-color 160ms ease, opacity 160ms ease;
}

.youtube-transcript-shortcode button:hover:not(:disabled) {
	background: var(--yts-action-hover);
	border-color: var(--yts-action-hover);
}

.youtube-transcript-shortcode button:disabled {
	cursor: wait;
	opacity: 0.6;
}

.youtube-transcript-shortcode__status:not(:empty) {
	margin: 1rem 0 0;
	padding-top: 1rem;
	border-top: var(--yts-border-width) solid var(--yts-border);
}

.youtube-transcript-shortcode__own-key,
.youtube-transcript-shortcode__results {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: var(--yts-border-width) solid var(--yts-border);
}

.youtube-transcript-shortcode__own-key {
	padding: var(--yts-transcript-padding);
	background: var(--yts-fallback-surface);
	border: var(--yts-border-width) solid var(--yts-fallback-border);
	border-radius: var(--yts-button-radius);
}

.youtube-transcript-shortcode__own-key p:last-child {
	margin-bottom: 0;
}

.youtube-transcript-shortcode__affiliate-disclosure,
.youtube-transcript-shortcode__own-key-notice {
	font-size: 0.9em;
	line-height: 1.45;
	opacity: 0.8;
}

.youtube-transcript-shortcode__own-key-input {
	margin-top: 0.45rem;
}

.youtube-transcript-shortcode__controls {
	padding: 0;
	border: 0;
}

.youtube-transcript-shortcode__controls p {
	margin-bottom: 0.8rem;
}

.youtube-transcript-shortcode__controls label {
	font-weight: 400;
}

.youtube-transcript-shortcode__timestamps {
	margin-right: 0.35rem;
}

.youtube-transcript-shortcode__transcript {
	max-height: var(--yts-transcript-max-height);
	overflow: auto;
	padding: var(--yts-transcript-padding);
	font-size: var(--yts-transcript-font-size);
	line-height: var(--yts-line-height);
	background: var(--yts-muted-surface);
	border: var(--yts-border-width) solid var(--yts-border);
	border-radius: var(--yts-button-radius);
}

.youtube-transcript-shortcode__transcript p:last-child {
	margin-bottom: 0;
}

@media (max-width: 480px) {
	.youtube-transcript-shortcode button {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.youtube-transcript-shortcode button {
		transition: none;
	}
}