/**
 * Owldraft Publisher, wearing the theme's clothes.
 *
 * The theme's one stylesheet for markup the Publisher stack prints rather than
 * the theme. Everything the theme itself draws for the plugin — the header's
 * Sign in / Account link — is styled inline from compat.php beside this file,
 * because it is only ever emitted with the markup it dresses. What lands here is
 * the other case: screens a plugin renders whole, in its own house style, which
 * the theme can only correct after the fact.
 *
 * Loaded from compat.php, and only on a page where the stack is actually present.
 * Nothing in the theme proper refers to it.
 *
 * SECTIONS
 * ------------------------------------------------
 *  B. Owldraft Publisher     - the paywall, the buttons beside it, and the
 *                              magic-link form
 *
 * There used to be a section A, and it was the larger half of this file: a
 * skin for Paid Memberships Pro, which Publisher billed through. Publisher
 * bills through Stripe directly now and PMPro is not part of the stack, so
 * the tokens, the button rules and the card margins that corrected its
 * screens corrected markup this theme can no longer be shown. Deleted rather
 * than left dormant -- it is a WordPress.org theme, and dead selectors for a
 * plugin nothing installs are weight every site downloads.
 */

/* B. OWLDRAFT PUBLISHER
   ================================================
 *
 * The paywall at the foot of a locked post, and the Subscribe / Upgrade button
 * inside it, are the plugin's markup: it prints them itself so that no theme can
 * leak a paid post by getting its template wrong. Left alone they arrive in the
 * plugin's neutral house style - a grey hairline, an off-white panel, a 4px
 * corner - which is a second set of values sitting inside the paper.
 *
 * This is not a restyle. The plugin publishes custom properties
 * for exactly this and asks a theme to set them, so the block below is three of
 * them pointed at the theme's own tokens and nothing else. The corner goes to
 * zero for the panel and the button both: Stoat separates with hairlines and
 * square edges, and --button-radius is not used here because panel and button
 * share the one token and the panel must stay square whatever the customizer
 * does to buttons.
 *
 * The two left alone are --owldraft-accent and its contrast, the button's fill.
 * The plugin's near-black is the one place the paywall is meant to shout, and
 * the theme's navy accent is already the color of every link in the paragraph
 * above it. Point them at var(--accent) / white here if that changes.
 *
 * Doubled :root on purpose: the plugin's defaults are a plain :root, and equal
 * specificity would come down to load order.
 */
:root:root {
	--owldraft-radius: 0;                /* panel and button both, like the theme */
	--owldraft-border: var(--border);    /* the one hairline the whole theme draws */
	--owldraft-surface: var(--bg);       /* the theme boxes on the page's own paper */
}


/* B2. THE MAGIC-LINK FORM
   ------------------------------------------------
 * Sign in, sign up, and the sign-up box on a gated checkout are one piece of
 * markup — .owldraft-publisher-form — printed by the plugin with a small
 * stylesheet of its own: a system font stack, a 24rem measure, a 4px corner,
 * a hairline field and a blue button. On a bare theme that is a working form;
 * inside Stoat it is a second design system on the page, and the sign-in
 * screen is a whole page of it.
 *
 * Unlike the token blocks above there is no API to aim at here, so this is the
 * one place the theme overwrites the plugin's values outright. What it writes
 * are the theme's own controls from style.css section 1.2 — the 48px field on
 * its faint grey fill, and the accent button beside it — so the sign-in screen
 * reads like the comment form and the search box, because it is the same
 * control.
 *
 * Doubled class, for the same reason :root is doubled above: the plugin prints
 * its rules inline in wp_head, after every enqueued stylesheet including this
 * one, so at equal weight it would win on order alone.
 */
.owldraft-publisher-form.owldraft-publisher-form {
	max-width: none;
	font: inherit;
}

.owldraft-publisher-form.owldraft-publisher-form label {
	margin: 0 0 6px;
	font-weight: 600;
}

/* The theme's field: full width, one 48px control height, square, no border —
   the fill is the outline. Repeated rather than inherited because the plugin's
   own rule is more specific than the element selector that would carry it. */
.owldraft-publisher-form.owldraft-publisher-form input[type="text"],
.owldraft-publisher-form.owldraft-publisher-form input[type="email"] {
	width: 100%;
	height: 48px;
	margin: 0 0 16px;
	padding: 0 12px;
	font-family: inherit;
	font-size: inherit;
	color: var(--dark);
	background: rgba(0, 0, 0, .05);
	border: 0;
	border-radius: 0;
}

/* Sign in's one row: the field takes the width, the button ends it. The
   margin under the field is the stacked form's gap between fields, and there is
   no field under this one. Said here as well as in the plugin because the field
   rule above is heavier than the plugin's own row rule. */
.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: stretch;
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-row input[type="email"] {
	flex: 1 1 12rem;
	width: auto;
	margin: 0;
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-row .owldraft-publisher-btn {
	flex: 0 0 auto;
}

.owldraft-publisher-form.owldraft-publisher-form label.owldraft-publisher-check {
	margin: 0 0 16px;
	font-size: inherit;
	font-weight: 400;
}

/* The theme's button, on the plugin's class. The accent rather than the
   paywall's near-black: this one sits in a page of the theme's own text, where
   every other button is the accent, and the paywall panel is the only place
   that shouts. */
.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	margin: 0;
	padding: 0 18px;
	font-family: inherit;
	font-size: inherit;
	color: #fff;
	/* The accent, and the plugin's near-black only if a build of the theme ever
	   ships without one -- never the plugin's blue, which belongs to no palette
	   here. */
	background: var(--accent, #15171a);
	border-radius: var(--button-radius);
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-btn:hover,
.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-btn:focus {
	color: #fff;
	opacity: .85;
}

/* Square, and on the theme's hairline, like every other notice it draws. */
.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-notice {
	background: rgba(0, 0, 0, .04);
	border-left: 3px solid var(--accent);
	border-radius: 0;
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-error {
	border-radius: 0;
}

/* The plan picker on the sign-up page. The plugin draws it with its own
   border, corner and accent; those are the three things the theme has opinions
   about, so those are the three said here — square corners on the theme's
   hairline, and the theme's accent on the chosen row. Everything structural
   about the rows is left to the plugin. */
.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-plan {
	border: 1px solid var(--border, rgba(0, 0, 0, .12));
	border-radius: 0;
	/* A plan row is a <label>, so the rule above that makes every field label
	   600 lands on the whole row and its price and description with it. Only
	   the plan's name is a label here; the rest is prose. */
	font-weight: 400;
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-plan-name {
	font-weight: 600;
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-plan:has(input:checked) {
	border-color: var(--accent, #15171a);
	background: rgba(0, 0, 0, .03);
}

.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-plan:focus-within {
	outline-color: var(--accent, #15171a);
}

/* The picker's own label, in the weight the form's other labels use. */
.owldraft-publisher-form.owldraft-publisher-form .owldraft-publisher-plans legend {
	font-size: inherit;
}

/* There used to be a third block here, an outline treatment for
   .owldraft-publisher-changeplan. Publisher 1.2 drew a gated checkout where
   "Change plan" sat beside "Proceed to checkout", and two filled accent buttons
   on one screen is one button too loud. 1.3 dropped that screen: a paying
   reader now gets the picker itself, and "Change plan" is only the label on its
   single submit — the primary action of the form, and the plugin stopped
   printing the class with the button it belonged to. The rules matched nothing,
   and had they matched they would have been wrong, so they are gone rather than
   retargeted: that submit is a primary button and the filled accent above is
   already the right answer for it. */