.custom-radio-one {
          appearance: none;
          border: 2px solid red;
          border-radius: 50%;
          width: 20px;
          height: 20px;
          cursor: pointer;
          position: relative;
        }
        .custom-radio-one:checked {
          border-color: orange;
        }
        .custom-radio-one:checked::after {
            content: "";
            position: absolute;
            top: -2px;
            left: -2px;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            background-color: orange;
        }

        .custom-radio-one:checked .custom-radio-one {
            border: 2px solid orange
        }

        .custom-radio-hidden {
          display: none !important;
          appearance: none;
        }
        .custom-radio-label {
          position: relative;
          padding-left: 30px;
          display: inline-block;
          cursor: pointer;
        }
        .triangle {
          position: absolute;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          width: 0;
          height: 0;
          border-left: 12px solid transparent;
          border-right: 12px solid transparent;
          border-bottom: 18px solid orange;
        }
        .triangle::after {
          content: "";
          position: absolute;
          top: 2px;
          left: -10px;
          width: 0;
          height: 0;
          border-left: 10px solid transparent;
          border-right: 10px solid transparent;
          border-bottom: 14px solid white;
        }
        .custom-radio-hidden:checked + .custom-radio-label .triangle::after {
          border-bottom-color: green;
        }
        .custom-radio-hidden:checked + .custom-radio-label .triangle {
            border-bottom: 18px solid #FFF;
        }


        .custom-checkbox-new {
            position: absolute;
            opacity: 0;
            pointer-events: none;
        }
        .custom-checkbox-label {
            position: relative;
            padding-left: 30px;
            cursor: pointer;
            user-select: none;
        }
        .custom-checkbox-label::before {
            content: "";
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 20px;
            height: 20px;
            border: 2px solid green;
            background: white;
            box-sizing: border-box;
        }
        .custom-checkbox-new:checked + .custom-checkbox-label::before {
            background: red;
            border-color: red;
        }