/* Lxn.Diagram — Build palette drag/drop highlights (JS adds classes to .diagram-host / SVG nodes).
   Loaded via _content/Lxn.Diagram/css/diagram-palette-drop.css from host App.razor. */

.diagram-host.palette-dragging .node-addconnectingaction .add-bg {
    filter: drop-shadow(0 0 4px rgba(31, 169, 113, .65));
    stroke-dasharray: 4 3;
    stroke-width: 2;
}

.diagram-host.palette-dragging .node-main .node-box {
    stroke-dasharray: 4 3;
}

.diagram-host.palette-dragging
    .node-textlabel[data-palette-drop-kind="MenuSection"][data-palette-drop-enabled="true"] {
    filter: drop-shadow(0 0 5px rgba(100, 175, 75, .65));
}

.node-textlabel.palette-menu-section-active {
    filter: drop-shadow(0 0 9px rgba(100, 175, 75, .9));
}

.node-textlabel.palette-menu-section-active .node-geom {
    fill: rgba(100, 175, 75, .14);
    stroke: #64af4b;
    stroke-width: 2.5;
    stroke-dasharray: 6 3;
}

.node-addconnectingaction.palette-drop-target-active .add-bg {
    fill: var(--primary-color, #0f5fb2);
    stroke: var(--primary-color, #0f5fb2);
    filter: drop-shadow(0 0 6px rgba(15, 95, 178, .6));
}

.node-addconnectingaction.palette-open-connector-active .add-bg {
    stroke: #c026d3;
    stroke-width: 3;
    stroke-dasharray: 6 4;
    animation: palette-open-connector-pulse 1.2s ease-in-out infinite;
}

.node-addconnectingaction.palette-open-connector-active {
    filter: drop-shadow(0 0 10px rgba(192, 38, 211, .45));
}

.node-addconnectingaction.palette-open-connector-active.palette-preview-ghost-hide {
    opacity: 0.12;
    pointer-events: none;
}

.node-addconnectingaction.palette-open-connector-active.palette-preview-ghost-hide .add-bg,
.node-addconnectingaction.palette-open-connector-active.palette-preview-ghost-hide .add-plus {
    opacity: 0;
}

@keyframes palette-open-connector-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); }
}

#palette-preview-overlay {
    pointer-events: none;
}

.palette-drop-preview-ghost .palette-preview-card {
    fill: rgba(255, 255, 255, .92);
    stroke: #c026d3;
    stroke-width: 2.5;
    stroke-dasharray: 8 4;
    filter: drop-shadow(0 6px 14px rgba(15, 95, 178, .18));
}

.palette-drop-preview-ghost .palette-preview-edge {
    fill: none;
    stroke: #c026d3;
    stroke-width: 2.5;
    stroke-dasharray: 8 4;
    opacity: .9;
}

.palette-drop-preview-ghost .palette-preview-label {
    fill: var(--primary-color, #0f5fb2);
    font: 600 14px 'Roboto', system-ui, sans-serif;
}

.palette-drop-preview-ghost .palette-preview-sub {
    fill: #64748b;
    font: 400 12px 'Roboto', system-ui, sans-serif;
}

.palette-drop-preview-ghost .palette-preview-icon {
    color: var(--secondary-color, #0f5fb2);
}

.palette-drop-preview-ghost .palette-preview-menu-key {
    fill: rgba(15, 95, 178, .12);
    stroke: var(--primary-color, #0f5fb2);
    stroke-width: 2;
    stroke-dasharray: 4 3;
}

.palette-drop-preview-ghost .palette-preview-menu-key-text {
    fill: var(--primary-color, #0f5fb2);
    font: 600 11px 'Roboto', system-ui, sans-serif;
    text-anchor: middle;
    dominant-baseline: central;
}

.palette-drop-preview-ghost .palette-preview-overflow {
    fill: rgba(31, 169, 113, .15);
    stroke: #1fa971;
    stroke-width: 1.5;
    stroke-dasharray: 4 3;
}

.palette-drop-preview-ghost .palette-preview-overflow-text {
    fill: #1fa971;
    font: 600 10px 'Roboto', system-ui, sans-serif;
    text-anchor: middle;
    dominant-baseline: central;
}

.palette-drop-preview-fragment {
    pointer-events: none;
    opacity: .92;
}

.node-main.palette-drop-target-active .node-box {
    stroke: var(--primary-color);
    stroke-width: 3;
    stroke-dasharray: none;
}

.node-main.palette-drop-target-active {
    filter: drop-shadow(0 0 8px rgba(15, 95, 178, .4)) drop-shadow(0 3px 8px rgba(16, 24, 40, .08));
}

.diagram-host.palette-replace-mode .edge {
    opacity: .22;
    transition: opacity .18s ease;
}

.diagram-host.palette-replace-mode g.group:not(.palette-replace-group-active) {
    opacity: .2;
    transition: opacity .18s ease;
}

.diagram-host.palette-replace-mode .node:not(.palette-replace-entity-active) {
    opacity: .28;
    transition: opacity .18s ease;
}

.diagram-host.palette-replace-mode g.group.palette-replace-group-active {
    opacity: 1;
}

.diagram-host.palette-replace-mode .node.palette-replace-entity-active {
    opacity: 1;
}

.diagram-host.palette-replace-mode g.group.palette-replace-group-active .group-box {
    stroke: var(--primary-color, #0f5fb2);
    stroke-width: 3;
    stroke-dasharray: 8 4;
    fill: rgba(15, 95, 178, .07);
    animation: palette-replace-group-pulse 1.4s ease-in-out infinite;
}

@keyframes palette-replace-group-pulse {
    0%, 100% {
        stroke-opacity: 1;
        fill-opacity: .85;
    }
    50% {
        stroke-opacity: .65;
        fill-opacity: 1;
    }
}

.diagram-host.palette-replace-mode .node.palette-replace-entity-active .node-box {
    stroke: var(--primary-color, #0f5fb2);
    stroke-width: 2.5;
}

.node-main.palette-replace-entity-active.palette-drop-target-active .node-box {
    stroke: #c026d3;
    stroke-width: 3.5;
    filter: drop-shadow(0 0 10px rgba(192, 38, 211, .55));
}
