/* Node styling - these are used as reference for canvas rendering */
:root {
    --node-container-color: #ccc5b9;
    --node-task-color: #252422;
    --node-border-radius: 8px;
    --node-padding: 12px;
    --node-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    --node-selected-border: 3px solid #3498db;
    --tag-bg: rgba(52, 152, 219, 0.2);
    --tag-color: #3498db;
}

/* Visual reference for node structure (not directly rendered) */
.node-structure {
    /* Header */
    --header-height: 40px;
    --header-font-size: 16px;
    --header-font-weight: bold;

    /* Body */
    --body-font-size: 14px;
    --body-line-height: 1.4;
    --body-color: #555;

    /* Tags */
    --tag-height: 24px;
    --tag-padding: 6px 10px;
    --tag-margin: 4px;
    --tag-font-size: 12px;
    --tag-border-radius: 12px;

    /* Dimensions */
    --min-width: 200px;
    --max-width: 400px;
    --min-height: 100px;
}

/* Drop zone highlighting */
.drop-zone-active {
    border: 2px dashed #403d39 !important;
    background: rgba(204, 197, 185, 0.1);
}