/* Marker Boxes presentation only; existing row IDs and map callbacks are retained. */
#mapSidebar #locationMarkers { background-position: right 8px center, 12px center !important; background-size: 27px, 30px; padding-left: 48px; padding-right: 37px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mapSidebar #markerControls { padding: 10px; color: #252525; font: 13px/1.4 Arial, sans-serif; }
#markerControls *, #markerControls *::before, #markerControls *::after { box-sizing: border-box; }
#markerControls [hidden], #markerControls .selImageBtn, #markerControls .selTxtBtn { display: none !important; }
#markerControls .mb-group { margin: 8px 0 0; padding: 8px 0 0; border: 0; border-top: 1px solid #d7d7d7; }
#mapSidebar #markerControls h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 7px; padding: 0; color: #252525; font: 600 14px/20px Arial, sans-serif; }
#markerControls img { width: 20px; height: 20px; flex: 0 0 20px; pointer-events: none; }
#mapSidebar #markerControls label { display: block; float: none; width: auto; margin: 0; padding: 0; font: 13px/18px Arial, sans-serif; }
#mapSidebar #markerControls .mb-check { display: flex; align-items: center; gap: 6px; cursor: pointer; }
#markerControls input[type="checkbox"], #markerControls input[type="radio"] { flex: 0 0 16px; width: 16px; height: 16px; margin: 0; padding: 0 !important; accent-color: #4787c6; cursor: pointer; }
#markerControls .mb-heading-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 3px 5px; margin-bottom: 6px; }
#mapSidebar #markerControls .mb-heading-row h3 { margin: 0; }
#markerControls .mb-count { display: block; color: #62675f; font: 12px/17px Arial, sans-serif; }
#markerControls p.mb-hint { margin: 4px 0; padding: 0; color: #62675f; font: 12px/16px Arial, sans-serif; }
#markerControls #mbMarkerRows { max-height: 174px; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding: 2px; margin: -2px; }
#markerControls #mbMarkerRows:empty { display: none; }
#markerControls .mb-marker-row { display: grid; grid-template-columns: 16px minmax(0,1fr) 28px; gap: 5px; align-items: center; margin: 0 0 5px; }
#markerControls .mb-marker-row:last-child { margin-bottom: 0; }
#markerControls .mb-marker-row .markerText { grid-column: 2; grid-row: 1; display: block; float: none; width: 100%; min-width: 0; height: 30px; margin: 0; padding: 4px 5px !important; border: 1px solid #aaa; border-radius: 3px; background: #fff; color: #252525; font: 13px/18px Arial, sans-serif; }
#markerControls .mb-marker-row .addMarkerToMap { grid-column: 1; grid-row: 1; display: block; }
#markerControls .mb-marker-row .markerText:focus { margin: 0; border: 1px solid #4787c6; }
#markerControls .mb-marker-row[data-selected="true"] .markerText { border-color: #6f9c50; background-color: #f5faf1; }
#markerControls button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; float: none; width: auto; min-width: 0; height: auto; min-height: 30px; margin: 0; padding: 4px 7px !important; border: 1px solid #aaa; border-radius: 3px; background: #f2f2f2; color: #252525; font: 13px/18px Arial, sans-serif; cursor: pointer; text-decoration: none; }
#markerControls button:hover { background-color: #e8eee2; border-color: #78975f; }
#markerControls .mb-marker-row .deleteMarker { grid-column: 3; grid-row: 1; width: 28px; height: 30px; padding: 5px !important; border: 1px solid transparent; background: transparent; color: #c6372a; }
#markerControls .mb-marker-row .deleteMarker:hover { background: #fff0ed; border-color: #d69b94; }
#markerControls .deleteMarker img { width: 17px; height: 18px; flex-basis: 17px; }
#markerControls #addMarker, #markerControls #markerImportLinkActive2 { display: flex; width: 100%; min-height: 34px; margin-top: 8px; background: #099d22; border-color: #078319; color: #fff; font-weight: 600; }
#markerControls #addMarker:hover, #markerControls #markerImportLinkActive2:hover { background: #07851d; }
#markerControls .mb-plus { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; border-radius: 50%; background: #fff; color: #099d22; font: bold 19px/17px Arial, sans-serif; }
#mapSidebar #markerControls .mb-place { margin-top: 8px; }
#markerControls #mbPlaceHint { margin-left: 22px; }
#markerControls .mb-colour-row { display: grid; grid-template-columns: minmax(82px,1fr) minmax(0,65px) 28px; gap: 6px; align-items: center; margin-top: 6px; }
#markerControls .mb-colour-name { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font: 12px/18px Arial, sans-serif; }
#markerControls #markerTextColour, #markerControls #markerCalloutColour { width: 28px; min-height: 28px; height: 28px; margin: 0; padding: 2px !important; border: 1px solid #999; background: var(--mb-colour, #000) !important; box-shadow: inset 0 0 0 2px #fff; }
#markerControls .mb-slider { display: grid; grid-template-columns: 58px minmax(0,1fr) 32px; gap: 5px; align-items: center; margin-top: 7px; }
#markerControls .mb-slider input { width: 100%; min-width: 0; height: 24px; margin: 0; padding: 0 !important; }
#markerControls output { padding: 3px 1px; border: 1px solid #c6c6c6; border-radius: 3px; background: #fafafa; text-align: center; font: 12px/18px Arial, sans-serif; }
#markerControls .mb-disclosure { margin: 8px 0 0; border: 1px solid #c7c7c7; border-radius: 3px; overflow: hidden; }
#markerControls summary { display: flex; align-items: center; gap: 5px; min-height: 33px; padding: 5px 6px; background: #f6f6f6; color: #252525; font: 13px/18px Arial, sans-serif; list-style: none; cursor: pointer; }
#markerControls summary:hover { background: #edf2e8; }
#markerControls summary::-webkit-details-marker { display: none; }
#markerControls summary span { flex: 1; min-width: 0; }
#markerControls summary img { width: 17px; height: 17px; flex-basis: 17px; }
#markerControls summary::after { content: ''; flex: 0 0 7px; width: 7px; height: 7px; margin: 0 3px 0 auto; border-right: 2px solid #666; border-bottom: 2px solid #666; transform: rotate(-45deg); }
#markerControls details[open] summary { border-bottom: 1px solid #d7d7d7; }
#markerControls details[open] summary::after { transform: rotate(45deg); }
#markerControls .mb-detail-body { padding: 7px; }
#markerControls .mb-detail-body > :first-child { margin-top: 0; }
#markerControls .mb-select-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 6px; align-items: center; margin: 7px 0; }
#markerControls select { width: 100%; min-width: 0; height: 29px; margin: 0; padding: 3px 4px; border: 1px solid #aaa; border-radius: 3px; background: #fff; color: #252525; font: 13px Arial, sans-serif; }
#markerControls .mb-import-columns { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7px; }
#markerControls textarea { display: block; float: none; width: 100%; min-width: 0; max-width: 100%; height: 105px; margin: 3px 0 0; padding: 5px; border: 1px solid #aaa; border-radius: 3px; background: #fff; color: #252525; font: 13px/18px Arial, sans-serif; resize: vertical; overflow: auto; }
#markerControls #advancedMarkerImportLinkActive2 { display: flex; width: 100%; margin-top: 6px; background-image: none; }
#markerControls .mb-footer { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 9px; padding-top: 8px; border-top: 1px solid #d7d7d7; }
#markerControls #deleteAllMarkers { flex: 1; background-image: none; opacity: 1; }
#markerControls #deleteAllMarkers img { width: 15px; height: 18px; flex-basis: 15px; }
#markerControls .iconLink { position: static; display: block; flex: 0 0 28px; width: 28px; height: 28px; padding: 3px; }
#markerControls .iconLink img { width: 100%; height: 100%; }
#markerControls input:focus-visible, #markerControls textarea:focus-visible, #markerControls button:focus-visible, #markerControls select:focus-visible, #markerControls summary:focus-visible, #markerControls a:focus-visible { outline: 2px solid #426ab0; outline-offset: 1px; }
