/* Incredible Bottom Bar — frontend styles.
   Colors, sizes and the breakpoint come from the inline :root variables printed
   in <head>. The bar is display:none by default and switched to flex inside the
   breakpoint media query, so desktop visitors never see it. */

#incbb-bar {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: var(--incbb-z, 99999);
	align-items: stretch;
	margin: 0;
	padding: 0 0 env(safe-area-inset-bottom, 0px);
	background: var(--incbb-bg, #4d5e69);
	font-size: var(--incbb-fs, 14px);
	font-weight: var(--incbb-weight, 400);
	line-height: 1.2;
	box-sizing: border-box;
}

#incbb-bar *,
#incbb-bar *::before,
#incbb-bar *::after {
	box-sizing: border-box;
}

#incbb-bar .incbb-item {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 0;
	padding: var(--incbb-pad-v, 10px) 2px;
	color: var(--incbb-text, #fff);
	text-align: center;
	text-decoration: none;
	border: 0;
	background: transparent;
	-webkit-tap-highlight-color: transparent;
	transition: opacity 0.15s ease;
}

#incbb-bar .incbb-item + .incbb-item {
	border-left: 1px solid var(--incbb-divider, transparent);
}

#incbb-bar .incbb-item:active {
	opacity: 0.75;
}

#incbb-bar .incbb-item:focus-visible {
	outline: 2px solid var(--incbb-text, #fff);
	outline-offset: -4px;
}

#incbb-bar .incbb-icon {
	display: block;
	flex: none;
	width: var(--incbb-is, 22px);
	height: var(--incbb-is, 22px);
	color: var(--incbb-icon, #fff);
	stroke: currentColor;
	fill: none;
}

#incbb-bar .incbb-label {
	display: block;
	color: var(--incbb-text, #fff);
	font: inherit;
	overflow-wrap: break-word;
	hyphens: manual;
}

/* ---- Bar style: full width (default) ---- */
#incbb-bar.incbb-style-full {
	border-top: var(--incbb-bw, 0px) solid var(--incbb-bc, transparent);
}

#incbb-bar.incbb-style-full.incbb-has-shadow {
	box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.28);
}

/* ---- Bar style: floating ---- */
#incbb-bar.incbb-style-floating {
	left: var(--incbb-gap, 10px);
	right: var(--incbb-gap, 10px);
	bottom: calc(var(--incbb-gap, 10px) + env(safe-area-inset-bottom, 0px));
	padding-bottom: 0;
	border: var(--incbb-bw, 0px) solid var(--incbb-bc, transparent);
	border-radius: var(--incbb-radius, 14px);
	overflow: hidden;
}

#incbb-bar.incbb-style-floating.incbb-has-shadow {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35), 0 2px 6px rgba(0, 0, 0, 0.18);
}

/* ---- Highlighted section ---- */
#incbb-bar .incbb-item.incbb-hl {
	background: var(--incbb-hl-bg, #e0a43a);
	color: var(--incbb-hl-text, #1b2148);
	border-left-color: transparent;
}

#incbb-bar .incbb-item.incbb-hl .incbb-icon,
#incbb-bar .incbb-item.incbb-hl .incbb-label {
	color: var(--incbb-hl-text, #1b2148);
}

#incbb-bar .incbb-item.incbb-hl + .incbb-item {
	border-left-color: transparent;
}

/* Hide the bar in print. */
@media print {
	#incbb-bar {
		display: none !important;
	}
}