// 侧边栏顶部的操作按钮（折叠全部 / 新建笔记本 / 显示笔记列表 / 同步）。
// 四个按钮都绝对定位在列表右上角，靠 inset-inline-end 依次排开：
// 原本的写法只支持单个按钮（都挤在同一点），这里补上横向排列。
.sidebar-header-button {
	position: absolute;
	top: 4px;
	inset-inline-end: 4px;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: none;
	border-radius: 4px;

	background-color: transparent;
	font-size: 15px;
	color: var(--joplin-color2);
	opacity: 0.6;

	&:hover:not(:disabled) {
		color: var(--joplin-color2);
		background-color: var(--joplin-background-color-hover2);
		opacity: 1;
	}

	&:active:not(:disabled) {
		color: var(--joplin-color2);
		background-color: var(--joplin-background-color-active2);
		opacity: 1;
	}

	&:disabled {
		opacity: 0.25;
	}

	// 位置与 cn-layout.scss 保持一致（那边后加载，以它为准）
	&.-collapseall {
		inset-inline-end: 94px;
	}

	&.-newfolder {
		inset-inline-end: 64px;
	}

	&.-toggle-note-list {
		inset-inline-end: 34px;
	}

	// 同步中旋转：动画 keyframes 定义在 sidebar-sync-button.scss
	&.-sync.-syncing > i {
		animation: icon-infinite-rotation 1s linear infinite;

		@media (prefers-reduced-motion: reduce) {
			animation: none;
		}
	}
}