/* Design-only HTML controls: never part of the saved/exported SVG. */
#legendDirectEditor {
    position: fixed; left: 0; top: 0; width: 0; height: 0; z-index: 80;
    transform-origin: 0 0; pointer-events: none; overflow: visible;
    font-family: Arial, sans-serif;
}
#legendDirectEditor[hidden] { display: none !important; }
#legendDirectEditor .legend-direct-guide { position: absolute; pointer-events: none; }
#legendDirectEditor .gba-highlight { outline-width: 1.5px !important; outline-offset: 1.5px !important; box-shadow: 0 0 0 3px #ffdc7166 !important; }
#legendDirectEditor .legend-direct-highlight {
    position: absolute; pointer-events: none; border-radius: 2px;
    background: rgba(77, 126, 171, .16); mix-blend-mode: multiply;
}
#legendDirectEditor .legend-direct-highlight[hidden] { display: none; }
#legendDirectEditor button, #legendDirectEditor input {
    position: absolute; box-sizing: border-box; margin: 0; pointer-events: auto;
    font-family: Arial, sans-serif; line-height: 1; min-width: 0; min-height: 0;
}
#legendDirectEditor .legend-direct-add {
    display: flex; align-items: center; justify-content: center; gap: 3px;
    height: 19px; padding: 0 5px; color: #fff; background: #86b949;
    border: .6px solid #719b3d; border-radius: 999px; font-size: 10px; font-weight: bold;
    box-shadow: 0 1.5px 2px #0008, 0 .5px .5px #0005; cursor: pointer; white-space: nowrap;
}
#legendDirectEditor .legend-direct-label { display: block; transform: translateY(.65px); }
#legendDirectEditor .legend-direct-plus { position: relative; flex: 0 0 10px; width: 10px; height: 10px; }
#legendDirectEditor .legend-direct-plus::before,
#legendDirectEditor .legend-direct-plus::after {
    content: ''; position: absolute; background: currentColor;
    width: 9px; height: 1.8px; left: .5px; top: 4.1px;
}
#legendDirectEditor .legend-direct-plus::after { transform: rotate(90deg); }
#legendDirectEditor .legend-direct-add:hover { background: #74a735; }
#legendDirectEditor .legend-direct-delete {
    width: 12px; height: 12px; padding: 0; border: 0; border-radius: 50%;
    background: #e72b19 url('../images/remove-legend-entry.svg') center/100% 100% no-repeat;
    box-shadow: 0 1px 1.5px #0009; cursor: pointer;
}
#legendDirectEditor .legend-direct-delete:hover { filter: brightness(.88); }
#legendDirectEditor button:focus-visible { outline: 1.5px solid #336eae; outline-offset: 1.5px; }
#legendDirectEditor .legend-direct-name {
    border: .7px solid #333; border-radius: 0; background: #fff; color: #111;
    padding: 1px 2px; height: 18px; font-size: 10px; box-shadow: none;
    outline: none; cursor: text;
}
#legendDirectEditor .legend-direct-name:focus { border-color: #333; box-shadow: 0 0 0 .5px #333; }
#legendDirectEditor .legend-direct-heading { font-weight: bold; }
body:has(#legendDirectEditor:not([hidden])) #mapKeyHeadingText { cursor: text; }
@media print { #legendDirectEditor { display: none !important; } }
