/**
 * dock.css — the floating consultation dock.
 *
 * A white pill fixed in the bottom-inline-start corner: a headset tile, the
 * word "კონსულტაცია", a live-status dot, and the messenger channels as round
 * brand buttons. Pressing it opens a panel with every channel named, the hours
 * in words, and the phone number with a copy control. On a phone it is a 52px
 * FAB and a bottom sheet instead.
 *
 * WHY BOTTOM-LEFT AND NOT BOTTOM-RIGHT, which is where every support widget on
 * the internet lives. Two files already own that corner: toast.css puts the
 * notification stack there on desktop, and product.css puts the sticky buy rail
 * there on every product page. A permanent object in that column would sit on
 * top of both — over the thing that confirms an add to cart, and over the
 * button that causes it. The dock moves; the revenue surface does not.
 *
 * On MOBILE it flips to the right, and that is safe rather than inconsistent:
 * toast.css moves the toast stack to the TOP of the viewport under 48em, so the
 * thumb corner is free, and the thumb corner is where a one-handed reach lands.
 *
 * IT IS NOT GLASS. The three licensed blurs in this theme are the toast, the
 * page veil and the scrolled header. The dock sits on a white page over white
 * cards, and a frosted sheet over white is simply a grey sheet — a hairline and
 * a soft long shadow separate it more cleanly at a quarter of the paint cost.
 *
 * @package Bedi\Theme
 */

/* =========================================================================
 * 0. TOKENS
 * ====================================================================== */

.bedi-dock {
	/*
	 * THE ONLY NON-SYSTEM COLOURS IN THIS THEME OUTSIDE THE PAYMENT MARKS, and
	 * they are here for the same reason those are: a messenger's brand colour
	 * is wayfinding. A visitor finds WhatsApp by looking for green, exactly as
	 * they find their card by looking for the Visa blue in the footer strip.
	 *
	 * Nothing else in this file may use them. They are not a palette.
	 */
	--bedi-ch-whatsapp: #25D366;
	--bedi-ch-telegram: #229ED9;
	--bedi-ch-messenger: #0084FF;

	/* The live dot. Red because the client's reference is red and because
	   red-means-live is the broadcast convention every visitor already reads
	   fluently. See section 3 for what makes it true rather than decorative. */
	--bedi-dock-live: #E5484D;
	--bedi-dock-idle: var(--bedi-rule-strong);
}

/* =========================================================================
 * 1. THE ROOT
 * ====================================================================== */

.bedi-dock {
	inset-block-end: calc(var(--bedi-dock-offset, var(--bedi-space-md)) + env(safe-area-inset-bottom, 0px));
	inset-inline-start: var(--bedi-space-md);
	/*
	 * Below the header (100), so a floating widget can never cover the
	 * category mega-panel; above the rail lift (70), so it is never buried by
	 * page furniture.
	 */
	z-index: var(--bedi-z-dock, 80);
	position: fixed;

	/*
	 * NOTHING ELSE MAY REPOSITION THE DOCK. A page with a sticky bottom bar
	 * raises --bedi-dock-offset and the dock follows; there is no per-page
	 * override, no !important, and no second placement rule. One variable is
	 * the whole contract.
	 */
}

/*
 * Hidden until dock.js mounts. The markup is in the footer of every page, and
 * a support widget that flashes into place before its own script can tell it
 * whether the shop is open would show a red "we are online" dot at 3am.
 */
.bedi-dock:not(.is-ready) {
	opacity: 0;
	pointer-events: none;
}

.bedi-dock.is-ready {
	opacity: 1;
	transition:
		opacity var(--bedi-dur) var(--bedi-ease-in),
		transform var(--bedi-dur) var(--bedi-ease-in);
}

@media (min-width: 64em) {
	.bedi-dock { inset-inline-start: var(--bedi-space-lg); }
}

/*
 * THE TUCK. After a period without interaction the pill COLLAPSES to its
 * 56px headset tile — it does not slide off the edge.
 *
 * Sliding was the obvious implementation and it is wrong here, specifically
 * because this dock is anchored bottom-inline-START. Translating a
 * left-anchored bar towards the edge pushes its leading element — the headset
 * tile, the one thing that says what the control is — off screen first, and
 * leaves the trailing element visible instead. On a right-anchored widget the
 * same transform does the opposite and looks correct, which is exactly why the
 * mistake survives a quick look.
 *
 * Collapsing keeps the identity and loses the bulk, which was the whole point
 * of tucking.
 *
 * WHY --bedi-dock-w EXISTS. A width transition needs a definite value at BOTH
 * ends; `auto`, `max-content` and `fit-content` all animate to nothing.
 * dock.js measures the bar once it has laid out and writes the pixel value
 * here, re-measuring on resize. Without the script the property is unset, the
 * fallback `auto` applies, and the bar simply never tucks — which is the
 * correct no-JS behaviour, because nothing has hidden anything.
 */
.bedi-dock__bar {
	inline-size: var(--bedi-dock-w, auto);
	/*
	 * `clip` WITH A MARGIN, NOT `hidden`.
	 *
	 * The clipping itself is load-bearing: the label has to be cut off as the
	 * bar collapses, or it spills out of a box that is already too small for
	 * it. But .bedi-dock__live is pinned to the avatar's bottom-inline-end
	 * corner and carries a 2px keyline ring, so it sits a couple of pixels
	 * outside the tile — and the tile sits against the bar's padding edge. The
	 * status dot, the one thing in here that says whether anybody is actually
	 * there, was having its ring shaved off on the side nearest the edge.
	 *
	 * overflow-clip-margin pushes the clip rectangle out far enough for the
	 * ring to paint and nowhere near far enough for the label to escape.
	 */
	overflow: clip;
	overflow-clip-margin: 6px;
	transition:
		inline-size var(--bedi-dur-lg) var(--bedi-ease-in),
		padding-inline var(--bedi-dur-lg) var(--bedi-ease-in),
		box-shadow var(--bedi-dur) var(--bedi-ease-out);
}

.bedi-dock.is-tucked .bedi-dock__bar {
	inline-size: 56px;
	padding-inline: 8px;
}

.bedi-dock.is-tucked .bedi-dock__label,
.bedi-dock.is-tucked .bedi-dock__rule,
.bedi-dock.is-tucked .bedi-dock__channels {
	opacity: 0;
	/* The fade has to finish before the width does, or the label is still
	   painting while the box it lives in is already too small for it. */
	transition-duration: var(--bedi-dur-micro);
}

/* =========================================================================
 * 2. THE BAR
 * ====================================================================== */

.bedi-dock__bar {
	align-items: center;
	background-color: var(--bedi-surface);
	block-size: 56px;
	border: var(--bedi-border-width) solid var(--bedi-rule);
	border-radius: var(--bedi-radius-pill);
	box-shadow: var(--bedi-shadow-1), 0 12px 32px -12px rgba(37, 37, 49, 0.28);
	column-gap: var(--bedi-space-xs);
	display: flex;
	/* 8px at the start so the 40px tile is optically inset inside 56px; 12px at
	   the end so the last channel circle is not crowded by the radius. */
	padding-inline: 8px 12px;
}

.bedi-dock__label,
.bedi-dock__rule,
.bedi-dock__channels {
	transition: opacity var(--bedi-dur) var(--bedi-ease-in);
}

/* Prints only when there are two or more channels to separate. */
.bedi-dock__rule {
	background-color: var(--bedi-rule);
	block-size: 24px;
	flex: 0 0 auto;
	inline-size: 1px;
	margin-inline: 4px;
}

/* =========================================================================
 * 3. THE TOGGLE — tile, label, live dot
 * ====================================================================== */

.bedi-dock__toggle {
	align-items: center;
	appearance: none;
	/* Same reason as the label: the toggle must hold its size while the bar
	   shrinks around it, so the tile never squashes. */
	flex: 0 0 auto;
	background: none;
	border: 0;
	/* Pill, so the focus ring hugs the control rather than drawing a rectangle
	   around a round tile. */
	border-radius: var(--bedi-radius-pill);
	color: inherit;
	column-gap: var(--bedi-space-2xs);
	cursor: pointer;
	display: flex;
	font: inherit;
	margin: 0;
	padding: 0;
}

.bedi-dock__toggle:focus-visible {
	outline: 3px solid var(--bedi-accent);
	outline-offset: 3px;
}

/*
 * The theme's ONE tinted surface, and it earns its place here for the same
 * reason it earns it on the buy rail: it marks the element in the composition
 * that is a well rather than a card.
 */
.bedi-dock__tile {
	background-color: var(--bedi-bg-2);
	block-size: 40px;
	/* Positioning context for the status badge below. */
	position: relative;
	border-radius: var(--bedi-radius-round);
	color: var(--bedi-accent);
	display: grid;
	flex: 0 0 auto;
	inline-size: 40px;
	place-items: center;
	transition: background-color var(--bedi-dur-micro) var(--bedi-ease-out);
}

.bedi-dock__toggle:hover .bedi-dock__tile {
	background-color: var(--bedi-accent);
	color: var(--bedi-on-accent);
}

/*
 * The mic boom nudges down and back as if being pulled into place. One 14px
 * path rotating 8 degrees — the whole gesture, and the reason the tile does not
 * need to bounce, glow or pulse to feel answered.
 */
.bedi-dock__boom {
	transform-origin: 14px 15px;
	transition: transform var(--bedi-dur) var(--bedi-ease-in);
}

.bedi-dock__toggle:hover .bedi-dock__boom {
	transform: rotate(8deg);
}

.bedi-dock__label {
	/* flex: 0 0 auto keeps the label from being squeezed as the bar collapses —
	   without it the Georgian text reflows to two lines mid-transition and the
	   bar's HEIGHT jumps while its width is still animating. */
	color: var(--bedi-ink);
	flex: 0 0 auto;
	font-size: var(--bedi-text-base);
	font-weight: var(--bedi-weight-medium);
	line-height: 1.2;
	/* Georgian does not hyphenate; the label must never be the thing that
	   wraps. If it ever overruns, cap THIS and nothing else. */
	max-inline-size: 140px;
	text-align: start;
	white-space: nowrap;
}

/*
 * :not([hidden]) IS LOAD-BEARING.
 *
 * dock.php renders this line with the `hidden` attribute and dock.js removes it
 * only when the shop is closed — "დაგვიტოვეთ შეტყობინება" is the out-of-hours
 * message. `display: block` in an author stylesheet beats the user agent's
 * `[hidden] { display: none }`, so the closed-hours line was showing on every
 * page at every hour, including while the shop was open.
 *
 * Scoped rather than fixed with a global `[hidden] { display: none !important }`
 * because this theme has a component that deliberately overrides [hidden] —
 * .bedi-auth__panel keeps `display: block` with `visibility: hidden` so the
 * panel holds its grid cell — and a blanket rule would break it.
 */
.bedi-dock__label-sub:not([hidden]) {
	color: var(--bedi-ink-muted);
	display: block;
	font-size: var(--bedi-text-xs);
	font-weight: var(--bedi-weight-regular);
	line-height: 1.2;
	margin-block-start: 1px;
}

/*
 * THE DOT IS MADE TRUE RATHER THAN DECORATIVE. Red only inside operating
 * hours; grey and un-pinged outside them. Two states, no third — a shop that
 * closes at 19:00 does not need an 18:45 "closing soon" state, it needs a
 * correct 19:01 state.
 *
 * The white keyline is what lets the dot survive sitting against the bar's
 * hairline and, on mobile, overlapping the FAB's own edge.
 */
.bedi-dock__live {
	background-color: var(--bedi-dock-live);
	block-size: 10px;
	border-radius: var(--bedi-radius-round);
	/* The keyline is what separates it from the tile it now sits on. */
	box-shadow: 0 0 0 2px var(--bedi-surface);
	inline-size: 10px;
	/* Pinned to the avatar's lower-inline-end corner, riding the edge so it
	   reads as attached to it rather than floating beside it. */
	inset-block-end: 0;
	inset-inline-end: 0;
	position: absolute;
}

.bedi-dock__live::after {
	animation: bedi-dock-ping 2600ms var(--bedi-ease-out) infinite;
	background-color: var(--bedi-dock-live);
	border-radius: inherit;
	content: "";
	inset: 0;
	position: absolute;
}

@keyframes bedi-dock-ping {
	0%   { opacity: 0.55; transform: scale(1); }
	70%  { opacity: 0; transform: scale(2.6); }
	100% { opacity: 0; transform: scale(2.6); }
}

.bedi-dock.is-offline .bedi-dock__live {
	background-color: var(--bedi-dock-idle);
}

.bedi-dock.is-offline .bedi-dock__live::after {
	display: none;
}

/* =========================================================================
 * 4. THE CHANNELS
 * ====================================================================== */

.bedi-dock__channels {
	align-items: center;
	/* Fixed in BOTH states. The fan-out animates each circle's own transform,
	   never the gap — animating a gap reflows the row and drags the pill's
	   width with it. */
	column-gap: var(--bedi-space-2xs);
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bedi-dock__channel {
	block-size: 40px;
	border-radius: var(--bedi-radius-round);
	color: var(--bedi-on-accent);
	display: grid;
	flex: 0 0 auto;
	inline-size: 40px;
	place-items: center;
	position: relative;
	text-decoration: none;
	transition: transform var(--bedi-dur) var(--bedi-ease-in);
}

/* Flat fill. No gradient, no inset highlight, no bevel, no ring — a flat disc
   is enough when the glyph is right. */
.bedi-dock__channel--whatsapp  { background-color: var(--bedi-ch-whatsapp); }
.bedi-dock__channel--telegram  { background-color: var(--bedi-ch-telegram); }
.bedi-dock__channel--messenger { background-color: var(--bedi-ch-messenger); }

.bedi-dock__channel:hover { transform: translateY(-3px); }
.bedi-dock__channel:active { transform: translateY(-1px) scale(0.96); }

.bedi-dock__channel:focus-visible {
	outline: 3px solid var(--bedi-navy);
	outline-offset: 3px;
}

/* Optically centred, not geometrically: the paper plane's visual mass sits
   below and right of its bounding box. Do not "fix" this. */
.bedi-dock__channel--telegram svg { transform: translate(-0.5px, 0.5px); }

.bedi-dock__tip {
	background-color: var(--bedi-navy);
	border-radius: var(--bedi-radius-md);
	color: var(--bedi-ink-inverse);
	font-size: var(--bedi-text-xs);
	font-weight: var(--bedi-weight-regular);
	inset-block-end: calc(100% + 8px);
	inset-inline-start: 50%;
	opacity: 0;
	padding: 4px 8px;
	pointer-events: none;
	position: absolute;
	transform: translate(-50%, 4px);
	transition:
		opacity var(--bedi-dur-micro) var(--bedi-ease-out),
		transform var(--bedi-dur-micro) var(--bedi-ease-out);
	white-space: nowrap;
}

.bedi-dock__channel:hover .bedi-dock__tip,
.bedi-dock__channel:focus-visible .bedi-dock__tip {
	opacity: 1;
	transform: translate(-50%, 0);
}

/* =========================================================================
 * 5. THE PANEL
 * ====================================================================== */

.bedi-dock__panel {
	background-color: var(--bedi-surface);
	border: var(--bedi-border-width) solid var(--bedi-rule);
	border-radius: var(--bedi-radius-xl);
	box-shadow: var(--bedi-shadow-1), 0 24px 60px -20px rgba(37, 37, 49, 0.35);
	inline-size: 320px;
	inset-block-end: calc(100% + var(--bedi-space-xs));
	inset-inline-start: 0;
	max-inline-size: calc(100vw - var(--bedi-space-lg));
	padding: var(--bedi-space-sm);
	position: absolute;
	transform-origin: bottom left;
	z-index: var(--bedi-z-dock-panel, 195);
}

/*
 * `hidden` does the hiding, so the panel is genuinely out of the accessibility
 * tree and out of the tab order when shut. The animation is on the way IN
 * only — dock.js removes the attribute, then stamps the class on the next
 * frame.
 */
.bedi-dock__panel[hidden] { display: none; }

.bedi-dock__panel.is-in {
	animation: bedi-dock-rise 220ms var(--bedi-ease-in) 1;
}

@keyframes bedi-dock-rise {
	from { opacity: 0; transform: translateY(8px) scale(0.98); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.bedi-dock__title {
	color: var(--bedi-ink);
	font-family: var(--bedi-font-display);
	font-size: var(--bedi-text-lg);
	font-weight: var(--bedi-weight-bold);
	margin: 0;
}

.bedi-dock__hours {
	align-items: center;
	color: var(--bedi-ink-muted);
	column-gap: 6px;
	display: flex;
	font-size: var(--bedi-text-sm);
	margin: 2px 0 var(--bedi-space-xs);
}

.bedi-dock__hours-dot {
	background-color: var(--bedi-dock-live);
	block-size: 6px;
	border-radius: var(--bedi-radius-round);
	flex: 0 0 auto;
	inline-size: 6px;
}

.bedi-dock.is-offline .bedi-dock__hours-dot { background-color: var(--bedi-dock-idle); }

.bedi-dock__rows {
	list-style: none;
	margin: 0;
	padding: 0;
}

/*
 * The negative inline margin is what lets the hover fill bleed to the card's
 * padding edge while the text still aligns to the title above it. Without it
 * the fill is a floating rounded rectangle inset from both sides, which reads
 * as a button rather than as a row.
 */
.bedi-dock__row {
	align-items: center;
	block-size: 56px;
	border-radius: var(--bedi-radius-lg);
	color: inherit;
	column-gap: var(--bedi-space-xs);
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr) 32px;
	margin-inline: calc(var(--bedi-space-2xs) * -1);
	padding-inline: var(--bedi-space-2xs);
	text-decoration: none;
	transition: background-color var(--bedi-dur-micro) var(--bedi-ease-out);
}

.bedi-dock__row:hover { background-color: var(--bedi-surface-2); }

.bedi-dock__row:focus-visible {
	outline: 3px solid var(--bedi-accent);
	outline-offset: -3px;
}

.bedi-dock__rowtile {
	block-size: 36px;
	border-radius: var(--bedi-radius-round);
	color: var(--bedi-on-accent);
	display: grid;
	inline-size: 36px;
	place-items: center;
}

.bedi-dock__rowtile--whatsapp  { background-color: var(--bedi-ch-whatsapp); }
.bedi-dock__rowtile--telegram  { background-color: var(--bedi-ch-telegram); }
.bedi-dock__rowtile--messenger { background-color: var(--bedi-ch-messenger); }

.bedi-dock__rowtile--plain {
	background-color: var(--bedi-bg-2);
	color: var(--bedi-navy);
}

.bedi-dock__rowname {
	color: var(--bedi-ink);
	display: block;
	font-size: var(--bedi-text-base);
	font-weight: var(--bedi-weight-medium);
	min-inline-size: 0;
	overflow-wrap: anywhere;
}

.bedi-dock__rowmeta {
	color: var(--bedi-ink-muted);
	display: block;
	font-size: var(--bedi-text-sm);
	font-variant-numeric: tabular-nums;
	margin-block-start: 1px;
	min-inline-size: 0;
	overflow-wrap: anywhere;
}

.bedi-dock__chev {
	color: var(--bedi-rule-strong);
	display: grid;
	place-items: center;
	transition: transform var(--bedi-dur) var(--bedi-ease-in);
}

.bedi-dock__row:hover .bedi-dock__chev { transform: translateX(3px); }

.bedi-dock__divider {
	background-color: var(--bedi-rule);
	block-size: 1px;
	border: 0;
	margin: var(--bedi-space-2xs) 0;
}

/* --- copy ------------------------------------------------------------- */

.bedi-dock__copy {
	appearance: none;
	background: none;
	block-size: 32px;
	border: 0;
	border-radius: var(--bedi-radius-md);
	color: var(--bedi-ink-muted);
	cursor: pointer;
	display: grid;
	inline-size: 32px;
	padding: 0;
	place-items: center;
	transition:
		background-color var(--bedi-dur-micro) var(--bedi-ease-out),
		color var(--bedi-dur-micro) var(--bedi-ease-out);
}

.bedi-dock__copy:hover {
	background-color: var(--bedi-bg-2);
	color: var(--bedi-accent);
}

.bedi-dock__copy:focus-visible {
	outline: 3px solid var(--bedi-accent);
	outline-offset: 0;
}

/* Both glyphs occupy the same grid cell, so the swap costs no layout. */
.bedi-dock__copy svg {
	grid-area: 1 / 1;
	transition:
		opacity var(--bedi-dur-micro) var(--bedi-ease-out),
		transform var(--bedi-dur-micro) var(--bedi-ease-out);
}

.bedi-dock__copy-check { opacity: 0; transform: scale(0.6); }

.bedi-dock__copy.is-done { color: var(--bedi-ok); }
.bedi-dock__copy.is-done .bedi-dock__copy-sheets { opacity: 0; transform: scale(0.6); }
.bedi-dock__copy.is-done .bedi-dock__copy-check  { opacity: 1; transform: scale(1); }

/* =========================================================================
 * 6. MOBILE — FAB and bottom sheet
 * ====================================================================== */

.bedi-dock__scrim { display: none; }

@media (max-width: 47.9375em) {
	.bedi-dock {
		inset-inline: auto var(--bedi-space-sm);
	}

	/*
	 * A DIFFERENT CONTROL, NOT A SHRUNKEN PILL. A phone has no hover and
	 * therefore no fan-out, and a 250px pill on a 360px viewport is a third of
	 * the width.
	 */
	.bedi-dock__bar {
		block-size: 52px;
		border-radius: var(--bedi-radius-round);
		column-gap: 0;
		display: grid;
		inline-size: 52px;
		padding: 0;
		place-items: center;
		position: relative;
	}

	/*
	 * THE ONE PLACE display:none IS ACCEPTABLE ON THE CHANNELS, because on
	 * mobile they are genuinely relocated into the sheet's rows rather than
	 * merely hidden — the sheet renders the same links, so no focusable element
	 * is lost from the tab order.
	 */
	.bedi-dock__label,
	.bedi-dock__rule,
	.bedi-dock__channels {
		display: none;
	}

	.bedi-dock__tile { block-size: 52px; inline-size: 52px; }
	.bedi-dock__tile svg { height: 22px; width: 22px; }

	.bedi-dock__toggle { border-radius: var(--bedi-radius-round); }

	/* Re-anchored to ride the FAB's corner, keyline overlapping the edge. */
	.bedi-dock__live {
		block-size: 10px;
		box-shadow: 0 0 0 2px var(--bedi-surface);
		inline-size: 10px;
		inset-block-start: 2px;
		inset-inline-end: 2px;
		position: absolute;
	}

	/* --- the sheet --- */

	.bedi-dock__panel {
		border-end-end-radius: 0;
		border-end-start-radius: 0;
		border-inline: 0;
		border-block-end: 0;
		border-radius: var(--bedi-radius-2xl) var(--bedi-radius-2xl) 0 0;
		inline-size: 100%;
		inset-block-end: 0;
		inset-inline: 0;
		max-inline-size: none;
		padding: var(--bedi-space-xs) var(--bedi-space-sm) calc(var(--bedi-space-sm) + env(safe-area-inset-bottom, 0px));
		position: fixed;
		transform-origin: bottom center;
	}

	.bedi-dock__panel.is-in {
		animation: bedi-dock-sheet 260ms var(--bedi-ease-in) 1;
	}

	@keyframes bedi-dock-sheet {
		from { transform: translateY(100%); }
		to   { transform: translateY(0); }
	}

	.bedi-dock__grab {
		background-color: var(--bedi-rule-strong);
		block-size: 4px;
		border-radius: var(--bedi-radius-pill);
		display: block;
		inline-size: 36px;
		margin: 0 auto var(--bedi-space-xs);
	}

	.bedi-dock__row { block-size: 60px; }

	.bedi-dock__scrim {
		background-color: rgba(7, 0, 36, 0.36);
		display: block;
		inset: 0;
		opacity: 0;
		pointer-events: none;
		position: fixed;
		transition: opacity var(--bedi-dur) var(--bedi-ease-in);
		z-index: var(--bedi-z-overlay);
	}

	.bedi-dock.is-open .bedi-dock__scrim {
		opacity: 1;
		pointer-events: auto;
	}

	/* The sheet sits on its own scrim, so the root is promoted for the
	   duration of the open state — and only for that duration. */
	.bedi-dock.is-open {
		z-index: var(--bedi-z-dock-panel, 195);
	}
}

.bedi-dock__grab { display: none; }

@media (max-width: 47.9375em) {
	.bedi-dock__grab { display: block; }
}

/* =========================================================================
 * 7. REDUCED MOTION
 * ====================================================================== */

@media (prefers-reduced-motion: reduce) {
	.bedi-dock,
	.bedi-dock__bar,
	.bedi-dock__channel,
	.bedi-dock__chev,
	.bedi-dock__boom,
	.bedi-dock__tip,
	.bedi-dock__row,
	.bedi-dock__copy svg,
	.bedi-dock__scrim {
		transition-duration: 1ms !important;
	}

	.bedi-dock__channel:hover,
	.bedi-dock__channel:active,
	.bedi-dock__row:hover .bedi-dock__chev,
	.bedi-dock__toggle:hover .bedi-dock__boom {
		transform: none !important;
	}

	.bedi-dock__live::after,
	.bedi-dock__panel.is-in {
		animation: none !important;
	}

	/*
	 * The tuck still happens — it is placement, not decoration, and a visitor
	 * who asked for less motion still wants the corner back. It simply arrives.
	 */
	.bedi-dock__bar,
	.bedi-dock.is-tucked .bedi-dock__bar {
		transition-duration: 1ms !important;
	}
}

/* =========================================================================
 * 8. FORCED COLOURS
 * ====================================================================== */

@media (forced-colors: active) {
	.bedi-dock__bar,
	.bedi-dock__panel,
	.bedi-dock__tile,
	.bedi-dock__channel,
	.bedi-dock__rowtile,
	.bedi-dock__live {
		border: 1px solid ButtonText;
	}

	/*
	 * The channel fills are discarded, and with them the only thing telling
	 * WhatsApp from Telegram at 40px. The brand glyphs are currentColor
	 * strokes, so they survive — but the tooltip becomes the actual label, and
	 * it must therefore be legible rather than decorative.
	 */
	.bedi-dock__tip {
		border: 1px solid ButtonText;
	}

	.bedi-dock__scrim { background-color: Canvas; }
}

/* =========================================================================
 * 9. PRINT
 * ====================================================================== */

@media print {
	.bedi-dock { display: none !important; }
}