Structured editor works

1 files changed, 67 insertions, 0 deletions

diff --git a/static/styles.css b/static/styles.css
index 36c0e15..ca6468f 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -783,6 +783,35 @@ abbr {
     gap: var(--spacing-l);
 }
 
+/* Editor Mode Toggle */
+.editor-mode-toggle {
+    display: flex;
+    gap: var(--spacing-s);
+    margin-bottom: var(--spacing-l);
+    padding-bottom: var(--spacing-l);
+    border-bottom: 1px solid var(--border-color);
+}
+
+.editor-mode-toggle .button.small {
+    flex: 1;
+    padding: var(--spacing-m) var(--spacing-l);
+}
+
+.editor-mode-toggle .button.small.active {
+    background-color: var(--color-brand-background);
+    color: white;
+    border-color: var(--color-brand-background);
+}
+
+.config-actions {
+    display: flex;
+    gap: var(--spacing-s);
+    align-items: center;
+    margin-top: var(--spacing-l);
+    padding-top: var(--spacing-l);
+    border-top: 1px solid var(--border-color);
+}
+
 .config-section {
     background: var(--color-surface);
     border: 1px solid var(--border-color);
@@ -846,3 +875,41 @@ abbr {
     padding-top: var(--spacing-l);
     border-top: 1px solid var(--border-color);
 }
+
+/* Structured Editor Enhancements */
+.no-items {
+    color: var(--color-neutral-foreground-subtle);
+    font-style: italic;
+    text-align: center;
+    padding: var(--spacing-m);
+}
+
+.config-section {
+    background: var(--color-surface);
+    border: 1px solid var(--border-color);
+    border-radius: var(--border-radius-medium);
+    padding: var(--spacing-l);
+    transition: border-color 0.2s ease;
+}
+
+.config-section:hover {
+    border-color: var(--color-brand-background);
+}
+
+.config-section h4 {
+    margin: 0 0 var(--spacing-m) 0;
+    color: var(--color-brand-foreground);
+    font-family: monospace;
+    border-bottom: 1px solid var(--border-color);
+    padding-bottom: var(--spacing-s);
+}
+
+.button.warning {
+    background: var(--color-status-warning);
+    border-color: var(--color-status-warning);
+}
+
+.button.warning:hover {
+    background: #c13501;
+    border-color: #c13501;
+}