Update.

static/css/billing.css

@@ -369,3 +369,33 @@
     border-radius: 4px;
     font-size: 1rem;
 }
+
+.loading {
+    text-align: center;
+    padding: 3rem;
+    font-size: 1.2rem;
+    color: #6b7280;
+}
+
+.error-message {
+    background: #fee2e2;
+    border: 1px solid #ef4444;
+    color: #991b1b;
+    padding: 1rem;
+    border-radius: 8px;
+    margin: 1rem 0;
+}
+
+.modal-actions {
+    display: flex;
+    gap: 1rem;
+    margin-top: 1.5rem;
+    justify-content: flex-end;
+}
+
+#payment-element {
+    margin: 1.5rem 0;
+    padding: 1rem;
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+}

static/css/code-editor-view.css

@@ -1,13 +1,25 @@
-.code-editor-view {
-    position: absolute;
+.code-editor-overlay {
+    position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
+    background: rgba(0, 0, 0, 0.5);
+    z-index: 1000;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.code-editor-container {
+    width: 90%;
+    height: 90%;
+    max-width: 1400px;
+    background: white;
+    border-radius: 8px;
     display: flex;
     flex-direction: column;
-    background: white;
-    z-index: 100;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
 }
 
 .code-editor-header {
@@ -49,6 +61,16 @@
     font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
     font-size: 14px;
     background: white;
+    user-select: text !important;
+    cursor: text;
+}
+
+.code-editor-body .CodeMirror * {
+    user-select: text !important;
+}
+
+.code-editor-body .CodeMirror-scroll {
+    cursor: text;
 }
 
 .code-editor-body .CodeMirror-gutters {