/* V91: ajustes carregados por ultimo para neutralizar estilos locais desktop. */

@media (max-width: 768px) {
    body.mobile-dialog-open {
        overflow: hidden;
    }

    .page-header.flex,
    .card-header,
    .transfer-form .flex.gap-3,
    .charges-tabs,
    .documentscopy-actions,
    .onboarding-retry-actions,
    .charge-cancel-actions,
    .page-box,
    .receipt-actions,
    .support-actions {
        flex-wrap: wrap !important;
    }

    .main-content form.flex.gap-4 {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .main-content form.flex.gap-4 > .form-group {
        width: 100%;
        min-width: 0 !important;
        max-width: none !important;
    }

    .page-header.flex {
        align-items: flex-start !important;
        gap: 12px;
    }

    .page-header.flex > *,
    .card-header > * {
        min-width: 0;
    }

    .charges-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px !important;
    }

    .charges-tabs .btn {
        width: 100%;
        min-width: 0;
        padding-inline: 10px;
        white-space: nowrap;
    }

    .pix-mode-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .pix-mode-tabs .btn {
        width: 100%;
        min-width: 0 !important;
        padding-inline: 8px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .service-grid,
    .support-shell,
    .approval-detail-grid,
    .onboarding-retry-grid,
    .receipt-grid,
    .grid.grid-cols-2,
    .grid.grid-cols-3 {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .review-row {
        align-items: flex-start;
    }

    .review-row > * {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .review-row strong {
        max-width: 62%;
    }

    .flow-steps {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }

    .flow-step {
        display: grid;
        place-items: center;
        min-height: 42px;
        padding: 6px;
        border-radius: 12px;
        line-height: 1.25;
        text-align: center;
    }

    .transfer-summary {
        order: -1;
    }

    .transfer-summary .card-value {
        font-size: 1.5rem;
    }

    .fav-table {
        min-width: 0 !important;
    }

    .fav-table-wrap,
    .approval-table-wrap {
        overflow: visible !important;
        border: 0 !important;
        background: transparent !important;
    }

    .approval-table.mobile-card-table td:nth-child(4) {
        display: block !important;
    }

    .approval-table.mobile-card-table td.select-cell,
    .approval-table.mobile-card-table td.view-cell {
        text-align: right !important;
    }

    .approval-table.mobile-card-table td.select-cell input {
        width: 24px;
        height: 24px;
    }

    .approval-code-actions .btn,
    .approval-actions .btn,
    .documentscopy-actions .btn,
    .documentscopy-actions a,
    .onboarding-retry-actions .btn,
    .charge-cancel-actions .btn,
    .receipt-actions .btn,
    .support-actions .btn {
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .pagination,
    .approval-pagination,
    .support-pagination {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .transfer-form .flex.gap-3 > .btn {
        flex: 1 1 calc(50% - 6px);
        min-width: 150px;
    }

    .api-v2-table {
        min-width: 720px !important;
    }

    .api-v2-secret,
    textarea[readonly],
    pre,
    code {
        max-width: 100%;
        overflow-wrap: anywhere;
        white-space: pre-wrap;
    }

    .usage-top {
        align-items: flex-start;
    }

    .usage-meta {
        overflow-wrap: anywhere;
    }

    .notification-item {
        align-items: flex-start;
        gap: 12px;
        padding: 14px !important;
    }

    .notification-content,
    .notification-title,
    .notification-text {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .support-message {
        max-width: 94% !important;
    }

    .support-conversation {
        max-height: none !important;
    }

    .receipt-shell,
    .receipt-section,
    .receipt-hero {
        max-width: 100%;
    }

    .receipt-kv {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .receipt-kv > * {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .documentscopy-qr img,
    .documentscopy-qr canvas,
    .local-qr-code,
    .local-qr-code canvas,
    .local-qr-code img {
        display: block;
        margin-inline: auto;
    }

    .document-modal-head {
        padding:
            calc(12px + env(safe-area-inset-top))
            calc(12px + env(safe-area-inset-right))
            12px
            calc(12px + env(safe-area-inset-left));
    }

    .legal-document-card {
        align-items: flex-start;
    }

    .legal-document-card .btn {
        flex: 0 0 auto;
    }
}

@media (max-width: 480px) {
    .login-type-tabs .tab {
        padding-inline: 0.25rem;
        font-size: 0.75rem;
    }

    .charges-tabs {
        grid-template-columns: minmax(0, 1fr);
    }

    .review-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 3px;
    }

    .main-content form.flex.gap-4 {
        grid-template-columns: minmax(0, 1fr);
    }

    .main-content form.flex.gap-4 > .btn,
    .main-content form.flex.gap-4 > a.btn,
    .transfer-form .flex.gap-3 > .btn {
        width: 100%;
        min-width: 0;
    }

    .btn {
        padding-inline: 0.85rem;
        font-size: 0.8125rem;
    }

    .pagination .btn,
    .approval-pagination .btn,
    .support-pagination .btn {
        flex: 1 1 calc(50% - 4px);
        width: auto;
        min-width: 0;
    }

    .review-row strong {
        max-width: 100%;
        text-align: left;
    }

    .flow-steps {
        grid-template-columns: minmax(0, 1fr);
    }

    .flow-step {
        justify-items: start;
        min-height: 38px;
        padding-inline: 12px;
    }

    .usage-top {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: 2px !important;
    }

    .notification-item {
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .notification-item > [style*="width: 8px"] {
        grid-column: 2;
    }

    .page-box .form-input,
    .page-box input {
        flex: 1;
        min-width: 0;
    }
}

@media (max-width: 360px) {
    .login-box {
        padding-inline: 1rem;
    }
}
