/* Hiệu ứng cho Toast */
.toast-in { animation: toastIn .18s ease-out; }
.toast-out { animation: toastOut .18s ease-in forwards; }
@keyframes toastIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes toastOut { from { opacity: 1; } to { opacity: 0; transform: translateY(6px); } }

/* Hiệu ứng cho Modal */
.modal-panel { animation: modalIn .16s ease-out; }
@keyframes modalIn { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: scale(1); } }

/* Khu vực render Markdown */
.prose h1 { font-size: 1.9em; font-weight: 700; margin: .6em 0 .4em; font-family: "Source Serif 4", serif; }
.prose h2 { font-size: 1.4em; font-weight: 700; margin: 1em 0 .4em; font-family: "Source Serif 4", serif; }
.prose p { margin-bottom: 1em; line-height: 1.7; }
.prose pre { background: #1B2430; color: #fff; padding: 1em; border-radius: .5rem; overflow-x: auto; }
.prose code { background: #EDEEF1; padding: .1em .35em; border-radius: .25rem; font-size: .9em; }
.prose pre code { background: none; padding: 0; }
.prose blockquote { border-left: 3px solid #2F6F5E; padding-left: 1rem; color: #4b5563; font-style: italic; }
.prose img { border-radius: .5rem; max-width: 100%; }
.prose ul { list-style: disc; padding-left: 1.4em; margin-bottom: 1em; }
.prose ol { list-style: decimal; padding-left: 1.4em; margin-bottom: 1em; }

/* Line-clamp cho phần trích đoạn bài viết trên thẻ */
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}