fd

Bootstrap_new/css/theme-modern.css

@@ -64,4 +64,69 @@ body { background: var(--bg-body); color: #444; }
     width: 40px; height: 40px; background: var(--accent); color: white;
     display: flex; align-items: center; justify-content: center;
     border-radius: 50%; font-weight: bold;
+}
+
+/* --- SIDEBAR STRUCTURE --- */
+.sidebar {
+    position: fixed;
+    top: 20px;
+    left: 20px;
+    bottom: 20px;
+    width: 260px;
+    z-index: 996;
+    transition: all 0.3s;
+    padding: 20px;
+    overflow-y: auto;
+    background: #1e293b; /* Bleu Nuit */
+    border-radius: 20px;
+}
+
+.sidebar-nav .nav-link {
+    display: flex;
+    align-items: center;
+    font-size: 0.9rem;
+    font-weight: 500;
+    color: rgba(255,255,255,0.7);
+    padding: 12px 15px;
+    border-radius: 12px;
+    margin-bottom: 5px;
+}
+
+.sidebar-nav .nav-link.active, .sidebar-nav .nav-link:hover {
+    background: rgba(8, 197, 209, 0.15);
+    color: #08C5D1;
+}
+
+/* --- MAIN TOOLBAR --- */
+.main-nav-toolbar {
+    background: white;
+    padding: 15px 25px;
+    border-radius: 15px;
+    border: 1px solid #edf2f7;
+    margin-top: -10px; /* Aligné avec le haut du main */
+}
+
+.nav-pill-item {
+    padding: 8px 16px;
+    border-radius: 10px;
+    text-decoration: none;
+    color: #64748b;
+    font-size: 0.85rem;
+    font-weight: 600;
+    transition: 0.2s;
+}
+
+.nav-pill-item.active {
+    background: #08C5D1;
+    color: white !important;
+}
+
+/* --- FIX DES SUPERPOSITIONS --- */
+#main {
+    margin-left: 300px !important; /* Sidebar (260) + Marge (40) */
+    transition: all 0.3s;
+}
+
+@media (max-width: 1199px) {
+    #main { margin-left: 20px !important; }
 }