fix: various small fixes (TODO, CSS z-index, telegram status styling, settings prompt)

wwwroot/css/dashboard.css

@@ -379,22 +379,18 @@
 
 .telegram-status-box {
   margin: 0 0 var(--box-spacing) 0;
-  border: var(--border-width) solid var(--f1-border);
+  background: var(--f3-bg);
+  border: var(--border-width) solid var(--f3-border);
   border-radius: var(--border-radius);
-  overflow: hidden;
+  padding: var(--box-padding);
+  display: flex;
+  flex-direction: column;
+  gap: var(--badge-spacing);
 }
 
 .tg-status-row {
   display: flex;
-  align-items: baseline;
-  gap: var(--box-spacing);
-  padding: calc(var(--box-padding) * 0.6) var(--box-padding);
-  border-bottom: var(--border-width) solid var(--f1-border);
-  font-size: var(--font-size);
-}
-
-.tg-status-row:last-child {
-  border-bottom: none;
+  gap: var(--badge-spacing);
 }
 
 .tg-status-row.tg-error {
@@ -402,34 +398,25 @@
 }
 
 .tg-label {
-  flex-shrink: 0;
-  width: 160px;
-  color: var(--text-muted, var(--semi-transparent));
-  opacity: var(--semi-transparent);
-  font-size: calc(var(--font-size) * 0.9);
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .tg-value {
-  flex: 1;
-  word-break: break-all;
-  font-family: var(--font-mono, monospace);
-  font-size: calc(var(--font-size) * 0.9);
-}
-
-.tg-badge {
-  display: inline-block;
-  padding: 2px 8px;
-  border-radius: 99px;
-  font-family: var(--font-sans, sans-serif);
-  font-size: calc(var(--font-size) * 0.85);
+  flex: 3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .tg-badge-ok {
-  background: color-mix(in srgb, var(--success, #22c55e) 15%, transparent);
-  color: var(--success, #22c55e);
+  background: color-mix(in srgb, var(--success) 15%, transparent);
+  color: var(--success);
 }
 
 .tg-badge-off {
-  background: color-mix(in srgb, var(--warning, #f59e0b) 15%, transparent);
-  color: var(--warning, #f59e0b);
+  background: color-mix(in srgb, var(--warning) 15%, transparent);
+  color: var(--warning);
 }