/**
 * 币种汇总区域样式
 * 优化没有币种名称时的显示效果
 * 支持两行显示共6个币种
 * 确保高度紧凑
 */

/* 币种汇总容器 */
.currency-summary {
    padding: 4px 5px;
    margin-top: 10px;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    background-color: #fff;
    position: relative;
    min-height: 60px; /* 减小高度 */
    overflow: hidden;
}

/* 币种汇总区域布局 - 使用网格布局 */
.currency-summary .d-flex {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 三列等宽 */
    grid-template-rows: repeat(2, auto); /* 两行自适应高度 */
    gap: 3px; /* 减小网格间距 */
    width: 100%;
    box-sizing: border-box;
}

/* 币种项样式 - 固定宽度，确保一行三个 */
.currency-summary .currency-item {
    box-sizing: border-box;
    padding: 1px; /* 减小内边距 */
    text-align: center;
}

/* 币种值样式 */
.currency-summary .currency-value {
    white-space: nowrap; /* 防止值被换行 */
    display: inline-block;
    font-size: 0.9rem; /* 字体大小 */
    font-weight: 600; /* 字体粗细 */
    line-height: 1.1; /* 减小行高 */
}

/* 确保币种汇总区域不受其他元素影响 */
#leftSidebar .card-body {
    position: relative !important;
}

/* 为不同币种设置不同颜色 */
.currency-summary .text-primary {
    color: #0d6efd !important;
}

.currency-summary .text-success {
    color: #198754 !important;
}

.currency-summary .text-info {
    color: #0dcaf0 !important;
}

.currency-summary .text-danger {
    color: #dc3545 !important;
}

.currency-summary .text-secondary {
    color: #6c757d !important;
}

.currency-summary .text-warning {
    color: #ffc107 !important;
}

/* 添加阴影效果，增强视觉层次 */
.currency-summary:hover {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}