/*
 * MAF Portal — yearly brand layer. THIS is the file to edit each fair year.
 *
 * It re-declares the Fair Manager plugin's --fm-* brand tokens (the plugin
 * ships neutral defaults) and sets the --fm-portal-* sidebar skin, which the
 * plugin documents as the theme's override API. Printed after the plugin's
 * tokens.css, so these :root definitions win. Never rename a variable.
 *
 * Functional tokens (feedback colours, neutrals, spacing, type scale) stay in
 * the plugin — only re-declare one here if a year's brand really changes it.
 *
 * ---- 2027 brand -----------------------------------------------------------
 * Four values, sampled from the Melbourne Art Fair 2027 brand sheet:
 *
 *   lilac  #b8abff   brown  #382620   black  #000000   white  #ffffff
 *
 * The one rule the palette imposes: WHITE TYPE NEVER SITS ON LILAC (2.05:1).
 * Every lilac fill takes a brown label — that is what --fm-color-on-accent is
 * for. Lilac on brown and brown on lilac are both 6.97:1; lilac on black is
 * 10.2:1; brown on white is 14.3:1.
 *
 * Three faces, three jobs:
 *   heading  din-condensed  every heading, plus the sidebar and header chrome
 *   body     ABC Marfa      body copy, forms, tables, card text
 *   accent   ABC Synt       buttons, menu group headings, the sidebar email,
 *                           date lines and status pills
 *
 * din-condensed holds the heading slot until ABC Montefiore (the brand
 * sheet's actual display face) is licensed for web — at which point only
 * --fm-font-heading below changes.
 */

:root {
	/* ---- Brand colour ------------------------------------------------------ */
	--fm-color-accent: #b8abff;
	/* Buttons invert on hover: the fill becomes brown and the label lilac, so
	   the "hover" slot is the brown, not a lighter lilac. */
	--fm-color-accent-hover: #382620;
	--fm-color-accent-soft: #efecff;
	/* Every label that sits ON a lilac fill. Never white. */
	--fm-color-on-accent: #382620;
	/* The accent as small TEXT on white. #b8abff is a fill colour and manages
	   only 2.05:1 there; this is the same hue darkened to 5.11:1. */
	--fm-color-accent-ink: #6b59de;

	/* ---- Text -------------------------------------------------------------- */
	/* Brown rather than black: warmer, on-palette, and still 14.3:1 on white. */
	--fm-color-ink: #382620;
	--fm-color-text-muted: #6a5d58;
	--fm-color-text-subtle: #8b7d78;
	/* Black is its own value in this palette — sidebar, masthead, footer. */
	--fm-color-dark: #000;

	/* The category badge sits over a featured image, so it takes the one ground that
	 * cuts through any photograph behind it: white, with black text (21:1). It is
	 * deliberately NOT the accent -- the RSVP status pill opposite it on the same
	 * tile keeps the lilac, so the two read as different things at a glance while
	 * sharing one type treatment. */
	--fm-color-badge-bg: #fff;
	--fm-color-badge-fg: var( --fm-color-dark );

	/* ---- Shape --------------------------------------------------------------- *
	 * The single corner radius for the whole portal: buttons, the content
	 * container, program tiles, the sidebar's current item, badges, the RSVP modal
	 * and every form field all read it.
	 *
	 * 0 is the 2027 look: square. The plumbing stays wired so a future brand can
	 * soften the whole portal by changing this one number -- which is the reason it
	 * is a token and not a value repeated across a dozen rules. */
	--fm-radius: 0;

	/* ---- Theme chrome -------------------------------------------------------- *
	 * --maf-* is theme-private: these are NOT part of the plugin's --fm-* contract.
	 *
	 * The footer strip sits directly under the black sidebar, and at pure #000 the
	 * two merged into one continuous black with no seam. This is the midpoint
	 * between that black and the brand brown -- lifted just enough to separate
	 * them (1.15:1), and tinted brown rather than grey so it stays in palette. */
	--maf-footer-bg: #1c1310;

	/* ---- Surfaces ----------------------------------------------------------- */
	/* Zebra rows: the faintest possible lilac wash. Anything stronger and the
	   stripe starts reading as a design element rather than a reading aid. */
	--fm-color-row-alt: #faf9ff;

	/* ---- Neutrals ---------------------------------------------------------- */
	--fm-color-border: #d9d2cf;
	--fm-color-border-soft: #ece7e4;
	--fm-color-neutral: #e5dedb;

	/* ---- RSVP dialog -------------------------------------------------------- *
	 * The brand-brown panel. The dialog is appended to <body>, OUTSIDE #content,
	 * so it cannot read the --fm-portal-* sidebar skin below -- these have to be
	 * :root. On brown: white type is 14.3:1, the lilac add control 6.97:1 and the
	 * remove red 6.27:1, so every one still clears AA. The lilac confirm button
	 * keeps its brown label via --fm-color-on-accent. */
	--fm-modal-bg: var( --fm-color-ink );
	--fm-modal-fg: #fff;
	--fm-modal-muted: rgba( 255, 255, 255, 0.62 );
	--fm-modal-border: var( --fm-color-ink );
	--fm-modal-divider: rgba( 255, 255, 255, 0.16 );
	/* Fields read as outlines on the black, not as inset white boxes. */
	--fm-modal-field-bg: transparent;
	--fm-modal-field-border: rgba( 255, 255, 255, 0.35 );
	/* Add is the affirmative action, so it takes the brand lilac (10.2:1 on
	   black). Remove needs a red that survives a black ground -- the page's
	   #8a1c1c is chosen for white and all but disappears here; this one is
	   9.2:1. */
	--fm-modal-affirm: var( --fm-color-accent );
	--fm-modal-danger: #ff8a80;

	/* ---- Brand type -------------------------------------------------------- */
	/* din-condensed comes from the Adobe Fonts kit (mic1vkv, enqueued in
	   functions.php); Marfa and Synt are self-hosted in assets/fonts via
	   fonts.css. Each stack keeps a real generic fallback. */
	--fm-font-heading: "din-condensed", "Arial Narrow", sans-serif;
	--fm-font-body: "ABC Marfa", "Helvetica Neue", helvetica, arial, sans-serif;
	--fm-font-accent: "ABC Synt", georgia, "Times New Roman", serif;
	/* ---- Layout ------------------------------------------------------------ *
	 * How wide the portal ever gets. Beyond this it is centred and the brown
	 * page ground frames it.
	 *
	 * THREE rules read this and they must not disagree: .site-container (the
	 * masthead and footer's inner frame), .site-footer, and #content. They each
	 * carried their own 1600px, which is exactly the drift that put the main
	 * site's fixed header bar out of step with its wrapper.
	 *
	 * 1920 matches melbourne-art-fair-2027's \-max-width, so the portal and
	 * the public site are framed identically on the same monitor.
	 */
	--site-max-width: 1920px;
}

/* Portal sidebar skin — the plugin's documented theme-override API.
   Black sidebar, white type, lilac box on the hovered and current rows. */
#content {
	--fm-portal-sidebar-bg: #000;
	--fm-portal-sidebar-fg: #fff;
	--fm-portal-sidebar-muted: rgba( 255, 255, 255, 0.62 );
	--fm-portal-sidebar-hover: rgba( 255, 255, 255, 0.14 );
	--fm-portal-sidebar-active-bg: var( --fm-color-accent );
	--fm-portal-sidebar-active-fg: var( --fm-color-on-accent );
	--fm-portal-sidebar-width: 300px;
	--fm-portal-heading: var( --fm-color-ink );
	--fm-portal-content-bg: #fff;
	/* The plugin's viewport-height floor is switched off: theme.css sizes the
	   portal with a flex column instead, which is exactly 100vh minus the
	   masthead and footer rather than an approximation of it. */
	--fm-portal-min-height: 0;
	/* The hero panel behind a page title when the page has no featured image:
	   brown ground, lilac heading — the poster treatment from the brand sheet. */
	--fm-portal-hero-bg: var( --fm-color-ink );
	--fm-portal-hero-fg: var( --fm-color-accent );
}