* {
    user-select: none;
    -webkit-tap-highlight-color: transparent;
  }

      .unitToggler {
        margin: 0 10px
      }
  
      .switch-container {
      position: relative;
      width: 65px;
      height: 30px;
      background-color: #f3d4d3;
      border-radius: 20px;
      cursor: pointer;
      overflow: hidden;
      user-select: none;
      transition: background-color 0.3s ease;
    }

    .switch-labels {
      position: absolute;
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 4px 0 10px;
      font-size: 12px;
      font-weight: bold;
      z-index: 1;
      color: #333;
    }

    .switch-slider {
      position: absolute;
      top: 2px;
      left: 2px;
      width: 35px;
      height: 26px;
      border-radius: 13px;
      background-color: #f44336;
      transition: left 0.3s ease, background-color 0.3s ease;
      z-index: 2;
    }

    /* Checked state */
    input[type="checkbox"]:checked + .switch-container .switch-slider {
      left: 28px;
      background-color: #03a9f4;
    }

    .unit-toggle {
      display: none;
    }

    input[type="checkbox"]:checked + .switch-container { 
      background-color: #d3eaf5; 
    }



    .centeredUnitToggler {
    display:flex;
    justify-content: center;
    margin-bottom: 10px;
}