.changelog-list { display: flex; flex-direction: column; gap: 12px; font-family: 'Zarin-Font', sans-serif; } .changelog-item { background: #fafafa; border-radius: 10px; padding: 12px 15px; border: 1px solid #e0e0e0; transition: 0.2s; } .changelog-item:hover { background: #f3f3f3; } .changelog-item.latest { background: #e8ffe8; border-color: #2ecc71; } .changelog-top { display: flex; justify-content: space-between; margin-bottom: 6px; font-weight: bold; font-size: 14px; } .version, .date { background: #efefef; padding: 3px 10px; border-radius: 20px; font-size: 13px; font-weight: 500; } .changelog-item.latest .version, .changelog-item.latest .date { background: #d9ffd9; font-weight: bold; } .changelog-desc { color: #555; line-height: 1.6; font-size: 13px; padding-top: 3px; } .changelog-item.latest .version, .changelog-item.latest .date { background: #6cf39d; font-weight: bold; } @media (max-width: 480px) { .changelog-item { padding: 10px 12px; } .changelog-top { flex-direction: column; align-items: flex-start; gap: 4px; } .version, .date { font-size: 12px; padding: 3px 8px; } .changelog-desc { font-size: 12px; } }