html {
    /* 强制始终显示垂直滚动条，并为 Firefox 隐藏它 */
    overflow-y: scroll;
    scrollbar-width: none;
}

/* 为 WebKit 内核浏览器 (Chrome, Safari) 隐藏滚动条 */
body::-webkit-scrollbar {
    display: none;
}

.sidebar {
    width: 190px;
}

/*----------------------------------------*/
/* gnuradio_side_info */
.gnuradio_side_info {
    padding: 15px;
    background-color: #f4f4f4;
    border-radius: 5px;
    margin-bottom: 20px;
}

.gnuradio_side_info h2 {
    font-size: 18px;
    color: #333;
}

.gnuradio_side_info p {
    font-size: 14px;
    color: #666;
}

.gnuradio_side_info a {
    color: #0073e6;
    text-decoration: none;
    font-weight: bold;
}

.gnuradio_side_info a:hover {
    text-decoration: underline;
}

.gnuradio_side_info i {
    margin-right: 5px;
}

.gnuradio_side_info img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 12px 0 12px 0;
    border-radius: 32px;
}

/*----------------------------------------*/
/* 选择卡片 */
.gnuradio_side_selecter_card {
    text-decoration: none;
    background-color: #fff;
    color: #333;
    padding: 10px 15px; /* 垂直内边距减少到10px，水平保持15px */
    margin-bottom: 12px; /* 适当调整卡片间距 */
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: left;
    font-size: 13px; /* 字体可以稍微缩小，以适应更扁的卡片 */
    display: flex; /* 使用 Flexbox 布局 */
    align-items: center; /* 垂直居中文本和图标 */
}

.gnuradio_side_selecter_card a {
    text-decoration: none;     /* 去掉下划线 */
    color: inherit;            /* 使用父元素的字体颜色（或指定任意颜色） */
    width: -webkit-fill-available;
}

.gnuradio_side_selecter_card i {
    color: #666;
    margin-right: 10px;
    transition: color 0.3s ease;
    font-size: 18px; /* 图标可以稍微大一点，增加视觉冲击力 */
}

.gnuradio_side_selecter_card:hover {
    transform: translateY(-3px);
    border-color: #00e5ff;
    box-shadow: 0 4px 12px rgba(0, 229, 255, 0.2);
    color: #000;
}

.gnuradio_side_selecter_card:hover i {
    color: #00aaff;
}

.gnuradio_side_selecter_card.active {
    background-color: #fff; /* 背景保持白色 */
    border-color: #00aaff; /* 边框加粗并变为亮蓝色 */
    border-width: 2px;
    color: #000; /* 文本颜色变为黑色，更突出 */
    font-weight: bold;
    box-shadow: 0 4px 20px rgba(0, 170, 255, 0.5); /* 更强的发光效果 */
    transform: translateY(-2px); /* 向上浮动，增加选中感 */
}

.gnuradio_side_selecter_card.active i {
    color: #00aaff; /* 图标颜色变为亮蓝色 */
}

.gnuradio_side_selecter_card.selected {
    border-color: #0000008c; 
    color: #000; /* 文本颜色变为黑色，更突出 */
    font-weight: bold;
}

/*----------------------------------------*/
/* 小喇叭滚动消息 */
/* 容器设置 */
.gnuradio_scrolling_message_container {
    display: flex;
    align-items: center;
    overflow: hidden; /* 隐藏超出容器的内容 */
    width: 100%; /* 根据需要调整容器的宽度 */
    white-space: nowrap;
    border: 1px solid #ddd;
    padding: 10px;
    background-color: #f1f1f1;
}

/* 小喇叭图标 */
.gnuradio_scrolling_message_container i {
    margin-right: 10px;
    flex-shrink: 0; /* 防止图标缩小 */
}

/* 滚动消息 */
.gnuradio_scrolling_message {
    display: flex; /* 修改为 flex 布局 */
    align-items: center; /* 垂直居中 */
    overflow: hidden; /* 隐藏超出容器的内容 */
    position: relative;
    white-space: nowrap;
    flex-grow: 1; /* 消息部分占据剩余空间 */
}

/* 消息滚动效果 */
.gnuradio_scrolling_message span {
    width: -webkit-fill-available;
    display: inline-block;
    white-space: nowrap;
    animation: gnuradioScrollMessage 15s linear infinite;
}

/* 定义滚动动画 */
@keyframes gnuradioScrollMessage {
    0% {
        transform: translateX(100%); /* 从右侧开始 */
    }
    100% {
        transform: translateX(-100%); /* 滚动到小喇叭图标右侧之外 */
    }
}

.gnuradio_message_space {
    display: inline-block;
    width: 2em; /* Adjust the width to simulate tab space */
}

/* 停止滚动时鼠标悬停 */
.gnuradio_scrolling_message_container:hover .gnuradio_scrolling_message span {
    animation-play-state: paused; /* Pause the animation on hover */
}