/* 侧边信息面板容器 */ .side-info-panel { display: flex; flex-direction: column; gap: 16px; } /* 信息区块 */ .side-info-section { background: #ffffff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); overflow: hidden; transition: all 0.3s ease; } .side-info-section:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); } /* 区块头部 */ .side-info-section-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%); border-bottom: 1px solid #e8e8e8; cursor: pointer; user-select: none; transition: background 0.2s ease; } .side-info-section-header:hover { background: linear-gradient(135deg, #f0f4ff 0%, #e8f0ff 100%); } .side-info-section-title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: rgba(0, 0, 0, 0.88); } .side-info-section-icon { display: flex; align-items: center; font-size: 16px; color: #1677ff; } .side-info-section-toggle { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: none; background: transparent; color: #8c8c8c; cursor: pointer; transition: all 0.2s ease; border-radius: 4px; } .side-info-section-toggle:hover { background: rgba(0, 0, 0, 0.06); color: #1677ff; } /* 区块内容 */ .side-info-section-content { padding: 16px 20px; animation: expandContent 0.3s ease-out; } @keyframes expandContent { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }