/* ZenKids V73 – Dedicated shared success/error modal styling. */
/* Keep alert markup hidden until Bootstrap explicitly displays it. */
#successalertmodal:not(.show), #erroralertmodal:not(.show) { display:none !important; }
#successalertmodal.alertclass, #erroralertmodal.alertclass { position:fixed !important; inset:0; z-index:10950; overflow-x:hidden; overflow-y:auto; padding:16px; }
#successalertmodal.alertclass.show, #erroralertmodal.alertclass.show { display:block !important; }
.alertclass .modal-dialog { position:relative; width:100%; max-width:440px; margin: min(12vh,90px) auto 30px; pointer-events:none; }
.alertclass .modal-content { background:#fff; border:1px solid #e6edf2; border-radius:20px; box-shadow:0 24px 65px rgba(15,45,67,.22); overflow:hidden; pointer-events:auto; }
.alertclass .modal-header { background:#f5f9fc; display:flex; align-items:center; gap:7px; padding:16px 20px; border-bottom:1px solid #e9eef3; }
.alertclass .modal-title { flex:1; margin:0; color:#17384d; font:800 18px/1.3 Nunito,Arial,sans-serif; }
.alertclass .dot { display:inline-block; height:9px; width:9px; border-radius:50%; }
.alertclass .yellow-dot { background:#ffca36; } .alertclass .green-dot { background:#58bd85; } .alertclass .red-dot { background:#f47782; }
.alertclass .modal-body { padding:27px 25px 16px; text-align:center; }
.alertclass .warning { display:flex; align-items:center; flex-direction:column; }
.alertclass .warning_img { margin:0 0 8px; }
.alertclass .warning_img img { display:block; width:76px; height:76px; max-width:100%; object-fit:contain; margin:0 auto; }
.alertclass .warning-title { font:900 21px/1.3 Nunito,Arial,sans-serif; margin:5px 0 6px; text-transform:none; color:#17384d; }
#erroralertmodal .warning-title { color:#bb3b3b; }
.alertclass .confirmation p { margin:4px auto 12px; color:#506777; line-height:1.55; font-size:15px; overflow-wrap:anywhere; }
.alertclass .modal-footer { display:flex; justify-content:center; border:0; padding:0 24px 24px; }
.alertclass .modal-footer .btn { display:inline-flex; align-items:center; justify-content:center; min-width:118px; min-height:42px; padding:10px 24px; background:#ffcd2c !important; color:#17384d !important; border:0; border-radius:24px; font-weight:800; text-decoration:none; box-shadow:none; }
.alertclass .modal-footer .btn:hover { background:#f6bd18 !important; color:#17384d !important; }
@media(max-width:520px){ .alertclass .modal-dialog{max-width:100%;margin:12vh auto 24px;} .alertclass .modal-content{border-radius:16px;} }