.flex-layout.share-layout {
	padding-inline: 0;
}

.share-layout .pk-share-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: max(1rem, calc(1 * var(--su)));
	padding-block: max(1.5rem, calc(1.5 * var(--su))) 0;
	border-top: 1px solid rgba(235, 236, 238, 1);
}

.share-layout .pk-share-bar__label {
	font-size: var(--desktop-body-xs);
	color: rgba(136, 141, 152, 1);
}

.share-layout .pk-share-bar__actions {
	display: flex;
	align-items: center;
	gap: max(0.5rem, calc(0.5 * var(--su)));
}

.share-layout .pk-share-bar__button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: max(2.25rem, calc(2.25 * var(--su)));
	height: max(2.25rem, calc(2.25 * var(--su)));
	border: 1px solid rgba(235, 236, 238, 1);
	text-decoration:none;
	border-radius: 999px;
	color: var(--ex-grey-blue);
	cursor: pointer;
	background: transparent;
	transition:
		border-color 0.2s ease,
		background-color 0.2s ease;
}

.share-layout .pk-share-bar__button:hover,
.share-layout .pk-share-bar__button:focus-visible {
	border-color: var(--ex-grey-blue);
	background: var(--ex-surface-muted);
}

.share-layout .pk-share-bar__button .material-symbols-outlined {
	font-size: max(1.125rem, calc(1.125 * var(--su)));
}

.share-layout .pk-share-bar__button svg {
	width: max(1rem, calc(1 * var(--su)));
	height: max(1rem, calc(1 * var(--su)));
}

.share-layout .pk-share-bar__copy.is-copied {
	border-color: var(--ex-grey-blue);
	background: var(--ex-surface-muted);
}

.share-layout .pk-share-bar__copied-message {
	position: absolute;
	bottom: calc(100% + max(0.5rem, calc(0.5 * var(--su))));
	left: 50%;
	transform: translate(-50%, max(0.25rem, calc(0.25 * var(--su))));
	padding: max(0.375rem, calc(0.375 * var(--su))) max(0.75rem, calc(0.75 * var(--su)));
	border-radius: max(0.25rem, calc(0.25 * var(--su)));
	background: var(--ex-grey-blue);
	color: var(--ex-white);
	font-size: var(--desktop-body-xs);
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition:
		opacity 0.2s ease-in-out,
		transform 0.2s ease-in-out;
}

.share-layout .pk-share-bar__copy.is-copied .pk-share-bar__copied-message {
	opacity: 1;
	transform: translate(-50%, 0);
}
