.elementor-widget-pixel_sidebar_icon,
.elementor-widget-pixel_sidebar_icon .elementor-widget-container,
.pixel-sidebar-icon,
.pixel-sidebar-icon-open {
	overflow: visible !important;
}

.elementor-widget-pixel_sidebar_icon {
	position: relative;
	z-index: var(--pixel-sidebar-z-index, 9999);
}

/* The root owns only parent-rotation compensation. Layout lives exclusively on __list. */
.pixel-sidebar-icon {
	--pixel-sidebar-box-size: 46px;
	--pixel-sidebar-expanded-width: 180px;
	--pixel-sidebar-icon-size: 18px;
	--pixel-sidebar-item-bg: #111;
	--pixel-sidebar-item-hover-bg: #d7ff18;
	--pixel-sidebar-icon-color: #fff;
	--pixel-sidebar-icon-hover-color: #111;
	--pixel-sidebar-label-bg: #d7ff18;
	--pixel-sidebar-label-hover-bg: var(--pixel-sidebar-label-bg);
	--pixel-sidebar-label-color: #111;
	--pixel-sidebar-label-hover-color: var(--pixel-sidebar-label-color);
	--pixel-sidebar-label-padding: 10px 16px;
	--pixel-sidebar-label-min-width: 0px;
	--pixel-sidebar-label-max-width: 320px;
	--pixel-sidebar-label-text-align: left;
	--pixel-sidebar-label-offset-x: 0px;
	--pixel-sidebar-label-offset-y: 0px;
	--pixel-sidebar-label-rotate: 0deg;
	--pixel-sidebar-icon-rotate: 0deg;
	--pixel-sidebar-item-rotate: 0deg;
	--pixel-sidebar-counter-rotation: 0deg;
	--pixel-sidebar-hover-distance: 8px;
	--pixel-sidebar-transition-duration: 320ms;
	--pixel-sidebar-easing: cubic-bezier(0.22, 1, 0.36, 1);
	--pixel-sidebar-z-index: 9999;
	--pixel-sidebar-border-radius: 12px;
	--pixel-sidebar-expanded-radius: 999px;
	position: relative;
	z-index: var(--pixel-sidebar-z-index);
	width: var(--pixel-sidebar-box-size);
	max-width: none;
	writing-mode: horizontal-tb;
	transform: rotate(var(--pixel-sidebar-counter-rotation));
	transform-origin: center center;
}

.pixel-sidebar-icon__list {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	justify-content: flex-start;
	width: var(--pixel-sidebar-box-size);
	max-width: none;
}

.pixel-sidebar-icon--vertical .pixel-sidebar-icon__list {
	flex-direction: column;
}

.pixel-sidebar-icon--horizontal {
	width: max-content;
}

.pixel-sidebar-icon--horizontal .pixel-sidebar-icon__list {
	flex-direction: row;
	align-items: center;
	width: max-content;
}

/* A fixed list width keeps the right edge in place while the item overflows left on hover. */
.pixel-sidebar-icon--vertical.pixel-sidebar-icon--anchor-right .pixel-sidebar-icon__list {
	/* Keep the icon edge fixed, including previously generated Elementor alignment CSS. */
	align-items: flex-end !important;
}

.pixel-sidebar-icon--vertical.pixel-sidebar-icon--anchor-left .pixel-sidebar-icon__list {
	align-items: flex-start !important;
}

.pixel-sidebar-icon__item {
	position: relative;
	display: inline-flex;
	flex: 0 0 auto;
	flex-direction: row;
	align-items: center;
	width: var(--pixel-sidebar-box-size);
	height: var(--pixel-sidebar-box-size);
	min-width: var(--pixel-sidebar-box-size);
	min-height: var(--pixel-sidebar-box-size);
	overflow: hidden;
	background-color: var(--pixel-sidebar-item-bg);
	border-radius: var(--pixel-sidebar-border-radius);
	color: var(--pixel-sidebar-icon-color);
	line-height: 1;
	text-decoration: none;
	transform: rotate(var(--pixel-sidebar-item-rotate));
	transition: width var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), background-color var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), color var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), border-color var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), border-radius var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), box-shadow var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing);
}

.pixel-sidebar-icon--shape-circle .pixel-sidebar-icon__item {
	border-radius: 999px;
}

.pixel-sidebar-icon--shape-square .pixel-sidebar-icon__item {
	border-radius: 0;
}

.pixel-sidebar-icon--label-left .pixel-sidebar-icon__item {
	justify-content: flex-end;
	transform-origin: right center;
}

.pixel-sidebar-icon--label-right .pixel-sidebar-icon__item {
	justify-content: flex-start;
	transform-origin: left center;
}

.pixel-sidebar-icon__content {
	display: inline-flex;
	flex: 1 1 auto;
	flex-direction: row;
	align-items: center;
	min-width: 0;
	height: 100%;
}

.pixel-sidebar-icon--label-left .pixel-sidebar-icon__label { order: 1; }
.pixel-sidebar-icon--label-left .pixel-sidebar-icon__icon { order: 2; }
.pixel-sidebar-icon--label-right .pixel-sidebar-icon__icon { order: 1; }
.pixel-sidebar-icon--label-right .pixel-sidebar-icon__label { order: 2; }

.pixel-sidebar-icon__icon {
	position: relative;
	z-index: 2;
	display: inline-flex;
	flex: 0 0 var(--pixel-sidebar-box-size);
	align-items: center;
	justify-content: center;
	width: var(--pixel-sidebar-box-size);
	height: var(--pixel-sidebar-box-size);
	font-size: var(--pixel-sidebar-icon-size);
	color: var(--pixel-sidebar-icon-color) !important;
	pointer-events: none;
	transform: rotate(var(--pixel-sidebar-icon-rotate));
	transition: color var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing);
}

.pixel-sidebar-icon__icon i,
.pixel-sidebar-icon__icon i::before,
.pixel-sidebar-icon__icon svg {
	display: block;
	width: 1em;
	height: 1em;
	color: inherit !important;
	line-height: 1;
}

.pixel-sidebar-icon__icon .e-font-icon-svg,
.pixel-sidebar-icon__icon svg[data-icon] {
	fill: currentColor !important;
}

/* A label stays in the button flow; hidden state occupies no horizontal space. */
.pixel-sidebar-icon__label {
	position: relative;
	z-index: 1;
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	width: 0;
	min-width: 0;
	max-width: 0;
	height: 100%;
	box-sizing: border-box;
	overflow: hidden;
	padding: 0;
	background-color: transparent;
	color: var(--pixel-sidebar-label-color);
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: max-width var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), padding var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), opacity var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), visibility var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), transform var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), color var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing), background-color var(--pixel-sidebar-transition-duration) var(--pixel-sidebar-easing);
}

.pixel-sidebar-icon__label-text {
	min-width: 0;
	overflow: hidden;
	text-align: var(--pixel-sidebar-label-text-align);
	white-space: nowrap;
}

.pixel-sidebar-icon--label-left .pixel-sidebar-icon__label {
	transform: translateX(var(--pixel-sidebar-hover-distance)) rotate(var(--pixel-sidebar-label-rotate));
}

.pixel-sidebar-icon--label-right .pixel-sidebar-icon__label {
	transform: translateX(calc(-1 * var(--pixel-sidebar-hover-distance))) rotate(var(--pixel-sidebar-label-rotate));
}

.pixel-sidebar-icon__item:hover,
.pixel-sidebar-icon__item:focus-visible,
.pixel-sidebar-icon__item.is-open {
	width: var(--pixel-sidebar-expanded-width);
	background-color: var(--pixel-sidebar-item-hover-bg);
	color: var(--pixel-sidebar-icon-hover-color);
	text-decoration: none;
}

.pixel-sidebar-icon--shape-circle .pixel-sidebar-icon__item:hover,
.pixel-sidebar-icon--shape-circle .pixel-sidebar-icon__item:focus-visible,
.pixel-sidebar-icon--shape-circle .pixel-sidebar-icon__item.is-open,
.pixel-sidebar-icon--shape-rounded .pixel-sidebar-icon__item:hover,
.pixel-sidebar-icon--shape-rounded .pixel-sidebar-icon__item:focus-visible,
.pixel-sidebar-icon--shape-rounded .pixel-sidebar-icon__item.is-open {
	border-radius: var(--pixel-sidebar-expanded-radius);
}

.pixel-sidebar-icon__item:hover .pixel-sidebar-icon__label,
.pixel-sidebar-icon__item:focus-visible .pixel-sidebar-icon__label,
.pixel-sidebar-icon__item.is-open .pixel-sidebar-icon__label {
	flex: 1 1 auto;
	width: auto;
	max-width: min(var(--pixel-sidebar-label-max-width), calc(var(--pixel-sidebar-expanded-width) - var(--pixel-sidebar-box-size)));
	padding: var(--pixel-sidebar-label-padding);
	color: var(--pixel-sidebar-label-hover-color);
	opacity: 1;
	visibility: visible;
	transform: translate(var(--pixel-sidebar-label-offset-x), var(--pixel-sidebar-label-offset-y)) rotate(var(--pixel-sidebar-label-rotate));
}

.pixel-sidebar-icon--separate-label-background .pixel-sidebar-icon__item:hover .pixel-sidebar-icon__label,
.pixel-sidebar-icon--separate-label-background .pixel-sidebar-icon__item:focus-visible .pixel-sidebar-icon__label,
.pixel-sidebar-icon--separate-label-background .pixel-sidebar-icon__item.is-open .pixel-sidebar-icon__label {
	background-color: var(--pixel-sidebar-label-hover-bg);
}

.pixel-sidebar-icon__item:hover .pixel-sidebar-icon__icon,
.pixel-sidebar-icon__item:focus-visible .pixel-sidebar-icon__icon,
.pixel-sidebar-icon__item.is-open .pixel-sidebar-icon__icon {
	color: var(--pixel-sidebar-icon-hover-color) !important;
}

/* Top/bottom retain a detached reveal while left/right use the integrated expanding button. */
.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item {
	overflow: visible;
}

.pixel-sidebar-icon--label-top .pixel-sidebar-icon__label,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__label {
	position: absolute;
	left: 50%;
	width: max-content;
	max-width: var(--pixel-sidebar-label-max-width);
	height: auto;
	padding: var(--pixel-sidebar-label-padding);
	background-color: var(--pixel-sidebar-label-bg);
	transform: translate(-50%, var(--pixel-sidebar-hover-distance)) rotate(var(--pixel-sidebar-label-rotate));
}

.pixel-sidebar-icon--label-top .pixel-sidebar-icon__label { bottom: calc(100% + var(--pixel-sidebar-label-offset-y)); }
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__label { top: calc(100% + var(--pixel-sidebar-label-offset-y)); }

.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item:hover,
.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item:focus-visible,
.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item.is-open,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item:hover,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item:focus-visible,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item.is-open {
	width: var(--pixel-sidebar-box-size);
}

.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item:hover .pixel-sidebar-icon__label,
.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item:focus-visible .pixel-sidebar-icon__label,
.pixel-sidebar-icon--label-top .pixel-sidebar-icon__item.is-open .pixel-sidebar-icon__label,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item:hover .pixel-sidebar-icon__label,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item:focus-visible .pixel-sidebar-icon__label,
.pixel-sidebar-icon--label-bottom .pixel-sidebar-icon__item.is-open .pixel-sidebar-icon__label {
	max-width: var(--pixel-sidebar-label-max-width);
	color: var(--pixel-sidebar-label-hover-color);
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0) rotate(var(--pixel-sidebar-label-rotate));
}

@media (hover: none) {
	.pixel-sidebar-icon__item:hover .pixel-sidebar-icon__label {
		opacity: 0;
		visibility: hidden;
	}

	.pixel-sidebar-icon--label-left .pixel-sidebar-icon__item:hover,
	.pixel-sidebar-icon--label-right .pixel-sidebar-icon__item:hover {
		width: var(--pixel-sidebar-box-size);
	}
}

@media (prefers-reduced-motion: reduce) {
	.pixel-sidebar-icon,
	.pixel-sidebar-icon__item,
	.pixel-sidebar-icon__label,
	.pixel-sidebar-icon__icon {
		transition-duration: 1ms !important;
	}
}

/* Dock is opt-in. Classic sizing and reveal rules above remain unchanged. */
.pixel-sidebar-icon--dock {
	--pixel-dock-scale: 1.5;
	--pixel-dock-radius: 2;
	--pixel-dock-speed: 140;
	--pixel-dock-padding: 12;
	--pixel-dock-blur: 12;
	--pixel-dock-enabled: 1;
	isolation: isolate;
	max-width: calc(100vw - 16px);
}
.pixel-sidebar-icon--dock .pixel-dock-shelf {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: rgba(235,238,245,.85);
	border: 1px solid rgba(128,128,128,.2);
	border-radius: 20px;
	box-shadow: 0 8px 28px rgba(0,0,0,.12);
	backdrop-filter: blur(calc(var(--pixel-dock-blur) * 1px));
	-webkit-backdrop-filter: blur(calc(var(--pixel-dock-blur) * 1px));
}
.pixel-sidebar-icon--dock .pixel-sidebar-icon__item,
.pixel-sidebar-icon--dock .pixel-sidebar-icon__item:hover,
.pixel-sidebar-icon--dock .pixel-sidebar-icon__item.is-open,
.pixel-sidebar-icon--dock .pixel-sidebar-icon__item:focus-visible {
	width: var(--pixel-sidebar-box-size);
	height: var(--pixel-sidebar-box-size);
	min-width: 0;
	min-height: 0;
	border-radius: var(--pixel-sidebar-border-radius);
	transform: none;
	box-sizing: border-box;
	transition-property: background-color, color, border-color, box-shadow;
	text-decoration: none;
}
.pixel-sidebar-icon--dock.pixel-sidebar-icon--shape-circle .pixel-sidebar-icon__item { border-radius: 50%; }
.pixel-sidebar-icon--dock.pixel-sidebar-icon--shape-square .pixel-sidebar-icon__item { border-radius: 0; }
.pixel-sidebar-icon--dock .pixel-sidebar-icon__content { width: 100%; height: 100%; flex: 0 0 100%; }
.pixel-sidebar-icon--dock .pixel-sidebar-icon__icon {
	width: 100%; height: 100%; flex: 0 0 100%;
	font-size: calc(var(--pixel-sidebar-icon-size) * var(--pixel-dock-item-scale, 1));
	box-sizing: border-box;
}
.pixel-sidebar-icon--dock .pixel-dock-image { width: 100%; height: 100%; object-fit: contain; padding: calc(var(--pixel-dock-image-padding, 5) * 1px); box-sizing: border-box; }
.pixel-sidebar-icon--dock .pixel-sidebar-icon__item:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
/* Keep a style source inside the widget; the visible tooltip lives outside clipped ancestors. */
.pixel-sidebar-icon--dock .pixel-sidebar-icon__item .pixel-sidebar-icon__label {
	display: none !important;
	min-width: var(--pixel-sidebar-label-min-width);
	max-width: var(--pixel-sidebar-label-max-width);
	padding: var(--pixel-sidebar-label-padding);
	color: var(--pixel-sidebar-label-hover-color);
	background: var(--pixel-sidebar-label-hover-bg);
}
.pixel-sidebar-icon--dock.is-dock-ready .pixel-sidebar-icon__list { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pixel-sidebar-icon--dock.is-dock-ready .pixel-sidebar-icon__item { position: absolute; top: 0; left: 0; will-change: auto; }
.pixel-sidebar-icon--dock.is-dock-moving .pixel-sidebar-icon__item { will-change: transform; }
.pixel-sidebar-icon--dock.is-dock-bottom {
	position: fixed;
	left: 50%; bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	transform: translateX(-50%) rotate(var(--pixel-sidebar-counter-rotation));
}
.pixel-sidebar-icon--dock.is-dock-overflow .pixel-sidebar-icon__list { overflow: auto; scrollbar-width: thin; overscroll-behavior: contain; }
.pixel-sidebar-dock-tooltip {
	position: fixed; left: 0; top: 0; z-index: 2147483000;
	box-sizing: border-box; width: max-content; max-width: min(320px, calc(100vw - 16px));
	white-space: normal; overflow-wrap: anywhere; pointer-events: none;
	line-height: 1.4; visibility: hidden;
}
@media (forced-colors: active) {
	.pixel-sidebar-icon--dock .pixel-dock-shelf { border: 1px solid CanvasText; }
	.pixel-sidebar-dock-tooltip { border: 1px solid CanvasText; }
}

.pixel-dock-bottom-space { display: none; width: 100%; flex: 0 0 auto; pointer-events: none; }

/* Vertical Bar rotates ordinary text widgets by 180deg. Sidebar icons already own
   their orientation and must not inherit that text-only header treatment. */
.pixel-stickybar-wrap .elementor-widget-pixel_sidebar_icon > .elementor-widget-container {
	writing-mode: horizontal-tb;
	transform: none;
	width: auto;
}
.pixel-stickybar-wrap .elementor-widget-pixel_sidebar_icon {
	writing-mode: horizontal-tb;
	flex: 0 0 auto;
}

/* Initial Vertical Bar orientation must never animate as late CSS arrives. */
.pixel-stickybar-wrap .elementor-widget-pixel_sidebar_icon > .elementor-widget-container,
.px-stickybar-wrap .elementor-widget-pixel_sidebar_icon > .elementor-widget-container {
  writing-mode: horizontal-tb;
  transform: none;
  transition-property: background-color, border-color, border-radius, box-shadow;
}

/* Do not expose the intermediate flex layout before the Dock has measured it.
 * CSS-only/no-script clients retain the usable fallback; failed JS fails open. */
@media (scripting: enabled) {
 .pixel-sidebar-icon--dock:not(.is-dock-ready) {
  visibility: hidden;
  animation: pixel-dock-fallback-visible 0s 3s forwards;
 }
}
@keyframes pixel-dock-fallback-visible { to { visibility: visible; } }

/* Server-rendered hidden state prevents a flash before scroll position is read. */
.pixel-sidebar-icon .pixel-sidebar-icon__item[data-scroll-state="hidden"]{opacity:0;visibility:hidden;pointer-events:none}
.pixel-sidebar-icon .pixel-sidebar-icon__item[data-scroll-reveal][inert]{pointer-events:none}
