.PDFDraft-Invoice-Wrap {
	display: flex;
	align-items: center;

	&--order-edit:not(&--has-invoice) {
		display: flex;
		flex-direction: column;
		gap: 0;
	}
}

.PDFDraft-Invoice-Download-Button {
	height: 1.75rem;
	width: 1.75rem;
	padding: 0;
	display: inline-grid;
	place-items: center;
	border-radius: 0.25rem;
	outline: none;
	cursor: pointer;
	transition:
		background-color 0.15s ease,
		color 0.15s ease,
		border-color 0.15s ease,
		box-shadow 0.15s ease;
	text-decoration: none;

	&[disabled] {
		opacity: 0.45;
		pointer-events: none;
	}

	.PDFDraft-Button-Spinner {
		display: none;
		line-height: 0;

		svg {
			animation: spin 1s linear infinite;
		}
	}
}

body:not(.wp-admin) .PDFDraft-Invoice-Wrap {
	.PDFDraft-Invoice-Download-Button {
		color: inherit;
		background-color: transparent;
		border: 1px solid rgba(15, 23, 42, 0.14);
		box-shadow: none;

		&:hover {
			color: inherit;
			background-color: rgba(15, 23, 42, 0.06);
			border-color: rgba(15, 23, 42, 0.22);
		}

		&:focus-visible {
			outline: 2px solid rgba(15, 23, 42, 0.35);
			outline-offset: 2px;
		}

		&.PDFDraft-Button-both {
			width: 100%;
			height: 2.375rem;
			font-size: 13px;
			font-weight: 400;
			line-height: 2.15384615;
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 8px;
		}
	}

	&--has-invoice .PDFDraft-Invoice-Download-Button {
		display: flex;
		align-items: center;
		gap: 6px;
		padding: 4px 8px;
		height: auto;
		width: auto;
		font-size: 12px;
		line-height: 1.4;

		.PDFDraft-Button-Icon {
			width: 14px;
			height: 14px;
			flex-shrink: 0;
		}
	}

	.PDFDraft-Invoice-Filename {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 180px;
	}
}

@supports (color: color-mix(in srgb, white, black)) {
	body:not(.wp-admin) .PDFDraft-Invoice-Wrap .PDFDraft-Invoice-Download-Button {
		border-color: color-mix(in srgb, currentColor 18%, transparent);

		&:hover {
			background-color: color-mix(in srgb, currentColor 9%, transparent);
			border-color: color-mix(in srgb, currentColor 28%, transparent);
		}

		&:focus-visible {
			outline-color: color-mix(in srgb, currentColor 40%, transparent);
		}
	}
}

body.wp-admin .PDFDraft-Invoice-Wrap {
	.PDFDraft-Invoice-Download-Button {
		color: #50575e;
		background-color: #fff;
		border: 1px solid #dcdcde;
		border-radius: 4px;
		box-shadow: none;

		&:hover {
			color: #1d2327;
			background-color: #f6f7f7;
			border-color: #c3c4c7;
		}

		&:focus-visible {
			outline: 2px solid #2271b1;
			outline-offset: 1px;
		}

		&.PDFDraft-Button-both {
			width: 100%;
			height: 2.375rem;
			font-size: 13px;
			font-weight: 400;
			line-height: 2.15384615;
			color: #2271b1;
			background-color: #f6f7f7;
			border-color: #2271b1;
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 8px;

			&:hover {
				color: #135e96;
				background-color: #f0f0f1;
				border-color: #135e96;
			}
		}
	}

	&--has-invoice .PDFDraft-Invoice-Row {
		display: flex;
		align-items: center;
		gap: 6px;
		flex-wrap: nowrap;
	}

	&--has-invoice .PDFDraft-Invoice-Download-Button {
		display: flex;
		align-items: center;
		gap: 6px;
		padding: 4px 8px;
		height: 1.75rem;
		width: auto;
		font-size: 12px;
		line-height: 1.4;
		color: #50575e;
		background-color: #f6f7f7;
		border: 1px solid #dcdcde;

		&:hover {
			color: #1d2327;
			background-color: #f0f0f1;
			border-color: #c3c4c7;
		}

		.PDFDraft-Button-Icon {
			width: 14px;
			height: 14px;
			flex-shrink: 0;
		}
	}

	.PDFDraft-Invoice-Delete-Button {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 1.75rem;
		height: 1.75rem;
		padding: 0;
		margin: 0;
		border-radius: 4px;
		border: 1px solid #dcdcde;
		background: #f6f7f7;
		color: #50575e;
		cursor: pointer;
		flex-shrink: 0;
		line-height: 0;
		transition:
			background-color 0.15s ease,
			color 0.15s ease,
			border-color 0.15s ease;

		&:hover:not(:disabled) {
			color: #b32d2e;
			border-color: #dba9a9;
			background-color: #fcf0f1;
		}

		&:focus-visible {
			outline: 2px solid #2271b1;
			outline-offset: 1px;
		}

		&:disabled {
			opacity: 0.5;
			cursor: not-allowed;
		}
	}

		.PDFDraft-Invoice-Delete-Icon {
			width: 14px;
			height: 14px;
		}

		.PDFDraft-Invoice-Delete-Spinner {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			line-height: 0;
			flex-shrink: 0;

			svg {
				width: 14px;
				height: 14px;
				animation: spin 1s linear infinite;
			}
		}

	.PDFDraft-Invoice-Filename {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 180px;
	}
}

.woocommerce-orders-table .PDFDraft-Invoice-Wrap {
	justify-content: center;
}

.woocommerce-order-details .order_details .order-actions--heading + td {
	.PDFDraft-Invoice-Wrap--view-order {
		display: inline-flex;
		vertical-align: middle;
		margin-inline-end: 0.35em;
		margin-bottom: 0.25em;

		&:not(.PDFDraft-Invoice-Wrap--has-invoice) {
			flex-direction: row;
		}

		.PDFDraft-Invoice-Download-Button.PDFDraft-Button-both {
			width: auto;
			min-width: auto;
			white-space: nowrap;
		}
	}
}

// ---- Order-received generating overlay --------------------------------------

.PDFDraft-Generating-Overlay {
	position: fixed;
	inset: 0;
	z-index: 999999;
	background: rgba(0, 0, 0, 0.55);
	display: flex;
	align-items: center;
	justify-content: center;
	backdrop-filter: blur(2px);

	&__Inner {
		background: #fff;
		border-radius: 12px;
		padding: 32px 40px;
		text-align: center;
		max-width: 320px;
		width: 90%;
		box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 12px;
	}

	&__Spinner {
		animation: spin 1s linear infinite;
		color: #2271b1;
		flex-shrink: 0;
	}

	&__Message {
		font-size: 16px;
		font-weight: 600;
		margin: 0;
		color: #1d2327;
		line-height: 1.4;
	}

	&__Sub {
		font-size: 13px;
		margin: 0;
		color: #646970;
		line-height: 1.4;
	}
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}
