diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 8ec3d6b..6b10007 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -152,7 +152,7 @@ export default function App() {
   const handleAddNode = useCallback((data: Partial<NodeData>) => {
     snapshotHistory()
     const id = generateUUID()
-    const isContainerNode = CONTAINER_MODE_TYPES.has(data.type as NodeData['type'])
+    const isContainerNode = data.container_mode === true
     const parentNode = data.parent_id ? nodes.find((n) => n.id === data.parent_id) : null
     // Children position is relative to parent; place near top-left with padding
     const position = parentNode
@@ -249,7 +249,7 @@ export default function App() {
     }
     // Sync virtual edge when parent_id changes on an LXC/VM node
     const nodeType = data.type ?? existingNode?.data.type
-    if ((nodeType === 'lxc' || nodeType === 'vm') && 'parent_id' in data) {
+    if ((nodeType === 'lxc' || nodeType === 'vm' || nodeType === 'docker_container') && 'parent_id' in data) {
       const oldParentId = existingNode?.data.parent_id ?? null
       const newParentId = data.parent_id ?? null
       if (oldParentId !== newParentId) {
@@ -331,6 +331,10 @@ export default function App() {
         updateNode(pendingConnection.source, { parent_id: pendingConnection.target })
       } else if (CONTAINER_MODE_TYPES.has(srcType) && (tgtType === 'lxc' || tgtType === 'vm')) {
         updateNode(pendingConnection.target, { parent_id: pendingConnection.source })
+      } else if (srcType === 'docker_container' && tgtType === 'docker_host') {
+        updateNode(pendingConnection.source, { parent_id: pendingConnection.target })
+      } else if (tgtType === 'docker_container' && srcType === 'docker_host') {
+        updateNode(pendingConnection.target, { parent_id: pendingConnection.source })
       }
     }
     setPendingConnection(null)
@@ -426,7 +430,7 @@ export default function App() {
           title="Add Node"
           parentContainerNodes={nodes
             .filter((n) => CONTAINER_MODE_TYPES.has(n.data.type) && n.data.container_mode)
-            .map((n) => ({ id: n.id, label: n.data.label }))}
+            .map((n) => ({ id: n.id, label: n.data.label, nodeType: n.data.type }))}
         />
 
         {/* key forces re-mount when editing a different node, resetting form state */}
@@ -439,7 +443,7 @@ export default function App() {
           title="Edit Node"
           parentContainerNodes={nodes
             .filter((n) => n.id !== editNodeId && CONTAINER_MODE_TYPES.has(n.data.type) && n.data.container_mode)
-            .map((n) => ({ id: n.id, label: n.data.label }))}
+            .map((n) => ({ id: n.id, label: n.data.label, nodeType: n.data.type }))}
         />
 
         <EdgeModal
diff --git a/frontend/src/components/canvas/nodes/index.tsx b/frontend/src/components/canvas/nodes/index.tsx
index 1120316..2dcf080 100644
--- a/frontend/src/components/canvas/nodes/index.tsx
+++ b/frontend/src/components/canvas/nodes/index.tsx
@@ -1,7 +1,7 @@
 import { type NodeProps, type Node } from '@xyflow/react'
 import {
   Globe, Router, Network, Server, Layers, Box, Container,
-  HardDrive, Cpu, Wifi, Circle, Cctv, Printer, Monitor, PlugZap, Anchor,
+  HardDrive, Cpu, Wifi, Circle, Cctv, Printer, Monitor, PlugZap, Anchor, Package,
 } from 'lucide-react'
 import { BaseNode } from './BaseNode'
 import type { NodeData } from '@/types'
@@ -22,5 +22,6 @@ export const CameraNode   = (props: N) => <BaseNode {...props} icon={Cctv} />
 export const PrinterNode  = (props: N) => <BaseNode {...props} icon={Printer} />
 export const ComputerNode = (props: N) => <BaseNode {...props} icon={Monitor} />
 export const CplNode      = (props: N) => <BaseNode {...props} icon={PlugZap} />
-export const DockerHostNode = (props: N) => <BaseNode {...props} icon={Anchor} />
+export const DockerHostNode      = (props: N) => <BaseNode {...props} icon={Anchor} />
+export const DockerContainerNode = (props: N) => <BaseNode {...props} icon={Package} />
 export const GenericNode  = (props: N) => <BaseNode {...props} icon={Circle} />
diff --git a/frontend/src/components/canvas/nodes/nodeTypes.ts b/frontend/src/components/canvas/nodes/nodeTypes.ts
index 7f06bbd..6b33ac4 100644
--- a/frontend/src/components/canvas/nodes/nodeTypes.ts
+++ b/frontend/src/components/canvas/nodes/nodeTypes.ts
@@ -1,4 +1,4 @@
-import { IspNode, RouterNode, SwitchNode, ServerNode, VmNode, LxcNode, NasNode, IotNode, ApNode, CameraNode, PrinterNode, ComputerNode, CplNode, DockerHostNode, GenericNode } from './index'
+import { IspNode, RouterNode, SwitchNode, ServerNode, VmNode, LxcNode, NasNode, IotNode, ApNode, CameraNode, PrinterNode, ComputerNode, CplNode, DockerHostNode, DockerContainerNode, GenericNode } from './index'
 import { ProxmoxGroupNode } from './ProxmoxGroupNode'
 import { GroupRectNode } from './GroupRectNode'
 import { GroupNode } from './GroupNode'
@@ -19,6 +19,7 @@ export const nodeTypes = {
   computer: ComputerNode,
   cpl: CplNode,
   docker_host: DockerHostNode,
+  docker_container: DockerContainerNode,
   generic: GenericNode,
   groupRect: GroupRectNode,
   group: GroupNode,
diff --git a/frontend/src/components/modals/NodeModal.tsx b/frontend/src/components/modals/NodeModal.tsx
index b27b089..f8cf3f1 100644
--- a/frontend/src/components/modals/NodeModal.tsx
+++ b/frontend/src/components/modals/NodeModal.tsx
@@ -11,7 +11,7 @@ import { ICON_REGISTRY, ICON_CATEGORIES, NODE_TYPE_DEFAULT_ICONS } from '@/utils
 
 const NODE_TYPE_GROUPS: { label: string; types: NodeType[] }[] = [
   { label: 'Hardware',       types: ['isp', 'router', 'switch', 'server', 'nas', 'ap', 'printer'] },
-  { label: 'Virtualization', types: ['proxmox', 'vm', 'lxc', 'docker_host'] },
+  { label: 'Virtualization', types: ['proxmox', 'vm', 'lxc', 'docker_host', 'docker_container'] },
   { label: 'IoT',            types: ['iot', 'camera', 'cpl'] },
   { label: 'Generic',        types: ['computer', 'generic', 'groupRect'] },
 ]
@@ -49,7 +49,7 @@ interface NodeModalProps {
   onSubmit: (data: Partial<NodeData>) => void
   initial?: Partial<NodeData>
   title?: string
-  parentContainerNodes?: { id: string; label: string }[]
+  parentContainerNodes?: { id: string; label: string; nodeType?: NodeType }[]
 }
 
 // NodeModal is always mounted with a key that changes on open/edit, so useState
@@ -79,6 +79,10 @@ export function NodeModal({ open, onClose, onSubmit, initial, title = 'Add Node'
     onClose()
   }
 
+  const filteredParentNodes = form.type === 'docker_container'
+    ? parentContainerNodes.filter((n) => n.nodeType === 'docker_host')
+    : parentContainerNodes
+
   return (
     <Dialog open={open} onOpenChange={(o) => !o && onClose()}>
       <DialogContent className="bg-[#161b22] border-[#30363d] text-foreground max-w-md">
@@ -260,7 +264,7 @@ export function NodeModal({ open, onClose, onSubmit, initial, title = 'Add Node'
             </div>
 
             {/* Parent container */}
-            {form.type !== 'groupRect' && form.type !== 'group' && parentContainerNodes.length > 0 && (
+            {form.type !== 'groupRect' && form.type !== 'group' && filteredParentNodes.length > 0 && (
               <div className="flex flex-col gap-1.5 col-span-2">
                 <Label className="text-xs text-muted-foreground">Parent Container</Label>
                 <Select
@@ -270,13 +274,13 @@ export function NodeModal({ open, onClose, onSubmit, initial, title = 'Add Node'
                   <SelectTrigger className="bg-[#21262d] border-[#30363d] text-sm h-8">
                     <SelectValue placeholder="None (standalone)">
                       {form.parent_id
-                        ? (parentContainerNodes.find((n) => n.id === form.parent_id)?.label ?? 'None (standalone)')
+                        ? (filteredParentNodes.find((n) => n.id === form.parent_id)?.label ?? 'None (standalone)')
                         : 'None (standalone)'}
                     </SelectValue>
                   </SelectTrigger>
                   <SelectContent className="bg-[#21262d] border-[#30363d]">
                     <SelectItem value="none" className="text-sm">None (standalone)</SelectItem>
-                    {parentContainerNodes.map((n) => (
+                    {filteredParentNodes.map((n) => (
                       <SelectItem key={n.id} value={n.id} className="text-sm">{n.label}</SelectItem>
                     ))}
                   </SelectContent>
diff --git a/frontend/src/components/modals/__tests__/NodeModal.test.tsx b/frontend/src/components/modals/__tests__/NodeModal.test.tsx
index 78a7cec..828a8e8 100644
--- a/frontend/src/components/modals/__tests__/NodeModal.test.tsx
+++ b/frontend/src/components/modals/__tests__/NodeModal.test.tsx
@@ -237,7 +237,7 @@ describe('NodeModal', () => {
   // ── Container mode ─────────────────────────────────────────────────────
 
   const containerModeTypes = ['proxmox', 'vm', 'lxc', 'docker_host'] as const
-  const nonContainerModeTypes = ['isp', 'router', 'switch', 'server', 'nas', 'ap', 'printer', 'iot', 'camera', 'cpl', 'computer', 'generic', 'groupRect', 'group'] as const
+  const nonContainerModeTypes = ['isp', 'router', 'switch', 'server', 'nas', 'ap', 'printer', 'iot', 'camera', 'cpl', 'computer', 'generic', 'docker_container', 'groupRect', 'group'] as const
 
   it.each(containerModeTypes)('shows Container Mode toggle for %s type', (type) => {
     renderModal({ initial: { ...BASE, type } })
@@ -280,6 +280,26 @@ describe('NodeModal', () => {
     expect(screen.queryByText('Parent Container')).toBeNull()
   })
 
+  it('docker_container shows only docker_host parents', () => {
+    renderModal({
+      initial: { ...BASE, type: 'docker_container' },
+      parentContainerNodes: [
+        { id: 'h1', label: 'My Docker Host', nodeType: 'docker_host' },
+        { id: 'p1', label: 'My Proxmox', nodeType: 'proxmox' },
+      ],
+    })
+    expect(screen.getByText('My Docker Host')).toBeDefined()
+    expect(screen.queryByText('My Proxmox')).toBeNull()
+  })
+
+  it('docker_container hides Parent Container when no docker_host is available', () => {
+    renderModal({
+      initial: { ...BASE, type: 'docker_container' },
+      parentContainerNodes: [{ id: 'p1', label: 'My Proxmox', nodeType: 'proxmox' }],
+    })
+    expect(screen.queryByText('Parent Container')).toBeNull()
+  })
+
   // ── Appearance ────────────────────────────────────────────────────────
 
   it('renders 3 color swatch labels (border, background, icon)', () => {
diff --git a/frontend/src/stores/__tests__/canvasStore.test.ts b/frontend/src/stores/__tests__/canvasStore.test.ts
index 860dd67..5e8c9ff 100644
--- a/frontend/src/stores/__tests__/canvasStore.test.ts
+++ b/frontend/src/stores/__tests__/canvasStore.test.ts
@@ -64,6 +64,17 @@ describe('canvasStore', () => {
     expect(nested?.extent).toBe('parent')
   })
 
+  it('docker_container nests under docker_host with container_mode on', () => {
+    const host = { ...makeNode('dh1', { type: 'docker_host', container_mode: true }), position: { x: 100, y: 100 } }
+    const container = { ...makeNode('dc1', { type: 'docker_container' }), position: { x: 160, y: 180 } }
+    useCanvasStore.getState().addNode(host)
+    useCanvasStore.getState().addNode(container)
+    useCanvasStore.getState().updateNode('dc1', { parent_id: 'dh1' })
+    const node = useCanvasStore.getState().nodes.find((n) => n.id === 'dc1')
+    expect(node?.parentId).toBe('dh1')
+    expect(node?.extent).toBe('parent')
+  })
+
   it('updateNode updates data fields', () => {
     useCanvasStore.getState().addNode(makeNode('n1', { label: 'old' }))
     useCanvasStore.getState().updateNode('n1', { label: 'new', ip: '10.0.0.1' })
@@ -437,6 +448,26 @@ describe('canvasStore', () => {
     expect(hasUnsavedChanges).toBe(true)
   })
 
+  it('setProxmoxContainerMode ON sets width/height for docker_host (not just proxmox)', () => {
+    const host: Node<NodeData> = { id: 'dh', type: 'docker_host', position: { x: 0, y: 0 }, data: { label: 'dh', type: 'docker_host', status: 'unknown', services: [], container_mode: false } }
+    useCanvasStore.setState({ nodes: [host] })
+    useCanvasStore.getState().setProxmoxContainerMode('dh', true)
+    const updated = useCanvasStore.getState().nodes.find((n) => n.id === 'dh')
+    expect(updated?.data.container_mode).toBe(true)
+    expect(updated?.width).toBe(300)
+    expect(updated?.height).toBe(200)
+  })
+
+  it('setProxmoxContainerMode OFF clears width/height for docker_host', () => {
+    const host: Node<NodeData> = { id: 'dh', type: 'docker_host', position: { x: 0, y: 0 }, width: 300, height: 200, data: { label: 'dh', type: 'docker_host', status: 'unknown', services: [], container_mode: true } }
+    useCanvasStore.setState({ nodes: [host] })
+    useCanvasStore.getState().setProxmoxContainerMode('dh', false)
+    const updated = useCanvasStore.getState().nodes.find((n) => n.id === 'dh')
+    expect(updated?.data.container_mode).toBe(false)
+    expect(updated?.width).toBeUndefined()
+    expect(updated?.height).toBeUndefined()
+  })
+
   it('setProxmoxContainerMode ON nests children inside proxmox', () => {
     const proxmox: Node<NodeData> = { id: 'px', type: 'proxmox', position: { x: 0, y: 0 }, data: { label: 'px', type: 'proxmox', status: 'unknown', services: [], container_mode: false } }
     const child = makeNode('vm1', { parent_id: 'px', type: 'vm' })
diff --git a/frontend/src/stores/canvasStore.ts b/frontend/src/stores/canvasStore.ts
index 0804236..5e1c043 100644
--- a/frontend/src/stores/canvasStore.ts
+++ b/frontend/src/stores/canvasStore.ts
@@ -297,7 +297,6 @@ export const useCanvasStore = create<CanvasState>((set) => ({
       let nodes = state.nodes.map((n) => {
         if (n.id === proxmoxId) {
           const withMode = { ...n, data: { ...n.data, container_mode: enabled } }
-          if (n.data.type !== 'proxmox') return withMode
           return enabled
             ? { ...withMode, width: n.width ?? 300, height: n.height ?? 200 }
             : { ...withMode, width: undefined, height: undefined }
diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts
index 2d38308..b4e0f59 100644
--- a/frontend/src/types/index.ts
+++ b/frontend/src/types/index.ts
@@ -14,6 +14,7 @@ export type NodeType =
   | 'computer'
   | 'cpl'
   | 'docker_host'
+  | 'docker_container'
   | 'generic'
   | 'groupRect'
   | 'group'
@@ -128,6 +129,7 @@ export const NODE_TYPE_LABELS: Record<NodeType, string> = {
   computer: 'Computer',
   cpl: 'CPL / Powerline',
   docker_host: 'Docker Host',
+  docker_container: 'Docker Container',
   generic: 'Generic Device',
   groupRect: 'Group Rectangle',
   group: 'Node Group',
diff --git a/frontend/src/utils/__tests__/themes.test.ts b/frontend/src/utils/__tests__/themes.test.ts
index e186106..48e9854 100644
--- a/frontend/src/utils/__tests__/themes.test.ts
+++ b/frontend/src/utils/__tests__/themes.test.ts
@@ -4,7 +4,7 @@ import type { NodeType, EdgeType, NodeStatus } from '@/types'
 
 const NODE_TYPES: NodeType[] = [
   'isp', 'router', 'switch', 'server', 'proxmox', 'vm', 'lxc',
-  'nas', 'iot', 'ap', 'camera', 'printer', 'computer', 'cpl', 'docker_host', 'generic', 'groupRect',
+  'nas', 'iot', 'ap', 'camera', 'printer', 'computer', 'cpl', 'docker_host', 'docker_container', 'generic', 'groupRect',
 ]
 const EDGE_TYPES: EdgeType[] = ['ethernet', 'wifi', 'iot', 'vlan', 'virtual', 'cluster']
 const STATUS_TYPES: NodeStatus[] = ['online', 'offline', 'pending', 'unknown']
diff --git a/frontend/src/utils/nodeIcons.ts b/frontend/src/utils/nodeIcons.ts
index 8287d1d..3523718 100644
--- a/frontend/src/utils/nodeIcons.ts
+++ b/frontend/src/utils/nodeIcons.ts
@@ -98,8 +98,8 @@ export const ICON_REGISTRY: IconEntry[] = [
   { key: 'radio',       label: 'MQTT / RTL-SDR',       category: 'Automation', icon: Radio },
 
   // --- Containers & Dev ---
-  { key: 'anchor',    label: 'Portainer / Docker',   category: 'Dev & Containers', icon: Anchor },
-  { key: 'package',   label: 'Docker Host',          category: 'Dev & Containers', icon: Package },
+  { key: 'anchor',    label: 'Portainer / Docker',        category: 'Dev & Containers', icon: Anchor },
+  { key: 'package',   label: 'Docker Host / Container',  category: 'Dev & Containers', icon: Package },
   { key: 'gitbranch', label: 'Gitea / Gitlab',       category: 'Dev & Containers', icon: GitBranch },
   { key: 'terminal',  label: 'SSH / Shell',          category: 'Dev & Containers', icon: Terminal },
   { key: 'code',      label: 'VS Code Server',       category: 'Dev & Containers', icon: Code2 },
@@ -132,8 +132,9 @@ export const NODE_TYPE_DEFAULT_ICONS: Record<NodeType, LucideIcon> = {
   printer:      Printer,
   computer:     Monitor,
   cpl:          PlugZap,
-  docker_host:  Anchor,
-  generic:      Circle,
+  docker_host:       Anchor,
+  docker_container:  Package,
+  generic:           Circle,
   group:        Circle,
   groupRect:    Circle,
 }
diff --git a/frontend/src/utils/themes.ts b/frontend/src/utils/themes.ts
index 2880b66..7f1be3c 100644
--- a/frontend/src/utils/themes.ts
+++ b/frontend/src/utils/themes.ts
@@ -56,10 +56,11 @@ export const THEMES: Record<ThemeId, ThemePreset> = {
         printer:      { border: '#8b949e', icon: '#8b949e' },
         computer:     { border: '#a855f7', icon: '#a855f7' },
         cpl:          { border: '#e3b341', icon: '#e3b341' },
-        docker_host:  { border: '#2496ED', icon: '#2496ED' },
-        generic:      { border: '#8b949e', icon: '#8b949e' },
-        groupRect:    { border: '#00d4ff', icon: '#00d4ff' },
-        group:        { border: '#00d4ff', icon: '#00d4ff' },
+        docker_host:       { border: '#2496ED', icon: '#2496ED' },
+        docker_container:  { border: '#0ea5e9', icon: '#0ea5e9' },
+        generic:           { border: '#8b949e', icon: '#8b949e' },
+        groupRect:         { border: '#00d4ff', icon: '#00d4ff' },
+        group:             { border: '#00d4ff', icon: '#00d4ff' },
       },
       nodeCardBackground: '#21262d',
       nodeIconBackground: '#161b22',
@@ -111,10 +112,11 @@ export const THEMES: Record<ThemeId, ThemePreset> = {
         printer:       { border: '#94a3b8', icon: '#94a3b8' },
         computer:      { border: '#c084fc', icon: '#c084fc' },
         cpl:           { border: '#fbbf24', icon: '#fbbf24' },
-        docker_host:   { border: '#2496ED', icon: '#2496ED' },
-        generic:       { border: '#94a3b8', icon: '#94a3b8' },
-        groupRect:     { border: '#22d3ee', icon: '#22d3ee' },
-        group:         { border: '#22d3ee', icon: '#22d3ee' },
+        docker_host:       { border: '#2496ED', icon: '#2496ED' },
+        docker_container:  { border: '#38bdf8', icon: '#38bdf8' },
+        generic:           { border: '#94a3b8', icon: '#94a3b8' },
+        groupRect:         { border: '#22d3ee', icon: '#22d3ee' },
+        group:             { border: '#22d3ee', icon: '#22d3ee' },
       },
       nodeCardBackground: '#0a0a0a',
       nodeIconBackground: '#111111',
@@ -166,10 +168,11 @@ export const THEMES: Record<ThemeId, ThemePreset> = {
         printer:       { border: '#6b7280', icon: '#6b7280' },
         computer:      { border: '#7c3aed', icon: '#7c3aed' },
         cpl:           { border: '#b45309', icon: '#b45309' },
-        docker_host:   { border: '#2496ED', icon: '#2496ED' },
-        generic:       { border: '#6b7280', icon: '#6b7280' },
-        groupRect:     { border: '#0284c7', icon: '#0284c7' },
-        group:         { border: '#0284c7', icon: '#0284c7' },
+        docker_host:       { border: '#2496ED', icon: '#2496ED' },
+        docker_container:  { border: '#0369a1', icon: '#0369a1' },
+        generic:           { border: '#6b7280', icon: '#6b7280' },
+        groupRect:         { border: '#0284c7', icon: '#0284c7' },
+        group:             { border: '#0284c7', icon: '#0284c7' },
       },
       nodeCardBackground: '#ffffff',
       nodeIconBackground: '#f0f6ff',
@@ -221,10 +224,11 @@ export const THEMES: Record<ThemeId, ThemePreset> = {
         printer:      { border: '#8888ff', icon: '#8888ff' },
         computer:     { border: '#ff00ff', icon: '#ff00ff' },
         cpl:          { border: '#ffff00', icon: '#ffff00' },
-        docker_host:  { border: '#00aaff', icon: '#00aaff' },
-        generic:      { border: '#8888ff', icon: '#8888ff' },
-        groupRect:    { border: '#00ffff', icon: '#00ffff' },
-        group:        { border: '#00ffff', icon: '#00ffff' },
+        docker_host:       { border: '#00aaff', icon: '#00aaff' },
+        docker_container:  { border: '#00ddff', icon: '#00ddff' },
+        generic:           { border: '#8888ff', icon: '#8888ff' },
+        groupRect:         { border: '#00ffff', icon: '#00ffff' },
+        group:             { border: '#00ffff', icon: '#00ffff' },
       },
       nodeCardBackground: '#0f0f2a',
       nodeIconBackground: '#0a0a1a',
@@ -276,10 +280,11 @@ export const THEMES: Record<ThemeId, ThemePreset> = {
         printer:      { border: '#005500', icon: '#005500' },
         computer:     { border: '#008822', icon: '#008822' },
         cpl:          { border: '#66ff33', icon: '#66ff33' },
-        docker_host:  { border: '#00cc88', icon: '#00cc88' },
-        generic:      { border: '#006600', icon: '#006600' },
-        groupRect:    { border: '#00ff41', icon: '#00ff41' },
-        group:        { border: '#00ff41', icon: '#00ff41' },
+        docker_host:       { border: '#00cc88', icon: '#00cc88' },
+        docker_container:  { border: '#00aacc', icon: '#00aacc' },
+        generic:           { border: '#006600', icon: '#006600' },
+        groupRect:         { border: '#00ff41', icon: '#00ff41' },
+        group:             { border: '#00ff41', icon: '#00ff41' },
       },
       nodeCardBackground: '#001100',
       nodeIconBackground: '#002200',