/*
Theme Name: Eighty Six Music
Theme URI: https://www.eightysixmusic.co.uk
Author: Eighty Six Music
Description: Custom theme for Eighty Six Music, built for editing with Elementor. Content (artists, events, products, services, hero slides) is managed through custom post types and ACF fields so it can be edited from wp-admin without touching code.
Version: 1.0.0
Requires PHP: 8.0
Text Domain: eightysix
*/

/* All actual styling (Tailwind utilities + brand tokens + animations) ships in
   assets/css/site.css — the exact CSS compiled from the original site's build.
   This file only needs to exist with the header above for WordPress to
   recognize the theme; see inc/theme-setup.php for what gets enqueued. */

/* Fixes a bug in the vendored compiled CSS (assets/css/site.css): the
   source's `@media (prefers-color-scheme: dark) { @theme { ... } }` block for
   --color-ink/--color-paper got flattened into the single base :root rule by
   this Tailwind/Lightning CSS version, instead of staying scoped to dark
   mode — so every utility using --color-ink/--color-paper (bg-paper,
   text-ink, bg-ink/10, etc.) rendered the dark-mode colors unconditionally,
   even in light mode. Restated correctly here, after site.css loads. */
:root, :host {
	--color-ink: #0b0a0d;
	--color-paper: #ffffff;
}

@media (prefers-color-scheme: dark) {
	:root, :host {
		--color-ink: #f3f4f6;
		--color-paper: #121218;
	}
}

/* Native <dialog> has no Tailwind-equivalent reset in the compiled bundle.
   <dialog> defaults to `width: fit-content`, so two dialogs with different
   amounts of content (e.g. the founder's two-paragraph bio vs. an artist's
   empty one) shrink-wrap to different widths even with the same max-width
   utility class — force a real width so max-w-md caps them consistently. */
dialog.modal-dialog {
	width: 100%;
	border: none;
	background: var(--color-paper, #fff);
	color: var(--color-ink, #0b0a0d);
	margin: auto;
}

dialog.modal-dialog::backdrop {
	background: rgba(0, 0, 0, 0.6);
}