/* =========================================================================
   RentDrive Pro — Social Media Icons (v3.0.3)
   Self-contained: no external font/icon dependencies, inline SVG.
   ========================================================================= */

/* ---- Shared icon list -------------------------------------------------- */
.rdp-social-icons {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.rdp-social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: color 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
	color: inherit;
}
.rdp-social-link:hover,
.rdp-social-link:focus-visible {
	color: var(--rdp-social-color, var(--rdp-primary));
	transform: translateY(-2px);
	opacity: 1;
}
.rdp-social-icon { display: block; flex-shrink: 0; }
.rdp-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ---- Footer social row (inside brand column) --------------------------- */
.rdp-social-icons.rdp-social-footer {
	gap: 6px;
	flex-wrap: wrap;
}
.rdp-social-footer .rdp-social-link {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.10);
	color: rgba(255, 255, 255, 0.55);
	background: rgba(255, 255, 255, 0.04);
	transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
.rdp-social-footer .rdp-social-link:hover,
.rdp-social-footer .rdp-social-link:focus-visible {
	color: #fff;
	background: var(--rdp-social-color, var(--rdp-primary));
	border-color: var(--rdp-social-color, var(--rdp-primary));
	transform: translateY(-3px);
}

/* ---- Header social icons (classic / centered header) ------------------- */
.rdp-social-icons.rdp-social-header {
	gap: 4px;
}
.rdp-social-header .rdp-social-link {
	width: 34px;
	height: 34px;
	border-radius: var(--rdp-radius-sm);
	color: var(--rdp-text-muted);
	opacity: 0.75;
}
.rdp-social-header .rdp-social-link:hover,
.rdp-social-header .rdp-social-link:focus-visible {
	opacity: 1;
}
/* Hide header social on mobile — topbar/footer still show */
@media (max-width: 900px) {
	.rdp-social-icons.rdp-social-header { display: none; }
}

/* ---- Topbar social icons ----------------------------------------------- */
.rdp-topbar-right {
	display: flex;
	align-items: center;
}
.rdp-social-icons.rdp-social-topbar {
	gap: 2px;
}
.rdp-social-topbar .rdp-social-link {
	width: 28px;
	height: 28px;
	border-radius: var(--rdp-radius-sm);
	color: rgba(255, 255, 255, 0.7);
	opacity: 0.85;
}
.rdp-social-topbar .rdp-social-link:hover,
.rdp-social-topbar .rdp-social-link:focus-visible {
	color: #fff;
	opacity: 1;
	background: rgba(255, 255, 255, 0.1);
}

/* ---- Dark mode overrides ----------------------------------------------- */
html.rdp-dark .rdp-social-header .rdp-social-link {
	color: var(--rdp-text-muted);
}
html.rdp-dark .rdp-social-header .rdp-social-link:hover,
html.rdp-dark .rdp-social-header .rdp-social-link:focus-visible {
	color: var(--rdp-social-color, var(--rdp-primary));
}

/* Footer is always dark — dark mode doesn't need extra overrides. */

/* ---- Reduced motion ---------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.rdp-social-link,
	.rdp-social-footer .rdp-social-link {
		transition: none;
		transform: none !important;
	}
}