:root {
	/* custom colors */
	--color-primary-light: hsl(11, 100%, 31%);
	--color-primary-dark: hsl(11, 100%, 75%);
	/* custom theme */
	--vp-c-brand: var(--color-primary-light);

	--vp-button-brand-text: var(--vp-c-bg);
	--vp-button-brand-hover-text: var(--color-primary-light);
	--vp-button-brand-active-text: var(--color-primary-light);
	--vp-button-brand-border: var(--color-primary-light);
	--vp-button-brand-hover-bg: var(--vp-c-bg);
	--vp-button-brand-active-bg: var(--vp-c-bg);
	--vp-button-brand-hover-border: var(--color-primary-light);
	--vp-button-brand-active-border: var(--color-primary-light);

	--vp-custom-block-tip-bg: var(--vp-c-bg);
	--vp-custom-block-danger-bg: var(--vp-c-bg);
	--vp-custom-block-info-bg: var(--vp-c-bg);
	--vp-custom-block-warning-bg: var(--vp-c-bg);
	--vp-custom-block-tip-text: hsl(161, 96%, 20%);
	--vp-custom-block-warning-text: hsl(26, 95%, 29%);
	--vp-custom-block-danger-text: hsl(350, 75%, 38%);

	--vp-code-font-size: 0.9375rem;
}
.dark {
	--vp-c-brand: var(--color-primary-dark);
	--vp-button-brand-hover-text: var(--vp-c-dark);
	--vp-button-brand-active-text: var(--vp-c-dark);
	--vp-button-brand-border: var(--color-primary-dark);
	--vp-button-brand-hover-border: var(--color-primary-dark);
	--vp-button-brand-active-border: var(--color-primary-dark);

	--vp-custom-block-tip-bg: var(--vp-c-bg);
	--vp-custom-block-danger-bg: var(--vp-c-bg);
	--vp-custom-block-info-bg: var(--vp-c-bg);
	--vp-custom-block-warning-bg: var(--vp-c-bg);
	--vp-custom-block-tip-text: hsl(161, 78%, 43%);
	--vp-custom-block-warning-text: hsl(32, 95%, 44%);
	--vp-custom-block-danger-text: hsl(0, 100%, 76%);
}

:where(details summary) {
	cursor: pointer;
}

a:hover {
	text-decoration: underline;
}

.prev-next a:hover {
	text-decoration: none;
}

.VPPage {
	max-inline-size: 70ch;
	margin-inline: auto;
}