/**
 * Botpress Easy Toolkit — frontend styles (skeleton).
 *
 * Layout: full width of the theme content area; chat panel uses responsive height
 * for a dedicated app-like surface. Outer page width still depends on the theme.
 */

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope) {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
}

/* Keep this scoped to the root only; modal container itself must stay position: fixed. */
#botpress-easy-toolkit-root[data-bet-runtime-mode="modal"] {
	position: relative;
	z-index: 2147483000;
}

/* Shortcode fullscreen: root is moved under .bet-fullscreen-portal (see toolkit JS). */
.bet-fullscreen-portal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	background:
		linear-gradient( 180deg, #eef2ff 0%, #f8fafc 100% );
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"],
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin-inline: 0;
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	padding: 0;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-toolkit-chat-wrap,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-toolkit-chat-wrap {
	min-height: clamp( 32rem, 78vh, 72rem );
	border-radius: 1rem;
	border-color: #d0d7ff;
	background: #ffffff;
	box-shadow: 0 24px 50px rgba( 67, 56, 202, 0.12 );
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-toolkit-layout,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-toolkit-layout {
	flex: 1 1 auto;
	min-height: 100vh;
	gap: 0;
	padding: 0;
	border-radius: 0;
	background: transparent;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-auth-panel,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-auth-panel {
	border-radius: 1rem;
	border-color: #d9def2;
	box-shadow: 0 12px 30px rgba( 15, 23, 42, 0.07 );
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-auth-shell__card .bet-auth-panel,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-auth-shell__card .bet-auth-panel,
.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-auth-card .bet-auth-panel,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-auth-card .bet-auth-panel {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	padding: 0;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] #bet-embedded-chat,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] #bet-embedded-chat {
	min-height: inherit;
}

.bet-toolkit-layout {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.bet-toolkit-auth {
	flex: 0 0 auto;
}

/* No Firebase auth for this bot: hide the auth column entirely (no visitor-facing message). */
.bet-toolkit-auth.bet-toolkit-auth--inactive {
	display: none !important;
}

.bet-toolkit-auth.bet-toolkit-auth--dismissed {
	display: none !important;
}

.bet-toolkit-chat-wrap {
	position: relative;
	flex: 1 1 auto;
	min-height: clamp( 22rem, 52vh, 44rem );
	border: 1px solid #d9dee5;
	border-radius: 0.75rem;
	overflow: hidden;
	background-color: #f9fafb;
}

.bet-toolkit-chat-wrap.is-hidden {
	display: none !important;
}

.bet-toolkit-session-logout {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	z-index: 8;
}

.bet-toolkit-session-logout__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2rem;
	padding: 0.25rem 0.7rem;
	border: 1px solid rgba( 255, 255, 255, 0.85 );
	border-radius: 999px;
	background: rgba( 15, 23, 42, 0.72 );
	backdrop-filter: blur( 4px );
	color: #ffffff;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background 0.18s ease, border-color 0.18s ease;
}

.bet-toolkit-session-logout__button:hover,
.bet-toolkit-session-logout__button:focus-visible {
	background: rgba( 15, 23, 42, 0.88 );
	border-color: #ffffff;
}

.bet-toolkit-session-logout__button:focus-visible {
	outline: 2px solid rgba( 191, 219, 254, 0.95 );
	outline-offset: 2px;
}

.bet-toolkit-session-logout__button[aria-invalid='true'] {
	border-color: rgba( 248, 113, 113, 0.95 );
}

.bet-toolkit-bubble-launcher {
	position: fixed;
	right: clamp( 1rem, 2.5vw, 1.5rem );
	bottom: clamp( 1rem, 2.5vw, 1.5rem );
	z-index: 9998;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 7.8rem;
	height: 7.8rem;
	padding: 0;
	border: 1px solid rgba( 148, 163, 184, 0.6 );
	border-radius: 999px;
	background:
		linear-gradient( 160deg, #eef2f7 0%, #ffffff 100% );
	color: #0f172a;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 28px 60px rgba( 15, 23, 42, 0.18 );
	transition: transform 140ms ease, box-shadow 140ms ease, opacity 140ms ease;
}

.bet-toolkit-bubble-launcher:hover,
.bet-toolkit-bubble-launcher:focus-visible {
	transform: translateY( -2px );
	box-shadow: 0 36px 72px rgba( 15, 23, 42, 0.24 );
}

.bet-toolkit-bubble-launcher:focus-visible {
	outline: 6px solid rgba( 96, 165, 250, 0.32 );
	outline-offset: 4px;
}

.bet-toolkit-bubble-lottie {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 5.3rem;
	height: 5.3rem;
	overflow: hidden;
	line-height: 0;
	pointer-events: none;
}

.bet-toolkit-bubble-lottie svg {
	display: block;
	width: 100% !important;
	height: 100% !important;
}

.bet-toolkit-modal {
	position: fixed;
	inset: 0;
	z-index: 2147483600;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.75rem;
}

.bet-toolkit-modal.is-hidden {
	display: none !important;
}

.bet-toolkit-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba( 15, 23, 42, 0.58 );
}

.bet-toolkit-modal-dialog {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	width: min( 100%, 72rem );
	max-height: calc( 100vh - 3.5rem );
	max-height: calc( 100dvh - 3.5rem );
	min-height: 0;
	padding: 0;
	overflow: visible;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.bet-toolkit-modal-close {
	position: absolute;
	top: -1.25rem;
	right: -1.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.85rem;
	height: 2.85rem;
	border: 1px solid rgba( 203, 213, 225, 0.95 );
	border-radius: 999px;
	background: linear-gradient( 180deg, rgba( 248, 250, 252, 0.98 ) 0%, rgba( 226, 232, 240, 0.98 ) 100% );
	color: #0f172a;
	font-size: 1.7rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 14px 32px rgba( 15, 23, 42, 0.25 );
	transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.bet-toolkit-modal-close:hover,
.bet-toolkit-modal-close:focus-visible {
	transform: scale( 1.05 );
	box-shadow: 0 18px 40px rgba( 15, 23, 42, 0.3 );
	background: linear-gradient( 180deg, rgba( 255, 255, 255, 1 ) 0%, rgba( 241, 245, 249, 1 ) 100% );
}

.bet-toolkit-modal-close:focus-visible {
	outline: 3px solid rgba( 191, 219, 254, 0.95 );
	outline-offset: 2px;
}

.bet-toolkit-modal-close.is-attention {
	animation: bet-toolkit-modal-close-nudge 420ms ease;
}

.bet-toolkit-modal-close-hint {
	position: absolute;
	top: -1.05rem;
	right: 2.2rem;
	z-index: 2;
	padding: 0.55rem 0.8rem;
	border: 1px solid rgba( 203, 213, 225, 0.9 );
	border-radius: 999px;
	background: rgba( 255, 255, 255, 0.98 );
	color: #334155;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transform: translateY( 6px );
	box-shadow: 0 12px 28px rgba( 15, 23, 42, 0.18 );
	transition: opacity 160ms ease, transform 160ms ease;
}

.bet-toolkit-modal-close:hover + .bet-toolkit-modal-close-hint,
.bet-toolkit-modal-close:focus-visible + .bet-toolkit-modal-close-hint,
.bet-toolkit-modal.is-close-hint-active .bet-toolkit-modal-close-hint {
	opacity: 1;
	transform: translateY( 0 );
}

.bet-toolkit-modal-dialog > .bet-toolkit-layout--modal {
	flex: 1 1 auto;
	min-height: 0;
}

.bet-toolkit-layout--modal {
	display: flex;
	flex-direction: column;
	gap: 0;
	flex: 1 1 auto;
	min-height: min( 84vh, 62rem );
	min-height: min( 84dvh, 62rem );
	border: 1px solid rgba( 226, 232, 240, 0.95 );
	border-radius: 1.35rem;
	overflow: hidden;
	background: #ffffff;
	box-shadow: 0 34px 90px rgba( 15, 23, 42, 0.28 );
}

.bet-toolkit-layout--modal .bet-toolkit-auth {
	flex: 0 0 auto;
	min-height: 0;
}

.bet-toolkit-layout--modal .bet-toolkit-chat-wrap {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	border-width: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"] .bet-toolkit-chat-wrap:not(.is-hidden) {
	flex: 1 1 auto;
	min-height: 0;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"],
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] {
	padding: 0;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] .bet-toolkit-layout,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] .bet-toolkit-layout {
	min-height: 100vh;
	min-height: 100dvh;
	padding: 0;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] .bet-toolkit-chat-wrap:not(.is-hidden),
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] .bet-toolkit-chat-wrap:not(.is-hidden) {
	flex: 1 1 auto;
	min-height: 100vh;
	min-height: 100dvh;
	border-radius: 0;
	border-width: 0;
	box-shadow: none;
}

.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] #bet-embedded-chat,
.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"][data-bet-post-auth="1"] #bet-embedded-chat {
	min-height: 100%;
}

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="embedded"][data-bet-post-auth="1"] .bet-toolkit-layout,
:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"][data-bet-post-auth="1"] .bet-toolkit-layout {
	gap: 0;
}

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="embedded"][data-bet-post-auth="1"] .bet-toolkit-chat-wrap:not(.is-hidden),
:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"][data-bet-post-auth="1"] .bet-toolkit-chat-wrap:not(.is-hidden) {
	min-height: clamp( 26rem, 76vh, 48rem );
}

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"][data-bet-post-auth="1"] .bet-toolkit-chat-wrap:not(.is-hidden) {
	min-height: clamp( 36rem, 84vh, 62rem );
}

#bet-embedded-chat {
	position: relative;
	width: 100%;
	min-height: clamp( 22rem, 52vh, 44rem );
	height: 100%;
}

/* Modal: must come after generic #bet-embedded-chat so flex fill is not overridden by min-height clamp. */
:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"] .bet-toolkit-chat-wrap:not(.is-hidden) {
	position: relative;
}

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"] #bet-embedded-chat {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	min-height: 0 !important;
	flex: none;
	align-self: stretch;
}

/* Embedded webchat: fill container; hide FAB when present */
#bet-embedded-chat .bpFab,
#bet-embedded-chat .bpFabContainer {
	display: none !important;
}

/* Botpress v3 embedded mount + legacy class; both must fill #bet-embedded-chat */
#bet-embedded-chat .bpWebchat,
#bet-embedded-chat .bpEmbeddedWebchat,
#bet-embedded-chat #webchat-root {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
}

@keyframes bet-toolkit-modal-close-nudge {
	0% {
		transform: scale( 1 );
	}

	40% {
		transform: translateX( -4px ) scale( 1.08 );
	}

	75% {
		transform: translateX( 2px ) scale( 1.04 );
	}

	100% {
		transform: scale( 1 );
	}
}

:is(#botpress-easy-toolkit-root, .bet-toolkit-scope) *,
:is(#botpress-easy-toolkit-root, .bet-toolkit-scope) *::before,
:is(#botpress-easy-toolkit-root, .bet-toolkit-scope) *::after {
	box-sizing: inherit;
}

.bet-auth-panel {
	padding: 1.5rem;
	border: 1px solid #d9dee5;
	border-radius: 0.75rem;
	background-color: #ffffff;
	box-shadow: 0 1px 2px rgba( 16, 24, 40, 0.06 );
}

.bet-auth-header {
	margin-bottom: 1rem;
}

.bet-auth-modes {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0.5rem;
	margin-bottom: 1.25rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid #eaecf0;
}

.bet-auth-mode-button {
	margin: 0;
	padding: 0.35rem 0.65rem;
	border: 1px solid transparent;
	border-radius: 0.375rem;
	background: transparent;
	color: #475467;
	font-size: 0.8125rem;
	font-weight: 600;
	cursor: pointer;
	line-height: 1.3;
}

.bet-auth-mode-button:hover {
	color: #101828;
	background-color: #f2f4f7;
}

.bet-auth-mode-button.is-active {
	color: #101828;
	background-color: #e4e7ec;
	border-color: #cfd4dc;
}

.bet-auth-mode-button:disabled {
	opacity: 0.65;
	cursor: wait;
	pointer-events: none;
}

.bet-auth-title {
	margin: 0 0 0.5rem;
	font-size: 1.25rem;
	line-height: 1.3;
}

.bet-auth-description,
.bet-auth-user-email,
.bet-auth-status,
.bet-auth-success {
	margin: 0;
}

.bet-auth-description,
.bet-auth-user-email {
	color: #475467;
}

.bet-auth-form {
	display: grid;
	gap: 1rem;
}

.bet-auth-remember {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;
}

.bet-auth-checkbox {
	width: 1rem;
	height: 1rem;
	margin: 0;
	flex-shrink: 0;
	accent-color: #111827;
}

.bet-auth-remember-label {
	font-weight: 500;
	color: #344054;
	font-size: 0.9375rem;
}

.bet-auth-actions {
	margin: 1rem 0 0;
}

.bet-auth-link-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.75rem 1rem;
	border-radius: 0.5rem;
	background-color: #111827;
	color: #ffffff;
	font-weight: 600;
	text-decoration: none;
}

.bet-auth-link-button:hover {
	color: #ffffff;
	opacity: 0.92;
}

.bet-auth-dynamic-status {
	margin: 1rem 0 0;
	min-height: 0;
}

.bet-auth-field {
	display: grid;
	gap: 0.35rem;
}

.bet-auth-label {
	font-weight: 600;
	color: #101828;
}

.bet-auth-input {
	width: 100%;
	padding: 0.75rem 0.875rem;
	border: 1px solid #cfd4dc;
	border-radius: 0.5rem;
	background-color: #ffffff;
	color: #101828;
}

.bet-auth-input:focus {
	border-color: #2563eb;
	outline: 2px solid rgba( 37, 99, 235, 0.15 );
	outline-offset: 1px;
}

.bet-auth-button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: 0.75rem 1rem;
	border: 0;
	border-radius: 0.5rem;
	background-color: #111827;
	color: #ffffff;
	font-weight: 600;
	cursor: pointer;
}

.bet-auth-button:disabled {
	opacity: 0.7;
	cursor: wait;
}

.bet-auth-panel-logged-in {
	display: grid;
	gap: 0.875rem;
}

.bet-auth-success {
	color: #067647;
	font-weight: 600;
}

.bet-auth-status {
	margin-top: 1rem;
	padding: 0.75rem 0.875rem;
	border-radius: 0.5rem;
	background-color: #f2f4f7;
	color: #344054;
}

.bet-auth-status.is-error {
	background-color: #fef3f2;
	color: #b42318;
}

body.bet-toolkit-route-fullscreen {
	margin: 0;
	background:
		linear-gradient( 180deg, #eef2ff 0%, #f8fafc 100% );
}

body.bet-toolkit-route-fullscreen,
body.bet-toolkit-modal-open,
body.bet-toolkit-fullscreen-open {
	overflow: hidden;
}

.bet-toolkit-route-shell {
	min-height: 100vh;
	padding: 0;
	display: flex;
}

.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope) {
	min-height: 100vh;
	flex: 1 1 auto;
	padding: clamp( 0.75rem, 1.8vw, 1.5rem );
}

/* Dedicated chat page + shortcode fullscreen portal: tighter chrome on small viewports */
@media ( max-width: 640px ) {
	.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"],
	.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] {
		width: 100%;
		margin-inline: 0;
		padding: 0;
	}

	.bet-fullscreen-portal :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-toolkit-layout,
	.bet-toolkit-route-shell :is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="fullscreen"] .bet-toolkit-layout {
		min-height: 100vh;
		padding: 0.75rem;
		border-radius: 0;
	}

	.bet-toolkit-layout {
		gap: 0.875rem;
	}

	.bet-auth-panel {
		padding: 1.125rem;
	}

	.bet-toolkit-chat-wrap {
		border-radius: 0.5rem;
		min-height: clamp( 20rem, 48vh, 36rem );
	}

	.bet-toolkit-modal {
		padding: 0;
	}

	.bet-toolkit-modal-dialog {
		width: 100%;
		max-height: 100vh;
		max-height: 100dvh;
		min-height: 100vh;
		min-height: 100dvh;
		border-radius: 0;
	}

	.bet-toolkit-layout--modal {
		min-height: 100vh;
		min-height: 100dvh;
		border-radius: 0;
		box-shadow: none;
	}

	.bet-toolkit-layout--modal .bet-toolkit-chat-wrap,
	:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"] .bet-toolkit-chat-wrap:not(.is-hidden),
	:is(#botpress-easy-toolkit-root, .bet-toolkit-scope)[data-bet-runtime-mode="modal"][data-bet-post-auth="1"] .bet-toolkit-chat-wrap:not(.is-hidden) {
		min-height: 0;
	}

	.bet-toolkit-modal-close {
		top: 0.75rem;
		right: 0.75rem;
	}

	.bet-toolkit-modal-close-hint {
		top: 1rem;
		right: 4rem;
	}

	.bet-toolkit-bubble-launcher {
		right: 0.875rem;
		bottom: 0.875rem;
		width: 3.5rem;
		height: 3.5rem;
	}

	#bet-embedded-chat {
		min-height: clamp( 20rem, 48vh, 36rem );
	}
}