From aa50123e9fbbfdb301861a8ff1f9c9e42518b3cb Mon Sep 17 00:00:00 2001
From: IliesAllali <pro.allali.ilies@gmail.com>
Date: Sun, 25 Oct 2026 17:20:19 +0100
Subject: [PATCH] =?UTF-8?q?Param=C3=A8tres=20:=20cinq=20onglets=20qui=20ti?=
 =?UTF-8?q?ennent=20=C3=A0=20360=20px?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 frontend/src/components/AdminPanel.jsx     | 2 +-
 frontend/src/components/SettingsPanels.css | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/AdminPanel.jsx b/frontend/src/components/AdminPanel.jsx
index 91047b0..c63384a 100644
--- a/frontend/src/components/AdminPanel.jsx
+++ b/frontend/src/components/AdminPanel.jsx
@@ -423,7 +423,7 @@ const AdminPanel = ({
           <X size={18} aria-hidden="true" />
         </button>
 
-        <div className="pz-tabs" role="tablist">
+        <div className="pz-tabs ts-tabs" role="tablist">
           <button type="button" role="tab" aria-selected={section === 'tree'} className="pz-tab" onClick={() => setSection('tree')}>{t('Votre arbre')}</button>
           <button type="button" role="tab" aria-selected={section === 'managers'} className="pz-tab" onClick={() => setSection('managers')}>{t('Gestion')}</button>
           <button type="button" role="tab" aria-selected={section === 'visits'} className="pz-tab" onClick={() => setSection('visits')}>{t('Visites')}</button>
diff --git a/frontend/src/components/SettingsPanels.css b/frontend/src/components/SettingsPanels.css
index 32beb61..0261340 100644
--- a/frontend/src/components/SettingsPanels.css
+++ b/frontend/src/components/SettingsPanels.css
@@ -56,6 +56,10 @@
   .ts-row-actions { justify-content: flex-start; }
 }
 
+/* Cinq onglets : ils rétrécissent (texte sur deux lignes) au lieu de déborder du panneau sur un petit téléphone */
+.ts-tabs .pz-tab { min-width: 0; }
+@media (max-width: 420px) { .ts-tabs .pz-tab { padding: 0 4px; font-size: 12.5px; line-height: 1.2; } }
+
 /* ── Gestion : propriétaire et co-gestionnaires (issue #145) ── */
 .tm-row { padding: 12px 14px; }
 .tm-who { display: flex; align-items: center; gap: 10px; min-width: 0; }