/* 标签云样式优化 */
.tag-cloud {
    max-height: 140px;
    overflow-y: auto;
    padding-right: 8px;
    display: flex;
    flex-wrap: wrap;
}

.tag-cloud .badge {
    transition: all 0.3s ease;
}

.tag-cloud .badge:hover {
    background-color: #000000;
    color: white !important;
    transform: translateY(-2px);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}

/* 浮动动画效果 */
.hover-float-item {
    transition: all 0.3s ease;
    cursor: pointer;
    border-radius: 6px;
}

.hover-float-item:hover {
    transform: translateX(8px);
    background-color: rgba(0, 0, 0, 0.05);
}

.hover-float-row {
    transition: all 0.3s ease;
    cursor: pointer;
    border-radius: 4px;
}

.hover-float-row:hover {
    transform: translateX(8px);
    background-color: rgba(0, 0, 0, 0.05);
}

/* 悬停效果 */
.hover-primary:hover {
    color: #000000 !important;
    text-decoration: none;
}

.hover-text-dark:hover {
    color: #000000 !important;
}

/* 滚动条美化 */
.tag-cloud::-webkit-scrollbar {
    width: 6px;
}
.tag-cloud::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}
.tag-cloud::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 3px;
}
.tag-cloud::-webkit-scrollbar-thumb:hover {
    background: #111;
}

/* 表格容器 */
.table-container {
    max-height: 360px;
    overflow-y: auto;
}

.table-container::-webkit-scrollbar {
    width: 6px;
}
.table-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}
.table-container::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 3px;
}
.table-container::-webkit-scrollbar-thumb:hover {
    background: #111;
}

/* 响应式调整 */
@media (max-width: 767px) {
    .sidebar-container {
        padding: 1rem;
    }
    
    .tag-cloud {
        max-height: 120px;
    }
    
    .table-container {
        max-height: 300px;
    }
}


/* 横向滚动容器样式 */
.table-horizontal-scroll {
    overflow-x: auto; /* 当内容超出宽度时显示横向滚动条 */
    overflow-y: hidden; /* 隐藏垂直滚动条 */
    width: 100%; /* 确保容器宽度占满父元素 */
    position: relative;
}

/* 优化表格在滚动容器中的显示 */
.table-horizontal-scroll table {
    min-width: 100%; /* 确保表格至少占满容器宽度 */
    width: auto; /* 允许表格根据内容自动调整宽度 */
}

/* 美化滚动条样式 */
.table-horizontal-scroll::-webkit-scrollbar {
    height: 6px; /* 滚动条高度 */
}

.table-horizontal-scroll::-webkit-scrollbar-track {
    background: #f1f1f1; /* 滚动条轨道背景 */
    border-radius: 3px;
}

.table-horizontal-scroll::-webkit-scrollbar-thumb {
    background: #ddd; /* 滚动条滑块颜色 */
    border-radius: 3px;
}

.table-horizontal-scroll::-webkit-scrollbar-thumb:hover {
    background: #ccc; /* 滚动条滑块hover颜色 */
}

/* 可选：添加拖拽滚动支持 */
.table-horizontal-scroll {
    cursor: grab; /* 显示拖拽光标 */
}

.table-horizontal-scroll:active {
    cursor: grabbing; /* 拖拽时显示抓取光标 */
}

/* 响应式调整 */
@media (max-width: 767px) {
    .table-horizontal-scroll {
        border-top: 1px solid #eee; /* 顶部边框区分滚动区域 */
        border-bottom: 1px solid #eee; /* 底部边框区分滚动区域 */
        padding: 4px 0; /* 添加上下内边距 */
    }
}


/* 影片列表项基础样式 */
.movie-item-link {
    text-decoration: none;
    color: inherit;
}

.movie-title {
    color: #343a40; /* 默认深灰色 */
    font-weight: bold;
    transition: color 0.3s ease;
}

.movie-quality {
    color: #6c757d; /* 灰色表示画质 */
}

.movie-date {
    color: #6c757d; /* 灰色表示日期 */
}

/* 浮动动画效果 */
.hover-float-item {
    transition: all 0.3s ease;
    cursor: pointer;
    padding: 8px 0;
    border-radius: 4px;
}

.hover-float-item:hover {
    transform: translateX(8px); /* 向右浮动效果 */
    background-color: rgba(0, 123, 255, 0.05); /* 轻微蓝色背景 */
    box-shadow: -4px 0 8px rgba(0, 123, 255, 0.1); /* 蓝色阴影 */
}

/* 鼠标经过时的颜色变化 */
.hover-float-item:hover .movie-title {
    color: #007bff; /* 悬浮时变为蓝色 */
}

.hover-float-item:hover .movie-quality,
.hover-float-item:hover .movie-date {
    color: #495057; /* 悬浮时颜色加深 */
}

/* 响应式调整 */
@media (max-width: 767px) {
    .hover-float-item:hover {
        transform: translateX(5px); /* 移动端减少偏移量 */
    }
}