/* ================================================
   Map Button Customizer — Edit Mode Styles
   Most shared classes (jiggle, remove badge, drag handle,
   sortable, library, undo toast) are in nav-mode-customizer.css.
   This file only adds map-specific overrides.
   ================================================ */

/* ---- Edit Mode Body Class ---- */
/* Only raise z-index; do NOT override position (containers already have absolute/fixed) */
.map-customizer-edit .nav-map-controls,
.map-customizer-edit .nav-left-controls,
.map-customizer-edit .nav-bottom-right-group {
    z-index: 1050;
}

/* ---- Edit Trigger Button ---- */
.nav-map-edit-btn {
    opacity: 0.5;
    transition: opacity 0.2s, background 0.2s;
}

.nav-map-edit-btn:hover,
.nav-map-edit-btn.nav-map-edit-active {
    opacity: 1;
    background: rgba(52, 199, 89, 0.3) !important;
}

/* ---- Edit trigger (accept) button: fixed position during edit mode ---- */
.map-customizer-edit .nav-map-edit-btn {
    top: auto !important;
    position: fixed !important;
    bottom: calc(var(--safe-bottom, 0px) + 72px);
    right: var(--ios-spacing-lg, 16px);
    z-index: 1060;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    box-shadow: 0 4px 16px rgba(52, 199, 89, 0.4), 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* ---- Hide divider during edit ---- */
/* ---- Hide other service buttons during edit (pet walk, camping, etc.) ---- */
.map-customizer-edit .nav-service-btn:not(.nav-map-edit-btn) {
    display: none !important;
}

.map-customizer-edit .nav-map-controls-divider {
    display: none;
}

/* ---- Hide conditional buttons during edit ---- */
.map-customizer-edit #nav-traffic-filter-btn,
.map-customizer-edit #nav-route-style-btn {
    display: none !important;
}

/* ---- Hide button labels during edit (bottom group) ---- */
.map-customizer-edit .nav-btn-label {
    display: none;
}

/* ---- Hide badges during edit mode ---- */
.map-customizer-edit .nav-reports-count,
.map-customizer-edit .nav-dc-badge {
    display: none;
}

/* ---- Bottom-right group: allow overflow for drag handles ---- */
.map-customizer-edit .nav-bottom-right-group {
    overflow: visible;
}

/* ---- Ensure buttons have relative positioning for badges ---- */
.map-customizer-edit .nav-map-btn,
.map-customizer-edit .nav-camera-group {
    position: relative;
}
/* ---- Keep compound group sub-buttons absolutely positioned ---- */
.map-customizer-edit .nav-camera-group .nav-camera-sub,
.map-customizer-edit .nav-map-style-group .nav-map-style-sub {
    position: absolute !important;
}

/* ---- Ghost placeholder for map buttons ---- */
.map-customizer-edit .nav-btn-ghost {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
}

/* ---- Bottom group ghost: horizontal ---- */
.map-customizer-edit .nav-bottom-right-group .nav-btn-ghost {
    border-radius: 12px;
}

/* ---- Reset button positioning for map context ---- */
.nav-map-customizer-reset {
    position: fixed;
    right: calc(var(--ios-spacing-lg, 16px) + 56px);
    bottom: calc(var(--safe-bottom, 0px) + 76px);
    z-index: 1060;
}

/* ---- Library / backdrop / undo toast inside navigator-app (not nav-mode-overlay) ---- */
.navigator-app > .nav-btn-library,
.navigator-app > .nav-btn-library-backdrop,
.navigator-app > .nav-btn-undo-toast {
    pointer-events: auto;
}

/* ---- Add button sizing for map context ---- */
.map-customizer-edit .nav-map-controls .nav-btn-add-trigger,
.map-customizer-edit .nav-left-controls .nav-btn-add-trigger {
    width: 44px;
    height: 44px;
}

.map-customizer-edit .nav-bottom-right-group .nav-btn-add-trigger {
    width: 44px;
    height: 44px;
    border-radius: 12px;
}

/* ---- Drag handle positioning for horizontal bottom group ---- */
.map-customizer-edit .nav-bottom-right-group .nav-btn-drag-handle {
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
}

/* ---- Map controls (right) drag handle: same positioning ---- */
.map-customizer-edit .nav-map-controls .nav-btn-drag-handle,
.map-customizer-edit .nav-left-controls .nav-btn-drag-handle {
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
}

/* ---- Disable pointer events on map during edit (prevent accidental panning) ---- */
.map-customizer-edit .navigator-map-container {
    pointer-events: none;
}

/* ---- Route-ready: shift accept + reset buttons above floating summary ---- */
.nav-state-route-ready .map-customizer-edit .nav-map-edit-btn {
    top: auto !important;
    bottom: calc(var(--safe-bottom, 0px) + 200px);
}
.nav-state-route-ready .nav-map-customizer-reset {
    bottom: calc(var(--safe-bottom, 0px) + 204px);
}

/* ---- Ensure search panel stays below edit overlay ---- */
.map-customizer-edit .nav-search-panel {
    z-index: 1040;
}

/* ---- Compound groups: drag handles and badges must not displace toggle buttons ---- */
.map-customizer-edit .nav-camera-group .nav-btn-drag-handle,
.map-customizer-edit .nav-map-style-group .nav-btn-drag-handle {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}
.map-customizer-edit .nav-camera-group .nav-btn-remove-badge,
.map-customizer-edit .nav-map-style-group .nav-btn-remove-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    z-index: 10;
}