/* DIVSA premium component primitives — canonical UI ownership. */
:root{
  --tap-component-radius:18px;
  --tap-dialog-radius:24px;
  --tap-control-h:48px;
}

/* Buttons — Phase 9 canonical ownership.
 * Geometry, paint and interaction for every generic DIVSA button live here.
 * Vertical/page styles may size a local CTA, but must not redefine the global
 * primary/secondary/ghost/soft vocabulary. Visual Editor variables still win
 * through their scoped overrides. */
.tap-app .tap-btn{
  min-block-size:44px;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:var(--tap-btn-radius,12px);
  border:1px solid transparent;
  padding:var(--tap-btn-pad-y,10px) var(--tap-btn-pad-x,16px);
  font:inherit;
  font-weight:var(--tap-btn-weight,750);
  line-height:1.2;
  text-decoration:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:transform var(--dur-fast,.15s) var(--ease-out,ease),box-shadow var(--dur-fast,.15s) var(--ease-out,ease),border-color var(--dur-fast,.15s) var(--ease-out,ease),background-color var(--dur-fast,.15s) var(--ease-out,ease),filter var(--dur-fast,.15s) var(--ease-out,ease);
}
.tap-app .tap-btn:disabled{cursor:not-allowed;opacity:.58;transform:none;box-shadow:none}
.tap-app :is(.tap-btn-primary,.tap-btn-cta,.tap-btn-xl,.tap-btn-gold,.tap-btn-green,.tap-btn-sacred){
  background:var(--tap-cta-bg,var(--tap-primary));
  color:var(--tap-cta-text,var(--tap-on-primary));
  border-color:transparent;
  font-weight:800;
  box-shadow:0 8px 22px color-mix(in srgb,var(--tap-cta-bg,var(--tap-primary)) 20%,transparent);
}
.tap-app :is(.tap-btn-ghost,.tap-btn-secondary){
  background:var(--tap-card);
  color:var(--tap-brand-ink-safe,var(--tap-primary-deep));
  border-color:var(--tap-line);
}
.tap-app .tap-btn-soft{
  background:var(--tap-primary-soft);
  color:var(--tap-brand-ink-safe,var(--tap-primary-deep));
  border-color:color-mix(in srgb,var(--tap-primary) 18%,var(--tap-line));
}
/* WhatsApp keeps its channel colour; the shared system owns geometry only. */
.tap-app .tap-btn-wa{border-radius:var(--tap-btn-radius,12px);font-weight:var(--tap-btn-weight,750)}
.tap-app .tap-btn-block{inline-size:100%}
.tap-app .tap-btn:focus-visible{outline:3px solid var(--tap-focus);outline-offset:2px}
@media(hover:hover) and (pointer:fine){
  .tap-app .tap-btn:not(:disabled):hover{transform:translateY(-1px)}
  .tap-app :is(.tap-btn-primary,.tap-btn-cta,.tap-btn-xl,.tap-btn-gold,.tap-btn-green,.tap-btn-sacred):not(:disabled):hover{filter:brightness(1.05);box-shadow:0 10px 26px color-mix(in srgb,var(--tap-cta-bg,var(--tap-primary)) 24%,transparent)}
}

/* Cards */
.tap-component-card,.tap-app .tap-card{
  box-sizing:border-box;
  min-inline-size:0;
  background:var(--tap-card);
  border:1px solid var(--tap-line);
  border-radius:var(--tap-component-radius);
  box-shadow:var(--tap-shadow-sm);
}

/* Selection cards shared by participation/add-ons/payment choices. */
.tap-component-scope .tap-tier-card,
.tap-component-scope .tap-addon-card,
.tap-component-scope .tap-cst-payment-choice,
.tap-selection-card{
  box-sizing:border-box;
  min-inline-size:0;
  border:1px solid var(--tap-line);
  border-radius:16px;
  background:var(--tap-card);
  transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease;
}
.tap-component-scope .tap-tier-card,
.tap-component-scope .tap-addon-card{padding:14px 15px}
.tap-component-scope .tap-tier-card.is-sel,
.tap-component-scope .tap-addon-card.is-on,
.tap-selection-card[aria-checked="true"]{
  border-color:var(--tap-primary,var(--tap-purple));
  background:var(--tap-primary-soft);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--tap-primary,var(--tap-purple)) 10%,transparent);
}
.tap-component-scope .tap-tiers,
.tap-component-scope .tap-addons-grid{display:grid;grid-template-columns:1fr;gap:10px;min-inline-size:0}
.tap-component-scope .tap-tier-card,.tap-component-scope .tap-addon-card{min-block-size:82px}

/* Canonical dialog / bottom sheet */
html.tap-noscroll,body.tap-dialog-open{overflow:hidden;overscroll-behavior:none}
.tap-dialog-overlay{
  position:fixed;
  inset:0;
  z-index:var(--tap-layer-backdrop);
  display:flex;
  justify-content:center;
  align-items:flex-end;
  background:var(--tap-overlay);
  backdrop-filter:blur(4px);
  opacity:0;
  transition:opacity .18s ease;
}
.tap-dialog-overlay.is-open{opacity:1}
.tap-dialog{
  position:relative;
  z-index:var(--tap-layer-dialog);
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  inline-size:100%;
  max-inline-size:100%;
  max-block-size:min(92dvh,820px);
  margin:0;
  background:var(--tap-card);
  color:var(--tap-ink);
  border-radius:26px 26px 0 0;
  box-shadow:var(--tap-shadow-lg);
  overflow:hidden;
  transform:translateY(18px);
  transition:transform .22s cubic-bezier(.22,1,.36,1);
}
.tap-dialog-overlay.is-open .tap-dialog{transform:translateY(0)}
.tap-dialog-handle{inline-size:44px;block-size:5px;border-radius:99px;background:var(--tap-line);margin:10px auto 4px;flex:none}
.tap-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-inline-size:0;padding:10px 16px 8px;flex:none}
.tap-dialog-title{flex:1 1 auto;min-inline-size:0;overflow-wrap:anywhere;font-family:var(--tap-font-heading);font-size:20px;line-height:1.2;font-weight:700;margin:0;color:var(--tap-ink)}
.tap-dialog-close{display:grid;place-items:center;inline-size:42px;block-size:42px;flex:none;border:0;border-radius:50%;background:var(--tap-surface-2);color:var(--tap-ink);font-size:24px;line-height:1;cursor:pointer}
.tap-dialog-note{margin:0;padding:0 16px 10px;color:var(--tap-muted);font-size:14px;line-height:1.45}
/* `overflow: <x> <y>` — this read `auto hidden`, i.e. scroll sideways, clip
   vertically. It is the scroller for every dialog and bottom sheet, and the
   dialog itself is capped at min(92dvh,820px) with overflow:hidden, so any
   sheet taller than the viewport lost everything below the fold with no way to
   reach it: the add-ons list, the participation tiers, the OTP sheet. The two
   words were simply the wrong way round. */
.tap-dialog-body{min-inline-size:0;min-block-size:0;overflow:hidden auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:4px 16px 10px}
.tap-dialog-footer{display:flex;flex-wrap:wrap;gap:10px;min-inline-size:0;padding:10px 16px calc(16px + env(safe-area-inset-bottom,0px));flex:none;background:var(--tap-card)}
.tap-dialog-footer:empty{display:none}
.tap-dialog-footer>.tap-btn{flex:1 1 180px;min-inline-size:0;min-block-size:52px}
.tap-dialog :where(input,select,textarea){max-inline-size:100%;box-sizing:border-box}
.tap-dialog :where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--tap-focus);outline-offset:2px}

@media(min-width:768px){
  .tap-dialog-overlay{align-items:center;padding:24px}
  .tap-dialog{inline-size:min(760px,calc(100vw - 48px));max-inline-size:760px;max-block-size:min(86dvh,800px);border-radius:var(--tap-dialog-radius);box-shadow:var(--tap-shadow-lg);transform:translateY(8px) scale(.985)}
  .tap-dialog-overlay.is-open .tap-dialog{transform:translateY(0) scale(1)}
  .tap-dialog[data-size="sm"]{max-inline-size:480px}
  .tap-dialog[data-size="lg"]{max-inline-size:900px}
  .tap-dialog-handle{display:none}
  .tap-dialog-header{padding:18px 20px 10px}
  .tap-dialog-title{font-size:22px}
  .tap-dialog-close{inline-size:40px;block-size:40px;font-size:22px}
  .tap-dialog-note{padding:0 20px 12px}
  .tap-dialog-body{padding:4px 20px 12px}
  .tap-dialog-footer{padding:12px 20px 20px}
}
@media(prefers-reduced-motion:reduce){.tap-dialog-overlay,.tap-dialog,.tap-app .tap-btn,.tap-selection-card{transition:none}}

/* Auth content lives inside the canonical dialog; no separate modal geometry. */
.tap-auth-dialog .tap-dialog-body{padding-top:14px}
.tap-auth-dialog .tap-modal-inner{padding:0;min-inline-size:0}
.tap-auth-dialog .tap-modal-inner h3{margin:0 0 8px;font-size:clamp(22px,4vw,26px);line-height:1.2}
.tap-auth-dialog .tap-modal-inner p{color:var(--tap-muted);font-size:14px;line-height:1.5}
.tap-auth-dialog .tap-x{position:absolute;inset-block-start:14px;inset-inline-end:14px;z-index:2;display:grid;place-items:center;inline-size:42px;block-size:42px;border:0;border-radius:50%;background:var(--tap-surface-2);color:var(--tap-ink);font-size:24px;cursor:pointer}
.tap-auth-dialog .tap-modal-grip{inline-size:44px;block-size:5px;margin:0 auto 16px;border-radius:99px;background:var(--tap-line)}
.tap-auth-dialog .tap-input{inline-size:100%;min-block-size:48px;margin-block:6px 12px}
.tap-auth-dialog .tap-guest-note{margin-top:14px}
@media(min-width:768px){.tap-auth-dialog .tap-modal-grip{display:none}.tap-auth-dialog .tap-dialog-body{padding:24px}.tap-auth-dialog .tap-x{inset-block-start:16px;inset-inline-end:16px}}

/* Consultation flows use the canonical dialog as their only geometry owner. */
.tap-consult-dialog .tap-dialog-body{padding:0}
.tap-dialog .tap-cst-sheet{inline-size:100%;max-inline-size:none;max-block-size:none;overflow:visible;border-radius:0;background:transparent;animation:none}
@media(min-width:768px){.tap-dialog .tap-cst-ctas{flex-direction:row}}

/* Canonical button interaction and sizing. */
.tap-app .tap-btn{position:relative;-webkit-tap-highlight-color:transparent}
.tap-app .tap-btn:not(:disabled):active{transform:scale(.98)}
.tap-app .tap-btn-sm{min-block-size:44px;padding:8px 13px;font-size:13px}
.tap-app .tap-btn-xl{min-block-size:54px;padding:14px 22px;font-size:16px}
.tap-app .tap-btn[aria-busy="true"]{cursor:progress;pointer-events:none}
.tap-app .tap-btn[aria-busy="true"]::before{content:"";inline-size:1em;block-size:1em;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:tapComponentSpin .7s linear infinite}
@keyframes tapComponentSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.tap-app .tap-btn[aria-busy="true"]::before{animation-duration:1.4s}}

/* Phase 8 — presentation belongs to CSS, not renderer style attributes. */
.tap-loading-label{margin-block-start:var(--tap-space-3);color:var(--tap-muted);font-size:var(--tap-fs-sm)}
.tap-guest-checkout-intro{margin-block-end:18px;color:var(--tap-muted);font-size:14px;line-height:1.55}
.tap-guest-checkout-saved{margin-block-start:10px;color:var(--tap-muted);font-size:11px;text-align:center}
.tap-auth-dialog .tap-auth-guest-note{margin-block-start:14px;padding-block-start:14px;border-block-start:1px solid var(--tap-line);text-align:center}
.tap-auth-dialog .tap-auth-guest-copy{margin-block-end:6px;color:var(--tap-muted);font-size:12px}
.tap-auth-dialog .tap-auth-filters{padding:0 0 14px}
.tap-auth-dialog .tap-auth-expiry{margin:8px 0 0;color:var(--tap-muted);font-size:13px;text-align:center}
.tap-auth-dialog .tap-auth-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-block-start:10px;text-align:center}
.tap-state-icon{margin-block-end:var(--tap-space-3)}

/* v8.6.29 Bulk Content Studio: public editorial sections used by native place pages. */
.tap-public-content-section{margin-block:clamp(24px,4vw,48px);min-inline-size:0}
.tap-public-content-section>h2{margin:0 0 12px}
.tap-public-content-section :is(p,li){overflow-wrap:anywhere}
.tap-public-content-section .tap-faq-item{border-block-start:1px solid var(--tap-line);padding-block:10px}
.tap-public-content-section .tap-faq-item summary{cursor:pointer;font-weight:700}
.tap-public-content-section .tap-faq-a{padding-block-start:8px;color:var(--tap-muted)}

/* ==========================================================================
   v8.6.29 — vertical listing filters and empty state.

   These are server-rendered: a GET form and a row of links. Nothing here
   needs JavaScript, so the page still filters on a connection too slow to
   load any, which is the whole point of putting it in PHP.
   ========================================================================== */

.tap-vfilter{margin-block:clamp(10px,1.6vw,18px) clamp(12px,1.8vw,22px)}
.tap-vfilter__in{
	display:flex; flex-wrap:wrap; align-items:center;
	gap:clamp(10px,1.4vw,18px);
}

/* Search ------------------------------------------------------------- */
.tap-vfilter__search{flex:1 1 280px; min-inline-size:0}
.tap-vfilter__label{
	position:absolute; inline-size:1px; block-size:1px;
	overflow:hidden; clip-path:inset(50%); white-space:nowrap;
}
.tap-vfilter__field{
	display:flex; align-items:center; gap:8px;
	padding:4px 4px 4px 14px;
	border-radius:var(--tap-radius-pill, 999px);
	background:var(--tap-card, #fff);
	border:1px solid var(--tap-line);
	transition:border-color var(--tap-motion-quick,160ms) var(--tap-ease-standard,ease),
		box-shadow var(--tap-motion-quick,160ms) var(--tap-ease-standard,ease);
}
.tap-vfilter__field:focus-within{
	border-color:var(--tap-primary);
	box-shadow:0 0 0 3px color-mix(in srgb, var(--tap-primary) 16%, transparent);
}
.tap-vfilter__icon{display:grid; place-items:center; flex:0 0 auto; color:var(--tap-muted)}
.tap-vfilter__field input[type="search"]{
	flex:1 1 auto; min-inline-size:0;
	border:0; background:none; outline:none;
	min-block-size:40px; padding:0;
	font-size:15px; color:var(--tap-ink);
	/* Safari draws its own inner control that ignores the pill. */
	-webkit-appearance:none; appearance:none;
}
.tap-vfilter__field input::placeholder{color:var(--tap-muted)}
.tap-vfilter__go{
	flex:0 0 auto; min-block-size:40px; padding:0 18px;
	border:0; border-radius:var(--tap-radius-pill, 999px); cursor:pointer;
	font:700 14px/1 var(--tap-font-body);
	color:var(--tap-cta-text, #fff); background:var(--tap-cta, var(--tap-primary));
}
.tap-vfilter__go:hover{filter:brightness(.95)}
.tap-vfilter__go:focus-visible{outline:2px solid var(--tap-primary); outline-offset:2px}

/* Category chips ------------------------------------------------------ */
.tap-vfilter__chips{
	flex:1 1 100%;
	display:flex; flex-wrap:wrap; gap:8px;
}
.tap-vchip{
	display:inline-flex; align-items:center;
	min-block-size:38px; padding:0 16px;
	border-radius:var(--tap-radius-pill, 999px);
	border:1px solid var(--tap-line);
	background:var(--tap-card, #fff);
	color:var(--tap-ink); text-decoration:none;
	font:600 13.5px/1 var(--tap-font-body);
	white-space:nowrap;
	transition:border-color var(--tap-motion-quick,160ms) var(--tap-ease-standard,ease),
		background var(--tap-motion-quick,160ms) var(--tap-ease-standard,ease),
		color var(--tap-motion-quick,160ms) var(--tap-ease-standard,ease);
}
.tap-vchip:hover{border-color:var(--tap-primary); color:var(--tap-primary)}
.tap-vchip:focus-visible{outline:2px solid var(--tap-primary); outline-offset:2px}
.tap-vchip.is-on{
	border-color:transparent;
	background:var(--tap-primary);
	color:#fff;
}

/* Result meta --------------------------------------------------------- */
.tap-vfilter__meta{
	flex:1 1 100%; margin:0;
	display:flex; align-items:center; gap:12px; flex-wrap:wrap;
	color:var(--tap-muted); font-size:13px;
}
.tap-vfilter__clear{color:var(--tap-primary); font-weight:600; text-decoration:none}
.tap-vfilter__clear:hover{text-decoration:underline}

/* Empty state --------------------------------------------------------- */
.tap-root.tap-vertical-empty{margin-block:clamp(16px,2.4vw,32px)}
.tap-root.tap-vertical-empty .tap-vertical-empty__card{
	display:flex; flex-direction:column; align-items:center; text-align:center;
	gap:10px;
	padding:clamp(28px,4vw,52px) clamp(20px,3vw,40px);
	border-radius:var(--tap-radius-lg, 20px);
	border:1px solid var(--tap-line);
	background:
		radial-gradient(90% 120% at 50% -20%, color-mix(in srgb, var(--tap-marigold) 10%, transparent) 0%, transparent 62%),
		var(--tap-card, #fff);
}
.tap-root.tap-vertical-empty .tap-vertical-empty__icon{
	display:grid; place-items:center;
	inline-size:62px; block-size:62px; border-radius:50%;
	color:var(--tap-marigold);
	background:color-mix(in srgb, var(--tap-marigold) 13%, transparent);
}
.tap-root.tap-vertical-empty .tap-vertical-empty__card h2{
	margin:6px 0 0; color:var(--tap-ink);
	font:700 clamp(19px,2vw,25px)/1.25 var(--tap-font-display, var(--tap-font-body));
}
.tap-root.tap-vertical-empty .tap-vertical-empty__card p{
	margin:0; color:var(--tap-muted);
	font-size:14.5px; line-height:1.6; max-inline-size:46ch;
}
.tap-root.tap-vertical-empty .tap-vertical-empty__links{
	display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
	margin-block-start:8px;
}
.tap-root.tap-vertical-empty .tap-vertical-empty__link{
	display:inline-flex; align-items:center;
	min-block-size:44px; padding:0 20px;
	border-radius:var(--tap-radius-pill, 999px);
	border:1px solid var(--tap-line);
	background:var(--tap-card, #fff); color:var(--tap-ink);
	text-decoration:none; font:600 14px/1 var(--tap-font-body);
}
.tap-root.tap-vertical-empty .tap-vertical-empty__link:hover{border-color:var(--tap-primary); color:var(--tap-primary)}
.tap-root.tap-vertical-empty .tap-vertical-empty__link:focus-visible{outline:2px solid var(--tap-primary); outline-offset:2px}
.tap-root.tap-vertical-empty .tap-vertical-empty__link.is-primary{
	border-color:transparent; color:var(--tap-cta-text, #fff);
	background:var(--tap-cta, var(--tap-primary));
}
.tap-root.tap-vertical-empty .tap-vertical-empty__link.is-primary:hover{color:var(--tap-cta-text, #fff); filter:brightness(.95)}

@media (max-width:767.98px){
	.tap-vfilter__in{gap:10px}
	.tap-vfilter__search{flex:1 1 100%}
	/*
	 * The chip row scrolls sideways instead of stacking into four rows that
	 * push the first card below the fold on a phone.
	 */
	.tap-vfilter__chips{
		flex-wrap:nowrap;
		overflow-x:auto; overflow-y:hidden;
		scrollbar-width:none;
		-webkit-overflow-scrolling:touch;
		scroll-snap-type:x proximity;
		/* Bleed to the screen edge so the row reads as scrollable. */
		margin-inline:calc(var(--tap-page-gutter, 16px) * -1);
		padding-inline:var(--tap-page-gutter, 16px);
	}
	.tap-vfilter__chips::-webkit-scrollbar{display:none}
	.tap-vchip{flex:0 0 auto; scroll-snap-align:start}
}

@media (prefers-reduced-motion: reduce){
	.tap-vfilter__field,.tap-vchip{transition:none}
}

/* ==========================================================================
   v8.6.29 — touch-target and legibility corrections (audited 2026-08-28).

   Measured live at 375px and 1425px on every page. Each rule below fixes a
   control the audit found under the 44px comfortable-touch size, or text
   below the 11px readable floor. Sizes grow through padding and min-size, so
   nothing here changes where an element sits or how the row wraps.
   ========================================================================== */

/* Footer link columns.
   Measured 18px tall on desktop and 32px on mobile — the links were sized by
   their line-height alone, so a whole column of destinations was a stack of
   near-unmissable-width, easily-missable-height targets. */
.tap-chrome-footer-links-grid .tap-builder-link a,
.tap-chrome-footer [data-tap-builder-row="legal"] a{
	display:inline-flex; align-items:center;
	min-block-size:44px;
	/* No inline padding: the column is left-aligned and padding would break
	   the optical alignment with its heading. */
}
/* The column heading is not a link and must not gain a 44px box. */
.tap-chrome-footer [data-tap-builder-id^="footer-heading-"] .tap-builder-text{
	min-block-size:0;
}
/* Tighten the gap so taller rows do not stretch the footer: the target grows
   into the space the gap used to provide. */
.tap-chrome-footer-links-grid .tap-builder-row-in{gap:0}

/* The wordmark. 26–30px tall in both header and footer; the link box now
   covers the full comfortable height without moving the artwork. */
.tap-chrome-brand{min-block-size:44px; display:inline-flex; align-items:center}

/* Catalogue filter chips: 38px measured, 44px is the target. */
.tap-vchip{min-block-size:44px}
.tap-vfilter__field{min-block-size:48px}

/* "SOON" badge measured 9.5px — below the readable floor, and it carries
   real information (the service cannot be booked yet). */
.tap-chrome-menu-soon{font-size:11px}

/* Wishlist heart measured 38×44: square it off. */
.tap-fcard-heart{min-inline-size:44px}

@media (max-width:767.98px){
	/* Same rules apply, but the mobile footer sets its own 32px floor. */
	.tap-chrome-footer-links-grid .tap-builder-link a{min-block-size:44px}
	.tap-chrome-footer-links-grid .tap-builder-row-in{gap:0}
}

/* ==========================================================================
   v8.6.29 — the filter bar becomes multi-facet.

   It used to be one anonymous row of chips built from the single grouping
   taxonomy, so Chadhava and Personal Pooja — which group by a meta field —
   got no chips at all, and Pooja could only be narrowed by deity. Each
   dimension now gets a labelled rail of its own, and every dimension is a
   field the operator already maintains.
   ========================================================================== */

.tap-vfilter__in{align-items:stretch}

/* One facet = a quiet label plus its own chip rail. Stacking labelled rails
   is what makes several dimensions legible; an unlabelled wall of chips from
   three different dimensions is not a filter, it is a word cloud. */
.tap-vfilter__facet{
	flex:1 1 100%;
	display:flex; align-items:center;
	gap:12px; min-inline-size:0;
}
.tap-vfilter__facet-label{
	flex:0 0 auto;
	font:700 11.5px/1 var(--tap-font-body);
	letter-spacing:.09em; text-transform:uppercase;
	color:var(--tap-muted);
	/* A fixed measure so several rails line up down the left edge. */
	inline-size:66px;
}

/* Quick flags sit above the facets and read as a state, not a category. */
.tap-vfilter__quick{flex:1 1 100%; display:flex; flex-wrap:wrap; gap:8px}
.tap-vchip--flag{gap:8px}
.tap-vchip__dot{
	inline-size:7px; block-size:7px; border-radius:50%;
	background:var(--tap-ok, #42D674);
	box-shadow:0 0 0 3px color-mix(in srgb, var(--tap-ok, #42D674) 22%, transparent);
	flex:0 0 auto;
}
.tap-vchip--flag.is-on .tap-vchip__dot{
	background:#fff;
	box-shadow:0 0 0 3px color-mix(in srgb, #fff 34%, transparent);
}

@media (max-width:767.98px){
	.tap-vfilter__facet{
		/* Label above its rail: 66px of label beside a scrolling rail costs a
		   fifth of a phone screen for a word. */
		flex-direction:column; align-items:flex-start; gap:7px;
	}
	.tap-vfilter__facet-label{inline-size:auto}
	.tap-vfilter__facet .tap-vfilter__chips{inline-size:100%}
}

@media (min-width:768px){
	/* On a wide screen the rails wrap rather than scroll — a hidden chip on a
	   pointer device is a chip nobody finds. */
	.tap-vfilter__facet .tap-vfilter__chips{flex-wrap:wrap; overflow:visible}
}