/* Popup Modal */
.modal-overlay {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}
.modal-card {
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
    text-align: center;
    animation: modalSlideUp 0.3s ease-out;
}
@keyframes modalSlideUp {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
.modal-card h3 { margin-top: 0; color: #0f172a; font-family: 'Quicksand', sans-serif; font-weight: 800; font-size: 20px;}
.modal-card p { color: #475569; line-height: 1.5; font-family: 'Quicksand', sans-serif; font-weight: 500; font-size: 15px;}
.btn-close-modal {
    margin-top: 20px;
    background: #FF9F43;
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: 10px;
    font-family: 'Quicksand', sans-serif;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}
.btn-close-modal:hover { background: #ff8f1f; }

/* Toast Notification (Góc dưới phải) */
.toast-container {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.toast-item {
    background: #ffffff;
    border-left: 5px solid #FF9F43;
    padding: 16px 24px;
    border-radius: 14px;
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
    color: #0f172a;
    font-weight: 700;
    font-size: 14px;
    min-width: 280px;
    display: flex;
    align-items: center;
    font-family: 'Quicksand', sans-serif;
    animation: toastSlideIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}
@keyframes toastSlideIn {
    from { transform: translateX(120%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}
.toast-item.hide {
    animation: toastFadeOut 0.5s ease-in forwards;
}
@keyframes toastFadeOut {
    to { transform: translateX(120%); opacity: 0; }
}
.toast-item.success { border-left-color: #10b981; }
.toast-item.error { border-left-color: #ef4444; }

/* Responsive Mobile cho Toast & Ẩn khi In */
@media (max-width: 768px) {
    .toast-container { bottom: 20px; right: 50%; transform: translateX(50%); align-items: center; }
    .toast-item { min-width: 90%; justify-content: center; text-align: center; }
}
@media print {
    .modal-overlay, .toast-container { display: none !important; }
}