// ==UserScript==
// @name         CFE Desktop View Forcer
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Force CFE receipt page to always display in desktop view
// @author       You
// @match        https://app.cfe.mx/Aplicaciones/CCFE/ReciboDeLuzGMX/Consulta*
// @match        https://app.cfe.mx/Aplicaciones/CCFE/ReciboDeLuzGMX/*
// @grant        none
// @run-at       document-start
// ==/UserScript==

(function() {
    'use strict';

    // Function to force desktop view
    function forceDesktopView() {
        // Remove or modify viewport meta tag
        const viewportMeta = document.querySelector('meta[name="viewport"]');
        if (viewportMeta) {
            viewportMeta.setAttribute('content', 'width=1024, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no');
        } else {
            // Create viewport meta tag if it doesn't exist
            const newViewport = document.createElement('meta');
            newViewport.name = 'viewport';
            newViewport.content = 'width=1024, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no';
            document.head.appendChild(newViewport);
        }

        // Add CSS to force desktop layout
        const style = document.createElement('style');
        style.textContent = `
            /* Force desktop view styles */
            body {
                min-width: 1024px !important;
                width: auto !important;
            }

            /* Override mobile-specific styles */
            @media screen and (max-width: 768px) {
                * {
                    max-width: none !important;
                    width: auto !important;
                }

                .container,
                .container-fluid {
                    width: 100% !important;
                    max-width: none !important;
                    padding-left: 15px !important;
                    padding-right: 15px !important;
                }

                .row {
                    margin-left: -15px !important;
                    margin-right: -15px !important;
                }

                .col-xs-12,
                .col-sm-12,
                .col-md-12,
                .col-lg-12 {
                    width: 100% !important;
                    float: left !important;
                }

                /* Force table to display properly */
                table {
                    width: 100% !important;
                    table-layout: auto !important;
                }

                /* Prevent text from being too large on mobile */
                input, select, textarea, button {
                    font-size: 14px !important;
                }

                /* Override any mobile-specific hiding */
                .hidden-xs {
                    display: block !important;
                }

                .visible-xs {
                    display: none !important;
                }
            }

            /* Ensure the page doesn't get squeezed */
            html {
                min-width: 1024px !important;
                overflow-x: auto !important;
            }

            /* Override Bootstrap responsive utilities if present */
            .hidden-sm,
            .hidden-md,
            .hidden-lg {
                display: block !important;
            }

            /* Force form elements to maintain desktop sizing */
            .form-control {
                height: 34px !important;
                padding: 6px 12px !important;
                font-size: 14px !important;
            }

            /* Ensure buttons maintain proper size */
            .btn {
                padding: 6px 12px !important;
                font-size: 14px !important;
            }
        `;

        // Insert the style as early as possible
        if (document.head) {
            document.head.appendChild(style);
        } else {
            document.addEventListener('DOMContentLoaded', () => {
                document.head.appendChild(style);
            });
        }

        // Override window.screen properties to simulate desktop
        if (typeof Object.defineProperty === 'function') {
            try {
                Object.defineProperty(window.screen, 'width', {
                    get: function() { return 1920; }
                });
                Object.defineProperty(window.screen, 'availWidth', {
                    get: function() { return 1920; }
                });
                Object.defineProperty(window, 'innerWidth', {
                    get: function() { return Math.max(1024, window.outerWidth || 1024); }
                });
            } catch (e) {
                console.log('Could not override screen properties:', e);
            }
        }

        // Override navigator.userAgent if needed (some sites check this)
        if (navigator.userAgent && navigator.userAgent.includes('Mobile')) {
            Object.defineProperty(navigator, 'userAgent', {
                get: function() {
                    return navigator.userAgent.replace(/Mobile/gi, 'Desktop');
                }
            });
        }
    }

    // Apply desktop view immediately
    forceDesktopView();

    // Also apply when DOM is loaded
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', forceDesktopView);
    }

    // Monitor for dynamic content changes
    if (typeof MutationObserver !== 'undefined') {
        const observer = new MutationObserver(function(mutations) {
            let shouldReapply = false;
            mutations.forEach(function(mutation) {
                if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
                    for (let node of mutation.addedNodes) {
                        if (node.nodeType === Node.ELEMENT_NODE) {
                            if (node.tagName === 'META' && node.getAttribute('name') === 'viewport') {
                                shouldReapply = true;
                                break;
                            }
                        }
                    }
                }
            });

            if (shouldReapply) {
                setTimeout(forceDesktopView, 100);
            }
        });

        observer.observe(document.documentElement, {
            childList: true,
            subtree: true
        });
    }

    console.log('CFE Desktop View Forcer: Applied desktop view settings');
})();