/**
 * PDF Export Button — Frontend Styles
 * Avada 테마 환경에 맞게 설계. 테마 CSS 간섭 최소화.
 */

/* ── 버튼 래퍼 ── */
.peb-wrap {
    display: inline-flex;
    align-items: center;
    margin: 0;
    line-height: 1;
}

.peb-wrap--title {
    margin-bottom: 16px;
}

/* ── 버튼 기본 스타일 ── */
.peb-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    /* 테마 버튼 스타일 상속 방지 */
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    color: #555 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    padding: 7px 12px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    transition: border-color 0.2s, color 0.2s, background 0.2s !important;
    /* 로딩 레이어 기준점 */
    position: relative !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    letter-spacing: 0 !important;
}

.peb-btn:hover {
    border-color: #333 !important;
    color: #111 !important;
    background: #f5f5f5 !important;
}

.peb-btn:focus {
    outline: 2px solid #666 !important;
    outline-offset: 2px !important;
}

/* ── 버튼 아이콘 ── */
.peb-icon {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
    vertical-align: middle !important;
    display: inline-block !important;
    stroke: currentColor !important;
    fill: none !important;
}

/* ── 로딩 상태 ── */
.peb-btn--loading .peb-btn__label,
.peb-btn--loading .peb-icon {
    visibility: hidden;
}

.peb-btn__loading {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    opacity: 0;
    pointer-events: none;
}

.peb-btn--loading .peb-btn__loading {
    opacity: 1;
}

/* 도트 애니메이션 */
.peb-btn__loading span {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #555;
    animation: peb-bounce 1s ease-in-out infinite;
}

.peb-btn__loading span:nth-child(1) { animation-delay: 0s; }
.peb-btn__loading span:nth-child(2) { animation-delay: 0.18s; }
.peb-btn__loading span:nth-child(3) { animation-delay: 0.36s; }

@keyframes peb-bounce {
    0%, 80%, 100% { transform: translateY(0); opacity: .5; }
    40%            { transform: translateY(-5px); opacity: 1; }
}

/* ── 토스트 알림 ── */
.peb-toast {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 999999;
    font-size: 13px;
    font-weight: 500;
    padding: 10px 18px;
    border-radius: 5px;
    box-shadow: 0 4px 20px rgba(0,0,0,.18);
    pointer-events: none;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .25s, transform .25s;
    line-height: 1.5;
    max-width: 280px;
}

.peb-toast--show {
    opacity: 1;
    transform: translateY(0);
}

.peb-toast--success {
    background: #1a1a1a;
    color: #fff;
}

.peb-toast--error {
    background: #c0392b;
    color: #fff;
}

/* ── Avada 특화: 버튼 래퍼가 Fusion 컨테이너 안에 있을 때 ── */
.fusion-post-title-bar .peb-wrap,
.fusion-page-title-bar .peb-wrap {
    margin-top: 12px;
}