/*
 * Decorative dividers and framing (the tiled/contour/ridge patterns were removed) (Butler Brand & Co. Decorative Design
 * Handoff). Shared between the public site and the portal — loaded once
 * from functions.php right after base.css, on every page.
 *
 * Palette: built on the app-* theme.json tokens (Midnight Blue, Brass,
 * Warm Cream, Ivory, Soft Stone). This palette used to be portal-only —
 * see DECISIONS.md for the site-wide unification decision made alongside
 * this pass.
 *
 * Accessibility: every pattern here is a CSS background/mask on a
 * decorative pseudo-element or background-image, never an <img> or inline
 * <svg> in markup — nothing is inserted into the accessibility tree, so
 * there is no separate aria-hidden step needed (unlike a real <svg> element
 * would require). Nothing here animates, so prefers-reduced-motion doesn't
 * apply either. Don't "fix" this later by adding aria-hidden to something
 * that was never in the DOM in the first place.
 */

/* ---- Patterns A-C removed (dots, ridge, contour) -------------------------
 * The tiled dot field, the ridge skyline and the contour lines are gone from
 * the whole site. Page content saved in the database may still carry the old
 * class names, so these two stay as plain flat fills (no pattern) to keep
 * those sections the colour they always were. */
.pattern-dots--on-navy {
	background-color: var(--wp--preset--color--app-navy);
}

.pattern-dots--on-cream {
	background-color: var(--wp--preset--color--app-cream);
}

/* ---- Pattern D: minimal line dividers ----------------------------------- */

.divider-brass {
	width: 64px;
	height: 2px;
	margin: 1.5rem auto;
	background: var(--wp--preset--color--app-brass);
	border: none;
}

/* Same brass rule, left-aligned and sized for sitting above a card
   heading rather than centered between two paragraphs — gives a set of
   otherwise-identical text-only cards (no icon, no number) a visual
   anchor to tell them apart at a glance before reading. */
.card-accent {
	width: 36px;
	height: 2px;
	margin: 0 0 1rem;
	background: var(--wp--preset--color--app-brass);
}

.divider-diamond {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	margin: 1.5rem auto;
	width: 100%;
	max-width: 220px;
}

.divider-diamond::before,
.divider-diamond::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--wp--preset--color--app-brass);
}

.divider-diamond::after {
	order: 3;
}

.divider-diamond-mark {
	display: inline-block;
	width: 6px;
	height: 6px;
	order: 2;
	background: var(--wp--preset--color--app-brass);
	transform: rotate(45deg);
}

/* ---- Pattern E: corner accent / framing detail -------------------------- */

.frame-corner-accent {
	position: relative;
}

.frame-corner-accent::before,
.frame-corner-accent::after {
	content: "";
	position: absolute;
	width: 28px;
	height: 28px;
	pointer-events: none;
	border-color: var(--wp--preset--color--app-brass);
	border-style: solid;
}

.frame-corner-accent::before {
	top: -1px;
	left: -1px;
	border-width: 2px 0 0 2px;
}

.frame-corner-accent::after {
	bottom: -1px;
	right: -1px;
	border-width: 0 2px 2px 0;
}

/* Breathing room for the portal welcome strip (.dash-header), scoped so the
   Property Dashboard's plain .dash-header is unaffected. */
.dash-header--roomy {
	padding: 1.25rem 1.5rem;
	border-radius: 4px;
}
