/* PayPhone CSS Protection - Prevents PayPhone styles from affecting main app */

/* ===== CRITICAL: Protect main app structure ===== */
#root {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Protect body and html from PayPhone resets */
body, html {
    font-family: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
}

/* ===== Protect ALL modals except PayPhone ===== */
/* SweetAlert2 modals (not PayPhone) */
.swal2-popup:not(:has(#pp-modal-container)),
.swal2-container:not(:has(#pp-modal-container)) {
    font-family: inherit !important;
    font-size: inherit !important;
}

/* Protect generic modals */
.modal, 
.dialog,
[role="dialog"],
[role="alertdialog"] {
    font-family: inherit !important;
    font-size: inherit !important;
}

/* ===== Allow PayPhone styles ONLY inside its container ===== */
/* Only SweetAlert modals containing PayPhone can use its styles */
.swal2-container:has(#pp-modal-container) {
    font-family: Helvetica, sans-serif;
}

#pp-modal-container,
#pp-modal-container * {
    font-family: Helvetica, sans-serif !important;
}

/* ===== Prevent PayPhone from breaking buttons ===== */
button:not(#pp-modal-container button):not(.swal2-container:has(#pp-modal-container) button) {
    font-family: inherit !important;
    font-size: inherit !important;
}

/* ===== Prevent PayPhone from breaking inputs ===== */
input:not(#pp-modal-container input),
select:not(#pp-modal-container select),
textarea:not(#pp-modal-container textarea) {
    font-family: inherit !important;
    font-size: inherit !important;
}

/* ===== Protect specific UI components ===== */
.ppb-content:not(#pp-modal-container .ppb-content) {
    display: initial !important;
    position: initial !important;
    width: auto !important;
    align-items: initial !important;
    justify-content: initial !important;
}