/* Your existing styles */
[data-md-color-scheme='default'] {
	--md-primary-fg-color: oklch(70% 0.13 93);
	--md-accent-fg-color: oklch(70% 0.13 93);
}

[data-md-color-scheme='slate'] {
	--md-primary-fg-color: #000000;
	--md-hue: 210;
}

/* ---- Custom Footer link block ---- */

/* The full-width container for the link */
.custom-footer-link-block {
	text-align: center;
	padding: 3rem 1rem;
	margin-top: 2rem;
}

/* Background for the default (light) theme */
[data-md-color-scheme='default'] .custom-footer-link-block {
	background-image: radial-gradient(at center bottom, #f7f3e3, transparent);
}

/* Background for the slate (dark) theme */
[data-md-color-scheme='slate'] .custom-footer-link-block {
	/* A subtle dark gradient that matches the slate theme */
	background-image: radial-gradient(at center bottom, hsl(50, 15%, 15%), transparent);
}

/* The scalable link-button */
.custom-footer-link-button {
	display: inline-block;
	border: 2px solid oklch(70% 0.13 93);
	color: oklch(70% 0.13 93);
	padding: 0.75rem 2rem;
	border-radius: 1.66rem; /* Fully rounded corners */
	font-size: 1.1rem;
	font-weight: 700;
	text-decoration: none;
	transition:
		background-color 0.2s,
		color 0.2s;
}

.custom-footer-link-button:hover {
	background-color: oklch(70% 0.13 93);
	/* Use a theme variable for the text color on hover for perfect contrast */
	color: var(--md-default-bg-color);
}

/* Increase the font-size of the link container. Icons in this theme
   often scale relative to the font size. */
.md-social__link {
	font-size: 1.5rem; /* Adjust this value as needed */
	/* Vertically align the larger icon within the link area */
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Make the SVG icon fill the new container size */
.md-social__link svg {
	max-height: 1.5em; /* Use 'em' to scale with the font-size of the link */
	max-width: 1.5em;
	padding: 0 0.25rem;
}

/* Media query for mobile devices */
@media screen and (max-width: 76.1875em) {
	/* Default MkDocs Material breakpoint */
	.custom-footer-link-button {
		font-size: 1rem; /* Revert to default text size on smaller screens */
		padding: 0.6rem 1.2rem;
	}

	.custom-footer-link-block {
		padding: 1.75rem 1rem;
	}

	/* Center copyright and social links on mobile */
	.md-footer-meta__inner {
		/* The theme default is 'column-reverse' and 'align-items: stretch'.
       We override these to center the content correctly. */
		flex-direction: column;
		align-items: center;
	}

	/* Target the copyright paragraph specifically to ensure it's centered
     and add spacing between it and the social links. */
	.md-copyright {
		margin-top: 0.5rem; /* Add padding to prevent touching the content above */
		text-align: center; /* Force text alignment to center */
	}
}
