:root {
            --color-1: #8fc9ae;
            --color-2: #548e87;
            --color-3: #385b66;
            --color-4: #bddaa5;
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family: 'Inter', sans-serif;
            background: #fafafa;
            min-height: 100vh;
            position: relative;
        }
        .diagonal-grid {
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            background-image: 
                repeating-linear-gradient(45deg, rgba(255, 0, 100, 0.1) 0, rgba(255, 0, 100, 0.1) 1px, transparent 1px, transparent 20px),
                repeating-linear-gradient(-45deg, rgba(255, 0, 100, 0.1) 0, rgba(255, 0, 100, 0.1) 1px, transparent 1px, transparent 20px);
            background-size: 40px 40px;
        }
        .glass-card {
            background: #ffffff;
            border-radius: 2rem;
            box-shadow: 0 25px 45px -12px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255,255,255,0.5);
            transition: transform 0.2s ease, box-shadow 0.2s;
        }
        .glass-card:hover {
            box-shadow: 0 30px 55px -15px rgba(4, 102, 200, 0.2);
        }
        .gradient-border {
            background: linear-gradient(135deg, #0466c8, #023e7d);
        }
        .input-fancy {
            transition: all 0.2s;
            border: 2px solid var(--color-4);
            background-color: #ffffff;
        }
        .input-fancy:focus {
            border-color: var(--color-2);
            box-shadow: 0 0 0 4px rgba(84, 142, 135, 0.15);
            outline: none;
        }
        .btn-luxury {
            background: linear-gradient(105deg, var(--color-2) 0%, var(--color-3) 100%);
            transition: all 0.3s cubic-bezier(0.2, 0.9, 0.4, 1.1);
        }
        .btn-luxury:hover {
            transform: translateY(-3px);
            box-shadow: 0 20px 30px -12px var(--color-2);
        }
        .section-title {
            font-size: 1.5rem;
            font-weight: 800;
            background: linear-gradient(120deg, var(--color-3), var(--color-2));
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            border-left: 5px solid var(--color-2);
            padding-left: 1rem;
        }
        .dynamic-card {
            background: #ffffffdd;
            border-radius: 1.2rem;
            transition: all 0.2s;
            border: 1px solid var(--color-4);
        }
        .required-star::after {
            content: "*";
            color: #ef4444;
            margin-left: 4px;
        }
        .expense-row {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
            padding: 0.6rem 0;
            border-bottom: 1px solid #edf2f7;
        }
        .expense-label { flex: 1; font-weight: 600; color: #1e293b; }
        .expense-input { width: 180px; }
        @media (max-width: 640px) { .expense-input { width: 100%; } }
        .fade-slide {
            animation: fadeUp 0.4s ease-out;
        }
        @keyframes fadeUp {
            from { opacity: 0; transform: translateY(12px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .toast-notify {
            position: fixed;
            bottom: 30px;
            right: 30px;
            z-index: 999;
            background: #1f2937;
            color: white;
            padding: 12px 24px;
            border-radius: 60px;
            font-weight: 500;
            backdrop-filter: blur(8px);
            box-shadow: 0 10px 20px rgba(0,0,0,0.2);
            transition: opacity 0.2s;
        }
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 10px; }
        ::-webkit-scrollbar-thumb { background: #0466c8; border-radius: 10px; }

        /* Print Styles - Desktop and Mobile */
        @media print {
            /* General print settings */
            * {
                -webkit-print-color-adjust: exact !important;
                print-color-adjust: exact !important;
            }
            
            body {
                background: white !important;
                font-size: 12pt;
                line-height: 1.4;
                margin: 0;
                padding: 0;
            }
            
            /* Hide elements that shouldn't print */
            .diagonal-grid,
            header,
            footer,
            #menuBtn,
            #mobileMenu,
            .btn-luxury,
            #printBtn,
            .add-address-btn,
            .add-employment-btn,
            .remove-prev,
            .remove-emp,
            #formSubmitFeedback,
            .fixed {
                display: none !important;
            }
            
            /* Print-friendly layout */
            main {
                max-width: 100% !important;
                margin: 0 !important;
                padding: 20px !important;
            }
            
            /* Glass cards for print */
            .glass-card {
                background: white !important;
                border: 1px solid #ddd !important;
                box-shadow: none !important;
                border-radius: 8px !important;
                margin-bottom: 20px !important;
                page-break-inside: avoid;
                break-inside: avoid;
            }
            
            /* Section titles */
            .section-title {
                color: #023e7d !important;
                background: none !important;
                background-clip: unset !important;
                -webkit-background-clip: unset !important;
                border-left: 3px solid #0466c8 !important;
                font-size: 16pt !important;
                margin-bottom: 15px !important;
            }
            
            /* Form inputs - show values clearly */
            .input-fancy {
                border: 1px solid #ccc !important;
                background: white !important;
                color: black !important;
                padding: 8px !important;
                border-radius: 4px !important;
                font-size: 11pt !important;
                height: auto !important;
            }
            
            /* Labels */
            label {
                font-weight: bold !important;
                color: #333 !important;
                font-size: 11pt !important;
                display: block !important;
                margin-bottom: 4px !important;
            }
            
            /* Required star */
            .required-star::after {
                color: #ef4444 !important;
            }
            
            /* Grid layouts for print */
            .grid {
                display: block !important;
            }
            
            .grid > div {
                margin-bottom: 12px !important;
                page-break-inside: avoid;
            }
            
            /* Dynamic cards */
            .dynamic-card {
                background: white !important;
                border: 1px solid #ddd !important;
                border-radius: 6px !important;
                padding: 15px !important;
                margin-bottom: 15px !important;
                page-break-inside: avoid;
            }
            
            /* Enhanced Monthly Expenses Print Styles */
            .glass-card:has(#expensesDynamic) {
                page-break-inside: avoid;
                orphans: 4;
                widows: 4;
            }

            /* Information banner */
            .glass-card .bg-blue-50 {
                background: #f0f7ff !important;
                border: 1px solid #b3d9ff !important;
                padding: 8px 12px !important;
                margin-bottom: 20px !important;
                page-break-inside: avoid;
            }

            /* Category sections */
            .glass-card .grid > div {
                background: #fafafa !important;
                border: 1px solid #e0e0e0 !important;
                border-radius: 8px !important;
                padding: 12px !important;
                margin-bottom: 12px !important;
                page-break-inside: avoid;
            }

            /* Category headers */
            .glass-card .grid > div h3 {
                color: #023e7d !important;
                font-size: 12pt !important;
                font-weight: bold !important;
                margin-bottom: 10px !important;
                border-bottom: 2px solid #0466c8 !important;
                padding-bottom: 4px !important;
                display: block !important;
            }

            /* Expense field labels */
            .glass-card .grid label {
                display: block !important;
                font-weight: 600 !important;
                color: #333 !important;
                font-size: 10pt !important;
                margin-bottom: 4px !important;
            }

            /* Expense input containers */
            .glass-card .grid .relative {
                margin-bottom: 8px !important;
            }

            /* Dollar signs in print */
            .glass-card .grid .absolute span {
                color: #666 !important;
                font-weight: bold !important;
                font-size: 10pt !important;
            }

            /* Expense input fields */
            .expense-input {
                width: 100% !important;
                border: 1px solid #ccc !important;
                background: white !important;
                color: black !important;
                padding: 6px 6px 6px 20px !important;
                border-radius: 4px !important;
                font-size: 10pt !important;
                font-weight: normal !important;
                text-align: left !important;
                height: auto !important;
                page-break-inside: avoid;
            }

            /* Expense input values (printed values) */
            .expense-input:disabled,
            .expense-input[readonly] {
                background: #f9f9f9 !important;
                border-color: #ddd !important;
                color: #333 !important;
                font-weight: 600 !important;
            }

            /* Total summary section */
            .glass-card .bg-gradient-to-r {
                background: linear-gradient(to right, #f0f7ff, #e8f4fd) !important;
                border: 2px solid #0466c8 !important;
                border-radius: 8px !important;
                padding: 16px !important;
                margin-top: 20px !important;
                page-break-inside: avoid;
            }

            /* Total summary layout */
            .glass-card .bg-gradient-to-r .flex {
                display: flex !important;
                justify-content: space-between !important;
                align-items: center !important;
                gap: 20px !important;
            }

            /* Total summary text */
            .glass-card .bg-gradient-to-r h4 {
                color: #023e7d !important;
                font-size: 14pt !important;
                font-weight: bold !important;
                margin: 0 !important;
            }

            .glass-card .bg-gradient-to-r p {
                color: #666 !important;
                font-size: 9pt !important;
                margin: 4px 0 0 0 !important;
            }

            /* Total amount display */
            #totalExpensesSpan {
                color: #0466c8 !important;
                font-size: 18pt !important;
                font-weight: bold !important;
                display: block !important;
                margin-bottom: 2px !important;
            }

            .glass-card .text-right p {
                color: #666 !important;
                font-size: 9pt !important;
                margin: 0 !important;
            }

            /* Legacy expense rows (fallback) */
            .expense-row {
                display: flex !important;
                justify-content: space-between !important;
                padding: 6px 0 !important;
                border-bottom: 1px solid #eee !important;
                page-break-inside: avoid;
            }
            
            .expense-label {
                flex: 1 !important;
                font-weight: 600 !important;
                color: #333 !important;
                font-size: 11pt !important;
            }
            
            /* Icons - hide or replace */
            [data-lucide] {
                display: none !important;
            }
            
            /* Remove hover effects and transitions */
            * {
                transition: none !important;
                transform: none !important;
            }
            
            /* Page breaks */
            .glass-card {
                page-break-inside: avoid;
                orphans: 3;
                widows: 3;
            }
            
            /* Print header */
            .print-header {
                text-align: center !important;
                margin-bottom: 30px !important;
                border-bottom: 2px solid #0466c8 !important;
                padding-bottom: 20px !important;
            }
            
            .print-header h1 {
                color: #023e7d !important;
                font-size: 20pt !important;
                margin-bottom: 10px !important;
            }
            
            .print-header p {
                color: #666 !important;
                font-size: 10pt !important;
            }
            
            /* Print sections */
            .print-section {
                margin-bottom: 25px !important;
                page-break-inside: avoid;
            }
            
            .print-section h2 {
                color: #0466c8 !important;
                font-size: 14pt !important;
                border-bottom: 1px solid #ddd !important;
                padding-bottom: 5px !important;
                margin-bottom: 15px !important;
            }
            
            /* Mobile print adjustments */
            @media print and (max-width: 8.5in) {
                body {
                    font-size: 10pt;
                }
                
                .section-title {
                    font-size: 14pt !important;
                }
                
                /* Monthly expenses mobile print */
                .glass-card:has(#expensesDynamic) .grid {
                    grid-template-columns: 1fr !important;
                    gap: 16px !important;
                }
                
                .glass-card .grid > div {
                    padding: 10px !important;
                    margin-bottom: 10px !important;
                }
                
                .glass-card .grid > div h3 {
                    font-size: 11pt !important;
                    margin-bottom: 8px !important;
                }
                
                .glass-card .grid label {
                    font-size: 9pt !important;
                    margin-bottom: 3px !important;
                }
                
                .glass-card .grid .expense-input {
                    font-size: 9pt !important;
                    padding: 5px 5px 5px 18px !important;
                }
                
                .glass-card .grid .absolute span {
                    font-size: 9pt !important;
                }
                
                /* Total summary mobile */
                .glass-card .bg-gradient-to-r {
                    padding: 12px !important;
                    margin-top: 16px !important;
                }
                
                .glass-card .bg-gradient-to-r .flex {
                    flex-direction: column !important;
                    gap: 8px !important;
                    text-align: center !important;
                }
                
                #totalExpensesSpan {
                    font-size: 16pt !important;
                }
                
                .glass-card .bg-gradient-to-r h4 {
                    font-size: 12pt !important;
                    margin-bottom: 2px !important;
                }
                
                /* Legacy fallback */
                .expense-label {
                    font-size: 9pt !important;
                }
                
                .expense-input {
                    width: 100px !important;
                    font-size: 9pt !important;
                }
                
                .input-fancy {
                    font-size: 10pt !important;
                    padding: 6px !important;
                }
                
                label {
                    font-size: 10pt !important;
                }
                
                .glass-card {
                    padding: 12px !important;
                    margin-bottom: 15px !important;
                }
            }
            
            /* Small mobile print */
            @media print and (max-width: 6in) {
                body {
                    font-size: 9pt;
                }
                
                main {
                    padding: 15px !important;
                }
                
                .section-title {
                    font-size: 12pt !important;
                }
                
                /* Monthly expenses small mobile print */
                .glass-card:has(#expensesDynamic) .grid {
                    grid-template-columns: 1fr !important;
                    gap: 12px !important;
                }
                
                .glass-card .grid > div {
                    padding: 8px !important;
                    margin-bottom: 8px !important;
                }
                
                .glass-card .grid > div h3 {
                    font-size: 10pt !important;
                    margin-bottom: 6px !important;
                    padding-bottom: 3px !important;
                }
                
                .glass-card .grid label {
                    font-size: 8pt !important;
                    margin-bottom: 2px !important;
                }
                
                .glass-card .grid .expense-input {
                    font-size: 8pt !important;
                    padding: 4px 4px 4px 16px !important;
                }
                
                .glass-card .grid .absolute span {
                    font-size: 8pt !important;
                    top: 8px !important;
                }
                
                /* Total summary small mobile */
                .glass-card .bg-gradient-to-r {
                    padding: 10px !important;
                    margin-top: 12px !important;
                }
                
                .glass-card .bg-gradient-to-r .flex {
                    flex-direction: column !important;
                    gap: 6px !important;
                    text-align: center !important;
                }
                
                #totalExpensesSpan {
                    font-size: 14pt !important;
                }
                
                .glass-card .bg-gradient-to-r h4 {
                    font-size: 11pt !important;
                }
                
                .glass-card .bg-gradient-to-r p {
                    font-size: 8pt !important;
                }
                
                /* Information banner small mobile */
                .glass-card .bg-blue-50 {
                    padding: 6px 8px !important;
                    margin-bottom: 12px !important;
                }
                
                .glass-card .bg-blue-50 p {
                    font-size: 8pt !important;
                }
                
                /* Legacy fallback */
                .expense-row {
                    flex-direction: column !important;
                    gap: 4px !important;
                }
                
                .expense-input {
                    width: 100% !important;
                    text-align: left !important;
                }
                
                .dynamic-card {
                    padding: 10px !important;
                }
            }
            
            /* Print footer */
            .print-footer {
                margin-top: 40px !important;
                padding-top: 20px !important;
                border-top: 1px solid #ddd !important;
                text-align: center !important;
                color: #666 !important;
                font-size: 9pt !important;
                page-break-inside: avoid;
            }
        }

        /* Thank You Popup Styles */
        .thank-you-popup {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.8);
            backdrop-filter: blur(5px);
            z-index: 9999;
            display: none;
            align-items: center;
            justify-content: center;
            animation: fadeIn 0.3s ease-out;
        }

        .thank-you-popup.show {
            display: flex;
        }

        .popup-content {
            background: white;
            border-radius: 20px;
            padding: 40px;
            max-width: 500px;
            width: 90%;
            text-align: center;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
            animation: slideUp 0.4s ease-out;
            position: relative;
        }

        .popup-icon {
            width: 80px;
            height: 80px;
            background: linear-gradient(135deg, #0466c8, #023e7d);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;
            animation: scaleIn 0.5s ease-out 0.2s both;
        }

        .popup-icon i {
            color: white;
            font-size: 36px;
        }

        .popup-title {
            color: #023e7d;
            font-size: 28px;
            font-weight: 800;
            margin-bottom: 15px;
            animation: fadeInUp 0.6s ease-out 0.3s both;
        }

        .popup-message {
            color: #666;
            font-size: 16px;
            line-height: 1.6;
            margin-bottom: 25px;
            animation: fadeInUp 0.6s ease-out 0.4s both;
        }

        .popup-button {
            background: linear-gradient(105deg, #548e87 0%, #385b66 100%);
            color: white;
            border: none;
            padding: 15px 40px;
            border-radius: 50px;
            font-size: 16px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            animation: fadeInUp 0.6s ease-out 0.5s both;
        }

        .popup-button:hover {
            transform: translateY(-2px);
            box-shadow: 0 15px 30px -10px #548e87;
        }

        .close-popup {
            position: absolute;
            top: 20px;
            right: 20px;
            background: #f3f4f6;
            border: none;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.2s ease;
            animation: fadeIn 0.6s ease-out 0.6s both;
        }

        .close-popup:hover {
            background: #e5e7eb;
            transform: rotate(90deg);
        }

        .close-popup i {
            color: #666;
            font-size: 18px;
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        @keyframes slideUp {
            from { 
                opacity: 0;
                transform: translateY(30px);
            }
            to { 
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from { 
                opacity: 0;
                transform: translateY(20px);
            }
            to { 
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes scaleIn {
            from { 
                opacity: 0;
                transform: scale(0.5);
            }
            to { 
                opacity: 1;
                transform: scale(1);
            }
        }

        /* Mobile popup adjustments */
        @media (max-width: 640px) {
            .popup-content {
                padding: 30px 20px;
                margin: 20px;
            }

            .popup-title {
                font-size: 24px;
            }

            .popup-message {
                font-size: 14px;
            }

            .popup-button {
                padding: 12px 30px;
                font-size: 14px;
            }

            .popup-icon {
                width: 60px;
                height: 60px;
            }

            .popup-icon i {
                font-size: 28px;
            }
        }