docs/src/css/custom.css
/**
 * Any CSS included here will be global. The classic template
 * bundles Infima by default. Infima is a CSS framework designed to
 * work well for content-centric websites.
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600&display=swap');

/* You can override the default Infima variables here. */
:root {
	--ifm-font-family-base:
		'Inter', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
	--ifm-font-family-monospace:
		'JetBrains Mono', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', 'Liberation Mono',
		'Courier New', monospace;

	/* Cute Anime Pink color scheme ✨ */
	--ifm-color-primary: #ec4899;
	--ifm-color-primary-dark: #db2777;
	--ifm-color-primary-darker: #be185d;
	--ifm-color-primary-darkest: #9d174d;
	--ifm-color-primary-light: #f472b6;
	--ifm-color-primary-lighter: #f9a8d4;
	--ifm-color-primary-lightest: #fce7f3;

	/* Better typography */
	--ifm-font-size-base: 16px;
	--ifm-line-height-base: 1.6;
	--ifm-code-font-size: 14px;

	/* Enhanced spacing */
	--ifm-spacing-horizontal: 1.5rem;
	--ifm-spacing-vertical: 1.5rem;

	/* Better code highlighting */
	--docusaurus-highlighted-code-line-bg: rgba(236, 72, 153, 0.1);
}

/* Dark mode colors */
[data-theme='dark'] {
	--ifm-color-primary: #f472b6;
	--ifm-color-primary-dark: #ec4899;
	--ifm-color-primary-darker: #db2777;
	--ifm-color-primary-darkest: #be185d;
	--ifm-color-primary-light: #f9a8d4;
	--ifm-color-primary-lighter: #fce7f3;
	--ifm-color-primary-lightest: #fdf2f8;

	--docusaurus-highlighted-code-line-bg: rgba(244, 114, 182, 0.2);
}

/* Logo styling */
.navbar-logo {
	filter: invert(1);
}

[data-theme='dark'] .navbar-logo {
	filter: none;
}

/* Enhanced headings */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
	letter-spacing: -0.025em;
}

/* Better code blocks */
.prism-code {
	border-radius: 8px;
}

/* Enhanced links */
a {
	font-weight: 500;
}

/* Better tables */
table {
	border-radius: 8px;
	overflow: hidden;
}

th {
	background-color: rgba(236, 72, 153, 0.1);
	font-weight: 600;
}

/* Inline code styling - Custom pink color */
code:not(pre code) {
	background-color: rgba(238, 43, 91, 0.1) !important;
	color: #ee2b5b !important;
	border: 1px solid rgba(238, 43, 91, 0.2);
	border-radius: 4px;
	padding: 1px 5px;
	margin: 0 2px;
	font-weight: 500;
}

/* Dark mode inline code */
[data-theme='dark'] code:not(pre code) {
	background-color: rgba(238, 43, 91, 0.15) !important;
	color: #ff4d7a !important;
	border: 1px solid rgba(238, 43, 91, 0.3);
}
