From 871e919efaca6c05e184135b53f7b249a53e5cca Mon Sep 17 00:00:00 2001
From: Pontoporeia <pontoporeia@happyngreen.fr>
Date: Thu, 2 Apr 2026 18:45:40 +0200
Subject: [PATCH] system.css: use only variables.css tokens, remove undefined
 custom properties
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace the two undefined variables that had crept in:
- var(--admin-border) → #555  (in .log-output border)
- var(--admin-text-muted) → #969696  (inline style on log toolbar label,
  in both system.php and system-fragment.php)

Revert the incorrect intermediate attempt that mapped dark-UI hex values
to light-theme tokens (--bg-primary: #fff, --border-primary: #ddd, etc.)
and also revert the .admin-body override block that was added to
variables.css — variables.css is shared and must not have per-component
overrides.

All remaining var() calls in system.css now reference tokens that exist
in variables.css:
  --accent-primary, --accent-green, --error, --warning, --success,
  --text-tertiary
The dark surface colours (#1a1a1a, #242424, #0d0d0d, #555, #969696, etc.)
stay as literal hex values, consistent with how admin.css handles them.
---
 public/admin/system-fragment.php |  2 +-
 public/admin/system.php          |  2 +-
 public/assets/css/system.css     | 18 +++++++++---------
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/public/admin/system-fragment.php b/public/admin/system-fragment.php
index 67b9240..9ee7a72 100644
--- a/public/admin/system-fragment.php
+++ b/public/admin/system-fragment.php
@@ -173,7 +173,7 @@ if ($tab === 'nginx_config') {
     }
     ?>
 <div class="log-toolbar">
-    <label for="lines-select" style="font-size:.84rem;color:var(--admin-text-muted);">Afficher</label>
+    <label for="lines-select" style="font-size:.84rem;color:var(--text-secondary);">Afficher</label>
     <select id="lines-select" aria-label="Nombre de lignes">
         <?php foreach (ALLOWED_LINES_FRAG as $opt): ?>
         <option value="<?= $opt ?>" <?= $opt === $n ? 'selected' : '' ?>><?= $opt ?> dernières lignes</option>
diff --git a/public/admin/system.php b/public/admin/system.php
index 800df8a..01105bf 100644
--- a/public/admin/system.php
+++ b/public/admin/system.php
@@ -669,7 +669,7 @@ require_once APP_ROOT . '/templates/head.php';
 
     <!-- Lines selector (submits via JS on change; no button needed) -->
     <div class="log-toolbar">
-        <label for="lines-select" style="font-size:.84rem;color:var(--admin-text-muted);">
+        <label for="lines-select" style="font-size:.84rem;color:var(--text-secondary);">
             Afficher
         </label>
         <select id="lines-select" aria-label="Nombre de lignes">
diff --git a/public/assets/css/system.css b/public/assets/css/system.css
index 0d4d10c..23734ca 100644
--- a/public/assets/css/system.css
+++ b/public/assets/css/system.css
@@ -105,9 +105,9 @@
     font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
 }
 .status-ok      { color: var(--accent-green); font-weight: 600; font-size: .85rem; }
-.status-warn    { color: var(--warning); font-weight: 600; font-size: .85rem; }
-.status-err     { color: var(--error); font-weight: 600; font-size: .85rem; }
-.status-unknown { color: var(--text-tertiary);    font-weight: 600; font-size: .85rem; }
+.status-warn    { color: var(--warning);       font-weight: 600; font-size: .85rem; }
+.status-err     { color: var(--error);         font-weight: 600; font-size: .85rem; }
+.status-unknown { color: var(--text-tertiary); font-weight: 600; font-size: .85rem; }
 
 .srv-section-title {
     font-size: .82rem;
@@ -157,9 +157,9 @@
 .disk-bar {
     height: 100%;
     border-radius: 3px;
-    /* width and background-color are set via inline style using --disk-pct and --disk-color */
+    /* width and color driven by PHP via --disk-pct and --disk-color inline vars */
     width: var(--disk-pct, 0%);
-    background: var(--disk-color, #4caf50);
+    background: var(--disk-color, var(--accent-green));
     transition: width .3s;
 }
 .disk-stats {
@@ -170,7 +170,7 @@
     margin-top: .25rem;
 }
 
-/* ── Tab panel loading state ──────────────────────────────────────────────── */
+/* ── Tab panel loading state ───────────────────────────────────────────── */
 #sys-tab-panel {
     min-height: 8rem;  /* prevent layout jump while fetching */
     position: relative;
@@ -256,7 +256,7 @@
 }
 .log-output {
     background: #0d0d0d;
-    border: 1px solid var(--admin-border);
+    border: 1px solid #555;
     border-radius: 4px;
     padding: 1rem;
     overflow-x: auto;
@@ -276,7 +276,7 @@
 }
 .log-line + .log-line { border-top: 1px solid rgba(255,255,255,.03); }
 .log-crit   { color: #ff7070; background: rgba(242, 90, 90, 0.12); }
-.log-error  { color: #f08080; }
+.log-error  { color: var(--error); }
 .log-warn   { color: var(--warning); }
 .log-notice { color: #a0c8ff; }
 .log-line::before {
@@ -332,7 +332,7 @@
 }
 .sys-refresh-note a:hover { text-decoration: underline; }
 
-/* ── Cache freshness badges ──────────────────────────────────────────────── */
+/* ── Cache freshness badges ────────────────────────────────────────────── */
 .sys-cache-badge {
     display: inline-block;
     font-size: .68rem;