/*
 * New online portal brand template (online_ordering_design_new = 26).
 *
 * Workflow (same idea as css/online_payment.css):
 * 1. Copy this file to portal_brand_{firm_id}.css
 * 2. Edit colours / fonts / link+focus / optional backgrounds below
 * 3. Send the firm file back to Wildcard to install under ordering/
 *
 * Do not change layout rules in 9998.css — only this brand layer.
 * HSL tokens are space-separated: H S% L% (no commas), e.g. 217 91% 60%.
 */

body.pl-portal {
	/* Font */
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	font-weight: 400;

	/* Colours (HSL tokens) */
	--pl-primary-hsl: 217 91% 60%;
	--pl-bg-hsl: 0 0% 100%;
	--pl-fg-hsl: 222 47% 11%;
	--pl-card-hsl: 0 0% 100%;
	--pl-muted-hsl: 214 32% 91%;
	--pl-muted-fg-hsl: 215 16% 47%;
	--pl-destructive-hsl: 0 84% 60%;
	--pl-success-hsl: 142 76% 36%;
	--pl-warning-hsl: 38 92% 50%;
	--pl-info-hsl: 199 89% 48%;
	--pl-border-hsl: 214 32% 88%;

	/* Card hover accent */
	--pl-hover-card-border: rgba(61, 131, 246, 0.55);
	--pl-hover-card-shadow: 0 11px 26px rgba(61, 131, 246, 0.085);
	--pl-hover-card-title: #5289EB;

	/* Links and keyboard focus (defaults match primary) */
	--pl-link-hsl: 217 91% 60%;
	--pl-focus-hsl: 217 91% 60%;

	/* Login page full-area background (body.pl-portal-login). none = no CSS bg.
	   Side panel image is separate: logos/login_bg_{firm_id}.jpg */
	--pl-login-bg-image: none;

	background: hsl(var(--pl-bg-hsl));
	/* Optional in-portal page background image (uncomment and set URL):
	background-image: url(your-image.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	*/
	color: hsl(var(--pl-fg-hsl));
}

/* Login page only — set --pl-login-bg-image above, e.g. url(logos/my-login.jpg) */
body.pl-portal.pl-portal-login {
	background-image: var(--pl-login-bg-image);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}