/* 版块自定义标签插件 - 样式 */

/* 版块选择器 - 网格布局 */
.navgbt-board-grid,
.navgbt-board-grid-m {
    max-height: 240px;
    overflow-y: auto;
}

.navgbt-board-item,
.navgbt-board-item-m {
    font-size: 0.78rem;
    border-radius: 20px;
    transition: all 0.15s ease;
}

.navgbt-board-item.active,
.navgbt-board-item-m.active {
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    border-color: var(--bs-primary) !important;
}

.navgbt-board-item.active i,
.navgbt-board-item-m.active i {
    color: #fff !important;
}

/* 标签选择器 */
.navgbt-tag-container,
.navgbt-tag-container-m {
    min-height: 40px;
}

.navgbt-tag-group {
    margin-bottom: 10px;
}

.navgbt-tag-group-name {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--bs-secondary);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.navgbt-tag-items {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.navgbt-tag-btn {
    font-size: 0.78rem;
    border-radius: 20px;
    padding: 2px 12px;
    transition: all 0.15s ease;
    cursor: pointer;
    border: 1px solid var(--bs-border-color);
    background: transparent;
    color: var(--bs-body-color);
}

.navgbt-tag-btn:hover {
    background-color: var(--bs-primary);
    color: #fff;
    border-color: var(--bs-primary);
}

.navgbt-tag-btn.active {
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    border-color: var(--bs-primary) !important;
}

/* 标签颜色变体 */
.navgbt-tag-primary.active { background-color: var(--bs-primary) !important; border-color: var(--bs-primary) !important; }
.navgbt-tag-secondary.active { background-color: var(--bs-secondary) !important; border-color: var(--bs-secondary) !important; }
.navgbt-tag-success.active { background-color: var(--bs-success) !important; border-color: var(--bs-success) !important; }
.navgbt-tag-danger.active { background-color: var(--bs-danger) !important; border-color: var(--bs-danger) !important; }
.navgbt-tag-warning.active { background-color: var(--bs-warning) !important; border-color: var(--bs-warning) !important; color: #000 !important; }
.navgbt-tag-info.active { background-color: var(--bs-info) !important; border-color: var(--bs-info) !important; }
.navgbt-tag-dark.active { background-color: var(--bs-dark) !important; border-color: var(--bs-dark) !important; }

.navgbt-tag-btn.active i {
    color: #fff !important;
}

/* 标签徽章动画 */
.navgbt-tag-btn {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.navgbt-tag-btn:active {
    transform: scale(0.95);
}

/* 占位提示 */
#navgbt-tag-placeholder,
#navgbt-tag-placeholder-m {
    cursor: default;
    user-select: none;
}

/* 主题列表标签 */
.navgbt-thread-tags {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 2px;
    vertical-align: middle;
}

/* ===== 扩展颜色：Bootstrap 5 未内置 bg-/text-/border- 工具类 ===== */
:root {
    --bs-indigo-rgb: 102, 16, 242;
    --bs-purple-rgb: 111, 66, 193;
    --bs-pink-rgb: 214, 51, 132;
    --bs-teal-rgb: 32, 201, 151;
    --bs-orange-rgb: 253, 126, 20;
}

/* 背景色（兼容 bg-opacity-*） */
/* 注意：不设置 --bs-bg-opacity，让 Bootstrap 的 bg-opacity-* 工具类生效 */
.bg-indigo { background-color: rgba(var(--bs-indigo-rgb), var(--bs-bg-opacity, 1)) !important; }
.bg-purple { background-color: rgba(var(--bs-purple-rgb), var(--bs-bg-opacity, 1)) !important; }
.bg-pink   { background-color: rgba(var(--bs-pink-rgb), var(--bs-bg-opacity, 1)) !important; }
.bg-teal   { background-color: rgba(var(--bs-teal-rgb), var(--bs-bg-opacity, 1)) !important; }
.bg-orange { background-color: rgba(var(--bs-orange-rgb), var(--bs-bg-opacity, 1)) !important; }

/* 文字色 */
.text-indigo { color: rgba(var(--bs-indigo-rgb), var(--bs-text-opacity, 1)) !important; }
.text-purple { color: rgba(var(--bs-purple-rgb), var(--bs-text-opacity, 1)) !important; }
.text-pink   { color: rgba(var(--bs-pink-rgb), var(--bs-text-opacity, 1)) !important; }
.text-teal   { color: rgba(var(--bs-teal-rgb), var(--bs-text-opacity, 1)) !important; }
.text-orange { color: rgba(var(--bs-orange-rgb), var(--bs-text-opacity, 1)) !important; }

/* 边框色 */
.border-indigo { border-color: rgba(var(--bs-indigo-rgb), 1) !important; }
.border-purple { border-color: rgba(var(--bs-purple-rgb), 1) !important; }
.border-pink   { border-color: rgba(var(--bs-pink-rgb), 1) !important; }
.border-teal   { border-color: rgba(var(--bs-teal-rgb), 1) !important; }
.border-orange { border-color: rgba(var(--bs-orange-rgb), 1) !important; }

/* 标签按钮颜色变体（扩展） */
/* 默认状态：浅色背景 + 同色文字 + 同色边框 */
.navgbt-tag-indigo { background-color: rgba(var(--bs-indigo-rgb), 0.12); color: rgba(var(--bs-indigo-rgb), 1); border-color: rgba(var(--bs-indigo-rgb), 0.3); }
.navgbt-tag-purple { background-color: rgba(var(--bs-purple-rgb), 0.12); color: rgba(var(--bs-purple-rgb), 1); border-color: rgba(var(--bs-purple-rgb), 0.3); }
.navgbt-tag-pink   { background-color: rgba(var(--bs-pink-rgb), 0.12); color: rgba(var(--bs-pink-rgb), 1); border-color: rgba(var(--bs-pink-rgb), 0.3); }
.navgbt-tag-teal   { background-color: rgba(var(--bs-teal-rgb), 0.12); color: rgba(var(--bs-teal-rgb), 1); border-color: rgba(var(--bs-teal-rgb), 0.3); }
.navgbt-tag-orange { background-color: rgba(var(--bs-orange-rgb), 0.12); color: rgba(var(--bs-orange-rgb), 1); border-color: rgba(var(--bs-orange-rgb), 0.3); }

/* 悬浮状态：颜色加深 */
.navgbt-tag-indigo:hover { background-color: rgba(var(--bs-indigo-rgb), 0.25) !important; color: #fff !important; border-color: rgba(var(--bs-indigo-rgb), 1) !important; }
.navgbt-tag-purple:hover { background-color: rgba(var(--bs-purple-rgb), 0.25) !important; color: #fff !important; border-color: rgba(var(--bs-purple-rgb), 1) !important; }
.navgbt-tag-pink:hover   { background-color: rgba(var(--bs-pink-rgb), 0.25) !important; color: #fff !important; border-color: rgba(var(--bs-pink-rgb), 1) !important; }
.navgbt-tag-teal:hover   { background-color: rgba(var(--bs-teal-rgb), 0.25) !important; color: #fff !important; border-color: rgba(var(--bs-teal-rgb), 1) !important; }
.navgbt-tag-orange:hover { background-color: rgba(var(--bs-orange-rgb), 0.25) !important; color: #fff !important; border-color: rgba(var(--bs-orange-rgb), 1) !important; }

/* 激活状态：纯色背景 */
.navgbt-tag-indigo.active { background-color: rgba(var(--bs-indigo-rgb), 1) !important; border-color: rgba(var(--bs-indigo-rgb), 1) !important; }
.navgbt-tag-purple.active { background-color: rgba(var(--bs-purple-rgb), 1) !important; border-color: rgba(var(--bs-purple-rgb), 1) !important; }
.navgbt-tag-pink.active   { background-color: rgba(var(--bs-pink-rgb), 1) !important; border-color: rgba(var(--bs-pink-rgb), 1) !important; }
.navgbt-tag-teal.active   { background-color: rgba(var(--bs-teal-rgb), 1) !important; border-color: rgba(var(--bs-teal-rgb), 1) !important; }
.navgbt-tag-orange.active { background-color: rgba(var(--bs-orange-rgb), 1) !important; border-color: rgba(var(--bs-orange-rgb), 1) !important; }

/* =========================================================
   发帖/编辑页标签选择器：不套用标签配色
   选中：黑底白字；未选中：白底黑字
   仅作用于发帖页容器(#navgbt-tag-container / -m)，
   不影响已发布帖子的彩色徽章(renderBadges 走另一条渲染)
   ========================================================= */
#navgbt-tag-container .navgbt-tag-btn,
#navgbt-tag-container-m .navgbt-tag-btn {
    background: #fff !important;
    color: var(--bs-dark) !important;
    border-color: var(--bs-border-color) !important;
}
#navgbt-tag-container .navgbt-tag-btn:hover,
#navgbt-tag-container-m .navgbt-tag-btn:hover {
    background: #fff !important;
    color: var(--bs-dark) !important;
    border-color: var(--bs-secondary) !important;
}
#navgbt-tag-container .navgbt-tag-btn.active,
#navgbt-tag-container-m .navgbt-tag-btn.active {
    background: var(--bs-dark) !important;
    color: #fff !important;
    border-color: var(--bs-dark) !important;
}