/* 自定义样式 */

/* 补充Tabler可能缺失的CSS变量 */
:root {
    --tblr-primary-darken: color-mix(in srgb, var(--tblr-primary) 85%, black);
    --tblr-red-rgb: 214, 57, 57;
    --tblr-green-rgb: 47, 179, 68;
    /* 为了兼容性，确保所有主题色都有RGB值 */
    --tblr-blue-rgb: 6, 111, 209;
    --tblr-indigo-rgb: 66, 99, 235;
    --tblr-purple-rgb: 174, 62, 201;
    --tblr-pink-rgb: 214, 51, 108;
    --tblr-orange-rgb: 247, 103, 7;
    --tblr-yellow-rgb: 245, 159, 0;
    --tblr-lime-rgb: 116, 184, 22;
    --tblr-teal-rgb: 12, 166, 120;
    --tblr-cyan-rgb: 23, 162, 184;
    
    /* 糖果色调色板 - 现代柔和且富有活力的配色 */
    --candy-pink: #FF6B9D;
    --candy-pink-rgb: 255, 107, 157;
    --candy-orange: #FF8A5B;
    --candy-orange-rgb: 255, 138, 91;
    --candy-yellow: #FFD93D;
    --candy-yellow-rgb: 255, 217, 61;
    --candy-green: #6BCF7F;
    --candy-green-rgb: 107, 207, 127;
    --candy-blue: #4DABF7;
    --candy-blue-rgb: 77, 171, 247;
    --candy-purple: #9775FA;
    --candy-purple-rgb: 151, 117, 250;
    --candy-red: #FF6B9D;
    --candy-red-rgb: 255, 107, 157;
    --candy-cyan: #3BC9DB;
    --candy-cyan-rgb: 59, 201, 219;
    --candy-mint: #63E6BE;
    --candy-mint-rgb: 99, 230, 190;
    --candy-coral: #FFA8A8;
    --candy-coral-rgb: 255, 168, 168;
}



/* 主题切换器样式 */
.navbar-sidebar .dropdown-header {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--tblr-muted);
    padding: 0.5rem 1rem 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.navbar-sidebar .dropdown-item[data-theme-primary] {
    display: flex;
    align-items: center;
}

.navbar-sidebar .dropdown-item[data-theme-primary].active {
    background: var(--tblr-primary-lt);
    color: var(--tblr-primary);
    font-weight: 600;
}



/* 搜索部分全屏样式 */
.search-section {
    height: 100vh;
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--tblr-purple) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    background-size: cover; /* 等比缩放以覆盖整个容器 */
    background-position: center center; /* 居中显示 */
    background-repeat: no-repeat;
    background-attachment: scroll; /* 改为scroll避免移动端兼容性问题和晃动 */
}

/* 视频背景容器 */
.search-section-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    overflow: hidden;
}

/* 视频背景元素 */
.search-section-video video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* 等比铺满容器，保持宽高比 */
}

.search-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.search-container {
    position: relative;
    z-index: 2;
    text-align: center;
    color: white;
    max-width: 600px;
    width: 100%;
    padding: 0 20px;
}

.search-title {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.search-subtitle {
    font-size: 1.2rem;
    margin-bottom: 2rem;
    opacity: 0.9;
}

.search-form {
    position: relative;
    margin-bottom: 2rem;
}

.search-input {
    width: 100%;
    padding: 15px 60px 15px 20px;
    font-size: 1.1rem;
    border: none;
    border-radius: 50px;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

.search-input:focus {
    outline: none;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.3);
    transform: translateY(-2px);
}

.search-btn {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--tblr-primary);
    border: none;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transition: all 0.3s ease;
}

.search-btn:hover {
    background: var(--tblr-primary-darken);
    transform: translateY(-50%) scale(1.05);
}

.search-engines {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.search-engine {
    padding: 8px 16px;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 25px;
    color: white;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.search-engine:hover {
    background: rgba(255, 255, 255, 0.3);
    color: white;
    text-decoration: none;
    transform: translateY(-2px);
}

/* 搜索引擎选中状态 */
.search-engine.selected {
    background: rgba(255, 255, 255, 0.9);
    color: var(--tblr-primary);
    border-color: rgba(255, 255, 255, 0.6);
    font-weight: 600;
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.search-engine.selected:hover {
    background: rgba(255, 255, 255, 1);
    color: var(--tblr-primary);
    transform: scale(1.08);
}

/* 左下角说明按钮 */
.info-button {
    position: absolute;
    bottom: 30px;
    left: 30px;
    z-index: 2;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    padding: 12px 20px;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.3s ease;
    user-select: none;
}

.info-button:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}

.info-button svg {
    transition: transform 0.3s ease;
}

.info-button:hover svg {
    transform: rotate(180deg);
}

.info-button-text {
    white-space: nowrap;
}

/* 滚动提示 */
.scroll-indicator {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    color: white;
    text-align: center;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateX(-50%) translateY(0);
    }
    40% {
        transform: translateX(-50%) translateY(-10px);
    }
    60% {
        transform: translateX(-50%) translateY(-5px);
    }
}

/* 导航部分样式 */
.navigation-section {
    min-height: 100vh;
    background: var(--tblr-bg-surface-secondary);
    position: relative;
}

/* 导航布局容器 */
.navigation-layout {
    display: flex;
    min-height: 100vh;
    position: relative;
}

/* 当侧边栏折叠时，导航布局需要调整 */
.navigation-layout:has(.navbar-sidebar.collapsed) {
    /* 侧边栏折叠时，内容区域占据全宽 */
}
.navigation-layout:has(.navbar-sidebar.collapsed) .content-area {
    margin-left: 0 !important;
    width: 100%;
}

/* 导航侧边栏样式 - 支持sticky定位 */
.navbar-sidebar {
    width: 300px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-right: 1px solid var(--tblr-border-color);
    transition: width 0.3s ease, margin-left 0.3s ease, top 0.3s ease, left 0.3s ease;
    flex-shrink: 0;
    position: relative;
    height: 100vh;
    /* 性能优化 */
    will-change: position, left, top;
    contain: layout style;
}

/* Sticky状态 - 当滚动超过搜索部分时，限制在导航部分内 */
.navbar-sidebar.sticky {
    position: sticky;
    top: 0;
    z-index: 1030;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
    /* 启用硬件加速 */
    transform: translateZ(0);
    backface-visibility: hidden;
    overflow: visible; /* 确保sticky状态下下拉菜单不被裁剪 */
    /* 确保只在导航部分内浮动 */
    align-self: flex-start;
}

/* Sticky状态下的侧边栏菜单高度调整 */
.navbar-sidebar.sticky .sidebar-menu {
    max-height: calc(100vh - 81px); /* sticky状态下减去brand区域高度 */
}

/* 使用sticky定位时内容区域不需要额外边距，因为侧边栏会占据正常文档流位置 */
.content-area.sidebar-sticky {
    /* sticky定位下不需要手动调整margin */
    transition: margin-left 0.3s ease;
    /* 性能优化 */
    will-change: margin-left;
}

/* 确保内容区域在任何状态下的正确定位 */
.content-area {
    margin-left: 0;
    transition: margin-left 0.3s ease;
}

/* 当侧边栏折叠时，无论什么状态都确保内容区域占据全宽 */
.navbar-sidebar.collapsed ~ .content-area,
.content-area.sidebar-collapsed {
    margin-left: 0 !important;
    transform: none !important;
}

.navbar-sidebar.collapsed {
    width: 0;
    margin-left: -300px;
    overflow: hidden;
    /* 确保折叠时完全脱离布局流 */
    position: absolute;
    left: -300px;
}

/* 当sticky且collapsed时的处理 - 脱离文档流以避免影响布局 */
.navbar-sidebar.sticky.collapsed {
    position: fixed;
    left: -300px;
    width: 300px;
    /* 重置margin避免双重偏移 */
    margin-left: 0;
}

.content-area.sidebar-sticky.sidebar-collapsed {
    /* collapsed状态下内容区域占据全宽 */
    margin-left: 0;
}

.sidebar-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    width: 300px;
}

/* 侧边栏品牌区域 */
.sidebar-brand {
    padding: 0px;
    border-bottom: 1px solid var(--tblr-border-color);
    /*background: var(--tblr-primary-lt);*/
    flex-shrink: 0;
}

.navbar-brand-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.sidebar-brand-text {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--tblr-body-color);
}

/* 侧边栏品牌容器 */
.sidebar-brand-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 侧边栏品牌图片样式 */
.sidebar-brand-image {
    width: auto;
    height: 100px;
    border-radius: 12px;
    object-fit: contain;
    display: block;
    transition: opacity 0.3s ease;
}

/* 懒加载占位符效果 */
.sidebar-brand-image.lazy-brand-image:not([src]) {
    opacity: 0;
    background: linear-gradient(90deg, 
        var(--tblr-bg-surface-tertiary) 25%, 
        var(--tblr-bg-surface) 50%, 
        var(--tblr-bg-surface-tertiary) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s ease-in-out infinite;
    min-width: 120px;
}

/* 懒加载完成后的淡入效果 */
.sidebar-brand-image.lazy-brand-image[src] {
    opacity: 1;
}

/* 图片完全加载后的状态 */
.sidebar-brand-image.lazy-brand-image.loaded {
    opacity: 1;
    animation: none;
    background: none;
}

/* 骨架屏加载动画 */
@keyframes skeleton-loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* 侧边栏品牌备用文字样式 */
.sidebar-brand-fallback {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--tblr-primary);
    text-align: center;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--tblr-primary-lt);
    padding: 0 20px;
    min-width: 120px;
}

/* 侧边栏菜单 - 添加独立滚动 */
.sidebar-menu {
    flex: 1;
    padding: 20px 0;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(100vh - 120px); /* 确保有明确的高度限制，减去brand区域高度 */
    /* 自定义滚动条样式 */
    scrollbar-width: thin;
    scrollbar-color: var(--tblr-primary-lt) transparent;
}

/* Webkit浏览器滚动条样式 */
.sidebar-menu::-webkit-scrollbar {
    width: 6px;
}

.sidebar-menu::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-menu::-webkit-scrollbar-thumb {
    background-color: var(--tblr-primary-lt);
    border-radius: 3px;
    transition: background-color 0.3s ease;
}

.sidebar-menu::-webkit-scrollbar-thumb:hover {
    background-color: var(--tblr-primary);
}

.navbar-nav {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nav-item {
    margin-bottom: 4px;
}

.nav-link {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    color: var(--tblr-body-color);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: all 0.3s ease;
    border-radius: 0;
    position: relative;
}

.nav-link:hover {
    background: var(--tblr-primary-lt);
    color: var(--tblr-primary);
    text-decoration: none;
}

.nav-link.active {
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--tblr-purple) 100%);
    color: white;
}

.nav-link-icon {
    margin-right: 12px;
    font-size: 1.1rem;
    width: 20px;
    text-align: center;
}

.nav-link-title {
    flex: 1;
}

/* 下拉菜单样式 - 兼容Bootstrap */
.navbar-sidebar .dropdown-menu {
    position: static !important;
    display: block;
    background: var(--tblr-bg-surface);
    border: none;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    padding: 0;
    transform: none !important;
    inset: auto !important;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

.navbar-sidebar .dropdown.show .dropdown-menu,
.navbar-sidebar .nav-item.show .dropdown-menu {
    max-height: none; /* 移除高度限制，允许完全展开 */
    overflow: visible; /* 确保内容可见 */
}

.navbar-sidebar .dropdown-item {
    padding: 10px 20px 10px 52px;
    color: var(--tblr-muted);
    font-size: 0.9rem;
    text-decoration: none;
    transition: all 0.3s ease;
    border-radius: 0;
    display: block;
}

.navbar-sidebar .dropdown-item:hover {
    background: var(--tblr-primary-lt);
    color: var(--tblr-body-color);
    text-decoration: none;
}

.navbar-sidebar .dropdown-item.active {
    background: var(--tblr-primary-lt);
    color: var(--tblr-primary);
}

/* 下拉箭头样式 */
.navbar-sidebar .nav-link.dropdown-toggle::after {
    margin-left: auto;
    transition: transform 0.3s ease;
}

.navbar-sidebar .dropdown.show .nav-link.dropdown-toggle::after,
.navbar-sidebar .nav-item.show .nav-link.dropdown-toggle::after {
    transform: rotate(180deg);
}

/* 侧边栏遮罩层（仅移动端使用） */
.navbar-sidebar-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    display: none;
}

.navbar-sidebar-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* 右侧浮动按钮组 */
.floating-buttons {
    position: fixed;
    top: 90%;
    right: 20px;
    transform: translateY(-50%);
    z-index: 1055;
    display: flex;
    flex-direction: column;
    gap: 15px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) translateX(100px);
    transition: all 0.3s ease;
}

.floating-buttons.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
}

/* 浮动按钮基础样式 */
.floating-sidebar-toggle,
.floating-back-to-top {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(var(--tblr-primary-rgb), 0.4);
    transition: all 0.3s ease;
    user-select: none;
}

/* 侧边栏切换按钮 */
.floating-sidebar-toggle {
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--tblr-purple) 100%);
}

.floating-sidebar-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(var(--tblr-primary-rgb), 0.6);
}

.floating-sidebar-toggle.active {
    background: linear-gradient(135deg, var(--tblr-red) 0%, var(--tblr-pink) 100%);
    box-shadow: 0 4px 15px rgba(var(--tblr-red-rgb), 0.4);
}

.floating-sidebar-toggle.active:hover {
    box-shadow: 0 6px 20px rgba(var(--tblr-red-rgb), 0.6);
}

/* 返回顶部按钮 */
.floating-back-to-top {
    background: linear-gradient(135deg, var(--candy-red) 0%, var(--candy-pink) 100%);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s ease;
}

.floating-back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.floating-back-to-top:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(var(--tblr-green-rgb), 0.6);
}

/* SVG图标动画 */
.floating-sidebar-toggle svg {
    transition: transform 0.3s ease;
}

.floating-sidebar-toggle.active svg {
    transform: rotate(90deg);
}

.floating-back-to-top svg {
    transition: transform 0.3s ease;
}

.floating-back-to-top:hover svg {
    transform: translateY(-2px);
}

/* 内容区域样式 */
.content-area {
    flex: 1;
    padding: 20px;
    transition: all 0.3s ease;
    min-height: 100vh;
    overflow-x: hidden;
}

.content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
    padding: 20px;
    background: var(--tblr-bg-surface);
    border-radius: var(--tblr-border-radius);
    box-shadow: var(--tblr-box-shadow-input);
    flex-wrap: wrap;
    gap: 15px;
}

.breadcrumb-nav {
    margin: 0;
    background: none;
    padding: 0;
}

/* 导航搜索框样式 */
.navigation-search {
    flex-shrink: 0;
    min-width: 300px;
}

.navigation-search-form {
    margin: 0;
}

.navigation-search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.navigation-search-input {
    width: 100%;
    padding: 10px 80px 10px 16px;
    font-size: 0.95rem;
    border: 1px solid var(--tblr-border-color);
    border-radius: var(--tblr-border-radius);
    background: var(--tblr-bg-surface);
    color: var(--tblr-body-color);
    transition: all 0.3s ease;
    outline: none;
}

.navigation-search-input:focus {
    border-color: var(--tblr-primary);
    box-shadow: 0 0 0 3px rgba(var(--tblr-primary-rgb), 0.1);
}

.navigation-search-input::placeholder {
    color: var(--tblr-muted);
}

.navigation-search-btn,
.navigation-search-clear {
    position: absolute;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--tblr-primary);
    border: none;
    border-radius: var(--tblr-border-radius);
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 2;
}

.navigation-search-clear {
    right: 42px;
    background: var(--tblr-muted);
    width: 32px;
    height: 32px;
    z-index: 1;
}

.navigation-search-btn:hover {
    background: var(--tblr-primary-darken);
    transform: translateY(-50%) scale(1.05);
}

.navigation-search-clear:hover {
    background: var(--tblr-red);
    transform: translateY(-50%) scale(1.05);
}

/* 搜索状态提示 */
.search-status {
    padding: 10px 20px;
    margin-bottom: 20px;
    background: var(--tblr-primary-lt);
    border: 1px solid var(--tblr-primary);
    border-radius: var(--tblr-border-radius);
    color: var(--tblr-primary);
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.search-status .search-keyword {
    font-weight: 600;
}

.search-status .search-result-count {
    color: var(--tblr-muted);
}

/* 搜索高亮样式 */
mark {
    background-color: rgba(var(--tblr-primary-rgb), 0.2);
    color: var(--tblr-primary);
    padding: 1px 2px;
    border-radius: 2px;
    font-weight: 600;
}

/* 使用说明模态框特殊样式 */
#infoModal .modal-body {
    max-height: 70vh;
    overflow-y: auto;
    padding: 1.5rem;
}

#infoModal .avatar.avatar-xl {
    width: 4rem;
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin: 0 auto;
}

#infoModal .card {
    border: 1px solid var(--tblr-border-color);
    transition: all 0.3s ease;
}

#infoModal .card:hover {
    border-color: var(--tblr-primary);
    box-shadow: 0 4px 12px rgba(var(--tblr-primary-rgb), 0.1);
    transform: translateY(-2px);
}

#infoModal kbd {
    background-color: var(--tblr-muted);
    color: white;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
}

/* 链接网格 */
.links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

.link-card {
    background: var(--tblr-bg-surface);
    border-radius: var(--tblr-border-radius-lg);
    padding: 20px;
    box-shadow: var(--tblr-box-shadow-input);
    transition: all 0.3s ease;
    border: 1px solid var(--tblr-border-color);
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    cursor: pointer;
    /* 懒加载默认状态 - 隐藏且向下偏移 */
    opacity: 0;
    transform: translateY(50px);
    visibility: hidden;
}

/* 懒加载进入视口后的显示状态 */
.link-card.lazy-loaded {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    animation: fadeInUp 0.6s ease-out;
}

/* 立即显示的链接卡片（非懒加载模式） */
.link-card.immediate {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    animation: fadeInUp 0.6s ease-out;
}

.link-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--tblr-box-shadow-lg);
    text-decoration: none;
    color: inherit;
}

.link-icon {
    width: 48px;
    height: 48px;
    background: var(--tblr-primary);
    border-radius: var(--tblr-border-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    flex-shrink: 0;
}

/* 糖果色主题下的链接图标渐变走马灯动画 */
@keyframes gradient-marquee {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* 糖果色主题的渐变走马灯效果 - 优先级最高 */
body[data-bs-theme-primary^="candy-"] .link-icon,
html[data-bs-theme-primary^="candy-"] .link-icon {
    background: linear-gradient(
        135deg, 
        var(--tblr-primary), 
        var(--gradient-secondary),
        var(--tblr-primary)
    ) !important;
    background-size: 200% 200% !important;
    animation: gradient-marquee 3s ease infinite !important;
}

.link-content {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.link-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--tblr-body-color);
    margin-bottom: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.link-description {
    font-size: 0.9rem;
    color: var(--tblr-muted);
    line-height: 1.4;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.link-url {
    display: none;
}

/* Tooltip样式 */
.link-tooltip {
    position: absolute;
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 12px 16px;
    border-radius: var(--tblr-border-radius);
    font-size: 0.9rem;
    line-height: 1.4;
    z-index: 1060;
    max-width: 300px;
    word-wrap: break-word;
    box-shadow: var(--tblr-box-shadow-lg);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    pointer-events: none;
}

.link-tooltip.show {
    opacity: 1;
    visibility: visible;
}

/* Tooltip箭头 - 默认在tooltip底部（tooltip显示在鼠标上方时，箭头指向下方） */
.link-tooltip::before {
    content: '';
    position: absolute;
    bottom: -6px;
    left: var(--arrow-left, 50%);
    transform: translateX(-50%);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid rgba(0, 0, 0, 0.9);
    transition: left 0.1s ease;
}

/* Tooltip在鼠标下方时的箭头（在tooltip顶部，箭头指向上方） */
.link-tooltip.tooltip-bottom::before {
    top: -6px;
    bottom: auto;
    left: var(--arrow-left, 50%);
    border-top: none;
    border-bottom: 6px solid rgba(0, 0, 0, 0.9);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
}

.link-tooltip-title {
    font-weight: 600;
    margin-bottom: 4px;
}

.link-tooltip-description {
    font-weight: normal;
    opacity: 0.9;
}

/* 已移除链接元信息样式（link-meta、link-category、link-clicks） */

/* 懒加载更多状态 */
.loading-more {
    text-align: center;
    padding: 30px;
    color: var(--tblr-muted);
    grid-column: 1 / -1;
    user-select: none;
}

.loading-more .spinner {
    width: 30px;
    height: 30px;
    border-width: 3px;
    margin-bottom: 10px;
}

/* 加载动画 */
.loading {
    text-align: center;
    padding: 40px;
    color: var(--tblr-muted);
    user-select: none;
}

.spinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 4px solid var(--tblr-border-color);
    border-top: 4px solid var(--tblr-primary);
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-bottom: 15px;
}

.loading div, .loading-more div {
    font-weight: 500;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 平滑过渡效果 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 延迟动画，让懒加载的卡片有错落感 */
.link-card:nth-child(1) { animation-delay: 0.1s; }
.link-card:nth-child(2) { animation-delay: 0.2s; }
.link-card:nth-child(3) { animation-delay: 0.3s; }
.link-card:nth-child(4) { animation-delay: 0.4s; }
.link-card:nth-child(5) { animation-delay: 0.5s; }

/* 面包屑中的首页链接样式 */
.breadcrumb-nav .show-all-links-btn {
    color: var(--tblr-primary);
    text-decoration: none;
    transition: color 0.3s ease;
}

.breadcrumb-nav .show-all-links-btn:hover {
    color: var(--tblr-primary-darken);
    text-decoration: none;
}

/* 空状态样式增强 */
.text-center.py-5 {
    padding: 60px 20px !important;
}

.text-center.py-5 i {
    opacity: 0.3;
    margin-bottom: 20px;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .search-title {
        font-size: 2rem;
    }
    
    .search-subtitle {
        font-size: 1rem;
    }
    
    /* 移动端：改为覆盖模式，禁用sticky功能 */
    .navigation-layout {
        position: relative;
    }
    
    .navbar-sidebar {
        position: fixed;
        top: 0;
        left: -300px;
        width: 280px;
        height: 100vh;
        z-index: 1050;
        background: var(--tblr-bg-surface);
        transition: left 0.3s ease;
    }
    
    /* 移动端：强制清除sticky状态，使用fixed定位 */
    .navbar-sidebar.sticky {
        position: fixed !important;
        left: -280px !important;
        top: 0 !important;
        z-index: 1050 !important;
        height: 100vh !important;
    }
    
    .navbar-sidebar.active {
        left: 0;
    }
    
    .navbar-sidebar.active.sticky {
        left: 0 !important;
    }
    
    .navbar-sidebar.collapsed {
        width: 280px;
        margin-left: 0;
        left: -280px;
        /* 移动端保持fixed定位 */
        position: fixed;
    }
    
    .sidebar-container {
        width: 280px;
    }
    
    /* 移动端侧边栏菜单滚动调整 */
    .navbar-sidebar .sidebar-menu {
        max-height: calc(100vh - 81px); /* 移动端菜单高度 */
    }
    
    /* 移动端：内容区域始终全宽，不受sticky影响 */
    .content-area,
    .content-area.sidebar-sticky,
    .content-area.sidebar-sticky.sidebar-collapsed {
        width: 100% !important;
        margin-left: 0 !important;
        transform: none !important;
    }
    
    .navbar-sidebar-overlay {
        display: block;
    }
    
    .floating-buttons {
        right: 15px;
        gap: 12px;
    }
    
    .floating-sidebar-toggle,
    .floating-back-to-top {
        width: 45px;
        height: 45px;
    }
    
    .links-grid {
        grid-template-columns: 1fr;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        gap: 15px;
    }
    
    .link-card {
        gap: 12px;
        padding: 16px;
    }
    
    .link-icon {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
    
    .link-title {
        font-size: 1rem;
    }
    
    .link-description {
        font-size: 0.85rem;
    }
    
    .search-engines {
        gap: 10px;
    }
    
    .search-engine {
        font-size: 0.8rem;
        padding: 6px 12px;
    }
    
    /* 移动端说明按钮调整 */
    .info-button {
        left: 15px;
        bottom: 20px;
        padding: 10px 16px;
        font-size: 0.8rem;
    }
    
    .info-button-text {
        display: none; /* 移动端隐藏文字，只显示图标 */
    }
    
    /* 移动端导航搜索框样式调整 */
    .navigation-search {
        min-width: 100%;
        width: 100%;
        order: 2; /* 在移动端放到面包屑下方 */
    }
    
    .content-header {
        flex-direction: column;
        align-items: stretch;
    }
    
    #breadcrumb {
        order: 1;
    }
}

@media (max-width: 576px) {
    .loading-more {
        padding: 20px;
    }
    
    .floating-buttons {
        right: 10px;
        gap: 10px;
    }
    
    .floating-sidebar-toggle,
    .floating-back-to-top {
        width: 40px;
        height: 40px;
    }
    
    .floating-sidebar-toggle svg,
    .floating-back-to-top svg {
        width: 20px;
        height: 20px;
    }
    
    .link-tooltip {
        max-width: 250px;
        font-size: 0.8rem;
        padding: 10px 12px;
    }
}

@media (min-width: 768px) {
    /* 桌面端默认显示侧边栏，启用sticky功能 */
    .navbar-sidebar {
        position: relative;
    }
    
    .navbar-sidebar-overlay {
        display: none;
    }
    
    /* 桌面端sticky状态的内容区域调整 */
    .content-area.sidebar-sticky {
        /* sticky定位下无需特殊处理 */
        transition: margin-left 0.3s ease;
    }
    
    .content-area.sidebar-sticky.sidebar-collapsed {
        /* collapsed状态下内容区域占据全宽 */
        margin-left: 0;
        transition: margin-left 0.3s ease;
    }
}

/* 确保在大屏幕上有合适的最小宽度 */
@media (min-width: 1200px) {
    .content-area {
        min-width: 800px;
    }
    
    .navbar-sidebar {
        width: 320px;
    }
    
    .sidebar-container {
        width: 320px;
    }
    
    .navbar-sidebar.collapsed {
        margin-left: -320px;
        /* 大屏幕下也确保折叠时脱离布局流 */
        position: absolute;
        left: -320px;
    }
    
    /* 大屏幕上sticky定位时的内容区域调整 */
    .content-area.sidebar-sticky {
        /* sticky定位下侧边栏占据正常流位置，无需额外margin */
    }
    
    /* 大屏幕上sticky且collapsed时的处理 */
    .navbar-sidebar.sticky.collapsed {
        position: fixed;
        left: -320px;
        width: 320px;
        margin-left: 0;
    }
}

/* 确保Bootstrap下拉菜单功能正常 */
.navbar-sidebar .dropdown-menu.show {
    max-height: none !important; /* 移除高度限制 */
    overflow: visible !important; /* 确保内容可见 */
}

/* 修复可能的z-index问题 */
.navbar-sidebar .dropdown {
    position: relative;
}

.navbar-sidebar .dropdown-menu {
    z-index: 1020;
}

/* 🍭 糖果色主题 - 明亮鲜艳的配色方案 */

/* ================================
   经典主题色变量定义
   ================================ */

/* 经典天空蓝主题 */
[data-bs-theme-primary="blue"] {
    --tblr-primary: #1E88E5;
    --tblr-primary-rgb: 30, 136, 229;
}

/* 经典靛青蓝主题 */
[data-bs-theme-primary="indigo"] {
    --tblr-primary: #3F51B5;
    --tblr-primary-rgb: 63, 81, 181;
}

/* 经典优雅紫主题 */
[data-bs-theme-primary="purple"] {
    --tblr-primary: #9C27B0;
    --tblr-primary-rgb: 156, 39, 176;
}

/* 经典樱花粉主题 */
[data-bs-theme-primary="pink"] {
    --tblr-primary: #EC407A;
    --tblr-primary-rgb: 236, 64, 122;
}

/* 经典蜜桃粉主题 */
[data-bs-theme-primary="light-pink"] {
    --tblr-primary: #F48FB1;
    --tblr-primary-rgb: 244, 143, 177;
}

/* 经典活力红主题 */
[data-bs-theme-primary="red"] {
    --tblr-primary: #E53935;
    --tblr-primary-rgb: 229, 57, 53;
}

/* 经典日落橙主题 */
[data-bs-theme-primary="orange"] {
    --tblr-primary: #FB8C00;
    --tblr-primary-rgb: 251, 140, 0;
}

/* 经典阳光金主题 */
[data-bs-theme-primary="yellow"] {
    --tblr-primary: #FFB300;
    --tblr-primary-rgb: 255, 179, 0;
}

/* 经典翡翠绿主题 */
[data-bs-theme-primary="green"] {
    --tblr-primary: #43A047;
    --tblr-primary-rgb: 67, 160, 71;
}

/* 经典碧海青主题 */
[data-bs-theme-primary="teal"] {
    --tblr-primary: #00897B;
    --tblr-primary-rgb: 0, 137, 123;
}

/* 经典冰川蓝主题 */
[data-bs-theme-primary="cyan"] {
    --tblr-primary: #00ACC1;
    --tblr-primary-rgb: 0, 172, 193;
}

/* ================================
   糖果色主题变量定义
   ================================ */

/* 糖果粉色主题 - 充满活力的粉色 */
[data-bs-theme-primary=candy-pink] {
    --tblr-primary: var(--candy-pink);
    --tblr-primary-rgb: var(--candy-pink-rgb);
}

/* 糖果橙色主题 - 温暖的橙色 */
[data-bs-theme-primary=candy-orange] {
    --tblr-primary: var(--candy-orange);
    --tblr-primary-rgb: var(--candy-orange-rgb);
}

/* 糖果黄色主题 - 阳光般的黄色 */
[data-bs-theme-primary=candy-yellow] {
    --tblr-primary: var(--candy-yellow);
    --tblr-primary-rgb: var(--candy-yellow-rgb);
}

/* 糖果绿色主题 - 清新的绿色 */
[data-bs-theme-primary=candy-green] {
    --tblr-primary: var(--candy-green);
    --tblr-primary-rgb: var(--candy-green-rgb);
}

/* 糖果蓝色主题 - 深邃的蓝色 */
[data-bs-theme-primary=candy-blue] {
    --tblr-primary: var(--candy-blue);
    --tblr-primary-rgb: var(--candy-blue-rgb);
}

/* 糖果紫色主题 - 梦幻的紫色 */
[data-bs-theme-primary=candy-purple] {
    --tblr-primary: var(--candy-purple);
    --tblr-primary-rgb: var(--candy-purple-rgb);
}

/* 糖果红色主题 - 热情的红色 */
[data-bs-theme-primary=candy-red] {
    --tblr-primary: var(--candy-red);
    --tblr-primary-rgb: var(--candy-red-rgb);
}

/* 糖果青色主题 - 电光青色 */
[data-bs-theme-primary=candy-cyan] {
    --tblr-primary: var(--candy-cyan);
    --tblr-primary-rgb: var(--candy-cyan-rgb);
}

/* 糖果薄荷主题 - 清凉的薄荷色 */
[data-bs-theme-primary=candy-mint] {
    --tblr-primary: var(--candy-mint);
    --tblr-primary-rgb: var(--candy-mint-rgb);
}

/* 糖果珊瑚主题 - 温暖的珊瑚色 */
[data-bs-theme-primary=candy-coral] {
    --tblr-primary: var(--candy-coral);
    --tblr-primary-rgb: var(--candy-coral-rgb);
}

/* 糖果色主题的特殊效果增强 */
[data-bs-theme-primary^="candy-"] {
    /* 增强渐变效果 */
    --tblr-primary-lt: color-mix(in srgb, var(--tblr-primary) 15%, white);
    --tblr-primary-darken: color-mix(in srgb, var(--tblr-primary) 80%, black);
}

/* 糖果色主题专用渐变色定义 - 现代配色方案 */
[data-bs-theme-primary="candy-pink"] {
    --gradient-secondary: #C865C8; /* 优雅紫 */
    --gradient-tertiary: #FF8787; /* 柔和红 */
}

[data-bs-theme-primary="candy-orange"] {
    --gradient-secondary: #FFA94D; /* 温暖金 */
    --gradient-tertiary: #FFD93D; /* 明快黄 */
}

[data-bs-theme-primary="candy-yellow"] {
    --gradient-secondary: #FFA94D; /* 活力橙 */
    --gradient-tertiary: #FFD8A8; /* 柔和杏 */
}

[data-bs-theme-primary="candy-green"] {
    --gradient-secondary: #51CF66; /* 清新绿 */
    --gradient-tertiary: #96F2D7; /* 薄荷绿 */
}

[data-bs-theme-primary="candy-blue"] {
    --gradient-secondary: #748FFC; /* 梦幻紫蓝 */
    --gradient-tertiary: #91A7FF; /* 淡雅蓝紫 */
}

[data-bs-theme-primary="candy-purple"] {
    --gradient-secondary: #D0BFFF; /* 浪漫淡紫 */
    --gradient-tertiary: #FFD8FF; /* 粉紫 */
}

[data-bs-theme-primary="candy-red"] {
    --gradient-secondary: #FF8787; /* 珊瑚红 */
    --gradient-tertiary: #FFA8A8; /* 柔粉 */
}

[data-bs-theme-primary="candy-cyan"] {
    --gradient-secondary: #66D9E8; /* 清澈青 */
    --gradient-tertiary: #96F2D7; /* 薄荷 */
}

[data-bs-theme-primary="candy-mint"] {
    --gradient-secondary: #96F2D7; /* 薄荷 */
    --gradient-tertiary: #C3FAE8; /* 淡薄荷 */
}

[data-bs-theme-primary="candy-coral"] {
    --gradient-secondary: #FFD8A8; /* 柔和杏 */
    --gradient-tertiary: #FFE3E3; /* 浅粉 */
}

/* 糖果色主题下的搜索区域特殊效果 - 优化渐变搭配 */
[data-bs-theme-primary^="candy-"] .search-section {
    background: linear-gradient(135deg, 
        var(--tblr-primary) 0%, 
        var(--gradient-secondary) 50%,
        var(--gradient-tertiary) 100%);
    background-size: 400% 400%;
    animation: candyGradient 12s ease infinite;
}

/* 糖果色主题下有背景图时禁用动画，保持背景图固定 */
[data-bs-theme-primary^="candy-"] .search-section {
    /* 当有背景图时，通过JavaScript检测并禁用动画 */
}

/* 专门用于有背景图的糖果色主题搜索区域 */
.search-section.has-background-image {
    animation: none !important; /* 禁用动画 */
    background-size: cover !important;
    background-position: center center !important;
    background-attachment: scroll !important;
}

/* 优化糖果色渐变动画 - 更慢更平滑 */
@keyframes candyGradient {
    0% { background-position: 0% 50%; }
    25% { background-position: 100% 50%; }
    50% { background-position: 100% 100%; }
    75% { background-position: 0% 100%; }
    100% { background-position: 0% 50%; }
}

/* 糖果色主题下的导航链接激活状态 - 优化渐变 */
[data-bs-theme-primary^="candy-"] .nav-link.active {
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--gradient-secondary) 100%);
    color: white;
}

/* 糖果色主题下的链接卡片特殊效果 */
[data-bs-theme-primary^="candy-"] .link-card:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 20px 40px rgba(var(--tblr-primary-rgb), 0.2);
    border-color: var(--tblr-primary);
}

/* 糖果色主题下的按钮发光效果 */
[data-bs-theme-primary^="candy-"] .floating-sidebar-toggle,
[data-bs-theme-primary^="candy-"] .floating-back-to-top {
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--gradient-secondary) 100%);
    box-shadow: 0 0 20px rgba(var(--tblr-primary-rgb), 0.4),
                0 4px 15px rgba(var(--tblr-primary-rgb), 0.3);
}

[data-bs-theme-primary^="candy-"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary^="candy-"] .floating-back-to-top:hover {
    box-shadow: 0 0 30px rgba(var(--tblr-primary-rgb), 0.6),
                0 6px 20px rgba(var(--tblr-primary-rgb), 0.4);
}

/* 糖果色主题下的说明按钮特殊效果 */
[data-bs-theme-primary^="candy-"] .info-button {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 15px rgba(var(--tblr-primary-rgb), 0.2);
}

[data-bs-theme-primary^="candy-"] .info-button:hover {
    background: rgba(255, 255, 255, 0.3);
    border-color: rgba(255, 255, 255, 0.5);
    box-shadow: 0 8px 30px rgba(var(--tblr-primary-rgb), 0.4);
    transform: translateY(-3px) scale(1.05);
}

/* 糖果色主题下的footer特殊效果 */
[data-bs-theme-primary^="candy-"] .footer-social-link:hover {
    box-shadow: 0 4px 15px rgba(var(--tblr-primary-rgb), 0.3);
}

[data-bs-theme-primary^="candy-"] .footer-links-title {
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--gradient-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    border-bottom-color: var(--tblr-primary);
}

/* 为糖果色主题添加额外的背景色类 */
[data-bs-theme-primary^="candy-"] .bg-candy-pink { background-color: var(--candy-pink) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-orange { background-color: var(--candy-orange) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-yellow { background-color: var(--candy-yellow) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-green { background-color: var(--candy-green) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-blue { background-color: var(--candy-blue) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-purple { background-color: var(--candy-purple) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-red { background-color: var(--candy-red) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-cyan { background-color: var(--candy-cyan) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-mint { background-color: var(--candy-mint) !important; }
[data-bs-theme-primary^="candy-"] .bg-candy-coral { background-color: var(--candy-coral) !important; }

/* ================================
   经典主题 - 单色设计
   ================================ */

/* 经典主题：默认单色背景，但支持背景图片覆盖 */
[data-bs-theme-primary="blue"] .search-section,
[data-bs-theme-primary="indigo"] .search-section,
[data-bs-theme-primary="purple"] .search-section,
[data-bs-theme-primary="pink"] .search-section,
[data-bs-theme-primary="light-pink"] .search-section,
[data-bs-theme-primary="red"] .search-section,
[data-bs-theme-primary="orange"] .search-section,
[data-bs-theme-primary="yellow"] .search-section,
[data-bs-theme-primary="green"] .search-section,
[data-bs-theme-primary="teal"] .search-section,
[data-bs-theme-primary="cyan"] .search-section {
    background: var(--tblr-primary);
    animation: none;
}

/* 经典主题：当有背景图片时，背景图片优先显示 */
[data-bs-theme-primary="blue"] .search-section.has-background-image,
[data-bs-theme-primary="indigo"] .search-section.has-background-image,
[data-bs-theme-primary="purple"] .search-section.has-background-image,
[data-bs-theme-primary="pink"] .search-section.has-background-image,
[data-bs-theme-primary="light-pink"] .search-section.has-background-image,
[data-bs-theme-primary="red"] .search-section.has-background-image,
[data-bs-theme-primary="orange"] .search-section.has-background-image,
[data-bs-theme-primary="yellow"] .search-section.has-background-image,
[data-bs-theme-primary="green"] .search-section.has-background-image,
[data-bs-theme-primary="teal"] .search-section.has-background-image,
[data-bs-theme-primary="cyan"] .search-section.has-background-image {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
}

/* 经典主题：导航链接激活状态为单色 */
[data-bs-theme-primary="blue"] .nav-link.active,
[data-bs-theme-primary="indigo"] .nav-link.active,
[data-bs-theme-primary="purple"] .nav-link.active,
[data-bs-theme-primary="pink"] .nav-link.active,
[data-bs-theme-primary="light-pink"] .nav-link.active,
[data-bs-theme-primary="red"] .nav-link.active,
[data-bs-theme-primary="orange"] .nav-link.active,
[data-bs-theme-primary="yellow"] .nav-link.active,
[data-bs-theme-primary="green"] .nav-link.active,
[data-bs-theme-primary="teal"] .nav-link.active,
[data-bs-theme-primary="cyan"] .nav-link.active {
    background: var(--tblr-primary) !important;
    color: white;
}

/* 经典主题：浮动按钮为单色 */
[data-bs-theme-primary="blue"] .floating-sidebar-toggle,
[data-bs-theme-primary="indigo"] .floating-sidebar-toggle,
[data-bs-theme-primary="purple"] .floating-sidebar-toggle,
[data-bs-theme-primary="pink"] .floating-sidebar-toggle,
[data-bs-theme-primary="light-pink"] .floating-sidebar-toggle,
[data-bs-theme-primary="red"] .floating-sidebar-toggle,
[data-bs-theme-primary="orange"] .floating-sidebar-toggle,
[data-bs-theme-primary="yellow"] .floating-sidebar-toggle,
[data-bs-theme-primary="green"] .floating-sidebar-toggle,
[data-bs-theme-primary="teal"] .floating-sidebar-toggle,
[data-bs-theme-primary="cyan"] .floating-sidebar-toggle {
    background: var(--tblr-primary) !important;
}

[data-bs-theme-primary="blue"] .floating-back-to-top,
[data-bs-theme-primary="indigo"] .floating-back-to-top,
[data-bs-theme-primary="purple"] .floating-back-to-top,
[data-bs-theme-primary="pink"] .floating-back-to-top,
[data-bs-theme-primary="light-pink"] .floating-back-to-top,
[data-bs-theme-primary="red"] .floating-back-to-top,
[data-bs-theme-primary="orange"] .floating-back-to-top,
[data-bs-theme-primary="yellow"] .floating-back-to-top,
[data-bs-theme-primary="green"] .floating-back-to-top,
[data-bs-theme-primary="teal"] .floating-back-to-top,
[data-bs-theme-primary="cyan"] .floating-back-to-top {
    background: var(--tblr-primary) !important;
}

/* 经典主题：链接图标为单色 */
[data-bs-theme-primary="blue"] .link-icon,
[data-bs-theme-primary="indigo"] .link-icon,
[data-bs-theme-primary="purple"] .link-icon,
[data-bs-theme-primary="pink"] .link-icon,
[data-bs-theme-primary="light-pink"] .link-icon,
[data-bs-theme-primary="red"] .link-icon,
[data-bs-theme-primary="orange"] .link-icon,
[data-bs-theme-primary="yellow"] .link-icon,
[data-bs-theme-primary="green"] .link-icon,
[data-bs-theme-primary="teal"] .link-icon,
[data-bs-theme-primary="cyan"] .link-icon {
    background: var(--tblr-primary) !important;
}

/* 经典主题：导航侧边栏悬浮效果 */
[data-bs-theme-primary="blue"] .nav-link:hover,
[data-bs-theme-primary="indigo"] .nav-link:hover,
[data-bs-theme-primary="purple"] .nav-link:hover,
[data-bs-theme-primary="pink"] .nav-link:hover,
[data-bs-theme-primary="light-pink"] .nav-link:hover,
[data-bs-theme-primary="red"] .nav-link:hover,
[data-bs-theme-primary="orange"] .nav-link:hover,
[data-bs-theme-primary="yellow"] .nav-link:hover,
[data-bs-theme-primary="green"] .nav-link:hover,
[data-bs-theme-primary="teal"] .nav-link:hover,
[data-bs-theme-primary="cyan"] .nav-link:hover {
    background: color-mix(in srgb, var(--tblr-primary) 15%, white) !important;
    color: var(--tblr-primary) !important;
}

/* 经典主题：下拉菜单项悬浮效果 */
[data-bs-theme-primary="blue"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="indigo"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="purple"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="pink"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="light-pink"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="red"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="orange"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="yellow"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="green"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="teal"] .navbar-sidebar .dropdown-item:hover,
[data-bs-theme-primary="cyan"] .navbar-sidebar .dropdown-item:hover {
    background: color-mix(in srgb, var(--tblr-primary) 15%, white) !important;
    color: var(--tblr-primary) !important;
}

/* 经典主题：下拉菜单项激活状态 */
[data-bs-theme-primary="blue"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="indigo"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="purple"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="pink"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="light-pink"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="red"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="orange"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="yellow"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="green"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="teal"] .navbar-sidebar .dropdown-item.active,
[data-bs-theme-primary="cyan"] .navbar-sidebar .dropdown-item.active {
    background: color-mix(in srgb, var(--tblr-primary) 15%, white) !important;
    color: var(--tblr-primary) !important;
}

/* 经典主题：滚动条颜色 */
[data-bs-theme-primary="blue"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="indigo"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="purple"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="pink"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="light-pink"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="red"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="orange"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="yellow"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="green"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="teal"] .sidebar-menu::-webkit-scrollbar-thumb,
[data-bs-theme-primary="cyan"] .sidebar-menu::-webkit-scrollbar-thumb {
    background-color: color-mix(in srgb, var(--tblr-primary) 20%, white) !important;
}

[data-bs-theme-primary="blue"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="indigo"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="purple"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="pink"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="light-pink"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="red"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="orange"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="yellow"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="green"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="teal"] .sidebar-menu::-webkit-scrollbar-thumb:hover,
[data-bs-theme-primary="cyan"] .sidebar-menu::-webkit-scrollbar-thumb:hover {
    background-color: var(--tblr-primary) !important;
}

/* 经典主题：滚动条Firefox样式 */
[data-bs-theme-primary="blue"] .sidebar-menu,
[data-bs-theme-primary="indigo"] .sidebar-menu,
[data-bs-theme-primary="purple"] .sidebar-menu,
[data-bs-theme-primary="pink"] .sidebar-menu,
[data-bs-theme-primary="light-pink"] .sidebar-menu,
[data-bs-theme-primary="red"] .sidebar-menu,
[data-bs-theme-primary="orange"] .sidebar-menu,
[data-bs-theme-primary="yellow"] .sidebar-menu,
[data-bs-theme-primary="green"] .sidebar-menu,
[data-bs-theme-primary="teal"] .sidebar-menu,
[data-bs-theme-primary="cyan"] .sidebar-menu {
    scrollbar-color: color-mix(in srgb, var(--tblr-primary) 20%, white) transparent !important;
}

/* 经典主题：footer标题为单色 */
[data-bs-theme-primary="blue"] .footer-links-title,
[data-bs-theme-primary="indigo"] .footer-links-title,
[data-bs-theme-primary="purple"] .footer-links-title,
[data-bs-theme-primary="pink"] .footer-links-title,
[data-bs-theme-primary="light-pink"] .footer-links-title,
[data-bs-theme-primary="red"] .footer-links-title,
[data-bs-theme-primary="orange"] .footer-links-title,
[data-bs-theme-primary="yellow"] .footer-links-title,
[data-bs-theme-primary="green"] .footer-links-title,
[data-bs-theme-primary="teal"] .footer-links-title,
[data-bs-theme-primary="cyan"] .footer-links-title {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
    color: var(--tblr-primary) !important;
}

/* 经典主题：移除特殊发光效果 */
[data-bs-theme-primary="blue"] .floating-sidebar-toggle,
[data-bs-theme-primary="blue"] .floating-back-to-top,
[data-bs-theme-primary="indigo"] .floating-sidebar-toggle,
[data-bs-theme-primary="indigo"] .floating-back-to-top,
[data-bs-theme-primary="purple"] .floating-sidebar-toggle,
[data-bs-theme-primary="purple"] .floating-back-to-top,
[data-bs-theme-primary="pink"] .floating-sidebar-toggle,
[data-bs-theme-primary="pink"] .floating-back-to-top,
[data-bs-theme-primary="light-pink"] .floating-sidebar-toggle,
[data-bs-theme-primary="light-pink"] .floating-back-to-top,
[data-bs-theme-primary="red"] .floating-sidebar-toggle,
[data-bs-theme-primary="red"] .floating-back-to-top,
[data-bs-theme-primary="orange"] .floating-sidebar-toggle,
[data-bs-theme-primary="orange"] .floating-back-to-top,
[data-bs-theme-primary="yellow"] .floating-sidebar-toggle,
[data-bs-theme-primary="yellow"] .floating-back-to-top,
[data-bs-theme-primary="green"] .floating-sidebar-toggle,
[data-bs-theme-primary="green"] .floating-back-to-top,
[data-bs-theme-primary="teal"] .floating-sidebar-toggle,
[data-bs-theme-primary="teal"] .floating-back-to-top,
[data-bs-theme-primary="cyan"] .floating-sidebar-toggle,
[data-bs-theme-primary="cyan"] .floating-back-to-top {
    box-shadow: 0 4px 15px rgba(var(--tblr-primary-rgb), 0.4) !important;
}

[data-bs-theme-primary="blue"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="blue"] .floating-back-to-top:hover,
[data-bs-theme-primary="indigo"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="indigo"] .floating-back-to-top:hover,
[data-bs-theme-primary="purple"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="purple"] .floating-back-to-top:hover,
[data-bs-theme-primary="pink"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="pink"] .floating-back-to-top:hover,
[data-bs-theme-primary="light-pink"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="light-pink"] .floating-back-to-top:hover,
[data-bs-theme-primary="red"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="red"] .floating-back-to-top:hover,
[data-bs-theme-primary="orange"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="orange"] .floating-back-to-top:hover,
[data-bs-theme-primary="yellow"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="yellow"] .floating-back-to-top:hover,
[data-bs-theme-primary="green"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="green"] .floating-back-to-top:hover,
[data-bs-theme-primary="teal"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="teal"] .floating-back-to-top:hover,
[data-bs-theme-primary="cyan"] .floating-sidebar-toggle:hover,
[data-bs-theme-primary="cyan"] .floating-back-to-top:hover {
    box-shadow: 0 6px 20px rgba(var(--tblr-primary-rgb), 0.6) !important;
}

/* 经典主题：说明按钮样式简化 */
[data-bs-theme-primary="blue"] .info-button,
[data-bs-theme-primary="indigo"] .info-button,
[data-bs-theme-primary="purple"] .info-button,
[data-bs-theme-primary="pink"] .info-button,
[data-bs-theme-primary="light-pink"] .info-button,
[data-bs-theme-primary="red"] .info-button,
[data-bs-theme-primary="orange"] .info-button,
[data-bs-theme-primary="yellow"] .info-button,
[data-bs-theme-primary="green"] .info-button,
[data-bs-theme-primary="teal"] .info-button,
[data-bs-theme-primary="cyan"] .info-button {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

[data-bs-theme-primary="blue"] .info-button:hover,
[data-bs-theme-primary="indigo"] .info-button:hover,
[data-bs-theme-primary="purple"] .info-button:hover,
[data-bs-theme-primary="pink"] .info-button:hover,
[data-bs-theme-primary="light-pink"] .info-button:hover,
[data-bs-theme-primary="red"] .info-button:hover,
[data-bs-theme-primary="orange"] .info-button:hover,
[data-bs-theme-primary="yellow"] .info-button:hover,
[data-bs-theme-primary="green"] .info-button:hover,
[data-bs-theme-primary="teal"] .info-button:hover,
[data-bs-theme-primary="cyan"] .info-button:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
    transform: translateY(-2px) !important;
}

/* ======================
   页面底部样式
   ====================== */

.footer {
    background: var(--tblr-bg-surface);
    border-top: 1px solid var(--tblr-border-color);
    margin-top: 60px;
    padding: 40px 0 20px;
    color: var(--tblr-body-color);
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.footer-content {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 40px;
    margin-bottom: 30px;
}

/* 左侧品牌区域 */
.footer-left {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.footer-brand-text {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--tblr-body-color);
}

.footer-description {
    color: var(--tblr-muted);
    line-height: 1.6;
    margin: 0;
    max-width: 350px;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.footer-social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--tblr-bg-surface-tertiary);
    border: 1px solid var(--tblr-border-color);
    border-radius: var(--tblr-border-radius);
    color: var(--tblr-muted);
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 1.1rem;
}

.footer-social-link:hover {
    background: var(--tblr-primary);
    border-color: var(--tblr-primary);
    color: white;
    transform: translateY(-2px);
    text-decoration: none;
}

/* 右侧链接区域 */
.footer-right {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.footer-links-group {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.footer-links-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--tblr-body-color);
    margin: 0 0 10px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--tblr-primary);
    display: inline-block;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.footer-links li {
    margin: 0;
}

.footer-links a {
    color: var(--tblr-muted);
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    display: inline-block;
    padding: 4px 0;
}

.footer-links a:hover {
    color: var(--tblr-primary);
    text-decoration: none;
    transform: translateX(5px);
}

/* 底部版权区域 */
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid var(--tblr-border-color);
    flex-wrap: wrap;
    gap: 15px;
}

.footer-copyright p {
    margin: 0;
    color: var(--tblr-muted);
    font-size: 0.9rem;
}

.footer-meta {
    color: var(--tblr-muted);
    font-size: 0.85rem;
}

/* 深色主题下的footer样式调整 */
[data-bs-theme="dark"] .footer {
    background: var(--tblr-dark);
    border-top-color: var(--tblr-border-color-dark);
}

/* 糖果色主题下的说明按钮特殊效果 */
[data-bs-theme-primary^="candy-"] .info-button {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 15px rgba(var(--tblr-primary-rgb), 0.2);
}

[data-bs-theme-primary^="candy-"] .info-button:hover {
    background: rgba(255, 255, 255, 0.3);
    border-color: rgba(255, 255, 255, 0.5);
    box-shadow: 0 8px 30px rgba(var(--tblr-primary-rgb), 0.4);
    transform: translateY(-3px) scale(1.05);
}

/* 糖果色主题下的footer特殊效果 */
[data-bs-theme-primary^="candy-"] .footer-social-link:hover {
    box-shadow: 0 4px 15px rgba(var(--tblr-primary-rgb), 0.3);
}

[data-bs-theme-primary^="candy-"] .footer-links-title {
    background: linear-gradient(135deg, var(--tblr-primary) 0%, var(--gradient-secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    border-bottom-color: var(--tblr-primary);
}

/* 响应式设计 */
@media (max-width: 768px) {
    .footer {
        padding: 30px 0 15px;
        margin-top: 40px;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
    }
    
    .footer-right {
        grid-template-columns: 1fr;
        gap: 25px;
        text-align: left;
    }
    
    .footer-social {
        justify-content: center;
    }
    
    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
    
    .footer-description {
        max-width: none;
    }
}

@media (max-width: 576px) {
    .footer-container {
        padding: 0 15px;
    }
    
    .footer-content {
        gap: 25px;
    }
    
    .footer-right {
        gap: 20px;
    }
    
    .footer-social-link {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }
}

/* 强制覆盖Tabler框架的margin-left calc值 */
@media (min-width: 992px) {
    :root, :host {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
} 

/* .biu 类样式 - 边框色为主题色 */
.biu {
    border-color: var(--tblr-primary) !important;
}

/* 确保边框在不同主题下都能正确显示 */
.biu {
    border-style: solid;
    border-width: 1px;
    transition: border-color 0.3s ease;
}

/* 糖果色主题下的特殊效果 */
[data-bs-theme-primary^="candy-"] .biu {
    border-color: var(--tblr-primary) !important;
    box-shadow: 0 0 0 1px rgba(var(--tblr-primary-rgb), 0.2);
}

/* 悬停效果 */
.biu:hover {
    border-color: var(--tblr-primary-darken) !important;
}

[data-bs-theme-primary^="candy-"] .biu:hover {
    box-shadow: 0 0 0 2px rgba(var(--tblr-primary-rgb), 0.3);
}

/* ========================================
   糖果色主题渐变走马灯动画 - 最高优先级
   ======================================== */
/* 确保糖果色主题的link-icon渐变动画生效，覆盖所有其他样式 */
body[data-bs-theme-primary^="candy-"] .link-card .link-icon {
    background: linear-gradient(
        135deg, 
        var(--tblr-primary) 0%, 
        var(--gradient-secondary) 50%,
        var(--tblr-primary) 100%
    ) !important;
    background-size: 200% 200% !important;
    animation: gradient-marquee 3s ease infinite !important;
    will-change: background-position;
}

/* ========================================
   主题选择器拟态风格模态框
   ======================================== */

/* 拟态风格模态框 */
.neumorphic-modal {
    background: linear-gradient(145deg, #f0f0f0, #ffffff);
    box-shadow: 20px 20px 60px #d9d9d9, -20px -20px 60px #ffffff;
    border: none;
    border-radius: 20px;
}

.neumorphic-modal .modal-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 1.5rem;
    background: linear-gradient(145deg, #ffffff, #f0f0f0);
}

.neumorphic-modal .modal-title {
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
}

.neumorphic-modal .modal-body {
    padding: 2rem;
    max-height: 70vh;
    overflow-y: auto;
}

.neumorphic-modal .modal-footer {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding: 1rem 1.5rem;
    background: linear-gradient(145deg, #f0f0f0, #ffffff);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* 主题分组 */
.theme-section {
    margin-bottom: 2.5rem;
}

.theme-section:last-child {
    margin-bottom: 0;
}

.theme-section-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e0e0e0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.theme-section-title .title-icon {
    font-size: 1.3rem;
}

/* 主题网格 */
.theme-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1.5rem;
}

/* 主题卡片 - 拟态风格 */
.theme-card {
    background: linear-gradient(145deg, #f0f0f0, #ffffff);
    border-radius: 15px;
    padding: 1.2rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 8px 8px 16px #d1d1d1, -8px -8px 16px #ffffff;
    border: 2px solid transparent;
    position: relative;
    overflow: hidden;
}

.theme-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.theme-card:hover {
    transform: translateY(-5px);
    box-shadow: 12px 12px 24px #c5c5c5, -12px -12px 24px #ffffff;
}

.theme-card:hover::before {
    opacity: 1;
}

/* 选中状态 */
.theme-card.active {
    border-color: var(--tblr-primary);
    box-shadow: inset 4px 4px 8px #d1d1d1, inset -4px -4px 8px #ffffff, 0 0 0 3px rgba(var(--tblr-primary-rgb), 0.2);
    background: linear-gradient(145deg, #ffffff, #f5f5f5);
}

.theme-card.active::after {
    content: '✓';
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    width: 24px;
    height: 24px;
    background: var(--tblr-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 0.9rem;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

/* 点击动画 */
.theme-card.theme-card-clicked {
    transform: scale(0.95);
    box-shadow: inset 6px 6px 12px #d1d1d1, inset -6px -6px 12px #ffffff;
}

/* 主题预览色块 */
.theme-preview {
    width: 100%;
    height: 80px;
    border-radius: 10px;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.15), 
                inset -2px -2px 5px rgba(255, 255, 255, 0.8),
                0 2px 8px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}

/* 经典主题单色块光泽效果 */
.theme-preview:not(.candy-gradient)::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), transparent);
    border-radius: 10px 10px 0 0;
    pointer-events: none;
}

/* 经典主题光泽动画 */
.theme-preview:not(.candy-gradient)::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transform: rotate(45deg);
    transition: all 0.6s ease;
}

.theme-card:hover .theme-preview:not(.candy-gradient)::after {
    left: 100%;
}

/* 经典主题单色渐变效果 */
.theme-preview.classic-solid {
    box-shadow: inset 2px 2px 6px rgba(0, 0, 0, 0.2), 
                inset -2px -2px 6px rgba(255, 255, 255, 0.9),
                0 3px 10px rgba(0, 0, 0, 0.15);
}

/* 糖果色双色块预览 */
.theme-preview.candy-gradient {
    display: flex;
    padding: 0;
    gap: 1px;
    background: rgba(255, 255, 255, 0.3) !important;
    box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.1), inset -2px -2px 5px rgba(255, 255, 255, 0.7);
}

.theme-preview.candy-gradient .color-block {
    flex: 1;
    height: 100%;
    position: relative;
    transition: all 0.3s ease;
    box-shadow: inset 1px 1px 3px rgba(255, 255, 255, 0.3);
}

.theme-preview.candy-gradient .color-block:first-child {
    border-radius: 10px 0 0 10px;
}

.theme-preview.candy-gradient .color-block:last-child {
    border-radius: 0 10px 10px 0;
}

/* 为色块添加光泽效果 */
.theme-preview.candy-gradient .color-block::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 40%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), transparent);
    border-radius: inherit;
    pointer-events: none;
}

/* 悬停效果 - 色块轻微放大 */
.theme-card:hover .theme-preview.candy-gradient .color-block {
    transform: scale(1.05);
}

.theme-card:hover .theme-preview.candy-gradient .color-block:first-child {
    transform-origin: left center;
}

.theme-card:hover .theme-preview.candy-gradient .color-block:last-child {
    transform-origin: right center;
}

.theme-emoji {
    font-size: 2rem;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}

/* 主题信息 */
.theme-info {
    text-align: center;
}

.theme-name {
    font-weight: 600;
    color: #333;
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
}

.theme-code {
    font-family: 'Monaco', 'Consolas', monospace;
    font-size: 0.75rem;
    color: #666;
    background: rgba(0, 0, 0, 0.05);
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 当前主题信息 */
.current-theme-info {
    flex: 1;
    text-align: left;
}

.current-theme-info small {
    color: #666;
}

.current-theme-info strong {
    color: var(--tblr-primary);
    margin-right: 0.75rem;
}

/* 主题颜色展示 */
.theme-colors-display {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(145deg, #f5f5f5, #ffffff);
    border-radius: 20px;
    box-shadow: inset 2px 2px 4px rgba(0, 0, 0, 0.1), inset -2px -2px 4px rgba(255, 255, 255, 0.9);
}

.theme-colors-display .color-box {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.2), inset -1px -1px 3px rgba(255, 255, 255, 0.7);
    border: 2px solid rgba(255, 255, 255, 0.8);
    position: relative;
    overflow: hidden;
}

/* 双色显示 */
.theme-colors-display .color-box.dual-colors {
    display: flex;
    padding: 0;
    gap: 1px;
    background: rgba(200, 200, 200, 0.3);
}

.theme-colors-display .color-box.dual-colors .color-half {
    flex: 1;
    height: 100%;
    position: relative;
}

.theme-colors-display .color-box.dual-colors .color-half:first-child {
    border-radius: 6px 0 0 6px;
}

.theme-colors-display .color-box.dual-colors .color-half:last-child {
    border-radius: 0 6px 6px 0;
}

/* 为小色块也添加光泽效果 */
.theme-colors-display .color-box.dual-colors .color-half::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), transparent);
    border-radius: inherit;
    pointer-events: none;
}

.theme-colors-display .color-codes {
    font-family: 'Monaco', 'Consolas', monospace;
    font-size: 0.75rem;
    color: #666;
    font-weight: 500;
    letter-spacing: 0.5px;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .theme-grid {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 1rem;
    }
    
    .theme-card {
        padding: 1rem;
    }
    
    .theme-preview {
        height: 60px;
    }
    
    .theme-emoji {
        font-size: 1.5rem;
    }
    
    .neumorphic-modal .modal-body {
        padding: 1.5rem;
    }
    
    .theme-colors-display {
        padding: 0.2rem 0.5rem;
        gap: 0.4rem;
    }
    
    .theme-colors-display .color-box {
        width: 28px;
        height: 28px;
    }
    
    .theme-colors-display .color-codes {
        font-size: 0.7rem;
    }
    
    .theme-code {
        font-size: 0.7rem;
        padding: 0.2rem 0.4rem;
    }
}

@media (max-width: 576px) {
    .theme-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .neumorphic-modal .modal-footer {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }
    
    .current-theme-info {
        text-align: center;
    }
    
    .current-theme-info small {
        display: block;
        margin-bottom: 0.5rem;
    }
    
    .theme-colors-display {
        display: flex;
        justify-content: center;
    }
    
    .theme-colors-display .color-codes {
        font-size: 0.65rem;
    }
    
    .theme-code {
        font-size: 0.65rem;
    }
}

/* 自定义滚动条 - 拟态风格 */
.neumorphic-modal .modal-body::-webkit-scrollbar {
    width: 10px;
}

.neumorphic-modal .modal-body::-webkit-scrollbar-track {
    background: linear-gradient(145deg, #e6e6e6, #ffffff);
    border-radius: 10px;
}

.neumorphic-modal .modal-body::-webkit-scrollbar-thumb {
    background: linear-gradient(145deg, #d0d0d0, #e0e0e0);
    border-radius: 10px;
    box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.1);
}

.neumorphic-modal .modal-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(145deg, #c0c0c0, #d0d0d0);
}