.ryhdc-credit {
	--ryhdc-bg: #111111;
	--ryhdc-surface: #191919;
	--ryhdc-border: #343434;
	--ryhdc-text: #f5f5f5;
	--ryhdc-muted: #aaa8a1;
	--ryhdc-accent: #ed1b4d;
	--ryhdc-radius: 16px;
	--ryhdc-name-size: 13px;
	box-sizing: border-box;
	color: var(--ryhdc-text);
	direction: rtl;
	display: flex;
	font-family: inherit;
	line-height: 1.6;
	max-width: 100%;
}

.ryhdc-credit *,
.ryhdc-credit *::before,
.ryhdc-credit *::after {
	box-sizing: border-box;
}

.ryhdc-credit--align-right { justify-content: flex-start; }
.ryhdc-credit--align-center { justify-content: center; }
.ryhdc-credit--align-left { justify-content: flex-end; }

.ryhdc-credit__surface {
	align-items: center;
	display: inline-flex;
	gap: 11px;
	max-width: 100%;
	position: relative;
}

.ryhdc-credit--card .ryhdc-credit__surface {
	background: var(--ryhdc-bg);
	background: radial-gradient(circle at 100% 0, color-mix(in srgb, var(--ryhdc-accent) 16%, transparent), transparent 42%), var(--ryhdc-bg);
	border: 1px solid var(--ryhdc-border);
	border-radius: var(--ryhdc-radius);
	box-shadow: 0 12px 34px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .035);
	color: var(--ryhdc-text);
	min-height: 58px;
	overflow: hidden;
	padding: 10px 11px 10px 15px;
}

.ryhdc-credit--card .ryhdc-credit__surface::after {
	background: var(--ryhdc-accent);
	border-radius: 99px;
	content: "";
	height: 22px;
	opacity: .72;
	position: absolute;
	right: -2px;
	top: 18px;
	width: 3px;
}

.ryhdc-credit__mark {
	align-items: center;
	background: var(--ryhdc-accent);
	border: 1px solid rgba(255, 255, 255, .15);
	border-radius: 11px;
	box-shadow: 0 7px 18px rgba(237, 27, 77, .2);
	color: #fff;
	display: inline-flex;
	flex: 0 0 auto;
	height: 37px;
	justify-content: center;
	width: 37px;
}

.ryhdc-credit__mark svg {
	fill: none;
	height: 21px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.75;
	transition: transform .22s ease;
	width: 21px;
}

.ryhdc-credit--symbol-ruqayya .ryhdc-credit__mark,
.ryhdc-credit--symbol-drop .ryhdc-credit__mark {
	background: rgba(237, 27, 77, .08);
	background: color-mix(in srgb, var(--ryhdc-accent) 11%, transparent);
	border-color: var(--ryhdc-accent);
	border-color: color-mix(in srgb, var(--ryhdc-accent) 42%, transparent);
	box-shadow: 0 7px 18px rgba(0, 0, 0, .15);
	color: var(--ryhdc-accent);
}

.ryhdc-credit--symbol-ruqayya .ryhdc-credit__mark { border-radius: 13px; }
.ryhdc-credit--symbol-ruqayya .ryhdc-credit__mark svg { height: 25px; stroke-width: 1.45; width: 25px; }
.ryhdc-credit--symbol-drop .ryhdc-credit__mark { border-radius: 50%; }
.ryhdc-credit--symbol-drop .ryhdc-credit__mark svg { height: 22px; width: 22px; }
.ryhdc-credit--symbol-dot .ryhdc-credit__mark { border: 0; border-radius: 50%; box-shadow: 0 0 0 5px color-mix(in srgb, var(--ryhdc-accent) 13%, transparent); height: 9px; margin-inline: 5px 3px; width: 9px; }
.ryhdc-credit--symbol-dot .ryhdc-credit__mark svg { display: none; }
.ryhdc-credit--symbol-dot .ryhdc-symbol-svg--dot circle { fill: currentColor; stroke: none; }
.ryhdc-credit--symbol-ruqayya .ryhdc-credit__surface:hover .ryhdc-credit__mark svg,
.ryhdc-credit--symbol-drop .ryhdc-credit__surface:hover .ryhdc-credit__mark svg { transform: translateY(-1px); }

.ryhdc-credit__copy {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.ryhdc-credit__label {
	color: var(--ryhdc-muted);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: -.01em;
	white-space: normal;
}

.ryhdc-credit .ryhdc-credit__label { color: var(--ryhdc-muted) !important; }

.ryhdc-credit__name,
.ryhdc-credit__link {
	color: var(--ryhdc-text);
	font-size: var(--ryhdc-name-size);
	font-weight: 700;
	letter-spacing: -.015em;
}

.ryhdc-credit__name { display: block; }
.ryhdc-credit .ryhdc-credit__name { color: var(--ryhdc-text) !important; }

.ryhdc-credit__link {
	align-items: center;
	display: inline-flex;
	gap: 5px;
	max-width: 100%;
	text-decoration: none;
	transition: color .2s ease;
}

.ryhdc-credit .ryhdc-credit__link { color: var(--ryhdc-text) !important; }

.ryhdc-credit__link span {
	overflow-wrap: anywhere;
}

.ryhdc-credit__arrow {
	fill: none;
	flex: 0 0 auto;
	height: 14px;
	stroke: var(--ryhdc-accent);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.7;
	transition: transform .2s ease;
	width: 14px;
}

.ryhdc-credit .ryhdc-credit__link:hover,
.ryhdc-credit .ryhdc-credit__link:focus-visible { color: var(--ryhdc-accent) !important; }
.ryhdc-credit__link:hover .ryhdc-credit__arrow { transform: translate(-2px, -2px); }
.ryhdc-credit__link:focus-visible { border-radius: 4px; outline: 2px solid var(--ryhdc-accent); outline-offset: 4px; }

.ryhdc-credit--text .ryhdc-credit__surface {
	color: var(--ryhdc-text);
	gap: 8px;
}

.ryhdc-credit--text .ryhdc-credit__mark {
	background: transparent;
	border: 0;
	box-shadow: none;
	color: var(--ryhdc-accent);
	height: 25px;
	margin-inline: 2px 0;
	width: 25px;
}

.ryhdc-credit--text .ryhdc-credit__mark svg { display: block; height: 21px; width: 21px; }
.ryhdc-credit--text.ryhdc-credit--symbol-ruqayya .ryhdc-credit__mark svg { height: 24px; width: 24px; }
.ryhdc-credit--text.ryhdc-credit--symbol-code .ryhdc-credit__mark svg { height: 19px; width: 19px; }
.ryhdc-credit--text.ryhdc-credit--symbol-dot .ryhdc-credit__mark { background: var(--ryhdc-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ryhdc-accent) 13%, transparent); height: 7px; margin-inline: 4px 2px; width: 7px; }
.ryhdc-credit--text.ryhdc-credit--symbol-dot .ryhdc-credit__mark svg { display: none; }

.ryhdc-credit--text .ryhdc-credit__copy {
	align-items: baseline;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 4px 7px;
}

.ryhdc-credit--text .ryhdc-credit__label {
	color: var(--ryhdc-muted);
	font-size: max(10px, calc(var(--ryhdc-name-size) - 2px));
	opacity: 1 !important;
}

.ryhdc-credit--text .ryhdc-credit__name,
.ryhdc-credit--text .ryhdc-credit__link {
	color: var(--ryhdc-text);
	font-size: var(--ryhdc-name-size);
}

.ryhdc-credit--text .ryhdc-credit__arrow { stroke: currentColor; }
.ryhdc-credit--text .ryhdc-credit__link:hover { color: var(--ryhdc-accent) !important; }
.ryhdc-credit--without-icon .ryhdc-credit__surface { padding-right: 16px; }
.ryhdc-credit--text.ryhdc-credit--without-icon .ryhdc-credit__surface { padding-right: 0; }

@media (max-width: 480px) {
	.ryhdc-credit--card { width: 100%; }
	.ryhdc-credit--card .ryhdc-credit__surface { width: 100%; }
	.ryhdc-credit__copy { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.ryhdc-credit__link,
	.ryhdc-credit__arrow,
	.ryhdc-credit__mark svg { transition: none; }
}
