/* Viva visitor bots: the launcher button (§7.4), as viva-chatbot's. Colours, fonts and the focus
   ring come from brand.css. */
.vcb .vcb-launcher {
	position: fixed;
	right: 1rem;
	bottom: 1rem;
	z-index: 99990;
	display: inline-flex;
	align-items: center;
	gap: .625em;
	min-height: 48px;
	margin: 0;
	padding: .5em 1.125em .5em .625em;
	border: 0;
	border-radius: 999px;
	background: var(--vcb-green);
	color: #fff;
	box-shadow: 0 6px 18px rgba(var(--vcb-shadow), .35);
	font-family: var(--vcb-display);
	/* The visitor's own default size, whatever the theme sets on the root. */
	font-size: medium;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none;
	cursor: pointer;
}

.vcb .vcb-launcher[hidden] {
	display: none;
}

/* Said when the panel's files could not load (launcher.js): above the button, with the fallback
   contact. Empty, it takes no room. */
.vcb .vcb-launcher-note {
	margin: 0;
}

.vcb .vcb-launcher-note:not(:empty) {
	position: fixed;
	right: 1rem;
	/* Above the button however large the visitor's default font makes it: 48px, or its 1.875em icon and 1em of padding. */
	bottom: calc(1rem + max(48px, 2.875em) + .5rem);
	z-index: 99990;
	max-width: min(22rem, calc(100vw - 2rem));
	padding: .75em 1em;
	border: 1px solid var(--vcb-line-strong);
	border-radius: .75em;
	background: #fff;
	color: var(--vcb-ink);
	box-shadow: 0 6px 18px rgba(var(--vcb-shadow), .2);
	font-family: var(--vcb-body);
	font-size: medium;
	line-height: 1.4;
}

/* The contact page, in the note and in the text an inline bot shows without JavaScript. */
.vcb .vcb-launcher-note a,
.vcb .vcb-launcher-note a:visited,
.vcb .vcb-nojs a,
.vcb .vcb-nojs a:visited {
	color: var(--vcb-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Viva's base theme rounds every focused element and gives it its own shadow, both with !important.
   :is() weighs as much as its heaviest selector, so ":is(.vcb, #vcb-id)" matches every bot's root,
   launcher or inline, with the weight of an id, which those rules cannot outrank. No element has
   the id vcb-id. */
:is(.vcb, #vcb-id) :focus-visible {
	box-shadow: 0 0 0 4px #fff !important;
}

:is(.vcb, #vcb-id) .vcb-launcher {
	border-radius: 999px !important;
}

.vcb .vcb-launcher:hover {
	background: var(--vcb-ink);
	color: #fff;
}

.vcb .vcb-launcher-icon {
	display: grid;
	flex: none;
	place-items: center;
	width: 1.875em;
	height: 1.875em;
	border-radius: 50%;
	background: var(--vcb-lime);
	color: var(--vcb-green);
}

.vcb .vcb-launcher-icon svg {
	width: 1.0625em;
	height: .75em;
}

/* An inline bot (§7.3): its place is kept while its panel loads, so the page does not jump.
   Without JavaScript, or when the panel cannot load, the fallback contact shows instead. */
.vcb.vcb--inline {
	/* Only above and below: the theme's content rules decide where it sits across the page. */
	margin-block: 1.5em;
	font-size: medium;
}

.vcb .vcb-nojs {
	max-width: 40em;
	margin: 0;
	padding: 1em;
	border: 1px solid var(--vcb-line-strong);
	border-radius: 14px;
	background: #fff;
	color: var(--vcb-ink);
	font-family: var(--vcb-body);
	font-size: 1em;
}

@media (scripting: enabled) {
	.vcb.vcb--inline:not(.vcb--failed) {
		min-height: min(32em, 85vh);
	}

	.vcb.vcb--inline:not(.vcb--failed) .vcb-nojs {
		display: none;
	}
}

/* The same once launcher.js has started the bot, in browsers that do not know (scripting). */
.vcb.vcb--inline.vcb--js:not(.vcb--failed) {
	min-height: min(32em, 85vh);
}

.vcb.vcb--inline.vcb--js:not(.vcb--failed) .vcb-nojs {
	display: none;
}

@media (forced-colors: active) {
	.vcb .vcb-launcher {
		border: 1px solid ButtonText;
	}
}

@media print {
	.vcb {
		display: none;
	}
}