/* ═════════════════════════════════════════════════════════════════════════
   SMALL MARKERS + CLEAR RAIL BUTTONS

   Loaded after every other sheet; self-contained, so removing its one
   <link> reverts both parts.

     1. Every map marker is 18px until it is tapped and its action ring
        opens, when it is 48px; a point active in the Projects view is gold.
     2. The left sidebar's buttons draw no visible border.
   ═════════════════════════════════════════════════════════════════════════ */


/* ═══ 1. MARKERS ARE 18px UNTIL THEIR RING IS OPEN ════════════════════════
   ui_borders_squared.css section 9 pins every marker to one 48px disc with
   width/min/max all !important; the same six properties are restated here
   at 18px. The ring's action buttons are deliberately left out - they are
   controls, not marks, and stay 48px.

   Every marker's wrapper takes its size from the disc, and everything
   hung off a marker (labels, direction line, action ring) is centred on
   the wrapper at top/left 50%, so the small disc stays centred on its
   coordinate with nothing else moving. */
:root {
  --map_marker_size: 18px;
  --map_marker_active_size: 48px;
  /* the app's own highlight gold (the #ffd400 the points list used before
     the monochrome pass) - the one hue kept, because "this is the point
     you have open in the list" has to read at a glance on a busy map */
  --project_active_gold: #ffd400;
}
.custom_marker,
.map_marker,
.search_result_marker,
.custom_marker.user-marker,
.custom_marker.placemark-marker,
.cs_project_marker_circular,
.cs_project_marker_circular.cluster-marker,
.cs_measurement_marker_circular,
.cs_travel_step_marker,
.user_location_scale_wrapper {
  width: var(--map_marker_size) !important;
  min-width: var(--map_marker_size) !important;
  max-width: var(--map_marker_size) !important;
  height: var(--map_marker_size) !important;
  min-height: var(--map_marker_size) !important;
  max-height: var(--map_marker_size) !important;
  transition: width 0.15s ease, height 0.15s ease, min-width 0.15s ease,
    min-height 0.15s ease, max-width 0.15s ease, max-height 0.15s ease;
}

/* ── activated: tapped, with its action buttons open ──
   cs_marker_selected is set when the ring opens and cleared when it
   closes (showMarkerEditDeleteButtons / hideMarkerEditDeleteButtons);
   state_dragging is the ring's own drag mode. The geolocate marker's
   wrapper has to grow with it, or the disc would hang off its corner. */
.custom_marker.cs_marker_selected,
.custom_marker.state_dragging,
.search_result_marker.cs_marker_selected,
.search_result_marker.state_dragging,
.user_location_scale_wrapper:has(> .custom_marker.cs_marker_selected),
.user_location_scale_wrapper:has(> .custom_marker.state_dragging) {
  width: var(--map_marker_active_size) !important;
  min-width: var(--map_marker_active_size) !important;
  max-width: var(--map_marker_active_size) !important;
  height: var(--map_marker_active_size) !important;
  min-height: var(--map_marker_active_size) !important;
  max-height: var(--map_marker_active_size) !important;
}

/* ── the glyph shrinks with the disc ──
   An 18px disc inside a 1px ring leaves 16px, so icons and step numbers
   drop to 10px rather than disappearing - a numbered route still reads as
   1, 2, 3. An activated marker is back at full size and full glyph. */
:is(.custom_marker, .map_marker, .search_result_marker,
    .cs_project_marker_circular):not(.cs_marker_selected, .state_dragging) > i {
  font-size: 10px !important;
}
:is(.custom_marker, .map_marker, .search_result_marker,
    .cs_project_marker_circular):not(.cs_marker_selected, .state_dragging) > svg,
.custom_marker.user-marker:not(.cs_marker_selected) .user_location_marker_triangle_svg {
  width: 10px !important;
  height: 10px !important;
}
.custom_marker.user-marker:not(.cs_marker_selected)::before {
  width: 8px !important;
  height: 8px !important;
}
.cs_travel_step_marker,
.cs_measurement_marker_circular {
  font-size: 10px !important;
}
.cs_travel_step_marker {
  border-width: 1px !important;
}
/* the cluster count chip rides the marker - never bigger than the disc */
.cs_project_marker_circular.cluster-marker .cluster-count {
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  font-size: 9px !important;
}

/* ── gold: the point that is active in the Projects view ──
   A point's preview square in Layers > Project > Points is "active" while
   it is open in the list (cs_marker_project_active, set by
   syncProjectPointSelectionToMap) or ticked in select mode
   (cs_marker_project_selected). The preview and the marker it stands for
   both turn gold - and only while the Layers panel is actually open, so a
   point left open in a closed panel doesn't stay lit on the map. */
body:has(#layers-panel.active) :is(.custom_marker, .map_marker, .search_result_marker,
    .cs_project_marker_circular):is(.cs_marker_project_active, .cs_marker_project_selected) {
  background: var(--project_active_gold) !important;
  background-color: var(--project_active_gold) !important;
  border-color: var(--project_active_gold) !important;
  color: #000000 !important;
}
body:has(#layers-panel.active) :is(.custom_marker, .map_marker, .search_result_marker,
    .cs_project_marker_circular):is(.cs_marker_project_active, .cs_marker_project_selected) > i {
  color: #000000 !important;
}
.cs_points_square.state_selected,
.cs_points_square.state_active,
.cs_points_expanded_item .feature-icon {
  background: var(--project_active_gold) !important;
  background-color: var(--project_active_gold) !important;
  border-color: var(--project_active_gold) !important;
  color: #000000 !important;
}
.cs_points_square.state_selected *,
.cs_points_square.state_active *,
.cs_points_expanded_item .feature-icon i {
  color: #000000 !important;
}


/* ═══ 2. LEFT SIDEBAR BUTTONS: CLEAR BORDERS ═══════════════════════════════
   Transparent rather than removed: the 1px stays in the box model, so no
   button moves or changes size - the lines just stop being drawn. The
   sidebar's own outer edge is not a button and keeps its line.

   Three IDs deep because ui_borders_squared.css and ui_seamless_mono.css
   paint these borders from doubled-ID !important selectors
   (#left_nav_sidebar#left_nav_sidebar ...), which a single-ID rule could
   not outrank whatever its source order. */
#left_nav_sidebar#left_nav_sidebar#left_nav_sidebar :is(
    .control_button,
    .nav_div,
    .nav_undo_redo_btn,
    .cs_navbar_scroll_button,
    .nav-scroll-btn,
    .mini_zoom_btn,
    .nav-group > *
  ) {
  border-color: transparent !important;
}
