/* Tool popups (migration 159). Self-contained: does not depend on Bootstrap,
   because not every layout that serves a tool page loads it. */

.a2zp-overlay {
    position: fixed; inset: 0; z-index: 2147483000;
    display: flex; align-items: center; justify-content: center;
    padding: 12px; background: rgba(8, 10, 30, .55);
    opacity: 0; transition: opacity .18s ease;
    font-family: inherit;
}
.a2zp-overlay.is-open { opacity: 1; }
.a2zp-overlay--preview { position: absolute; z-index: 5; border-radius: 10px; }

.a2zp-dialog {
    position: relative; width: 100%; max-height: calc(100vh - 24px); overflow: auto;
    background: #fff; color: #1d2333; border-radius: 16px;
    box-shadow: 0 24px 70px rgba(5, 6, 30, .45);
    transform: translateY(12px) scale(.98); transition: transform .18s ease;
    text-align: left;
}
.a2zp-overlay.is-open .a2zp-dialog { transform: none; }
.a2zp-overlay--preview .a2zp-dialog { max-height: calc(100% - 24px); }

.a2zp--small  { max-width: 360px; }
.a2zp--medium { max-width: 520px; }
.a2zp--large  { max-width: 760px; }

.a2zp-close {
    position: absolute; top: 8px; right: 8px; z-index: 2;
    width: 32px; height: 32px; border-radius: 50%; border: 0;
    background: rgba(255, 255, 255, .92); color: #1d2333;
    font-size: 22px; line-height: 32px; text-align: center; cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}
.a2zp-close:disabled { cursor: default; font-size: 14px; color: #6b7287; }
.a2zp-close:focus-visible { outline: 3px solid #5b4cf0; outline-offset: 2px; }

.a2zp-body { display: block; }
.a2zp-media, .a2zp-media-link { display: block; position: relative; }
.a2zp-media img, .a2zp-media video, .a2zp-img, .a2zp-video {
    display: block; width: 100%; height: auto; border-radius: 16px 16px 0 0;
}
.a2zp-dialog:not(:has(.a2zp-text)) .a2zp-media img,
.a2zp-dialog:not(:has(.a2zp-text)) .a2zp-media video { border-radius: 16px; }

.a2zp-sound {
    position: absolute; left: 10px; bottom: 10px; border: 0; border-radius: 999px;
    padding: 5px 12px; font-size: 12px; background: rgba(0, 0, 0, .65); color: #fff; cursor: pointer;
}

.a2zp-text { padding: 18px 20px 20px; }
.a2zp-headline { margin: 0 0 6px; font-size: 1.15rem; font-weight: 700; line-height: 1.3; padding-right: 28px; }
.a2zp-copy { margin: 0 0 14px; font-size: .95rem; line-height: 1.5; color: #4a5168; }
.a2zp-cta {
    display: inline-block; padding: 10px 20px; border-radius: 10px;
    background: #5b4cf0; color: #fff !important; font-weight: 600; text-decoration: none !important;
}
.a2zp-cta:hover { background: #4a3cd8; }

/* Internal page, app and extension cards: icon beside the text. */
.a2zp-card .a2zp-body { display: flex; gap: 16px; align-items: flex-start; padding: 20px; }
.a2zp-card .a2zp-icon { flex: none; width: 88px; }
.a2zp-card .a2zp-icon img { width: 88px; height: 88px; object-fit: cover; border-radius: 18px; display: block; }
.a2zp-card .a2zp-text { padding: 0; }
.a2zp--large.a2zp-card .a2zp-icon, .a2zp--large.a2zp-card .a2zp-icon img { width: 140px; height: 140px; }
.a2zp--small.a2zp-card .a2zp-body { flex-direction: column; align-items: center; text-align: center; }
.a2zp--small.a2zp-card .a2zp-headline { padding-right: 0; }

.a2zp-kind--html .a2zp-body { padding: 20px; }

@media (max-width: 575px) {
    .a2zp-overlay:not(.a2zp-overlay--preview) { align-items: flex-end; padding: 0; }
    .a2zp-overlay:not(.a2zp-overlay--preview) .a2zp-dialog { max-width: 100%; border-radius: 16px 16px 0 0; max-height: 88vh; }
    .a2zp-card .a2zp-body { flex-direction: column; align-items: center; text-align: center; }
    .a2zp-headline { padding-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .a2zp-overlay, .a2zp-dialog { transition: none; }
}
