/*
 * The unified brand identity.
 *
 * Loaded only when Settings → Brand identity is on "Unified brand identity",
 * and only on a page that carries a Tripvance module. It draws nothing of
 * its own. includes/brand.php prints the brand tokens (--wptm-brand-*) on
 * every module root, and this file maps them onto the names each module
 * already reads — the tour page's --wptm-accent, the homepage's --home-cream,
 * the landing page's --wptm-gold, the shared card's --wptm-card-line — so the
 * modules keep drawing themselves exactly as before and only the values
 * change. Nothing here repeats a rule a module stylesheet already has.
 *
 * Everything is under the body class, so a cached copy on a site that has
 * switched back to the original palettes applies nothing.
 */

/* ------------------------------------------------------------------ roots */

.wptm-brand--unified .wptm-tour,
.wptm-brand--unified .wptm-home,
.wptm-brand--unified .wptm-cars,
.wptm-brand--unified .wptm-lp,
.wptm-brand--unified .wptm-hub,
.wptm-brand--unified .wptm-act,
.wptm-brand--unified .wptm-cards {
	/* Colour: one primary, one deep, one paper. The landing, hub and
	   activity modules were built on a navy and a brighter gold; both now
	   read the brand. */
	--wptm-accent: var(--wptm-brand-primary);
	--wptm-accent-dark: var(--wptm-brand-primary-dark);
	--wptm-gold: var(--wptm-brand-primary);
	--wptm-navy: var(--wptm-brand-secondary);
	--wptm-tint: var(--wptm-brand-primary-soft);
	--wptm-cream: var(--wptm-brand-neutral);
	--wptm-line: var(--wptm-brand-line);
	--wptm-hairline: var(--wptm-brand-line);

	/* Shape: one radius scale, one button shape. */
	--wptm-radius-xs: var(--wptm-brand-radius-xs);
	--wptm-radius-sm: var(--wptm-brand-radius-sm);
	--wptm-radius-md: var(--wptm-brand-radius-md);
	--wptm-radius-media: var(--wptm-brand-radius-media);
	--wptm-radius-lg: var(--wptm-brand-radius-lg);
	--wptm-radius: var(--wptm-brand-radius-md);
	--wptm-btn-radius: var(--wptm-brand-btn-radius);

	/* Lift: the same two shadows everywhere, or none. */
	--wptm-shadow-1: var(--wptm-brand-shadow-1);
	--wptm-shadow-2: var(--wptm-brand-shadow-2);

	/* The portable card follows through its own aliases. */
	--wptm-card-accent: var(--wptm-brand-primary);
	--wptm-card-navy: var(--wptm-brand-secondary);
	--wptm-card-line: var(--wptm-brand-line);
	--wptm-card-cream: var(--wptm-brand-neutral);
	--wptm-card-radius: var(--wptm-brand-radius-lg);
}

/* Homepage names. */
.wptm-brand--unified .wptm-home {
	--home-cream: var(--wptm-brand-neutral);
	--home-dark: var(--wptm-brand-secondary);
	--home-line: var(--wptm-brand-line);
	--home-radius: var(--wptm-brand-radius-media);
	--home-btn-radius: var(--wptm-brand-btn-radius);
	--wptm-card-radius: var(--wptm-brand-radius-media);
}

/* Car page names. */
.wptm-brand--unified .wptm-cars {
	--cars-cream: var(--wptm-brand-neutral);
	--cars-night: var(--wptm-brand-secondary);
	--cars-line: var(--wptm-brand-line);
	--cars-tint: var(--wptm-brand-primary-soft);
	--cars-accent-dark: var(--wptm-brand-primary-dark);
	--cars-accent-soft: var(--wptm-brand-primary-soft);
	--cars-radius: var(--wptm-brand-radius-lg);
}

/* Landing, hub and activity pages share one root block in tokens.css. */
.wptm-brand--unified .wptm-lp,
.wptm-brand--unified .wptm-hub,
.wptm-brand--unified .wptm-act {
	--wptm-radius: var(--wptm-brand-radius-lg);
}

/* --------------------------------------------- components with own tokens */

/* The pieces that declare a radius or a paper of their own, deeper than the
   root, are pointed at the brand at the same depth. */
.wptm-brand--unified .wptm-home__section--signature {
	--sig-line: var(--wptm-brand-line);
	--sig-radius: var(--wptm-brand-radius-lg);
}

.wptm-brand--unified .wptm-home__section--featured-spotlight {
	--spot-line: var(--wptm-brand-line);
	--spot-radius: var(--wptm-brand-radius-lg);
	--spot-shadow: var(--wptm-brand-shadow-1);
}

/* Their paper follows the brand on a white section only; on the paper band
   home.css stands them on white, and that must keep winning. */
.wptm-brand--unified .wptm-home__section--signature:not(.wptm-home__section--ground-paper) {
	--sig-paper: var(--wptm-brand-neutral);
}

.wptm-brand--unified .wptm-home__section--featured-spotlight:not(.wptm-home__section--ground-paper) {
	--spot-paper: var(--wptm-brand-neutral);
}

.wptm-brand--unified .wptm-home__section--featured-journey_ticket {
	--ticket-radius: var(--wptm-brand-radius-lg);
	--ticket-line: var(--wptm-brand-line);
	--ticket-stub: var(--wptm-brand-neutral);
	--ticket-shadow: var(--wptm-brand-shadow-1);
}

.wptm-brand--unified .wptm-home__section--gallery-mosaic {
	--mosaic-radius: var(--wptm-brand-radius-media);
	--mosaic-line: var(--wptm-brand-line);
}

.wptm-brand--unified .wptm-home__section--video {
	--home-video-ground: var(--wptm-brand-neutral);
}

.wptm-brand--unified .wptm-salma-design {
	--salma-radius: var(--wptm-brand-radius-media);
}

.wptm-brand--unified .wptm-salma-design .wptm-pass {
	--tk-paper: var(--wptm-brand-neutral);
	--tk-paper-deep: var(--wptm-brand-neutral-deep);
}

/* The Certified Local Guide hero declares its navy, accent, gold and paper
   on its own section; under one identity all four read the brand. The
   WhatsApp button keeps WhatsApp's green — that colour is the glyph's. */
.wptm-brand--unified .wptm-home__hero--style-guide {
	--guide-navy: var(--wptm-brand-secondary);
	--guide-accent: var(--wptm-brand-primary);
	--guide-gold: var(--wptm-brand-primary);
	--guide-paper: var(--wptm-brand-neutral);
	--guide-line: var(--wptm-brand-line);
	--guide-radius: var(--wptm-brand-radius-lg);
	--guide-card-radius: var(--wptm-brand-radius-media);
	--guide-btn-radius: var(--wptm-brand-btn-radius);
	--guide-shadow: var(--wptm-brand-shadow-2);
}

.wptm-brand--unified .wptm-home__hero--style-guide .wptm-home__guidebtn--link {
	box-shadow: var(--wptm-brand-shadow-1);
}

.wptm-brand--unified .wptm-home__guidecard {
	border: var(--wptm-brand-card-border);
	box-shadow: var(--wptm-brand-shadow-1);
}

.wptm-brand--unified .wptm-home__guidename,
.wptm-brand--unified .wptm-home__guidebtn--alt {
	color: var(--wptm-brand-secondary);
}

/* SaraDesign's orange action colour was that layout's own identity; under
   one identity the action is the brand. Its calm price ground stays. */
.wptm-brand--unified .wptm-sara {
	--wptm-sara-cta: var(--wptm-brand-primary);
	--wptm-sara-cta-dark: var(--wptm-brand-primary-dark);
}

/* ------------------------------------------------------------------ cards */

/* The card border is the one thing no module exposes as a token, so the
   card surfaces are named here. Hairline, tinted or none; the shadow
   tokens above decide the lift. */
.wptm-brand--unified .wptm-card__inner,
.wptm-brand--unified .tripvance-display--journey-ticket .wptm-ticket__inner,
.wptm-brand--unified .wptm-home__reviewcard,
.wptm-brand--unified .wptm-home__guides--editorial .wptm-home__guidelink,
.wptm-brand--unified .wptm-cars__vehicleinner,
.wptm-brand--unified .wptm-cars__service,
.wptm-brand--unified .wptm-tour .wptm-card2__link,
.wptm-brand--unified .wptm-info {
	border: var(--wptm-brand-card-border);
}

/* --------------------------------------------------------------- buttons */

/* Every module's button reads --wptm-btn-radius with its own shape as the
   fallback, so the pill, the soft corner and the square arrive through the
   root and nothing is repeated here. The few controls drawn as fixed pills
   for their own reasons — chips, counts, tags — keep them. */

/* ---------------------------------------------------------------- Experium */

/* Brand → Experium (2.9.2). Everything above applies as in Unified mode;
   these are the few places the Experium guide asks for something the
   tokens cannot say. Over a photograph or the dark green, actions and marks
   are desert sand with dark green words (sand on white is never used: it
   reads 2.4:1). */
.wptm-brand--experium :is(.wptm-home__hero--style-image, .wptm-home__hero--style-video, .wptm-home__hero--style-mesh, .wptm-home__hero--style-slider, .wptm-home__section--cta, .wptm-home__section--ground-dark) {
	--wptm-accent: var(--wptm-brand-sand);
	--wptm-accent-dark: var(--wptm-brand-sand-light);
	--wptm-on-accent: var(--wptm-brand-secondary-dark);
}

/* The hero veil is the darker green, so the photographs take the forest
   tone of the logo rather than going grey. */
.wptm-brand--experium .wptm-home__hero--style-slider {
	--wptm-slide-veil: var(--wptm-brand-secondary-dark);
}