/* __OM_CLEAN_COMPARE_V18_CSS__ */


/* ==========================================================
   OLD MAIN COMPARE
   Keep it alive as an engine but never show it.
   ========================================================== */

#omV7CompareButton {
    display: none !important;
}


/* ==========================================================
   NEW MAIN ACTION GROUP
   ========================================================== */

#om-v18-actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-top: 12px;
}


#om-v18-actions
#om-new-area-launch,

#om-v18-compare {
    position: static !important;

    width: auto !important;
    min-width: 138px !important;
    height: 42px !important;

    margin: 0 !important;
    padding: 0 16px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;

    border-radius: 11px !important;

    box-shadow: none !important;
    filter: none !important;

    font-size: 12px !important;
    font-weight: 800 !important;

    cursor: pointer;
}


#om-v18-actions
#om-new-area-launch {
    border:
      1px solid rgba(56,189,248,.50) !important;

    background:
      linear-gradient(
        180deg,
        #1584b4,
        #0c6590
      ) !important;

    color: white !important;
}


#om-v18-compare {
    border:
      1px solid rgba(125,211,252,.32);

    background:
      rgba(10,43,64,.82);

    color:
      #eaf8ff;
}


#om-v18-compare:hover {
    background:
      rgba(14,62,91,.96);
}


/* ==========================================================
   ORIGINAL COMPARE MODAL
   Keep original engine/results.
   ========================================================== */

#omV7CompareModal {
    z-index: 120000 !important;
}


/*
 * Raw analysis button must always remain inside the modal.
 */

#omV7RunCompare {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-width: 220px !important;
    height: 44px !important;

    padding: 0 18px !important;

    border-radius: 11px !important;

    border:
      1px solid rgba(56,189,248,.48) !important;

    background:
      #0c638c !important;

    color:
      white !important;

    font-size: 12px !important;
    font-weight: 800 !important;

    box-shadow: none !important;
}


/* ==========================================================
   PNG/MAP LAYERS
   Collapsed by default.
   ========================================================== */

#omLayerPanel {
    width: 100%;

    margin-top: 4px;

    overflow: hidden;

    border:
      1px solid rgba(125,211,252,.15);

    border-radius: 11px;

    background:
      rgba(4,20,31,.46);
}


#omLayerPanel > summary {
    min-height: 42px;

    padding:
      0 12px;

    box-sizing:
      border-box;

    display:
      flex;

    align-items:
      center;

    justify-content:
      space-between;

    cursor:
      pointer;

    list-style:
      none;

    color:
      #dcecf5;

    font-size:
      11px;

    font-weight:
      800;
}


#omLayerPanel > summary::-webkit-details-marker {
    display: none;
}


#omLayerPanel > summary:hover {
    background:
      rgba(19,84,116,.18);
}


#omLayerPanel:not([open])
#layerButtons {
    display: none !important;
}


#omLayerPanel[open]
#layerButtons {
    display: grid !important;

    grid-template-columns:
      repeat(
        auto-fit,
        minmax(130px,1fr)
      );

    gap:
      6px;

    max-height:
      175px;

    overflow-y:
      auto;

    padding:
      10px;

    border-top:
      1px solid rgba(255,255,255,.06);
}


#omLayerPanel
#layerButtons button {
    min-width: 0 !important;

    width: 100% !important;

    overflow: hidden;

    text-overflow:
      ellipsis;

    white-space:
      nowrap;

    margin:
      0 !important;

    padding:
      7px 8px !important;

    font-size:
      9px !important;

    border-radius:
      7px !important;
}


/* numeric RAW compare colors stay explicit */

#omV7CompareModal .om-v18-positive {
    color:
      #39df8b !important;
}

#omV7CompareModal .om-v18-negative {
    color:
      #ff6565 !important;
}