diff --git a/TODO.md b/TODO.md
index 8478520..bd793bb 100644
--- a/TODO.md
+++ b/TODO.md
@@ -1,17 +1,27 @@
 
 
 window manager:
-pick glaze, komorebi or fancyWM. > glaze
+v pick glaze, komorebi or fancyWM. > glaze
 
-bar: keep bottom bar because windows, also keep the regular start menu but debloat it.
+v bar: keep bottom bar because windows, also keep the regular start menu but debloat it.
 
-binds: autohotkey, win-hypr-switcher
+v binds: autohotkey, win-hypr-switcher
 
-term: get a better terminal with powershell 7
+v term: get a better terminal with powershell 7
 
-term improvements: see if the same type of features that are on my linux terms can be on powershell 7.
+v term improvements: see if the same type of features that are on my linux terms can be on powershell 7.
 
-software: install chocolatey at the very least, maybe also fzf and make a lil tui for it.
+v software: install chocolatey at the very least, maybe also fzf and make a lil tui for it.
+
+v debloat with winhance
+
+
+
+configure powershell 7 profile
+configure starship
+configure fastfetch
+configure eza/zoxide/fzf
+
+export powershell 7 and windows terminal settings
 
-debloat with winhance
 
diff --git a/chocoinstall.ps1 b/chocoinstall.ps1
index 659bd63..0bb17c7 100644
--- a/chocoinstall.ps1
+++ b/chocoinstall.ps1
@@ -1,3 +1,5 @@
 
 
-choco install -y glazewm yasb
\ No newline at end of file
+choco install -y glazewm yasb pwsh fastfetch starship fzf eza zoxide yazi 
+
+
diff --git a/yasb/config.yaml b/yasb/config.yaml
index a3cacc5..b3f65a2 100644
--- a/yasb/config.yaml
+++ b/yasb/config.yaml
@@ -1,13 +1,7 @@
-# This is default and very simple configuration file for Yasb. 
-# For more information about configuration options, please visit the Wiki https://github.com/amnweb/yasb/wiki
 watch_stylesheet: true
 watch_config: true
 debug: false
-update_check: true # Enable automatic update check.
-komorebi:
-  start_command: "komorebic start --whkd"
-  stop_command: "komorebic stop --whkd"
-  reload_command: "komorebic stop --whkd && komorebic start --whkd"
+update_check: true
 bars:
   primary-bar:
     enabled: true
@@ -18,14 +12,14 @@ bars:
       center: false
     animation:
       enabled: true
-      duration: 1000
+      duration: 400
     blur_effect:
       enabled: true
       acrylic: false
-      dark_mode: true
-      round_corners: true
+      dark_mode: false
+      round_corners: false
       round_corners_type: "normal"
-      border_color: "System"
+      border_color: "system"
     window_flags:
       always_on_top: false
       windows_app_bar: true
@@ -33,333 +27,207 @@ bars:
       width: "100%"
       height: 32
     padding:
-      top: 6
-      left: 6
+      top: 0
+      left: 0
       bottom: 0
-      right: 6
+      right: 0
     widgets:
-      left: [
-        "glazewm_tiling_direction",
-        "glazewm_workspaces", 
-        "pomodoro",       
-        "active_window"
-      ]
-      center: [
-        "clock"
-      ]
-      right: [
-        "cava",
-        "media",
-        "weather",
-        "microphone",
-        "volume",
-        "cpu",
-        "memory",
-        "notifications",
-        "wallpapers",
-        "power_menu"
-        ]
+      left:
+      - "home"
+      - "quick_launch"
+      center:
+      - "clock"
+      right:
+      - "systray"
+      - "cpu"
+      - "memory"
+      - "open_meteo"
+      - "volume"
+      - "notifications"
+      - "power_menu"
 widgets:
   home:
     type: "yasb.home.HomeWidget"
     options:
-      label: "<span>\udb81\udf17</span>"
+      label: "<span>\ue700</span>"
       menu_list:
-      - { title: "My Crib", path: "~" }
-      - { title: "Loot Bag", path: "~\\Downloads" }
-      - { title: "Boring Stuff", path: "~\\Documents" }
-      - { title: "Cursed Memories", path: "~\\Pictures" }
+      - { title: "User Home", path: "~" }
+      - { title: "Download", path: "~\\Downloads" }
+      - { title: "Documents", path: "~\\Documents" }
+      - { title: "Pictures", path: "~\\Pictures" }
       system_menu: true
       power_menu: true
-      blur: false
-  media:
-      type: "yasb.media.MediaWidget"
-      options:
-        label: "<span>\uf001</span> {title}"
-        label_alt: "<span>\uf001</span> {artist}"
-        callbacks:
-          on_left: "toggle_media_menu"
-          on_middle: "do_nothing"
-          on_right: "do_nothing"
-        max_field_size:
-          label: 50
-          label_alt: 24
-        show_thumbnail: false
-        controls_only: false
-        controls_left: true
-        hide_empty: true
-        thumbnail_alpha: 250
-        thumbnail_padding: 8
-        thumbnail_corner_radius: 0
-        icons:
-          prev_track: ""
-          next_track: ""
-          play: ""
-          pause: ""
-  active_window:
-    type: "yasb.active_window.ActiveWindowWidget"
+      blur: true
+      round_corners: true
+      round_corners_type: "normal"
+      border_color: "System"
+      alignment: "center"
+  quick_launch:
+    type: "yasb.quick_launch.QuickLaunchWidget"
     options:
-      label: "{win[title]}"
-      label_alt: "[class_name='{win[class_name]}' exe='{win[process][name]}' hwnd={win[hwnd]}]"
-      label_no_window: ""
-      label_icon: true
-      label_icon_size: 14
-      max_length: 46
-      max_length_ellipsis: "..."
-      monitor_exclusive: true
+      label: "<span>\ue721</span>"
+      search_placeholder: "Search applications..."
+      max_results: 30
+      show_icons: true
+      icon_size: 16
+      compact_text: true
+      providers:
+        apps:
+          enabled: true
+          prefix: "*"
+          priority: 0
+          show_recent: true
+          max_recent: 5
+          show_description: true
+      popup:
+        width: 720
+        height: 480
+        blur: true
+        round_corners: true
+        round_corners_type: "normal"
+        border_color: "system"
+        dark_mode: true
+      callbacks:
+        on_left: "toggle_quick_launch"
+      keybindings:
+        - keys: "alt+space"
+          action: "toggle_quick_launch"
+          screen: "primary"
   clock:
     type: "yasb.clock.ClockWidget"
     options:
-      label: "{%I:%M:%S}"
-      label_alt: "{%I:%M:%S}"
+      label: "{%a, %d %b %H:%M}"
+      label_alt: "{%A, %d %B %Y %H:%M}"
       timezones: []
+      calendar: 
+        blur: true
+        round_corners: true
+        alignment: "center"
+        direction: "down"
+        extended: false
+        show_years: true
+        show_holidays: false
+        show_week_numbers: true
       callbacks:
         on_left: "toggle_calendar"
-  weather:
-    type: "yasb.weather.WeatherWidget"
+        on_middle: "toggle_label"
+        on_right: "context_menu"
+  systray:
+    type: yasb.systray.SystrayWidget
     options:
-      label: "<span>{icon}</span> {temp}"
+      class_name: systray
+      label_collapsed: "\ue70d"
+      label_expanded: "\ue70e"
+      label_position: right
+      pin_click_modifier: ctrl
+      show_unpinned: false
+      show_battery: false
+      show_volume: false 
+      icon_size: 16
+      use_hook: true
+      show_in_popup: true
+      icons_per_row: 5
+      popup:
+        blur: true
+        round_corners: true
+        round_corners_type: "normal"
+        border_color: None
+        alignment: "center"
+        direction: "down"
+        offset_top: 6
+        offset_left: 0
+  open_meteo:
+    type: "yasb.open_meteo.OpenMeteoWidget"
+    options:
+      label: "<span>\ue706</span>{temp}"
       label_alt: "{location}: Min {min_temp}, Max {max_temp}, Humidity {humidity}"
-      api_key:  # Get your free API key from https://www.weatherapi.com/
+      tooltip: true
       update_interval: 600
       hide_decimal: true
-      location:  # You can use "USA Los Angeles 90006" {COUNTRY CITY ZIP_CODE}, or just city.
+      units: "metric"
       callbacks:
         on_left: "toggle_card"
+        on_middle: "do_nothing"
+        on_right: "toggle_label"
       icons:
-        sunnyDay: "\ue30d"
-        clearNight: "\ue32b"
-        cloudyDay: "\ue312"
-        cloudyNight: "\ue311"
-        rainyDay: "\ue308"
-        rainyNight: "\ue333"
-        snowyIcyDay: "\ue30a"
-        snowyIcyNight: "\ue335"
-        blizzardDay: "\udb83\udf36"
-        blizzardNight: "\udb83\udf36"
-        foggyDay: "\ue303"
-        foggyNight: "\ue346"
-        thunderstormDay: "\ue30f"
-        thunderstormNight: "\ue338"
-        default: "\uebaa"
+        sunnyDay: "\ue706"
+        clearNight: "\uec46"
       weather_card:
-        blur: True
-        round_corners: True
-        round_corners_type: "normal"
-        border_color: "System"
+        blur: true
         alignment: "right"
         direction: "down"
-        icon_size: 64
-        show_hourly_forecast: True # Set to False to disable hourly forecast
-        time_format: "12h" # can be 12h or 24h
+        icon_size: 32
+        show_hourly_forecast: true
+        time_format: "24h"
         hourly_point_spacing: 76
-        hourly_icon_size: 32 # better to set 16, 32 or 64 for better quality
-        icon_smoothing: true # should be true for smoother icon or false for sharper icon if using 16, 32 or 64 for hourly_icon_size
-        temp_line_width: 2 # can be 0 to hide the temperature line
+        hourly_icon_size: 16
+        icon_smoothing: true
+        temp_line_width: 2
         current_line_color: "#8EAEE8"
-        current_line_width: 1 # can be 0 to hide the current hour line
+        current_line_width: 1
         current_line_style: "dot"
-      label_shadow:
-        enabled: true
-        color: "black"
-        radius: 3
-        offset: [ 1, 1 ]
+        hourly_forecast_buttons:
+          enabled: false
+        weather_animation:
+          enabled: true
+          snow_overrides_rain: true
+          temp_line_animation_style: both
+          rain_effect_intensity: 1.0
+          snow_effect_intensity: 1.0
+          scale_with_chance: true
   volume:
     type: "yasb.volume.VolumeWidget"
     options:
-      label: "<span>{icon}</span> {level}"
-      label_alt: "{volume}"
-      tooltip: false
+      label: "<span>{icon}</span>"
+      label_alt: "<span>{icon}</span>{level}"
+      tooltip: true
       volume_icons:
-        - "\ueee8"
-        - "\uf026"
-        - "\uf027"
-        - "\uf027"
-        - "\uf028"
+        - "\ue74f"
+        - "\ue992"
+        - "\ue993"
+        - "\ue994"
+        - "\ue995"
       callbacks:
-        on_left: "toggle_mute"
-        on_right: "exec cmd.exe /c start ms-settings:sound"
-  microphone:
-    type: "yasb.microphone.MicrophoneWidget"
-    options:
-      label: "<span>{icon}</span> {level}"
-      label_alt: "<span>{icon}</span> {level}%"
-      icons:
-        normal: "\udb80\udf6c"
-        muted: "\udb80\udf6d"
-      callbacks:
-        on_left: "toggle_mute"
-        on_middle: "toggle_label"
-        on_right: "exec cmd.exe /c start ms-settings:sound"
-  power_menu:
-    type: "yasb.power_menu.PowerMenuWidget"
-    options:
-      label: "\uf011"
-      uptime: True
-      blur: False
-      blur_background: True
-      animation_duration: 200
-      button_row: 5
-      buttons:
-        shutdown: ["\uf011", "Rage Quit"]
-        restart: ["\uead2", "Oops, Reboot"]
-        signout: ["\udb80\udf43", "Dip Out"]
-        hibernate: ["\uf28e", "Bear Mode"]
-        sleep: ["\u23fe", "Nap Time"]
-        cancel: ["", "Nah, Im Good "]
-  apps:
-    type: "yasb.applications.ApplicationsWidget"
-    options:
-      container_padding:
-        top: 0
-        left: 8
-        bottom: 0
-        right: 8
-      label: "{data}"
-      app_list:
-        - { icon: "\ueb03", launch: "cmd /c Taskmgr" }
-        - { icon: "\uf489", launch: "wt"}
-  notifications:
-    type: "yasb.notifications.NotificationsWidget"
-    options:
-      label: "<span>\uf476</span> {count}"
-      label_alt: "{count} notifications"
-      hide_empty: true
-      tooltip: false
-      callbacks:
-        on_left: "toggle_notification"
-        on_right: "do_nothing"
-        on_middle: "toggle_label"
-  wallpapers:
-    type: "yasb.wallpapers.WallpapersWidget"
-    options:
-      label: "<span>\udb83\ude09</span>"
-      image_path:  # Example path to folder with images
-      change_automatically: false # Automatically change wallpaper
-      update_interval: 60 # If change_automatically is true, update interval in seconds
-      gallery:
-          enabled: true
-          blur: true
-          image_width: 220
-          image_per_page: 8
-          show_buttons: true
-          orientation: "portrait"
-          image_spacing: 8
-          lazy_load: true
-          lazy_load_delay: 80
-          lazy_load_fadein: 400
-          image_corner_radius: 20
-          enable_cache: true
-  cava:
-    type: "yasb.cava.CavaWidget"
-    options:
-      bar_height: 12
-      min_bar_height: 0
-      gradient: 1
-      reverse: 0
-      foreground: "#89b4fa"
-      gradient_color_1: '#74c7ec'
-      gradient_color_2: '#89b4fa'
-      gradient_color_3: '#cba6f7'
-      bars_number: 8
-      bar_spacing: 2
-      bar_width: 4
-      hide_empty: true
-      container_padding:
-        top: 0
-        left: 8
-        bottom: 0
-        right: 8
+        on_left: "toggle_volume_menu"
+        on_right: "toggle_mute"
   cpu:
     type: "yasb.cpu.CpuWidget"
     options:
-      label: "<span>\uf4bc</span> {info[percent][total]}"
-      label_alt: "<span>\uf437</span> {info[histograms][cpu_percent]}"
+      label: "<span>\ueea1</span> {info[percent][total]}%"
+      label_alt: "<span>\ueea1</span> {info[freq][current]} MHz"
       update_interval: 2000
-      cpu_thresholds:
-        low: 25
-        medium: 50
-        high: 90
-      histogram_icons:
-        - "\u2581" # 0%
-        - "\u2581" # 10%
-        - "\u2582" # 20%
-        - "\u2583" # 30%
-        - "\u2584" # 40%
-        - "\u2585" # 50%
-        - "\u2586" # 60%
-        - "\u2587" # 70%
-        - "\u2588" # 80%+
-      histogram_num_columns: 8
-      callbacks:
-        on_right: "exec cmd /c Taskmgr"
-      label_shadow:
-        enabled: true
-        color: "black"
-        radius: 3
-        offset: [ 1, 1 ]
-  glazewm_workspaces:
-    type: "glazewm.workspaces.GlazewmWorkspacesWidget"
-    options:
-      # Offline behavior (matching komorebi's label_offline and hide_if_offline)
-      offline_label: "GlazeWM Offline"
-      hide_if_offline: true
-      
-      # Workspace display labels (matching komorebi's label_workspace_btn and label_workspace_active_btn)
-      populated_label: "\udb85\udcfc"
-      empty_label: "\udb85\udcfc"
-      active_populated_label: "\udb85\udcfb"
-      active_empty_label: "\udb85\udcfb"
-      
-      # Workspace management (matching komorebi's hide_empty_workspaces)
-      hide_empty_workspaces: false
-      
-      # Server connection
-      glazewm_server_uri: "ws://localhost:6123"
-      
-      # Additional GlazeWM-specific options (keeping defaults)
-      enable_scroll_switching: true
-      reverse_scroll_direction: true
-      container_padding:
-        top: 0
-        left: 0
-        bottom: 0
-        right: 0
-  glazewm_tiling_direction:
-    type: "glazewm.tiling_direction.GlazewmTilingDirectionWidget"
-    options:
-      horizontal_label: "\udb81\udce1"
-      vertical_label: "\udb81\udce2"
-      btn_shadow:
-        enabled: true
-        color: "black"
-        radius: 3
-        offset: [ 1, 1 ]
-  pomodoro:
-    type: "yasb.pomodoro.PomodoroWidget"
-    options:
-      label: "<span>{icon}</span> {remaining}"
-      label_alt: "<span>{icon}</span> {session}/{total_sessions} - {status}"
-      work_duration: 25
-      break_duration: 5
-      long_break_duration: 15
-      long_break_interval: 4
-      auto_start_breaks: true
-      auto_start_work: true
-      sound_notification: true
-      show_notification: true
-      hide_on_break: false
-      session_target: 8
-      icons:
-        work: "\uf252"
-        break: "\uf253"
-        paused: "\uf254"
-      container_padding:
-        top: 0
-        left: 12
-        bottom: 0
-        right: 12
       menu:
+        enabled: true
+        show_graph: true
+        show_graph_grid: true
+        graph_history_size: 60
+      callbacks:
+        on_left: toggle_menu
+        on_middle: do_nothing
+        on_right: toggle_label
+  memory:
+    type: "yasb.memory.MemoryWidget"
+    options:
+      label: "<span>\ueea1</span> {virtual_mem_free}"
+      label_alt: "<span>\ueea1</span> VIRT: {virtual_mem_percent}% SWAP: {swap_mem_percent}%"
+      update_interval: 5000
+      callbacks:
+        on_left: "toggle_menu"
+        on_middle: "do_nothing"
+        on_right: "toggle_label"
+      menu:
+        enabled: true
+        show_graph: true
+        show_graph_grid: true
+        graph_history_size: 60
+  power_menu:
+    type: "yasb.power_menu.PowerMenuWidget"
+    options:
+      label: "<span>\ue712</span>"
+      uptime: true
+      show_user: true
+      menu_style: "popup"
+      popup:
         blur: true
         round_corners: true
         round_corners_type: "normal"
@@ -368,46 +236,23 @@ widgets:
         direction: "down"
         offset_top: 6
         offset_left: 0
-        circle_background_color: "#09ffffff"
-        circle_work_progress_color: "#88c0d0"
-        circle_break_progress_color: "#a3be8c"
-        circle_thickness: 8
-        circle_size: 160
-      callbacks:
-        on_left: "toggle_menu"
-        on_middle: "reset_timer"
-        on_right: "toggle_label"
-      label_shadow:
-        enabled: true
-        color: "black"
-        radius: 3
-        offset: [ 1, 1 ]
-  memory:
-    type: "yasb.memory.MemoryWidget"
+      profile_image_size: 64
+      buttons:
+        lock: ["\ue72e", "Lock"]
+        signout: ["\uf3b1", "Sign out"]
+        sleep: ["\uec46", "Sleep"]
+        hibernate: ["\ue66d", "Hibernate"]
+        restart: ["\ue72c", "Restart"]
+        shutdown: ["\ue7e8", "Shut Down"]
+        cancel: ["", "Cancel"]
+  notifications:
+    type: "yasb.notifications.NotificationsWidget"
     options:
-      label: "<span>\uf4bc</span> {virtual_mem_percent}"
-      label_alt: "<span>\uf4bc</span> VIRT: {virtual_mem_percent}% SWAP: {swap_mem_percent}%"
-      update_interval: 5000
+      label: "<span>\uf2a3</span>"
+      label_alt: "{count} notifications"
+      hide_empty: true
+      tooltip: false
       callbacks:
-        on_left: "toggle_label"
-        on_middle: "do_nothing"
+        on_left: "toggle_notification"
         on_right: "do_nothing"
-      memory_thresholds:
-        low: 25
-        medium: 50
-        high: 90
-      histogram_icons:
-        - "\u2581" # 0%
-        - "\u2581" # 10%
-        - "\u2582" # 20%
-        - "\u2583" # 30%
-        - "\u2584" # 40%
-        - "\u2585" # 50%
-        - "\u2586" # 60%
-        - "\u2587" # 70%
-        - "\u2588" # 80%+
-      label_shadow:
-        enabled: true
-        color: "black"
-        radius: 3
-        offset: [ 1, 1 ]
\ No newline at end of file
+        on_middle: "do_nothing"
diff --git a/yasb/styles.css b/yasb/styles.css
index 83534bd..b161401 100644
--- a/yasb/styles.css
+++ b/yasb/styles.css
@@ -1,446 +1,1094 @@
+:root {
+    --bar-dark-bg: rgba(36, 36, 36, 0.6);
+    --bar-light-bg: rgba(255, 255, 255, 0.75);
+    --bar-dark-border: #303030;
+    --bar-light-border: #e7e7e7;
+    --dark-menu-bg: rgba(36, 36, 36, 0.6);
+    --light-menu-bg: rgba(255, 255, 255, 0.75);
+    --dark-color: rgb(65, 65, 65);
+    --dark-dim-color: rgb(117, 117, 117);
+    --light-color: rgba(255, 255, 255, 0.9);
+    --light-dim-color: rgba(255, 255, 255, 0.6);
+    --dark-icon-color: rgb(36, 36, 36);
+    --light-icon-color: rgba(255, 255, 255, 0.9);
+}
 * {
-	font-size: 12px;
-	color: #cdd6f4;
-	font-weight: 500;
-	font-family: "JetBrainsMono NFP";
-	margin: 0;
-	padding: 0;
+    font-size: 12px;
+    font-weight: 400;
+    font-family: "Segoe UI", "Segoe Fluent Icons"
+}
+.dark.yasb-bar {
+    background-color: var(--bar-dark-bg);
+    border-bottom: 1px solid var(--bar-dark-border);
+    padding: 0 12px;
 }
 .yasb-bar {
-	padding: 0 8px;
-	margin: 0;
-    background-color: #1e1e2e;
-    border-radius: 16px;
+    background-color: var(--bar-light-bg);
+    border-bottom: 1px solid var(--bar-light-border);
+    padding: 0 12px;
 }
-.widget {
-	padding: 0 10px;
-	margin: 0;
-}
-.widget .label {
-	padding: 2px 2px 1px 2px;
- 
-}
-.widget .label.alt {
-	padding: 1px 8px 1px 8px;
-}
- .clock-widget .label {
-    padding-left:8px;
-}
-.glazewm-workspaces {
-    margin: 0;
-}
-
-.glazewm-workspaces .ws-btn {
-    font-size: 18px;
-    background-color: transparent;
-    border: none;
-    padding: 0 2px 0 2px;
-    margin: 0;
-    color: #95a0ad;
-}
-
-.glazewm-workspaces .ws-btn.active_populated {
-    color: #89b4fa;
-}
-
-.glazewm-workspaces .ws-btn.active_empty {
-    color: #89b4fa;
-}
-
-.glazewm-workspaces .ws-btn.populated {
-    color: #74c7ec;
-}
-
-.glazewm-workspaces .ws-btn.empty {
-    color: #95a0ad;
-}
-
-.glazewm-workspaces .ws-btn:hover,
-.glazewm-workspaces .ws-btn.populated:hover,
-.glazewm-workspaces .ws-btn.empty:hover {
-    color: #89b4fa;
-}
-
-.glazewm-tiling-direction {
-    background-color: transparent;
-    padding: 0;
-    margin: 0;
-}
-
-.glazewm-tiling-direction .btn {
-    font-size: 18px;
-    width: 14px;
-    padding: 0 4px 0 4px;
-    color: #CDD6F4;
-    border: none;
-}
-
-.glazewm-tiling-direction .btn:hover {
-    background-color: #727272;
-}
-/*POWER MENU WIDGET*/
-/* Uptime text */
-.uptime {
-	font-size: 14px;
-	margin-bottom: 10px;
-	color: rgba(191, 202, 219, 0.726);
-	font-weight: 600;
-	font-family: "JetBrainsMono NFP";
-}
-.power-menu-widget .label {
-	color: #eba0ac;
-	font-size: 16px;
-}
-.power-menu-popup .button {
-	padding: 0;
-	width: 160px;
-	height: 240px;
-	border-radius: 4px;
-	background-color: rgba(41, 42, 58, 0.75);
-	font-family: "JetBrainsMono NFP";
-	color: white;
-	border: 4px solid rgba(255, 255, 255, 0);
- 
-}
-.power-menu-popup .button.hover {
-	background-color: rgb(55, 56, 75);
-	border: 4px solid rgb(55, 56, 75);
-}
-.power-menu-popup .button .label {
-	margin-bottom: 8px;
-	font-size: 16px;
-	font-weight: 600;
-	color: rgba(255, 255, 255, 0.6);
-	font-family: "JetBrainsMono NFP";
-}
-.power-menu-popup .button .icon {
-	font-size: 64px;
-	padding-top: 54px;
-	color: rgba(255, 255, 255, 0.25);
-}
-.power-menu-popup .button.cancel {
-    height: 20px !important; /* Much thinner than the 240px of other buttons */
-    width: 100%; /* Full width to span across */
-    padding-top: 10px;
-    padding-bottom: 10px;
-}
-
-.power-menu-popup .button.cancel .icon {
-    font-size: 24px !important; /* Smaller icon for the thinner button */
-    padding-top: 0px !important; /* Remove the large top padding */
-    color: rgba(243, 139, 168, 0.55);
-}
-
-.power-menu-popup .button.cancel .label {
-    margin-bottom: 0px !important; /* Remove bottom margin */
-    color: rgba(243, 139, 168, 0.95);
-}
-/* ICONS */
-.icon {
-	font-size: 16px;
-}
-.volume-widget .icon {
-	color: #89b4fa;
-	margin: 1px 2px 0 0;
-} 
-.start-menu .icon {
-    font-size: 18px;
-	color: #89b4fa
-}
-.clock-widget .icon {
-	color: #cba6f7;
-    font-size: 14px;
-}
-/* WEATHER WIDGET */
-.weather-card {
-    background-color: rgba(17, 17, 27, 0.5);
-}
-.weather-card-today {
-    border: 1px solid #282936;
-    border-radius: 8px;
-    background-color:  rgba(17, 17, 27, 0.2);
-}
-.weather-card-today .label {
+.tooltip {
+    background-color: rgba(36, 36, 36, 0.95);
+    border-radius: 4px;
+    color: rgba(255, 255, 255, 0.9);
+    padding: 5px 10px;
     font-size: 12px;
-}
-.weather-card-today .label.location {
-    font-size: 24px;
-    font-weight: 700;
-}
-.weather-card-today .label.alert {
-    font-size: 12px;
-    font-weight: 700;
-    background-color: rgba(247, 199, 42, 0.05);
-    border: 1px solid rgba(247, 209, 42, 0.1);
-    color: rgba(196, 181, 162, 0.85);
-    border-radius: 6px;
-    padding: 5px 0;
-}
-.weather-card-day {
-    border: 1px solid #45475a;
-    border-radius: 8px;
-    background-color:  rgba(17, 17, 27, 0.2);
-}
-
-.weather-card-day.active {
-    background-color: rgba(40, 40, 60, 0.6);
-    border: 1px solid rgba(50, 50, 75, 1);
-}
-
-.weather-card-day:hover {
-    background-color: rgba(40, 40, 60, 0.6);
-}
-
-.weather-card-day .label {
-    font-size: 12px;
-}
-
-.weather-card .hourly-container {
-    border: 1px solid #282936;
-    background-color: #3c5fa0;
-    border-radius: 8px;
-    min-height: 150px;
-}
-
-.weather-card .hourly-data {
-    /* font-family: 'Segoe UI';*/
-    /* color: cyan;*/ /* <- Font color */
-    background-color: #FAE93F; /* <- Curve color */
-    font-size: 12px;
-    font-weight: bold;
-}
-.media-widget {
-	padding: 0;
-	margin: 0;
-}
-.media-widget .label {
-	color: #b4befe;
-    padding: 0px;
-	padding-right: 4px;
-}
-.media-menu {
-    min-width: 420px;
-    max-width: 420px;
-    background-color: rgba(31, 39, 49, 0.5);
-}
-.media-menu .title,
-.media-menu .artist,
-.media-menu .source {
-    font-size: 14px;
+    font-family: 'Segoe UI';
     font-weight: 600;
-    margin-left: 10px;
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    margin-top: 4px;
 }
-.media-menu .artist {
-    font-size: 13px;
-    color: #6c7086;
-    margin-top: 0px;
-    margin-bottom: 8px;
+.context-menu,
+.context-menu .menu-checkbox {
+    background-color: rgba(26, 26, 26, 0.6);
+    padding: 4px 0px;
+    font-family: 'Segoe UI';
+    font-size: 12px;
+    color: rgba(255, 255, 255, 0.9);
 }
-.media-menu .source {
-    font-size: 11px;
-    color: #000;
-    font-weight: normal;
-    border-radius: 3px;
-    background-color: #bac2de;
-    padding: 2px 4px;
-
+.context-menu {
+    border-radius: 8px;
+    border: 1px solid rgba(255, 255, 255, 0.075);
 }
-/* The source class name is the same as what you see in the media widget; just replace spaces with dashes and convert it to lowercase. 
-Example: "Windows Media" becomes "windows-media" */
-.media-menu .source.firefox {
-    background-color: #ff583b;
-    color: #ffffff;
+.context-menu::right-arrow {
+    width: 8px;
+    height: 8px;
+    padding-right: 24px;
 }
-.media-menu .source.spotify {
-    background-color: #199143;
-    color: #ffffff;
-}
-.media-menu .source.edge {
-    background-color: #0078d4;
-    color: #ffffff;
-}
-.media-menu .source.windows-media {
-    background-color: #0078d4;
-    color: #ffffff;
-}
-
-.media-menu .btn {
-    font-family: "Segoe Fluent Icons";
-    font-size: 14px;
-    font-weight: 400;
-    margin: 10px 2px 0px 2px;
-    min-width: 40px;
-    max-width: 40px;
-    min-height: 40px;
-    max-height: 40px;
-    border-radius: 20px;
-}
-.media-menu .btn.prev {
-    margin-left: 10px;
-}
-.media-menu .btn:hover {
-    color: white;
-    background-color: rgba(255, 255, 255, 0.1);
-}
-.media-menu .btn.play {
-    background-color: rgba(255, 255, 255, 0.1);
-    font-size: 20px
-}
-.media-menu .btn.disabled:hover,
-.media-menu .btn.disabled {
-    color: #4e525c;
-    background-color: rgba(0, 0, 0, 0);
-}
-
-.media-menu .playback-time {
-    font-size: 13px;
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-    color: #7f849c;
-    margin-top: 20px;
+.context-menu::item,
+.context-menu .menu-checkbox {
+    background-color: transparent;
+    padding: 6px 12px;
+    margin: 2px 6px;
+    border-radius: 6px;
     min-width: 100px;
 }
-.media-menu .progress-slider {
-    height: 10px;
-    margin: 5px 4px;
-    border-radius: 3px;
+.context-menu::item:selected,
+.context-menu .menu-checkbox:hover {
+    background-color: rgba(255, 255, 255, 0.1);
+    color: #FFFFFF;
 }
-.media-menu .progress-slider::groove {
-    background: transparent;
-    height: 2px;
-    border-radius: 3px;
-    background: rgba(255, 255, 255, 0.1);
-
+.context-menu::separator {
+    height: 1px;
+    background-color: #404040;
+    margin: 4px 8px;
 }
-.media-menu .progress-slider::groove:hover {
-    background: transparent;
-    height: 6px;
-    border-radius: 3px;
-    background: rgba(255, 255, 255, 0.2);
+.context-menu::item:disabled {
+    color: #666666;
+    background-color: transparent;
 }
-.media-menu .progress-slider::sub-page {
-    background: white;
-    border-radius: 3px;
-    height: 4px;
-}
- /* Hide media widget buttons */
-.media-widget .btn {
-	padding: 0;
-	margin: 0 -6px;
-    padding-left: 4px;
-}
-.pomodoro-widget {
-    padding: 0 0 0 0;
-}
-.pomodoro-widget .icon {
+.context-menu .menu-checkbox .checkbox {
+    border: none;
+    padding: 8px 16px;
     font-size: 12px;
-    padding-right: 4px;
+    margin: 0;
+    color: rgba(255, 255, 255, 0.9);
+    font-family: 'Segoe UI'
 }
-.pomodoro-widget .label.paused,
-.pomodoro-widget .icon.paused {
-    color: #7d7e8b;
+.context-menu .submenu::item:disabled {
+    margin: 0;
+    padding-left: 16px;
 }
-.pomodoro-widget .label.work,
-.pomodoro-widget .icon.work {
-    color: #a6e3a1;
+.context-menu .menu-checkbox .checkbox:unchecked {
+    color: rgba(255, 255, 255, 0.9);
 }
-.pomodoro-widget .label.break,
-.pomodoro-widget .icon.break {
-    color: #89b4fa;
+.context-menu .menu-checkbox .checkbox::indicator {
+    width: 12px;
+    height: 12px;
+    margin-left: 0px;
+    margin-right: 8px;
 }
-/* Pomodoro menu styling */
-.pomodoro-menu {
-    background-color: rgba(17, 17, 27, 0.2);
+.context-menu .menu-checkbox .checkbox::indicator:unchecked {
+    background: #444444;
+    border-radius: 2px;
+}
+.context-menu .menu-checkbox .checkbox::indicator:checked {
+    background: #4a90e2;
+    border-radius: 2px;
+}
+.context-menu .menu-checkbox .checkbox:focus {
+    outline: none;
+}
+.widget {
+    padding: 2px 8px 0 8px;
+    margin: 4px 0;
+    border-radius: 4px;
+}
+
+.widget .icon {
+    font-size: 16px;
+    font-weight: 400;
+    color: var(--dark-icon-color);
+}
+.yasb-bar.dark .widget .icon {
+    font-size: 16px;
+    font-weight: 400;
+    color: var(--light-icon-color);
+}
+.widget .label {
+    padding: 0px 0px 4px 4px;
+    color: var(--dark-color)
+}
+
+.yasb-bar.dark .widget .label {
+    color: var(--light-color);
+}
+.widget:hover {
+    background-color: rgba(0, 0, 0, 0.08);
+}
+.dark .widget:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+}
+
+/* Quick Launch Popup - main window */
+.quick-launch-popup .container {
+    background-color: var(--light-menu-bg);
+}
+.dark .quick-launch-popup .container {
+    background-color: var(--dark-menu-bg);
+}
+/* Search bar container */
+.quick-launch-popup .search {
+    padding: 12px 16px;
+    background-color: transparent;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+.dark .quick-launch-popup .search {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+}
+/* Search loader line color */
+.quick-launch-popup .search .loader-line {
+    color: #449bff;
+}
+.quick-launch-popup .search .search-icon {
+    font-family: "Segoe Fluent Icons";
+    font-size: 18px;
+    color: var(--dark-color);
+    padding-right: 8px;
+    min-width: 18px;
+}
+.dark .quick-launch-popup .search .search-icon {
+    color: var(--light-color);
+}
+.quick-launch-popup .search .search-submit-icon {
+    font-family: "Segoe Fluent Icons";
+    font-size: 18px;
+    color: var(--dark-color);
+    min-width: 18px;
+}
+.dark .quick-launch-popup .search .search-submit-icon {
+    color: var(--light-color);
+}
+.quick-launch-popup .search .search-input {
+    background: transparent;
+    border: none;
+    color: var(--dark-color);
+    font-size: 16px;
+    font-family: "Segoe UI";
+    font-weight: 400;
+    padding: 4px 0;
+}
+.dark .quick-launch-popup .search .search-input {
+    color: var(--light-color);
+}
+/* Search prefix styling (e.g., ">" for commands) */
+.quick-launch-popup .search .prefix {
+    background: #2167d8;
+    border-radius: 6px;
+    color: #ffffff;
+    padding: -2px 8px 0px 8px;
+    margin-top: 2px;
+    margin-right: 4px;
+    font-size: 13px;
+    font-weight: 600;
+    font-family: "Segoe UI";
+    max-height: 28px;
+}
+
+/* Results list */
+.quick-launch-popup .results {
+    background: transparent;
+    padding: 8px;
+}
+/* Individual result item here you can set font szie for title */
+.quick-launch-popup .results-list-view {
+    font-size: 14px;
+    font-family: "Segoe UI";
+    font-weight: 600;
+    color: var(--dark-color)
+}
+.dark .quick-launch-popup .results-list-view {
+    color: var(--light-color);
+}
+.quick-launch-popup .results-list-view .description {
+    color: var(--dark-dim-color);
+    font-size: 11px;
+    font-family: "Segoe UI";
+    font-weight: 600;
+}
+.dark .quick-launch-popup .results-list-view .description {
+    color: var(--light-dim-color);
+}
+.quick-launch-popup .results-list-view .separator {
+    color: var(--dark-dim-color);
+    font-size: 13px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    padding: 4px 0 4px 12px;
+}
+/* Result item hover and selected states */
+.quick-launch-popup .results-list-view::item {
+    padding: 4px 12px;
     border-radius: 8px;
 }
-.pomodoro-menu .header {
-    font-size: 16px;
-    font-weight: 600;
-    max-height: 0px;
-    color: #ffffff;
+.quick-launch-popup .results-list-view::item:hover,
+.quick-launch-popup .results-list-view::item:selected {
+    background-color: rgba(128, 130, 158, 0.1);
 }
-.pomodoro-menu .status {
-    font-size: 18px;
-    font-weight: 600;
-    color: #cdd6f4;
-}
-.pomodoro-menu .session {
-    font-size: 12px;
-    color: #a6adc8;
-}
-.pomodoro-menu .button {
-    background-color: #3f4053;
-    color: #cdd6f4;
-    border: none;
-    border-radius: 4px;
-    padding: 6px 12px;
-}
-.pomodoro-menu .button.start {
-    background-color: #3f4053;
-}
-.pomodoro-menu .button.reset {
-    background-color: #3f4053;
-}
-.pomodoro-menu .button:hover {
-    background-color: rgba(255, 255, 255, 0.158);
-}
-.pomodoro-menu .button.pause {
-    background-color: #a6e3a1;
-    color: #1e1e2e;
-}
-.pomodoro-menu .button:pressed {
-    background-color: #5a5b6e;
+/* Empty state when no results found */
+.quick-launch-popup .results-empty-text {
+    font-size: 24px;
+    font-family: "Segoe UI";
+    color: rgb(255, 255, 255);
+    padding-top: 8px;
 }
 
-.calendar {
-    background-color: rgba(17, 17, 27, 0.4);
+/* Preview Pane */
+.quick-launch-popup .preview {
+    background: rgba(0, 0, 0, 0);
+    border-left: 1px solid rgba(255, 255, 255, 0.06);
 }
-.calendar .calendar-table,
-.calendar .calendar-table::item {
+.quick-launch-popup .preview .preview-text {
+    font-size: 13px;
+    color: rgba(255, 255, 255, 0.85);
+    padding: 8px 12px;
+    font-family: "Segoe UI";
+    background-color: rgba(255, 255, 255, 0.03);
+    border: none;
+}
+.quick-launch-popup .preview .preview-image {
+    background-color: rgba(255, 255, 255, 0.03);
+    padding: 8px 12px;
+}
+.quick-launch-popup .preview .preview-meta {
+    padding: 6px 12px;
+    border-top: 1px solid rgba(255, 255, 255, 0.06);
+    font-family: "Segoe UI";
+}
+.quick-launch-popup .preview .preview-meta .preview-title {
+    font-size: 14px;
+    font-weight: 600;
+    color: rgb(255, 255, 255);
+    font-family: "Segoe UI";
+    margin-bottom: 10px;
+    margin-left: -2px;
+}
+
+.quick-launch-popup .preview .preview-meta .preview-subtitle {
+    font-size: 12px;
+    color: rgba(255, 255, 255, 0.8);
+    font-family: "Segoe UI";
+    padding-bottom: 1px;
+}
+
+/* Preview inline edit form (.preview.edit) */
+.quick-launch-popup .preview.edit .preview-title {
+    font-size: 13px;
+    font-family: "Segoe UI";
+    font-weight: 600;
+    color: #ffffff;
+    padding: 8px 12px 4px 12px;
+}
+.quick-launch-popup .preview.edit .preview-line-edit {
+    background: rgba(255, 255, 255, 0.06);
+    border: 1px solid rgba(255, 255, 255, 0.12);
+    border-radius: 4px;
+    color: #ffffff;
+    font-size: 13px;
+    font-family: "Segoe UI";
+    padding: 6px 8px;
+    margin: 0 12px;
+}
+.quick-launch-popup .preview.edit .preview-line-edit:focus {
+    border-color: rgba(255, 255, 255, 0.3);
+}
+.quick-launch-popup .preview.edit .preview-text-edit {
+    background: rgba(255, 255, 255, 0.06);
+    border: 1px solid rgba(255, 255, 255, 0.12);
+    border-radius: 4px;
+    color: #ffffff;
+    font-size: 13px;
+    font-family: "Segoe UI";
+    padding: 6px 8px;
+    margin: 0 12px;
+}
+.quick-launch-popup .preview.edit .preview-text-edit:focus {
+    border-color: rgba(255, 255, 255, 0.3);
+}
+.quick-launch-popup .preview.edit .preview-actions {
+    padding: 8px 12px;
+}
+.quick-launch-popup .preview.edit .preview-btn {
+    background: rgb(45, 46, 48);
+    border: none;
+    border-radius: 4px;
+    color: rgba(255, 255, 255, 0.8);
+    font-size: 12px;
+    font-family: "Segoe UI";
+    font-weight: 600;
+    padding: 4px 16px;
+}
+.quick-launch-popup .preview.edit .preview-btn:hover {
+    background: rgb(59, 60, 63);
+}
+.quick-launch-popup .preview.edit .preview-btn.save {
+    background: rgb(12, 81, 190);
+    color: #ffffff;
+}
+.quick-launch-popup .preview.edit .preview-btn.save:hover {
+    background: rgb(19, 90, 204);
+}
+
+.cpu-popup,
+.memory-popup {
+    background-color: var(--light-menu-bg);
+    min-width: 400px;
+    max-width: 400px;
+}
+.dark .cpu-popup,
+.dark .memory-popup {
+    background-color: var(--dark-menu-bg);
+    min-width: 400px;
+    max-width: 400px;
+}
+
+.cpu-popup .header,
+.memory-popup .header {
+    background: transparent;
+    padding: 12px 16px;
+}
+.cpu-popup .header .text,
+.memory-popup .header .text {
+    font-size: 16px;
+    font-family: "Segoe UI";
+
+}
+.cpu-popup .header .pin-btn,
+.memory-popup .header .pin-btn {
+    font-size: 14px;
+    background: transparent;
+    font-family: "Segoe Fluent Icons";
+    border: none;
+    padding: 6px;
+    color: var(--dark-dim-color)
+}
+.dark .cpu-popup .header .pin-btn,
+.dark .memory-popup .header .pin-btn {
+    color: var(--light-dim-color);
+}
+.cpu-popup .header .pin-btn:hover,
+.memory-popup .header .pin-btn:hover {
+    color: var(--dark-dim-color)
+}
+.dark .cpu-popup .header .pin-btn:hover,
+.dark .memory-popup .header .pin-btn:hover {
+    color: var(--light-dim-color);
+}
+.cpu-popup .header .pin-btn.pinned,
+.memory-popup .header .pin-btn.pinned {
+    color: var(--dark-color)
+}
+.dark .cpu-popup .header .pin-btn.pinned,
+.dark .memory-popup .header .pin-btn.pinned {
+    color: var(--light-color);
+}
+/* Graph area */
+.cpu-popup .graph-container,
+.memory-popup .graph-container {
+    background: transparent;
+    min-height: 64px;
+}
+.cpu-popup .cpu-graph,
+.memory-popup .memory-graph {
+    color: #0f6bff;
+    /* <-- set the graph line/fill color */
+}
+.cpu-popup .cpu-graph-grid,
+.memory-popup .memory-graph-grid {
+    color: rgba(0, 0, 0, 0.05);
+    /* set the grid line color */
+}
+.dark .cpu-popup .cpu-graph-grid,
+.dark .memory-popup .memory-graph-grid {
+    color: rgba(255, 255, 255, 0.05);
+    /* set the grid line color */
+}
+.cpu-popup .graph-title,
+.memory-popup .graph-title {
+    font-size: 12px;
+    color: var(--dark-dim-color);
+    font-family: 'Segoe UI';
+    padding: 0px 0px 4px 14px;
+}
+.dark .cpu-popup .graph-title,
+.dark .memory-popup .graph-title {
+    color: var(--light-dim-color);
+}
+/* Stats grid */
+.cpu-popup .stats,
+.memory-popup .stats {
+    background: transparent;
+    padding: 16px;
+}
+.cpu-popup .stats .stat-item,
+.memory-popup .stats .stat-item {
+    background-color: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.04);
+    border-radius: 8px;
+    padding: 8px 12px;
+    margin: 8px;
+}
+.cpu-popup .stats .stat-item,
+.memory-popup .stats .stat-item {
+    background-color: rgba(255, 255, 255, 0.35);
+    border: 1px solid rgba(255, 255, 255, 0.6);
+    border-radius: 8px;
+    padding: 8px 12px;
+    margin: 8px;
+}
+.dark .cpu-popup .stats .stat-item,
+.dark .memory-popup .stats .stat-item {
+    background-color: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.04);
+    border-radius: 8px;
+    padding: 8px 12px;
+    margin: 8px;
+}
+.cpu-popup .stats .stat-label,
+.memory-popup .stats .stat-label {
+    font-size: 13px;
+    color: var(--dark-dim-color);
+    font-family: 'Segoe UI';
+    font-weight: 400;
+    padding: 6px 4px 2px 4px;
+}
+.dark .cpu-popup .stats .stat-label,
+.dark .memory-popup .stats .stat-label {
+    color: var(--light-dim-color);
+}
+.cpu-popup .stats .stat-value,
+.memory-popup .stats .stat-value {
+    font-size: 20px;
+    font-weight: 700;
+    color: var(--dark-color);
+    font-family: 'Segoe UI';
+    padding: 0 4px 12px 4px;
+}
+.dark .cpu-popup .stats .stat-value,
+.dark .memory-popup .stats .stat-value {
+    color: var(--light-color);
+}
+
+.power-menu-widget .label {
+    font-size: 16px;
+    padding: 0;
+}
+.power-menu-compact {
+    min-width: 260px;
+    background-color: var(--light-menu-bg)
+}
+.dark .power-menu-compact {
+    min-width: 260px;
+    background-color: var(--dark-menu-bg);
+}
+.power-menu-compact .profile-info {
+    padding: 12px 0 24px 0;
+}
+
+.power-menu-compact .profile-info .profile-username {
+    font-size: 16px;
+    font-weight: 600;
+    color: var(--dark-dim-color);
+    font-family: 'Segoe UI';
+    margin-top: 4px;
+}
+.dark .power-menu-compact .profile-info .profile-username {
+    color: var(--light-dim-color);
+}
+.power-menu-compact .profile-info .profile-account-type {
+    font-size: 12px;
+    color: #ffffff;
+    font-weight: 600;
+    margin-top: 8px;
+    font-family: 'Segoe UI';
+    background-color: #0f68dd;
+    padding: 2px 6px;
+    border-radius: 6px;
+}
+.power-menu-compact .profile-info .profile-email {
+    font-size: 13px;
+    color: var(--dark-dim-color);
+    margin-top: 2px;
+    font-family: 'Segoe UI';
+}
+.dark .power-menu-compact .profile-info .profile-email {
+    color: var(--light-dim-color);
+}
+.power-menu-compact .manage-accounts {
+    font-size: 12px;
+    background-color: rgba(255, 255, 255, 0.08);
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    padding: 2px 8px;
+    margin-top: 16px;
+    border-radius: 6px;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+}
+.power-menu-compact .manage-accounts:hover {
+    background-color: rgba(255, 255, 255, 0.15);
+}
+.power-menu-compact .buttons {
+    background-color: rgba(255, 255, 255, 0.35);
+    margin: 0 12px 12px 12px;
+    border-radius: 8px;
+}
+.dark .power-menu-compact .buttons {
+    background-color: rgba(255, 255, 255, 0.03);
+    margin: 0 12px 12px 12px;
+    border-radius: 8px;
+}
+.power-menu-compact .button {
+    padding: 8px 16px;
+    background-color: transparent;
+    border: none;
+    border-radius: 0;
+}
+.power-menu-compact .button.hover {
+    background-color: rgba(255, 255, 255, 0.4);
+}
+.dark .power-menu-compact .button.hover {
+    background-color: rgba(255, 255, 255, 0.05);
+}
+.power-menu-compact .button.lock.hover {
+    border-top-right-radius: 8px;
+    border-top-left-radius: 8px;
+}
+.power-menu-compact .button.shutdown.hover {
+    border-bottom-right-radius: 8px;
+    border-bottom-left-radius: 8px;
+}
+.power-menu-compact .button .icon {
+    font-size: 14px;
+    font-weight: 400;
+    color: var(--dark-color);
+    padding-right: 10px;
+    min-width: 20px;
+}
+.dark .power-menu-compact .button .icon {
+    color: var(--light-color);
+}
+.power-menu-compact .button .label {
+    font-size: 13px;
+    font-weight: 500;
+    font-family: "Segoe UI";
+    color: var(--dark-dim-color)
+}
+.dark .power-menu-compact .button .label {
+    color: var(--light-dim-color);
+}
+
+.power-menu-compact .icon.hover,
+.power-menu-compact .label.hover {
+    color: var(--dark-color)
+}
+.dark .power-menu-compact .icon.hover,
+.dark .power-menu-compact .label.hover {
+    color: var(--light-color);
+}
+.dark .open-meteo-widget .icon {
+    color: #F6E3B4
+}
+.open-meteo-card {
+    background-color: var(--light-menu-bg);
+    min-width: 500px;
+}
+.dark .open-meteo-card {
+    background-color: var(--dark-menu-bg);
+    min-width: 500px;
+}
+.open-meteo-card-today .label {
+    font-size: 13px;
+    font-family: "Segoe UI";
+    font-weight: 400;
+    color: var(--dark-dim-color)
+}
+.dark .open-meteo-card-today .label {
+    color: var(--light-dim-color);
+}
+.open-meteo-card-today .label.location {
+    font-size: 32px;
+    font-weight: 700;
+    font-family: "Segoe UI";
+    color: var(--dark-color)
+}
+.dark .open-meteo-card-today .label.location {
+    color: var(--light-color);
+}
+.open-meteo-card-today .label.sunrisesunset {
+    font-size: 18px;
+    font-family: "Segoe UI";
+    font-weight: 600;
+    color: rgb(201, 204, 159);
+}
+.open-meteo-card-today .label.sunrisesunset-icon {
+    font-size: 16px;
+    color: rgb(201, 204, 159);
+    font-family: "Segoe Fluent Icons";
+    font-weight: 600;
+}
+.open-meteo-card-day {
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 8px;
+    background-color: rgba(0, 0, 0, 0);
+    padding: 4px;
+    min-width: 70px;
+}
+.open-meteo-card-day .day-name {
+    font-family: "Segoe UI";
+    color: var(--dark-dim-color);
+    font-size: 12px;
+    font-weight: 600;
+}
+.dark .open-meteo-card-day .day-name {
+    color: var(--light-dim-color);
+}
+.open-meteo-card-day .day-temp-max {
+    font-family: "Segoe UI";
+    font-weight: 700;
+    font-size: 16px;
+    color: var(--dark-color);
+}
+.dark .open-meteo-card-day .day-temp-max {
+    color: var(--light-color);
+}
+
+.open-meteo-card-day .day-temp-min {
+    font-family: "Segoe UI";
+    color: var(--dark-color);
+    font-weight: 400;
+    font-size: 13px;
+}
+.dark .open-meteo-card-day .day-temp-min {
+    color: var(--light-color);
+}
+
+.open-meteo-card-day.active {
+    background-color: rgba(255, 255, 255, 0.35);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+}
+.dark .open-meteo-card-day.active {
+    background-color: rgba(255, 255, 255, 0.05);
+    border: 1px solid rgba(255, 255, 255, 0.08);
+}
+.open-meteo-card-day:hover {
+    background-color: rgba(255, 255, 255, 0.35);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+}
+.dark .open-meteo-card-day:hover {
+    background-color: rgba(255, 255, 255, 0.05);
+    border: 1px solid rgba(255, 255, 255, 0.08);
+}
+.open-meteo-card .hourly-container {
+    border: none;
+    background-color: transparent;
+    min-height: 120px;
+}
+.open-meteo-card .hourly-data {
+    font-size: 11px;
+    font-weight: 700;
+    font-family: "Segoe UI";
+}
+.open-meteo-card .hourly-data.temperature {
+    background-color: #c9be48;
+}
+.open-meteo-card .hourly-data.rain {
+    background-color: #4a90e2;
+}
+.open-meteo-card .hourly-data.snow {
+    background-color: #a0c4ff;
+}
+.open-meteo-card .hourly-data .hourly-rain-animation {
+    color: rgba(150, 200, 255, 40);
+    background-color: rgba(0, 0, 0, 0);
+}
+.open-meteo-card .hourly-data .hourly-snow-animation {
+    color: rgba(255, 255, 255, 150);
+    background-color: rgba(0, 0, 0, 0);
+}
+.open-meteo-card .hourly-data-buttons {
+    margin-top: 11px;
+    margin-left: 11px;
+}
+.open-meteo-card .hourly-data-button {
+    border-radius: 4px;
+    min-height: 24px;
+    min-width: 24px;
+    max-width: 24px;
+    max-height: 24px;
+    font-size: 14px;
+    color: rgba(255, 255, 255, 0.3);
+    border: 1px solid transparent;
+}
+.open-meteo-card .hourly-data-button.active {
+    color: #fff;
+    background-color: rgba(255, 255, 255, 0.1);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+}
+.open-meteo-card .search-head {
+    font-size: 18px;
+    font-family: "Segoe UI";
+    font-weight: 600;
+    color: rgba(255, 255, 255, 0.9);
+}
+.open-meteo-card .search-description {
+    font-size: 14px;
+    font-family: "Segoe UI";
+    font-weight: 400;
+    color: rgba(255, 255, 255, 0.7);
+    padding-bottom: 8px;
+}
+.open-meteo-card .no-data-icon {
+    font-size: 88px;
+}
+.open-meteo-card .no-data-text {
+    font-size: 16px;
+    font-family: "Segoe UI";
+    font-weight: 400;
+}
+/* search dialog */
+.open-meteo-card .search-input {
+    padding: 8px 12px;
+    border: 1px solid #5e6070;
+    border-radius: 6px;
+    background-color: rgba(17, 17, 27, 0.1);
+    color: #cdd6f4;
+    font-family: "Segoe UI";
+    font-size: 14px;
+}
+.open-meteo-card .search-input:focus {
+    border: 1px solid #89b4fa;
+    background-color: rgba(17, 17, 27, 0.2);
+}
+.open-meteo-card .search-results {
+    border: 1px solid #45475a00;
+    border-radius: 6px;
+    background-color: rgba(0, 0, 0, 0);
+    color: #cbced8;
+    font-size: 13px;
+    font-family: "Segoe UI";
+}
+.open-meteo-card .search-results::item {
+    padding: 6px;
+}
+.open-meteo-card .search-results::item:hover {
+    background-color: rgba(255, 255, 255, 0.05);
+}
+
+.clock-widget .icon {
+    font-size: 14px;
+    padding-right: 4px;
+}
+.clock-widget .icon.alarm {
+    color: #f38ba8;
+    margin-left: 4px;
+}
+.clock-widget .label.alarm {
+    color: #74b0ff;
+    margin-left: 4px;
+}
+
+/* Calendar, Alarm, and Timer Popups */
+.clock-popup.alarm,
+.clock-popup.timer,
+.clock-popup.calendar {
+    min-width: 460px;
+    background-color: var(--light-menu-bg);
+}
+.dark .clock-popup.alarm,
+.dark .clock-popup.timer,
+.dark .clock-popup.calendar {
+    background-color: var(--dark-menu-bg);
+}
+.clock-popup.calendar .calendar-table,
+.clock-popup.calendar .calendar-table::item {
     background-color: rgba(17, 17, 27, 0);
-    color: rgba(162, 177, 196, 0.85);
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    color: rgba(133, 144, 160, 0.85);
+    font-family: 'Segoe UI';
     margin: 0;
     padding: 0;
     border: none;
-    outline: none;  
+    outline: none;
 }
-.calendar .calendar-table::item:selected {
-    color: rgb(255, 255, 255);
-    background-color: #007acc;
-    border-radius: 10px;
+.dark .clock-popup.calendar .calendar-table,
+.dark .clock-popup.calendar .calendar-table::item {
+    background-color: rgba(17, 17, 27, 0);
+    color: rgba(162, 177, 196, 0.85);
 }
-.calendar .day-label {
+.clock-popup.calendar .calendar-table::item:selected {
+    color: #282936;
+    font-weight: bold;
+    background-color: #74b0ff;
+    border-radius: 12px;
+}
+.clock-popup.calendar .day-label {
     margin-top: 20px;
 }
-.calendar .day-label,
-.calendar .month-label,
-.calendar .date-label,
-.calendar .week-label,
-.calendar .holiday-label {
+.clock-popup.calendar .day-label,
+.clock-popup.calendar .month-label,
+.clock-popup.calendar .year-label,
+.clock-popup.calendar .date-label {
     font-family: 'Segoe UI';
     font-size: 16px;
-    color: #fff;
     font-weight: 700;
     min-width: 180px;
     max-width: 180px;
 }
-.calendar .week-label,
-.calendar .holiday-label {
-    font-size: 12px;
-    font-weight: 600;
-    color: rgba(162, 177, 196, 0.85);
-}
-.calendar .holiday-label {
-    color: rgba(162, 177, 196, 0.85);
-    font-weight: 700;
-}
-.calendar .month-label {
+.clock-popup.calendar .month-label {
     font-weight: normal;
 }
-.calendar .date-label {
+.clock-popup.calendar .year-label {
+    font-weight: normal;
+}
+.clock-popup.calendar .date-label {
     font-size: 88px;
     font-weight: 900;
-    color: rgb(255, 255, 255);
     margin-top: -20px;
-}
\ No newline at end of file
+}
+
+/* Alarm and Timer Dialog Containers */
+.clock-popup.timer .clock-popup-container,
+.clock-popup.alarm .clock-popup-container {
+    padding: 16px;
+}
+.clock-popup.timer .clock-popup-footer,
+.clock-popup.alarm .clock-popup-footer {
+    padding: 16px;
+    border-top: 1px solid rgb(0, 0, 0);
+    background-color: rgba(0, 0, 0, 0.3);
+}
+.clock-popup .clock-label-timer {
+    font-size: 13px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    color: #8d9196;
+}
+.clock-popup .clock-input-time {
+    font-size: 48px;
+    background-color: transparent;
+    border: none;
+    font-family: monospace, "Tahoma", "Segoe UI";
+    font-weight: 600;
+    color: #ced3d8;
+}
+.clock-popup .clock-input-time.colon {
+    padding-bottom: 8px;
+}
+
+/* Dialog Buttons */
+.clock-popup .button {
+    border-radius: 4px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    font-size: 13px;
+    min-height: 28px;
+    min-width: 64px;
+    margin: 4px 0;
+    background-color: rgba(255, 255, 255, 0.1);
+}
+.clock-popup .button.save,
+.clock-popup .button.start,
+.clock-popup .button.delete,
+.clock-popup .button.cancel {
+    min-width: 120px;
+}
+
+.clock-popup .button.save,
+.clock-popup .button.start {
+    background-color: rgba(0, 110, 255, 0.5);
+    margin-right: 8px;
+}
+
+.clock-popup .button.save:hover,
+.clock-popup .button.start:hover {
+    background-color: rgba(0, 110, 255, 0.7);
+}
+.clock-popup .button.delete {
+    background-color: rgba(255, 80, 80, 0.5);
+}
+.clock-popup .button.delete:hover {
+    background-color: rgba(255, 80, 80, 0.7);
+}
+.clock-popup .button.is-alarm-enabled {
+    background-color: rgba(0, 110, 255, 0.5);
+}
+.clock-popup .button.is-alarm-enabled:hover {
+    background-color: rgba(0, 110, 255, 0.7);
+}
+.clock-popup .button.is-alarm-disabled {
+    background-color: rgba(255, 255, 255, 0.2);
+}
+.clock-popup .button.day {
+    background-color: rgba(255, 255, 255, 0.1);
+    max-height: 20px;
+    min-height: 20px;
+}
+.clock-popup .button.day:checked {
+    background-color: rgba(0, 110, 255, 0.5);
+}
+.clock-popup .button.quick-option {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+.clock-popup .button.quick-option:checked {
+    background-color: rgba(0, 110, 255, 0.5);
+}
+.clock-popup .button:hover {
+    background-color: rgba(255, 255, 255, 0.2);
+}
+.clock-popup .button:disabled {
+    background-color: rgba(100, 100, 100, 0.2);
+    color: rgba(150, 150, 150, 0.7);
+}
+.clock-popup .alarm-input-title {
+    font-size: 14px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    color: #d2d6e2;
+    background-color: rgba(255, 255, 255, 0.1);
+    border: 1px solid transparent;
+    border-radius: 4px;
+    padding: 4px 8px;
+    margin-top: 8px;
+    outline: none;
+    min-width: 300px;
+}
+
+.clock-popup .alarm-input-title:focus {
+    border: 1px solid #0078D4;
+}
+
+/* Active Alarm Popup Window */
+.active-alarm-window {
+    background-color: rgba(255, 255, 255, 0.048);
+    max-width: 500px;
+    min-width: 500px;
+    padding: 32px;
+}
+.active-alarm-window .alarm-title-icon {
+    font-size: 64px;
+    color: #ffffff;
+    margin-bottom: 16px;
+}
+.active-alarm-window .alarm-title {
+    font-size: 24px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    color: #ffffff;
+    max-width: 500px;
+    min-width: 500px;
+}
+.active-alarm-window .alarm-info {
+    font-size: 16px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    color: #b2b6c0;
+    margin-bottom: 32px;
+}
+.active-alarm-window .button {
+    border-radius: 4px;
+    font-family: 'Segoe UI';
+    font-weight: 600;
+    font-size: 14px;
+    min-height: 36px;
+    min-width: 100px;
+    margin: 0 4px;
+    background-color: rgba(255, 255, 255, 0.1);
+}
+.active-alarm-window .button:hover {
+    background-color: rgba(255, 255, 255, 0.3);
+}
+
+.home-menu {
+    background-color: var(--light-menu-bg);
+}
+.dark .home-menu {
+    background-color: var(--dark-menu-bg);
+}
+.home-menu .menu-item {
+    color: var(--dark-color);
+    padding: 6px 48px 7px 16px;
+}
+.dark .home-menu .menu-item {
+    color: var(--light-color);
+}
+
+.home-menu .menu-item:hover {
+    background-color: rgba(128, 130, 158, 0.15);
+    color: #fff;
+}
+.home-menu .separator {
+    max-height: 1px;
+    background-color: rgba(128, 130, 158, 0.3);
+}
+
+.systray .button {
+    border-radius: 4px;
+    padding: 2px;
+    background: transparent;
+    border: none;
+    outline: none;
+}
+
+.systray .button:hover {
+    background: rgba(255, 255, 255, 0.2);
+}
+.systray .button.drag-over {
+    background: rgba(255, 255, 255, 0.4);
+}
+.systray .pinned-container.drop-target {
+    background: rgba(255, 255, 255, 0.1);
+}
+.systray .unpinned-visibility-btn {
+    border-radius: 4px;
+    height: 20px;
+    width: 16px;
+    border: none;
+    outline: none;
+}
+
+.systray .unpinned-visibility-btn:checked {
+    background: transparent;
+}
+.systray-popup .button.drag-over {
+    background-color: rgba(255, 255, 255, 0.2);
+}
+.systray .pinned-container.pinned-container.drop-target {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+.systray-popup {
+    background-color: var(--light-menu-bg);
+    padding: 4px;
+}
+.dark .systray-popup {
+    background-color: var(--dark-menu-bg);
+}
+.systray-popup .button {
+    padding: 10px;
+    margin: 0;
+    border: 0;
+    border-radius: 6px;
+}
+.systray-popup .button:hover {
+    background-color: rgba(255, 255, 255, 0.3);
+}
+.dark .systray-popup .button:hover {
+    background-color: rgba(255, 255, 255, 0.05);
+}