/*
Theme Name: 	Marginalia
Theme URI: 		https://newlocalmedia.com
Description: 	This is a custom child theme for Mike McAlister's Ollie theme.
Author: 		Dan Knauss
Author URI: 	https://dan.knauss.ca
Template:     	ollie
Version:		1.0.0
License:      	GNU General Public License v3 or later
License URI:  	https://www.gnu.org/licenses/gpl-3.0.html
Tags:         	blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, block-patterns, block-styles, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, rtl-language-support, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Text Domain: 	ollie-child
*/

/**
 * Graph-paper background pattern.
 *
 * Layered CSS gradients (two linear for the grid lines, one radial for the
 * intersection dots). Colors are tied to Ollie's "Contrast Accent" /
 * "Base Accent" presets so the pattern tracks the active palette. Kept in
 * style.css rather than theme.json because theme.json's background support
 * only models a single image/gradient layer, not a multi-layer
 * background-image with independent background-size values.
 *
 * Variables live on :root so both `body` (page margins/gaps) and the
 * tertiary-tinted "canvas" sections (the off-white wrappers Ollie uses for
 * main content areas) can share the exact same pattern. Solid white cards
 * and the dark footer are left untouched for contrast/readability.
 */
:root {
	--graph-grid-color: color-mix(in srgb, var(--wp--preset--color--main-accent, #d4d4ec) 14%, transparent);
	--graph-dot-color: color-mix(in srgb, var(--wp--preset--color--secondary, #545473) 30%, transparent);
	--graph-size: 24px;
	--graph-paper-image:
		linear-gradient(to right, var(--graph-grid-color) 1px, transparent 1px),
		linear-gradient(to bottom, var(--graph-grid-color) 1px, transparent 1px),
		/* Anchored at the tile's top-left corner (not centered) so each dot
		   falls exactly on a grid-line intersection: the circle's quarters
		   from four neighboring tiles combine into a full dot there. */
		radial-gradient(circle at 0 0, var(--graph-dot-color) 1.5px, transparent 1.5px);
}

body {
	background-color: var(--wp--preset--color--base, #fff);
	background-image: var(--graph-paper-image);
	background-size: var(--graph-size) var(--graph-size);
	background-position: 0 0;
}

/* Ollie's "off-white canvas" sections — e.g. the main content wrapper
   behind the post feed — keep their tertiary fill and layer the same
   pattern on top so it's actually visible within the page, not just in
   the margins around it. */
.has-tertiary-background-color.has-background {
	background-image: var(--graph-paper-image);
	background-size: var(--graph-size) var(--graph-size);
	background-position: 0 0;
}

/* Keep the editorial mark crisp and aligned with the site name. */
.marginalia-brand .wp-block-site-logo,
.marginalia-brand .wp-block-site-logo a {
	display: flex;
	flex-shrink: 0;
}

.marginalia-brand .custom-logo {
	display: block;
	height: 44px;
	width: 44px;
}

.marginalia-brand .marginalia-wordmark {
	font-size: 19.6px;
	margin-inline-start: -8px;
	margin-block: 0;
}

.marginalia-wordmark a {
	text-decoration: none;
}