/**
 * App-level UI (devsite LLM tools and related components).
 */

.detail-header__title .entry-header h1.page-title {
	display: inline;
	margin-bottom: 0;
}

.detail-header__title .entry-header h1.page-title devsite-actions {
	vertical-align: baseline;
}

devsite-actions {
	display: inline-flex;
	gap: 8px;
	padding-inline: 8px;
	vertical-align: baseline;

	--devsite-background-1: #fff;
	--devsite-background-3: #f1f3f4;
	--devsite-elevation-ambient-shadow-color: rgba(60, 64, 67, 0.15);
	--devsite-elevation-key-shadow-color: rgba(60, 64, 67, 0.3);
	--devsite-primary-border: 1px solid #dadce0;
	--devsite-primary-font-family: Roboto, arial, sans-serif;
	--devsite-primary-text-color: #202124;
	--devsite-secondary-text-color: #5f6368;
}

devsite-llm-tools {
	--devsite-dropdown-list-toggle-border-radius: 0.5rem;
	--devsite-dropdown-list-border-radius: 2px;
	--devsite-dropdown-list-toggle-border: 0;
	--devsite-dropdown-list-toggle-height: 36px;
	--devsite-dropdown-list-toggle-background-hover: #e8eaed;
	--devsite-dropdown-list-toggle-button-padding: 0 3px;
	--devsite-dropdown-list-toggle-color: var(--devsite-primary-text-color);
	--devsite-dropdown-list-toggle-color-hover: var(--devsite-primary-text-color);
	--devsite-dropdown-list-toogle-button-justify-content: center;
	--devsite-button-white-material-icon-margin-x: 0;

	display: inline-block;
}

devsite-llm-tools .devsite-llm-tools-container {
	align-items: center;
	background-color: var(--devsite-background-3);
	border: 0;
	border-radius: var(--devsite-dropdown-list-toggle-border-radius);
	display: inline-flex;
	flex-direction: row;
	height: var(--devsite-dropdown-list-toggle-height);
	justify-content: center;
	outline: none;
	vertical-align: middle;
}

devsite-llm-tools .devsite-llm-tools-button-container {
	--devsite-dropdown-list-toggle-height: 34px;

	border-radius: 0.5rem 0 0 0.5rem;
	box-shadow: inset -1px 0 0 #dadce0;
	display: flex;
	transition: background-color 0.2s, box-shadow 0.2s;
}

devsite-llm-tools .devsite-llm-tools-button-container:has(.devsite-llm-tools-button--copy:hover),
devsite-llm-tools .devsite-llm-tools-button-container:has(.devsite-llm-tools-button--copy:focus),
devsite-llm-tools .devsite-llm-tools-button-container:has(.devsite-llm-tools-button--copy:active) {
	box-shadow: inset -1px 0 0 var(--devsite-dropdown-list-toggle-background-hover);
}

devsite-llm-tools .devsite-llm-tools-container:has(.devsite-llm-tools-dropdown-container .toggle-button:hover) .devsite-llm-tools-button-container,
devsite-llm-tools .devsite-llm-tools-container:has(.devsite-llm-tools-dropdown-container .toggle-button:focus) .devsite-llm-tools-button-container,
devsite-llm-tools .devsite-llm-tools-container:has(.devsite-llm-tools-dropdown-container .toggle-button:active) .devsite-llm-tools-button-container,
devsite-llm-tools .devsite-llm-tools-container:has(devsite-dropdown-list[open]) .devsite-llm-tools-button-container {
	box-shadow: inset -1px 0 0 var(--devsite-dropdown-list-toggle-background-hover);
}

devsite-llm-tools .devsite-llm-tools-dropdown-container {
	--devsite-dropdown-list-toggle-border: none;
	--devsite-dropdown-list-toggle-border-hover: 0;
	--devsite-dropdown-list-toggle-border-radius: 0 0.5rem 0.5rem 0;
	--devsite-dropdown-list-toggle-height: 34px;
	--devsite-popout-offset-y: 2px;

	border-radius: 0 0.5rem 0.5rem 0;
	display: flex;
	transition: background-color 0.2s;
}

devsite-llm-tools .devsite-llm-tools-dropdown-container:has(.toggle-button:hover),
devsite-llm-tools .devsite-llm-tools-dropdown-container:has(.toggle-button:focus),
devsite-llm-tools .devsite-llm-tools-dropdown-container:has(.toggle-button:active),
devsite-llm-tools .devsite-llm-tools-dropdown-container:has(devsite-dropdown-list[open]) {
	background: var(--devsite-dropdown-list-toggle-background-hover);
}

devsite-llm-tools devsite-dropdown-list {
	--devsite-dropdown-list-min-width: 120px;
	--devsite-popout-width: min(50vw, fit-content);

	color: var(--devsite-primary-text-color);
	display: inline-flex;
	position: relative;
	vertical-align: middle;
}

devsite-llm-tools devsite-dropdown-list[rendered] {
	visibility: visible;
}

devsite-llm-tools devsite-dropdown-list slot {
	display: contents;
}

devsite-llm-tools .toggle-button.button {
	align-items: center;
	border-radius: var(--devsite-dropdown-list-toggle-border-radius);
	display: flex;
	height: var(--devsite-dropdown-list-toggle-height, var(--devsite-button-height));
	justify-content: var(--devsite-dropdown-list-toogle-button-justify-content);
	min-width: auto;
	padding: var(--devsite-dropdown-list-toggle-button-padding);
	width: var(--devsite-dropdown-list-toggle-width);
}

devsite-llm-tools devsite-dropdown-list[open] .toggle-button.button {
	background: var(--devsite-dropdown-list-toggle-background-hover);
	border: var(--devsite-dropdown-list-toggle-border-hover);
	border-radius: 0 3px 3px 0;
	box-shadow: none;
	color: var(--devsite-dropdown-list-toggle-color-hover);
	font-weight: inherit;
	text-decoration: none;
}

devsite-llm-tools .devsite-llm-tools-button {
	--devsite-button-padding: 0;
	--devsite-button-line-height: var(--devsite-dropdown-list-toggle-height);
	--devsite-button-white-box-shadow-hover: none;
	--devsite-button-white-box-shadow-active: none;
	--devsite-button-white-text-decoration-hover: none;
	--devsite-button-disabled-border: 0 0 1px 0;

	align-items: center;
	background: transparent;
	border: 0;
	box-shadow: var(--devsite-button-white-box-shadow-hover, none);
	box-sizing: border-box;
	color: var(--devsite-dropdown-list-toggle-color);
	cursor: pointer;
	display: flex;
	height: var(--devsite-dropdown-list-toggle-height);
	justify-content: center;
	line-height: var(--devsite-button-line-height, 36px);
	margin: 0;
	min-width: 36px;
	outline: 0;
	overflow: hidden;
	padding: var(--devsite-button-padding, 0);
	padding-inline: 0;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	transition: background-color 0.2s;
	vertical-align: middle;
	white-space: nowrap;
}

devsite-llm-tools .devsite-llm-tools-button--copy {
	border: 0;
	border-radius: 0.5rem 0 0 0.5rem;
}

devsite-llm-tools .devsite-llm-tools-button--copy:active,
devsite-llm-tools .devsite-llm-tools-button--copy:focus,
devsite-llm-tools .devsite-llm-tools-button--copy:focus-visible,
devsite-llm-tools .devsite-llm-tools-button--copy:hover {
	background: var(--devsite-dropdown-list-toggle-background-hover);
	border-radius: 3px 0 0 3px;
	border-right: var(--devsite-dropdown-list-toggle-border);
	box-shadow: var(--devsite-button-white-box-shadow-hover, none);
	color: var(--devsite-dropdown-list-toggle-color-hover);
	outline: none;
	text-decoration: var(--devsite-button-white-text-decoration-hover, none);
}

devsite-llm-tools .devsite-llm-tools-button--menu:active,
devsite-llm-tools .devsite-llm-tools-button--menu:focus,
devsite-llm-tools .devsite-llm-tools-button--menu:focus-visible,
devsite-llm-tools .devsite-llm-tools-button--menu:hover,
devsite-llm-tools .toggle-button.button:active,
devsite-llm-tools .toggle-button.button:focus,
devsite-llm-tools .toggle-button.button:focus-visible,
devsite-llm-tools .toggle-button.button:hover {
	background: var(--devsite-dropdown-list-toggle-background-hover);
	border-radius: 0 3px 3px 0;
	border: var(--devsite-dropdown-list-toggle-border-hover);
	box-shadow: none;
	color: var(--devsite-dropdown-list-toggle-color-hover);
	font-weight: inherit;
	outline: none;
	text-decoration: none;
}

devsite-llm-tools .devsite-llm-tools-button:focus-visible {
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px #1a73e8;
}

devsite-llm-tools .devsite-llm-tools-button .material-icons {
	direction: unset;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-family: 'Material Icons';
	font-size: 18px;
	font-style: normal;
	font-weight: normal;
	height: 18px;
	letter-spacing: normal;
	line-height: 1;
	margin: 0;
	position: relative;
	text-transform: none;
	top: auto;
	vertical-align: middle;
	white-space: nowrap;
	width: 18px;
	word-wrap: normal;
	-webkit-font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
}

devsite-llm-tools .devsite-llm-tools-button .material-icons.icon-copy::before {
	content: "content_copy";
	display: block;
	line-height: 18px;
	text-align: center;
	width: 18px;
}

devsite-llm-tools .devsite-llm-tools-button .devsite-llm-tools-button__icon {
	direction: unset;
	display: inline-block;
	fill: currentColor;
	height: 18px;
	margin-inline: 0;
	position: relative;
	top: auto;
	vertical-align: middle;
	width: 18px;
}

devsite-llm-tools devsite-dropdown-list .dropdown {
	background: var(--devsite-background-1);
	border-radius: var(--devsite-dropdown-list-border-radius);
	box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color), 0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
	min-width: var(--devsite-dropdown-list-min-width);
	overflow: hidden;
	padding-block: 8px;
}

devsite-llm-tools devsite-dropdown-list .popout {
	box-sizing: border-box;
	inset-inline: calc(0px - var(--devsite-popout-offset-x, 0px)) auto;
	position: absolute;
	top: calc(var(--devsite-popout-top, 100%) + var(--devsite-popout-offset-y, 0px));
	width: var(--devsite-popout-width, max-content);
	z-index: 3;
}

devsite-llm-tools devsite-dropdown-list .dropdown[hidden] {
	display: none;
}

devsite-llm-tools devsite-dropdown-list .dropdown ul {
	list-style: none;
	margin: 0;
	max-height: 245px;
	min-width: var(--devsite-dropdown-list-min-width);
	overflow: hidden auto;
	padding: 0;
}

devsite-llm-tools devsite-dropdown-list .dropdown li[role="menuitem"] {
	cursor: pointer;
	font: 16px / 24px var(--devsite-primary-font-family);
	gap: 10px;
	padding: 0;
	text-align: start;
}

devsite-llm-tools devsite-dropdown-list .dropdown li a {
	color: var(--devsite-secondary-text-color);
	display: block;
	font: inherit;
	padding: 8px 16px;
	text-align: inherit;
	text-decoration: none;
}

devsite-llm-tools devsite-dropdown-list .dropdown li a:hover,
devsite-llm-tools devsite-dropdown-list .dropdown li a:focus {
	background: var(--devsite-background-3);
	color: var(--devsite-primary-text-color);
	outline: none;
}

@media screen and (min-width: 601px) {
	devsite-llm-tools devsite-dropdown-list .dropdown,
	devsite-llm-tools devsite-dropdown-list .dropdown ul {
		width: max-content;
	}

	devsite-llm-tools devsite-dropdown-list .dropdown li a {
		white-space: nowrap;
	}
}

@media screen and (max-width: 600px) {
	devsite-actions {
		--devsite-select-sibling-gap-x: 0;
		--devsite-select-sibling-gap-y: 16px;
	}
}

:root {
	--devsite-panel-height: 0px;
	--devsite-js-header-height: 49px;
	--devsite-cookie-bar-height: 0;
	--devsite-headline-font-family: Roboto, arial, sans-serif;
}

[layout][concierge="hide"],
[layout][concierge="modal"] {
	--devsite-concierge-width: 0px;
}

devsite-snackbar {
	--devsite-snack-max-width: 568px;
	--devsite-snack-min-width: 288px;
	--devsite-snackbar-inner-background: #e8eaed;
	--devsite-snackbar-inner-border-radius: 4px;
	--devsite-snackbar-inner-color: #202124;
	--devsite-snackbar-message-font: 500 14px / 14px Roboto, Noto Sans, Noto Sans JP, Noto Sans KR, Noto Naskh Arabic, Noto Sans Thai, Noto Sans Hebrew, Noto Sans Bengali, sans-serif;
	--devsite-snackbar-action-font: 500 14px / 1 var(--devsite-headline-font-family);
	--devsite-snackbar-action-margin-left: auto;
	--devsite-snackbar-action-margin-right: 16px;
	--devsite-snackbar-action-padding: 8px;
	--devsite-snackbar-link-color: #669df6;
	--devsite-snackbar-message-padding: 16px 24px;

	bottom: 0;
	left: 0;
	margin-inline-end: 24px;
	margin-block-end: var(--devsite-cookie-bar-height, 0);
	min-width: 288px;
	position: fixed;
	right: 0;
	z-index: 1018;
}

devsite-snackbar .devsite-snackbar-snack {
	align-items: stretch;
	bottom: 0;
	box-sizing: border-box;
	display: flex;
	left: 0;
	max-width: var(--devsite-snack-max-width);
	min-width: var(--devsite-snack-min-width);
	padding-block-end: 24px;
	padding-inline-start: 24px;
	position: absolute;
}

devsite-snackbar .devsite-snackbar-snack:not([show]) {
	display: none;
}

devsite-snackbar .devsite-snackbar-inner {
	align-items: center;
	background: var(--devsite-snackbar-inner-background);
	border-radius: var(--devsite-snackbar-inner-border-radius);
	box-shadow: 0 1px 3px 0 rgba(60, 64, 67, 0.3), 0 4px 8px 3px rgba(60, 64, 67, 0.15);
	box-sizing: border-box;
	color: var(--devsite-snackbar-inner-color);
	display: flex;
	width: 100%;
}

devsite-snackbar .devsite-snackbar-message {
	font: var(--devsite-snackbar-message-font);
	padding: var(--devsite-snackbar-message-padding);
}

devsite-snackbar .devsite-snackbar-action {
	background: transparent;
	border: 0;
	color: var(--devsite-snackbar-link-color);
	cursor: pointer;
	font: var(--devsite-snackbar-action-font);
	margin-inline-end: var(--devsite-snackbar-action-margin-right);
	margin-inline-start: var(--devsite-snackbar-action-margin-left);
	padding: var(--devsite-snackbar-action-padding);
}
