/* 侧边栏按钮 */
#sidebar {
    position: fixed;
    right: 5%;
    bottom: 70%;
    z-index: 2000;
}

/* 去掉列表项的默认黑点 */
ul {
    list-style-type: none;
    padding: 0;
}

/* 样式化圆形按钮 */
.yuananniu {
    position: relative; /* 相对定位 */
    width: 50px;
    height: 50px;
    border-radius: 50%; /* 圆形边框 */
    border: 3px solid #9e15bf; /* 边框样式 */
    cursor: pointer; /* 鼠标悬停样式 */
    font-size: x-large;
    color: #9e15bf; /* 文字颜色 */
    background-color: rgba(211, 211, 211, 0.445); /* 背景颜色 */
    display: flex; /* 使用弹性盒布局 */
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
    font-family: '宋体';
    font-size: 10px
}


/* 下拉菜单样式 */
.wb-dropdown-menu {
    position: absolute; /* 绝对定位 */
    z-index: 2000; /* 设置层级 */
    top: 100%; /* 相对于父元素的底部对齐 */
    left: 0; /* 相对于父元素的左侧对齐 */
    width: 120px;
    background-color: #ffffffa4; /* 背景颜色及透明度 */
    border: 1px solid #ccc; /* 边框样式 */
    border-radius: 5px; /* 边框圆角 */
    padding: 5px 0; /* 内边距 */
    opacity: 0; /* 初始不透明度为0，隐藏 */
    transition: opacity 0.3s; /* 渐变过渡效果 */
    pointer-events: none; /* 确保下拉菜单在隐藏时不可点击 */
    color: #9e15bf;
}

/* 鼠标悬停时显示下拉菜单 */
.yuananniu:hover .wb-dropdown-menu {
    opacity: 1; /* 透明度为1，显示 */
    pointer-events: auto; /* 在可见时启用指针事件 */
}

/* 下拉菜单项样式 */
.wb-dropdown-item {
    padding: 3px 5px; /* 内边距 */
    cursor: pointer; /* 鼠标样式 */
    font-size: xx-small; /* 字体大小 */
    margin: 1px; /* 外边距 */
    border: 1px solid transparent; /* 边框样式 */
}

/* 鼠标悬停时下拉菜单项样式 */
.wb-dropdown-item:hover {
    background-color: rgba(221, 146, 165, 0.349); /* 背景颜色及透明度 */
    border-radius: 4px; /* 边框圆角 */
    border-color: rgba(221, 146, 165, 0.349); /* 边框颜色 */
}

/* 鼠标悬停样式 */
.yuananniu:hover {
    transform: scale(1.2); /* 放大效果 */
    background-color: lightgray; /* 背景颜色变化 */
    border: 3px solid #A02CFA; /* 边框颜色变化 */
}


/* 隐藏子菜单 */
.wb-submenu {
    display: none;
    position: absolute;
    right: 100%;
    bottom: 0;
    width: 100px;
    
    background-color: #ffffff80; /* 背景颜色及透明度 */
    border: 1px solid #ccc; /* 边框样式 */
    border-radius: 5px; /* 边框圆角 */
    padding: 5px 0; /* 内边距 */
    
}

/* 显示子菜单 */
.wb-menu-item:hover > .wb-submenu {
    display: block;    
    border-radius: 4px; /* 边框圆角 */
    border-color: rgba(221, 146, 165, 0.349); /* 边框颜色 */
}

li {
    list-style-type: none;
}
