From 0334c5979dc367d5673c6444f7471b4ea082d213 Mon Sep 17 00:00:00 2001
From: Bytemalte <malxte@gmx.de>
Date: Thu, 22 Jan 2026 14:08:59 +0100
Subject: [PATCH] Multi Feeds + Ron rss save

---
 src-tauri/Cargo.toml  |   1 +
 src-tauri/src/lib.rs  |   3 +-
 src-tauri/src/news.rs | 180 +++++++++++++++--------
 src/pages/news.rs     | 273 ++++++++++++++++++-----------------
 styles.css            | 324 +++++++++++++++++++++++++++++-------------
 5 files changed, 488 insertions(+), 293 deletions(-)

diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
index dc5854f..613653d 100644
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -20,6 +20,7 @@ serde_json = "1"
 easy-nostr = { path = "./easy-nostr" }
 tokio = { version = "1", features = ["full"] }
 feed-rs = "2.3.1"
+ron = "0.8"
 
 # FIX: default-features entfernt und rustls-tls hinzugefügt
 reqwest = { version = "0.12", default-features = false, features = ["json", "rustls-tls"] }
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index d23f2e0..cb50856 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -10,9 +10,10 @@ pub fn run() {
         .invoke_handler(tauri::generate_handler![
             home::fetch_nostr_posts,
             news::save_openrouter_key,
+            news::load_rss_config,
+            news::save_rss_urls, // Geändert von save_rss_url zu save_rss_urls
             news::fetch_ai_news,
             news::fetch_rss_news,
-            news::save_rss_url,
         ])
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
diff --git a/src-tauri/src/news.rs b/src-tauri/src/news.rs
index 0c4e77b..5358182 100644
--- a/src-tauri/src/news.rs
+++ b/src-tauri/src/news.rs
@@ -1,22 +1,35 @@
 use serde::{Deserialize, Serialize};
+use std::fs;
+use std::path::PathBuf;
 use std::sync::Mutex;
-use tauri::State;
+use tauri::{AppHandle, Manager, State};
+
+#[derive(Serialize, Deserialize, Default, Clone)]
+pub struct RssConfig {
+    pub urls: Vec<String>,
+}
 
 #[derive(Default)]
 pub struct NewsState {
     pub openrouter_key: Mutex<String>,
-    pub rss_url: Mutex<String>, // Neu: Speicher für die RSS-URL
+    pub rss_config: Mutex<RssConfig>,
 }
 
-#[derive(Serialize, Deserialize, Clone)]
+#[derive(Serialize, Deserialize, Clone, PartialEq, Debug)]
 #[serde(rename_all = "camelCase")]
 pub struct NewsArticle {
     pub content: String,
     pub author: String,
-    pub created_at: u64,
+    pub created_at: String,
+}
+
+fn get_config_path(app: &AppHandle) -> PathBuf {
+    app.path()
+        .app_config_dir()
+        .unwrap_or_else(|_| PathBuf::from("."))
+        .join("rss.ron")
 }
 
-// Bestehender Command für den API Key
 #[tauri::command]
 pub async fn save_openrouter_key(key: String, state: State<'_, NewsState>) -> Result<(), String> {
     let mut lock = state.openrouter_key.lock().map_err(|_| "Lock failed")?;
@@ -24,11 +37,63 @@ pub async fn save_openrouter_key(key: String, state: State<'_, NewsState>) -> Re
     Ok(())
 }
 
-// NEU: Command zum Speichern der RSS URL
 #[tauri::command]
-pub async fn save_rss_url(url: String, state: State<'_, NewsState>) -> Result<(), String> {
-    let mut lock = state.rss_url.lock().map_err(|_| "Lock failed")?;
-    *lock = url.trim().to_string();
+pub async fn load_rss_config(
+    app: AppHandle,
+    state: State<'_, NewsState>,
+) -> Result<Vec<String>, String> {
+    let path = get_config_path(&app);
+
+    // Initialisierung mit Standard-Feeds, falls Datei nicht existiert
+    if !path.exists() {
+        let default_urls = vec![
+            "https://www.nasa.gov/news-release/feed/".to_string(),
+            "https://www.heise.de/rss/heise-atom.xml".to_string(),
+        ];
+
+        let config = RssConfig {
+            urls: default_urls.clone(),
+        };
+
+        if let Some(parent) = path.parent() {
+            fs::create_dir_all(parent).map_err(|e| e.to_string())?;
+        }
+
+        let ron_str = ron::to_string(&config).map_err(|e| e.to_string())?;
+        fs::write(&path, ron_str).map_err(|e| e.to_string())?;
+
+        let mut lock = state.rss_config.lock().unwrap();
+        lock.urls = default_urls.clone();
+
+        return Ok(default_urls);
+    }
+
+    let content = fs::read_to_string(path).map_err(|e| e.to_string())?;
+    let config: RssConfig = ron::from_str(&content).map_err(|e| e.to_string())?;
+
+    let mut lock = state.rss_config.lock().unwrap();
+    *lock = config.clone();
+    Ok(config.urls)
+}
+
+#[tauri::command]
+pub async fn save_rss_urls(
+    urls: Vec<String>,
+    app: AppHandle,
+    state: State<'_, NewsState>,
+) -> Result<(), String> {
+    let config = RssConfig { urls };
+    let path = get_config_path(&app);
+
+    if let Some(parent) = path.parent() {
+        fs::create_dir_all(parent).map_err(|e| e.to_string())?;
+    }
+
+    let ron_str = ron::to_string(&config).map_err(|e| e.to_string())?;
+    fs::write(path, ron_str).map_err(|e| e.to_string())?;
+
+    let mut lock = state.rss_config.lock().unwrap();
+    *lock = config;
     Ok(())
 }
 
@@ -39,79 +104,74 @@ pub async fn fetch_ai_news(state: State<'_, NewsState>) -> Result<Vec<NewsArticl
         .lock()
         .map_err(|_| "Lock failed")?
         .clone();
+
     if key.is_empty() {
-        return Err("API Key fehlt.".to_string());
+        return Err("API Key fehlt.".into());
     }
 
     let client = reqwest::Client::new();
-    let body = serde_json::json!({
-        "model": "minimax/minimax-m2.1",
-        "messages": [
-            {"role": "system", "content": "Kurze News, 1-2 Sätze, Deutsch."},
-            {"role": "user", "content": "Tech-News."}
-        ]
-    });
-
     let response = client
         .post("https://openrouter.ai/api/v1/chat/completions")
         .header("Authorization", format!("Bearer {}", key))
-        .json(&body)
+        .json(&serde_json::json!({
+            "model": "minimax/minimax-m2.1",
+            "messages": [
+                {"role": "system", "content": "Kurze News, 1-2 Sätze, Deutsch."},
+                {"role": "user", "content": "Tech-News."}
+            ]
+        }))
         .send()
         .await
         .map_err(|e| e.to_string())?;
 
-    let json_res: serde_json::Value = response.json().await.map_err(|e| e.to_string())?;
-    let content = json_res["choices"][0]["message"]["content"]
+    let json: serde_json::Value = response.json().await.map_err(|e| e.to_string())?;
+    let content = json["choices"][0]["message"]["content"]
         .as_str()
         .unwrap_or("Fehler")
         .to_string();
 
     Ok(vec![NewsArticle {
         content,
-        author: "OpenRouter AI".to_string(),
-        created_at: 0,
+        author: "OpenRouter AI".into(),
+        created_at: "Gerade eben".into(),
     }])
 }
 
-// VERBESSERT: Lädt nun den echten Feed von der gespeicherten URL
 #[tauri::command]
 pub async fn fetch_rss_news(state: State<'_, NewsState>) -> Result<Vec<NewsArticle>, String> {
-    let url = state.rss_url.lock().map_err(|_| "Lock failed")?.clone();
+    let urls = state.rss_config.lock().unwrap().urls.clone();
+    let mut all_articles = Vec::new();
+    let client = reqwest::Client::new();
 
-    if url.is_empty() {
-        return Err("RSS URL fehlt. Bitte in den Einstellungen eintragen.".to_string());
+    for url in urls {
+        if let Ok(res) = client.get(&url).send().await {
+            if let Ok(bytes) = res.bytes().await {
+                if let Ok(feed) = feed_rs::parser::parse(&bytes[..]) {
+                    let source = feed
+                        .title
+                        .map(|t| t.content)
+                        .unwrap_or_else(|| "RSS".into());
+
+                    for entry in feed.entries.into_iter().take(3) {
+                        let date = entry
+                            .published
+                            .or(entry.updated)
+                            .map(|d| d.format("%d.%m.%Y %H:%M").to_string())
+                            .unwrap_or_else(|| "--.--.----".into());
+
+                        all_articles.push(NewsArticle {
+                            content: format!(
+                                "### {}\n\n{}",
+                                entry.title.map(|t| t.content).unwrap_or_default(),
+                                entry.summary.map(|s| s.content).unwrap_or_default()
+                            ),
+                            author: source.clone(),
+                            created_at: date,
+                        });
+                    }
+                }
+            }
+        }
     }
-
-    let response = reqwest::get(&url)
-        .await
-        .map_err(|e| e.to_string())?
-        .bytes()
-        .await
-        .map_err(|e| e.to_string())?;
-
-    let feed = feed_rs::parser::parse(&response[..]).map_err(|e| e.to_string())?;
-
-    let articles = feed
-        .entries
-        .into_iter()
-        .take(5)
-        .map(|entry| NewsArticle {
-            content: format!(
-                "### {}\n\n{}",
-                entry.title.map(|t| t.content).unwrap_or_default(),
-                entry
-                    .summary
-                    .map(|s| s.content)
-                    .unwrap_or_else(|| "Kein Inhalt".to_string())
-            ),
-            author: feed
-                .title
-                .as_ref()
-                .map(|t| t.content.clone())
-                .unwrap_or_else(|| "RSS".into()),
-            created_at: entry.updated.map(|d| d.timestamp() as u64).unwrap_or(0),
-        })
-        .collect();
-
-    Ok(articles)
+    Ok(all_articles)
 }
diff --git a/src/pages/news.rs b/src/pages/news.rs
index b185538..3d2fb36 100644
--- a/src/pages/news.rs
+++ b/src/pages/news.rs
@@ -22,17 +22,16 @@ pub enum NewsMode {
 pub struct NewsArticle {
     pub content: String,
     pub author: String,
-    pub created_at: u64,
+    pub created_at: String,
 }
 
 #[derive(Serialize)]
 struct StringArgs {
-    pub key: String,
+    key: String,
 }
-
 #[derive(Serialize)]
-struct UrlArgs {
-    pub url: String,
+struct UrlsArgs {
+    urls: Vec<String>,
 }
 
 #[function_component(News)]
@@ -41,203 +40,203 @@ pub fn news() -> Html {
     let error_msg = use_state(|| None::<String>);
     let show_config = use_state(|| false);
     let current_mode = use_state(|| NewsMode::Ai);
-    let api_key_ref = use_node_ref();
-    let rss_url_ref = use_node_ref();
+    let rss_urls = use_state(Vec::<String>::new);
 
+    let api_key_ref = use_node_ref();
+    let new_url_ref = use_node_ref();
+
+    // Init: Konfiguration laden
+    {
+        let rss_urls = rss_urls.clone();
+        use_effect_with((), move |_| {
+            spawn_local(async move {
+                if let Ok(res) = invoke("load_rss_config", JsValue::NULL).await {
+                    if let Ok(urls) = serde_wasm_bindgen::from_value::<Vec<String>>(res) {
+                        rss_urls.set(urls);
+                    }
+                }
+            });
+            || ()
+        });
+    }
+
+    // News laden Funktion
     let load_news = {
         let articles = articles.clone();
         let error_msg = error_msg.clone();
-        let current_mode = current_mode.clone();
-
-        Callback::from(move |_e: MouseEvent| {
+        let mode = *current_mode;
+        Callback::from(move |_| {
             let articles = articles.clone();
             let error_msg = error_msg.clone();
-            let mode = *current_mode;
-
             articles.set(None);
             error_msg.set(None);
-
             spawn_local(async move {
-                let command = match mode {
-                    NewsMode::Ai => "fetch_ai_news",
-                    NewsMode::Rss => "fetch_rss_news",
+                let cmd = if mode == NewsMode::Ai {
+                    "fetch_ai_news"
+                } else {
+                    "fetch_rss_news"
                 };
-
-                match invoke(command, JsValue::NULL).await {
-                    Ok(res) => match serde_wasm_bindgen::from_value::<Vec<NewsArticle>>(res) {
-                        Ok(new_news) => articles.set(Some(new_news)),
-                        Err(e) => error_msg.set(Some(format!("Datenfehler: {}", e))),
-                    },
-                    Err(e) => {
-                        let msg = e.as_string().unwrap_or_else(|| "Fehler beim Laden".into());
-                        error_msg.set(Some(msg));
+                match invoke(cmd, JsValue::NULL).await {
+                    Ok(res) => {
+                        let data = serde_wasm_bindgen::from_value::<Vec<NewsArticle>>(res)
+                            .unwrap_or_default();
+                        articles.set(Some(data));
                     }
+                    Err(e) => error_msg.set(Some(e.as_string().unwrap_or_default())),
                 }
             });
         })
     };
 
-    let save_settings = {
-        let show_config = show_config.clone();
-        let api_key_ref = api_key_ref.clone();
-        let rss_url_ref = rss_url_ref.clone();
-        let load_news = load_news.clone();
-
-        Callback::from(move |_| {
-            let key = api_key_ref.cast::<HtmlInputElement>().unwrap().value();
-            let url = rss_url_ref.cast::<HtmlInputElement>().unwrap().value();
-            let show_config_handle = show_config.clone();
-            let load_news_handle = load_news.clone();
-
-            spawn_local(async move {
-                let key_args = serde_wasm_bindgen::to_value(&StringArgs { key }).unwrap();
-                let url_args = serde_wasm_bindgen::to_value(&UrlArgs { url }).unwrap();
-
-                let _ = invoke("save_openrouter_key", key_args).await;
-                let _ = invoke("save_rss_url", url_args).await;
-
-                show_config_handle.set(false);
-                load_news_handle.emit(MouseEvent::new("click").unwrap());
-            });
-        })
-    };
-
-    let switch_mode = {
-        let current_mode = current_mode.clone();
-        let load_news = load_news.clone();
-        Callback::from(move |mode: NewsMode| {
-            current_mode.set(mode);
-            load_news.emit(MouseEvent::new("click").unwrap());
-        })
-    };
-
+    // Automatisches Laden bei Modus-Wechsel
     {
         let load_news = load_news.clone();
-        use_effect_with((), move |_| {
+        use_effect_with((*current_mode).clone(), move |_| {
             load_news.emit(MouseEvent::new("click").unwrap());
             || ()
         });
     }
 
-    let mode = *current_mode;
-    let is_config_visible = *show_config;
+    let save_settings = {
+        let rss_urls = rss_urls.clone();
+        let api_key_ref = api_key_ref.clone();
+        let show_config = show_config.clone();
+        let load_news = load_news.clone();
+        Callback::from(move |_| {
+            let key = api_key_ref
+                .cast::<HtmlInputElement>()
+                .map(|i| i.value())
+                .unwrap_or_default();
+            let urls = (*rss_urls).clone();
+            let show_config = show_config.clone();
+            let load_news = load_news.clone();
+            spawn_local(async move {
+                let _ = invoke(
+                    "save_openrouter_key",
+                    serde_wasm_bindgen::to_value(&StringArgs { key }).unwrap(),
+                )
+                .await;
+                let _ = invoke(
+                    "save_rss_urls",
+                    serde_wasm_bindgen::to_value(&UrlsArgs { urls }).unwrap(),
+                )
+                .await;
+                show_config.set(false);
+                load_news.emit(MouseEvent::new("click").unwrap());
+            });
+        })
+    };
 
     html! {
         <div class="feed-container">
             <div class="feed-header">
-                <h1 class="feed-title">
-                    { if mode == NewsMode::Ai { "📰 KI News" } else { "📻 RSS Feed" } }
-                </h1>
-
-                <div style="display: flex; gap: 10px; align-items: center;">
-                    <div class="mode-switch">
+                <div class="header-main">
+                    <h1>{ if *current_mode == NewsMode::Ai { "📰 KI News" } else { "📻 RSS Feeds" } }</h1>
+                    <div class="mode-toggle">
                         <button
-                            class={if mode == NewsMode::Ai { "switch-btn active-ai" } else { "switch-btn" }}
-                            onclick={let switch = switch_mode.clone(); move |_| switch.emit(NewsMode::Ai)}
-                        >
+                            class={if *current_mode == NewsMode::Ai { "toggle-btn active" } else { "toggle-btn" }}
+                            onclick={let m = current_mode.clone(); move |_| m.set(NewsMode::Ai)}>
                             {"KI"}
                         </button>
                         <button
-                            class={if mode == NewsMode::Rss { "switch-btn active-rss" } else { "switch-btn" }}
-                            onclick={let switch = switch_mode.clone(); move |_| switch.emit(NewsMode::Rss)}
-                        >
+                            class={if *current_mode == NewsMode::Rss { "toggle-btn active" } else { "toggle-btn" }}
+                            onclick={let m = current_mode.clone(); move |_| m.set(NewsMode::Rss)}>
                             {"RSS"}
                         </button>
                     </div>
-
-                    <button class="reload-btn" onclick={let sc = show_config.clone(); move |_| sc.set(!*sc)}>
-                        {"⚙️"}
-                    </button>
-                    <button class="reload-btn" onclick={load_news.clone()}>
-                        {"🔄"}
-                    </button>
+                </div>
+                <div class="header-actions">
+                    <button class="action-btn" onclick={let sc = show_config.clone(); move |_| sc.set(!*sc)}>{"⚙️"}</button>
+                    <button class="action-btn" onclick={load_news.clone()}>{"🔄"}</button>
                 </div>
             </div>
 
-            if is_config_visible {
+            if *show_config {
                 <div class="config-panel">
-                    <h3>{"Einstellungen"}</h3>
-                    <div style="margin-bottom: 10px;">
-                        <label style="font-size: 0.7rem; color: #4a90e2; display: block; margin-bottom: 4px;">{"OPENROUTER KEY"}</label>
-                        <input
-                            ref={api_key_ref}
-                            type="password"
-                            placeholder="sk-or-v1-..."
-                            class="config-input"
-                        />
+                    <div class="config-section">
+                        <label>{"OPENROUTER API KEY"}</label>
+                        <input ref={api_key_ref} type="password" class="config-input" placeholder="sk-..." />
                     </div>
-                    <div style="margin-bottom: 15px;">
-                        <label style="font-size: 0.7rem; color: #facc15; display: block; margin-bottom: 4px;">{"RSS URL"}</label>
-                        <input
-                            ref={rss_url_ref}
-                            type="text"
-                            placeholder="https://zum-rss-feed.xml"
-                            class="config-input"
-                        />
+
+                    <div class="config-section">
+                        <label>{"RSS FEEDS"}</label>
+                        <div class="rss-input-row">
+                            <input ref={new_url_ref.clone()} type="text" class="config-input" placeholder="URL hinzufügen..." />
+                            <button class="add-btn" onclick={
+                                let rss_urls = rss_urls.clone();
+                                let new_url_ref = new_url_ref.clone();
+                                move |_| {
+                                    if let Some(input) = new_url_ref.cast::<HtmlInputElement>() {
+                                        let val = input.value();
+                                        if !val.trim().is_empty() {
+                                            let mut list = (*rss_urls).clone();
+                                            list.push(val);
+                                            rss_urls.set(list);
+                                            input.set_value("");
+                                        }
+                                    }
+                                }
+                            }>{"+"}</button>
+                        </div>
+                        <div class="rss-list-scroll">
+                            { for (*rss_urls).iter().enumerate().map(|(i, url)| html! {
+                                <div class="rss-url-entry" key={i}>
+                                    <span class="url-text">{url}</span>
+                                    <button class="delete-btn" onclick={
+                                        let rss_urls = rss_urls.clone();
+                                        move |_| {
+                                            let mut list = (*rss_urls).clone();
+                                            list.remove(i);
+                                            rss_urls.set(list);
+                                        }
+                                    }>{"✕"}</button>
+                                </div>
+                            }) }
+                        </div>
                     </div>
-                    <button class="save-btn" onclick={save_settings}>{"Alles Speichern"}</button>
+                    <button class="save-master-btn" onclick={save_settings}>{"Alles Speichern"}</button>
                 </div>
             }
 
-            {
-                if let Some(msg) = (*error_msg).clone() {
-                    html! {
-                        <div class="error-card">
-                            <p>{ format!("⚠️ {}", msg) }</p>
-                        </div>
-                    }
+            <div class="posts-list">
+                { if let Some(msg) = (*error_msg).clone() {
+                    html! { <div class="error-box">{ format!("⚠️ Error: {}", msg) }</div> }
                 } else if let Some(list) = (*articles).clone() {
-                    html! {
-                        <div class="posts-list">
-                            { for list.iter().map(|a| html! { <NewsCard article={a.clone()} mode={mode} /> }) }
-                            <div class="footer-action">
-                                <button class="reload-btn-large" onclick={load_news}>
-                                    { if mode == NewsMode::Ai { "Mehr News generieren" } else { "Feed aktualisieren" } }
-                                </button>
-                            </div>
-                        </div>
+                    if list.is_empty() {
+                        html! { <p class="empty-msg">{"Keine Nachrichten gefunden. Überprüfe deine Feeds."}</p> }
+                    } else {
+                        html! { for list.iter().map(|a| html! { <NewsCard article={a.clone()} /> }) }
                     }
                 } else {
-                    html! {
-                        <p class="status-msg">
-                            { if mode == NewsMode::Ai { "KI schreibt gerade News..." } else { "RSS Feeds werden geladen..." } }
-                        </p>
-                    }
-                }
-            }
+                    html! { <div class="loading-spinner">{"Lade Nachrichten..."}</div> }
+                } }
+            </div>
         </div>
     }
 }
 
 #[derive(Properties, PartialEq)]
-pub struct NewsProps {
+pub struct NewsCardProps {
     pub article: NewsArticle,
-    pub mode: NewsMode,
 }
 
 #[function_component(NewsCard)]
-pub fn news_card(props: &NewsProps) -> Html {
+pub fn news_card(props: &NewsCardProps) -> Html {
     let a = &props.article;
-    let mode = props.mode;
-
     let markdown_html = {
         let mut options = Options::empty();
         options.insert(Options::ENABLE_STRIKETHROUGH);
         let parser = Parser::new_ext(&a.content, options);
-        let mut html_output = String::new();
-        md_html::push_html(&mut html_output, parser);
-        html_output
+        let mut out = String::new();
+        md_html::push_html(&mut out, parser);
+        out
     };
 
     html! {
         <div class="post-card">
             <div class="post-header">
-                <span class="post-author" style={if mode == NewsMode::Ai { "color: #4a90e2;" } else { "color: #facc15;" }}>
-                    { &a.author }
-                </span>
-                <span class="post-date">
-                    { if mode == NewsMode::Ai { "✨ AI Generated" } else { "📡 RSS Source" } }
-                </span>
+                <span class="post-author">{ &a.author }</span>
+                <span class="post-date">{ &a.created_at }</span>
             </div>
             <div class="post-content markdown-body">
                 { Html::from_html_unchecked(AttrValue::from(markdown_html)) }
diff --git a/styles.css b/styles.css
index ed15721..a4f7a40 100644
--- a/styles.css
+++ b/styles.css
@@ -234,125 +234,262 @@ html {
 }
 
 /* --- Mode Switcher (KI / RSS) --- */
-.mode-switch {
+@import url("assets/home.css");
+@import url("assets/news.css");
+@import url("assets/greet.css");
+
+/* --- Global & Layout --- */
+body {
+    background-color: #0f0f13;
+    color: #e2e2e7;
+    font-family:
+        "Inter",
+        -apple-system,
+        sans-serif;
+    margin: 0;
+    line-height: 1.5;
+    display: flex;
+    justify-content: center;
+}
+
+html {
+    scroll-behavior: smooth;
+}
+
+.feed-container {
+    width: 100%;
+    max-width: 600px;
+    padding: 40px 20px 150px 20px;
+}
+
+/* --- Header & Navigation --- */
+.feed-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 30px;
+}
+
+.header-main {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+}
+
+.header-main h1 {
+    margin: 0;
+    font-size: 1.8rem;
+}
+
+.mode-toggle {
     display: flex;
     background: rgba(255, 255, 255, 0.05);
-    border-radius: 20px;
-    padding: 4px;
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 12px;
+    padding: 3px;
+    width: fit-content;
+    border: 1px solid rgba(255, 255, 255, 0.08);
 }
 
-.switch-btn {
+.toggle-btn {
     border: none;
-    border-radius: 16px;
-    padding: 6px 16px;
-    cursor: pointer;
-    transition: all 0.2s ease;
     background: transparent;
-    color: #a0a0b0;
-    font-weight: 700;
-    font-size: 0.8rem;
-}
-
-.switch-btn.active-ai {
-    background: #4a90e2;
-    color: white;
-    box-shadow: 0 4px 12px rgba(74, 144, 226, 0.3);
-}
-
-.switch-btn.active-rss {
-    background: #facc15;
-    color: #0f0f13;
-    box-shadow: 0 4px 12px rgba(250, 204, 21, 0.3);
-}
-
-/* --- Config Panel (API Key Eingabe) --- */
-.config-panel {
-    background: rgba(74, 144, 226, 0.05);
-    border: 1px solid rgba(74, 144, 226, 0.3);
-    border-radius: 16px;
-    padding: 20px;
-    margin-bottom: 25px;
-    animation: slideIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-}
-
-.config-panel h3 {
-    margin-top: 0;
-    color: #4a90e2;
-    font-size: 1rem;
-}
-
-.config-input {
-    width: 100%;
-    padding: 12px;
-    background: rgba(0, 0, 0, 0.2);
-    border: 1px solid rgba(255, 255, 255, 0.1);
-    color: white;
-    border-radius: 10px;
-    margin-bottom: 15px;
-    box-sizing: border-box;
-    font-family: inherit;
-}
-
-.config-input:focus {
-    outline: none;
-    border-color: #4a90e2;
-    background: rgba(0, 0, 0, 0.3);
-}
-
-.save-btn {
-    background: #4a90e2;
-    color: white;
-    border: none;
-    padding: 12px;
-    border-radius: 10px;
+    color: #8e8e93;
+    padding: 4px 12px;
+    border-radius: 9px;
     cursor: pointer;
-    width: 100%;
-    font-weight: 600;
-    transition: opacity 0.2s;
+    font-size: 0.75rem;
+    font-weight: 700;
+    transition: all 0.2s ease;
 }
 
-.save-btn:hover {
-    opacity: 0.9;
+.toggle-btn.active {
+    background: #4a90e2;
+    color: white;
 }
 
-/* --- Status & Header Buttons --- */
-.reload-btn {
+.header-actions {
+    display: flex;
+    gap: 10px;
+}
+
+.action-btn {
     background: rgba(255, 255, 255, 0.05);
     border: 1px solid rgba(255, 255, 255, 0.1);
-    border-radius: 10px;
-    padding: 8px 12px;
+    border-radius: 12px;
+    padding: 10px;
     cursor: pointer;
     font-size: 1.1rem;
     transition: all 0.2s;
 }
 
-.reload-btn:hover {
+.action-btn:hover {
     background: rgba(255, 255, 255, 0.1);
+    transform: translateY(-2px);
 }
 
+/* --- Config Panel & RSS Management --- */
+.config-panel {
+    background: rgba(30, 30, 46, 0.6);
+    backdrop-filter: blur(20px);
+    border: 1px solid rgba(74, 144, 226, 0.3);
+    border-radius: 20px;
+    padding: 25px;
+    margin-bottom: 30px;
+    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
+    animation: slideIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+}
+
+.config-section {
+    margin-bottom: 20px;
+}
+
+.config-section label {
+    display: block;
+    font-size: 0.7rem;
+    font-weight: 800;
+    color: #4a90e2;
+    margin-bottom: 8px;
+    letter-spacing: 0.05rem;
+}
+
+.config-input {
+    width: 100%;
+    padding: 12px 16px;
+    background: rgba(0, 0, 0, 0.3);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    color: white;
+    border-radius: 12px;
+    box-sizing: border-box;
+    font-family: inherit;
+}
+
+.rss-input-row {
+    display: flex;
+    gap: 8px;
+    margin-bottom: 12px;
+}
+
+.add-btn {
+    background: #4a90e2;
+    color: white;
+    border: none;
+    border-radius: 12px;
+    width: 45px;
+    cursor: pointer;
+    font-weight: bold;
+    font-size: 1.2rem;
+}
+
+/* Scrollbereich für viele RSS Feeds */
+.rss-list-scroll {
+    max-height: 150px;
+    overflow-y: auto;
+    background: rgba(0, 0, 0, 0.2);
+    border-radius: 12px;
+    padding: 8px;
+    border: 1px solid rgba(255, 255, 255, 0.05);
+}
+
+.rss-url-entry {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 8px 12px;
+    background: rgba(255, 255, 255, 0.03);
+    border-radius: 8px;
+    margin-bottom: 4px;
+    font-size: 0.8rem;
+}
+
+.url-text {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    margin-right: 10px;
+    color: #a0a0b0;
+}
+
+.delete-btn {
+    background: transparent;
+    border: none;
+    color: #ef4444;
+    cursor: pointer;
+    padding: 4px;
+    font-weight: bold;
+}
+
+.save-master-btn {
+    background: linear-gradient(135deg, #4a90e2, #357abd);
+    color: white;
+    border: none;
+    padding: 14px;
+    border-radius: 12px;
+    cursor: pointer;
+    width: 100%;
+    font-weight: 700;
+    margin-top: 10px;
+    box-shadow: 0 4px 15px rgba(74, 144, 226, 0.3);
+}
+
+/* --- Post Cards & Markdown --- */
+.post-card {
+    background: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.08);
+    border-radius: 18px;
+    padding: 22px;
+    margin-bottom: 18px;
+    transition: transform 0.2s ease;
+}
+
+.post-card:hover {
+    background: rgba(255, 255, 255, 0.05);
+}
+
+.post-header {
+    display: flex;
+    justify-content: space-between;
+    font-size: 0.75rem;
+    margin-bottom: 12px;
+}
+
+.post-author {
+    color: #4a90e2;
+    font-weight: 800;
+}
+
+.post-date {
+    color: #636366;
+}
+
+.markdown-body h3 {
+    margin: 0 0 10px 0;
+    color: #ffffff;
+    font-size: 1.15rem;
+}
+
+/* --- Status Messages --- */
+.loading-spinner,
 .status-msg {
     text-align: center;
-    color: #a0a0b0;
-    margin-top: 60px;
+    padding: 40px;
+    color: #8e8e93;
     font-style: italic;
-    animation: pulse 2s infinite;
 }
 
-.error-card {
-    border: 1px solid rgba(239, 68, 68, 0.4);
-    background: rgba(239, 68, 68, 0.05);
+.error-box {
+    background: rgba(239, 68, 68, 0.1);
+    border: 1px solid rgba(239, 68, 68, 0.3);
+    color: #ef4444;
     padding: 15px;
     border-radius: 12px;
-    color: #ef4444;
-    font-weight: 500;
+    text-align: center;
 }
 
 /* --- Animations --- */
 @keyframes slideIn {
     from {
         opacity: 0;
-        transform: translateY(-15px);
+        transform: translateY(-10px);
     }
     to {
         opacity: 1;
@@ -360,14 +497,11 @@ html {
     }
 }
 
-@keyframes pulse {
-    0% {
-        opacity: 0.6;
-    }
-    50% {
-        opacity: 1;
-    }
-    100% {
-        opacity: 0.6;
-    }
+/* Scrollbar Styling für die RSS Liste */
+.rss-list-scroll::-webkit-scrollbar {
+    width: 6px;
+}
+.rss-list-scroll::-webkit-scrollbar-thumb {
+    background: rgba(255, 255, 255, 0.1);
+    border-radius: 10px;
 }