/**
 * USCR Localization — location chip ([uscr_location]) + service-area line.
 *
 * The chip is a server-rendered token placed in the header Element (below the
 * logo). It is positioned by CSS alone — no JS injection, no measurement, no
 * resize listener. Colors come from CSS variables so the theme can override
 * without editing this file. Defaults suit the site's dark header and gold accent.
 */

.uscr-city-chip[hidden] {
	display: none;
}

/* Two equal columns put the label|name boundary (the colon) at the chip's
   horizontal center. Place the token in a full-width, centered container under
   the logo and the colon stays centered regardless of city-name length. */
.uscr-city-chip {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 0.4em;
	align-items: baseline;
	width: 100%;
	white-space: nowrap;
	font-size: 0.9rem;
	line-height: 1.15;
	letter-spacing: 0.02em;
	color: var( --uscr-chip-color, rgba( 255, 255, 255, 0.7 ) );
}

.uscr-city-chip__label {
	text-align: right;
}

.uscr-city-chip__name {
	text-align: left;
	font-weight: 600;
	color: var( --uscr-chip-name-color, var( --accent, #c8a45c ) );
}

/* Service-area line that replaces the address in the footer — inherit the
   surrounding footer text styling so the columns keep their look. */
.uscr-serving {
	display: inline;
	color: inherit;
	font: inherit;
}

/* General "show only when a city is active" hook. Add class `uscr-only-city` to
   any element (e.g. a header serving line that uses [uscr_city]/[uscr_state]);
   it stays hidden until there is a city — server-side on city pages (body gets
   `uscr-has-city`), or client-side on global pages once localize.js recalls a
   remembered city. Hiding only when NO city preserves the element's own display. */
body:not( .uscr-has-city ) .uscr-only-city {
	display: none !important;
}

/* Footer address: the "Proudly serving {City}" line vs the real HQ address.
   Serving line shows only for a city OUTSIDE the HQ state (non-IL). The real HQ
   address shows when there is no city, OR the city is in the HQ state (Palatine,
   IL — there the HQ address is genuinely local). Hiding via :not() preserves each
   element's own display value. */
body:not( .uscr-has-city ) .uscr-footer-serving,
body.uscr-state-il .uscr-footer-serving {
	display: none !important;
}
body.uscr-has-city:not( .uscr-state-il ) .uscr-footer-hq {
	display: none !important;
}