/* 方块选择器样式修复 - 紧凑布局 */

/* 确保modal-body正确使用flexbox */
#block-selector-modal .modal-body {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    padding: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

/* 分类按钮栏 */
.category-topbar {
    flex-shrink: 0 !important;
}

/* 方块网格容器 - 关键修复 */
#block-selector-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
    gap: 0.4rem !important;
    padding: 0.75rem !important;
    overflow-y: auto !important;
    flex: 1 !important;
    align-content: start !important;
    /* 关键:从顶部开始排列 */
    min-height: 0 !important;
}

/* 方块项 - 紧凑但有呼吸感的布局 */
.block-item {
    display: flex !important;
    align-items: center !important;
    gap: 0.6rem !important;
    /* 图标和文字之间有适当间距 */
    padding: 0.2rem 0.5rem !important;
    border-radius: 0.4rem !important;
    cursor: pointer !important;
    transition: background-color 0.2s !important;
    background-color: transparent !important;
}

.block-item:hover {
    background-color: var(--neutral-800) !important;
}

/* 方块图标 */
.block-item-icon {
    width: 24px !important;
    height: 24px !important;
    flex-shrink: 0 !important;
}

.block-item-icon img {
    width: 100% !important;
    height: 100% !important;
    image-rendering: pixelated !important;
    image-rendering: -moz-crisp-edges !important;
    image-rendering: crisp-edges !important;
}

/* 方块信息容器 */
.block-item-info {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    flex: 1 !important;
    min-width: 0 !important;
    gap: 0.1rem !important;
    /* 中文和英文名称之间有小间距 */
    line-height: 1 !important;
}

/* 中文名称 */
.block-item-name-cn {
    color: var(--white) !important;
    font-size: 0.75rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.2 !important;
}

/* 英文名称 */
.block-item-name-en {
    color: var(--neutral-500) !important;
    font-size: 0.65rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.1 !important;
}