/* --- MODERN BPMN STYLING --- */

/* Wrapper & Background */
#bpmn-container {
    background: radial-gradient(circle, #232323 1px, transparent 1px);
    background-size: 20px 20px;
    background-color: #1a1a1a;
}

/* Toolbar Styling */
.bpmn-toolbar {
    background: linear-gradient(to bottom, #2b2b2b, #222);
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.cms-breadcrumb {
    border: 1px solid rgba(255,255,255,0.1);
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);
}

/* Node Styling */
.bpmn-node .body {
    fill: #2a2a2a;
    stroke: #888;
    stroke-width: 2px;
    transition: all 0.3s ease;
    filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.3));
}

.bpmn-node:hover .body {
    stroke: var(--accent-primary); /* Neon Blue/Green depending on var */
    fill: #333;
    cursor: pointer;
}

.bpmn-node.selected .body {
    stroke: #00d2ff;
    stroke-width: 3px;
    filter: drop-shadow(0 0 8px rgba(0, 210, 255, 0.5));
}

/* Start Event Specifics */
.bpmn-node[data-type*="startEvent"] .body {
    stroke: #28a745;
    fill: rgba(40, 167, 69, 0.1);
}

/* End Event Specifics */
.bpmn-node[data-type*="endEvent"] .body {
    stroke: #dc3545;
    stroke-width: 4px;
    fill: rgba(220, 53, 69, 0.1);
}

/* Gateway Specifics */
.bpmn-node[data-type*="Gateway"] .body {
    stroke: #ffc107;
    fill: rgba(255, 193, 7, 0.1);
    transform: rotate(45deg); /* Falls nicht schon im SVG transformiert */
    transform-origin: center;
}
/* Korrektur für transform-origin bei SVG Gruppen ist tricky, besser im JS handhaben */


/* Edge (Connection) Styling */
.bpmn-edge {
    stroke: #666;
    stroke-width: 2px;
    fill: none;
    stroke-linejoin: round;
    marker-end: url(#arrow);
    transition: stroke 0.3s;
}

    .bpmn-edge:hover {
        stroke: #fff;
        stroke-width: 3px;
        cursor: pointer;
    }

    .bpmn-edge.selected {
        stroke: #00d2ff;
        stroke-width: 3px;
    }

/* Labels */
.bpmn-label {
    fill: #e0e0e0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 12px;
    pointer-events: none;
    text-shadow: 0 1px 2px rgba(0,0,0,0.8);
}

/* Icons inside Nodes */
.bpmn-node text.fas {
    fill: #bbb;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    pointer-events: none;
}

/* Empty State Modernization */
#bpmn-empty-state {
    background: radial-gradient(circle at center, #222 0%, #1a1a1a 100%);
}