/* Web flasher (user-guide/web-flasher.md): the esp-web-tools
   <esp-web-install-button> only styles its own default "Connect" button, which
   lives in the element's shadow DOM. Our custom slotted
   <button slot="activate"> buttons are left unstyled, and Material's CSS reset
   strips the native button chrome (transparent background, no padding), so they
   render as plain text. Style them as filled, theme-coloured buttons. */
.md-typeset esp-web-install-button button[slot="activate"] {
	display: inline-block;
	cursor: pointer;
	padding: 0.6em 1.5em;
	font-size: 0.85em;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--md-primary-bg-color, #fff);
	background-color: var(--md-primary-fg-color, #03a9f4);
	border: none;
	border-radius: 0.2rem;
	transition: opacity 0.2s;
}

.md-typeset esp-web-install-button button[slot="activate"]:hover {
	opacity: 0.85;
}

.md-typeset esp-web-install-button button[slot="activate"]:focus-visible {
	outline: 2px solid var(--md-accent-fg-color, #00bcd4);
	outline-offset: 2px;
}