/**
 * 공통 알림/확인 모달
 * 브라우저 기본 alert()/confirm() 대신 화면 가운데 팝업으로 띄운다.
 * 관리자(layouts/admin)의 .custom-alert 와 동일한 구조·클래스명을 쓴다.
 */
.custom-alert-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    z-index: 100000;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.custom-alert-overlay.active { display: flex; }

.custom-alert {
    background: #fff;
    border-radius: 14px;
    padding: 28px 24px 22px;
    width: 100%;
    max-width: 380px;
    text-align: center;
    box-shadow: 0 20px 25px -5px rgba(20, 26, 68, .18), 0 10px 10px -5px rgba(20, 26, 68, .06);
    animation: uiAlertIn .18s ease-out;
}
@keyframes uiAlertIn {
    from { opacity: 0; transform: scale(.95) translateY(6px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.custom-alert-icon {
    width: 52px; height: 52px;
    margin: 0 auto 16px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
}
.custom-alert-icon.info { background: #eef0f9; color: #1e2761; }
.custom-alert-icon.success { background: #ecfdf5; color: #10b981; }
.custom-alert-icon.warning { background: #fffbeb; color: #f59e0b; }
.custom-alert-icon.error { background: #fef2f2; color: #ef4444; }

.custom-alert-title { font-size: 17px; font-weight: 800; color: #1f2226; margin-bottom: 8px; }
/* 줄바꿈(\n)을 그대로 살린다 */
.custom-alert-message { font-size: 14px; color: #5b626c; line-height: 1.65; margin-bottom: 22px; white-space: pre-line; }

.custom-alert-actions { display: flex; gap: 8px; }
.custom-alert-btn {
    flex: 1;
    height: 46px;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: filter .15s;
}
.custom-alert-btn:hover { filter: brightness(.94); }
.custom-alert-btn.primary { background: #1e2761; color: #fff; }
.custom-alert-btn.cancel { background: #f2f4f7; color: #3a3f47; }
